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.
274 lines
10 KiB
274 lines
10 KiB
<template>
|
|
<view class="card-detail">
|
|
<view class="cd-box cb-card">
|
|
<view class="cc-stadium">
|
|
<view class="cs-txt">{{ water_card.stadium_name || '' }}</view>
|
|
</view>
|
|
<view class="cc-lines">
|
|
<kv-line label-style="color: #1A1A1A;" label="水阀卡卡号：">{{ water_card.water_card_no || '' }}</kv-line>
|
|
<kv-line label-style="color: #1A1A1A;" label="手机号码：">{{ water_card.mobile || '' }}</kv-line>
|
|
<kv-line label-style="color: #1A1A1A;" label="微信昵称：">{{ water_card.nick_name || '' }}</kv-line>
|
|
<kv-line label-style="color: #1A1A1A;font-weitht: 500;" label="可用时长："><text class="cl-orange">{{ water_card.valid_duration_text || '' }}</text></kv-line>
|
|
</view>
|
|
<view class="cc-btns">
|
|
<view class="cb-item" @click="toRecords">消费记录</view>
|
|
<view class="cb-item red" @click="deductionBtn">扣费</view>
|
|
<view class="cb-item orange" @click="rechargeBtn">充值</view>
|
|
</view>
|
|
</view>
|
|
<view class="cd-box cd-record">
|
|
<view class="cr-tit">购卡记录</view>
|
|
<view class="cr-time">购卡 {{ water_card_order.pay_time || '-' }}</view>
|
|
<view class="cr-lines">
|
|
<kv-line label="名称：">{{ water_card.water_card_name || '-' }}</kv-line>
|
|
<kv-line label="时长：">{{ water_card_order.duration_text || '-' }}</kv-line>
|
|
<kv-line label="售价：">￥{{ water_card_order.amount || '0' }}</kv-line>
|
|
<kv-line label="支付金额：">￥{{ water_card_order.pay_amount || '0' }}</kv-line>
|
|
<kv-line label="途径：">{{ water_card.resource_text || '-' }}</kv-line>
|
|
</view>
|
|
</view>
|
|
|
|
<recharge-popup ref="rechangePopup"></recharge-popup>
|
|
<deduction-popup ref="deductionPopup"></deduction-popup>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import kv_line from "@/components/kv_line.vue";
|
|
import rechargePopup from "../../components/popup/recharge.vue";
|
|
import deductionPopup from "../../components/popup/deduction.vue";
|
|
|
|
import { SHOWER_API } from "../../js/api";
|
|
import server from "../../js/server";
|
|
import { routeTo, showLoad, hideLoad, showNone, formatDate, jsonStr, showModal } from "@/utils/util";
|
|
export default {
|
|
components: {
|
|
'kv-line': kv_line,
|
|
'recharge-popup': rechargePopup,
|
|
'deduction-popup': deductionPopup
|
|
},
|
|
computed: {
|
|
water_card(){
|
|
let { cardInfo } = this;
|
|
return cardInfo?.water_card || {};
|
|
},
|
|
water_card_order(){
|
|
let { cardInfo } = this;
|
|
return cardInfo?.water_card_order || {};
|
|
}
|
|
},
|
|
data(){
|
|
return {
|
|
cardInfo: {}
|
|
}
|
|
},
|
|
onLoad(options){
|
|
let { id, brand_id } = options;
|
|
this.getCardInfo({ id, brand_id });
|
|
},
|
|
methods: {
|
|
rechargeBtn(){
|
|
let { water_card } = this;
|
|
this.$refs.rechangePopup.init({
|
|
water_card_no: water_card?.water_card_no || '',
|
|
mobile: water_card?.mobile || '',
|
|
valid_duration_text: water_card?.valid_duration_text || '',
|
|
success: rData => {
|
|
let _query = {
|
|
type: 5,
|
|
brand_id: water_card?.brand_id || '',
|
|
amount: rData?.pay_amount || 0,
|
|
stadiumInfo: {
|
|
id: water_card?.stadium_id || '',
|
|
name: water_card?.stadium_name || '',
|
|
logo: water_card?.stadium_logo || '',
|
|
},
|
|
};
|
|
uni.navigateTo({
|
|
url: `/subpackage/common/pages/pay_type_select?query=${jsonStr(_query)}`,
|
|
events: { payConfirm: pData => this.rechargePayConfirm({ rData, pData }) },
|
|
})
|
|
}
|
|
});
|
|
},
|
|
async rechargePayConfirm({ rData, pData }){
|
|
let { water_card } = this;
|
|
let _reqData = {
|
|
brand_id: water_card?.brand_id || '',
|
|
stadium_id: water_card?.stadium_id || '',
|
|
water_card_no: water_card?.water_card_no || '',
|
|
duration: rData?.duration || 0,
|
|
mobile: water_card?.mobile || '',
|
|
pay_type: this.getTextForType(pData?.payTypeName || ''),
|
|
pay_amount: pData?.amount || 0,
|
|
// 后端：都要传，，，（我也不知道什么原因
|
|
card_no: pData?.selectedCardNo || '',
|
|
order_no: pData?.selectedCardNo || ''
|
|
}
|
|
let _rechargeRes = await this.rechargePayReq(_reqData);
|
|
if(_rechargeRes === 'SUCCESS'){
|
|
setTimeout(_=>{
|
|
this.getCardInfo({ id: water_card?.id, brand_id: water_card?.brand_id });
|
|
}, 1200)
|
|
}
|
|
},
|
|
rechargePayReq(data){
|
|
showLoad();
|
|
return server.post({
|
|
url: SHOWER_API.CardRecharge,
|
|
data,
|
|
isDefaultGet: false,
|
|
})
|
|
.then(res => {
|
|
hideLoad();
|
|
let _data = res?.data || {};
|
|
if(_data.code === 0){
|
|
showModal({
|
|
title: '提示',
|
|
content: _data.message || '操作成功！'
|
|
})
|
|
return "SUCCESS";
|
|
// this.initData?.success?.('SUCCESS');
|
|
}else{
|
|
return Promise.reject(_data);
|
|
}
|
|
|
|
})
|
|
.catch(err => {
|
|
hideLoad();
|
|
showModal({
|
|
title: '提示',
|
|
content: err.message || '操作失败！'
|
|
})
|
|
console.warn('deduction deductionReq err --->', err);
|
|
})
|
|
},
|
|
|
|
// // 0: 微信支付 1: 支付宝支付 2: 储值卡支付 3:商家主动 4:押金抵扣 5：任务奖品 6：抖音团购兑换 7：付款码支付
|
|
getTextForType(payTxt){
|
|
switch(payTxt){
|
|
case '微信支付': return 0;
|
|
case '支付宝支付': return 1;
|
|
case '储值卡支付': return 2;
|
|
case '商家主动': return 3;
|
|
case '押金抵扣': return 4;
|
|
case '任务奖品': return 5;
|
|
case '抖音团购兑换': return 6;
|
|
case '付款码支付': return 7;
|
|
default: return 8;
|
|
}
|
|
},
|
|
deductionBtn(){
|
|
let { water_card } = this;
|
|
this.$refs.deductionPopup.init({
|
|
water_card_no: water_card?.water_card_no || '',
|
|
mobile: water_card?.mobile || '',
|
|
valid_duration_text: water_card?.valid_duration_text || '',
|
|
valid_duration: water_card?.valid_duration || '',
|
|
// 扣减提交参数
|
|
brand_id: water_card?.brand_id || '',
|
|
stadium_id: water_card?.stadium_id || '',
|
|
|
|
success: () => {
|
|
this.getCardInfo({ id: water_card?.id, brand_id: water_card?.brand_id });
|
|
}
|
|
});
|
|
},
|
|
toRecords(){
|
|
let { water_card } = this;
|
|
let _qryStr = `brand_id=${water_card?.brand_id || ''}&water_card_no=${water_card?.water_card_no || ''}`;
|
|
routeTo(`/subpackage/shower/pages/card/use_record?${_qryStr}`, 'nT');
|
|
},
|
|
getCardInfo({
|
|
id = '', brand_id = ''
|
|
}){
|
|
showLoad();
|
|
return server.get({
|
|
url: SHOWER_API.CardDetails,
|
|
data: { brand_id, id },
|
|
failMsg: '获取用水卡信息失败'
|
|
})
|
|
.then(res => {
|
|
hideLoad();
|
|
this.cardInfo = res || {};
|
|
|
|
})
|
|
.catch(err => {
|
|
hideLoad();
|
|
console.warn('card detail getCardInfo err --->', err);
|
|
// return Promise.reject(err);
|
|
})
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.card-detail{
|
|
padding: 24upx;
|
|
@include isPd(24upx);
|
|
.cd-box{
|
|
position: relative;
|
|
padding: 30upx;
|
|
background: #fff;
|
|
border-radius: 10upx;
|
|
&+.cd-box{
|
|
margin-top: 24upx;
|
|
}
|
|
}
|
|
.cb-card{
|
|
.cc-stadium{
|
|
.cs-txt{
|
|
@include flcw(28upx, 40upx, #333333, 500);
|
|
@include tHide;
|
|
}
|
|
&::after{
|
|
content: '';
|
|
display: block;
|
|
margin-top: 26upx;
|
|
height: 1px;
|
|
background: #D8D8D8;
|
|
}
|
|
}
|
|
.cc-lines{
|
|
padding-top: 20upx;
|
|
.cl-orange{
|
|
color: #FF873D;
|
|
font-weight: 500;
|
|
}
|
|
}
|
|
.cc-btns{
|
|
margin-top: 30upx;
|
|
@include ctf;
|
|
.cb-item{
|
|
width: 176upx;
|
|
text-align: center;
|
|
border: 2upx solid #9A9A9D;
|
|
border-radius: 10upx;
|
|
@include flcw(32upx, 76upx, #9a9a9d, 500);
|
|
&.red{
|
|
color: #EA5061;
|
|
border-color: #EA5061;
|
|
}
|
|
&.orange{
|
|
color: #FF873D;
|
|
border-color: #FF873D;
|
|
}
|
|
&+.cb-item{
|
|
margin-left: 58upx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.cd-record{
|
|
.cr-tit{
|
|
@include flcw(28upx, 40upx, #9C9C9F);
|
|
}
|
|
.cr-time{
|
|
margin-top: 20upx;
|
|
@include flcw(28upx, 52upx, #1A1A1A, 500);
|
|
}
|
|
}
|
|
|
|
}
|
|
</style>
|