<template>
|
<view class="warp-box">
|
<view class="history-information" v-for="item,i in datetailData"
|
:key="i">
|
<view class="first">
|
<view class="">{{ item.carNo || '' }}</view>
|
<view class=""></view>
|
</view>
|
<view class="second">
|
<view class="coal-name">{{ item.productNames || item.productName }}</view>
|
<view class="order-type">{{ item.orderType || '' }}</view>
|
</view>
|
<view class="third">
|
<view class="third-line">
|
<view class="third-line_text">客户名称:</view>
|
<view>{{ item.customerName }}</view>
|
</view>
|
<view class="third-line" v-if="/聚氯乙烯树脂/.test(item.productName)">
|
<view class="third-line_text">包装类型:</view>
|
<view>{{ proType[item.packingType] }}</view>
|
</view>
|
<view class="third-line" v-if="item.productName === '二氯乙烷(EDC)'">
|
<view class="third-line_text">质检状态:</view>
|
<view> <u-tag :text="checkStatusList[item.checkStatus]" plain > </u-tag></view>
|
</view>
|
</view>
|
<view class="fourth">
|
<view class="fourth-icon">
|
<view
|
style="width: 24rpx;height: 24rpx;line-height: 24rpx;background: url('https://wrzs.czjlchem.com:9090/appimg/image/banner/clock.png') no-repeat;background-size: cover">
|
</view>
|
</view>
|
<view class="senddate">{{ item.sendDate }}</view>
|
</view>
|
<view class="fourth">
|
<view class="fourth-icon">
|
<view
|
style="width: 26rpx;height: 26rpx;line-height: 26rpx;background: url('https://wrzs.czjlchem.com:9090/appimg/image/banner/carnNUm.png') no-repeat;background-size: cover;">
|
</view>
|
</view>
|
<view class="senddate">{{ item.orderCode }}</view>
|
</view>
|
<view class="table">
|
<uni-table border stripe
|
emptyText="暂无更多数据">
|
<uni-tr>
|
<uni-th align="center" width='200'>产品</uni-th>
|
<uni-th align="center" width='100'>产品等级</uni-th>
|
<uni-th align="center" width='100'>包装类型</uni-th>
|
<uni-th align="center" width='200'>仓库</uni-th>
|
<uni-th align="center" width='100'>皮重</uni-th>
|
<uni-th align="center" width='100'>毛重</uni-th>
|
<uni-th align="center" width='100'>净重</uni-th>
|
<uni-th align="center" width='100'>数量</uni-th>
|
<uni-th align="center">计划量</uni-th>
|
<uni-th align="center">实际量</uni-th>
|
|
</uni-tr>
|
<uni-tr v-for="(subItem, index) in item.tmTaskCoalList" :key="index">
|
|
<uni-td align="center">
|
<view>{{ subItem.productName }}</view></uni-td>
|
<uni-td align="center">
|
<view>{{ subItem.productGrade }}</view></uni-td>
|
<uni-td>
|
<view>{{ proType[item.packingType] }}</view>
|
</uni-td>
|
<uni-td>
|
<view>{{ subItem.bunkerName }}</view>
|
</uni-td>
|
<uni-td>
|
<view class="name" v-if="subItem.skin">{{ Number(subItem.skin).toFixed(2) || '' }}</view>
|
</uni-td>
|
<uni-td>
|
<view class="name" v-if="subItem.hair"> {{ Number(subItem.hair).toFixed(2) || '' }}</view>
|
</uni-td>
|
<uni-td>
|
<view class="name" v-if="(subItem.clean || (subItem.clean && subItem.clean === 0))">{{ Number(subItem.clean).toFixed(2) || ''}}</view>
|
</uni-td>
|
<uni-td>
|
<view class="name">{{ subItem.productQuantity }}</view>
|
</uni-td>
|
<uni-td>
|
<view class="name">{{ subItem.planMeasure }}</view>
|
</uni-td>
|
<uni-td>
|
<view class="name">{{ subItem.realityMeasure }}</view>
|
</uni-td>
|
<!--
|
<uni-td align="center">
|
<view>{{ subItem.bunkerName }}</view></uni-td> -->
|
<!-- <uni-td align="center">
|
<view class="name">{{ subItem.statusView }}</view></uni-td> -->
|
|
</uni-tr>
|
</uni-table>
|
<view class="footer">
|
<view class="rightBtn"> <u-button type='primary' text='确认拼单'></u-button></view>
|
|
</view>
|
</view>
|
</view>
|
</view>
|
</template>
|
|
<script>
|
export default {
|
data() {
|
return {
|
proType:['散装','液氣瓶装','罐装','PVC25','PVC80','PVC1150','PVc1200'],
|
datetailData:[],
|
taskId:'',
|
}
|
},
|
methods: {
|
init(){
|
uni.showLoading({
|
title: "加载中"
|
})
|
this.$reqGet('getUnclaimedList',{taskCoalId:this.taskId}).then((res) => {
|
this.datetailData = res.data;
|
uni.hideLoading();
|
})
|
}
|
|
},
|
computed:{
|
|
},
|
onLoad(params)
|
{
|
this.taskId = params.taskCoalId;
|
},
|
onShow(){
|
this.init();
|
},
|
|
}
|
</script>
|
|
<style lang="scss"
|
scoped>
|
.table{
|
width: 100%;
|
margin-top: 10rpx;
|
/deep/ .uni-table{
|
min-width: 0!important;
|
margin-left: 20rpx;
|
width: auto;
|
}
|
.footer{
|
height: 100rpx;
|
.rightBtn{
|
width: 200rpx;
|
float: right;;
|
|
}
|
}
|
}
|
.warp-box{
|
width: 96%;
|
margin: 10rpx auto;
|
height: calc(100vh - 10vh);
|
} .history-information {
|
margin-bottom:30rpx;
|
margin-top: 10rpx;
|
background: #ffffff;
|
border-radius: 20rpx;
|
@include flex flex-direction: column;
|
padding: 10px;
|
align-items: flex-start;
|
justify-content: space-evenly;
|
box-shadow: 0rpx 0rpx 14rpx 0rpx rgba(73, 120, 240, 0.14), 0rpx 7rpx 45rpx 0rpx rgba(73, 120, 240, 0.12);
|
|
|
.first {
|
width: 94%;
|
height: 34rpx;
|
font-size: 32rpx;
|
font-weight: 300;
|
color: #303030;
|
@include flex;
|
margin: vww(10) vww(10) 0;
|
}
|
|
.second {
|
width: 100%;
|
height: 31rpx;
|
font-size: 30rpx;
|
font-weight: 300;
|
color: #515151;
|
margin: vww(10) vww(10) 0;
|
@include flex;
|
justify-content: flex-start;
|
|
.coal-name {
|
min-width: vww(20);
|
height: vww(20);
|
margin-right: vww(21);
|
}
|
|
.order-type {
|
height: 45rpx;
|
color: #035cfb;
|
border: 2px solid #035cfb;
|
border-radius: 4rpx;
|
padding: vww(2) vww(4);
|
text-align: center;
|
}
|
}
|
|
.third {
|
width: 96%;
|
height: auto;
|
font-size: 30rpx;
|
font-weight: 300;
|
color: #515151;
|
margin: vww(10) vww(10) 0;
|
@include flex;
|
flex-direction: column;
|
|
.third-line {
|
@include flex;
|
align-items: center;;
|
|
&_text {
|
color: #919090;
|
}
|
|
&_num {
|
color: #035cfb;
|
}
|
}
|
}
|
|
.fourth {
|
width: 100%;
|
height: 31rpx;
|
font-size: 30rpx;
|
font-weight: 300;
|
color: #515151;
|
margin: vww(10) vww(10) 0;
|
@include flex;
|
|
.fourth-icon {
|
width: vww(13);
|
height: vww(13);
|
margin-right: vww(14);
|
}
|
|
.senddate {
|
flex: 1;
|
}
|
}
|
}
|
|
</style>
|