|
|
|
@ -2,70 +2,220 @@ |
|
|
|
<view class="order-detail"> |
|
|
|
<view class="od-header"> |
|
|
|
<view class="oh-stadium"> |
|
|
|
<image class="os-img"></image> |
|
|
|
<view class="os-name">欧轩智能场馆(羽毛球永泰店)</view> |
|
|
|
<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">13800138000</template> |
|
|
|
<kv-line label="订单编号："> |
|
|
|
<template slot="default">{{ orderInfo.order_no || '-' }}</template> |
|
|
|
<template slot="right"> |
|
|
|
<view class="ob-status">交易完成</view> |
|
|
|
<view class="ob-status">{{ getPayStatusTxt(orderInfo.pay_status || -1) }}</view> |
|
|
|
</template> |
|
|
|
</kv-line> |
|
|
|
<kv-line label="用户昵称：">yiming</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-tit">订单信息</view> |
|
|
|
<view class="og-lines"> |
|
|
|
<kv-line label="名称：">沐浴</kv-line> |
|
|
|
<kv-line label="时长：">10分钟</kv-line> |
|
|
|
<kv-line label="价格：">￥4</kv-line> |
|
|
|
<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="金额小计">¥4</kvs-line> |
|
|
|
<kvs-line label="积分抵扣">-¥0.5</kvs-line> |
|
|
|
<kvs-line label="折扣金额">-¥0</kvs-line> |
|
|
|
<kvs-line label="优惠券优惠">-¥0</kvs-line> |
|
|
|
<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">￥3.5</text> |
|
|
|
合计支付：<text class="ot-num">￥{{ orderInfo.pay_amount || 0 }}</text> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
<view class="od-pay-info"> |
|
|
|
<view class="opi-tit">支付详情</view> |
|
|
|
<view class="opi-tit">支付信息</view> |
|
|
|
<view class="opi-lines"> |
|
|
|
<kv-line label="订单编号："> |
|
|
|
<template slot="default">sc20 0822 0815 6894</template> |
|
|
|
<template slot="right"> |
|
|
|
<view class="ob-copy">复制</view> |
|
|
|
</template> |
|
|
|
</kv-line> |
|
|
|
<kv-line label="支付方式：">微信支付</kv-line> |
|
|
|
<kv-line label="支付时间：">2020-08-22 10:12:25</kv-line> |
|
|
|
<kv-line label="交易流水号：">202009181255364564612622</kv-line> |
|
|
|
<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; |
|
|
|
@ -78,7 +228,6 @@ export default { |
|
|
|
margin-right: 14upx; |
|
|
|
width: 40upx; |
|
|
|
height: 40upx; |
|
|
|
background: skyblue; |
|
|
|
} |
|
|
|
.os-name{ |
|
|
|
@include flcw(28upx, 40upx, #1A1A1A, 500); |
|
|
|
|
