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.
 
 
 
 
 

265 lines
6.3 KiB

<template>
<view class="main">
<view class="topCard flex jcsb">
<view class="leftBox">
<image :src="imageRootNew+'Equity.png'" ></image>
</view>
<view class="rightBox">
<view style="text-align: right;font-weight: bold;margin-bottom: 20upx;">我的权益</view>
<button button-hover="{background-color: rgba(120, 181, 255, 0.1); opacity: 0.7;}" class="button" @click="buy" type="default">购买vip特权包</button>
</view>
</view>
<view class="vipCard">
<view style="color: #2A4362;font-size: 36upx;">购买VIP特权包享更多权益</view>
<view class="table">
<view class="flex jcsb">
<view class="w30 tc cO h100 lh">权益类型</view>
<view class="w40 tc cO h100 lh">基础权益</view>
<view class="w30 tc cT h100 lh">VIP特权包</view>
</view>
<view v-for="(item ,index) in list2" :key="index" class="flex jcsb">
<view class="w30 tc h100 lh">{{ item.rights_type }}</view>
<view class="w40 tc h100 lh">{{ item.base_rights }}</view>
<view class="w30 tc cO h100 lh">{{ item.vip_rights }}</view>
</view>
</view>
<view class="txt">
<view v-for="(item, index) in list3" :key="index">
{{ item }}
</view>
<view class="">组合套餐,高性价、更划算,如有问题可直接咨询。</view>
</view>
<!-- <view style="color: #67AAFD;font-size: 30upx;">在线客服</view> -->
<button
open-type="contact"
hover-class="none"
style="color: #67AAFD;font-size: 28upx;background-color: transparent;display: inline;padding: 0px;margin: 0px;">
在线客服
</button>
</view>
<view style="width: 91%;margin: 0 auto;margin-top: 5%;margin-bottom: 3%;font-size: 36upx;">权益使用量</view>
<view class="cardList flex jcsb" v-for="(item ,index) in list" @click="go(item)" :key="index">
<view class="ml5">{{ item.name }}</view>
<!-- <view class="linkColor mr5" v-if="item.name=='广告曝光卡'">
联系平台 <image class="rightArrow" :src="imageRootNew+'right.png'"></image>
</view> -->
<button v-if="item.link=='contact'"
class="linkColor mr5"
open-type="contact"
hover-class="none"
style="background-color: transparent;font-size: 28upx;padding: 0px;">
联系平台 <image class="rightArrow" :src="imageRootNew+'right.png'"></image>
</button>
<view class="mr5" v-else><text class="linkColor ">
{{ item.use_amount + item.unit }}</text>/{{ item.total_amount + item.unit }}
<image class="rightArrow" :src="imageRootNew+'right.png'"></image>
</view>
</view>
<view class="h50"></view>
</view>
</template>
<script>
import App from '@/common/js/app.js';
export default {
data() {
return{
list: [],
list2: [],
list3: []
}
},
onShow() {
this.getData();
},
methods: {
getData(){
let data = {};
App._post_form('&p=rights&do=getRightsList', data, res => {
this.list2 = res.data.table_list
this.list = res.data.member_rights_list
this.list3 = res.data.content_list;
this.rights_bag_data = res.data.rights_bag_data;
this.list.map(item => {
if(item.name == '置顶权益'){
item.link = 'pages/subPages/Equity/Topping/Topping?rights_id='+item.rights_id;
}else if(item.name == '畅聊卡'){
item.link = 'pages/subPages/Equity/chat/chat?rights_id='+item.rights_id
}else if(item.name == '招聘次数'){
item.link = 'pages/subPages/Equity/recruit/recruit?rights_id='+item.rights_id
}else if(item.name == '精准人才卡'){
item.link = 'pages/subPages/Equity/person/person?rights_id='+item.rights_id
}else{
item.link = 'contact'
}
})
})
},
go(url) {
uni.navigateTo({
url: '/' + url.link
})
},
buy(){
let user = uni.getStorageSync('userinfo')
let data = {
rights_id: this.rights_bag_data.id,
type: 2,
// price: this.rights_bag_data.price,
contacts: user.nickname,
contact_phone: user.truemobile
};
console.log(data)
App._post_form('&p=rights&do=createRightsPay', data, res => {
// let obj = {
// orderid: res.data.orderid,
// plugin: res.data.type
// }
// const params = encodeURIComponent(JSON.stringify(obj));
uni.navigateTo({
url: '/pages/mainPages/payment/payment?orderid=' + res.data.orderid + '&plugin=' + res.data.type
})
console.log(res.data)
})
}
}
}
</script>
<style lang="less" scoped>
page{
// background-color: red;
}
.main{
width: 100%;
height: auto;
background-color: #FDFEFF;
}
.flex{
display: flex
}
.jcsb{
justify-content: space-between;
}
.lh{
line-height: 100upx;
}
.ml5{
margin-left: 3%;
}
.mr5{
margin-right: 3%;
}
.w30{
width: 30%;
}
.w40{
width: 40%;
}
.h50{
height: 50upx;
}
.h100{
height: 100upx;
}
.tc{
text-align: center;
}
.cO{
background-color: #F0F0F0;
}
.cT{
background-color: #D4E0EF;
}
.topCard{
width: 100%;
height: 344upx;
background-color: #E5F2FF;
// padding: 0 3% 0 3%;
.leftBox{
width: 40%;
height: 344upx;
margin-left: 3%;
// border: 1px solid red;
image{
margin-top: 60upx;
width: 200upx;
height: 190upx;
}
}
.rightBox{
width: 40%;
height: 344upx;
margin-right: 3%;
padding-top: 90upx;
font-size: 38upx;
// border: 1px solid blue;
}
}
.button{
background-color: #509DFD;
color: white;
}
.vipCard{
width: 88%;
height: auto;
border-radius: 20upx;
padding: 2%;
margin: 0 auto;
margin-top: -50upx;
background-color: #FFFFFF;
box-shadow: 0 0 8px 0px #E5F2FF;
.txt{
color: #999999;
font-size: 24upx;
font-weight: bold;
line-height: 45upx;
letter-spacing: 5upx
}
}
.cardList{
width: 88%;
height: 90upx;
background-color: #FFFFFF;
box-shadow: 0 0 10px 0px #E5F2FF;
margin: 0 auto;
padding: 2%;
border-radius: 20upx;
font-size: 30upx;
color: #444444;
margin-top: 3%;
margin-bottom: 3%;
align-items: center;
}
.linkColor{
color: #6CADFD;
}
.rightArrow{
width: 20upx;
height: 30upx;
align-items: center;
margin-left: 15upx;
margin-bottom: -4upx;
}
.table{
background-color: #FAFAFA;
font-size: 26upx;
font-weight: bold;
width: 100%;
border-radius: 20upx;
overflow: hidden;
height: auto;
margin-top: 30upx;
margin-bottom: 20upx;
color: #414141;
}
</style>