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.
|
|
|
|
|
<!--
|
|
|
|
|
|
* @Author: ch
|
|
|
|
|
|
* @Date: 2022-05-08 01:14:03
|
|
|
|
|
|
* @LastEditors: ch
|
|
|
|
|
|
* @LastEditTime: 2022-05-09 21:39:31
|
|
|
|
|
|
* @Description: file content
|
|
|
|
|
|
-->
|
|
|
|
|
|
<template>
|
|
|
|
|
|
<div>
|
|
|
|
|
|
<div class="box">
|
|
|
|
|
|
<StatusInfo :orderInfo="orderInfo" @cancel="getOrderInfo"
|
|
|
|
|
|
@receive="getOrderInfo" @payFinish="getOrderInfo"/>
|
|
|
|
|
|
<StatusStep :orderInfo="orderInfo" />
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<LogisitcsInfo :orderInfo="orderInfo" />
|
|
|
|
|
|
<div class="pay-type" v-if="orderInfo.payType !== 1">
|
|
|
|
|
|
<p>支付方式：{{orderInfo.payTypeDesc}}</p>
|
|
|
|
|
|
<p>支付时间：{{orderInfo.submitTime}}</p>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<GoodsInfo :orderInfo="orderInfo"/>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
|
|
|
import {ApiGetOrderDetail} from '@/plugins/api/order';
|
|
|
|
|
|
import StatusInfo from './module/StatusInfo.vue';
|
|
|
|
|
|
import StatusStep from './module/StatusStep.vue';
|
|
|
|
|
|
import LogisitcsInfo from './module/LogisitcsInfo.vue';
|
|
|
|
|
|
import GoodsInfo from './module/GoodsInfo.vue';
|
|
|
|
|
|
export default {
|
|
|
|
|
|
components: { StatusInfo, StatusStep, LogisitcsInfo, GoodsInfo },
|
|
|
|
|
|
data(){
|
|
|
|
|
|
return {
|
|
|
|
|
|
orderInfo : {}
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
mounted(){
|
|
|
|
|
|
this.getOrderInfo();
|
|
|
|
|
|
},
|
|
|
|
|
|
methods:{
|
|
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
|
* 获取订单最新信息
|
|
|
|
|
|
*/
|
|
|
|
|
|
async getOrderInfo(){
|
|
|
|
|
|
const {error, result} = await ApiGetOrderDetail(this.$route.query.id);
|
|
|
|
|
|
if(error){
|
|
|
|
|
|
this.$message.warning(error.message);
|
|
|
|
|
|
return false;
|
|
|
|
|
|
}
|
|
|
|
|
|
this.orderInfo = {...result};
|
|
|
|
|
|
},
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
|
|
|
.box{
|
|
|
|
|
|
border: 1px solid #ddd;
|
|
|
|
|
|
border-radius: 4px;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
}
|
|
|
|
|
|
.pay-type{
|
|
|
|
|
|
border: 1px solid #ddd;
|
|
|
|
|
|
background: #f8f8f8;
|
|
|
|
|
|
height: 59px;
|
|
|
|
|
|
line-height: 59px;
|
|
|
|
|
|
padding: 0 30px;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
|
}
|
|
|
|
|
|
</style>
|
