feat:门卫产品名称

wk

2024-08-15 035f4fd656f086803eb7643e73a8a769cf901f69

 pages/doorkeeper-page/doorkeeper-index/doorkeeper-index.vue

@@ -1,42 +1,61 @@
<template>
      <view class="appointment">
         <view class="searchview">
            <u-search @change="change" :searchIconSize="40" placeholder="请输入车牌号" height="80" clearabled v-model="carNo" @search="search" @custom="custom" @clear="clear" >
            <u-search @change="change" :searchIconSize="40" placeholder="请输入车牌号" height="60" 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-tr>
            <uni-tr v-for="(item, index) in driverBillOfLoadingData"
               :key="item.id">
               <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 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 style="position: relative;top: -40px;">
            <u-empty mode="data"
               icon="http://cdn.uviewui.com/uview/empty/data.png"
               textSize="30"
               iconSize="1000"
               text="暂无车辆"
               v-if="driverBillOfLoadingData.length == 0"></u-empty>
         </view>
         <view class="collection-form">
            <view class="collection-form-item"
               v-for="(item, index) in driverBillOfLoadingData"
               :key="index">
               <view class="first-line">
                  <view class="dispatch-receive">
                     <view class="dispatch-dept">{{ item.code || ''  }}</view>
                     <view class="black-bar"></view>
                     <view class="dispatch">{{ item.customerName ||'' }}</view>
                  </view>
               </uni-td>
            </uni-tr>
         </uni-table>
                  <view class="point-number">
                     <text class="order-type">{{ item.productNames?limitString(item.productNames,20,'...'):'' || '' }}</text>
                  </view>
               </view>
               <view class="second-line">
                  <view class="coal-name">
                     <view class="dispatch-dept">{{ item.carNo || ''  }}</view>
                     <view class="black-bar"></view>
                     <view class="dispatch">{{ item.driver ||'' }}</view>
                     <view class="black-bar"></view>
                     <text>{{ item.phone || '' }}</text>
                  </view>
               </view>
               <view class="third-line">
                  <view class="time-icon">
                     <view
                        style="width: 24rpx;height: 24rpx;line-height: 24rpx;background: url('https://wrzs.czjlchem.com:9090/appimg/image/banner/clock.png') no-repeat;background-size: cover">
                     </view>
                  </view>
                  <view class="send-date">{{ item.sendDate }} {{ item.startTime || '' }}-{{item.endTime || ""}}</view>
               </view>
               <view class="fourth-line">
                  <view class="receive"
                  v-if="item.roadTransportId"
                     @click.stop="lookRoad(item)">
                     <view class="button-image">道路运输证</view>
                  </view>
                  <view class="forward"
                     @click.stop="yuYueBtnClick(item)">
                     <view class="button-image">检查</view>
                  </view>
               </view>
            </view>
         </view>
         <u-popup :show="imgshow"
            @close="closeimg"
            @open="openimg"
@@ -45,7 +64,7 @@
            <view class="imgrPopup">
                  <u--image :showLoading="true"
                     :src="certificateImg != null ? BaseUrl + certificateImg : ''"
                     width="700rpx"
                     width="100%"
                     height="400rpx"
                     @click="imageClick(certificateImg)">
                     <view slot="error"
@@ -66,8 +85,8 @@
               @close="previewImageClose"
               @open="previewImageOpen">
               <u--image :src="previewImageSrc != null ? BaseUrl + previewImageSrc : ''"
                  width="400px"
                  height="400px"></u--image>
               width="750rpx"
               height="800rpx"></u--image>
            </u-popup>
         </view>
         <u-popup :show="show"
@@ -117,8 +136,10 @@

