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.
103 lines
2.5 KiB
103 lines
2.5 KiB
<!--
|
|
* @Author: ch
|
|
* @Date: 2022-03-31 17:53:43
|
|
* @LastEditors: ch
|
|
* @LastEditTime: 2022-03-31 20:43:19
|
|
* @Description: file content
|
|
-->
|
|
<template>
|
|
<view class="status">
|
|
<image class="status--icon" :src="ctxCon.icon"></image>
|
|
<view class="status--name">{{ctxCon.name}}</view>
|
|
<view class="status--desc">{{ctxCon.tips}}</view>
|
|
</view>
|
|
</template>
|
|
<script>
|
|
import {DictOrderStatus } from '@/common/dicts/order'
|
|
import Enum from "@/common/plugins/enum"
|
|
export default {
|
|
props : {
|
|
orderInfo : {
|
|
type : Object,
|
|
default : {}
|
|
}
|
|
},
|
|
data(){
|
|
return {
|
|
ctxData : {
|
|
awaitPay : {name:'待付款', tips:'', icon: require('@/static/order/fk.png')},
|
|
close : {name:'交易关闭' , tips:'关闭原因', icon: require('@/static/order/qx.png')},
|
|
awaitSend : {name:'等待发货', tips:'您的包裹整装待发', icon: require('@/static/order/fh.png')},
|
|
finishSend : {name:'已发货', tips:'您的包裹正向您飞来', icon: require('@/static/order/fh.png')},
|
|
finishReceiving : {name:'已收货', icon: require('@/static/order/fh.png')},
|
|
end : {name:'交易成功', icon: require('@/static/order/cg.png')},
|
|
},
|
|
ctxCon : {},
|
|
secondNum : 0
|
|
}
|
|
},
|
|
mounted(){
|
|
|
|
},
|
|
watch : {
|
|
orderInfo(nVal){
|
|
this.ctxCon = this.ctxData[this.statusKey];
|
|
if(this.statusKey === 'awaitPay'){
|
|
let expireTime = (new Date(this.orderInfo.expireTime)).getTime(),
|
|
curTime = (new Date(this.orderInfo.serverTime)).getTime(),
|
|
second = Math.floor((expireTime - curTime) / 1000);
|
|
this.secondNum = second > 0 ? second : 0;
|
|
this.timer()
|
|
}else if(this.statusKey === 'close'){
|
|
this.ctxCon.tips = this.orderInfo.closeReason;
|
|
}
|
|
}
|
|
},
|
|
computed:{
|
|
// 从字典表获取状态key
|
|
statusKey (){
|
|
return DictOrderStatus[this.orderInfo.orderStatus].value
|
|
}
|
|
},
|
|
methods:{
|
|
/**
|
|
* 待付款的计时器
|
|
*/
|
|
timer(){
|
|
if(this.secondNum == 0){
|
|
this.$emit('close');
|
|
return;
|
|
}
|
|
this.secondNum--;
|
|
let minute = parseInt(this.secondNum / 60);
|
|
let second = parseInt(this.secondNum % 60);
|
|
this.ctxCon.tips = `剩余${minute > 0 ? `${minute}分` : ''} ${second}秒`;
|
|
// console.log(this.ctxCon.tips);
|
|
setTimeout(()=>this.timer(),1000)
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
<style lang="scss" scoped>
|
|
|
|
.status{
|
|
padding: 30rpx 60rpx 0;
|
|
position: relative;
|
|
&--icon{
|
|
width: 100rpx;
|
|
height: 100rpx;
|
|
position: absolute;
|
|
right: 60rpx;
|
|
top: 10rpx;
|
|
}
|
|
&--name{
|
|
font-size: 36rpx;
|
|
margin-bottom: 20rpx;
|
|
}
|
|
&--desc{
|
|
font-size: $font-size-base;
|
|
color: $color-grey4;
|
|
margin-bottom: 48rpx;
|
|
}
|
|
}
|
|
</style> |