174 lines
3.3 KiB
Vue
174 lines
3.3 KiB
Vue
<template>
|
|
<view class="">
|
|
<view class="header">
|
|
<!-- 顶部导航栏 -->
|
|
<z-nav-bar title="物流详情" bgColor="red"></z-nav-bar>
|
|
<u-tabs active-color="#2979ff" inactive-color="#606266" bar-height="6" bar-width="40" v-if="deliverList"
|
|
name="name" :list="deliverList" :is-scroll="false" :current="current" @change="tabchange"></u-tabs>
|
|
<view class="deliverCntent">
|
|
<view class="" v-for="(list, index1) in deliverDetails" :key="index1">
|
|
<view v-show="index1 == current">
|
|
<view class="kuaidiItem">{{list.ShipperName}}{{list.LogisticCode}}</view>
|
|
<view class="item" v-for="(item, index) in list.Traces">
|
|
<view class="flexbox">
|
|
|
|
<view class="img_icon "></view>
|
|
<view class="wuliu">
|
|
<view class="time">{{item.AcceptTime}}</view>
|
|
<view class="content">{{item.AcceptStation}}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!-- <u-loading color="red" :show="loading"></u-loading> -->
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import $http from '@/config/requestConfig.js';
|
|
// import Loading from '../../'
|
|
import {
|
|
mapState
|
|
} from 'vuex';
|
|
import loginVue from '../user/login.vue';
|
|
export default {
|
|
data() {
|
|
return {
|
|
loading: false,
|
|
orderId: null,
|
|
deliverDetails: [{
|
|
Traces: []
|
|
}],
|
|
current: 0,
|
|
deliverList: [{
|
|
name: null
|
|
}],
|
|
deliverDetailsLength: null
|
|
}
|
|
},
|
|
onLoad(e) {
|
|
this.orderId = e.objId
|
|
},
|
|
onShow() {
|
|
this.getdeliverDetails()
|
|
},
|
|
computed: {
|
|
...mapState(['userInfo']),
|
|
},
|
|
methods: {
|
|
tabchange(item) {
|
|
console.log(item)
|
|
this.current = item.index
|
|
},
|
|
// 获取物流
|
|
getdeliverDetails() {
|
|
uni.showLoading()
|
|
this.$http
|
|
.post(`/book/buyorder/queryFMS?orderId=${this.orderId}`)
|
|
.then(res => {
|
|
// console.log(res, '物流信息')
|
|
if (res && res.code === 0) {
|
|
uni.hideLoading()
|
|
this.deliverDetails = res.rntStr
|
|
//console.log(res.rntStr)
|
|
res.rntStr.forEach((item, index) => {
|
|
item.Traces = item.Traces.reverse()
|
|
// console.log(item)
|
|
this.deliverList[index].name = item.ShipperName
|
|
})
|
|
}
|
|
})
|
|
},
|
|
|
|
|
|
|
|
}
|
|
}
|
|
</script>
|
|
<style>
|
|
.item:first-child::before {
|
|
background-color: #6fca78 !important
|
|
}
|
|
</style>
|
|
<style lang="scss" scoped>
|
|
.u-tabs {
|
|
background: #fff
|
|
}
|
|
|
|
.xiangqing {
|
|
overflow: hidden;
|
|
|
|
img {
|
|
display: block;
|
|
max-width: 100%;
|
|
}
|
|
}
|
|
|
|
.kuaidiItem {
|
|
padding: 10px;
|
|
color: #666
|
|
}
|
|
|
|
.deliverCntent {
|
|
.img_icon {
|
|
border-left: 2px solid #eee;
|
|
}
|
|
line-height:20px;
|
|
padding: 32rpx;
|
|
position: relative;
|
|
background-color: #fff;
|
|
margin-bottom: 20rpx;
|
|
border-top: 1px solid #eee;
|
|
font-size: 24rpx;
|
|
color:#777;
|
|
.item {
|
|
padding-left: 10px;
|
|
position: relative;
|
|
}
|
|
|
|
.item:before {
|
|
display: inline-block;
|
|
width: 10px;
|
|
height: 10px;
|
|
border-radius: 100%;
|
|
background: #eee;
|
|
left: 6px;
|
|
top: 0;
|
|
content: "";
|
|
position: absolute;
|
|
}
|
|
|
|
.time {
|
|
color: #888;
|
|
font-size: 14px;
|
|
margin-bottom: 5px
|
|
}
|
|
|
|
.content {
|
|
padding-bottom: 14px;
|
|
}
|
|
}
|
|
|
|
.flexbox {
|
|
display: flex;
|
|
}
|
|
|
|
.img_icon {
|
|
padding-right: 5px;
|
|
}
|
|
|
|
.moreBtnF {
|
|
align-items: center;
|
|
padding: 30rpx;
|
|
height: 100%;
|
|
position: absolute;
|
|
right: 0;
|
|
top: 0;
|
|
z-index: 1;
|
|
background-color: rgba(255, 255, 255, .9);
|
|
}
|
|
</style>
|