qingyiay
2023-09-12 5386f47f55ecb9ad2189998f9dda6d682b6be7e0
pages/driver-page/driver-index/driver-index.vue
@@ -2,9 +2,28 @@
   <view class="">
      <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">
               :style="{ backgroundImage: `url(${onlineurl}/appimg/image/banner/diverbanner.png)`, backgroundSize: 'contain', backgroundRepeat: 'no-repeat' }">
            </view>
            <!-- 引导页 -->
            <view class="noob-tour"
               v-if="roleType===3&&isFirstLogin">
               <combined-title title="操作指引"></combined-title>
               <u-cell-group>
                  <u-cell title="新手指引"
                     name='1'
                     :clickable="true"
                     @click="noobTour">
                     <u-badge type="primary"
                        value="01"
                        slot='icon'></u-badge>
                     <u-icon slot="value"
                        name="arrow-right"
                        size="30"
                        color="#b8b8b8"></u-icon>
                  </u-cell>
               </u-cell-group>
            </view>
            <view class="collection-form">
               <view class="collection-form-item"
@@ -45,9 +64,6 @@
                        </view>
                     </view>
                  </view>
                  <!-- <view class="second-line">
                     <view class="coal-name">{{ item.coalName }}</view>
                  </view> -->
                  <view class="third-line">
                     <view class="time-icon"><u-icon name="clock"
                           color="#515151"
@@ -58,7 +74,7 @@
                     </view>
                  </view>
                  <view class="fourth-line"
                     @click="qiangDanBtn(item)"
                     @click.stop="qiangDanBtn(item)"
                     v-if="item.carNum - item.taskNum !== 0">
                     <view class="button-img">立即抢单</view>
                  </view>
@@ -74,13 +90,14 @@
                  @cancel="qiangDanCancel"></u-modal>
            </view>
            <!-- 待预约提煤单 -->
            <!-- 待预约通知单 -->
            <view class="wait-appointment">
               <combined-title title="待预约提煤单"></combined-title>
               <combined-title title="待预约通知单"></combined-title>
               <u-empty mode="data"
                  icon="http://cdn.uviewui.com/uview/empty/data.png"
                  textSize="30"
                  iconSize="1000"
                  text="暂无数据"
                  v-if="driverBillOfLoadingData.list3 ? (driverBillOfLoadingData.list3.length == 0 ? true : false) : true"></u-empty>
               <view class="appointment-form">
@@ -127,6 +144,11 @@
                                 size="40"></u-icon></view>
                        </view>
                     </view>
                     <!-- <view class="status">
                        <u-tag :text="coalStatus[item.statusWeigh] || ''"
                           plain>
                        </u-tag>
                     </view> -->
                     <view class="third-line">
                        <view class="clock">
                           <view class="time-icon"><u-icon name="clock"
@@ -147,13 +169,14 @@
               </view>
            </view>
            <!-- 已预约提煤单 -->
            <!-- 已预约通知单 -->
            <view class="Reserved">
               <combined-title title="已预约提煤单"></combined-title>
               <combined-title title="已预约通知单"></combined-title>
               <u-empty mode="data"
                  icon="http://cdn.uviewui.com/uview/empty/data.png"
                  textSize="30"
                  iconSize="1000"
                  text="暂无数据"
                  v-if="driverBillOfLoadingData.list2 ? (driverBillOfLoadingData.list2.length == 0 ? true : false) : true"></u-empty>
               <view class="appointment-form">
                  <view class="appointment-form-item"
@@ -203,6 +226,11 @@
                                 size="40"></u-icon></view>
                        </view>
                     </view>
                     <view class="status">
                        <u-tag :text="coalStatus[item.statusWeigh] || ''"
                           plain>
                        </u-tag>
                     </view>
                     <view class="third-line">
                        <view class="clock havedclock">
                           <view class="time-icon"><u-icon name="clock"
@@ -219,6 +247,12 @@
               </view>
               <view class="white-block"></view>
            </view>
            <!-- 图片预览弹出框 -->
            <view class="previewImage-container">
               <previewImage ref="previewImage"
                  :imgs="driverTourImgList"
                  :saveBtn='false'></previewImage>
            </view>
         </view>
      </view>
   </view>
