ll

liukangdong

2025-01-13 d38f3d8c0642d5d58a3baeff5d80abafaa702f9f

 h5/pages/waybill/waybillDetail.vue

@@ -4,7 +4,11 @@
      <map id="map" :latitude="latitude" :longitude="longitude" :polyline="polyline" :markers="markers" :scale="scale">



      </map>

      <view class="main_content">

      <view class="main_content">
         <view class="stock_status" v-if="info.overStock && info.overStock == 1">
            <image src="@/static/ic_tip@2x.png" mode=""></image>
            <view class="">因库存不足，订单暂时无法配载</view>
         </view>

         <view class="info">

            <view class="head">

               <view class="code">{{info.contractNumber}}</view>

@@ -41,7 +45,7 @@
         <view class="drive_info">

            <view class="title">物流信息</view>

            <view class="drive_list" v-for="dri,k in info.cicleStatusList">

               <view class="separate"></view>

               <view class="separate" v-if="k < info.cicleStatusList.length - 1"></view>

               <view class="item_title">

                  <view class="icon_wrap">

                     <image v-if="dri.key == 0 && k != 0" src="@/static/waybill/ic_dingdan@2x.png" class="icon"></image>

@@ -52,7 +56,8 @@
                     <image v-if="dri.key == 2 && k == 0" src="@/static/waybill/ic_cangku_sel@2x.png" class="icon"></image>

                     <image v-if="dri.key == 3 && k != 0" src="@/static/waybill/ic_yunshu@2x.png" class="icon"></image>

                     <image v-if="dri.key == 3 && k == 0" src="@/static/waybill/ic_yunshu_sel@2x.png" class="icon"></image>

                     <image v-if="dri.key == 4" src="@/static/waybill/ic_daohuo_sel@2x.png" class="icon"></image>

                     <image v-if="dri.key == 4 && k != 0" src="@/static/waybill/ic_dingdan@2x.png" class="icon"></image>
                     <image v-if="dri.key == 4 && k == 0" src="@/static/waybill/ic_daohuo_sel@2x.png" class="icon"></image>

                     <image v-if="dri.key == 5" src="@/static/waybill/ic_ruku.png" class="icon"></image>

                  </view>

                  <view class="" :class="{primaryColor: k == 0}">{{dri.name}}</view>

@@ -65,8 +70,11 @@
                     <view v-else class="icon_wrap"></view>

                     <view class="text" :class="{placeholder3: k==0 && i== 0}">

                        {{item.orderStatusDes}}

                        <text v-if="item.tel">，发货仓库电话：</text>

                        <text v-if="item.tel" @click="callPhone(item.tel)" class="primaryColor">{{item.tel}}</text>

                        <text v-if="item.tel">，发货仓库电话：</text>
                        <template v-if="item.tel">
                           <text v-for="phone,p in item.tel.split(',')" @click="callPhone(phone)" class="primaryColor">{{phone}}<text v-if="p < item.tel.split(',').length - 1">,</text></text>
                        </template>

								
                     </view>

                  </view>

                  <view class="time">{{item.recordDate}}</view>

@@ -251,19 +259,23 @@
         background: #fff;

         border-radius: 16rpx;

         padding: 30rpx;

         margin-bottom: 20rpx;

         position: relative;

         margin-bottom: 20rpx;
         position: relative;
         z-index: 999;



         .separate {

            height: calc(100% - 250rpx);

            width: 1rpx;

            border: 1rpx dashed #CCCCCC;

            position: absolute;

            left: 53rpx;

            top: 102rpx;

            z-index: -1;

         .drive_list{
            position: relative;
            z-index: 999;
            .separate {
               height: calc(100% - 48rpx);
               width: 1rpx;
               border: 1rpx dashed #CCCCCC;
               position: absolute;
               left: 24rpx;
               top: 48rpx;
               z-index: -1;
            }
         }

			


         .title {

            font-weight: 500;

@@ -292,15 +304,15 @@
         }



         .icon_wrap {

            width: 48rpx;

            width: 50rpx;

            margin-right: 30rpx;

            display: flex;

            align-items: center;

            // align-items: center;

            justify-content: center;



            flex-shrink: 0;

            .icon {

               width: 48rpx;

               height: 48rpx;

               width: 50rpx;

               height: 50rpx;

               position: relative;

               z-index: 2;

            }

@@ -310,22 +322,27 @@
            position: relative;

            color: #999999;

            margin-bottom: 30rpx;



            &:nth-last-child(1){
               margin-bottom: 0;
               padding-bottom: 30rpx;
            }

            .text {

               color: #666666;

               color: #666666;
               flex: 1;

            }



            .icon {

               width: 20rpx;

               height: 20rpx;

               position: relative;

               z-index: 2;

               z-index: 2;
               margin-top: 12rpx;

            }



            .h2 {

               display: flex;

               align-items: center;

               height: 48rpx;

               // align-items: center;

               // height: 48rpx;

            }



            .h1 {}

@@ -337,7 +354,24 @@
            }

         }

      }



      .stock_status{
         background: #FFEEEE;
         font-size: 26rpx;
         color: #ED4545;
         display: flex;
         align-items: center;
         border-radius: 8rpx 8rpx 0rpx 0rpx;
         height: 80rpx;
         position: relative;
         z-index: 1;
         padding: 0 30rpx 4rpx;
         top: 8rpx;
         image{
            width: 28rpx;
            height: 28rpx;
            margin-right: 10rpx;
         }
      }

      .info {

         border-radius: 12rpx;

         margin-bottom: 20rpx;

@@ -346,7 +380,6 @@
         overflow: hidden;

         position: relative;

         z-index: 1;



         .head {

            display: flex;

            justify-content: space-between;