<script>
   import { BaseUrl } from '@/api/publicInterface.js';
   import previewImage from '@/components/kxj-previewImage/kxj-previewImage.vue';
   export default {
      components: {
         previewImage,
      },
      data() {
         return {
@@ -145,6 +166,10 @@
         this.init();
      },
      methods: {
         limitString(str, limit, suffix = '...') {
            if (str.length <= limit) return str;
            return str.slice(0, limit) + suffix;
         },
         falseConfirm(){
            this.inspectData=[]
            uni.showLoading({ title: '加载中...' });
@@ -297,11 +322,13 @@
               this.$reqGet('getCheckTaskCoal',{flag:0}).then(res => {
                  uni.hideLoading();
                  this.driverBillOfLoadingData = res.data;
                  uni.stopPullDownRefresh();
               });
            }else{
               this.$reqGet('getCheckTaskCoal',{flag:0,carNo:this.carNo}).then(res => {
                  uni.hideLoading();
                  this.driverBillOfLoadingData = res.data;
                  uni.stopPullDownRefresh();
               });
            }
            
@@ -324,13 +351,13 @@
<style lang="scss" scoped>
   .searchview{
      margin: 20rpx 0;
      height: 200rpx;
      height: 100rpx;
      u-search{
         width: 100rpx;
      }
   }
   .imgrPopup{
      width: 700rpx;
      width: 80vw;
      background-color: #ffffff;
      .driveruser{
         display: flex;
@@ -338,10 +365,11 @@
      }
   }
   .receiverPopup {
      height: vww(110);
      width: 300rpx;
      height: vww(153);
      width: 60vw;
      
      .receiverPopup__title {
         font-size: 1.4vw;
         margin: vww(10) auto 0;
         width: 80%;
         text-align: center;
@@ -357,6 +385,19 @@
         }
      }
   }
   /deep/.u-button {
      width: 100%;
      height: 28px !important;
      line-height: 40px;
      padding: 0 12px;
      font-size: 28rpx;
      font-weight: 300;
      color: #ffffff;
      background: #497bfb !important;
      letter-spacing: 4rpx;
      border-radius: 37rpx 37rpx 37rpx 37rpx !important;
      box-shadow: 2rpx 3rpx 13rpx 0rpx rgba(43, 98, 239, 0.5), 0rpx 0rpx 9rpx 0rpx rgba(247, 250, 253, 0.29);
   }
   ::v-deep.appointment {
      .appointment-description {
         margin: vww(8) 0;
@@ -369,32 +410,7 @@
            color: #252525;
         }
      }
      @mixin fourthLine {
         width: 64%;
         height: vww(68);
         display: flex;
         align-items: center;
         position: relative;
         left: vww(102);
         bottom: vww(3);
      
         .button-img {
            width: vww(122);
            height: vww(41);
            background: url('https://mx.jzeg.cn:9096/appimg/image/banner/button.png') no-repeat;
            background-size: cover;
            font-size: 28rpx;
            font-weight: 300;
            color: #ffffff;
            text-align: center;
            line-height: vww(40);
		
         }
      }
      .fourth-line {
         @include fourthLine;
      }

      // 表格
      .uni-table-scroll {
         width: 100%;
@@ -402,25 +418,29 @@

         .uni-table {
            min-width: 0 !important;

            .checkbox {
               background: #ffffff;
            }
            .uni-table-tr {
               padding: 0;
               font-size: vww(10);

               .uni-table-th {
                  height: vww(32);
                  line-height: vww(20);
                  padding: vww(5) vww(10);
                  color: #111111;
                  font-size: 2vw;
                  font-weight: 550;
                  background: #f5f5f5;
                  background: #ffffff;
               }

               .uni-table-td {
                  height: vww(32);
                  line-height: vww(20);
                  padding: vww(5) vww(5);
                  font-size: 1.5vw;
                  color: #111111;
                  background: #ffffff;
                  .u-button {
                     height: vww(23);
                  }
@@ -434,11 +454,186 @@
      position: relative;
      top: vww(-120);
   }
   .buttons{
   @mixin flex {
      display: flex;
      justify-content: space-between;
      .buttonitem{
         width: 30%;
      }
      align-items: center;
   }
   .collection-form-item {
         margin: 0 vww(15);
         width: 95%;
         height: 370rpx;
         background: #ffffff;
         box-shadow: 4rpx 6rpx 25rpx 0rpx rgba(73, 120, 240, 0.15);
         border-radius: 20rpx;
         overflow: hidden;
         @include flex;
         flex-direction: column;
         position: relative;
         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 {
	
                  display: flex;
                  align-items: center;
               }
	
               .black-bar {
                  width: 2rpx;
                  height: 30rpx;
                  background: #515151;
                  margin-left: vww(12);
               }
	
               .dispatch {
                  margin-left: vww(12);
                  min-width: vww(50);
               }
	
            }
	
            .point-number {
               width: 33%;
               .order-type {
                  color: #035cfb;
                  border-radius: 4rpx;
                  text-align: center;
               }
               // text {
               //    font-size: 24rpx;
               //    font-weight: 400;
               //    color: #c78a64;
               // }
	
               // .residue {
               //    font-size: 40rpx;
               //    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: 0 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 {
            height: vww(30);
            margin-left: vww(15);
            display: flex;
            justify-content: flex-start;
            align-items: center;
	
            .send-date {
               margin-left: vww(14);
               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: 30%;
			
            .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);
               }
            }
         }
			
      }
</style>