@@ -227,10 +261,14 @@
<script>
   import { customerId } from '@/utils/status';
   import combinedTitle from '@/components/combined-title/combined-title.vue';
   import { onlineurl } from '@/api/request.js'
   import { BaseUrl } from '@/api/publicInterface.js'
   import previewImage from '@/components/kxj-previewImage/kxj-previewImage.vue';
   import { mapState } from 'vuex'
   export default {
      components: {
         combinedTitle
         combinedTitle,
         previewImage
      },
      props: {
         indexdriverBillOfLoadingData: {
@@ -245,7 +283,13 @@
            },
            deep: true,
            immediate: true
         }
         },
      },
      computed: {
         ...mapState(['driverTourImgList']),
         roleType() {
            return uni.getStorageSync('roleType');
         },
      },
      data() {
         return {
@@ -261,8 +305,15 @@
            qiangDanOrderPlanId: null,
            fleetId: '',
            xsUserId: '',
            customerId: ''
            customerId: '',
            coalStatus: ['未称重', '称重中', '验质中', '称重完成', '验质完成'],
            onlineurl,
            phone: "",
            isFirstLogin: true //是否是第一次登录
         };
      },
      onLoad() {
         this.TourImgList = TourImgList
      },
      onShow() {
         this.init();
@@ -278,6 +329,7 @@
         },
         init() {
            this.qiangDanList();
            this.getLogOn()
         },
         // 司机首页列表
         qiangDanList() {
@@ -338,7 +390,7 @@
               url: `/pages/driver-page/driver-index/bill-of-lading-details/bill-of-lading-details?orderPlanId=${value.id}&yyId=${value.yyId}`
            });
         },
         // 提煤单详情
         // 通知单详情
         cardBodyClick(name) {
            uni.navigateTo({
               url: `/pages/driver-page/driver-index/bill-of-lading-details/bill-of-lading-details?orderPlanId=${name}`
@@ -349,7 +401,29 @@
            uni.navigateTo({
               url: `/pages/driver-page/appointment/appointment?takeCoalId=${value.id}&filedId=${value.filedId}&deptId=${value.deptId}&sendDate=${value.sendDate}`
            });
         }
         },
         noobTour() {
            this.$refs.previewImage.open('https://mx.jzeg.cn:9095/appimg/image/tour/driver/sj1.jpg')
         },
         getLogOn() {
            this.$reqGet('getUserEntity').then(res => {
               this.phone = res.data.phone
            }).then(() => {
               uni.request({
                  url: `${BaseUrl}/admin/log/getLogOnType?phone=${this.phone}`,
                  success: res => {
                     // res.data.data 为1 代表第一次登录  为0取消学习指引 为2 代表存在
                     if (res.data.data === 1) {
                        this.noobTour()
                     } else if (res.data.data === 2) {
                        this.isFirstLogin = true
                     } else {
                        this.isFirstLogin = false
                     }
                  }
               });
            })
         },
      }
   };
</script>
@@ -433,6 +507,16 @@
      }
   }
   .fade-enter-active,
   .fade-leave-active {
      transition: opacity 0.5s;
   }
   .fade-enter,
   .fade-leave-to {
      opacity: 0;
   }
   .exceedHide {
      white-space: nowrap;
      overflow: hidden;
@@ -447,7 +531,7 @@
      .driver-index-body {
         // margin-bottom: vww(56);
         // 待领取提煤单
         // 待领取通知单
         .wait-collection {
            width: 100%;
            height: 600rpx;
@@ -461,7 +545,7 @@
            .collection-form-item {
               width: vww(345);
               height: vww(185);
               height: vww(195);
               margin-top: vww(5);
               background: #ffffff;
               box-shadow: 4rpx 6rpx 25rpx 0rpx rgba(73, 120, 240, 0.15);
@@ -561,8 +645,9 @@
                  align-items: center;
                  .coal-name {
                     @include flex;
                     min-width: vww(50);
                     height: 35rpx;
                     height: 100%;
                     font-size: 30rpx;
                     font-weight: 300;
                     color: #515151;
@@ -681,7 +766,7 @@
            .appointment-form-item {
               @include formItem;
               height: vww(191);
               height: vww(220);
               justify-content: space-between;
               overflow: hidden;
@@ -772,6 +857,10 @@
                  }
               }
               .status {
                  @include thirdLine;
               }
               .third-line {
                  @include thirdLine;
                  width: 94%;
@@ -833,6 +922,29 @@
               margin-top: vww(10);
            }
         }
         .noob-tour {
            margin-bottom: vww(10);
            position: relative;
            top: -240rpx;
         }
         .u-popup {
            .u-transition {
               .u-popup__content {
                  .editDriverPopup-container-box {}
                  //closeIcon
                  .u-popup__content__close--top-right {
                     .u-icon {
                        .u-icon__icon {
                           font-size: vww(20) !important;
                        }
                     }
                  }
               }
            }
         }
      }
   }
</style>