qingyiay
2023-05-30 4b74ae71c84d7c3a2fcc83d1ef75f11f8f8c05e0
pages/driver-page/driver-index/bill-of-lading-details/bill-of-lading-details.vue
@@ -1,46 +1,56 @@
<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;">
      <view class="top-banner"
         style="background: url('https://mx.jzeg.cn:9095/appimg/image/banner/loadingbanner.png') no-repeat;background-size: cover;">
         <view class="top-information">
            <view class="cutomer-name" v-if="orderType == '转入' || orderType == '转出'">煤场:{{ coalDetailsData.filedName || '' }}</view>
            <view class="cutomer-name" v-else>客户:{{ coalDetailsData.customerName || '' }}</view>
            <view class="cutomer-name"
               v-if="orderType == '转入' || orderType == '转出'">煤场:{{ coalDetailsData.toFiledName || '' }}</view>
            <view class="cutomer-name"
               v-else>客户:{{ coalDetailsData.customerName || '' }}</view>
            <view class="fild-name">
               <view class="">矿场:{{ coalDetailsData.deptName || '暂无' }}</view>
               <view class="" v-if="orderType == '转入' || orderType == '转出'">煤场:{{ coalDetailsData.toFiledName || '' }}</view>
               <view class="" v-else>煤场:{{ coalDetailsData.filedName || '暂无' }}</view>
               <view class=""
                  v-if="orderType == '转入' || orderType == '转出'">煤场:{{ coalDetailsData.filedName || '' }}</view>
               <view class=""
                  v-else>煤场:{{ coalDetailsData.filedName || '暂无' }}</view>
            </view>
         </view>
         <view class="block-information">
            <view class="block-main">
               <view class="basic">
                  <view class="coalName">{{ coalDetailsData.coalName }}</view>
                  <!-- <view class="black-block"></view>
                  <view class="order-type">{{ coalDetailsData.orderType }}</view> -->
                  <view
                     class="status-button"
                  <view class="status-button"
                     style="background: url('https://mx.jzeg.cn:9095/appimg/image/banner/statusbutton.png') no-repeat;
                              background-size: cover;"
                  >
                              background-size: cover;">
                     {{ coalStatus[coalDetailsData.status] || '' }}
                  </view>
               </view>
               <view class="time">
                  <view class="time-icon"><u-icon name="clock" color="#515151" size="40"></u-icon></view>
                  <view class="time-icon"><u-icon name="clock"
                        color="#515151"
                        size="40"></u-icon></view>
                  <view class="send-date">{{ coalDetailsData.sendDate }}</view>
               </view>
               <view class="coal-code">提煤单编号:&nbsp;&nbsp;{{ coalDetailsData.code || '' }}</view>
               <view class="order-code">订单编号:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{ coalDetailsData.orderCode || '' }}</view>
               <view class="order-code">
                  订单编号:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{ coalDetailsData.orderCode || '' }}</view>
               <view class="weigh-item">
                  <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="concrete"
                        style="background: url('https://mx.jzeg.cn:9095/appimg/image/banner/skin.png') no-repeat;background-size: cover;">
                        皮</view>
                     <view class="num">{{ coalDetailsData.skin }}</view>
                  </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="concrete"
                        style="background: url('https://mx.jzeg.cn:9095/appimg/image/banner/hair.png') no-repeat;background-size: cover;">
                        毛</view>
                     <view class="num">{{ coalDetailsData.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="concrete"
                        style="background: url('https://mx.jzeg.cn:9095/appimg/image/banner/clean.png') no-repeat;background-size: cover;">
                        净</view>
                     <view class="num">{{ coalDetailsData.clean }}</view>
                  </view>
               </view>
@@ -49,35 +59,74 @@
      </view>
      <view class="timeLine">
         <u-steps :current="dayRZ.length - 1" direction="column" dot>
            <u-steps-item :title="item.taskStatusDes" v-for="(item, index) in dayRZ" :key="index"></u-steps-item>
         <u-steps :current="dayRZ.length - 1"
            direction="column"
            dot>
            <u-steps-item :title="item.taskStatusDes"
               v-for="(item, index) in dayRZ"
               :key="index"></u-steps-item>
         </u-steps>
      </view>
      <view class="white-block">
      </view>
      <view class="utilsBox">
         <view class="utils_chil utils_chilTop">
            <view class="top-button">
               <u-button text="签到" type="primary" plain @click="arriveClick" shape="circle" :disabled="coalDetailsData.status >= 2"></u-button>
               <u-button text="入场申请" type="primary" plain @click="rcsqClick" shape="circle" :disabled="coalDetailsData.status >= 3"></u-button>
               <u-button text="签到"
                  type="primary"
                  plain
                  @click="arriveClick"
                  shape="circle"
                  :disabled="coalDetailsData.status >= 2"></u-button>
               <u-button text="入场申请"
                  type="primary"
                  plain
                  @click="rcsqClick"
                  shape="circle"
                  :disabled="coalDetailsData.status >= 3"></u-button>
            </view>
            <view class="bottom-button">
               <u-button text="放空" type="primary" plain @click="evacuation" throttleTime="500" shape="circle" :disabled="isEvacuation || isapproach"></u-button>
               <u-button text="呼叫客服" type="primary" plain @click="callCustomerService" shape="circle"></u-button>
               <u-button text="放空"
                  type="primary"
                  plain
                  @click="evacuation"
                  throttleTime="500"
                  shape="circle"
                  :disabled="isEvacuation || isapproach"></u-button>
               <u-button text="呼叫客服"
                  type="primary"
                  plain
                  @click="callCustomerService"
                  shape="circle"></u-button>
            </view>
         </view>
      </view>
      <view class="weigh-ability">
         <view class="weigh-button"><u-button text="展示提煤单" @click="showCaolPickUpBill" type="primary" shape="circle"></u-button></view>
         <view class="weigh-button"><u-button text="上磅计量" @click="cengZhongClick" type="primary" shape="circle"></u-button></view>
         <view class="weigh-button"><u-button text="展示提煤单"
               @click="showCaolPickUpBill"
               type="primary"
               shape="circle"></u-button></view>
         <view class="weigh-button"><u-button text="上磅计量"
               @click="cengZhongClick"
               type="primary"
               shape="circle"></u-button></view>
      </view>
      <view class="evacuationModal">
         <u-modal
            :show="evacuationModalShow"
         <u-modal :show="evacuationModalShow"
            :title="evacuationTitle"
            :content="evacuationContent"
            :showCancelButton="true"
            @confirm="evacuationConfirm"
            @cancel="evacuationCancel"
         ></u-modal>
            @cancel="evacuationCancel"></u-modal>
      </view>
      <view class="completeOutSale">
         <u-modal :show="completeOutSaleShow"
            title="确认"
            content="是否完成外销提煤单"
            :showCancelButton="true"
            @confirm="completeOutSaleConfirm"
            @cancel="completeOutSaleCancel"></u-modal>
      </view>
   </view>
</template>
@@ -87,11 +136,12 @@
import { mapState, mapMutations } from 'vuex';
export default {
   onLoad(value) {
      if (value.orderPlanId && value.yyId) {
         this.orderPlanId = value.orderPlanId;
         this.yyId = value.yyId;
         if (value.overTmWaixiao) {
            this.overTmWaixiao = value.overTmWaixiao
            this.getWeightHouseObj.overTmWaixiao = value.overTmWaixiao
      }
      // wx.startRecord();
   },
   data() {
      return {
@@ -124,7 +174,9 @@
            openId: null,
            openName: ''
         },
         coalStatus: ['领取', '预约', '签到', '入场', '称皮', '称毛', '离场', '入磅房', '出磅房', '入煤仓', '出煤仓', '放空', '作废', '入场申请', '进入场院'], // 状态
            coalStatus: ['领取', '预约', '签到', '入场', '称皮', '称毛', '离场', '入磅房', '出磅房', '入煤仓', '出煤仓', '放空', '作废', '入场申请',
               '进入场院'
            ], // 状态
         weighHouseCode: '',
         // 放空弹窗控制变量
         evacuationModalShow: false,
@@ -145,7 +197,17 @@
         scrollTop: 0,
         // 磅单类型
         orderType: '',
         interval: ''
            interval: '',
            // 完成外销订单
            completeOutSale: {
               deptId: "",
               filedId: "",
               orderType: "",
               clean: ""
            },
            completeOutSaleShow: false,
            overTmWaixiao: null
      };
   },
   onShow() {
@@ -177,24 +239,26 @@
      },
      //
      isEvacuation() {
         return this.coalDetailsData.hair == 0 || this.coalDetailsData.skin == 0;
            return this.coalDetailsData.hair !== 0 || this.coalDetailsData.skin !== 0;
      },
      isapproach() {
         return this.currentPageCoalStatus < 3;
            return this.currentPageCoalStatus <= 3;
      }
   },
   methods: {
      init() {
         this.$reqGet('coalDayPage', { id: this.orderPlanId }).then(res => {
            if (res.code == 0) {
               this.dayRZ = res.data;
               this.dayRZ = this.dayRZ.map(v => {
                  // 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 }
                  }
               });
            }
@@ -230,6 +294,11 @@
               console.log(res, '提煤单详情');
               this.coalDetailsData = res.data;
               this.orderType = this.coalDetailsData.orderType;
                  // 判断是否完成外销订单
                  this.completeOutSale.orderType = this.coalDetailsData.orderType;
                  this.completeOutSale.deptId = this.coalDetailsData.deptId;
                  this.completeOutSale.filedId = this.coalDetailsData.filedId;
                  this.completeOutSale.clean = this.coalDetailsData.clean;
               // 获取所在磅房参数赋值
               this.getWeightHouseObj.deptId = this.coalDetailsData.deptId;
               this.getWeightHouseObj.filedId = this.coalDetailsData.filedId;
@@ -252,21 +321,39 @@
            } else {
               this.$u.toast('加载失败');
            }
         });
            }).then(() => {
               if (this.completeOutSale.orderType == "内购" || this.completeOutSale.orderType == "转入") {
                  if (this.completeOutSale.clean !== 0 && this.currentPageCoalStatus !== 6 && this
                     .currentPageCoalStatus !== 11 && this.currentPageCoalStatus !== 12) {
                     this.$reqGet('getTmTaskCoalOrderType', {
                        deptId: this.completeOutSale.deptId,
                        filedId: this.completeOutSale.filedId,
                        orderType: '外销'
                     }).then(res => {
                        if (res.data && res.data?.length !== 0) {
                           this.completeOutSaleShow = true
                           console.log(res, '完成外销订单');
                        }
                     })
                  }
               }
            })
      },
      // 日志查询
      coalDayPage() {
         this.interval = setInterval(() => {
            this.$reqGet('coalDayPage', { id: this.orderPlanId }).then(res => {
               if (res.code == 0) {
                  this.dayRZ = res.data;
                  this.dayRZ = this.dayRZ.map(v => {
                     // 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 }
                     }
                  });
               }
@@ -315,8 +402,16 @@
                  }
               } else {
                  wx.join1v1Chat({
                     caller: { nickname: uni.getStorageSync('name'), openid: uni.getStorageSync('openid') },
                     listener: { nickname: uni.getStorageSync('customerName'), openid: uni.getStorageSync('customeropenId') }, // 这里的openid是fyy的,充当固定的客服openid
                        caller: {
                           nickname: uni.getStorageSync('name'),
                           openid: uni.getStorageSync(
                              'openid')
                        },
                        listener: {
                           nickname: uni.getStorageSync('customerName'),
                           openid: uni.getStorageSync(
                              'customeropenId')
                        }, // 这里的openid是fyy的,充当固定的客服openid
                     backgroundType: 2,
                     roomType: 'voice',
                     success() {
@@ -356,7 +451,7 @@
                     res.data.id
                  }&gateCameraId=${res.data.lastEquipmentId}&gateCameraCode=${res.data.lastEquipmentCode}&weighHouseCode=${res.data.code}&primarySkin=${
                     this.primarySkin
                  }&primaryHair=${this.primaryHair}&psrimaryClean=${this.primaryClean}&sceneInOut=${res.data.sceneInOut}`
                  }&primaryHair=${this.primaryHair}&psrimaryClean=${this.primaryClean}&sceneInOut=${res.data.sceneInOut}&overTmWaixiao=${this.overTmWaixiao}`
               });
            } else {
               this.$u.toast('未在磅房,请前往磅房后再试!!');
@@ -388,12 +483,24 @@
      // 放空弹窗取消
      evacuationCancel() {
         this.evacuationModalShow = false;
      }
         },
         // 完成外销确定
         completeOutSaleConfirm() {
            this.completeOutSaleShow = false
            uni.navigateTo({
               url: `/pages/driver-page/driver-index/bill-of-lading-details/completeOutSale/completeOutSale?deptId=${this.completeOutSale.deptId}&filedId=${this.completeOutSale.filedId}`
            })
         },
         // 完成外销取消
         completeOutSaleCancel() {
            this.completeOutSaleShow = false
         },
   }
};
</script>
<style lang="scss" scoped>
<style lang="scss"
   scoped>
