Commit 11667d02 by zhangzhen

内容完善

parent b0408b22
<template> <template>
<view class="tool-box"> <view class="tool-box">
<view class="gitf" @tap="onNavToVip">
<image :src="assetsPath+'/gitf.png'" mode="widthFix"></image>
</view>
<view v-for="(item, index) in toolList" :key="index" class="tool-item" :class="{active:!show}" <view v-for="(item, index) in toolList" :key="index" class="tool-item" :class="{active:!show}"
:style="{transitionDuration: dNum+'s' }" @tap.stop="onHandle(item)"> :style="{transitionDuration: dNum+'s' }" @tap.stop="onHandle(item)">
...@@ -31,6 +34,7 @@ ...@@ -31,6 +34,7 @@
return { return {
show: true, show: true,
dNum: 0.4, dNum: 0.4,
assetsPath:config.assetsPath,
toolList: [{ toolList: [{
name: "验券", name: "验券",
url: config.assetsPath + '/tool_3_v1.png', url: config.assetsPath + '/tool_3_v1.png',
...@@ -87,6 +91,11 @@ ...@@ -87,6 +91,11 @@
}, },
methods: { methods: {
onNavToVip(){
uni.switchTab({
url:"/pages/vipCreate/vipCreate"
})
},
onGetSysConfig() { onGetSysConfig() {
let sysConfigList = uni.getStorageSync('sysConfig') let sysConfigList = uni.getStorageSync('sysConfig')
let s = sysConfigList.find(item=>item.configKey === 'wechat.service.url') let s = sysConfigList.find(item=>item.configKey === 'wechat.service.url')
...@@ -176,8 +185,14 @@ ...@@ -176,8 +185,14 @@
position: fixed; position: fixed;
bottom: 10vh; bottom: 10vh;
right: 0; right: 0;
display: flex;
flex-direction: column;
align-items: flex-end;
z-index: 99; z-index: 99;
.gitf{
width: 144upx;
max-height: 150upx;
}
.tool-item { .tool-item {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
......
...@@ -3,7 +3,7 @@ const CONFIG = { ...@@ -3,7 +3,7 @@ const CONFIG = {
development: { development: {
// assetsPath: 'https://www.coujio.com/wechat_static', // 静态资源路径 // assetsPath: 'https://www.coujio.com/wechat_static', // 静态资源路径
// assetsPath: 'https://coujiao.pseer.com/wechat_static', // 静态资源路径 // assetsPath: 'https://coujiao.pseer.com/wechat_static', // 静态资源路径
assetsPath: 'http://10.24.5.167:8211/static', // 静态资源路径 assetsPath: 'http://10.24.5.63:8211/static', // 静态资源路径
// baseUrl: 'https://www.coujio.com/front-api', // 后台接口请求地址 // baseUrl: 'https://www.coujio.com/front-api', // 后台接口请求地址
// baseUrl: 'https://coujiao.pseer.com/front-api', // 后台接口请求地址 // baseUrl: 'https://coujiao.pseer.com/front-api', // 后台接口请求地址
baseUrl: 'http://129.211.46.84:8883/front-api', baseUrl: 'http://129.211.46.84:8883/front-api',
......
...@@ -183,6 +183,13 @@ ...@@ -183,6 +183,13 @@
"navigationBarTitleText": "充值记录", "navigationBarTitleText": "充值记录",
"enablePullDownRefresh" : false "enablePullDownRefresh" : false
} }
},
{
"path" : "rule/rule",
"style": {
"navigationBarTitleText": "活动规则",
"enablePullDownRefresh" : false
}
} }
] ]
} }
......
<template> <template>
<view class="myInfo"> <view class="myInfo">
<view class="header" :style="{height: statusBarHeight+180+'px',paddingTop: statusBarHeight+'px'}"> <view class="header" :style="{paddingTop: statusBarHeight+'px'}">
<view class="header-content-box"> <view class="header-content-box">
<view class="login-content"> <view class="login-content">
<view class="flex-1 flex-row" @tap="onNavToSetUserInfo"> <view class="flex-1 flex-row" @tap="onNavToSetUserInfo">
...@@ -11,12 +11,25 @@ ...@@ -11,12 +11,25 @@
mode="scaleToFill" @tap.stop="onProview"></image> mode="scaleToFill" @tap.stop="onProview"></image>
</view> </view>
</view> </view>
<view class="flex-col margin-left"> <view class="flex-col margin-left user-info-box">
<text class="text-title text-lg text-bold text-xxl">{{userInfo.nickName||"凑角用户"}}</text> <text class="text-title text-lg text-bold text-xxl">{{userInfo.nickName||"凑角用户"}}</text>
<!-- <view class="flex-row" style="margin-top: 10rpx;"> <view class="flex-row" style="margin-top: 10rpx;">
<text class="cuIcon-hotfill text-white"></text> <view v-if="!userInfo.memberConfig || (userInfo.memberConfig&&userInfo.memberConfig.memberType ==1)" class="relative" :class="!userInfo.memberConfig?'grayscale':''">
<text class="text-white text-lg">会员用户</text> <image class="img-icon" :src="assetsPath+'/tag_icon_1.png'" mode="widthFix"></image>
</view> --> <view class="absolute">
<text class="text-1">充值会员</text>
</view>
</view>
<view v-if="!userInfo.memberConfig || (userInfo.memberConfig&&userInfo.memberConfig.memberType ==2)" class="relative" :class="!userInfo.memberConfig?'grayscale':''">
<image class="img-icon" :src="assetsPath+'/tag_icon_2.png'" mode="widthFix"></image>
<view class="absolute">
<text class="text-1">权益会员</text>
</view>
</view>
</view>
<view v-if="userInfo.memberConfig && userInfo.memberConfig.memberType ==1" class="tip-date">
<text>{{userInfo.consumerMember.expirationDate}}到期</text>
</view>
</view> </view>
<view class="nav-right" @tap.stop="onNavToSetUserInfo"> <view class="nav-right" @tap.stop="onNavToSetUserInfo">
<image class="img" :src="assetsPath+'/setting.png'" mode="scaleToFill"></image> <image class="img" :src="assetsPath+'/setting.png'" mode="scaleToFill"></image>
...@@ -24,6 +37,75 @@ ...@@ -24,6 +37,75 @@
</view> </view>
</view> </view>
<view class="remeber-info-box">
<view class="relative flex-7">
<image v-if="userInfo.memberConfig && userInfo.memberConfig.membershipLevel ===2" class="level-bg" :src="assetsPath+'/user/tongj_bg_1.png'" mode="scaleToFill"></image>
<image v-else-if="userInfo.memberConfig && userInfo.memberConfig.membershipLevel ===3" class="level-bg" :src="assetsPath+'/user/yj_bg_1.png'" mode="scaleToFill"></image>
<image v-else-if="userInfo.memberConfig && userInfo.memberConfig.membershipLevel ===4" class="level-bg" :src="assetsPath+'/user/jj_bg_1.png'" mode="scaleToFill"></image>
<image v-else class="level-bg" :src="assetsPath+'/user/tj_bg_1.png'" mode="scaleToFill"></image>
<view class="absolute level-content">
<view class="part-left">
<view v-if="userInfo.memberConfig && userInfo.memberConfig.membershipLevel ===4" class="level level-4">
<text class="text-1">LV {{userInfo.memberConfig.levelName}}</text>
<!-- <text class="text-2">还差 {{userInfo.memberConfig.nextLimitRequirements - userInfo.consumerWallet.remainingIntegral}} 积分可升级为{{userInfo.memberConfig.nextMembershipName}}</text> -->
<view class="flex-row">
<text class="text-3">当前积分</text>
<text class="text-4">{{userInfo.consumerWallet.remainingIntegral}}</text>
</view>
</view>
<view v-if="userInfo.memberConfig && userInfo.memberConfig.membershipLevel ===3" class="level level-3">
<text class="text-1">LV {{userInfo.memberConfig.levelName}}</text>
<text class="text-2">还差 {{userInfo.memberConfig.nextLimitRequirements - Number(userInfo.consumerWallet.remainingIntegral)}} 积分可升级为{{userInfo.memberConfig.nextMembershipName}}</text>
<view class="flex-row">
<text class="text-3">当前积分</text>
<text class="text-4">{{userInfo.consumerWallet.remainingIntegral}}</text>
</view>
</view>
<view v-if="userInfo.memberConfig && userInfo.memberConfig.membershipLevel ===2" class="level level-2">
<text class="text-1">LV {{userInfo.memberConfig.levelName}}</text>
<text class="text-2">还差 {{userInfo.memberConfig.nextLimitRequirements - Number(userInfo.consumerWallet.remainingIntegral)}} 积分可升级为{{userInfo.memberConfig.nextMembershipName}}</text>
<view class="flex-row">
<text class="text-3">当前积分</text>
<text class="text-4">{{userInfo.consumerWallet.remainingIntegral}}</text>
</view>
</view>
<view v-if="userInfo.memberConfig && userInfo.memberConfig.membershipLevel ===1" class="level level-1">
<text class="text-1">LV {{userInfo.memberConfig.levelName}}</text>
<text class="text-2">还差 {{userInfo.memberConfig.nextLimitRequirements - Number(userInfo.consumerWallet.remainingIntegral)}} 积分可升级为{{userInfo.memberConfig.nextMembershipName}}</text>
<view class="flex-row">
<text class="text-3">当前积分</text>
<text class="text-4">{{userInfo.consumerWallet.remainingIntegral}}</text>
</view>
</view>
<view v-else class="level level-1">
<text class="text-1">LV 0</text>
<text class="text-2">您还不是会员哦,快来加入吧!</text>
</view>
</view>
<view class="part-right">
<image v-if="userInfo.memberConfig && userInfo.memberConfig.membershipLevel ===4" class="tag-icon" :src="assetsPath+'/user/tag_icon_4.png'" mode="widthFix"></image>
<image v-else-if="userInfo.memberConfig && userInfo.memberConfig.membershipLevel ===3" class="tag-icon" :src="assetsPath+'/user/tag_icon_3.png'" mode="widthFix"></image>
<image v-else-if="userInfo.memberConfig && userInfo.memberConfig.membershipLevel ===2" class="tag-icon" :src="assetsPath+'/user/tag_icon_2.png'" mode="widthFix"></image>
<image v-else class="tag-icon" :src="assetsPath+'/user/tag_icon_1.png'" mode="widthFix"></image>
</view>
</view>
</view>
<view v-if="false" class="flex-3">
<text class="text-1">次卡</text>
<text class="text-2">权益会员专享</text>
<view class="flex-row">
<text class="text-3">还剩</text>
<text class="text-4">3</text>
<text class="text-3"></text>
</view>
</view>
</view>
</view> </view>
</view> </view>
</view> </view>
...@@ -169,7 +251,7 @@ ...@@ -169,7 +251,7 @@
<text class="text-gray">联系我们</text> <text class="text-gray">联系我们</text>
</view> </view>
</view> </view>
<view class="item-box" @tap="onNavByPath('cleanManage')"> <view v-if="userInfo.isCleaner" class="item-box" @tap="onNavByPath('cleanManage')">
<view class="icon-img"> <view class="icon-img">
<image :src="assetsPath+'/user/tool_3.png'" mode="scaleToFill"></image> <image :src="assetsPath+'/user/tool_3.png'" mode="scaleToFill"></image>
</view> </view>
...@@ -177,7 +259,7 @@ ...@@ -177,7 +259,7 @@
<text class="text-gray">保洁管理</text> <text class="text-gray">保洁管理</text>
</view> </view>
</view> </view>
<view class="item-box" @tap="onNavByPath('cleanRecord')"> <view v-if="userInfo.isAdmin && !userInfo.isCleaner" class="item-box" @tap="onNavByPath('cleanRecord')">
<view class="icon-img"> <view class="icon-img">
<image :src="assetsPath+'/user/tool_3.png'" mode="scaleToFill"></image> <image :src="assetsPath+'/user/tool_3.png'" mode="scaleToFill"></image>
</view> </view>
...@@ -185,7 +267,7 @@ ...@@ -185,7 +267,7 @@
<text class="text-gray">保洁记录</text> <text class="text-gray">保洁记录</text>
</view> </view>
</view> </view>
<view class="item-box" @tap="onNavByPath('deviceManage')"> <view v-if="userInfo.isAdmin" class="item-box" @tap="onNavByPath('deviceManage')">
<view class="icon-img"> <view class="icon-img">
<image :src="assetsPath+'/user/tool_3.png'" mode="scaleToFill"></image> <image :src="assetsPath+'/user/tool_3.png'" mode="scaleToFill"></image>
</view> </view>
...@@ -482,13 +564,11 @@ ...@@ -482,13 +564,11 @@
.header-content-box { .header-content-box {
display: flex; display: flex;
flex: 1; flex: 1;
padding-top: 40px;
.login-content { .login-content {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
width: 100%; width: 100%;
margin-top: 30upx;
>.flex-row { >.flex-row {
position: relative; position: relative;
align-items: center; align-items: center;
...@@ -519,8 +599,7 @@ ...@@ -519,8 +599,7 @@
align-items: center; align-items: center;
position: absolute; position: absolute;
right: 5vw; right: 5vw;
margin-bottom: 60upx;
// margin-top: 20upx;
.img { .img {
width: 14px; width: 14px;
height: 16px; height: 16px;
...@@ -610,7 +689,6 @@ ...@@ -610,7 +689,6 @@
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
width: 100%; width: 100%;
margin-top: -28upx;
} }
.main { .main {
width: 100%; width: 100%;
...@@ -749,4 +827,238 @@ ...@@ -749,4 +827,238 @@
flex-wrap: wrap; flex-wrap: wrap;
} }
} }
.user-info-box{
.relative{
margin-right: 4upx;
.img-icon{
display: block;
width: 142upx;
max-height: 40upx;
}
}
.absolute{
display: flex;
justify-content: center;
align-items: center;
text{
font-weight: normal;
font-size: 20rpx;
margin: 0 0 2upx 30upx;
}
.text-1{
color: #8C1E41;
}
.text-2{
color: #472F1E;
}
}
.grayscale{
filter: grayscale(100%);
}
.tip-date{
font-weight: normal;
font-size: 20rpx;
color: #A3A3A3;
margin-top: 10upx;
}
}
.remeber-info-box{
display: flex;
flex-direction: row;
width: 90%;
margin: 20upx auto 10upx;
.flex-7{
display: flex;
flex: 1;
height: 100%;
.level-bg{
display: block;
width: 100%;
height: 136rpx;
}
.level-content{
display: flex;
justify-content: space-between;
.part-left{
height: 100%;
.level{
display: flex;
flex-direction: column;
justify-content: center;
padding-left: 24upx;
height: 100%;
.text-1{
font-weight: 900;
font-size: 32upx;
color: #A3A3A3;
font-style: italic;
}
.text-2{
font-weight: normal;
font-size: 20upx;
margin-top: 4upx;
}
.flex-row{
display: flex;
align-items: center;
justify-content: center;
width: 160rpx;
height: 32upx;
border-radius: 4upx;
margin-top: 8upx;
.text-3{
font-weight: normal;
font-size: 18upx;
}
.text-4{
font-weight: normal;
font-size: 26rpx;
font-style: italic;
margin-left: 10upx;
}
}
}
.level-4{
.text-1{
background: linear-gradient(104deg, #FFB875 0%, #FFEDC4 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.text-2{
color: #F3E3C6;
}
.flex-row{
background: #615D73;
border: 1px solid #F9ECEC;
.text-3{
color: #F3E3C6;
}
.text-4{
color: #FFB875;
}
}
}
.level-3{
.text-1{
background: linear-gradient(-90deg, #222A5E 0%, #4C559E 46.9482421875%, #222A5E 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.text-2{
color: #5A63A5;
}
.flex-row{
background: #BAC6D2;
border: 1px solid #464F8E;
.text-3{
color: #5A63A5;
}
.text-4{
color: #464F8E;
}
}
}
.level-2{
.text-1{
background: linear-gradient(47deg, #FD7C01 0%, #FCAB00 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.text-2{
color: #985E39;
}
.flex-row{
background: #FFEED9;
border: 1px solid #DE966F;
.text-3{
color: #985E39;
}
.text-4{
color: #701700;
}
}
}
.level-1{
.text-1{
background: linear-gradient(47deg, #E9EEEE 0%, #FBFFFC 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.text-2{
color: #F1F6F4;
}
.flex-row{
background: #E3E6E8;
border: 1px solid #E3E6E8;
.text-3{
color: #9D9D9D;
}
.text-4{
color: #9D9D9D;
}
}
}
}
.part-right{
display: flex;
align-items: center;
height: 100%;
padding-right: 20upx;
.tag-icon{
display: block;
width: 120upx;
}
}
}
}
.flex-3{
display: flex;
flex-direction: column;
justify-content: center;
width: 184rpx;
height: 136rpx;
background: linear-gradient(71deg, #FFFFFF 0%, #FBF5DD 0%, #FCDFC5 0%, #FFCD9C 98%);
border-radius: 14rpx;
border: 1px solid #FDD8B8;
margin-left: 20upx;
padding-left: 20upx;
.text-1{
font-weight: bolder;
font-size: 32rpx;
font-style: italic;
color: #A3A3A3;
background: linear-gradient(47deg, #FD7C01 0%, #FCAB00 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.text-2{
font-size: 20rpx;
color: #985E39;
margin-top: 4upx;
}
.flex-row{
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
width: 102rpx;
height: 32rpx;
background: #FFEED9;
border-radius: 4rpx;
border: 1px solid #E6A37F;
margin-top: 8upx;
.text-3{
font-size: 18rpx;
color: #985E39;
}
.text-4{
font-size: 26rpx;
color: #701700;
margin: 2upx 4upx 0;
}
}
}
}
</style> </style>
\ No newline at end of file
...@@ -38,7 +38,8 @@ ...@@ -38,7 +38,8 @@
</view> </view>
<view v-if="tabIndex ==1" class="list-box"> <view v-if="tabIndex ==1" class="list-box">
<view v-for="(item,k) in rechargeConfList" :key="k" class="flex-col item" @tap="onRechargeChange(k)"> <view v-for="(item,k) in rechargeConfList" :key="k" class="flex-col item"
@tap="onRechargeChange(k)">
<image class="amount-bg" :src="assetsPath+'/vip/amount_bg.png'" mode="widthFix"></image> <image class="amount-bg" :src="assetsPath+'/vip/amount_bg.png'" mode="widthFix"></image>
<view class="flex-col item-content" :class="rechargeIndex === k?'active':''"> <view class="flex-col item-content" :class="rechargeIndex === k?'active':''">
<view v-if="item.giveType.includes('1')" class="preferential"> <view v-if="item.giveType.includes('1')" class="preferential">
...@@ -88,16 +89,19 @@ ...@@ -88,16 +89,19 @@
<text class="text-3">00</text> <text class="text-3">00</text>
</view> </view>
<view class="cu-btn-box" @tap="onSubmit"> <view class="cu-btn-box" @tap="onSubmit">
<button class="cu-btn" :class="consumerMemberStatus?'bg-gray':'bg-pink'">立即开通</button> <button class="cu-btn"
:class="consumerMemberStatus?'bg-gray':'bg-pink'">立即开通</button>
</view> </view>
</view> </view>
</view> </view>
</view> </view>
<view class="rule-tip"> <view class="rule-tip">
<checkbox-group @change="onRuleTipChange"> <checkbox-group @change="onRuleTipChange">
<checkbox class='round yellow' :class="checked?'checked':''" :checked="checked" value="checked" style="transform: scale(0.6);"></checkbox> <checkbox class='round yellow' :class="checked?'checked':''" :checked="checked"
value="checked" style="transform: scale(0.6);"></checkbox>
</checkbox-group> </checkbox-group>
<text>我已阅读</text><text class="text-pink">用户充值协议</text><text>, 并同意协议内容</text> <text>我已阅读</text><text class="text-pink" @tap="onNavToRule2">用户充值协议</text><text>,
并同意协议内容</text>
</view> </view>
</view> </view>
</view> </view>
...@@ -109,11 +113,57 @@ ...@@ -109,11 +113,57 @@
</button> </button>
<view class="rule-tip"> <view class="rule-tip">
<checkbox-group @change="onRuleTipChange"> <checkbox-group @change="onRuleTipChange">
<checkbox class='round yellow' :class="checked?'checked':''" :checked="checked" value="checked" style="transform: scale(0.6);"></checkbox> <checkbox class='round yellow' :class="checked?'checked':''" :checked="checked" value="checked"
style="transform: scale(0.6);"></checkbox>
</checkbox-group> </checkbox-group>
<text>我已阅读</text><text class="text-pink">用户充值协议</text><text>, 并同意协议内容</text> <text>我已阅读</text><text class="text-pink" @tap="onNavToRule2">用户充值协议</text><text>, 并同意协议内容</text>
</view> </view>
</view> </view>
<view v-if="tabIndex ==2" class="bg-box-1 margin-top">
<view class="bg-box-2">
<view class="flex-row-center title-content">
<view class="xx">
<image :src="assetsPath+'/xx.png'" mode="widthFix"></image>
</view>
<view class="title-text">
<view class="text">
<text>权益会员专属活动</text>
</view>
<view class="line">
</view>
</view>
<view class="xx">
<image :src="assetsPath+'/xx.png'" mode="widthFix"></image>
</view>
</view>
<view class="prefer-box-list">
<view v-for="(item,k) in preferList" :key="k" class="list-item">
<image class="img" :src="item.iconUrl" mode="widthFix"></image>
<text class="text-title">{{item.title}}</text>
<text class="text-slogan">{{item.slogan}}</text>
</view>
</view>
<view class="look-prefer-nav">
<text class="text-title">点击可查看权益详情</text>
<image class="img" :src="assetsPath+'/vip/icon_right.png'" mode="widthFix"></image>
</view>
</view>
<view class="adorn-1">
<image class="img" :src="assetsPath+'/vip/adorn_1.png'" mode="widthFix"></image>
</view>
<view class="adorn-2">
<image class="img" :src="assetsPath+'/vip/adorn_2.png'" mode="widthFix"></image>
</view>
</view>
</view>
<view class="rule-btn" @tap="onNavToRule">
<text>规则</text>
</view> </view>
<f-tabbar></f-tabbar> <f-tabbar></f-tabbar>
</view> </view>
...@@ -147,9 +197,60 @@ ...@@ -147,9 +197,60 @@
list: [], list: [],
rechargeConfList: [], rechargeConfList: [],
tabIndex: 1, tabIndex: 1,
rechargeIndex:0, rechargeIndex: 0,
index: 0, index: 0,
consumerMemberStatus:false consumerMemberStatus: false,
preferList: [{
iconUrl: config.assetsPath + "/vip/p_1.png",
title: "会员价",
slogan: "最低享98折"
},
{
iconUrl: config.assetsPath + "/vip/p_2.png",
title: "专属礼物",
slogan: "好礼享不停"
},
{
iconUrl: config.assetsPath + "/vip/p_3.png",
title: "会员日",
slogan: "半价活动"
},
{
iconUrl: config.assetsPath + "/vip/p_4.png",
title: "特定活动",
slogan: "免报名费"
},
{
iconUrl: config.assetsPath + "/vip/p_5.png",
title: "邀请有礼",
slogan: "推荐返利"
},
{
iconUrl: config.assetsPath + "/vip/p_6.png",
title: "专属储物柜",
slogan: "一年使用期限"
},
{
iconUrl: config.assetsPath + "/vip/p_7.png",
title: "专属客服",
slogan: "一对一服务"
},
{
iconUrl: config.assetsPath + "/vip/p_8.png",
title: "联营开店",
slogan: "共享资源"
},
{
iconUrl: config.assetsPath + "/vip/p_9.png",
title: "商城",
slogan: "会员折扣"
},
{
iconUrl: config.assetsPath + "/vip/p_10.png",
title: "次卡",
slogan: "特惠购"
}
]
}; };
}, },
onLoad() { onLoad() {
...@@ -161,11 +262,11 @@ ...@@ -161,11 +262,11 @@
onGetUserInfo() { onGetUserInfo() {
getUserInfo().then(res => { getUserInfo().then(res => {
if (res.data.code == 200) { if (res.data.code == 200) {
if(res.data.data.consumerMember && res.data.data.consumerMember.memberType ==2){ if (res.data.data.consumerMember && res.data.data.consumerMember.memberType == 2) {
let expirationDate = moment(res.data.data.consumerMember.expirationDate).valueOf(); let expirationDate = moment(res.data.data.consumerMember.expirationDate).valueOf();
let nowDate = moment().valueOf() let nowDate = moment().valueOf()
if(nowDate <= expirationDate){ if (nowDate <= expirationDate) {
this.consumerMemberStatus = true; this.consumerMemberStatus = true;
} }
} }
...@@ -174,11 +275,11 @@ ...@@ -174,11 +275,11 @@
}) })
}, },
onRechargeChange(k){ onRechargeChange(k) {
this.rechargeIndex = k; this.rechargeIndex = k;
}, },
onRuleTipChange(e){ onRuleTipChange(e) {
console.log(e,99999) console.log(e, 99999)
this.checked = e.detail.value.includes("checked") this.checked = e.detail.value.includes("checked")
}, },
onLoading() { onLoading() {
...@@ -209,15 +310,16 @@ ...@@ -209,15 +310,16 @@
this.checked = false; this.checked = false;
}, },
onSubmit() { onSubmit() {
if(!this.checked){ if (!this.checked) {
uni.showToast({ uni.showToast({
icon:"none", icon: "none",
title:"请先阅读充值协议并同意" title: "请先阅读充值协议并同意"
}) })
return; return;
} }
let that = this;
uni.showLoading({ uni.showLoading({
title:"提交中..." title: "提交中..."
}) })
createEquityMembers({ createEquityMembers({
payType: 1, payType: 1,
...@@ -237,7 +339,9 @@ ...@@ -237,7 +339,9 @@
icon: "success", icon: "success",
title: "下单成功", title: "下单成功",
success: () => { success: () => {
setTimeout(() => {
that.onGetUserInfo();
}, 1000)
} }
}) })
}, },
...@@ -255,16 +359,26 @@ ...@@ -255,16 +359,26 @@
}) })
}, },
onNavToRule() {
uni.navigateTo({
url: "/setting/rule/rule?keyData=vip_user_rule"
})
},
onNavToRule2() {
uni.navigateTo({
url: "/setting/rule/rule?keyData=user_pay_protocol"
})
},
onNavToRecharge() { onNavToRecharge() {
if(!this.checked){ if (!this.checked) {
uni.showToast({ uni.showToast({
icon:"none", icon: "none",
title:"请先阅读充值协议并同意" title: "请先阅读充值协议并同意"
}) })
return; return;
} }
uni.showLoading({ uni.showLoading({
title:"提交中..." title: "提交中..."
}) })
createRecharge({ createRecharge({
payType: 1, payType: 1,
...@@ -333,6 +447,7 @@ ...@@ -333,6 +447,7 @@
padding-bottom: 60upx; padding-bottom: 60upx;
.bg-box-1 { .bg-box-1 {
position: relative;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
...@@ -392,6 +507,24 @@ ...@@ -392,6 +507,24 @@
} }
} }
} }
.adorn-1{
position: absolute;
top: -24upx;
right: 20upx;
.img{
width: 74upx;
max-height: 78upx;
}
}
.adorn-2{
position: absolute;
bottom: -40upx;
left: 24upx;
.img{
width: 78upx;
max-height: 90upx;
}
}
} }
.action-box-list { .action-box-list {
...@@ -456,6 +589,7 @@ ...@@ -456,6 +589,7 @@
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
} }
.line { .line {
width: 80%; width: 80%;
height: 1rpx; height: 1rpx;
...@@ -500,11 +634,13 @@ ...@@ -500,11 +634,13 @@
align-items: flex-end; align-items: flex-end;
justify-content: center; justify-content: center;
color: #FE3F00; color: #FE3F00;
.symbol { .symbol {
font-weight: 400; font-weight: 400;
font-size: 29upx; font-size: 29upx;
margin-bottom: 10upx; margin-bottom: 10upx;
} }
.num { .num {
font-weight: 400; font-weight: 400;
font-size: 64upx; font-size: 64upx;
...@@ -521,20 +657,24 @@ ...@@ -521,20 +657,24 @@
background: linear-gradient(-90deg, #FCD25B, #FA541D); background: linear-gradient(-90deg, #FCD25B, #FA541D);
border-radius: 0 0 23upx 23upx; border-radius: 0 0 23upx 23upx;
z-index: 2; z-index: 2;
text { text {
font-size: 19upx; font-size: 19upx;
color: #ffffff; color: #ffffff;
} }
} }
.active{
.active {
background: linear-gradient(-90deg, #FCD25B, #FA541D); background: linear-gradient(-90deg, #FCD25B, #FA541D);
box-shadow: 0 4upx 12upx #FA541D; box-shadow: 0 4upx 12upx #FA541D;
border-radius: 12upx; border-radius: 12upx;
.amount{
.amount {
color: #ffffff; color: #ffffff;
} }
.preferential{
text{ .preferential {
text {
color: #ffffff; color: #ffffff;
background: #ffffff; background: #ffffff;
-webkit-background-clip: text; -webkit-background-clip: text;
...@@ -542,8 +682,9 @@ ...@@ -542,8 +682,9 @@
} }
} }
.part-bottom{
.tip-text{ .part-bottom {
.tip-text {
background: linear-gradient(-45deg, #FCD25B, #FA541D); background: linear-gradient(-45deg, #FCD25B, #FA541D);
} }
} }
...@@ -551,15 +692,17 @@ ...@@ -551,15 +692,17 @@
} }
} }
.list-box-2{ .list-box-2 {
width: 100%; width: 100%;
align-items: center; align-items: center;
.part-1{
.part-1 {
display: flex; display: flex;
align-items: center; align-items: center;
width: 90%; width: 90%;
margin-top: 24upx; margin-top: 24upx;
.text-bg-1{
.text-bg-1 {
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
...@@ -568,14 +711,16 @@ ...@@ -568,14 +711,16 @@
background: linear-gradient(90deg, #FCD25B 0%, #FA541D 100%); background: linear-gradient(90deg, #FCD25B 0%, #FA541D 100%);
border-radius: 14rpx; border-radius: 14rpx;
margin-right: 10upx; margin-right: 10upx;
text{
text {
font-weight: normal; font-weight: normal;
font-size: 20rpx; font-size: 20rpx;
color: #FFFFFF; color: #FFFFFF;
font-style: italic; font-style: italic;
} }
} }
.text-2{
.text-2 {
font-weight: normal; font-weight: normal;
font-size: 32rpx; font-size: 32rpx;
color: #FA561E; color: #FA561E;
...@@ -584,80 +729,96 @@ ...@@ -584,80 +729,96 @@
-webkit-background-clip: text; -webkit-background-clip: text;
-webkit-text-fill-color: transparent; -webkit-text-fill-color: transparent;
} }
.text-3{
.text-3 {
font-weight: 400; font-weight: 400;
font-size: 20rpx; font-size: 20rpx;
color: #999999; color: #999999;
font-style: italic; font-style: italic;
} }
} }
.part-2{
.part-2 {
position: relative; position: relative;
width: 90%; width: 90%;
margin-top: 24upx; margin-top: 24upx;
.img-bg{
.img-bg {
display: block; display: block;
width: 100%; width: 100%;
max-height: 160upx; max-height: 160upx;
} }
.absolute{
.absolute {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
.flex-5{
.flex-5 {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
width: 67%; width: 67%;
height: 100%; height: 100%;
padding-left: 24upx; padding-left: 24upx;
.flex-row{
.flex-row {
align-items: flex-end; align-items: flex-end;
font-weight: bold; font-weight: bold;
.text-1{
.text-1 {
color: #FE2E2E; color: #FE2E2E;
font-size: 42upx; font-size: 42upx;
} }
.text-2{
.text-2 {
color: #333333; color: #333333;
font-size: 34upx; font-size: 34upx;
margin-bottom: 2upx; margin-bottom: 2upx;
} }
} }
.text-3{
.text-3 {
font-weight: 400; font-weight: 400;
font-size: 24rpx; font-size: 24rpx;
color: #A59079; color: #A59079;
margin-top: 12upx; margin-top: 12upx;
} }
} }
.flex-3{
.flex-3 {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
flex: 1; flex: 1;
height: 100%; height: 100%;
.flex-row{
.flex-row {
align-items: flex-end; align-items: flex-end;
.text-1{
.text-1 {
color: #D27E1F; color: #D27E1F;
font-size: 32upx; font-size: 32upx;
margin-bottom: 6upx; margin-bottom: 6upx;
} }
.text-2{
.text-2 {
color: #D27E1F; color: #D27E1F;
font-size: 56upx; font-size: 56upx;
font-weight: bold; font-weight: bold;
} }
.text-3{
.text-3 {
color: #D27E1F; color: #D27E1F;
font-size: 32upx; font-size: 32upx;
margin-bottom: 6upx; margin-bottom: 6upx;
} }
} }
.cu-btn-box{
.cu-btn-box {
margin-top: 10upx; margin-top: 10upx;
.cu-btn{
.cu-btn {
padding: 0 20upx; padding: 0 20upx;
height: 40upx; height: 40upx;
...@@ -665,14 +826,16 @@ ...@@ -665,14 +826,16 @@
font-size: 24upx; font-size: 24upx;
color: #ffffff; color: #ffffff;
} }
.bg-pink{
.bg-pink {
background: #FA561E; background: #FA561E;
} }
} }
} }
} }
} }
.rule-tip{
.rule-tip {
margin: 24upx 0 20upx; margin: 24upx 0 20upx;
} }
} }
...@@ -698,11 +861,13 @@ ...@@ -698,11 +861,13 @@
flex-direction: row; flex-direction: row;
align-items: center; align-items: center;
margin-top: 34upx; margin-top: 34upx;
text { text {
font-weight: normal; font-weight: normal;
font-size: 24rpx; font-size: 24rpx;
color: #777777; color: #777777;
} }
.text-pink { .text-pink {
margin: 0 6upx; margin: 0 6upx;
font-size: 24rpx; font-size: 24rpx;
...@@ -726,4 +891,83 @@ ...@@ -726,4 +891,83 @@
width: 100%; width: 100%;
padding: 30upx; padding: 30upx;
} }
.prefer-box-list {
display: flex;
flex-wrap: wrap;
width: 98%;
margin: 24upx auto 0;
.list-item {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
width: 20%;
padding: 20upx 0;
.img {
display: block;
width: 72upx;
max-height: 80upx;
}
.text-title {
margin-top: 8upx;
font-size: 22upx;
color: #000000;
background: linear-gradient(-90deg, #FF7800 0%, #FF0000 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.text-slogan {
margin-top: 8upx;
font-weight: 400;
font-size: 18upx;
color: #999999;
}
}
}
.look-prefer-nav {
display: flex;
flex-direction: row;
align-items: center;
margin-top: 24upx;
.text-title {
font-weight: normal;
font-size: 24upx;
color: #A59079;
}
.img {
display: block;
width: 16upx;
margin-left: 10upx;
}
}
.rule-btn {
position: fixed;
right: 0;
top: 14vh;
display: flex;
justify-content: center;
align-items: center;
width: 42upx;
height: 91upx;
background: rgba(0, 0, 0, 0.23);
border-radius: 13upx;
z-index: 90;
text {
font-weight: 400;
font-size: 24upx;
color: #FFFDFD;
writing-mode: horizontal-tb;
text-align: center;
}
}
</style> </style>
\ No newline at end of file
<template>
<view class="article">
<view class="bg-box-1">
<view class="bg-box-2">
<view class="flex-row-center title-content">
<view class="xx">
<image :src="assetsPath+'/xx.png'" mode="widthFix"></image>
</view>
<view class="title-text">
<view class="text">
<text>{{article.protocolTitle || '规则'}}</text>
</view>
<view class="line">
</view>
</view>
<view class="xx">
<image :src="assetsPath+'/xx.png'" mode="widthFix"></image>
</view>
</view>
<scroll-view class="scroll-view" scroll-y="true">
<view class="scroll-view-content">
<view class="" v-html="article.content">
</view>
</view>
</scroll-view>
</view>
</view>
</view>
</template>
<script>
import config from "@/config/index.config";
import {
getProtocol
} from "@/api/index.js";
export default {
data() {
return {
assetsPath: config.assetsPath,
article: {
protocolTitle: '',
content: '',
},
keyData: ""
};
},
onLoad(option) {
if (option && option.keyData) {
this.keyData = option.keyData
}
this.onLoading()
},
methods: {
onLoading() {
getProtocol(this.keyData).then(res => {
console.log(res)
if (res.data.code) {
uni.setNavigationBarTitle({
title: res.data.data.protocolTitle
})
this.article = res.data.data
}
})
}
}
}
</script>
<style>
page {
width: 100%;
height: 100%;
background-color: rgb(255, 234, 191);
}
</style>
<style lang="scss">
.article {
display: flex;
flex-direction: column;
align-items: center;
width: 100vw;
height: 100%;
}
.bg-box-1 {
display: flex;
flex: 1;
flex-direction: column;
justify-content: center;
align-items: center;
width: 690upx;
background: #FFCA7E;
border-radius: 32upx;
padding: 6px 0;
margin: 30upx 0 40upx;
.bg-box-2 {
display: flex;
height: 98%;
width: 650upx;
flex-direction: column;
align-items: center;
background: linear-gradient(-42deg, #FFF5CB, #FFFFFF);
border-radius: 32upx;
.title-content {
margin: 24upx 0;
.title-text {
display: flex;
justify-content: center;
position: relative;
margin: 0 20upx;
.text {
position: relative;
font-weight: normal;
font-size: 48rpx;
color: #000000;
background: linear-gradient(-90deg, #FF7800 0%, #FF0000 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
z-index: 2;
}
.line {
position: absolute;
bottom: 0;
width: 110%;
height: 15upx;
background: #FFEABF;
border-radius: 8upx;
}
}
.xx {
width: 30upx;
image {
width: 100%;
max-height: 34upx;
}
}
}
.scroll-view {
display: flex;
flex: 1;
position: relative;
width: 100%;
overflow: hidden;
.scroll-view-content {
position: absolute;
left: 0;
width: 100%;
padding: 24upx;
}
}
}
}
</style>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment