qingyiay
2023-07-02 f5427eeb16cadd3b0534454ab3c92df6f0ec1536
pages/driver-page/driver-index/bill-of-lading-details/bill-of-lading-details.vue
@@ -1,7 +1,7 @@
<template>
   <view class="bill-of-lading-details">
      <view class="top-banner"
         style="background: url('https://mx.jzeg.cn:9095/appimg/image/banner/loadingbanner.png') no-repeat;background-size: cover;">
         :style="{ backgroundImage: `url(${onlineurl}/appimg/image/banner/loadingbanner.png)`, backgroundSize: 'cover', backgroundRepeat: 'no-repeat' }">
      </view>
      <view class="top-information">
         <view class="cutomer-name"
@@ -21,8 +21,7 @@
            <view class="basic">
               <view class="coalName">{{ coalDetailsData.coalName||'' }}</view>
               <view class="status-button"
                  style="background: url('https://mx.jzeg.cn:9095/appimg/image/banner/statusbutton.png') no-repeat;
                              background-size: cover;">
                  :style="{ backgroundImage: `url(${onlineurl}/appimg/image/banner/statusbutton.png)`, backgroundSize: 'cover', backgroundRepeat: 'no-repeat' }">
                  {{ coalStatus[coalDetailsData.statusWeigh] || '' }}
               </view>
            </view>
@@ -40,32 +39,45 @@
               style="color: rgb(73, 123, 251);">
               查看明细
            </view>
         </view>
      </view>
      <!--  称重历史-->
      <view class="weigh-history"
         v-if="showWeigh.length!==0">
         <view class="block-main">
            <view class="weigh-item"
               v-for='item in showWeigh'
               :key="item.id">
               <view class="item">
                  <view class="concrete"
                     style="background: url('https://mx.jzeg.cn:9095/appimg/image/banner/skin.png') no-repeat;background-size: cover;">
                     皮</view>
                  <view class="num">{{ item.skin }}</view>
               <view class="weigh-time">
                  <u-tag :text="item.createTime.slice(-8,-3)"
                     plain></u-tag>
               </view>
               <view class="item">
                  <view class="concrete"
                     style="background: url('https://mx.jzeg.cn:9095/appimg/image/banner/hair.png') no-repeat;background-size: cover;">
                     毛</view>
                  <view class="num">{{ item.hair }}</view>
               </view>
               <view class="item">
                  <view class="concrete"
                     style="background: url('https://mx.jzeg.cn:9095/appimg/image/banner/clean.png') no-repeat;background-size: cover;">
                     净</view>
                  <view class="num">{{ item.clean }}</view>
               <view class="item-block">
                  <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 class="item">
                     <view class="concrete"
                        :style="{ backgroundImage: `url(${onlineurl}/appimg/image/banner/clean.png)`, backgroundSize: 'cover', backgroundRepeat: 'no-repeat' }">
                        净</view>
                     <view class="num">{{ item.clean }}</view>
                  </view>
               </view>
            </view>
         </view>
      </view>
      <!-- 时间线 -->
      <view class="timeLine">
         <u-steps :current="dayRZ.length - 1"
            direction="column"
@@ -140,6 +152,7 @@
</template>
<script>
   import { onlineurl } from '@/api/request.js'
   import { webSocketUrl } from '@/api/request.js';
   import { mapState, mapMutations } from 'vuex';
   export default {
@@ -212,8 +225,10 @@
               clean: ""
            },
            completeOutSaleShow: false,
            overTmWaixiao: null
            overTmWaixiao: null,
            // 判读网络状态,
            normalCode: true,
            onlineurl,
         };
      },
      onShow() {
@@ -259,7 +274,6 @@
         init() {
            this.$reqGet('coalDayPage', { id: this.orderPlanId }).then(res => {
               if (res.code == 0) {
                  // this.dayRZ = res.data;
                  this.dayRZ = res.data.map(v => {
                     let slicedate = v.taskStatusDes.slice(0, 10);
                     if (slicedate == this.currentDate) {
@@ -349,24 +363,31 @@
         },
         // 日志查询
         coalDayPage() {
            this.interval = setInterval(() => {
               this.$reqGet('coalDayPage', { id: this.orderPlanId }).then(res => {
                  if (res.code == 0) {
                     // this.dayRZ = res.data;
                     this.dayRZ = res.data.map(v => {
                        let slicedate = v.taskStatusDes.slice(0, 10);
                        if (slicedate == this.currentDate) {
                           return {
                              ...v,
                              taskStatusDes: v.taskStatusDes.slice(10)
                           };
                        } else {
                           return { ...v }
                        }
                     });
                  }
               });
            }, 10000);
            if (this.normalCode) {
               this.interval = setInterval(() => {
                  this.$reqGet('coalDayPage', { id: this.orderPlanId }).then(res => {
                     if (res.code == 0) {
                        this.normalCode = true;
                        this.dayRZ = res.data.map(v => {
                           let slicedate = v.taskStatusDes.slice(0, 10);
                           if (slicedate == this.currentDate) {
                              return {
                                 ...v,
                                 taskStatusDes: v.taskStatusDes.slice(10)
                              };
                           } else {
                              return { ...v }
                           }
                        });
                     } else {
                        this.normalCode = false;
                     }
                  });
               }, 10000);
            } else {
               clearInterval(this.interval)
               this.$u.toast('服务器错误,请稍后重试')
            }
         },
         // 展示提煤单详情
         showCaolPickUpBill() {
@@ -604,9 +625,6 @@
            height: 100%;
            min-height: 380rpx;
            margin: vww(18) vww(7) vww(11) vww(17);
            // flex-direction: column;
            // justify-content: space-between;
            // align-items: flex-start;
         }
         .status-button {
@@ -671,39 +689,60 @@
            color: #7d7d7d;
         }
         .weigh-item {
            width: 100%;
            height: vww(36);
            @include flex;
            justify-content: space-around;
            .item {
               min-width: vww(50);
               height: vww(45);
               font-size: 21rpx;
               font-weight: 400;
               color: #ffffff;
               text-align: center;
               line-height: vww(30);
      }
      // 称重历史
      .weigh-history {
         @extend .block-information;
         .block-main {
            @extend .block-main;
            gap: 10rpx 20rpx;
            .weigh-item {
               width: 100%;
               height: vww(80);
               @include flex;
               flex-direction: column;
               justify-content: space-around;
               align-items: flex-start;
               .concrete {
                  width: vww(36);
               .item-block {
                  width: 100%;
                  height: vww(36);
               }
                  @include flex;
                  justify-content: space-around;
               .num {
                  font-size: 40rpx;
                  font-weight: 300;
                  color: #303030;
                  .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;
                     }
                  }
               }
            }
         }
      }
      // 时间线
      .timeLine {
         height: 40%;
         height: 300rpx;
         min-height: 300rpx;
         margin: vww(20);
         position: relative;