增加新功能，修复bug

qingyiay

2023-05-30 4b74ae71c84d7c3a2fcc83d1ef75f11f8f8c05e0

 pages/driver-page/driver-index/driver-index.vue

@@ -3,16 +3,25 @@
      <view class="driver-index">
         <view class="driver-index-body">
            <!-- 待领取提煤单 -->
            <view class="wait-collection" style="background: url('https://mx.jzeg.cn:9095/appimg/image/banner/diverbanner.png') no-repeat;background-size:contain"></view>
            <view class="wait-collection"
               style="background: url('https://mx.jzeg.cn:9095/appimg/image/banner/diverbanner.png') no-repeat;background-size:contain">
            </view>
            <view class="collection-form">
               <view class="collection-form-item" v-for="(item, index) in driverBillOfLoadingData.list1" :key="index">
               <view class="collection-form-item"
                  v-for="(item, index) in driverBillOfLoadingData.list1"
                  :key="index">
                  <view class="main-divider"></view>
                  <view class="first-line">
                     <view class="main-information">
                        <view class="sign">装</view>
                        <view class="filedname exceedHide">
                           <text v-if="item.orderType == '外销' || item.orderType == '内销' || item.orderType == '转出'">{{ item.deptName }}</text>
                           <text v-else-if="item.orderType == '外购' || item.orderType == '内购' || item.orderType == '转入'">{{ item.customerNameCopy }}</text>
                           <text
                              v-if="item.orderType == '外销' || item.orderType == '内销'  ">{{ item.deptName|| ''  }}</text>
                           <text
                              v-else-if="item.orderType == '外购' || item.orderType == '内购' ">{{ item.customerId?item.customerName:item.customerNameCopy|| ''  }}</text>
                           <text v-else-if="item.orderType == '转出'|| item.orderType == '转入'">{{item.filedName}}

                           </text>
                        </view>
                     </view>
                     <view class="point-number">
@@ -24,10 +33,15 @@
                     <view class="main-information">
                        <view class="sign">卸</view>
                        <view class="filedname exceedHide">
                           <text v-if="item.orderType == '外销' || item.orderType == '内销' || item.orderType == '转出'">
                              {{ item.customerNameCopy ? item.customerNameCopy : item.customerName }}
                           <text v-if="item.orderType == '外销' || item.orderType == '内销' ">
                              {{ item.customerNameCopy ? item.customerNameCopy : item.customerName|| ''  }}
                           </text>
                           <text v-else-if="item.orderType == '外购' || item.orderType == '内购' || item.orderType == '转入'">{{ item.deptName }}</text>
                           <text
                              v-else-if="item.orderType == '外购' || item.orderType == '内购' ">{{ item.deptName|| ''  }}</text>
                           <text
                              v-else-if="item.orderType == '转出'|| item.orderType == '转入'">{{item.toFiledName}}

                           </text>
                        </view>
                     </view>
                  </view>
@@ -35,61 +49,89 @@
                     <view class="coal-name">{{ item.coalName }}</view>
                  </view> -->
                  <view class="third-line">
                     <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">{{ item.sendDate }}</view>
                     <view class="type">
                        <view class="coal-name">{{ item.coalName }}</view>
                     </view>
                  </view>
                  <view class="fourth-line" @click="qiangDanBtn(item)" v-if="item.carNum - item.taskNum !== 0"><view class="button-img">立即抢单</view></view>
                  <view class="fourth-line"
                     @click="qiangDanBtn(item)"
                     v-if="item.carNum - item.taskNum !== 0">
                     <view class="button-img">立即抢单</view>
                  </view>
               </view>
            </view>
            <!-- 抢单提示模态框 -->
            <view class="qianDanModel">
               <u-modal :show="qiangDanShow" :title="qiangDanTitle" showCancelButton :content="qiangDanContent" @confirm="qiangDanConfirm" @cancel="qiangDanCancel"></u-modal>
               <u-modal :show="qiangDanShow"
                  :title="qiangDanTitle"
                  showCancelButton
                  :content="qiangDanContent"
                  @confirm="qiangDanConfirm"
                  @cancel="qiangDanCancel"></u-modal>
            </view>

            <!-- 待预约提煤单 -->
            <view class="wait-appointment">
               <combined-title title="待预约提煤单"></combined-title>
               <u-empty
                  mode="data"
               <u-empty mode="data"
                  icon="http://cdn.uviewui.com/uview/empty/data.png"
                  textSize="30"
                  iconSize="1000"
                  v-if="driverBillOfLoadingData.list3 ? (driverBillOfLoadingData.list3.length == 0 ? true : false) : true"
               ></u-empty>
                  v-if="driverBillOfLoadingData.list3 ? (driverBillOfLoadingData.list3.length == 0 ? true : false) : true"></u-empty>

               <view class="appointment-form">
                  <view class="appointment-form-item" v-for="(item, index) in driverBillOfLoadingData.list3" :key="index">
                  <view class="appointment-form-item"
                     v-for="(item, index) in driverBillOfLoadingData.list3"
                     :key="index">
                     <view class="main-divider"></view>
                     <view class="first-line">
                        <view class="main-information">
                           <view class="sign">装</view>
                           <view class="filedname exceedHide">
                              <text v-if="item.orderType == '外销' || item.orderType == '内销' || item.orderType == '转出'">{{ item.deptName }}</text>
                              <text v-else-if="item.orderType == '外购' || item.orderType == '内购' || item.orderType == '转入'">{{ item.customerName }}</text>
                              <text
                                 v-if="item.orderType == '外销' || item.orderType == '内销' ">{{ item.deptName }}</text>
                              <text
                                 v-else-if="item.orderType == '外购' || item.orderType == '内购' ">{{ item.customerName }}</text>
                              <text
                                 v-else-if="item.orderType == '转出'|| item.orderType == '转入'">{{item.filedName}}
                              </text>
                           </view>
                        </view>
                        <view class="map-icon" @click.stop="skipMap(item)">
                           <view><u-icon name="map" color="#4978F0" size="40"></u-icon></view>
                        <view class="map-icon"
                           @click.stop="skipMap(item)">
                           <view><u-icon name="map"
                                 color="#4978F0"
                                 size="40"></u-icon></view>
                        </view>
                     </view>
                     <view class="first-extra">
                        <view class="main-information">
                           <view class="sign">卸</view>
                           <view class="filedname exceedHide">
                              <text v-if="item.orderType == '外销' || item.orderType == '内销' || item.orderType == '转出'">{{ item.customerName }}</text>
                              <text v-else-if="item.orderType == '外购' || item.orderType == '内购' || item.orderType == '转入'">{{ item.deptName }}</text>
                              <text
                                 v-if="item.orderType == '外销' || item.orderType == '内销' ">{{ item.customerName }}</text>
                              <text
                                 v-else-if="item.orderType == '外购' || item.orderType == '内购' ">{{ item.deptName }}</text>
                              <text
                                 v-else-if="item.orderType == '转出'|| item.orderType == '转入'">{{item.toFiledName}}</text>
                           </view>
                        </view>
                        <view class="map-icon" @click.stop="skipMap(item)">
                           <view><u-icon name="map" color="#4978F0" size="40"></u-icon></view>
                        <view class="map-icon"
                           @click.stop="skipMap(item)">
                           <view><u-icon name="map"
                                 color="#4978F0"
                                 size="40"></u-icon></view>
                        </view>
                     </view>
                     <view class="third-line">
                        <view class="clock">
                           <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">{{ item.sendDate }}</view>
                        </view>
                        <view class="type">
@@ -97,7 +139,10 @@
                           <!-- <view class="order-type">{{ item.orderType }}</view> -->
                        </view>
                     </view>
                     <view class="fourth-line" @click="toAppointmentClick(item)"><view class="button-img">立即预约</view></view>
                     <view class="fourth-line"
                        @click="toAppointmentClick(item)">
                        <view class="button-img">立即预约</view>
                     </view>
                  </view>
               </view>
            </view>
