wk
2024-07-09 b77f2eb3717762c6638856ebe76812c8b1986b57
pages/doorkeeper-page/doorkeeper-index/doorkeeper-index.vue
@@ -1,47 +1,74 @@
<template>
      <view class="appointment">
         <view class="wait-collection"
            style="background: url('https://mx.jzeg.cn:9096/appimg/image/banner/diverbanner.png') no-repeat;background-size:contain">
         <view class="searchview">
            <u-search @change="change" :searchIconSize="40" placeholder="请输入车牌号" height="80" clearabled v-model="carNo" @search="search" @custom="custom" @clear="clear" >
            </u-search >
         </view>
         <uni-table border
            stripe
            emptyText="暂无更多数据">
            <uni-tr>
               <uni-th align="center">司机</uni-th>
               <uni-th align="center">产品</uni-th>
               <uni-th align="center">车牌号</uni-th>
               <uni-th align="center">产品</uni-th>
               <uni-th align="center">司机</uni-th>
               <uni-th align="center">手机号</uni-th>
               <uni-th align="center">预约时间</uni-th>
               <uni-th align="center">操作</uni-th>
            </uni-tr>
            <uni-tr v-for="(item, index) in driverBillOfLoadingData"
               :key="item.id">
               <uni-td align="center">{{ item.driver  }}</uni-td>
               <uni-td align="center">{{ item.productName || '' }}</uni-td>
               <uni-td align="center">{{ item.carNo || '' }}</uni-td>
               <uni-td align="center">{{ item.productNames || '' }}</uni-td>
               <uni-td align="center">{{ item.driver  }}</uni-td>
               <uni-td align="center">{{ item.phone || '' }}</uni-td>
               <uni-td><u-button text="选择"
                     type="primary"
                     @click="yuYueBtnClick(item)"></u-button></uni-td>
               <uni-td align="center">{{ item.startTime || '' }}-{{item.endTime || ""}}</uni-td>
               <uni-td>
                  <view class="buttons">
                     <u-button text="查看运输证"
                        type="primary"
                        class="buttonitem"
                        v-if="item.roadTransportId"
                        @click="lookRoad(item)"></u-button>
                     <u-button text="检查"
                        type="primary"
                        class="buttonitem"
                        @click="yuYueBtnClick(item)"></u-button>
                  </view>
               </uni-td>
            </uni-tr>
         </uni-table>
         <view v-show="isshow">
            <uni-table border
               stripe
               type="selection"
               @selection-change="selectionChange"
               emptyText="暂无更多数据">
               <uni-tr>
                  <uni-th align="center">检测项</uni-th>
               </uni-tr>
               <uni-tr v-for="(item, index) in inspectData"
                  :key="item.id">
                  <uni-td align="center">{{ item.title  }}</uni-td>
               </uni-tr>
            </uni-table>
            <view class="fourth-line">
               <view class="button-img"
                  @click.stop="toAppointmentClick(item)">确定</view>
         <u-popup :show="imgshow"
            @close="closeimg"
            @open="openimg"
            mode="center"
            round="10">
            <view class="imgrPopup">
                  <u--image :showLoading="true"
                     :src="certificateImg != null ? BaseUrl + certificateImg : ''"
                     width="700rpx"
                     height="400rpx"
                     @click="imageClick(certificateImg)">
                     <view slot="error"
                        style="font-size: 24rpx;">加载失败</view>
                  </u--image>
                  <view class="driveruser">
                     <view>司机:{{ysData.driverName}}</view>
                  </view>
                  <view class="driveruser">
                     <view>押运员:{{ysData.supercargoInfo?ysData.supercargoInfo.split("|")[0]:null}}</view>
                     <view>手机号:{{ysData.supercargoInfo?ysData.supercargoInfo.split("|")[2]:null}}</view>
                  </view>
            </view>
         </u-popup>
         <view class="previewImage-container">
            <u-popup :show="previewImageShow"
               mode="center"
               @close="previewImageClose"
               @open="previewImageOpen">
               <u--image :src="previewImageSrc != null ? BaseUrl + previewImageSrc : ''"
                  width="400px"
                  height="400px"></u--image>
            </u-popup>
         </view>
         <u-popup :show="show"
            @close="close"
