我来送货

wk

2024-06-06 04bf082f36434f1847412492576d8472c422993c

 pages/loadUnload-page/loadUnload-detail/loadUnload-detail.vue

@@ -11,6 +11,7 @@
      <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">
@@ -30,18 +31,21 @@
            </view>
            <view class="info-container">
               <view class="info-block">
                  <view class="car-num info">
                  <view class="car-num">
                     <text class="label-text">车牌号:</text>{{item.carNo}}
                  </view>
                  <view class="order-margin info">
                  <view class="order-margin">
                     <text class="label-text">煤种名称:</text>
                     {{item.coalName}}
                  </view>
                  <view class="order-type info">
                     订单类型:{{item.orderType}}
                     订单类型:<text style="font-weight: 600;">{{item.orderType}}</text>
                  </view>
                  <view class="file-name info">
                     状态:{{coalStatus[item.status]}}
                     状态:<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}}
@@ -62,16 +66,135 @@
                  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="确认"
                  v-if='!item.ableDischar&&item.isContainLoginUser'></u-button>
                  ></u-button>
            </view>
               <u-divider :textSize='28' :text="subItem.coalName" :hairline="true"></u-divider>
               </view>
				
            </view>
         </view>
      </view>
      <u-modal :show="loadShow"
         content='确认装卸此提煤单'
         :title="'确认装卸此提煤单?'"
         :showCancelButton="true"
         @confirm="confirmUnload"
         @cancel="cancelUnload"></u-modal>
         @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>

@@ -82,6 +205,11 @@
         return {
            name: "",
            detailData: [],
            model1:{
               name:'',
               sex:""
            },
            activeObj:{},
            onlineurl,
            loadShow: false, // 确认弹窗控制
            loading: false,
@@ -89,15 +217,30 @@
            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.name = params.coalName ? params.coalName : ''
         this.bunkerId = params.bunkerId || ''
         this.init()
      },
      methods: {
@@ -109,13 +252,26 @@
            uni.showLoading({
               title: "加载中"
            })
            this.$reqGet('getAccordingCoalNameAll', { coalName: this.name }).then(res => {
            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(',')
@@ -128,7 +284,8 @@
               }
            })
         },
         loadOrder(id) {
         loadOrder(id,item) {
            this.activeObj = item;
            this.loadShow = true;
            this.id = id;
         },
@@ -150,12 +307,53 @@
         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);
@@ -163,11 +361,11 @@

      .collection-form-item {
         width: 690rpx;
         height: 440rpx;
         transition: all 0.5s;
         background: #ffffff;
         box-shadow: 4rpx 6rpx 25rpx 0rpx rgba(73, 120, 240, 0.15);
         border-radius: 20rpx;
         overflow: hidden;
         // overflow: hidden;
         @include flex;
         flex-direction: column;
         position: relative;
@@ -181,7 +379,6 @@
            @include flex;
            justify-content: space-around;
            position: relative;
            top: vww(-14);

            .item {
               min-width: vww(50);
@@ -211,6 +408,8 @@
            height: vww(150);
            display: flex;
            justify-content: center;
            position: relative;
            top: vww(-15);

            .info-block {
               width: 600rpx;
@@ -221,12 +420,23 @@

               .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;
               }

            }
@@ -255,9 +465,10 @@

         .confirm-button {
            width: vww(80);
            position: absolute;
            bottom: vww(6);
            right: vww(10);
            margin-left: 70%;
            // position: absolute;
            // bottom: vww(6);
            // right: vww(10);
         }
      }
   }