@@ -105,47 +150,68 @@
            <!-- 已预约提煤单 -->
            <view class="Reserved">
               <combined-title title="已预约提煤单"></combined-title>
               <u-empty
                  mode="data"
               <u-empty mode="data"
                  icon="http://cdn.uviewui.com/uview/empty/data.png"
                  textSize="30"
                  iconSize="1000"
                  v-if="driverBillOfLoadingData.list2 ? (driverBillOfLoadingData.list2.length == 0 ? true : false) : true"
               ></u-empty>
                  v-if="driverBillOfLoadingData.list2 ? (driverBillOfLoadingData.list2.length == 0 ? true : false) : true"></u-empty>
               <view class="appointment-form">
                  <view class="appointment-form-item" v-for="(item, index) in driverBillOfLoadingData.list2" :key="index" @click="list3CardIconClick(item)">
                  <view class="appointment-form-item"
                     v-for="(item, index) in driverBillOfLoadingData.list2"
                     :key="index"
                     @click="list3CardIconClick(item)">
                     <view class="main-divider"></view>
                     <view class="first-line">
                        <view class="main-information">
                           <view class="sign">装</view>
                           <view class="filedname exceedHide">
                              <text v-if="item.orderType == '外销' || item.orderType == '内销' || item.orderType == '转出'">{{ item.deptName }}</text>
                              <text v-else-if="item.orderType == '外购' || item.orderType == '内购' || item.orderType == '转入'">{{ item.customerName }}</text>
                              <text
                                 v-if="item.orderType == '外销' || item.orderType == '内销' ">{{ item.deptName }}</text>
                              <text
                                 v-else-if="item.orderType == '外购' || item.orderType == '内购' ">{{ item.customerName }}</text>
                              <text v-else-if="item.orderType == '转出'||item.orderType == '转入'">
                                 {{item.filedName}}

                              </text>
                           </view>
                        </view>
                        <view class="map-icon" @click.stop="skipMap(item)">
                           <view><u-icon name="map" color="#4978F0" size="40"></u-icon></view>
                        <view class="map-icon"
                           @click.stop="skipMap(item)">
                           <view><u-icon name="map"
                                 color="#4978F0"
                                 size="40"></u-icon></view>
                        </view>
                     </view>
                     <view class="second-line">
                        <view class="main-information">
                           <view class="sign">卸</view>
                           <view class="filedname exceedHide">
                              <text v-if="item.orderType == '外销' || item.orderType == '内销' || item.orderType == '转出'">{{ item.customerName }}</text>
                              <text v-else-if="item.orderType == '外购' || item.orderType == '内购' || item.orderType == '转入'">{{ item.deptName }}</text>
                              <text
                                 v-if="item.orderType == '外销' || item.orderType == '内销' ">{{ item.customerName }}</text>
                              <text
                                 v-else-if="item.orderType == '外购' || item.orderType == '内购'">{{ item.deptName }}</text>
                              <text v-else-if="item.orderType == '转出'||item.orderType == '转入'">
                                 {{item.toFiledName}}

                              </text>
                           </view>
                        </view>
                        <view class="map-icon" @click.stop="skipMap(item)">
                           <view><u-icon name="map" color="#4978F0" size="40"></u-icon></view>
                        <view class="map-icon"
                           @click.stop="skipMap(item)">
                           <view><u-icon name="map"
                                 color="#4978F0"
                                 size="40"></u-icon></view>
                        </view>
                     </view>
                     <view class="third-line">
                        <view class="clock havedclock">
                           <view class="time-icon"><u-icon name="clock" color="#515151" size="40"></u-icon></view>
                           <view class="send-date">{{ item.yuYueSection }}</view>
                           <view class="time-icon"><u-icon name="clock"
                                 color="#515151"
                                 size="40"></u-icon></view>
                           <view class="send-date">{{ item.yuYueSection|| ''  }}</view>
                        </view>
                        <view class="type">
                           <view class="coal-name">{{ item.coalName }}</view>
                           <view class="coal-name">{{ item.coalName || '' }}</view>
                           <!-- <view class="order-type">{{ item.orderType }}</view> -->
                        </view>
                     </view>
