init

pages/subpages/member/member.js

@@ -0,0 +1,52 @@
+import memberApi from "../../../api/memberApi"
+import tool from '../../../utils/tool'
+
+Page({
+
+  data: {
+    current: 0,
+    userInfo: {},
+    vipLevel: [],
+    vipTypeList: [],
+    userMemberInfo: {}
+  },
+  goback(){
+    wx.navigateBack(1)
+  },
+  switchActive(e){
+    this.setData({
+      current: e.currentTarget.dataset.index
+    })
+  },
+  add(e){
+    let vipId = this.data.vipTypeList[this.data.current].id
+    memberApi.add({vipId}).then(res=>{
+      if (res.code===200) {
+        wx.showToast({
+          title: '兑换成功~',
+          icon: 'none'
+        })
+        this.onLoad()
+      }
+    })
+  },
+  jihuo(){
+    wx.navigateTo({
+      url: '/pages/subpages/activation/activation',
+    })
+  },
+  onLoad(){
+    const userInfo = tool.data.get('USER_INFO')
+    const clientConfig = tool.data.get('CLIENT_CONFIG')
+    const userMemberInfo = tool.data.get('USER_MEMBER_INFO')
+
+    let vipTypeList = JSON.parse(clientConfig.CLIENT_MEMBER_CATEGORY)
+    this.setData({
+      vipTypeList, 
+      userInfo,
+      userMemberInfo
+    })
+  
+  },
+
+})

pages/subpages/member/member.json

@@ -0,0 +1,8 @@
+{
+  "usingComponents": {
+    "van-nav-bar": "@vant/weapp/nav-bar/index",
+    "van-tag": "@vant/weapp/tag/index",
+    "van-sticky": "@vant/weapp/sticky/index"
+  },
+  "navigationStyle": "custom"
+}

pages/subpages/member/member.wxml

@@ -0,0 +1,42 @@
+<van-sticky>
+<van-nav-bar
+  title="兑换会员"
+  left-text="返回"
+  left-arrow
+  bind:click-left="goback"
+/>
+</van-sticky>
+<view class="vip_info">
+	<text class="nick">{{ userInfo.nickname }}</text>
+	<van-tag wx:if="{{userMemberInfo}}" color="#F7DB50" text-color="#ad0000">{{userMemberInfo.level}}</van-tag>
+	<view wx:if="{{userMemberInfo}}" class="member_datetime">
+		<text class="startTime">{{userMemberInfo.startTime}}</text>
+		<text>-</text>
+		<text class="endTime">{{userMemberInfo.endTime}}</text>
+	</view>
+	<text wx:else>您目前还不是会员哦~</text>
+
+</view>
+
+<view class="vip_list">
+	<text>成为会员，全站资源免费下</text>
+	<view class="{{current===index?'vip_item active':'vip_item'}}" wx:for="{{ vipTypeList }}" wx:key="index"
+	bindtap="switchActive" data-index="{{index}}">
+		<text class="vip_duration">{{item.name}}</text>
+		<view class="vip_score">
+			所需积分<text class="vip_duration_value"> {{item.needScore}}</text>
+		</view>
+	</view>
+
+	<van-button type="info" block bindtap="add">确认兑换</van-button>
+	<van-button type="info" block bindtap="jihuo">激活卡密</van-button>
+
+	<view class="vip_explain">
+		<text>会员服务声明：</text>
+		<view class="vip_explain_content">
+			<text>1.在会员有效期内，用户可以免费学习本站所有内容和课程。</text>
+			<text>2.重复兑换会员服务，会员有效期将在原有基础上顺延。</text>
+		</view>
+	</view>
+	
+</view>

pages/subpages/member/member.wxss

@@ -0,0 +1,66 @@
+page{
+	background-color: #FFF;
+}
+
+.vip_info{
+	background-color: #1989FA;
+	color: #fff;
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+	padding: 24px;
+	font-size: 12px;
+}
+
+.vip_info .nick{
+	font-size: 26px;
+	margin: 18px 0;
+}
+
+.vip_list{
+	padding: 20px;
+	color: #888;
+}
+
+.vip_item{
+	font-size: 12px;
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	padding: 20px;
+	border: 1px solid#F4F4FB;
+	border-radius: 4px;
+	margin-top: 10px;
+}
+
+.vip_list .active{
+	border: 1px solid #1989FA;
+}
+
+.vip_duration,
+.vip_duration_value{
+	font-size: 20px;
+	font-weight: bold;
+	color: #1989FA;
+}
+
+
+.vip_list .van-button{
+	margin-top: 20px;
+}
+
+.vip_explain{
+	font-size: 12px;
+	margin-top: 30px;
+}
+
+.vip_explain_content{
+	display: flex;
+	flex-direction: column;
+}
+
+.member_datetime{
+	display: flex;
+	margin-top: 10px;
+	gap: 4px;
+}