feat:质检员页面外销展示多个提煤单

yangan

2025-02-25 5d46360410a48fa6038e46e0d769f88207be9d75

 pages/sampling-page/index.vue

@@ -12,13 +12,36 @@
                  iconSize="1000"
                  v-if="CoalNameList.length == 0"></u-empty>
            </view> -->
				
                <view class="title"><u-icon  size='26' color="#" name="order"></u-icon><i>待检区</i></view>
            <view class="body">
               <!-- <selectTarget ref='selectTarget'></selectTarget> -->
                    <view class="collection-form">
               <view class="collection-form-item"
                  <u-tabs :list="tabList" :activeStyle="{fontSize:'26rpx'} " @click="tabClick"></u-tabs>
                        <view style="position: relative;">
               <u-empty mode="data"
                  icon="http://cdn.uviewui.com/uview/empty/data.png"
                  textSize="30"
                  iconSize="1000"
                  text="暂无待检数据"
                  v-if="orderPlanData.length == 0"></u-empty>
            </view>
                        <view class="collection-form-item"
                  v-for="(item, index) in orderPlanData"
                  :key="index"
                  @click="cardBodyClick(item)">
                  :key="index">
                        <view class="first-line">
                     <view class="dispatch-receive">
                        <view class="dispatch-orderCode">编号：{{ item.code }}</view>
                     </view>
                  </view>
                        <view class="first-line">
							
                        <view class="dispatch-orderCode" style="font-size: 25rpx;">客户名称：{{ item.customerName }}</view>
							
                  </view>
                  <view class="second-line">
                     <view style="font-size: 20rpx;">{{ item.carNo }}</view>						
               </view>
                  <view class="first-line">
                     <view class="dispatch-receive">
                        <view class="dispatch-dept">{{ item.deptName }}</view>
@@ -26,8 +49,11 @@
                        <view class="dispatch">{{ item.filedName }}</view>
                     </view>
                     <view class="point-number">
                        <text class="residue">{{ item.cars2 }}</text>
                        <text>/{{ item.carNum }}</text>
                        <text class="residue">{{ item.inspectionStatus === 0 ? '无需检验' : 
                        item.inspectionStatus === 1 ? '需检验' :
                        item.inspectionStatus === 2 ? '待检验' :
                        item.inspectionStatus === 3 ? '检验合格' : ''   
                                                                     }}</text>
                     </view>
                  </view>
                  <view class="second-line"
@@ -43,32 +69,41 @@
                           v-if="item.orderType">{{ item.orderType }}</view>
                     </view>
                  </view>
                  <view class="second-line">
                  <view class="second-line" style="font-size: 20rpx;">
                     {{item.orderCode}}
                  </view>
                  <view class="third-line">
                     <view class="time-icon">
                        <view
                           style="width: 24rpx;height: 24rpx;li ne-height: 24rpx;background: url('https://mr1.res.jzeg.cn:9096/appimg/image/banner/clock.png') no-repeat;background-size: cover">
                           style="width: 24rpx;height: 24rpx;line-height: 24rpx;background: url('https://mr1.res.jzeg.cn:9096/appimg/image/banner/clock.png') no-repeat;background-size: cover">
                        </view>
                     </view>
                     <view class="send-date">{{ item.sendDate }}</view>
                  </view>
                  <view class="fourth-line">
                     <view class="receive"
                        @click.stop="receiveClick(item)">
                        <view class="button-image">领取</view>
                     </view>
						
                     <view class="forward"
                     v-if="item.inspectionStatus!==3"
                        @click.stop="forwardClick(item)">
                        <view class="button-image">转发</view>
                        <u-button type="primary"  text="确认取样"></u-button>
                     </view>
                  </view>
               </view>
               <view class="bottom"></view>
                    
            </view>
            </view>
         </view>
      </view>
        <u-modal :show="showFlag"
                 :title="'确认取样完成？'"
                 :cancelText="'取消'"
                 showCancelButton
                  :closeOnClickOverlay="true"
            @close="showFlag = false"
            @cancel="showFlag = false"
            @confirm="popupDetermineClick">
         </u-modal>
   </view>
</template>

