327 lines
7.0 KiB
Vue
327 lines
7.0 KiB
Vue
<template>
|
||
<view class="myDiamond_content">
|
||
<view class="subgift_list_total" v-show="dataLength>0">
|
||
<view class="subgift_list_item">
|
||
<view class="subgift_list_itemInfo">
|
||
<view class="card_info_total">
|
||
<image src="https://img.agrimedia.cn/diamondCard.png"></image>
|
||
<view class="card_info">
|
||
<view>
|
||
<text>持卡人：</text>
|
||
<view>{{data.nickname}}</view>
|
||
</view>
|
||
<!-- <view>
|
||
<text>唯一凭证：</text>
|
||
<view>{{data.f_code}}</view>
|
||
</view> -->
|
||
|
||
</view>
|
||
</view>
|
||
<view class="card_num">{{ data.num}}</view>
|
||
</view>
|
||
<view class="card_list_item">
|
||
<view @click="toList(data.num)">转赠</view>
|
||
<view class="composeBtn" v-if="data.num>=100" @click="toCompose">立即合成</view>
|
||
<view class="compose" v-else>距离合成超级VIP消费补贴卡还差{{numMin}}个钻石</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view>
|
||
<u-modal :show="show" :title="titleModal" showCancelButton confirmText="确认" cancelText="取消"
|
||
confirmColor="#FFFFFF" cancelColor="#333333" @confirm="confirm" @cancel="cancel">
|
||
<view>合成后原钻石会自动销毁</view>
|
||
<view>合成后请于1-2分钟后查看权益卡到账情况</view>
|
||
</u-modal>
|
||
|
||
</view>
|
||
<view class="noData" v-show="dataLength==0">您还没有钻石卡哦！</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
|
||
import {
|
||
getGenCardInfo,
|
||
fenCardTOVip
|
||
} from "@/request/recharge/index.js";
|
||
|
||
export default {
|
||
mixins: [MescrollMixin],
|
||
data() {
|
||
return {
|
||
data: {
|
||
|
||
},
|
||
titleModal: "合成说明",
|
||
show: false,
|
||
dataLength: -100,
|
||
numMin: ""
|
||
}
|
||
},
|
||
onShow() {
|
||
this.getGenCardInfo()
|
||
},
|
||
methods: {
|
||
|
||
//获取列表
|
||
getGenCardInfo() {
|
||
getGenCardInfo().then((res) => {
|
||
if (res) {
|
||
const {
|
||
code,
|
||
data
|
||
} = res
|
||
if (code == 200) {
|
||
this.data = data || {}
|
||
this.dataLength = Object.keys(this.data).length
|
||
this.numMin = data.num < 100 ? (100 - data.num) : ""
|
||
}
|
||
}
|
||
}).catch((error) => {
|
||
console.log(error,"接口返回错误信息")
|
||
if(error.code==400){
|
||
this.dataLength=0
|
||
}
|
||
|
||
})
|
||
},
|
||
|
||
//合成钻石
|
||
toCompose() {
|
||
this.show = true
|
||
|
||
},
|
||
//跳转钻石转赠
|
||
toList(val) {
|
||
uni.navigateTo({
|
||
url: `/pages/pages-recharge/diamondSubgiftCard/index?diamondNum=${val}`
|
||
})
|
||
},
|
||
confirm() {
|
||
fenCardTOVip().then((res) => {
|
||
if (res) {
|
||
const {
|
||
code,
|
||
data
|
||
} = res
|
||
|
||
if (code == 200) {
|
||
this.getGenCardInfo()
|
||
uni.showToast({
|
||
title: '合成成功',
|
||
icon: 'none',
|
||
});
|
||
|
||
this.show = false
|
||
}
|
||
}
|
||
}).catch((error) => {
|
||
this.show = false
|
||
})
|
||
},
|
||
cancel() {
|
||
this.show = false
|
||
}
|
||
},
|
||
|
||
};
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
page {
|
||
background: #f5f5f5;
|
||
}
|
||
|
||
.myDiamond_content {
|
||
.noData {
|
||
position: absolute;
|
||
top: 50%;
|
||
left: 50%;
|
||
transform: translate(-50%, -50%);
|
||
font-size: 28rpx;
|
||
color: #999999
|
||
}
|
||
|
||
/deep/ .u-line {
|
||
height: 0 !important;
|
||
width: 0 !important;
|
||
}
|
||
|
||
/deep/ .u-modal__button-group__wrapper {
|
||
flex-basis: auto;
|
||
flex-shrink: 0;
|
||
flex-grow: 0;
|
||
}
|
||
|
||
/deep/ .group__wrapper__text {
|
||
font-size: 28rpx;
|
||
}
|
||
|
||
/deep/ .u-modal__content {
|
||
padding: 12px 25px 25px 25px;
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: center;
|
||
align-items: center;
|
||
|
||
view:nth-child(1) {
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Semibold, PingFang SC;
|
||
font-weight: 600;
|
||
color: #333333;
|
||
padding-top: 20rpx;
|
||
padding-bottom: 10rpx;
|
||
}
|
||
|
||
view:nth-child(2) {
|
||
font-size: 24rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #999999
|
||
}
|
||
|
||
}
|
||
|
||
/deep/.u-modal__title {
|
||
font-size: 32rpx;
|
||
font-family: PingFangSC-Semibold, PingFang SC;
|
||
font-weight: 600;
|
||
color: #333333;
|
||
background: linear-gradient(117deg, #FFFBF7 0%, #FFF5EB 100%);
|
||
padding-bottom: 26rpx;
|
||
padding-top: 26rpx;
|
||
padding-bottom: 20rpx !important;
|
||
}
|
||
|
||
/deep/.u-modal__button-group {
|
||
display: flex;
|
||
flex-direction: row;
|
||
justify-content: center;
|
||
margin-bottom: 40px;
|
||
}
|
||
|
||
/deep/.u-modal__button-group__wrapper--cancel {
|
||
width: 212rpx;
|
||
height: 88rpx;
|
||
line-height: 88rpx;
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Semibold, PingFang SC;
|
||
font-weight: 600;
|
||
border: 2rpx solid #EDEDED;
|
||
border-radius: 20rpx;
|
||
margin-right: 40rpx;
|
||
}
|
||
|
||
/deep/.u-modal__button-group__wrapper--confirm {
|
||
width: 212rpx;
|
||
height: 88rpx;
|
||
line-height: 88rpx;
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Semibold, PingFang SC;
|
||
font-weight: 600;
|
||
background: linear-gradient(90deg, #FFAD02 0%, #FD8F3B 100%);
|
||
border-radius: 20rpx;
|
||
}
|
||
|
||
.subgift_list_total {
|
||
margin: 24rpx;
|
||
|
||
.subgift_list_item {
|
||
border-radius: 20rpx;
|
||
background: #fff;
|
||
margin-bottom: 24rpx;
|
||
padding: 24rpx;
|
||
|
||
.subgift_list_itemInfo {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
}
|
||
|
||
image {
|
||
width: 224rpx;
|
||
height: 168rpx;
|
||
border-radius: 20rpx;
|
||
margin-right: 20rpx;
|
||
}
|
||
|
||
.card_info_total {
|
||
display: flex;
|
||
|
||
.card_info {
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: center;
|
||
}
|
||
|
||
.card_info>view {
|
||
// margin-bottom: 20rpx;
|
||
}
|
||
|
||
.card_info>view text {
|
||
font-size: 24rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #999999;
|
||
}
|
||
|
||
.card_info>view view {
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Semibold, PingFang SC;
|
||
font-weight: 600;
|
||
color: #333333;
|
||
}
|
||
}
|
||
|
||
.card_num {
|
||
font-size: 24rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #999999
|
||
}
|
||
}
|
||
|
||
.card_list_item {
|
||
margin-top: 20rpx;
|
||
display: flex;
|
||
|
||
view {
|
||
height: 60rpx;
|
||
line-height: 60rpx;
|
||
border-radius: 10rpx;
|
||
}
|
||
|
||
view:nth-child(1) {
|
||
width: 122rpx;
|
||
border: 2rpx solid #DEDEDE;
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #333333;
|
||
text-align: center;
|
||
margin-right: 20rpx;
|
||
}
|
||
|
||
.compose {
|
||
background: #EDEDED;
|
||
flex: 1;
|
||
font-size: 24rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #999999;
|
||
text-align: center;
|
||
}
|
||
|
||
.composeBtn {
|
||
flex: 1;
|
||
background: #FF7700;
|
||
font-size: 24rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #FFFFFF;
|
||
text-align: center;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</style>
|