20261008
This commit is contained in:
@@ -0,0 +1,309 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class="layout layout-equity">
|
||||
<view class="equity-title">
|
||||
尊敬的平台商家您好,目前您是我们平台的
|
||||
<text class="vip">{{ userLevelStr }}</text>
|
||||
客户,可享受相应的会员权益~
|
||||
</view>
|
||||
<view class="equity-main m-top-30">
|
||||
<!-- <view class="rule">会员规则</view>-->
|
||||
<view class="title flex justify-start align-center">
|
||||
<view class="vip">
|
||||
{{ userLevelStr }}
|
||||
<!-- <text class="lv m-left-10 m-right-20">LV1</text>-->
|
||||
</view>
|
||||
<u-tag text="当前等级" plain size="mini" color="#999" borderColor="#999"></u-tag>
|
||||
</view>
|
||||
<view class="date m-top-30" v-if="userInfo.upgradeExpiredAt">有效期至:{{ dayjs(userInfo.upgradeExpiredAt).format('YYYY-MM-DD HH:mm:ss') }}</view>
|
||||
<view class="m-top-30">
|
||||
<u--text suffixIcon="play-right-fill" color="#bfbfbf" iconStyle="font-size: 14px;color:#bfbfbf"
|
||||
text="当前交易总额"></u--text>
|
||||
<view class="text-30 font-bold text-white mt-20">{{ userInfo.transactionAmount }}</view>
|
||||
</view>
|
||||
<view class="flex justify-between align-center m-top-20">
|
||||
<view class="custom-style" @click="jump('/pages/user/grade')">去续费</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 保证金 -->
|
||||
<view class="equity-bail m-top-30 p-top-20">
|
||||
<view class="title">
|
||||
当前缴纳保证金
|
||||
<text class="strong">{{ userInfo.paidEnsure }}</text>
|
||||
元
|
||||
</view>
|
||||
<view class="text m-top-20">
|
||||
<u--text type="info"
|
||||
text="金久信携手千万采购商和供应商,承诺为买家和卖家打造更优质的服务平台,缴纳诚信保证金会冻结在平台,最低保证金额度5000.00元 。"></u--text>
|
||||
</view>
|
||||
<view class="op flex justify-center m-top-30">
|
||||
<view class="o active" @click="jump('/pages/user/grade')">升级会员 ></view>
|
||||
<!-- <view class="o active" @click="jump('/pages/user/grade')">去缴纳保证金 ></view>-->
|
||||
<!-- <view class="o" @click="jump('/pages/user/grade')">购买增值权益 ></view>-->
|
||||
</view>
|
||||
</view>
|
||||
<!-- 权益 -->
|
||||
<view class="equity-info m-top-30 p-top-30">
|
||||
<view class="divider">
|
||||
<u-divider text="可享受一下权益"></u-divider>
|
||||
</view>
|
||||
<view class="divider-box flex justify-start flex-wrap">
|
||||
<view class="item">
|
||||
<view class="icon">
|
||||
<image class="full" src="/static/img/di-1.png" mode=""></image>
|
||||
</view>
|
||||
<view class="big m-top-10">9折报价</view>
|
||||
<view class="small">精准寻找买家</view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<view class="icon">
|
||||
<image class="full" src="/static/img/di-2.png" mode=""></image>
|
||||
</view>
|
||||
<view class="big m-top-10">10次/月询价</view>
|
||||
<view class="small">每成交50万送10次</view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<view class="icon">
|
||||
<image class="full" src="/static/img/di-3.png" mode=""></image>
|
||||
</view>
|
||||
<view class="big m-top-10">可自主交易</view>
|
||||
<view class="small">交易更方便</view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<view class="icon">
|
||||
<image class="full" src="/static/img/di-1.png" mode=""></image>
|
||||
</view>
|
||||
<view class="big m-top-10">黄页展示更丰富</view>
|
||||
<view class="small">让买家快速了解我</view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<view class="icon">
|
||||
<image class="full" src="/static/img/di-2.png" mode=""></image>
|
||||
</view>
|
||||
<view class="big m-top-10">平台增值服务享9折</view>
|
||||
<view class="small">交易更划算</view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<view class="icon">
|
||||
<image class="full" src="/static/img/di-3.png" mode=""></image>
|
||||
</view>
|
||||
<view class="big m-top-10">9折购买广告位</view>
|
||||
<view class="small">平台广告位购买</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import dayjs from "dayjs";
|
||||
|
||||
export default {
|
||||
props: {
|
||||
userData: {
|
||||
type: Object
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
userInfo: {
|
||||
userLevel: -1,
|
||||
userGrade: 0,
|
||||
upgradeExpiredAt: '',
|
||||
transactionAmount: 0,
|
||||
paidEnsure: 0,
|
||||
},
|
||||
userLevelList: [],
|
||||
userLevelStr: '普通用户',
|
||||
userPayEnsureList: [],
|
||||
pageSize: 10,
|
||||
total: 0
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
dayjs,
|
||||
async getUserLevelList() {
|
||||
vk.callFunction({
|
||||
url: 'client/userLevel/pub/getList',
|
||||
data: {
|
||||
pageIndex: 1,
|
||||
pageSize: 200
|
||||
},
|
||||
success: async (data) => {
|
||||
this.userLevelList = data.rows
|
||||
const {userInfo} = await vk.userCenter.getCurrentUserInfo()
|
||||
this.userInfo = userInfo
|
||||
if (this.userInfo.userLevel > -1) {
|
||||
this.userLevelStr = this.userLevelList.find(level => parseInt(level.level) === parseInt(this.userInfo.userLevel)).name
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
async getUserPayEnsureList(pageIndex = 1) {
|
||||
const {rows} = vk.callFunction({
|
||||
url: 'client/order/kh/getList',
|
||||
data: {
|
||||
pageIndex,
|
||||
pageSize: 500,
|
||||
type: [2, 3]
|
||||
},
|
||||
});
|
||||
this.userPayEnsureList = rows
|
||||
},
|
||||
jump(url) {
|
||||
vk.navigateTo({url})
|
||||
}
|
||||
},
|
||||
async mounted() {
|
||||
await this.getUserLevelList()
|
||||
await this.getUserPayEnsureList()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.layout-equity {
|
||||
padding: 20rpx 30rpx;
|
||||
|
||||
.equity-title {
|
||||
font-size: 24rpx;
|
||||
line-height: 36rpx;
|
||||
color: #101010;
|
||||
|
||||
.vip {
|
||||
font-weight: 600;
|
||||
color: #A92924;
|
||||
}
|
||||
}
|
||||
|
||||
.equity-main {
|
||||
position: relative;
|
||||
height: 300rpx;
|
||||
padding: 30rpx 30rpx;
|
||||
border-radius: 10rpx;
|
||||
background: url('~@/static/img/equity.png') center no-repeat;
|
||||
background-size: 100% 100%;
|
||||
box-shadow: 0px 5px 10px 0px rgba(145, 145, 145, 1);
|
||||
|
||||
.rule {
|
||||
position: absolute;
|
||||
right: 30rpx;
|
||||
top: 20rpx;
|
||||
z-index: 9;
|
||||
font-size: 24rpx;
|
||||
line-height: 32rpx;
|
||||
color: rgba(255, 255, 255, 0.68);
|
||||
}
|
||||
|
||||
.vip {
|
||||
font-size: 36rpx;
|
||||
font-weight: 600;
|
||||
line-height: 32rpx;
|
||||
color: #DFBA8B;
|
||||
|
||||
.lv {
|
||||
font-size: 24rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.date {
|
||||
font-size: 26rpx;
|
||||
line-height: 32rpx;
|
||||
color: rgba(223, 186, 139, 0.5);
|
||||
}
|
||||
|
||||
.baibi {
|
||||
width: 420rpx;
|
||||
|
||||
.lv {
|
||||
font-size: 24rpx;
|
||||
line-height: 40rpx;
|
||||
color: #bfbfbf;
|
||||
}
|
||||
|
||||
.w {
|
||||
font-size: 30rpx;
|
||||
font-weight: 600;
|
||||
line-height: 44rpx;
|
||||
color: #bfbfbf;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-style {
|
||||
width: 140rpx;
|
||||
height: 60rpx;
|
||||
font-size: 28rpx;
|
||||
line-height: 60rpx;
|
||||
text-align: center;
|
||||
color: #9B7341;
|
||||
border-radius: 10rpx;
|
||||
background: linear-gradient(rgba(223, 186, 139, 1), rgba(255, 243, 207, 1));
|
||||
}
|
||||
}
|
||||
|
||||
.equity-bail {
|
||||
.title {
|
||||
font-size: 30rpx;
|
||||
line-height: 44rpx;
|
||||
color: #101010;
|
||||
|
||||
.strong {
|
||||
font-weight: 600;
|
||||
color: #A92924;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.o {
|
||||
width: 210rpx;
|
||||
height: 68rpx;
|
||||
font-size: 26rpx;
|
||||
line-height: 68rpx;
|
||||
color: #A92924;
|
||||
text-align: center;
|
||||
border: 1px solid #A92924;
|
||||
}
|
||||
|
||||
.active {
|
||||
color: #ffffff;
|
||||
background: #A92924;
|
||||
}
|
||||
|
||||
.divider {
|
||||
margin: 0 auto;
|
||||
width: 60%;
|
||||
}
|
||||
|
||||
.divider-box {
|
||||
padding: 20rpx 0;
|
||||
|
||||
.item {
|
||||
width: 33.333%;
|
||||
height: auto;
|
||||
padding: 20rpx 0;
|
||||
overflow: hidden;
|
||||
|
||||
.icon {
|
||||
margin: 0 auto;
|
||||
width: 52rpx;
|
||||
height: 52rpx;
|
||||
}
|
||||
|
||||
.big {
|
||||
font-size: 26rpx;
|
||||
line-height: 44rpx;
|
||||
color: #5a5a5a;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.small {
|
||||
font-size: 24rpx;
|
||||
line-height: 32rpx;
|
||||
color: #bfbfbf;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user