/deep/.u-steps {
   .u-steps-item {
      .u-steps-item__content {
@@ -407,20 +514,24 @@
      }
   }
}
@mixin flex {
   display: flex;
   justify-content: space-between;
   align-items: center;
}
::v-deep.bill-of-lading-details {
   width: 100%;
   height: 100vh;
   margin: 0 auto;
   display: flex;
   flex-direction: column;
   .top-banner {
      width: 100%;
      height: 346rpx;
      .top-information {
         width: 94%;
         margin: 0 auto;
@@ -433,15 +544,28 @@
         color: #ffffff;
         font-size: 31rpx;
         font-weight: 300;
            .cutomer-name {
               width: 100%;
               white-space: nowrap;
               overflow: hidden;
               text-overflow: ellipsis;
            }
         .fild-name {
            @include flex;
            justify-content: space-between;
            width: 100%;
            view {
               min-width: 296rpx;
                  white-space: nowrap;
                  overflow: hidden;
                  text-overflow: ellipsis;
            }
         }
      }
      .block-information {
         width: 690rpx;
         height: 396rpx;
@@ -454,6 +578,7 @@
         font-weight: 300;
         color: #303030;
         overflow: hidden;
         .block-main {
            @include flex width: 94%;
            height: 336rpx;
@@ -462,6 +587,7 @@
            justify-content: space-between;
            align-items: flex-start;
         }
         .status-button {
            width: vww(71);
            height: vww(36);
@@ -473,11 +599,13 @@
            right: vww(10);
            color: #fff;
         }
         .basic {
            width: 100%;
            height: vww(15);
            @include flex;
            justify-content: flex-start;
            .coalName,
            .order-type {
               width: 45%;
@@ -487,6 +615,7 @@
               color: #515151;
               position: relative;
            }
            .black-block {
               width: 2rpx;
               height: 30rpx;
@@ -495,11 +624,13 @@
               top: vww(2);
            }
         }
         .time {
            width: 35%;
            height: vww(12);
            display: flex;
            justify-content: flex-start;
            .send-date {
               width: 148rpx;
               height: 24rpx;
@@ -509,6 +640,7 @@
               color: #515151;
            }
         }
         .coal-code,
         .order-code {
            width: 100%;
@@ -517,11 +649,13 @@
            font-weight: 300;
            color: #7d7d7d;
         }
         .weigh-item {
            width: 100%;
            height: vww(36);
            @include flex;
            justify-content: space-around;
            .item {
               min-width: vww(50);
               height: vww(45);
@@ -531,10 +665,12 @@
               text-align: center;
               line-height: vww(30);
               @include flex;
               .concrete {
                  width: vww(36);
                  height: vww(36);
               }
               .num {
                  font-size: 40rpx;
                  font-weight: 300;
@@ -544,6 +680,7 @@
         }
      }
   }
   .timeLine {
      height: 40%;
      margin: vww(20);
@@ -551,15 +688,18 @@
      top: vww(120);
      overflow-y: overlay;
      padding: vww(20);
      .u-steps {
         .u-steps-item {
            padding-bottom: vww(35);
            .u-steps-item__wrapper {
               .u-steps-item__wrapper__dot {
                  background: linear-gradient(-29deg, #426cff 0%, #7991ff 100%);
                  box-shadow: 2rpx 7rpx 10rpx 0rpx rgba(172, 172, 172, 0.64);
               }
            }
            .u-steps-item__line {
               height: vww(52) !important;
               background: #e9e6ea !important;
@@ -567,19 +707,29 @@
         }
      }
   }
      .white-block {
         width: 100%;
         height: vww(20);
         background-color: #fff;
      }
   .utilsBox {
      width: 94%;
      margin: 0 auto;
      position: relative;
      top: vww(80);
      .utils_chil {
         width: 100%;
         margin: 0 auto;
         .top-button,
         .bottom-button {
            width: 100%;
            height: vww(47);
            @include flex;
            .u-button {
               width: 40%;
               height: 60rpx;
@@ -591,6 +741,7 @@
         }
      }
   }
   .weigh-ability {
      width: 631rpx;
      height: vww(100);
@@ -598,9 +749,11 @@
      margin-bottom: vww(10);
      @include flex;
      flex-direction: column;
      .weigh-button {
         width: 631rpx;
         height: vww(89);
         .u-button {
            font-size: 28rpx;
            font-weight: 300;