@@ -77,9 +112,32 @@
      components: {
         
      },
        watch:{
            samplingData: {
            handler(v) {
               this.orderPlanData = v;
            },
            deep: true,
            immediate: true
         }
        },
      data() {
         return {

                orderPlanData:[],
            tagName:'外销',
                activeObj:{},
            timer:null,
                showFlag:false,
            tabList:[{
               name:'外销'
                  },
                  {
                     name:'外购'
                  },
                  {
                     name:'内购'
                  }
               ]
         };
      },
      onLoad() {
@@ -88,10 +146,112 @@
      methods: {
         init() {
            this.$nextTick(() => {
               // this.$refs.selectTarget.getDeptIdFiled()
               if(this.tagName == '外购'){
                  this.getWaiData();
               }else if(this.tagName == '内购'){
                  this.getNeiData();
               } else{
                  this.getListData();
               }
					
					
					
            })
         },
            getListData(){
                this.$reqGet('inspectedTaskPage',{inspectionStatus:2}).then(res=>{
                    console.log(res,'result');
                    if(res.code == 0){
                  if(res.data.records.length){
                     this.orderPlanData  = res.data.records
                  }else{
                     this.orderPlanData = [];
                  }
                     
                    }
                    
                })
            },
            //确认取样
            forwardClick(item){
                this.showFlag = true;
                this.activeObj =  item;
              
            },
            popupDetermineClick(){
                this.$reqPut('updateInspectionStatus',{inspectionStatus:3,id:this.activeObj.id},'params').then(res=>{
                    console.log(res,'result');
                    if(res.code == 0){
                        this.$u.toast('确认取样完成！')
                        this.showFlag = false;
                        this.init();
                    }else{
                        this.$u.toast(res.msg  || '请求失败')
                        this.showFlag = false;
                    }

                })

            },
         //定时查询任务
         timerFun(){
         this.timer = window.setInterval(() => {
               setTimeout(() => {
                  if(this.tagName == '外购'){
                     this.getWaiData()
                  }else if(this.tagName == '内购'){
                     this.getNeiData();
                  }
                  else{
                     this.getListData() //调用接口的方法
                  }
                  console.log(1111111111)
               }, 0)
            }, 60000);
         },
         clearTime(){
            window.clearInterval(this.timer)
         },
         tabClick(val){
            console.log(val,'valll')
               this.tagName = val.name;
               if(val.name == '外购'){
                  this.getWaiData();
               }else if(val.name === '内购'){
                  this.getNeiData();
               }
               else{
                  this.getListData();
               }
				

         },
         getWaiData(){
            this.$reqGet('inspectedTaskPage',{inspectionStatus:1,orderType:'外购'}).then(res=>{
                     if(res.code == 0){
                  if(res.data.records.length){
                     this.orderPlanData  = res.data.records;
                  }else{
                     this.orderPlanData = [];
                  }
                     
                    }
                  })
         },
         //内购
         getNeiData(){
            this.$reqGet('inspectedTaskPage',{inspectionStatus:1,orderType:'内购'}).then(res=>{
                     if(res.code == 0){
                  if(res.data.records.length){
                     this.orderPlanData  = res.data.records;
                  }else{
                     this.orderPlanData = [];
                  }
                     
                    }
                  })
         }
      },
      },  
   }
</script>

