徐总多门店
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

1084 lines
133 KiB

2 months ago
<template>
<!-- 我的等级 -->
<view>
<view class="member-center">
<!-- #ifdef MP -->
<NavBar titleText="会员中心" :iconColor="iconColor" :textColor="iconColor" :isScrolling="isScrolling" showBack></NavBar>
<!-- #endif -->
<image v-show="currentIndex == index" v-for="(item, index) in VipList" :src="item.image" mode="aspectFill" class="headerBg"></image>
<view class="header">
<swiper class="swiper" :current="currentIndex" previous-margin="48rpx" next-margin="48rpx" @change="swiperChange">
<swiper-item v-for="(item, index) in VipList" :key="item.id">
<view class="swiper-item" :class="{ on: currentIndex == index }" :style="[gradeStyle(item)]">
<view v-if="item.grade === levelInfo.grade" class="current">
<view class="background" :style="{ backgroundColor: item.color }"></view>
<view class="inner acea-row row-center-wrapper">当前等级</view>
</view>
<view class="level acea-row row-middle">
<text class="iconfont icon-ic_crown1"></text>{{item.name}}
</view>
<view class="discount">商城购物可享<text class="number">{{parseFloat(item.discount)/10}}</text></view>
<view class="grow-wrap acea-row row-between-wrapper">
<view v-if="levelInfo.grade == VipList[VipList.length - 1].grade">您已经是最高等级</view>
<view v-else class="grow acea-row row-middle"><text class="number">{{levelInfo.exp}}</text>成长值 还差<text class="number">{{item.next_exp_num}}</text></view>
<navigator class="record acea-row row-middle" url="/pages/users/user_vip_areer/index" hover-class="none">
我的成长值记录<text class="iconfont icon-ic_rightarrow"></text>
</navigator>
</view>
<view class="progress">
<view :style="[progressValue(item, index)]" class="inner"></view>
</view>
</view>
</swiper-item>
</swiper>
<view class="steps acea-row row-center-wrapper">
<view v-for="(item, index) in VipList" :key="item.id" :class="{ success: currentIndex == index }" class="item">
<view class="head">
<view class="line"></view>
<view class="icon acea-row row-center-wrapper">
<view class="inner"></view>
</view>
</view>
<view class="main">{{ item.name }}</view>
</view>
</view>
<!-- 4项会员特权 -->
<view class="privilege-section">
<view class="section-hd">会员特权</view>
<view class="section-bd acea-row">
<view class="item">
<view class="image-wrap acea-row row-center-wrapper">
<image class="image" :src="imgHost+'/statics/images/userVip1.png'"></image>
</view>
<view>购物折扣</view>
</view>
<view class="item">
<view class="image-wrap acea-row row-center-wrapper">
<image class="image" :src="imgHost+'/statics/images/userVip2.png'"></image>
</view>
<view>专属徽章</view>
</view>
<view class="item">
<view class="image-wrap acea-row row-center-wrapper">
<image class="image" :src="imgHost+'/statics/images/userVip3.png'"></image>
</view>
<view>经验累积</view>
</view>
<view class="item">
<view class="image-wrap acea-row row-center-wrapper">
<image class="image" :src="imgHost+'/statics/images/userVip4.png'"></image>
</view>
<view>尊享客服</view>
</view>
</view>
</view>
</view>
<view class="skill-wrapper">
<view class="skill-section">
<view class="section-hd">快速升级技巧</view>
<view class="section-bd">
<view class="item acea-row row-middle">
<view class="image-wrap acea-row row-center-wrapper">
<image :src="imgHost+'/statics/images/user-vip-qd.png'" class="image"></image>
</view>
<view class="text">
<view class="title">签到<text class="mark">可获得{{taskInfo.sign || 0}}点经验</text></view>
<view class="info">每日签到可获得经验值已签到{{taskInfo.sign_count || 0}}</view>
</view>
<navigator class="link acea-row row-middle" url="/pages/users/user_sgin/index" hover-class="none">去签到</navigator>
</view>
<view class="item acea-row row-middle">
<view class="image-wrap acea-row row-center-wrapper">
<image :src="imgHost+'/statics/images/user-vip-gm.png'" class="image"></image>
</view>
<view class="text">
<view class="title">购买商品<text class="mark">+{{taskInfo.order || 0}}点经验/</text></view>
<view class="info">购买商品可获得对应的经验值</view>
</view>
<navigator class="link acea-row row-middle" open-type="switchTab" url="/pages/goods_cate/goods_cate" hover-class="none">去购买</navigator>
</view>
<view class="item acea-row row-middle">
<view class="image-wrap acea-row row-center-wrapper">
<image :src="imgHost+'/statics/images/user-vip-yq.png'" class="image"></image>
</view>
<view class="text">
<view class="title">邀请好友<text class="mark">+{{taskInfo.invite || 0}}点经验/</text></view>
<view class="info">邀请好友注册商城可获得经验值</view>
</view>
<navigator class="link acea-row row-middle" url="/pages/users/user_spread_code/index" hover-class="none">去邀请
</navigator>
</view>
</view>
</view>
<view v-if="hostProduct.length" class="px-20">
<recommend :hostProduct="hostProduct" title="商品推荐"></recommend>
</view>
</view>
<view class='growthValue' :class='growthValue==false?"on":""'>
<view class='pictrue'>
<!-- <image src='../static/value.jpg'></image> -->
<text class='iconfont icon-guanbi3' @click='growthValue'></text>
</view>
<view class='conter'>{{illustrate}}</view>
</view>
<view class='mask' :hidden='growthValue' @click='growthValueClose'></view>
</view>
<!-- #ifdef MP -->
<authorize v-if="isShowAuth" @authColse="authColse" @onLoadFun="onLoadFun"></authorize>
<!-- #endif -->
</view>
</template>
<script>
import {
getUserInfo,
getlevelInfo,
userLevelGrade,
userLevelTask,
userLevelDetection
} from '@/api/user.js';
import {
getProductHot
} from '@/api/store.js';
import {
toLogin
} from '@/libs/login.js';
import {
mapGetters
} from "vuex";
import {
HTTP_REQUEST_URL
} from '@/config/app';
import recommend from '@/components/recommend';
import NavBar from '@/components/NavBar';
export default {
components: {
recommend,
NavBar,
},
data() {
return {
imgHost: HTTP_REQUEST_URL,
reach_count: 0,
VipList: [],
// indicatorDots: false,
// circular: true,
// autoplay: false,
// interval: 3000,
// duration: 500,
currentIndex: 0,
growthValue: true,
task: [], //任务列表
illustrate: '', //任务说明
level_id: 0, //任务id,
hostProduct: [],
grade: 0,
isAuto: false, //没有授权的不会自动授权
isShowAuth: false, //是否隐藏授权
hotScroll: false,
hotPage: 1,
hotLimit: 10,
level_title: '',
level_discount: '',
levelInfo: {},
task_list: [{
real_name: '积分数',
number: 0
},
{
real_name: '消费金额',
number: 0
},
{
real_name: '优惠券',
number: 0
}
],
userInfo: {},
taskInfo: {},
is_open_member: false, //判断是否开启付费会员
// #ifdef MP
iconColor: '#FFFFFF',
isScrolling: false,
// #endif
};
},
computed: {
...mapGetters(['isLogin']),
},
watch: {
VipList: function() {
let that = this;
if (that.VipList.length > 0) {
that.VipList.forEach(function(item, index) {
if (item.is_clear === false) {
// that.swiper.slideTo(index);
that.activeIndex = index;
that.grade = item.grade;
}
});
}
},
isLogin: {
handler: function(newV, oldV) {
if (newV) {
// #ifdef H5 || APP-PLUS
this.setLeveLComplete();
// #endif
}
},
deep: true
}
},
onLoad() {
this.get_host_product();
if (this.isLogin) {
this.setLeveLComplete();
this.getlevelInfo();
this.getUserInfo();
} else {
toLogin()
}
let that = this;
setTimeout(function() {
that.loading = true
}, 500)
},
onShow() {
uni.removeStorageSync('form_type_cart');
},
onPageScroll(e) {
uni.$emit('scroll');
// #ifdef MP
if (e.scrollTop > 50) {
this.iconColor = '#333333';
this.isScrolling = true;
} else if (e.scrollTop < 50) {
this.iconColor = '#FFFFFF';
this.isScrolling = false;
}
// #endif
},
methods: {
gradeStyle(item) {
return {
'background-image': `url("${item.icon}")`,
'color': item.color,
};
},
progressValue(item, index) {
let width = 100;
if (this.levelInfo.grade == item.grade && this.VipList[index + 1]) {
width = this.levelInfo.exp / this.VipList[index + 1].exp_num * 100
}
return {
'width': `${width}%`,
'background-color': item.color,
};
},
getUserInfo: function() {
getUserInfo().then(res => {
this.is_open_member = res.data.is_open_member;
this.task_list = [{
real_name: '积分数',
number: res.data.integral
},
{
real_name: '消费金额',
number: res.data.orderStatusSum
},
{
real_name: '优惠券',
number: res.data.couponCount
}
];
});
},
getlevelInfo: function() {
getlevelInfo().then(res => {
const {
level_info,
level_list,
task,
user
} = res.data;
this.levelInfo = level_info;
this.VipList = level_list;
this.userInfo = user;
this.taskInfo = task;
this.levelInfo.exp = parseFloat(this.levelInfo.exp);
this.levelInfo.rate = Math.floor(this.levelInfo.exp / this.levelInfo.exp_num * 100);
if (this.levelInfo.rate > 100) {
this.levelInfo.rate = 100;
}
const index = level_list.findIndex(({
grade
}) => grade === level_info.grade);
if (index !== -1) {
this.currentIndex = index;
}
});
},
onLoadFun() {
this.setLeveLComplete();
this.getlevelInfo();
this.getUserInfo();
this.isShowAuth = false;
},
// 授权关闭
authColse: function(e) {
this.isShowAuth = e
},
/**
* 获取我的推荐
*/
get_host_product: function() {
let that = this;
if (that.hotScroll) return
getProductHot(
that.hotPage,
that.hotLimit,
).then(res => {
that.hotPage++
that.hotScroll = res.data.length < that.hotLimit
that.hostProduct = that.hostProduct.concat(res.data)
});
},
/**
* 会员切换
*
*/
swiperChange(e) {
let index = e.detail.current;
this.currentIndex = index;
this.level_id = this.VipList[index].id || 0;
this.level_title = this.VipList[index].name || '';
this.level_discount = this.VipList[index].discount || '';
// this.grade = this.VipList[index].grade
// this.getTask();
},
/**
* 关闭说明
*/
growthValueClose: function() {
this.growthValue = true;
},
/**
* 打开说明
*/
opHelp: function(index) {
this.growthValue = false;
this.illustrate = this.task[index].illustrate;
},
/**
* 设置会员
*/
setLeveLComplete: function() {
let that = this;
userLevelDetection().then(res => {
// that.getVipList();
});
},
/**
* 获取会员等级
*
*/
getVipList: function() {
let that = this;
userLevelGrade().then(res => {
that.$set(that, 'VipList', res.data.list);
that.task = res.data.task.task;
that.reach_count = res.data.task.reach_count;
that.level_id = res.data.list.length && res.data.list[0] ? res.data.list[0].id : 0;
that.level_title = res.data.list.length && res.data.list[0] ? res.data.list[0].name : '';
that.level_discount = res.data.list.length && res.data.list[0] ? res.data.list[0].discount : '';
// let arr = [];
// res.data.list.forEach(function(item, index) {
// if (item.is_clear == false) {
// arr.push(item.grade);
// }
// })
// that.grade = arr[0] || 0;
// that.grade = res.data.list[0].grade
});
},
/**
* 获取任务要求
*/
getTask: function() {
let that = this;
userLevelTask(that.level_id).then(res => {
that.task = res.data.task;
that.reach_count = res.data.reach_count;
});
}
},
onReachBottom() {
this.get_host_product();
}
}
</script>
<style lang="scss" scoped>
.swiper {
height: 299rpx;
.swiper-item {
position: relative;
height: 100%;
padding: 42rpx 48rpx 36rpx;
border-radius: 40rpx;
background: center/100% 100% no-repeat;
transform: scale(0.9);
transition: all 0.2s ease-in 0s;
overflow: hidden;
&.on {
transform: none;
}
.current {
position: absolute;
top: 0;
left: 0;
.background {
width: 158rpx;
height: 38rpx;
border-bottom-right-radius: 38rpx;
background-color: var(--grade-color);
opacity: 0.3;
}
.inner {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
font-weight: 500;
font-size: 20rpx;
}
}
.level {
font-weight: 600;
font-size: 44rpx;
line-height: 62rpx;
.iconfont {
margin-right: 12rpx;
font-size: 48rpx;
}
}
.discount {
font-size: 24rpx;
line-height: 34rpx;
.number {
font-family: Regular;
font-size: 28rpx;
}
}
.progress {
height: 8rpx;
border-radius: 4rpx;
margin-top: 20rpx;
background: rgba(255, 255, 255, 0.4);
.inner {
width: 50%;
height: 8rpx;
border-radius: 4rpx;
background-color: var(--grade-color);
opacity: 0.8;
}
}
}
.grow-wrap {
margin-top: 60rpx;
.grow {
font-size: 24rpx;
line-height: 34rpx;
}
.number {
margin-right: 8rpx;
font-family: SemiBold;
font-size: 32rpx;
&:nth-child(2) {
margin-left: 8rpx;
}
}
.record {
font-size: 22rpx;
.iconfont {
font-size: 24rpx;
}
}
}
.pass {
display: inline-block;
width: 292rpx;
height: 56rpx;
margin-top: 80rpx;
margin-left: 42rpx;
background: url("data:image/png;base64,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") center/100% 100% no-repeat;
font-weight: bold;
font-size: 30rpx;
line-height: 56rpx;
text-align: center;
color: #282828;
}
.lock {
font-weight: bold;
font-size: 30rpx;
color: #282828;
.iconfont {
margin-right: 17rpx;
font-size: 30rpx;
vertical-align: middle;
}
}
}
.privilege-section {
border-radius: 32rpx;
margin: 0 20rpx;
background: rgba(255, 255, 255, 0.05);
.section-hd {
padding: 32rpx 32rpx 0;
font-weight: 500;
font-size: 30rpx;
color: #FFFFFF;
}
.svip {
height: 40rpx;
padding-right: 37rpx;
padding-left: 19rpx;
border-radius: 20rpx;
background: #333333 url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAAAWCAYAAAAinad/AAABS2lUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4KPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxMzggNzkuMTU5ODI0LCAyMDE2LzA5LzE0LTAxOjA5OjAxICAgICAgICAiPgogPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4KICA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIi8+CiA8L3JkZjpSREY+CjwveDp4bXBtZXRhPgo8P3hwYWNrZXQgZW5kPSJyIj8+IEmuOgAAAXBJREFUOI2V1D2L1VAQxvFf1tXSLiAoWFgaxEoR7GyE/QQiIi5Y3C9gYeGyaOEnuNgJIoKFIL4ggqbfRhBZtHLbFQtBLW9yLAzXJJzJXg8MzHlm8s8zOYcUaX/HCusK3uH7uLD94M0yX1sBNMMT1CinGtek1kTMpHbe5ZXU1lJbDnpWhPVBQuAQ1sjETGrmQa2SmlpqSqk50FnO0Tj+ORzA2oVezLSL+UiLotIu6q3Ni2VuzKnRoqikpt66caGEIu29hgp3UfRcn8ex4BbsYL+3/4Q7Rfr6Iro2r7AR1M7iI2w/+rAU17WLCHY00H9jN1eYgh0P9PfIPhTBjuBkAHscvX1dysLO4VBG38PzGJZ3dinovy0YsXPWjLUC1zK9L/E0AkXONnBqpH3BdaRp2NDZYdwf9eziMn5MgTpnA9g9nO7tn2ETPw8Cdc6W/6SruNXln/392OHJTcFuYo63eNg5Ck8thmnP4BdO4Nv/AvrrD9EXFdXXJsRqAAAAAElFTkSuQmCC") calc(100% - 13rpx) center/19rpx 22rpx no-repeat;
font-size: 24rpx;
line-height: 40rpx;
text-align: center;
color: #FFDEB2;
}
.section-bd {
.item {
flex: 0 0 25%;
padding: 40rpx 0 82rpx;
font-size: 24rpx;
line-height: 34rpx;
text-align: center;
color: #FFFFFF;
.image-wrap {
width: 88rpx;
height: 88rpx;
border-radius: 32rpx;
margin: 0 auto 16rpx;
background: rgba(255, 255, 255, 0.05);
}
.image {
width: 48rpx;
height: 48rpx;
}
}
}
}
.skill-wrapper {
position: relative;
border-radius: 40rpx;
margin-top: -56rpx;
background: #F3F4F7;
overflow: hidden;
}
.skill-section {
border-radius: 32rpx;
margin: 24rpx 20rpx 0;
background-color: #FFFFFF;
.section-hd {
padding: 32rpx 32rpx;
font-weight: 500;
font-size: 32rpx;
color: #333333;
}
.section-bd {
padding-bottom: 32rpx;
.item {
padding: 0 26rpx 0 32rpx;
+.item {
margin-top: 44rpx;
}
}
.image {
display: block;
width: 100rpx;
height: 100rpx;
}
.text {
flex: 1;
}
.title {
padding-left: 24rpx;
font-weight: 500;
font-size: 28rpx;
line-height: 40rpx;
color: #333333;
.mark {
padding-left: 8rpx;
font-weight: 400;
font-size: 24rpx;
color: rgba(126, 75, 6, 0.8);
}
}
.info {
padding: 8rpx 0 0 24rpx;
font-size: 22rpx;
color: #999999;
}
.link {
height: 48rpx;
padding: 0 24rpx;
border-radius: 24rpx;
background: linear-gradient(-90deg, #E7B667 0%, #FFEAB5 100%);
font-weight: 500;
font-size: 24rpx;
color: #7E4B06;
}
}
}
.member-center .headerBg {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 990rpx;
}
.member-center .header {
position: relative;
padding: 36rpx 0 10rpx;
color: var(--grade-color);
}
.member-center .header swiper {
position: relative;
}
.member-center .wrapper {
background-color: #fff;
padding-bottom: 16rpx;
margin-bottom: 20rpx;
}
.member-center .wrapper .title {
height: 98rpx;
padding: 0 30rpx;
font-size: 30rpx;
font-weight: bold;
color: #282828;
}
.member-center .wrapper .title .iconfont {
color: #ffae06;
font-weight: normal;
font-size: 40rpx;
margin-right: 12rpx;
vertical-align: -2rpx;
}
.member-center .wrapper .title .num {
font-size: 28rpx;
color: #999;
}
.member-center .wrapper .title .num .current {
color: #ffae06;
}
.member-center .wrapper .list .item {
width: 690rpx;
height: 184rpx;
background-color: #f9f9f9;
margin: 0 auto 20rpx auto;
padding: 27rpx 0 22rpx 0;
border-radius: 12rpx;
box-sizing: border-box;
}
.member-center .wrapper .list .item .top {
padding-right: 27rpx;
font-size: 26rpx;
color: #999;
}
.member-center .wrapper .list .item .top .name {
border-left: 6rpx solid #ffae06;
padding-left: 20rpx;
font-size: 28rpx;
color: #282828;
font-weight: bold;
}
.member-center .wrapper .list .item .top .name .iconfont {
color: #999;
font-size: 30rpx;
vertical-align: -2rpx;
margin-left: 10rpx;
}
.member-center .wrapper .list .item .cu-progress {
overflow: hidden;
height: 12rpx;
background-color: #eee;
width: 636rpx;
border-radius: 20rpx;
margin: 35rpx auto 0 auto;
}
.member-center .wrapper .list .item .cu-progress .bg-red {
width: 0;
height: 100%;
transition: width 0.6s ease;
background-color: #ffaa29;
border-radius: 20rpx;
}
.member-center .wrapper .list .item .experience {
margin-top: 17rpx;
padding: 0 27rpx;
font-size: 24rpx;
color: #999;
}
.member-center .wrapper .list .item .experience .num {
color: #ffad07;
}
.member-center .growthValue {
background-color: #fff;
border-radius: 16rpx;
position: fixed;
top: 266rpx;
left: 50%;
width: 560rpx;
height: 740rpx;
margin-left: -280rpx;
z-index: 99;
transform: translate3d(0, -200%, 0);
transition: all .3s cubic-bezier(.25, .5, .5, .9);
}
.member-center .growthValue.on {
transform: translate3d(0, 0, 0);
}
.member-center .growthValue .pictrue {
width: 100%;
height: 257rpx;
position: relative;
}
.member-center .growthValue .pictrue image {
width: 100%;
height: 100%;
border-radius: 16rpx 16rpx 0 0;
}
.member-center .growthValue .conter {
padding: 0 35rpx;
font-size: 30rpx;
color: #333;
margin-top: 58rpx;
line-height: 1.5;
height: 350rpx;
overflow: auto;
}
.member-center .growthValue .pictrue .iconfont {
position: absolute;
font-size: 65rpx;
color: #fff;
top: 775rpx;
left: 50%;
transform: translateX(-50%);
}
.trait {
margin-top: 36rpx;
.trait-hd {
display: flex;
justify-content: center;
align-items: center;
.title {
padding-right: 50rpx;
padding-left: 50rpx;
background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAVCAYAAAAuJkyQAAAArUlEQVRIS2NkIBH8///fmYGBwZ6BgYGXgYGBjYGBgRUJg/gsJIoj65/BSKJ7GP7//99GoaX4HP2UHAd5MzAwmNMohDpIdhCpIUqq+lEHEQqx0RAaeiEELehsoNmYGVrGINMgNjZxUAFIjjg+86Yy/v//vwWLIwhZRitHPgU5CFTQmTIwMPDg8DGtLMfm6dbRXDb0chkhF9NbfjQNEQpxkkNotMVIKEihBSnNWowAKdQpvWIl3VoAAAAASUVORK5CYII=") left center/36rpx 21rpx no-repeat,
url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAVCAYAAAAuJkyQAAAAuElEQVRIS+2WTQoCMQyFv7f154LiBcQ76AVET+NCwYXeRvAE/kUKU+guxtFxFi2U0DblvbyEEJnZApgBQ+AGXIF7Y9M573fvS7+jpC2BJTN7tAD3yJ4lrQJ8SITWwAQY/EChnaRDiFDEuQtfdQESwaiEPLWqQq5CZrYE5sC4aYipL6XGGLXPD/+VOKfcGP8BXgadg7kkQhtgCoxaRvgNhfa1qN2i9hy6fq8p8xTvn0J1YnRy1ruJ8QXLCwkcchd00gAAAABJRU5ErkJggg==") right center/36rpx 21rpx no-repeat, ;
font-size: 28rpx;
color: #FFFFFF;
}
}
.trait-bd {
display: flex;
justify-content: space-between;
align-items: center;
margin: 20rpx 30rpx 0;
.item {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
width: 156rpx;
height: 173rpx;
border-radius: 8rpx;
background-color: rgba(255, 255, 255, 0.06);
font-size: 22rpx;
color: #FFFFFF;
}
.image {
width: 68rpx;
height: 68rpx;
margin-bottom: 13rpx;
background: center/cover no-repeat;
&.image1 {
background-image: url("data:image/png;base64,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
}
&.image2 {
background-image: url("data:image/png;base64,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
}
&.image3 {
background-image: url("data:image/png;base64,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
}
&.image4 {
background-image: url("data:image/png;base64,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
}
}
.text {
color: #FCDB9C;
}
}
}
.module {
padding: 40rpx 30rpx 0 30rpx;
margin-bottom: 20rpx;
background-color: #FFFFFF;
.icons {
width: 5rpx;
height: 30rpx;
margin-right: 8rpx;
background-color: #E6C083;
}
.link {
font-size: 24rpx;
color: #999999;
.iconfont {
margin-left: 6rpx;
font-size: 24rpx;
color: #999999;
}
}
.gainList {
margin-top: 10rpx;
.item {
height: 130rpx;
position: relative;
.picTxt {
.pictrue {
width: 70rpx;
height: 70rpx;
border-radius: 50%;
background: url("data:image/png;base64,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
text-align: center;
line-height: 70rpx;
color: #fff;
&.on {
background-image: url("data:image/png;base64,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
}
&.on2 {
background-image: url("data:image/png;base64,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
}
}
.text {
margin-left: 30rpx;
width: 400rpx;
.name {
font-size: 30rpx;
color: #282828;
}
.info {
font-size: 24rpx;
color: #999999;
margin-top: 6rpx;
}
}
}
.button {
width: 140rpx;
height: 50rpx;
background: #FCDB9C;
border-radius: 25rpx;
text-align: center;
line-height: 50rpx;
font-size: 26rpx;
color: #8D5306;
}
&~.item {
&::after {
position: absolute;
content: ' ';
width: 720rpx;
height: 1rpx;
background: rgba(245, 245, 245, 1);
top: 0;
left: 0;
}
}
}
}
}
.steps {
padding: 48rpx 0 76rpx;
.item {
position: relative;
margin-right: 106rpx;
&:first-child {
.icon {
// background: rgba(255, 255, 255, 0.2);
}
.inner {
// background: #D8D8D8;
}
}
&:last-child {
margin-right: 0;
.line {
display: none;
}
}
&.success {
position: relative;
.inner {
background: #D8D8D8;
}
.line {
// background: #D8D8D8;
}
.icon {
background: rgba(255, 255, 255, 0.2);
}
+.item {
.icon {
// background: rgba(255, 255, 255, 0.2);
}
.inner {
// background: #D8D8D8;
}
}
}
}
.head {
position: relative;
}
.line {
position: absolute;
top: 50%;
left: 12rpx;
width: 130rpx;
height: 4rpx;
background: rgba(216, 216, 216, 0.1);
transform: translateY(-50%);
}
.icon {
width: 24rpx;
height: 24rpx;
border-radius: 50%;
background: rgba(255, 255, 255, 0);
}
.inner {
width: 12rpx;
height: 12rpx;
border-radius: 50%;
background: rgba(255, 255, 255, 0.3);
}
.main {
position: absolute;
top: 32rpx;
left: 12rpx;
font-size: 20rpx;
line-height: 28rpx;
color: rgba(255, 255, 255, 0.5);
transform: translateX(-50%);
white-space: nowrap;
}
}
</style>