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.
133 lines
4.4 KiB
133 lines
4.4 KiB
1 year ago
|
<template>
|
||
|
|
<view class="page flex-col" style="position: fixed;">
|
||
|
|
<view class="group_1 flex-col">
|
||
|
|
<view class="box_1 flex-col" style="margin-top: 240rpx;">
|
||
|
|
<view class="box_2 flex-col">
|
||
|
|
<view class="block_1 flex-row">
|
||
|
|
<view class="image-text_1 flex-row justify-between">
|
||
|
|
<image class="icon_1" referrerpolicy="no-referrer"
|
||
|
|
src="/static/lanhu_goumaihuiyuan/3d2d1ecbc6385f826ce4387e6a8c6435.png" />
|
||
|
|
<text class="text-group_1">会员专享权益</text>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
|
||
|
|
</view>
|
||
|
|
<view class="block_2 flex-row justify-between">
|
||
|
|
<view class="image-text_2 flex-col justify-between" style="margin-left: 100rpx;">
|
||
|
|
<image class="icon_2" referrerpolicy="no-referrer"
|
||
|
|
src="/static/lanhu_goumaihuiyuan/3d4c8663833052862964d153148147bb.png" />
|
||
|
|
<text class="text-group_2">会员优惠券</text>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<view class="image-text_2 flex-col justify-between" style="margin-right: 100rpx;">
|
||
|
|
<image class="icon_2" referrerpolicy="no-referrer"
|
||
|
|
src="/static/lanhu_goumaihuiyuan/710781c750ee86d68a96f7daf5de4eb6.png" />
|
||
|
|
<text class="text-group_2" style="margin-left: 15rpx;">更多权益</text>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
|
||
|
|
</view>
|
||
|
|
<view class="text-wrapper_1 flex-row">
|
||
|
|
<text class="text_1" style="margin-left: 80rpx;">购买课程/商品享优惠</text>
|
||
|
|
<!-- <text class="text_2">部分课程会员免费</text> -->
|
||
|
|
<text class="text_3" style="margin-left: 110rpx;">更多权益增加中</text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="box_3 flex-col">
|
||
|
|
<view class="image-text_4 flex-row justify-between">
|
||
|
|
<image class="icon_4" referrerpolicy="no-referrer"
|
||
|
|
src="/static/lanhu_goumaihuiyuan/3d2d1ecbc6385f826ce4387e6a8c6435.png" />
|
||
|
|
<text class="text-group_4">会员专享权益</text>
|
||
|
|
</view>
|
||
|
|
<text class="paragraph_1">
|
||
|
|
1、会员购买部分课程可享受优惠价
|
||
|
|
2、会员到期后权益即失效，需继承享受请及时续费
|
||
|
|
</text>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
|
||
|
|
<picker class="button_1 flex-col" mode="selector" :range="options" @cancel="cancelPicker"
|
||
|
|
@change="confirmPicker"> <text class="text_4" style="line-height: 100rpx;">开通会员</text></picker>
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
</view>
|
||
|
|
<view class="box_4 flex-col">
|
||
|
|
|
||
|
|
<view class="nav-bar_1 flex-row" style="">
|
||
|
|
<!-- <image
|
||
|
|
class="icon_5"
|
||
|
|
referrerpolicy="no-referrer"
|
||
|
|
src="/static/lanhu_goumaihuiyuan/cb145de49027380678f87f629c0207bc.png"
|
||
|
|
/> -->
|
||
|
|
<!-- <text class="text_5">购买会员</text> -->
|
||
|
|
<!-- <image
|
||
|
|
class="applet-top-bar_1"
|
||
|
|
referrerpolicy="no-referrer"
|
||
|
|
src="/static/lanhu_goumaihuiyuan/727bbb8905129211285da11f3fb719d2.png"
|
||
|
|
/> -->
|
||
|
|
</view>
|
||
|
|
<view class="box_5 flex-col" style="top:190rpx">
|
||
|
|
<view class="section_1 flex-row">
|
||
|
|
<image class="single-avatar_1 flex-col" :src=" $wanlshop.oss(user.avatar, 52, 52, 2, 'avatar')">
|
||
|
|
</image>
|
||
|
|
<text class="text_6">{{user.nickname}}</text>
|
||
|
|
<button class="button_2 flex-col">
|
||
|
|
<text class="text_7">未开通会员</text>
|
||
|
|
</button>
|
||
|
|
</view>
|
||
|
|
<view class="text-wrapper_2 flex-row">
|
||
|
|
<text class="text_8">VIP</text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</template>
|
||
|
|
<script>
|
||
|
|
import {
|
||
|
|
mapState
|
||
|
|
} from 'vuex';
|
||
|
|
export default {
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
showPicker: false, // 控制下拉选择器的显示与隐藏
|
||
|
|
selectedOption: '', // 选中的值
|
||
|
|
options: ['初级会员', '中级会员', '高级会员'], // 下拉选择器的选项列表
|
||
|
|
loopData0: [
|
||
|
|
// {
|
||
|
|
// lanhuimage0: '/static/lanhu_goumaihuiyuan/845f2c13f312b4d507fe4c1b1104ee1b.png',
|
||
|
|
// lanhutext0: '免费课程'
|
||
|
|
// },
|
||
|
|
{
|
||
|
|
lanhuimage0: '/static/lanhu_goumaihuiyuan/710781c750ee86d68a96f7daf5de4eb6.png',
|
||
|
|
lanhutext0: '更多权益'
|
||
|
|
}
|
||
|
|
],
|
||
|
|
constants: {}
|
||
|
|
};
|
||
|
|
},
|
||
|
|
computed: {
|
||
|
|
...mapState(['user', 'statistics', 'common'])
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
|
||
|
|
confirmPicker(event) {
|
||
|
|
// 选中的值发生变化时触发该方法，更新选中的值并关闭下拉选择器
|
||
|
|
const index = event.detail.value;
|
||
|
|
this.selectedOption = this.options[index];
|
||
|
|
this.showPicker = false;
|
||
|
|
|
||
|
|
uni.navigateTo({
|
||
|
|
url: '/pages/user/money/pay?groups=vip&order_id=1&type2='+this.selectedOption
|
||
|
|
});
|
||
|
|
|
||
|
|
},
|
||
|
|
|
||
|
|
}
|
||
|
|
};
|
||
|
|
</script>
|
||
|
|
<style lang='css'>
|
||
|
|
@import '../common/common.css';
|
||
|
|
@import './assets/style/index.rpx.css';
|
||
|
|
</style>
|