@@ -143,16 +303,40 @@
      width: 100%;
      margin: 0 auto;

      &_body {
         .collection-form {
            width: vww(345);
   }
    .body{
        position: absolute;
        top: 38%;
        width: 97%;
        left: 50%;
        margin-left: -47%;
	
        // box-shadow: 0 2px 18px 0 rgba(0, 0, 0, .2);
        // background: #fff;
        border-radius: 20rpx;
    }
   .bottom{
      height: 200rpx;
   }
    .title{
        position: absolute;
        top: 34%;
        left: 50%;
        transform: translateX(-50%);
        color: #fff;
        font-size: 25rpx;
        display: flex;
    }
    .collection-form {
				
            margin: 0 vww(15);
            position: relative;
            top: vww(-144);
             transform: translateX(-20rpx);


            .collection-form-item {
               width: 690rpx;
               height: 100rpx;
               width: 100%;
               height: 400rpx;
               background: #ffffff;
               box-shadow: 4rpx 6rpx 25rpx 0rpx rgba(73, 120, 240, 0.15);
               border-radius: 20rpx;
@@ -160,22 +344,204 @@
               @include flex;
               flex-direction: column;
               position: relative;
               align-items: center;
               justify-content: center;
               align-items: flex-start;
               margin-top: vww(10);

               .first-line {
                  width: 94%;
                  height: vww(30);
                  margin: vww(10) vww(16) 0 vww(16);
                  display: flex;
                  justify-content: space-between;

                  .dispatch-receive {
                     width: 70%;
                     display: flex;
                     justify-content: flex-start;
                     align-items: center;

                     .dispatch-dept {
                                font-size: 25rpx;

                        display: flex;
                        align-items: center;
                     }
                            .dispatch-orderCode{
                                width: 100%;
                                font-size: 25rpx;
                            }

                     .black-bar {
                        width: 2rpx;
                                font-size: 25rpx;
                        height: 30rpx;
                        background: #515151;
                        margin-left: vww(12);
                     }

                     .dispatch {
                                font-size: 25rpx;
                        margin-left: vww(12);
                        min-width: vww(50);
                     }

                  }

                  .point-number {
                     width: 15%;

                     text {
                        font-size: 20rpx;
                        font-weight: 400;
                        color: #c78a64;
                     }

                     .residue {
                        font-size: 23rpx;
                        font-weight: 400;
                        color: #f81414;
                     }
                  }
               }

               .second-line {
                  width: 100%;
                  height: vww(30);
                  margin-left: vww(16);
                  display: flex;
                  align-items: center;
                  justify-content: flex-start;

                  .coal-name {
                     flex-grow: 1;
                     height: 30rpx;
                     font-size: 30rpx;
                     font-weight: 300;
                     color: #515151;
                     position: relative;
                     display: flex;
                     align-items: center;

                     .black-bar {
                        width: 2rpx;
                        height: 30rpx;
                        background: #515151;
                        margin-left: vww(12);
                     }

                     .coal-type {
                        margin-left: vww(12);
                        min-width: vww(50);
                        height: 30rpx;
                        line-height: 30rpx;
                        font-size: 30rpx;
                        font-weight: 300;
                        color: #515151;
                     }
                  }
               }

               .third-line {
                  width: 40%;
                  height: vww(30);
                  margin-left: vww(15);
                  display: flex;
                  justify-content: flex-start;
                  align-items: center;

                  .send-date {
                     margin-left: vww(14);
                     width: 168rpx;
                     height: 24rpx;
                     line-height: 24rpx;
                     font-size: 28rpx;
                     font-weight: 300;
                     color: #515151;
                  }
               }

               .fourth-line {
                  width: 100%;
                  height: vww(30);
                  @include flex;
                  justify-content: flex-start;
                  position: relative;
                  bottom: vww(10);
                  left: 25%;

                  .receive,
                  .forward {
                     width: vww(123);
                     height: vww(48);
                     @include flex;
                     justify-content: center;
                     color: #ffffff;
                     font-size: 28rpx;
                     position: absolute;

                     .button-image {
                        width: 100%;
                        height: 100%;
                        // background: url('../../../static/image/banner/button.png') no-repeat;
                        background-size: cover;
                        font-size: 28rpx;
                        font-weight: 300;
                        color: #ffffff;
                        text-align: center;
                        line-height: vww(45);
                     }
                  }

                  .receive {
                     left: vww(20);
                  }

                  .forward {
                     width: vww(106);
                     left: vww(140);

                     .button-image {
                        width: 100%;
                        height: 100%;
                        // background: url('../../../static/image/banner/transpartent.png') no-repeat;
                        background-size: cover;
                        font-size: 28rpx;
                        font-weight: 300;
                        color: #3b56eb;
                        text-align: center;
                        line-height: vww(45);
                     }
                  }
               }
            }
         }
      }
   }
    .body{
            .receiverPopup {
         height: vww(110);
            width: 400rpx;

    }
         .receiverPopup__title {
			
            width: 80%;
            text-align: center;
         }

         .receiverPopup__input {
            width: 80%;
            margin: vww(10) auto 0;

            .u-input {
               border: 1px solid #dddddd;
            }
         }

         &__btn {
            margin: vww(10) auto;
            width: 50%;

            .u-button {
               height: vww(20);
            }
         }
      }
    
</style>