127 lines
4.6 KiB
Vue
127 lines
4.6 KiB
Vue
<template>
|
||
<BasePage :back="back" title="订单详情">
|
||
<div class="tradelist-details" v-if="data.ordernum"
|
||
:style="`background: url(/img/mallDetail-bg.png) no-repeat;background-size: 100% auto;`">
|
||
<div class="top">
|
||
<img :src="`/img/mallDetail-i${data.state}.png`">
|
||
<b style="#d2220d">{{ data.statename }}</b>
|
||
</div>
|
||
|
||
<div class="_address">
|
||
<img src="/img/tradelistDetail-i5.png">
|
||
<div class="c">
|
||
<div>
|
||
{{ data.receiptrealname }}
|
||
<span>{{ data.receiptcellphone }}</span>
|
||
</div>
|
||
<p>
|
||
{{ data.receiptprovince }}{{ data.receiptcity }}{{ data.receiptcounty }}{{ data.receiptaddress
|
||
}}
|
||
</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="_goods" v-for="item in data.orderdetails" :key="item.id">
|
||
<img :src="$file(item.proimg)">
|
||
<div class="c">
|
||
<div class="name">
|
||
<span>{{ item.proname }}</span>
|
||
</div>
|
||
<div class="s">
|
||
<p>{{ item.proskuname?.split(';').join('/') }}</p>
|
||
</div>
|
||
<div class="price">
|
||
<b>
|
||
<span>￥</span>{{ item.saleprice?.toFixed(2) }}
|
||
</b>
|
||
<p>x{{ item.buynums }}</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="_detail">
|
||
<div class="p">
|
||
<p>
|
||
订单号：
|
||
<span>{{ data.ordernum }} <img @click="$copyText(data.ordernum); $showSuccessToast('复制成功')"
|
||
src="/img/copy.png"></span>
|
||
</p>
|
||
<p>
|
||
商品总数
|
||
<span>{{data.orderdetails?.reduce((sum, sku) => sum + sku.buynums, 0)}}</span>
|
||
</p>
|
||
<p>
|
||
商品总价
|
||
<span>￥{{ data.orderoriginalmoney?.toFixed(2) }}</span>
|
||
</p>
|
||
<p v-if="data.payquan > 0">
|
||
优惠券抵扣
|
||
<span>-￥{{ data.payquan?.toFixed(2) }}</span>
|
||
</p>
|
||
<p>
|
||
实付金额
|
||
<b style="color: #f00;">￥{{ data.needpay?.toFixed(2) }}</b>
|
||
</p>
|
||
<p>
|
||
下单时间
|
||
<span>{{ $formatGMT(data.addtime, 'yyyy-MM-dd HH:mm:ss') }}</span>
|
||
</p>
|
||
<p v-if="data.paytime">
|
||
付款时间
|
||
<span>{{ $formatGMT(data.paytime, 'yyyy-MM-dd HH:mm:ss') }}</span>
|
||
</p>
|
||
<p v-if="data.exporttime">
|
||
发货时间
|
||
<span>{{ $formatGMT(data.exporttime, 'yyyy-MM-dd HH:mm:ss') }}</span>
|
||
</p>
|
||
<p v-if="data.receipttime">
|
||
收货时间
|
||
<span>{{ $formatGMT(data.receipttime, 'yyyy-MM-dd HH:mm:ss') }}</span>
|
||
</p>
|
||
<p v-if="data.evaltime">
|
||
评价时间
|
||
<span>{{ $formatGMT(data.evaltime, 'yyyy-MM-dd HH:mm:ss') }}</span>
|
||
</p>
|
||
</div>
|
||
</div>
|
||
<!--
|
||
<van-button v-if="data.state == 0" type="primary" block round color="#fb2d2d"
|
||
style="height: 8.8vw; margin: 3.33vw;" @click="$navigate(`/Pay?ordernum=${data.ordernum}`)">
|
||
立即支付
|
||
</van-button> -->
|
||
</div>
|
||
</BasePage>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
name: 'TradeDetail',
|
||
data() {
|
||
return {
|
||
data: {},
|
||
}
|
||
},
|
||
mounted() {
|
||
console.log(this.data.state);
|
||
|
||
this.ordernum = this.$route.query.ordernum;
|
||
if (this.ordernum) {
|
||
this.loadData();
|
||
}
|
||
},
|
||
methods: {
|
||
back() {
|
||
this.$router.back();
|
||
},
|
||
async loadData() {
|
||
try {
|
||
const res = await this.$get(`/v1/client/FOrdersClient/${this.ordernum}`);
|
||
this.data = res.data;
|
||
} catch (err) {
|
||
this.$showFailToast(err.errmsg || '加载失败');
|
||
}
|
||
},
|
||
}
|
||
}
|
||
</script>
|