<template>
|
<view class="privilege-wrapper wrapperLayer">
|
<view class="top-fixed" :style="'background:'+(scrollTop>5?'#ffffff':'')">
|
<view class="topbarbox"></view>
|
<view class="nav-container rowCenBet">
|
<view class="back-box rowCen" @tap='back()'>
|
<image v-if="scrollTop<5" class="backicon" src="../../static/images/home/returnWhite.png" mode="aspectFill"></image>
|
<image v-else class="backicon" src="../../static/images/home/return.png" mode="aspectFill"></image>
|
</view>
|
<view class="pageTitle" :style="'color:'+(scrollTop>5?'#000000':'')">
|
权益特权
|
</view>
|
<view class="back-box rowCen">
|
</view>
|
</view>
|
</view>
|
|
<view class="pageContent colCen">
|
<view class="bac-content rowCenEnd">
|
<image class="bac-icon" src="../../static/images/goods/quanyibac.png" mode="aspectFill"></image>
|
</view>
|
<view class="topbarbox"></view>
|
<view class="userbar-content rowCen borderBox">
|
<view class="avatar-box rowStaCen">
|
<image class="avapic" :src="user.avatar" mode=""></image>
|
<view class="level-tip rowCenCen">
|
<view class="bacbox rowCenCen">{{user.level_name}}</view>
|
</view>
|
</view>
|
|
<view class="right-info">
|
<view class="user-name">
|
{{user.nickname}}
|
</view>
|
<image v-if="user.level<2" class="pictips" src="../../static/images/mine/vip6.png" mode=""></image>
|
<image v-if="user.level==2" class="pictips" src="../../static/images/mine/vip7.png" mode=""></image>
|
<image v-if="user.level==3" class="pictips" src="../../static/images/mine/vip8.png" mode=""></image>
|
</view>
|
</view>
|
|
<view class="paddingbox colCen borderBox">
|
<view class="swiper-partner-container borderBox">
|
<swiper class="swiper-content" :current="swiperCurrent"
|
:style="'height:'+(swiperCurrent==0?'505rpx':(swiperCurrent==1?'1015rpx':'1130rpx'))"
|
:indicator-dots="false" :autoplay="false" @change="swiperChange">
|
<swiper-item>
|
<view class="first-box" v-if="swiperCurrent==0">
|
<view class="card-title">
|
{{cardInfoOne.level_name}}尊享权益
|
</view>
|
|
<view class="centerbox-content rowCen">
|
<view class="items-content colCen">
|
<image class="iconpic" src="../../static/images/goods/caifu.png"
|
mode="aspectFill"></image>
|
<view class="tisheng">
|
自购返利100%
|
</view>
|
</view>
|
<view class="items-content colCen">
|
<image class="iconpic" src="../../static/images/goods/quan.png"
|
mode="aspectFill"></image>
|
<view class="tisheng">
|
福利隐藏券
|
</view>
|
</view>
|
<view class="items-content colCen">
|
<image class="iconpic" src="../../static/images/goods/yongjin.png"
|
mode="aspectFill"></image>
|
<view class="tisheng">
|
邀请奖励
|
</view>
|
</view>
|
<view class="items-content colCen">
|
<image class="iconpic" src="../../static/images/goods/daoshi.png"
|
mode="aspectFill"></image>
|
<view class="tisheng">
|
专属导师
|
</view>
|
</view>
|
<view class="items-content colCen">
|
<image class="iconpic" src="../../static/images/goods/jiangli.png"
|
mode="aspectFill"></image>
|
<view class="tisheng">
|
福利活动
|
</view>
|
</view>
|
<view class="items-content colCen">
|
<image class="iconpic" src="../../static/images/goods/gift.png"
|
mode="aspectFill"></image>
|
<view class="tisheng">
|
礼品兑换
|
</view>
|
</view>
|
</view>
|
</view>
|
</swiper-item>
|
|
<swiper-item>
|
<view class="second-content first-box colCen" v-if="swiperCurrent==1">
|
<view class="task-container rowSta">
|
<image class="vipup" src="../../static/images/goods/viplevel.png" mode=""></image>
|
<view class="speed-content colCen">
|
<view class="title">
|
晋升{{cardInfoTwo.level_name}}任务
|
</view>
|
|
<view class="speed-items rowCenBet">
|
<view>
|
<view class="progress-bar">
|
<view class="complete" :style="'width:'+(userFansInfo.user_zscj_num/cardInfoTwo.direct_primary_count)*100+'%'"></view>
|
</view>
|
<view class="numpeople-bar rowCenBet">
|
<view class="left-txt">
|
有效直属初级人数≥{{cardInfoTwo.direct_primary_count}}人
|
</view>
|
<view class="right-num">
|
{{userFansInfo.user_zscj_num}}/{{cardInfoTwo.direct_primary_count}}
|
</view>
|
</view>
|
</view>
|
</view>
|
<view class="speed-items rowCenBet">
|
<view>
|
<view class="progress-bar">
|
<view class="complete" :style="'width:'+(userFansInfo.user_jjcj_num/cardInfoTwo.indirect_primary_count)*100+'%'"></view>
|
</view>
|
<view class="numpeople-bar rowCenBet">
|
<view class="left-txt">
|
有效间接初级人数≥{{cardInfoTwo.indirect_primary_count}}人
|
</view>
|
<view class="right-num">
|
{{userFansInfo.user_jjcj_num}}/{{cardInfoTwo.indirect_primary_count}}
|
</view>
|
</view>
|
</view>
|
</view>
|
<view class="speed-items rowCenBet">
|
<view>
|
<view class="progress-bar">
|
<view class="complete" :style="'width:'+(userFansInfo.user_monthly_commission/cardInfoTwo.own_monthly_commission)*100+'%'"></view>
|
</view>
|
<view class="numpeople-bar rowCenBet">
|
<view class="left-txt">
|
近30天确认收货佣金≥{{cardInfoTwo.own_monthly_commission}}元
|
</view>
|
<view class="right-num">
|
{{userFansInfo.user_monthly_commission}}/{{cardInfoTwo.own_monthly_commission}}
|
</view>
|
</view>
|
</view>
|
</view>
|
</view>
|
</view>
|
|
<view class="card-title" style="margin-top: 20rpx;">
|
升级{{cardInfoTwo.level_name}}尊享权益
|
</view>
|
|
<view class="centerbox-content rowCen">
|
<view class="items-content colCen">
|
<image class="iconpic" src="../../static/images/goods/caifu.png"
|
mode="aspectFill"></image>
|
<view class="tisheng">
|
自购返利116%
|
</view>
|
</view>
|
<view class="items-content colCen">
|
<image class="iconpic" src="../../static/images/goods/quan.png"
|
mode="aspectFill"></image>
|
<view class="tisheng">
|
福利隐藏券
|
</view>
|
</view>
|
<view class="items-content colCen">
|
<image class="iconpic" src="../../static/images/goods/yongjin.png"
|
mode="aspectFill"></image>
|
<view class="tisheng">
|
邀请奖励
|
</view>
|
</view>
|
<view class="items-content colCen">
|
<image class="iconpic" src="../../static/images/goods/daoshi.png"
|
mode="aspectFill"></image>
|
<view class="tisheng">
|
专属导师
|
</view>
|
</view>
|
<view class="items-content colCen">
|
<image class="iconpic" src="../../static/images/goods/jiangli.png"
|
mode="aspectFill"></image>
|
<view class="tisheng">
|
福利活动
|
</view>
|
</view>
|
<view class="items-content colCen">
|
<image class="iconpic" src="../../static/images/goods/gift.png"
|
mode="aspectFill"></image>
|
<view class="tisheng">
|
礼品兑换
|
</view>
|
</view>
|
<view class="items-content colCen">
|
<image class="iconpic" src="../../static/images/goods/tuiguang.png"
|
mode="aspectFill"></image>
|
<view class="tisheng">
|
扶持推广
|
</view>
|
</view>
|
</view>
|
</view>
|
</swiper-item>
|
|
<swiper-item>
|
<view class="second-content first-box colCen" v-if="swiperCurrent==2">
|
<view class="task-container rowSta">
|
<image class="vipup" src="../../static/images/goods/viplevel.png" mode=""></image>
|
<view class="speed-content colCen">
|
<view class="title">
|
晋升{{cardInfoThree.level_name}}任务
|
</view>
|
|
<view class="speed-items rowCenBet">
|
<view>
|
<view class="progress-bar">
|
<view class="complete" :style="'width:'+(userFansInfo.user_zszj_num/cardInfoThree.direct_intermediate_count)*100+'%'"></view>
|
</view>
|
<view class="numpeople-bar rowCenBet">
|
<view class="left-txt">
|
有效直属中级人数≥{{cardInfoThree.direct_intermediate_count}}人
|
</view>
|
<view class="right-num">
|
{{userFansInfo.user_zszj_num}}/{{cardInfoThree.direct_intermediate_count}}
|
</view>
|
</view>
|
</view>
|
</view>
|
<view class="speed-items rowCenBet">
|
<view>
|
<view class="progress-bar">
|
<view class="complete" :style="'width:'+(userFansInfo.user_jjzj_num/cardInfoThree.indirect_intermediate_count)*100+'%'"></view>
|
</view>
|
<view class="numpeople-bar rowCenBet">
|
<view class="left-txt">
|
有效间接中级人数≥{{cardInfoThree.indirect_intermediate_count}}人
|
</view>
|
<view class="right-num">
|
{{userFansInfo.user_jjzj_num}}/{{cardInfoThree.indirect_intermediate_count}}
|
</view>
|
</view>
|
</view>
|
</view>
|
<view class="speed-items rowCenBet">
|
<view>
|
<view class="progress-bar">
|
<view class="complete" :style="'width:'+(userFansInfo.user_monthly_commission/cardInfoTwo.own_monthly_commission)*100+'%'"></view>
|
</view>
|
<view class="numpeople-bar rowCenBet">
|
<view class="left-txt">
|
上月结算佣金
|
</view>
|
<view class="right-num">
|
{{userFansInfo.user_monthly_commission}}/{{cardInfoTwo.own_monthly_commission}}
|
</view>
|
</view>
|
</view>
|
</view>
|
<view class="speed-items rowCenBet">
|
<view>
|
<view class="progress-bar">
|
<view class="complete" :style="'width:'+(userFansInfo.total_commission/cardInfoTwo.accumulated_commission)*100+'%'"></view>
|
</view>
|
<view class="numpeople-bar rowCenBet">
|
<view class="left-txt">
|
累积佣金≥{{cardInfoTwo.accumulated_commission}}
|
</view>
|
<view class="right-num">
|
{{userFansInfo.total_commission}}/{{cardInfoTwo.accumulated_commission}}
|
</view>
|
</view>
|
</view>
|
</view>
|
</view>
|
</view>
|
|
<view class="card-title" style="margin-top: 20rpx;">
|
升级{{cardInfoThree.level_name}}尊享权益
|
</view>
|
|
<view class="centerbox-content rowCen">
|
<view class="items-content colCen">
|
<image class="iconpic" src="../../static/images/goods/caifu.png"
|
mode="aspectFill"></image>
|
<view class="tisheng">
|
自购返利116%
|
</view>
|
</view>
|
<view class="items-content colCen">
|
<image class="iconpic" src="../../static/images/goods/quan.png"
|
mode="aspectFill"></image>
|
<view class="tisheng">
|
福利隐藏券
|
</view>
|
</view>
|
<view class="items-content colCen">
|
<image class="iconpic" src="../../static/images/goods/yongjin.png"
|
mode="aspectFill"></image>
|
<view class="tisheng">
|
邀请奖励
|
</view>
|
</view>
|
<view class="items-content colCen">
|
<image class="iconpic" src="../../static/images/goods/daoshi.png"
|
mode="aspectFill"></image>
|
<view class="tisheng">
|
专属导师
|
</view>
|
</view>
|
<view class="items-content colCen">
|
<image class="iconpic" src="../../static/images/goods/jiangli.png"
|
mode="aspectFill"></image>
|
<view class="tisheng">
|
福利活动
|
</view>
|
</view>
|
<view class="items-content colCen">
|
<image class="iconpic" src="../../static/images/goods/gift.png"
|
mode="aspectFill"></image>
|
<view class="tisheng">
|
礼品兑换
|
</view>
|
</view>
|
<view class="items-content colCen">
|
<image class="iconpic" src="../../static/images/goods/tuiguang.png"
|
mode="aspectFill"></image>
|
<view class="tisheng">
|
扶持推广
|
</view>
|
</view>
|
<view class="items-content colCen">
|
<image class="iconpic" src="../../static/images/goods/huodong.png"
|
mode="aspectFill"></image>
|
<view class="tisheng">
|
线下沙龙
|
</view>
|
</view>
|
</view>
|
</view>
|
</swiper-item>
|
</swiper>
|
|
<view class="dios-content rowCenCen">
|
<view class="swiper-dot" :class="swiperCurrent==0?'swiper-dot-active':''"></view>
|
<view class="swiper-dot center-dot" :class="swiperCurrent==1?'swiper-dot-active':''"></view>
|
<view class="swiper-dot" :class="swiperCurrent==2?'swiper-dot-active':''"></view>
|
</view>
|
</view>
|
</view>
|
|
|
<view class="bottom-table-container colCen borderBox">
|
<view class="box-title rowCenCen">
|
<image class="iconimg" src="../../static/images/goods/lftt.png" mode=""></image>
|
<view class="titletxt">
|
专享权益收益对比
|
</view>
|
<image class="iconimg" src="../../static/images/goods/rtt.png" mode=""></image>
|
</view>
|
|
<view class="table-content rowCen">
|
<view class="first-col colCen">
|
<view class="shili rowCenCen">
|
<view>示例</view>
|
</view>
|
<view class="goods-box colCenCen borderBox">
|
<view>小花自购破壁机一台</view>
|
<view>原价799元</view>
|
<view>券后399元</view>
|
</view>
|
<view class="fans-num colCenCen borderBox">
|
<view>直属粉丝购买奖励</view>
|
</view>
|
<view class="fans-num colCenCen borderBox">
|
<view>间接粉丝购买奖励</view>
|
</view>
|
<view class="fans-num colCenCen borderBox">
|
<view>直属中级购买奖励</view>
|
</view>
|
</view>
|
<view class="second-col colCenSta" v-if="tableInfo.zeroName">
|
<view class="border-area colCenCen">
|
<image style="width: 36rpx;height: 36rpx;margin-bottom: 5rpx;"
|
src="../../static/images/goods/zsblack.png" mode="aspectFill"></image>
|
<view>{{tableInfo.zeroName}}</view>
|
</view>
|
<view class="shouyi colCenCen borderBox">
|
<view>预估收益 ¥{{tableInfo.zeroShouYi}}</view>
|
</view>
|
<view class="shouyi colCenCen borderBox">
|
<view>{{tableInfo.zeroRate}}返佣</view>
|
</view>
|
<view class="trdbx colCenCen">
|
×
|
</view>
|
<view class="trdbx colCenCen">
|
×
|
</view>
|
<view class="trdbx colCenCen">
|
×
|
</view>
|
</view>
|
<view class="second-col colCenSta" :style="'width:'+(tableInfo.zeroName?'127rpx':'169rpx')">
|
<view class="border-area colCenCen">
|
<image style="width: 36rpx;height: 36rpx;margin-bottom: 5rpx;"
|
src="../../static/images/goods/zsblack.png" mode="aspectFill"></image>
|
<view>{{tableInfo.oneName}}</view>
|
</view>
|
<view class="shouyi colCenCen borderBox">
|
<view>预估收益 ¥{{tableInfo.oneShouYi}}</view>
|
</view>
|
<view class="shouyi colCenCen borderBox">
|
<view>{{tableInfo.oneRate}}返佣</view>
|
</view>
|
<view class="trdbx colCenCen iconfont"style="font-size: 28rpx; color: #FFFFFF; font-weight: bold;">
|

