jiangping
2024-08-27 3a992a2be8c1cc815719ac76cd7242dd7a2f7c2d
h5/pages/driver/index.vue
@@ -1,21 +1,19 @@
<template>
  <view class="main_app">
    <view class="title_wrap">
      <view class="name">某某某,欢迎登录~</view>
         <view class="name">{{ driverInfo.realname }},欢迎登录~</view>
      <view class="btn" @click="loginOut">退出登录</view>
    </view>
    <!--  -->
    <view class="banner_wrap">
      <view class="h1">安泰物流智慧园区</view>
      <view class="h2">物流车专区</view>
      <image
        class="banner"
        src="../../static/driver/wuliuche_banner@2x.png"
        mode="widthFix"
      ></image>
         <image class="banner" src="../../static/driver/wuliuche_banner@2x.png" mode="widthFix"></image>
    </view>
    <!--  -->
    <view class="task_list">
         <swiper circular class="task_swiper">
            <swiper-item>
      <view class="item">
        <view class="head">
          <view class="name">运输单222</view>
@@ -27,19 +25,11 @@
        <view class="content">
          <view class="info">
            <view class="plate">
              <image
                src="@/static/driver/wuliu_ic_car@2x.png"
                class="icon"
                mode=""
              ></image>
                           <image src="@/static/driver/wuliu_ic_car@2x.png" class="icon" mode=""></image>
              <text>皖AD</text>
            </view>
            <view class="plate">
              <image
                src="@/static/driver/wuliu_ic_huowu@2x.png"
                class="icon"
                mode=""
              ></image>
                           <image src="@/static/driver/wuliu_ic_huowu@2x.png" class="icon" mode=""></image>
              <text>3000万</text>
            </view>
          </view>
@@ -49,56 +39,61 @@
          </view>
        </view>
      </view>
            </swiper-item>
            <swiper-item>
               <view class="item">
                  <view class="head">
                     <view class="name">运输单222</view>
                     <view class="status"><view class="text">请与现场签到</view></view>
                  </view>
                  <view class="content">
                     <view class="info">
                        <view class="plate">
                           <image src="@/static/driver/wuliu_ic_car@2x.png" class="icon" mode=""></image>
                           <text>皖AD</text>
                        </view>
                        <view class="plate">
                           <image src="@/static/driver/wuliu_ic_huowu@2x.png" class="icon" mode=""></image>
                           <text>3000万</text>
                        </view>
                     </view>
                     <view class="sub">
                        <view class="time">02-01 08:11:11</view>
                        <view class="sub_btn" @click="handleTask(1)">立即签到</view>
                     </view>
                  </view>
               </view>
            </swiper-item>
         </swiper>
    </view>
    <!--  -->
    <view class="title_wrap"><view class="name">业务办理</view></view>
    <view class="container1">
      <view class="left">
        <view class="img_wrap img1" @click="$jump('/pages/driver/reserved')">
          <image
            src="@/static/driver/wuliu_ic_ruyuanyuyue@2x.png"
            class="img"
          ></image>
               <image src="@/static/driver/wuliu_ic_ruyuanyuyue@2x.png" class="img"></image>
          <view class="h1">入园须知</view>
          <view class="h2">RESERVATION</view>
        </view>
        <view
          class="img_wrap img2"
          @click="$jump('/pages/driver/reservedGuide')"
        >
          <image
            src="@/static/driver/wuliu_ic_zhinan@2x.png"
            class="img"
          ></image>
            <view class="img_wrap img2" @click="$jump('/pages/driver/reservedGuide?str=bookingTips')">
               <image src="@/static/driver/wuliu_ic_zhinan@2x.png" class="img"></image>
          <view class="h1">预约指南</view>
          <view class="h2">APPOINTMENT GUIDE</view>
        </view>
      </view>
      <view class="right">
        <view
          class="img_wrap img2"
          @click="$jump('/pages/driver/reservedRecord')"
        >
          <image
            src="@/static/driver/wuliu_ic_yuyuejilu@2x.png"
            class="img"
          ></image>
            <view class="img_wrap img2" @click="$jump('/pages/driver/reservedRecord')">
               <image src="@/static/driver/wuliu_ic_yuyuejilu@2x.png" class="img"></image>
          <view class="h1">预约记录</view>
          <view class="h2">APPOINTMENT RECORD</view>
        </view>
        <view class="img_wrap img2" @click="$jump('/pages/driver/queueUp')">
          <image
            src="@/static/driver/wuliu_ic_paidui@2x.png"
            class="img"
          ></image>
               <image src="@/static/driver/wuliu_ic_paidui@2x.png" class="img"></image>
          <view class="h1">月台排队情况</view>
          <view class="h2">HIDDEN DANGER</view>
        </view>
        <view class="img_wrap img2">
          <image
            src="@/static/driver/wuliu_ic_daolan@2x.png"
            class="img"
          ></image>
            <view class="img_wrap img2" @click="$jump('/pages/driver/reservedGuide?str=reservationMap')">
               <image src="@/static/driver/wuliu_ic_daolan@2x.png" class="img"></image>
          <view class="h1">园区导览图</view>
          <view class="h2">GUIDE MAP</view>
        </view>
@@ -113,20 +108,46 @@
</template>
<script>
import { logoutPost, driverHomeData } from '@/api';
export default {
  data() {
    return {
    }
         driverInfo: uni.getStorageSync('driverInfo')
      };
   },
   created() {
      this.initData();
  },
  methods: {
    handleTask() {
      initData() {
         driverHomeData().then(res => {
            if (res.code == 200) {
               uni.setStorageSync('driverGuide', {
                  bookingTips: res.data.bookingTips,
                  reservationMap: res.data.reservationMap
               });
            }
         });
      },
      loginOut() {
         this.$store.commit('empty');
         logoutPost();
         uni.redirectTo({
            url: '/pages/driver/login'
         });
      },
      handleTask(status) {
         if (status == 1) {
            return uni.navigateTo({
               url: '/pages/driver/taskDetail'
            });
         }
      uni.navigateTo({
        url: '/pages/driver/taskConfirm'
      })
         });
    }
  }
}
};
</script>
<style lang="scss">
@@ -236,16 +257,27 @@
}
.task_list {
  margin-bottom: 48rpx;
   .task_swiper {
      padding: 16rpx 10rpx;
      height: 320rpx;
      width: 730rpx;
      margin-left: -20rpx;
      box-sizing: border-box;
   }
  .item {
    background: #ffffff;
    box-shadow: 0rpx 4rpx 32rpx 0rpx rgba(39, 155, 170, 0.18);
      box-shadow: 0rpx 0rpx 12rpx 0rpx rgba(39, 155, 170, 0.32);
    border-radius: 16rpx;
      height: 280rpx;
      width: 98%;
      margin-left: 1%;
    .head {
      display: flex;
      justify-content: space-between;
      align-items: center;
      background: linear-gradient(270deg, #fefeff 0%, #e1f7fe 100%);
      padding: 20rpx 30rpx;
         padding: 0rpx 30rpx;
         height: 92rpx;
      .name {
        font-weight: 600;
        font-size: 36rpx;
@@ -254,6 +286,7 @@
      .status {
        color: $uni-color-primary;
        font-weight: 600;
            text-align: right;
        .time {
          font-size: 24rpx;
          font-weight: 360;
@@ -261,6 +294,7 @@
      }
    }
    .content {
         height: 180rpx;
      .info {
        display: flex;
        padding: 24rpx 30rpx;