@@ -226,7 +292,8 @@
      // 抢单按钮
      qiangDanBtn(value) {
         if (value.tmcCount == '0') {
            this.qiangDan(value.orderPlanId, value.fleetId, value.customerId === null ? '0' : value.customerId, value.xsUserId === null ? '0' : value.xsUserId);
               this.qiangDan(value.orderPlanId, value.fleetId, value.customerId === null ? '0' : value.customerId,
                  value.xsUserId === null ? '0' : value.xsUserId);
         } else {
            this.qiangDanOrderPlanId = value.orderPlanId;
            this.fleetId = value.fleetId;
@@ -247,7 +314,12 @@
      },
      // 抢单请求
      qiangDan(id, fleetId, customerId, xsUserId) {
         this.$reqPost('qiangDan', { orderPlanId: id, fleetId: fleetId, customerId: customerId, xsUserId: xsUserId }, 'params')
            this.$reqPost('qiangDan', {
                  orderPlanId: id,
                  fleetId: fleetId,
                  customerId: customerId,
                  xsUserId: xsUserId
               }, 'params')
            .then(res => {
               if (res.code == 0) {
                  this.$u.toast('抢单成功');
@@ -282,7 +354,8 @@
};
</script>

<style lang="scss" scoped>
<style lang="scss"
   scoped>
@mixin formItem {
   width: vww(345);
   height: vww(150);
@@ -295,6 +368,7 @@
   flex-direction: column;
   justify-content: space-around;
}

@mixin firstLine {
   width: 94%;
   height: vww(68);
@@ -302,6 +376,7 @@
   display: flex;
   justify-content: space-between;
}

@mixin thirdLine {
   width: 30%;
   height: vww(68);
@@ -309,6 +384,7 @@
   display: flex;
   justify-content: space-between;
   align-items: center;

   .send-date {
      width: 148rpx;
      height: 24rpx;
@@ -317,20 +393,24 @@
      font-weight: 300;
      color: #515151;
   }

   .havedclock {
      width: 58% !important;
      margin-right: 0 !important;

      .send-date {
         width: 100%;
         margin-left: vww(12);
      }
   }
}

@mixin flex {
   display: flex;
   justify-content: space-between;
   align-items: center;
}

@mixin fourthLine {
   width: 34%;
   height: vww(68);
@@ -339,6 +419,7 @@
   position: relative;
   left: vww(203);
   bottom: vww(3);

   .button-img {
      width: 100%;
      height: 100%;
@@ -351,27 +432,33 @@
      line-height: vww(40);
   }
}

.exceedHide {
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
}

::v-deep.driver-index {
   width: 100%;
   margin: 0 auto;

   // 主体
   .driver-index-body {

      // margin-bottom: vww(56);
      // 待领取提煤单
      .wait-collection {
         width: 100%;
         height: 600rpx;
      }

      .collection-form {
         width: vww(345);
         margin: 0 vww(15);
         position: relative;
         top: vww(-120);

         .collection-form-item {
            width: vww(345);
            height: vww(185);
@@ -383,6 +470,7 @@
            display: flex;
            flex-direction: column;
            justify-content: space-around;

            .main-divider {
               width: 560rpx;
               height: 2rpx;
@@ -391,18 +479,21 @@
               top: 122rpx;
               left: 128rpx;
            }

            .first-line {
               width: 94%;
               height: vww(68);
               margin: vww(18) vww(16) 0 vww(16);
               display: flex;
               justify-content: space-between;

               .main-information {
                  width: 88%;
                  height: vww(28);
                  display: flex;
                  justify-content: flex-start;
                  align-items: center;

                  .sign {
                     width: vww(28);
                     height: vww(28);
@@ -416,15 +507,18 @@
                     margin-right: vww(20);
                  }
               }

               .point-number {
                  position: absolute;
                  right: 0;
                  width: 15%;

                  text {
                     font-size: 24rpx;
                     font-weight: 400;
                     color: #c78a64;
                  }

                  .residue {
                     font-size: 40rpx;
                     font-weight: 400;
@@ -432,14 +526,17 @@
                  }
               }
            }

            .first-extra {
               @include firstLine;

               .main-information {
                  width: 100%;
                  height: vww(28);
                  display: flex;
                  justify-content: flex-start;
                  align-items: center;

                  .sign {
                     width: vww(28);
                     height: vww(28);
@@ -454,6 +551,7 @@
                  }
               }
            }

            .second-line {
               width: 100%;
               height: vww(68);
@@ -461,6 +559,7 @@
               display: flex;
               justify-content: flex-start;
               align-items: center;

               .coal-name {
                  min-width: vww(50);
                  height: 35rpx;
@@ -471,6 +570,7 @@
                  display: flex;
                  justify-content: flex-start;
               }

               .black-block {
                  min-width: vww(50);
                  height: 30rpx;
@@ -482,12 +582,14 @@
                  display: flex;
                  justify-content: center;
                  align-items: center;

                  .black-bar {
                     width: 2rpx;
                     height: 30rpx;
                     background: #515151;
                  }
               }

               .coal-type {
                  min-width: vww(50);
                  height: 30rpx;
@@ -497,6 +599,7 @@
                  text-align: center;
               }
            }

            .third-line {
               width: 100%;
               height: vww(68);
@@ -504,6 +607,7 @@
               display: flex;
               justify-content: flex-start;
               align-items: center;

               .send-date {
                  width: 148rpx;
                  height: 24rpx;
@@ -514,12 +618,14 @@
                  font-weight: 300;
                  color: #515151;
               }

               .type {
                  flex: 1;
                  margin-right: vww(10);
                  display: flex;
                  justify-content: center;
                  align-items: center;

                  .coal-name {
                     width: 120rpx;
                     height: 42rpx;
@@ -537,6 +643,7 @@
                  }
               }
            }

            .fourth-line {
               width: 30%;
               height: vww(68);
@@ -546,6 +653,7 @@
               position: relative;
               left: vww(203);
               bottom: vww(3);

               .button-img {
                  width: 100%;
                  height: 100%;
@@ -560,19 +668,23 @@
            }
         }
      }

      .wait-appointment,
      .Reserved {
         position: relative;
         top: vww(-120);
      }

      .appointment-form {
         width: vww(345);
         margin: 0 vww(15);

         .appointment-form-item {
            @include formItem;
            height: vww(191);
            justify-content: space-between;
            overflow: hidden;

            .main-divider {
               width: 560rpx;
               height: 1rpx;
@@ -581,15 +693,18 @@
               top: 122rpx;
               left: 128rpx;
            }

            .first-line {
               position: relative;
               @include firstLine;

               .main-information {
                  width: 100%;
                  height: vww(28);
                  display: flex;
                  justify-content: flex-start;
                  align-items: center;

                  .sign {
                     width: vww(28);
                     height: vww(28);
@@ -604,14 +719,17 @@
                  }
               }
            }

            .first-extra {
               @include firstLine;

               .main-information {
                  width: 100%;
                  height: vww(28);
                  display: flex;
                  justify-content: flex-start;
                  align-items: center;

                  .sign {
                     width: vww(28);
                     height: vww(28);
@@ -626,16 +744,19 @@
                  }
               }
            }

            .second-line {
               @include firstLine;
               margin: 0;
               margin-left: vww(16);

               .main-information {
                  width: 100%;
                  height: vww(28);
                  display: flex;
                  justify-content: flex-start;
                  align-items: center;

                  .sign {
                     width: vww(28);
                     height: vww(28);
@@ -650,11 +771,13 @@
                  }
               }
            }

            .third-line {
               @include thirdLine;
               width: 94%;
               justify-content: flex-start;
               margin-left: vww(18);

               .clock {
                  width: 40%;
                  height: vww(21);
@@ -662,16 +785,19 @@
                  line-height: vww(21);
                  @include flex;
                  justify-content: flex-start;

                  .send-date {
                     margin-left: vww(14);
                  }
               }

               .type {
                  flex: 1;
                  margin-right: vww(10);
                  display: flex;
                  justify-content: center;
                  align-items: center;

                  .order-type,
                  .coal-name {
                     width: 120rpx;
@@ -690,11 +816,13 @@
                  }
               }
            }

            .fourth-line {
               @include fourthLine;
            }
         }
      }

      .Reserved {
         .white-block {
            width: 100%;