验质功能修改，websocket优化

qingyiay

2023-07-07 837c21ced9ed0aafe17a7c0c16975a1b6731eb9d

 pages/driver-page/driver-index/bill-of-lading-details/selectOrderPlan/selectOrderPlan.vue

@@ -1,11 +1,11 @@
<template>
   <view>
      <view style="position: relative;top: -120px;">
   <view class="main">
      <view>
         <u-empty mode="data"
            icon="http://cdn.uviewui.com/uview/empty/data.png"
            textSize="30"
            iconSize="1000"
            v-if="orderPlanData.length == 0"></u-empty>
            v-if="orderPlanData.length===0"></u-empty>
      </view>
      <view class="collection-form">
         <view class="collection-form-item"
@@ -32,7 +32,7 @@
            <view class="third-line">
               <view class="time-icon">
                  <view
                     style="width: 24rpx;height: 24rpx;li ne-height: 24rpx;background: url('https://mx.jzeg.cn:9095/appimg/image/banner/carNO.png') no-repeat;background-size: cover">
                     :style="{backgroundImage: `url(${onlineurl}/appimg/image/banner/carNO.png)`,backgroundSize: 'cover',backgroundRepeat: 'no-repeat',width:'24rpx',height:'24rpx',lineHeight:'24rpx'}">
                  </view>
               </view>
               <view class="car-num">{{ item.carNo||''}}</view>
@@ -40,7 +40,7 @@
            <view class="third-line">
               <view class="time-icon">
                  <view
                     style="width: 24rpx;height: 24rpx;li ne-height: 24rpx;background: url('https://mx.jzeg.cn:9095/appimg/image/banner/clock.png') no-repeat;background-size: cover">
                     :style="{backgroundImage: `url(${onlineurl}/appimg/image/banner/clock.png)`,backgroundSize: 'cover',backgroundRepeat: 'no-repeat',width:'24rpx',height:'24rpx',lineHeight:'24rpx'}">
                  </view>
               </view>
               <view class="send-date">{{ item.sendDate }}</view>
@@ -54,15 +54,84 @@
            </view>
         </view>
      </view>
      <view class="history-numbers">
         <combined-title title="历史验质完成"></combined-title>
         <scroll-view :scroll-top="scrollTop"
            scroll-y="true"
            class="scroll-Y"
            @scrolltolower="historyScrolltolower">
            <u-empty mode="data"
               icon="http://cdn.uviewui.com/uview/empty/data.png"
               textSize="30"
               iconSize="1000"
               v-if="historyCoalData.length==0"></u-empty>
            <view class="history-information"
               v-for="(item, index) in historyCoalData"
               :key="index"
               @click="faYundetail(item)">
               <view class="first">
                  <view class="">{{ item.filedName || '' }}</view>
                  <view class=""><u-icon name="arrow-right"
                        color="#999999"
                        size="40"></u-icon></view>
               </view>
               <view class="second">
                  <view class="coal-name">{{ item.coalName || '' }}</view>
                  <view class="order-type">{{ item.orderType || '' }}</view>
               </view>
               <view class="third">
                  <view class="third-line">
                     <view
                        :style="{backgroundImage: `url(${onlineurl}/appimg/image/banner/carNO.png)`,backgroundSize: 'cover',backgroundRepeat: 'no-repeat',width:'24rpx',height:'24rpx',lineHeight:'24rpx'}">
                     </view>
                     <view class="third-line_num"
                        style=" color: #303030;">{{ item.carNo }}</view>
                  </view>
               </view>
               <view class="fourth">
                  <view class="fourth-icon">
                     <view
                        :style="{backgroundImage: `url(${onlineurl}/appimg/image/banner/clock.png)`,backgroundSize: 'cover',backgroundRepeat: 'no-repeat',width:'24rpx',height:'24rpx',lineHeight:'24rpx'}">
                     </view>
                  </view>
                  <view class="senddate">{{ item.sendDate }}</view>
               </view>
               <view class="fourth">
                  <view class="fourth-icon">
                     <view
                        :style="{backgroundImage: `url(${onlineurl}/appimg/image/banner/carnNUm.png)`,backgroundSize: 'cover',backgroundRepeat: 'no-repeat',width:'24rpx',height:'24rpx',lineHeight:'24rpx'}">
                     </view>
                  </view>
                  <view class="senddate">{{ item.orderCode }}</view>
               </view>
            </view>
            <view class="more_text"
               v-if="showMoreData && historyCoalData.length !== 0">没有数据了...</view>
            <view class="white-block"></view>
         </scroll-view>
      </view>
      <view style="height: 160rpx;width: 100%;">

      </view>
      <tab-bar :current="1"></tab-bar>
   </view>
</template>

