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.
289 lines
10 KiB
289 lines
10 KiB
<template>
|
|
<view class="order-detail">
|
|
<view class="od-header">
|
|
<view class="oh-stadium">
|
|
<image class="os-img" mode="aspectFit" :src="orderInfo.logo || ''"></image>
|
|
<view class="os-name">{{ orderInfo.stadium_name || '-' }}</view>
|
|
</view>
|
|
<view class="oh-bot">
|
|
<kv-line label="订单编号：">
|
|
<template slot="default">{{ orderInfo.order_no || '-' }}</template>
|
|
<template slot="right">
|
|
<view class="ob-status">{{ getPayStatusTxt(orderInfo.pay_status || -1) }}</view>
|
|
</template>
|
|
</kv-line>
|
|
<kv-line label="创建时间：">{{ orderInfo.created_at || '-' }}</kv-line>
|
|
<kv-line label="手机号码：">{{ orderInfo.mobile || '-' }}</kv-line>
|
|
<kv-line label="用户昵称：">{{ orderInfo.nick_name || '-' }}</kv-line>
|
|
<kv-line label="来源：">{{ orderInfo.source || '-' }}</kv-line>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="od-goods">
|
|
<view class="og-tit">订单信息</view>
|
|
<view class="og-lines">
|
|
<kv-line label="名称：">{{ orderInfo.water_card_name || '-' }}</kv-line>
|
|
<kv-line label="水阀卡号：">{{ orderInfo.water_card_no || '-' }}</kv-line>
|
|
<kv-line label="时长：">{{ orderInfo.duration_text || '-' }}</kv-line>
|
|
<kv-line label="途径：">{{ orderInfo.desc || '-' }}</kv-line>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="od-price-info">
|
|
<kvs-line label="金额小计">¥{{ orderInfo.amount || 0 }}</kvs-line>
|
|
<kvs-line label="积分抵扣">-¥{{ orderInfo.deduction_amount || 0 }}</kvs-line>
|
|
<kvs-line label="折扣金额">-¥{{ orderInfo.discount_amount || 0 }}</kvs-line>
|
|
<kvs-line label="优惠券优惠">-¥{{ orderInfo.coupons_amount || 0 }}</kvs-line>
|
|
<view class="opi-total">
|
|
合计支付：<text class="ot-num">￥{{ orderInfo.pay_amount || 0 }}</text>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="od-pay-info">
|
|
<view class="opi-tit">支付信息</view>
|
|
<view class="opi-lines">
|
|
<kv-line label="支付方式：">{{ _extension.pay_type_text || '-' }}</kv-line>
|
|
<kv-line label="支付时间：">{{ orderInfo.pay_time || '-' }}</kv-line>
|
|
<kv-line label="微信交易号：">{{ orderInfo.trade_no || '-' }}</kv-line>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 退款列表 -->
|
|
<block v-for="(e, i) in refundList" :key="i">
|
|
<view class="od-space"></view>
|
|
<order-refund-info
|
|
:refund_price="e.amount || 0"
|
|
:refund_no="e.refund_no || '-'"
|
|
:refund_time="e.refund_time || '-'"
|
|
:refund_reason="e.reason || '-'"
|
|
:nameKey="i + 1"
|
|
></order-refund-info>
|
|
</block>
|
|
|
|
<order-refund-fixed
|
|
:pay_amount="orderInfo.pay_amount || 0"
|
|
:refund_amount="orderInfo.refund_amount || 0"
|
|
:refund_times="(refundList&&refundList.length) || 0"
|
|
@click:button="refunndBtn"
|
|
></order-refund-fixed>
|
|
|
|
<order-refund-modal
|
|
ref="orderRefundModal"
|
|
></order-refund-modal>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import kv_line from "@/components/kv_line.vue";
|
|
import kvs_line from "@/components/kvs_line.vue";
|
|
|
|
import orderRefundFixed from '@/components/order_refund/fixed.vue'
|
|
import orderRefundModal from '@/components/order_refund/modal.vue';
|
|
import orderRefundInfo from '@/components/order_refund/info.vue';
|
|
|
|
import { SHOWER_API } from "../../js/api";
|
|
import server from "../../js/server";
|
|
import { routeTo, showLoad, hideLoad, showNone, formatDate } from "@/utils/util";
|
|
export default {
|
|
components: {
|
|
'kv-line': kv_line,
|
|
'kvs-line': kvs_line,
|
|
'order-refund-fixed': orderRefundFixed,
|
|
'order-refund-modal': orderRefundModal,
|
|
'order-refund-info': orderRefundInfo
|
|
},
|
|
computed: {
|
|
_extension(){
|
|
return this.orderInfo?.extension || {};
|
|
}
|
|
},
|
|
data(){
|
|
return {
|
|
orderInfo: {},
|
|
refundList: [],
|
|
}
|
|
},
|
|
onLoad(options){
|
|
this.getCardOrderDetails({
|
|
id: options?.id,
|
|
brand_id: options?.brand_id,
|
|
order_no: options?.order_no
|
|
})
|
|
.then(res=>{
|
|
if(res.order_no)this.getRefundInfo(res.order_no || '');
|
|
})
|
|
},
|
|
methods: {
|
|
refunndBtn(){
|
|
let { orderInfo, _extension, refundList } = this;
|
|
this.$refs.orderRefundModal.show({
|
|
stadium_name: orderInfo?.stadium_name ?? '',
|
|
order_no: orderInfo?.order_no ?? '',
|
|
mobile: orderInfo?.mobile ?? '',
|
|
refundable_amount: +_extension?.refundable_amount || 0,
|
|
refundable_integral: +_extension?.refundable_integral || 0,
|
|
refund_times: refundList?.length || 0,
|
|
confirm: e => {
|
|
console.log('confirm --->', e);
|
|
this.orderRefund({
|
|
order_no: orderInfo?.order_no || '',
|
|
amount: e.refund_amount || 0,
|
|
integral: e.refund_integral || 0,
|
|
brand_id: orderInfo?.brand_id || ''
|
|
})
|
|
}
|
|
});
|
|
},
|
|
orderRefund({ order_no = '', amount = 0, integral = 0, brand_id }){
|
|
showLoad();
|
|
server.post({
|
|
url: SHOWER_API.orderRefund,
|
|
data: { order_no, amount, integral, brand_id },
|
|
isDefaultGet: false
|
|
})
|
|
.then(res=>{
|
|
hideLoad();
|
|
if(res.data.code == 0){
|
|
showNone(res.data.message || '操作成功！');
|
|
}else{
|
|
showNone(res.data.message || '操作失败！');
|
|
}
|
|
})
|
|
.catch(hideLoad)
|
|
.finally(_=>
|
|
setTimeout(_=>{
|
|
let { orderInfo } = this;
|
|
this.getCardOrderDetails({
|
|
id: orderInfo?.id,
|
|
order_no: orderInfo?.order_no,
|
|
brand_id: orderInfo?.brand_id,
|
|
})
|
|
.then(res=>{
|
|
if(res.order_no)this.getRefundInfo(res.order_no || '');
|
|
})
|
|
}, 1200)
|
|
);
|
|
},
|
|
async getRefundInfo(order_no){
|
|
try{
|
|
let _refundRes = await this.$store.dispatch('getOrderRefundList', order_no);
|
|
let _ls = _refundRes?.data?.data?.list || [];
|
|
this.refundList = _ls;
|
|
}catch(err){
|
|
console.warn('shower order detail getRefundInfo err', err);
|
|
}
|
|
},
|
|
getPayStatusTxt(payStatus){
|
|
let _txt = '';
|
|
switch(payStatus){
|
|
case 0: _txt = '未支付'; break;
|
|
case 1: _txt = '已支付'; break;
|
|
case 2: _txt = '已使用'; break;
|
|
case 4: _txt = '已退款'; break;
|
|
case 5: _txt = '退款中'; break;
|
|
case 6: _txt = '拒绝退款'; break;
|
|
case 7: _txt = '关闭支付'; break;
|
|
case 8: _txt = '使用中'; break;
|
|
default: _txt = '-';
|
|
}
|
|
return _txt;
|
|
},
|
|
getCardOrderDetails({
|
|
id = '', brand_id = '', order_no = ''
|
|
}){
|
|
showLoad();
|
|
return server.get({
|
|
url: SHOWER_API.cardOrderDetails,
|
|
data: { brand_id, id, order_no },
|
|
failMsg: '获取信息失败'
|
|
})
|
|
.then(res => {
|
|
hideLoad();
|
|
return this.orderInfo = res || {};
|
|
})
|
|
.catch(err => {
|
|
hideLoad();
|
|
console.warn('shower order details err --->', err);
|
|
})
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.order-detail{
|
|
@include isPd(24upx);
|
|
.od-space{
|
|
padding-top: 24upx;
|
|
}
|
|
.od-header{
|
|
padding: 0 24upx;
|
|
background: #fff;
|
|
.oh-stadium{
|
|
padding: 24upx 0;
|
|
border-bottom: 1px solid #D8D8D8;
|
|
@include ctf;
|
|
.os-img{
|
|
flex-shrink: 0;
|
|
margin-right: 14upx;
|
|
width: 40upx;
|
|
height: 40upx;
|
|
}
|
|
.os-name{
|
|
@include flcw(28upx, 40upx, #1A1A1A, 500);
|
|
@include tHide;
|
|
}
|
|
}
|
|
.oh-bot{
|
|
padding-top: 24upx;
|
|
padding-bottom: 30upx;
|
|
.ob-status{
|
|
text-align: right;
|
|
@include flcw(28upx, 40upx, #9A9A9D);
|
|
}
|
|
}
|
|
}
|
|
.od-goods{
|
|
margin-top: 24upx;
|
|
padding: 20upx 24upx 0;
|
|
background: #fff;
|
|
|
|
.opi-tit{
|
|
@include flcw(32upx, 44upx, #1A1A1A);
|
|
}
|
|
.og-lines{
|
|
margin-top: 28upx;
|
|
padding-bottom: 30upx;
|
|
border-bottom: 1px solid #D8D8D8;
|
|
}
|
|
|
|
}
|
|
.od-price-info{
|
|
padding: 30upx;
|
|
background: #fff;
|
|
.opi-total{
|
|
text-align: right;
|
|
@include flcw(28upx, 50upx, #9A9A9D);
|
|
.ot-num{
|
|
color: #1A1A1A;
|
|
font-weight: 500;
|
|
}
|
|
}
|
|
}
|
|
.od-pay-info{
|
|
margin-top: 24upx;
|
|
padding: 30upx 24upx;
|
|
background: #fff;
|
|
.opi-tit{
|
|
@include flcw(32upx, 44upx, #1A1A1A);
|
|
}
|
|
.opi-lines{
|
|
margin-top: 16upx;
|
|
.ob-copy{
|
|
margin-left: 20upx;
|
|
@include flcw(28upx, 40upx, $mColor);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style>
|