<template>
|
<view>
|
<view style="position: relative;">
|
<u-empty mode="data"
|
icon="http://cdn.uviewui.com/uview/empty/data.png"
|
textSize="30"
|
iconSize="1000"
|
text="暂无数据"
|
v-if="detailData.length == 0"></u-empty>
|
</view>
|
<view class="collection-form">
|
<view class="collection-form-item"
|
v-for="(item, index) in detailData"
|
@click="faYundetail(item)"
|
:key="index">
|
<view class="weigh-item">
|
<view class="item">
|
<view class="concrete"
|
:style="{ backgroundImage: `url(${onlineurl}/appimg/image/banner/skin.png)`, backgroundSize: 'cover', backgroundRepeat: 'no-repeat' }">
|
皮
|
</view>
|
<view class="num">{{ item.skin }}</view>
|
</view>
|
<view class="item">
|
<view class="concrete"
|
:style="{ backgroundImage: `url(${onlineurl}/appimg/image/banner/hair.png)`, backgroundSize: 'cover', backgroundRepeat: 'no-repeat' }">
|
毛
|
</view>
|
<view class="num">{{ item.hair }}</view>
|
</view>
|
</view>
|
<view class="info-container">
|
<view class="info-block">
|
<view class="car-num">
|
<text class="label-text">车牌号:</text>{{item.carNo}}
|
</view>
|
<view class="order-margin">
|
<text class="label-text">煤种名称:</text>
|
{{item.coalName}}
|
</view>
|
<view class="order-type info">
|
订单类型:<text style="font-weight: 600;">{{item.orderType}}</text>
|
</view>
|
<view class="file-name info">
|
状态:<text style="font-weight: 600;">{{coalStatus[item.status]}}</text>
|
</view>
|
<view class="file-name checkStatus">
|
质检状态:<text style="font-weight: 600;">{{coalStatus[item.checkStatus]}}</text>
|
</view>
|
<view class="info createTime">
|
入场时间:{{item.createTime}}
|
</view>
|
<view class="info code">
|
订单编号:{{item.code}}
|
</view>
|
<view class="info confirmPeople"
|
v-if="item.confirmPeople">
|
审核人:{{item.confirmPeople}}
|
</view>
|
</view>
|
</view>
|
<view class="confirm-button">
|
<u-button plain
|
type="primary"
|
text="确定装卸"
|
shape="circle"
|
@click.stop="loadOrder(item.id)"
|
:loading="loading"
|
loadingText="确认"></u-button>
|
</view>
|
<!-- 如果有剩余收发单则点击查看更多 -->
|
<view class='downIcon' v-if='item.tmTaskCoalList.length'>
|
<u-icon @click='checkMore(item)' :name="!item.checkFlag ? 'arrow-down-fill' : 'arrow-up-fill'" color="#2979ff" size="38"></u-icon>
|
</view>
|
<!-- 剩余收发单 ----多产品 -->
|
<view class='subBox' v-if='item.tmTaskCoalList.length && item.checkFlag'>
|
<view class='subItem' v-for='subItem,i in item.tmTaskCoalList' :key='i'
|
@click="faYundetail(subItem)"
|
>
|
<view class="weigh-item" style="position:static">
|
<view class="item">
|
<view class="concrete"
|
>
|
皮
|
</view>
|
<view class="num">{{ subItem.skin }}</view>
|
</view>
|
<view class="item">
|
<view class="concrete"
|
>
|
毛
|
</view>
|
<view class="num">{{ subItem.hair }}</view>
|
</view>
|
</view>
|
<view class="info-container">
|
<view class="info-block">
|
<view class="car-num">
|
<text class="label-text">车牌号:</text>{{subItem.carNo}}
|
</view>
|
<view class="order-margin">
|
<text class="label-text">煤种名称:</text>
|
{{subItem.coalName}}
|
</view>
|
<view class="order-type info">
|
订单类型:<text style="font-weight: 600;">{{subItem.orderType}}</text>
|
</view>
|
<view class="file-name info">
|
状态:<text style="font-weight: 600;">{{coalStatus[subItem.status]}}</text>
|
</view>
|
<view class="file-name checkStatus">
|
质检状态:<text style="font-weight: 600;">{{coalStatus[subItem.checkStatus]}}</text>
|
</view>
|
<view class="info createTime">
|
入场时间:{{subItem.createTime}}
|
</view>
|
<view class="info code">
|
订单编号:{{subItem.code}}
|
</view>
|
<view class="info confirmPeople"
|
v-if="subItem.confirmPeople">
|
审核人:{{subItem.confirmPeople}}
|
</view>
|
</view>
|
</view>
|
<view class='btnBottom'>
|
<u-button plain
|
type="primary"
|
:text="subItem.orderTye === '外销' ? '确定卸货' :'确定装货'"
|
shape="circle"
|
@click.stop="loadOrder(subItem.id,item)"
|
:loading="loading"
|
v-if="isBtnShow(subItem)"
|
loadingText="确认"
|
></u-button>
|
</view>
|
<u-divider :textSize='28' :text="subItem.coalName" :hairline="true"></u-divider>
|
</view>
|
|
</view>
|
</view>
|
</view>
|
<u-modal :show="loadShow"
|
:title="'确认装卸此收发单?'"
|
:showCancelButton="true"
|
@confirm="confirmUnload"
|
@cancel="cancelUnload">
|
<!-- 是否展示 -->
|
<u--form
|
v-if="activeObj.productQuantity"
|
:labelWidth='150'
|
labelPosition="left"
|
:model="model1"
|
ref="uForm"
|
>
|
<u-form-item
|
label="产品名称"
|
prop="name"
|
borderBottom
|
ref="item1"
|
>
|
<u--input
|
v-model="model1.name"
|
border="none"
|
placeholder="请输入产品名称"
|
></u--input>
|
</u-form-item>
|
|
<u-form-item
|
label="产品数量"
|
prop="num"
|
borderBottom
|
ref="item1"
|
>
|
<u--input
|
v-model="model1.num"
|
disabled
|
disabledColor="#ffffff"
|
placeholder="请输入数量"
|
border="none"
|
></u--input>
|
</u-form-item>
|
<!-- 特殊产品装货 -->
|
<u-form-item
|
label="集装箱号"
|
prop="code"
|
borderBottom
|
ref="item1"
|
>
|
<u--input
|
v-model="model1.code"
|
border="none"
|
placeholder="请输入集装箱号"
|
></u--input>
|
</u-form-item>
|
</u--form>
|
</u-modal>
|
</view>
|
</template>
|
|
<script>
|
import { onlineurl } from '@/api/request.js'
|
export default {
|
data() {
|
return {
|
name: "",
|
detailData: [],
|
model1:{
|
name:'',
|
sex:""
|
},
|
activeObj:{},
|
onlineurl,
|
loadShow: false, // 确认弹窗控制
|
loading: false,
|
id: "",
|
coalStatus: ['领取', '预约', '签到', '入场', '称皮', '称毛', '离场', '入磅房', '出磅房', '入煤仓', '出煤仓', '放空', '作废', '入场申请',
|
'进入场院', '异常审核中', '返回加减吨', '超时', '打印中', '打印中', '填写'
|
], // 状态
|
checkStatus:['待取样','已取样','合格','不合格'],
|
bunkerId: null
|
}
|
},
|
computed: {
|
userId() {
|
return uni.getStorageSync('userId')
|
},
|
isBtnShow(){
|
return function (item){
|
if(item.productName === 'EDC'){
|
if(item.status === 15){
|
return true
|
}else{
|
return false
|
}
|
}else{
|
return true
|
}
|
}
|
}
|
},
|
onLoad(params) {
|
this.bunkerId = params.bunkerId || ''
|
this.init()
|
},
|
methods: {
|
onPullDownRefresh() {
|
this.init()
|
uni.stopPullDownRefresh();
|
},
|
init() {
|
uni.showLoading({
|
title: "加载中"
|
})
|
this.$reqGet('getTaskCoalListByBunkerId', { bunkerId: this.bunkerId }).then(res => {
|
uni.hideLoading()
|
if (res.code === 0) {
|
const errorStatusArr = [0, 1, 2, 3, 6, 11, 12, 13];
|
this.detailData = res.data.map(v => {
|
if(v.tmTaskCoalList.length){
|
v.tmTaskCoalList = v.tmTaskCoalList.map(item=>{
|
return {
|
...item,
|
ableDischar: item.skin === item.hair || item.hair === 0 && item.skin === 0 || v
|
.isPretendDischar !== 0 || errorStatusArr.indexOf(item.status) !== -1,
|
isContainLoginUser: item.confirmPeopleId ? item.confirmPeopleId.split(',')
|
.indexOf(this.userId) === -
|
1 : true
|
}
|
})
|
}
|
return {
|
...v,
|
checkFlag:false,
|
ableDischar: v.skin === v.hair || v.hair === 0 && v.skin === 0 || v
|
.isPretendDischar !== 0 || errorStatusArr.indexOf(v.status) !== -1,
|
isContainLoginUser: v.confirmPeopleId ? v.confirmPeopleId.split(',')
|
.indexOf(this.userId) === -
|
1 : true
|
}
|
})
|
} else {
|
this.$u.toast('加载失败')
|
}
|
})
|
},
|
loadOrder(id,item) {
|
this.activeObj = item;
|
this.loadShow = true;
|
this.id = id;
|
},
|
confirmUnload() {
|
this.loadShow = false;
|
this.loading = true
|
this.$reqPost('confirmLoadAndUnload', { tmId: this.id }, 'params').then(res => {
|
this.loading = false;
|
if (res.code === 0) {
|
this.$u.toast('装卸成功')
|
setTimeout(() => {
|
this.init()
|
}, 1000)
|
} else {
|
this.$u.toast(res.msg ? res.msg : '装卸失败')
|
}
|
})
|
},
|
cancelUnload() {
|
this.loadShow = false
|
},
|
checkMore(value){
|
value.checkFlag =!value.checkFlag;
|
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss"
|
scoped>
|
.collection-form{
|
.subBox{
|
background: #fff;
|
height:auto;
|
margin-top:10px;
|
padding:10rpx;
|
box-shadow: 4rpx 6rpx 25rpx 0rpx rgba(73, 120, 240, 0.15);
|
border-radius: 20rpx;
|
.subItem{
|
position: relative;
|
}
|
.info-container{
|
height:400rpx!important;
|
}
|
|
.btnBottom{
|
position: absolute;
|
bottom: 20px;
|
right: vww(10);
|
}
|
/deep/ .u-divider{
|
margin: 10px 0!important;
|
}
|
}
|
}
|
|
.downIcon{
|
display: flex;
|
justify-content: center;
|
/* margin-top: 38rpx; */
|
|
}
|
.checkStatus{
|
width:93%;
|
color: #515151;
|
margin: vww(5);
|
}
|
.collection-form {
|
width: vww(345);
|
margin: 0 vww(15);
|
position: relative;
|
|
.collection-form-item {
|
width: 690rpx;
|
transition: all 0.5s;
|
background: #ffffff;
|
box-shadow: 4rpx 6rpx 25rpx 0rpx rgba(73, 120, 240, 0.15);
|
border-radius: 20rpx;
|
// overflow: hidden;
|
@include flex;
|
flex-direction: column;
|
position: relative;
|
justify-content: center;
|
margin-top: vww(10);
|
|
.weigh-item {
|
width: 94%;
|
height: vww(36);
|
margin: 0 vww(10);
|
@include flex;
|
justify-content: space-around;
|
position: relative;
|
|
.item {
|
min-width: vww(50);
|
height: vww(45);
|
font-size: 21rpx;
|
font-weight: 400;
|
color: #ffffff;
|
text-align: center;
|
line-height: vww(30);
|
@include flex;
|
|
.concrete {
|
width: vww(36);
|
height: vww(36);
|
}
|
|
.num {
|
font-size: 40rpx;
|
font-weight: 300;
|
color: #303030;
|
}
|
}
|
}
|
|
.info-container {
|
width: 100%;
|
height: vww(150);
|
display: flex;
|
justify-content: center;
|
position: relative;
|
top: vww(-15);
|
|
.info-block {
|
width: 600rpx;
|
height: vww(120);
|
display: flex;
|
justify-content: center;
|
flex-wrap: wrap;
|
|
.car-num,
|
.order-margin {
|
width: 100%;
|
display: flex;
|
justify-content: flex-start;
|
margin-left: 4%;
|
margin-top: vww(4);
|
color: #FF0000;
|
font-weight: 600;
|
|
.label-text {
|
color: #409eff;
|
}
|
}
|
|
.order-margin {
|
white-space: nowrap;
|
overflow: hidden;
|
text-overflow: ellipsis;
|
}
|
|
}
|
|
.info {
|
width: 45%;
|
height: vww(20);
|
color: #515151;
|
margin: vww(5);
|
}
|
|
.createTime,
|
.code,
|
.confirmPeople {
|
width: 100%;
|
margin-left: vww(9);
|
display: flex;
|
justify-content: flex-start;
|
}
|
|
.confirmPeople {
|
margin-top: vww(24);
|
}
|
}
|
|
|
.confirm-button {
|
width: vww(80);
|
margin-left: 70%;
|
// position: absolute;
|
// bottom: vww(6);
|
// right: vww(10);
|
}
|
}
|
}
|
</style>
|