@@ -49,18 +76,39 @@
            mode="center"
            round="10">
            <view class="receiverPopup">
               <uni-table border
                  stripe
                  type="selection"
                  @selection-change="selectionChange"
                  emptyText="暂无更多数据">
                  <uni-tr>
                     <uni-th align="center">检测项</uni-th>
                  </uni-tr>
                  <uni-tr v-for="(item, index) in inspectData"
                     :key="item.id">
                     <uni-td align="center">{{ item.title  }}</uni-td>
                  </uni-tr>
               </uni-table>
               <view class="receiverPopup__title"><text>确定检查完毕</text></view>
               <view class="receiverPopup__btn"><u-button text="确定"
                     type="primary"
                     @click="popClick"
                     :disabled="canClick"
                     :loading="ClickLoading"></u-button></view>
            </view>
         </u-popup>
         <view class="logoutModel">
            <u-modal :show="logoutShow"
               :title="logoutTitle"
               showCancelButton
               :content="logoutContent"
               @confirm="logoutConfirm"
               @cancel="logoutCancel"></u-modal>
         </view>
      </view>
</template>
<script>
   import { BaseUrl } from '@/api/publicInterface.js';
   export default {
      components: {
      },
@@ -70,47 +118,26 @@
            driverBillOfLoadingData:[],
            inspectData:[],
            isAllSelected:false,
            isshow:false,
            form:{},
            ClickLoading:false
            form:{},
            BaseUrl,
            carNo:'',
            previewImageShow:false,
            imgshow:false,
            ClickLoading:false,
            certificateImg:"",
            logoutShow: false,
            logoutTitle: '提示',
            logoutContent: '是否检查完毕',
            previewImageSrc:"",
            ysData:{}
         }
      },
      onShow() {
         this.init();
      },
      methods: {
         yuYueBtnClick(item){
            this.inspectData=JSON.parse(item.inspectedResult)
            this.form=item
            this.isshow=true
         },
         selectionChange(items){
           const allIds = this.inspectData.map(item => item);
           this.isAllSelected = items?.detail.index.length === allIds.length
         },
         init() {
            this.isAllSelected=false
            this.TaskCoalList();
            this.form={}
            this.inspectData=[]
            this.isshow=false
         },
         toAppointmentClick(){
         logoutConfirm() {
            if(this.isAllSelected==true){
               let arr= this.driverBillOfLoadingData.map(i=>{
                  return {
                     carNo:i.carNo,
                     taskId:i.id,
                     taskcode:i.code,
                     }
               })
               this.show = true;
            }else{
               uni.$u.toast('必须全部检测')
            }
         },
         popClick() {
               this.ClickLoading = true;
               this.inspectData=this.inspectData.map(item=>{
                  return {
@@ -131,33 +158,168 @@
                     this.ClickLoading = false;
                     this.inspectData=[]
                     this.show = false;
                     this.isshow=false
                     this.logoutShow = false;
                     this.TaskCoalList()
                  } else {
                     uni.$u.toast(res.msg ? res.msg : '检查失败')
                     this.logoutShow = false;
                  }
               })
            }else{
               uni.$u.toast('必须全部检测')
            }
         },
         logoutCancel() {
            this.logoutShow = false;
         },
         previewImageClose() {
            this.previewImageShow = false;
         },
         previewImageOpen() {},
         imageClick(data) {
            this.previewImageSrc = data;
            this.$nextTick(() => {
               this.previewImageShow = true;
            });
         },
         lookRoad(item){
            this.$reqGetId('getById', item.roadTransportId).then(res => {
               this.certificateImg=res.data.certificateImg
               this.ysData=res.data
               this.imgshow=true
            });
         },
         yuYueBtnClick(item){
            let char = "运输证";
            if (item.inspectedResult.includes(char)) {
               if(item.roadTransportId){
                  if(item.inspectedResult){
                     this.inspectData=JSON.parse(item.inspectedResult)
                     this.form=item
                     this.show = true;
                  }else{
                     this.inspectData=[]
                     this.form=item
                     uni.showLoading({ title: '加载中...' });
                     this.$reqPost('addCheckLog',{
                                 carNo:this.form.carNo,
                                 taskId:this.form.id,
                                 taskcode:this.form.code,
                              }, 'json').then(res => {
                        if (res.code === 0) {
                           uni.$u.toast('检查成功')
                           this.form={}
                           this.ClickLoading = false;
                           this.show = false;
                           this.TaskCoalList()
                        } else {
                           uni.$u.toast(res.msg ? res.msg : '检查失败')
                        }
                     })
                  }
               }else{
                  uni.$u.toast('该司机未上传运输证!')
               }
            } else {
               if(item.inspectedResult){
                  this.inspectData=JSON.parse(item.inspectedResult)
                  this.form=item
                  this.show = true;
               }else{
                  this.inspectData=[]
                  this.form=item
                  uni.showLoading({ title: '加载中...' });
                  this.$reqPost('addCheckLog',{
                              carNo:this.form.carNo,
                              taskId:this.form.id,
                              taskcode:this.form.code,
                           }, 'json').then(res => {
                     if (res.code === 0) {
                        uni.$u.toast('检查成功')
                        this.form={}
                        this.ClickLoading = false;
                        this.show = false;
                        this.TaskCoalList()
                     } else {
                        uni.$u.toast(res.msg ? res.msg : '检查失败')
                     }
                  })
               }
            }
         },
         selectionChange(items){
           const allIds = this.inspectData.map(item => item);
           this.isAllSelected = items?.detail.index.length === allIds.length
         },
         init() {
            this.isAllSelected=false
            this.TaskCoalList();
            this.form={}
            this.inspectData=[]
            this.certificateImg=""
         },
         popClick() {
               this.logoutShow = true;
         },
         open() {},
         close() {
            this.show = false;
         },
         openimg() {},
         closeimg() {
            this.imgshow = false;
         },
         // 司机首页列表
         TaskCoalList() {
            uni.showLoading({
               title: '加载中...'
            });
            this.$reqGet('getCheckTaskCoal',{flag:0}).then(res => {
               uni.hideLoading();
               this.driverBillOfLoadingData = res.data;
            });
            if(!this.carNo){
               this.$reqGet('getCheckTaskCoal',{flag:0}).then(res => {
                  uni.hideLoading();
                  this.driverBillOfLoadingData = res.data;
               });
            }else{
               this.$reqGet('getCheckTaskCoal',{flag:0,carNo:this.carNo}).then(res => {
                  uni.hideLoading();
                  this.driverBillOfLoadingData = res.data;
               });
            }
            
         },
         change(res) {
         },
         search(res) {
            this.TaskCoalList()
         },
         clear(res) {
            this.carNo=""
         },
         custom(res) {
         }
      }
   };
</script>
<style lang="scss" scoped>
   .searchview{
      margin: 20rpx 0;
      height: 200rpx;
      u-search{
         width: 100rpx;
      }
   }
   .imgrPopup{
      width: 700rpx;
      background-color: #ffffff;
      .driveruser{
         display: flex;
         justify-content: space-between
      }
   }
   .receiverPopup {
      height: vww(110);
      width: 300rpx;
@@ -178,10 +340,6 @@
         }
      }
   }
   .wait-collection {
         width: 100%;
         height: 600rpx;
      }
   ::v-deep.appointment {
      .appointment-description {
         margin: vww(8) 0;
@@ -254,4 +412,16 @@
         }
      }
   }
   .wait-appointment,
   .Reserved {
      position: relative;
      top: vww(-120);
   }
   .buttons{
      display: flex;
      justify-content: space-between;
      .buttonitem{
         width: 30%;
      }
   }
</style>