|
</view>
|
<view class="trdbx colCenCen iconfont"style="font-size: 28rpx; color: #FFFFFF; font-weight: bold;">
|

|
</view>
|
<view class="trdbx colCenCen iconfont"style="font-size: 28rpx; color: #FFFFFF; font-weight: bold;">
|

|
</view>
|
</view>
|
<view class="second-col colCenSta" :style="'width:'+(tableInfo.zeroName?'127rpx':'169rpx')">
|
<view class="border-area colCenCen">
|
<image style="width: 36rpx;height: 36rpx;margin-bottom: 5rpx;"
|
src="../../static/images/goods/zsblack.png" mode="aspectFill"></image>
|
<view>{{tableInfo.twoName}}</view>
|
</view>
|
<view class="shouyi colCenCen borderBox">
|
<view>预估收益 ¥{{tableInfo.twoShouYi}}</view>
|
</view>
|
<view class="shouyi colCenCen borderBox">
|
<view>{{tableInfo.twoRate}}返佣</view>
|
</view>
|
<view class="trdbx colCenCen">
|
提升{{tableInfo.twoZS}}
|
</view>
|
<view class="trdbx colCenCen">
|
提升{{tableInfo.twoJJ}}
|
</view>
|
<view class="trdbx colCenCen">
|
提升{{tableInfo.twoZJ}}
|
</view>
|
</view>
|
|
<view class="second-col colCen" :style="'width:'+(tableInfo.zeroName?'127rpx':'169rpx')">
|
<view class="border-area colCenCen" style="border-top-right-radius: 20rpx;">
|
<image style="width: 36rpx;height: 36rpx;margin-bottom: 5rpx;"
|
src="../../static/images/goods/zsblack.png" mode="aspectFill"></image>
|
<view>{{tableInfo.threeName}}</view>
|
</view>
|
<view class="shouyi colCenCen borderBox">
|
<view>预估收益 ¥{{tableInfo.threeShouYi}}</view>
|
</view>
|
<view class="shouyi colCenCen borderBox">
|
<view>{{tableInfo.threeRate}}返佣</view>
|
</view>
|
<view class="trdbx colCenCen">
|
提升{{tableInfo.threeZS}}
|
</view>
|
<view class="trdbx colCenCen" style="border-bottom-right-radius: 20rpx;">
|
提升{{tableInfo.threeJJ}}
|
</view>
|
<view class="trdbx colCenCen" style="border-bottom-right-radius: 20rpx;">
|
提升{{tableInfo.threeZJ}}
|
</view>
|
</view>
|
</view>
|
</view>
|
</view>
|
<view style="height: 150rpx; width: 100%;"></view>
|
<view class="levelup-content rowCen borderBox">
|
<view class="bac-btnbox rowCenCen" @tap="levelUp()" v-if="user.level != 3">
|
<view>立即升级</view>
|
</view>
|
<view class="bac-btnbox rowCenCen" @tap="goInviteFriends()" v-else>
|
您已经是最高等级,快去邀请好友赚佣金吧!
|
</view>
|
</view>
|
|
<!-- <u-popup v-model="inviteCodeShow" mode="center" border-radius="32" :mask-close-able='true'>
|
<inviteCodeModel @closeModel='closeinvite' @confirm='nextStep'></inviteCodeModel>
|
</u-popup> -->
|
|
</view>
|
</template>
|
|
<script>
|
import inviteCodeModel from '../../components/inviteCode.vue'
|
export default {
|
components: {
|
inviteCodeModel
|
},
|
data() {
|
return {
|
user: '',
|
swiperCurrent: 0,
|
scrollTop:0,
|
cardInfoOne:"",
|
cardInfoTwo:"",
|
cardInfoThree:"",
|
userFansInfo:"",
|
tableInfo:'',
|
inviteCodeShow:false
|
}
|
},
|
onLoad() {
|
this.user = uni.getStorageSync('userInfo')
|
this.getTopDate()
|
this.getTableDate()
|
},
|
onPageScroll(e) {
|
this.scrollTop = e.scrollTop
|
},
|
methods: {
|
getTopDate(){
|
var that = this;
|
this.$u.api.getUpgradeInfo({}).then(e => {
|
console.log(e);
|
if(e.code != 0) return that.$alert(e.msg)
|
that.cardInfoOne = e.data.list[0];
|
that.cardInfoTwo = e.data.list[1];
|
that.cardInfoThree = e.data.list[2];
|
that.userFansInfo = e.data.info;
|
}).catch(function (err) {
|
})
|
},
|
getTableDate(){
|
var that = this;
|
this.$u.api.getEquityCard({}).then(e => {
|
if(e.code != 0) return that.$alert(e.msg)
|
that.tableInfo = e.data.info;
|
}).catch(function (err) {
|
})
|
},
|
swiperChange(e) {
|
console.log(e);
|
this.swiperCurrent = e.detail.current
|
},
|
levelUp(){
|
var that = this;
|
this.$u.api.levelApply({}).then(e => {
|
that.$alert(e.msg)
|
}).catch(function (err) {
|
})
|
},
|
back(){
|
uni.navigateBack({
|
delta:1
|
})
|
},
|
goInviteFriends() {
|
if (this.user.id) {
|
uni.navigateTo({
|
url: '/pages/mine/inviteFriends'
|
})
|
} else {
|
uni.navigateTo({
|
url: '../login/login'
|
})
|
}
|
|
},
|
}
|
}
|
</script>
|
|
<style lang="scss">
|
.privilege-wrapper {
|
width: 100%;
|
min-height: 100vh;
|
background: #252531;
|
|
.top-fixed {
|
position: fixed;
|
top: 0;
|
left: 0;
|
width: 100%;
|
z-index: 100;
|
transition: all 0.2s;
|
|
.nav-container {
|
width: 100%;
|
height: 90rpx;
|
padding: 0 30rpx;
|
|
.back-box {
|
width: 32rpx;
|
height: 32rpx;
|
|
.backicon {
|
width: 17rpx;
|
height: 32rpx;
|
}
|
}
|
|
.pageTitle {
|
font-size: 36rpx;
|
font-weight: 500;
|
color: #FFFFFF;
|
}
|
}
|
}
|
|
.pageContent {
|
width: 100%;
|
position: relative;
|
|
.bac-content {
|
width: 100%;
|
position: absolute;
|
|
.bac-icon {
|
width: 598rpx;
|
height: 475rpx;
|
}
|
}
|
|
.userbar-content {
|
width: 100%;
|
padding: 0 32rpx;
|
margin-top: 90rpx;
|
z-index: 10;
|
|
.avatar-box {
|
height: 122rpx;
|
position: relative;
|
|
.avapic {
|
width: 100rpx;
|
height: 100rpx;
|
border-radius: 50%;
|
}
|
|
.level-tip {
|
position: absolute;
|
bottom: 0rpx;
|
width: 100%;
|
height: 36rpx;
|
|
.bacbox {
|
white-space: nowrap;
|
height: 36rpx;
|
padding: 0 20rpx;
|
background: linear-gradient(0deg, #F7C394, #EFE0D6);
|
border-radius: 18rpx;
|
font-size: 24rpx;
|
font-weight: 500;
|
color: #613309;
|
}
|
}
|
}
|
|
.right-info {
|
margin-left: 30rpx;
|
|
.user-name {
|
font-size: 32rpx;
|
font-weight: bold;
|
color: #FFFFFF;
|
}
|
|
.pictips {
|
width: 190rpx;
|
height: 46rpx;
|
margin-top: 15rpx;
|
}
|
}
|
}
|
|
.paddingbox {
|
width: 100%;
|
padding: 0 25rpx;
|
margin-top: 60rpx;
|
z-index: 10;
|
|
.swiper-partner-container {
|
width: 100%;
|
background: linear-gradient(90deg, #303145, #44495E);
|
box-shadow: 0px 11rpx 62rpx 0px rgba(21, 21, 34, 0.67);
|
border-radius: 30rpx;
|
overflow: hidden;
|
|
.swiper-content {
|
width: 100%;
|
|
.first-box {
|
width: 100%;
|
|
.card-title {
|
width: 100%;
|
padding: 0 15rpx;
|
font-size: 28rpx;
|
font-weight: 500;
|
color: #FFFFFF;
|
margin-top: 40rpx;
|
}
|
|
.centerbox-content {
|
width: 100%;
|
flex-wrap: wrap;
|
padding: 0 43rpx;
|
|
.items-content {
|
width: 33.3%;
|
margin-top: 40rpx;
|
.iconpic {
|
width: 90rpx;
|
height: 90rpx;
|
}
|
|
.tisheng {
|
font-size: 26rpx;
|
font-weight: 500;
|
color: #F3CF9E;
|
margin-top: 20rpx;
|
}
|
|
.whitetxt {
|
font-size: 22rpx;
|
font-weight: 500;
|
color: #FFFFFF;
|
margin-top: 5rpx;
|
}
|
}
|
}
|
}
|
|
.second-content {
|
width: 100%;
|
padding: 0rpx 14rpx;
|
|
.task-container {
|
width: 100%;
|
margin-top: 40rpx;
|
|
.vipup {
|
width: 58rpx;
|
height: 48rpx;
|
}
|
|
.speed-content {
|
flex: 1;
|
padding-left: 14rpx;
|
|
.title {
|
width: 100%;
|
font-size: 28rpx;
|
font-weight: 500;
|
color: #FFFFFF;
|
}
|
|
.speed-items {
|
width: 100%;
|
margin-bottom: 30rpx;
|
|
.progress-bar {
|
width: 534rpx;
|
height: 10rpx;
|
margin-top: 20rpx;
|
background: #252531;
|
border-radius: 5rpx;
|
position: relative;
|
|
.complete {
|
height: 10rpx;
|
background: linear-gradient(90deg, #F8D9AD, #D6A364);
|
border-radius: 5rpx;
|
position: absolute;
|
left: 0;
|
top: 0;
|
}
|
}
|
|
.numpeople-bar {
|
width: 100%;
|
margin-top: 10rpx;
|
font-size: 22rpx;
|
font-weight: 500;
|
color: #8E929B;
|
}
|
}
|
}
|
}
|
}
|
}
|
|
.dios-content {
|
width: 100%;
|
height: 55rpx;
|
|
.swiper-dot {
|
width: 12rpx;
|
height: 12rpx;
|
border: 1rpx solid #F3CF9E;
|
border-radius: 50%;
|
background-color: transparent;
|
}
|
|
.center-dot {
|
margin: 0 15rpx;
|
}
|
|
.swiper-dot-active {
|
background-color: #F3CF9E;
|
}
|
}
|
}
|
}
|
|
.bottom-table-container {
|
width: 100%;
|
margin-top: 60rpx;
|
padding: 0 26rpx;
|
|
.box-title {
|
width: 100%;
|
|
.iconimg {
|
width: 38rpx;
|
height: 25rpx;
|
}
|
|
.titletxt {
|
font-size: 32rpx;
|
font-weight: 500;
|
color: #F3CF9E;
|
margin: 0 27rpx;
|
}
|
}
|
|
.table-content {
|
width: 100%;
|
border: 1rpx solid #534B49;
|
border-radius: 20rpx;
|
margin-top: 30rpx;
|
|
.first-col {
|
width: 200rpx;
|
height: 100%;
|
|
.shili {
|
width: 100%;
|
height: 80rpx;
|
font-size: 28rpx;
|
font-weight: 500;
|
color: #FFFFFF;
|
border: 1rpx solid #534B49;
|
border-top-left-radius: 20rpx;
|
}
|
|
.goods-box {
|
width: 100%;
|
height: 176rpx;
|
border: 1px solid #534B49;
|
font-size: 22rpx;
|
font-weight: 500;
|
color: #FFFFFF;
|
padding: 0 20rpx;
|
text-align: center;
|
}
|
|
.fans-num {
|
width: 100%;
|
height: 88rpx;
|
border: 1px solid #534B49;
|
padding: 0 20rpx;
|
font-size: 22rpx;
|
font-weight: 500;
|
color: #FFFFFF;
|
border-bottom-left-radius: 20rpx;
|
text-align: center;
|
}
|
}
|
|
.second-col {
|
width: 127rpx;
|
height: 100%;
|
|
.border-area {
|
width: 100%;
|
height: 80rpx;
|
font-size: 23rpx;
|
color: #FFFFFF;
|
border: 1rpx solid #534B49;
|
}
|
|
.shouyi {
|
width: 100%;
|
height: 88rpx;
|
border: 1rpx solid #534B49;
|
font-size: 22rpx;
|
font-weight: 500;
|
color: #FFFFFF;
|
text-align: center;
|
padding: 0 10rpx;
|
}
|
.trdbx{
|
width: 100%;
|
height: 88rpx;
|
border: 1rpx solid #534B49;
|
font-size: 22rpx;
|
font-weight: 500;
|
color: #FFFFFF;
|
}
|
}
|
}
|
}
|
}
|
|
.levelup-content{
|
width: 100%;
|
height: 80rpx;
|
position: fixed;
|
bottom: 20rpx;
|
left: 0;
|
z-index: 200;
|
padding: 0 30rpx;
|
.bac-btnbox{
|
width: 100%;
|
height: 100%;
|
border-radius: 40rpx;
|
background:linear-gradient(top, #fec870 0%,#f4ac58 100%);
|
color:#FFFFFF;
|
font-size: 24rpx;
|
}
|
}
|
}
|
</style>
|