<template>
|
<div>
|
<div class="warp">
|
<div class="ingOrderDiv">
|
<div
|
class="ingOrder"
|
v-for="(item, i) in historyData"
|
:key="i"
|
@click="list3CardIconClick(item)"
|
>
|
<!-- 第一行 -->
|
<div class="firstLine">
|
<div class="leftIcon">
|
<div class="leftOneDiv">
|
<span class="leftOne">装</span>
|
</div>
|
<div class="leftLine"></div>
|
<div class="rightDiv">
|
<span class="rightone">卸</span>
|
</div>
|
</div>
|
<div class="centerTitle">
|
<view class="filedname exceedHide">
|
<text
|
v-if="item.orderType == '外销' || item.orderType == '内销'"
|
>{{ item.deptName }}</text
|
>
|
<text
|
v-else-if="
|
item.orderType == '外购' || item.orderType == '内购'
|
"
|
>{{ item.customerName }}</text
|
>
|
<text
|
v-else-if="
|
item.orderType == '转出' || item.orderType == '转入'
|
"
|
>
|
{{ item.filedName }}
|
</text>
|
</view>
|
<p class="centerLine"></p>
|
<view class="filedname exceedHide">
|
<text
|
v-if="item.orderType == '外销' || item.orderType == '内销'"
|
>{{ item.customerName }}</text
|
>
|
<text
|
v-else-if="
|
item.orderType == '外购' || item.orderType == '内购'
|
"
|
>{{ item.deptName }}</text
|
>
|
<text
|
v-else-if="
|
item.orderType == '转出' || item.orderType == '转入'
|
"
|
>
|
{{ item.toFiledName }}
|
</text>
|
</view>
|
</div>
|
<div class="rightIcon">
|
<u-icon
|
name="map"
|
color="#4978F0"
|
@click.stop="skipMap(item)"
|
size="40"
|
></u-icon>
|
<u-icon
|
@click.stop="skipMap(item)"
|
name="map"
|
color="#4978F0"
|
size="40"
|
></u-icon>
|
</div>
|
</div>
|
<div class="statusBox">
|
<div class="twoleft">
|
<view class="time-icon"
|
><u-icon name="clock" color="#515151" size="25"></u-icon
|
></view>
|
<view
|
class="send-date"
|
style="font-size: 13px; color: #1f4978f0"
|
>{{ item.yuYueSection || item.yuYueTime }}</view
|
>
|
</div>
|
<view class="status">
|
<u-tag :text="coalStatus[item.statusWeigh] || ''" plain>
|
</u-tag>
|
</view>
|
</div>
|
|
<div class="twoLine">
|
<div class="twoRight">
|
<view>
|
<u-tag :text="item.coalName" plain> </u-tag>
|
</view>
|
<view style="margin-left: 10rpx">
|
<u-tag :text="item.orderType" plain> </u-tag>
|
</view>
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
</template>
|
<script>
|
export default {
|
data() {
|
return {
|
historyData:[],
|
coalStatus: ['未称重', '称重中', '验质中', '称重完成', '处理完成'],
|
|
};
|
},
|
onLoad(params){
|
console.log(params,'params',JSON.parse(params.historyData))
|
if(params.historyData){
|
this.historyData = JSON.parse(params.historyData)
|
}
|
|
},
|
methods: {
|
list3CardIconClick(value) {
|
uni.navigateTo({
|
url: `/pages/driver-page/driver-index/bill-of-lading-details/bill-of-lading-details?orderPlanId=${value.id}&yyId=${value.yyId}`
|
});
|
},
|
skipMap(val) {
|
uni.navigateTo({
|
url: `/pages/public-page/mapRoute/mapRoute?customerId=${val.customerId}&filedId=${val.filedId}&orderType=${val.orderType}${
|
val.toFiledId ? `&toFiledId=${val.toFiledId}&filedId=${val.filedId}` : ''
|
}`
|
});
|
},
|
},
|
|
}
|
|
</script>
|
|
<style scoped lang="scss">
|
.warp{
|
background: #F4F4F4;
|
height: calc(100vh - 45px);
|
overflow-y: auto;
|
padding-top: calc(var(--window-top) + 20px);
|
.item{
|
|
}
|
|
}
|
.ingOrder {
|
width: 94%;
|
height: 370rpx;
|
margin: 0 auto;
|
background: #ffffff;
|
box-shadow: 0rpx 0rpx 14rpx 0rpx rgba(73, 120, 240, 0.14),
|
0rpx 7rpx 45rpx 0rpx rgba(73, 120, 240, 0.12);
|
border-radius: 20rpx;
|
display: flex;
|
flex-direction: column;
|
padding-top: 20rpx;
|
margin-bottom: 30rpx;
|
.statusBox {
|
width: 94%;
|
margin: 0 auto;
|
margin-top: 20rpx;
|
display: flex;
|
justify-content: space-between;
|
.twoleft {
|
display: flex;
|
justify-items: center;
|
align-items: center;
|
.time-icon {
|
margin-right: 10rpx;
|
display: flex;
|
align-items: center;
|
}
|
}
|
}
|
.status {
|
display: flex;
|
width: 150rpx;
|
}
|
|
.firstLine {
|
flex: 0 1 60%;
|
width: 92%;
|
margin: 0 auto;
|
display: flex;
|
justify-content: space-between;
|
.rightIcon {
|
display: flex;
|
height: 150rpx;
|
flex-direction: column;
|
justify-content: space-between;
|
}
|
.leftIcon {
|
display: flex;
|
height: 150rpx;
|
flex-direction: column;
|
justify-content: space-between;
|
.leftOneDiv {
|
width: 46rpx;
|
height: 46rpx;
|
background: #035cfb;
|
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(255, 255, 255, 0.85);
|
border-radius: 5rpx;
|
text-align: center;
|
.leftOne {
|
width: 31rpx;
|
height: 31rpx;
|
font-size: 30rpx;
|
font-family: Microsoft YaHei;
|
font-weight: 400;
|
color: #ffffff;
|
}
|
}
|
.rightDiv {
|
width: 46rpx;
|
height: 46rpx;
|
background: #f1333c;
|
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(255, 255, 255, 0.85);
|
border-radius: 5rpx;
|
text-align: center;
|
.rightone {
|
width: 29rpx;
|
height: 31rpx;
|
font-size: 30rpx;
|
font-family: Microsoft YaHei;
|
font-weight: 400;
|
color: #ffffff;
|
}
|
}
|
.leftLine {
|
width: 2rpx;
|
height: 43rpx;
|
border-right: 2px dotted #303030;
|
transform: translateX(15rpx);
|
}
|
}
|
}
|
.centerTitle {
|
display: flex;
|
flex-direction: column;
|
justify-content: space-between;
|
|
height: 150rpx;
|
.centerLine {
|
width: 510rpx;
|
height: 1rpx;
|
border-bottom: solid 1px #ccc;
|
}
|
}
|
|
.twoLine {
|
flex: 0 1 25%;
|
width: 92%;
|
margin: 20rpx auto;
|
display: flex;
|
justify-content: space-between;
|
.twoleft {
|
display: flex;
|
justify-content: space-around;
|
align-items: center;
|
.send-date {
|
font-size: 25rpx;
|
font-family: Microsoft YaHei;
|
font-weight: 300;
|
color: #515151;
|
}
|
span {
|
color: #515151;
|
font-size: 30rpx;
|
font-weight: 300;
|
}
|
}
|
.twoRight {
|
display: flex;
|
justify-content: space-around;
|
}
|
}
|
.threeLine {
|
flex: 0 1 25%;
|
display: flex;
|
justify-content: flex-end;
|
height: 100rpx;
|
.more {
|
width: 106rpx;
|
height: 20rpx;
|
font-size: 24rpx;
|
font-family: Microsoft YaHei;
|
font-weight: 300;
|
color: #494949;
|
margin-right: 20rpx;
|
}
|
}
|
}
|
|
|
</style>
|
