132 lines
3.8 KiB
Vue
132 lines
3.8 KiB
Vue
<template>
|
|
<view class="content">
|
|
<TopSafe></TopSafe>
|
|
<Header title="物流信息" />
|
|
<view class="setting-view">
|
|
<view class="express-panel">
|
|
<view class="top-one" style="margin-top:12rpx">
|
|
<u-icon name="email" color="#333" size="20"></u-icon>
|
|
<text class="text-24 text-fu text-space" style="margin-left:10rpx;line-height: 1.4;margin-right:12rpx">{{curData && `${curData.items[0].expressName}:`}}</text>
|
|
<text class="text-24 text-gray text-space" style="margin-left:10rpx;line-height: 1.4;margin-right:12rpx">{{curData && `${curData.items[0].expressNo}`}}</text>
|
|
<up-image src="/static/common/copy.png" width="14" height="14" bgColor="#f1f6ff00"
|
|
@click="copyData(curData ? curData.items[0].expressNo :'')"></up-image>
|
|
</view>
|
|
<view class="top-one" style="border-bottom:2rpx solid #eee">
|
|
<u-icon name="map" color="#333" size="20"></u-icon>
|
|
<text class="text-24 text-fu text-space" style="margin-left:10rpx;line-height: 1.4;margin-right:12rpx">收货地址</text>
|
|
<text class="text-24 text-zu text-space" style="margin-left:10rpx;line-height: 1.4;margin-right:12rpx">{{curData && `${curData.countryName} ${curData.cityName} ${curData.areaName} ${curData.address}`}}</text>
|
|
</view>
|
|
<u-steps current="0" direction="column" dot activeColor="#7934F6" style="margin-top:20rpx">
|
|
<u-steps-item :style="`width:calc(100vw - 48rpx)`"
|
|
:title="item.areaName + ' ' + item.curTime" :desc="item.desc" v-for="(item,index) in express.logisticsTraceDetailList" :key="index"></u-steps-item>
|
|
</u-steps>
|
|
</view>
|
|
|
|
|
|
</view>
|
|
<up-toast ref="uToastRef"></up-toast>
|
|
<!-- 腾讯电子签H5 → 集成到UniApp -->
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { getUserInfo,uploadAvatar } from '@/api/auth.js';
|
|
import { uploadImage, uploadImg } from '@/api/common.js';
|
|
import { IMG_TYPE } from '@/utils/enumUtils.js';
|
|
import { BASE_URL, Authorization } from '@/utils/config.js';
|
|
import { getStorageFun, TOKEN_NAME,clear } from '@/utils/auth.js';
|
|
import Header from '@/components/common/header.vue';
|
|
import TopSafe from '@/components/common/top-safe.nvue'
|
|
import MyBtn from '@/components/common/my-btn.vue'
|
|
import func from '@/utils/func.js';
|
|
import { copyData } from '@/utils/index.js';
|
|
|
|
import {
|
|
getDetail,
|
|
orderLogistics
|
|
} from "@/api/order.js";
|
|
|
|
export default {
|
|
components: { Header, TopSafe,MyBtn },
|
|
data() {
|
|
return {
|
|
express:null,
|
|
curData:null,
|
|
id:0
|
|
};
|
|
},
|
|
|
|
onLoad(option) {
|
|
// this.userinfo();
|
|
if(option && option.id){
|
|
this.id = Number(option.id);
|
|
this.init();
|
|
}
|
|
},
|
|
methods: {
|
|
copyData,
|
|
init() {
|
|
this.detail();
|
|
},
|
|
detail(){
|
|
let params = {
|
|
id:this.id
|
|
}
|
|
getDetail(params).then(res=>{
|
|
if(res.bizcode == 100){
|
|
this.curData = res.data;
|
|
if(this.curData.items[0].expressNo){
|
|
this.getOrderLogistics();
|
|
}
|
|
}
|
|
console.log('id',res)
|
|
})
|
|
},
|
|
getOrderLogistics(){
|
|
let params = {
|
|
mailNo:this.curData.items[0].expressNo
|
|
}
|
|
orderLogistics(params).then(res=>{
|
|
if(res.bizcode == 100){
|
|
this.express = res.data;
|
|
this.express.logisticsTraceDetailList.forEach(item=>{
|
|
item.curTime = func.formatDate(new Date(item.time), 2);
|
|
})
|
|
|
|
}
|
|
})
|
|
}
|
|
|
|
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.setting-view {
|
|
width: 100%;
|
|
height: calc(100% - 88rpx - var(--status-bar-height));
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
.express-panel{
|
|
width:100%;
|
|
margin-top:24rpx;
|
|
height: calc(100% - 24rpx);
|
|
padding: 0 32rpx;
|
|
box-sizing: border-box;
|
|
overflow-y: auto;
|
|
display: flex;
|
|
flex-direction: column;
|
|
background-color: #fff;
|
|
.top-one{
|
|
width:100%;
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-items: center;
|
|
min-height:70rpx;
|
|
}
|
|
}
|
|
}
|
|
</style>
|