<script>
   import { onlineurl } from '@/api/request.js'
   export default {
      data() {
         return {
            orderPlanData: [],
            index: null
            historyCoalData: [],
            // 每页数据量
            pageSize: 10,
            // 当前页
            pageCurrent: 1,
            // 是否显示更多数据
            showMoreData: false,
            total: null,
            onlineurl,
         };
      },
      computed: {
@@ -70,29 +139,68 @@
            return uni.getStorageSync('roleType')
         }
      },
      onLoad(params) {
         this.index = params.index ? params.index : ''
      },
      onShow() {
         this.GetOrderPlan()
         this.qualityInspectionHistory()
      },
      methods: {
         GetOrderPlan() {
            uni.showLoading({ title: '加载中...' });
            this.$reqGet('GetOrderPlan').then(res => {
            this.$reqGet('qualityInspection').then(res => {
               if (res.data) {
                  this.orderPlanData = res.data[this.index].tmTaskCoals ? res.data[this.index].tmTaskCoals :
                     []
                  uni.hideLoading();
                  this.orderPlanData = res.data
               } else {
                  uni.hideLoading();
                  this.$u.toast('加载失败')
                  uni.hideLoading()
               }
            })
         },
         // 验质历史
         qualityInspectionHistory() {
            uni.showLoading({ title: '加载中...' });
            this.$reqGet('qualityInspectionHistory', { current: this.pageCurrent, size: this.pageSize }).then(res => {
               if (res.data) {
                  uni.hideLoading();
                  this.total = res.data.total;
                  if (this.pageCurrent > 1) {
                     this.historyCoalData = this.historyCoalData.concat(res.data.records);
                     this.historyCoalData = this.ArrSet(this.historyCoalData, 'id');
                  } else {
                     this.historyCoalData = res.data.records;

                  }
               } else {
                  uni.hideLoading();
                  this.$u.toast('加载失败')
               }
            })
         },
         // 上拉加载
         historyScrolltolower() {
            if (this.pageCurrent * this.pageSize >= this.total) return (this.showMoreData = true);
            this.pageCurrent++;
            this.qualityInspectionHistory();
         },
         //fix 点击提煤单返回会增加重复数据
         ArrSet(Arr, id) {
            var obj = {};
            const arrays = Arr.reduce((setArr, item) => {
               obj[item[id]] ? '' : (obj[item[id]] = true && setArr.push(item));
               return setArr;
            }, []);
            return arrays;
         },
         // 验质选择
         validateClick(item) {
            uni.navigateTo({
               url: `/pages/driver-page/driver-index/bill-of-lading-details/weighDetail/weighDetail?orderPlanId=${item.id}`
            })
         },
         // 历史
         faYundetail(item) {
            uni.navigateTo({
               url: `/pages/driver-page/driver-index/bill-of-lading-details/weighDetail/weighDetail?orderPlanId=${item.id}&flag=${true}`
            })
         }
      },
@@ -101,6 +209,123 @@

<style lang="scss"
   scoped>
   @mixin flex {
      display: flex;
      justify-content: space-between;
      align-items: center;
   }

   .main {
      width: 100%;
      margin: 0 auto;
   }

   .scroll-Y {
      height: 900rpx;

      .more_text {
         color: #333;
         font-size: 24rpx;
         text-align: center;
      }
   }

   .history-numbers {
      width: 100%;
      position: relative;
      // top: vww(-110);

      .history-information {
         width: 690rpx;
         height: 398rpx;
         margin: vww(10) vww(15);
         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;
         @include flex flex-direction: column;
         align-items: flex-start;
         justify-content: space-evenly;
         overflow: hidden;

         .first {
            width: 96%;
            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(30);
               height: vww(20);
               margin-right: vww(21);
            }

            .order-type {
               color: #035cfb;
               border: 2px solid #035cfb;
               border-radius: 4rpx;
               padding: vww(2) vww(4);
               text-align: center;
            }
         }

         .third {
            width: 96%;
            height: 31rpx;
            font-size: 30rpx;
            font-weight: 300;
            color: #515151;
            margin: vww(10) vww(10) 0;
            @include flex;

            .third-line {
               @include flex;

               &_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;
            }
         }
      }
   }

   .collection-form {
      width: vww(345);
      margin: 0 vww(15);
@@ -113,7 +338,8 @@
         box-shadow: 4rpx 6rpx 25rpx 0rpx rgba(73, 120, 240, 0.15);
         border-radius: 20rpx;
         overflow: hidden;
         @include flex flex-direction: column;
         @include flex;
         flex-direction: column;
         position: relative;
         align-items: flex-start;
         margin-top: vww(10);
@@ -205,6 +431,7 @@
            }

            .car-num {
               color: #515151;
               white-space: nowrap;
               overflow: hidden;
               text-overflow: ellipsis;