样式修改,引入字体，修改逻辑

qingyiay

2023-05-10 29658de29b2eb5292bf0c2fad7427b374b769ebc

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

@@ -18,14 +18,14 @@
                  <view class="first-line">
                     <view class="dispatch-receive">
                        <view v-if="item.orderType == '外销' || item.orderType == '内销' || item.orderType == '转出'" class="container">
                           <view class="dispatch">{{ item.deptName }}</view>
                           <view class="dispatch">{{ item.deptName || '' }}</view>
                           <view class="receive-icon"></view>
                           <view class="receive">{{ item.customerNameCopy }}</view>
                           <view class="receive">{{ item.customerNameCopy || '' }}}</view>
                        </view>
                        <view v-else-if="item.orderType == '外购' || item.orderType == '内购' || item.orderType == '转入'" class="container">
                           <view class="dispatch">{{ item.customerNameCopy }}</view>
                           <view class="dispatch">{{ item.customerNameCopy || '' }}</view>
                           <view class="receive-icon"></view>
                           <view class="receive">{{ item.deptName }}</view>
                           <view class="receive">{{ item.deptName || '' }}}</view>
                        </view>
                     </view>
                     <view class="point-number">
@@ -35,8 +35,8 @@
                  </view>
                  <view class="second-line">
                     <view class="coal-name">{{ item.coalName }}</view>
                     <view class="black-block"></view>
                     <view class="coal-type">{{ item.orderType }}</view>
                     <!-- <view class="black-block"><view class="black-bar"></view></view>
                     <view class="coal-type">{{ item.orderType }}</view> -->
                  </view>
                  <view class="third-line">
                     <view class="time-icon"><u-icon name="clock" color="#515151" size="40"></u-icon></view>
@@ -68,7 +68,7 @@
                           <view class="sign">装</view>
                           <view class="filedname">
                              <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-else-if="item.orderType == '外购' || item.orderType == '内购' || item.orderType == '转入'">{{ item.customerName }}</text>
                           </view>
                        </view>
                        <view class="main-divider"></view>
@@ -80,7 +80,7 @@
                        <view class="main-information">
                           <view class="sign">卸</view>
                           <view class="filedname">
                              <text v-if="item.orderType == '外销' || item.orderType == '内销' || item.orderType == '转出'">{{ item.customerNameCopy }}</text>
                              <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>
                           </view>
                        </view>
@@ -95,7 +95,7 @@
                        </view>
                        <view class="type">
                           <view class="coal-name">{{ item.coalName }}</view>
                           <view class="order-type">{{ item.orderType }}</view>
                           <!-- <view class="order-type">{{ item.orderType }}</view> -->
                        </view>
                     </view>
                     <view class="fourth-line" @click="toAppointmentClick(item)"><view class="button-img">立即预约</view></view>
@@ -120,7 +120,7 @@
                           <view class="sign">装</view>
                           <view class="filedname">
                              <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-else-if="item.orderType == '外购' || item.orderType == '内购' || item.orderType == '转入'">{{ item.customerName }}</text>
                           </view>
                        </view>
                        <view class="main-divider"></view>
@@ -132,7 +132,7 @@
                        <view class="main-information">
                           <view class="sign">卸</view>
                           <view class="filedname">
                              <text v-if="item.orderType == '外销' || item.orderType == '内销' || item.orderType == '转出'">{{ item.customerNameCopy }}</text>
                              <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>
                           </view>
                        </view>
@@ -147,7 +147,7 @@
                        </view>
                        <view class="type">
                           <view class="coal-name">{{ item.coalName }}</view>
                           <view class="order-type">{{ item.orderType }}</view>
                           <!-- <view class="order-type">{{ item.orderType }}</view> -->
                        </view>
                     </view>
                  </view>
@@ -162,6 +162,7 @@
<script>
import { customerId } from '@/utils/status';
import combinedTitle from '@/components/combined-title/combined-title.vue';

export default {
   components: {
      combinedTitle
@@ -191,7 +192,11 @@
         qiangDanOrderPlanId: null,
         fleetId: '',
         xsUserId: '',
         customerId: ''
         customerId: '',
         // 集成高德地图
         amapPlugin: null,
         key: 'e3106700a6225e6a25727d3a41fa54c5',
         addressName: ''
      };
   },
   onShow() {
@@ -302,12 +307,12 @@
      height: 24rpx;
      line-height: 24rpx;
      font-size: 28rpx;
      font-family: Microsoft YaHei;
      font-weight: 300;
      color: #515151;
   }
   .havedclock {
      width: 58% !important;
      margin-right: 0 !important;
      .send-date {
         width: 100%;
         margin-left: vww(12);
@@ -330,10 +335,9 @@
   .button-img {
      width: 100%;
      height: 100%;
      background: url('../../../static/image/banner/button.png') no-repeat;
      background: url('https://mx.jzeg.cn:9095/appimg/image/banner/button.png') no-repeat;
      background-size: cover;
      font-size: 28rpx;
      font-family: Microsoft YaHei;
      font-weight: 300;
      color: #ffffff;
      text-align: center;
@@ -345,7 +349,7 @@
   margin: 0 auto;
   // 主体
   .driver-index-body {
      margin-bottom: vww(56);
      // margin-bottom: vww(56);
      // 待领取提煤单
      .wait-collection {
         width: 100%;
@@ -404,66 +408,75 @@
                  width: 15%;
                  text {
                     font-size: 24rpx;
                     font-family: Microsoft YaHei;

                     font-weight: 400;
                     color: #c78a64;
                  }
                  .residue {
                     font-size: 40rpx;
                     font-family: CTCuHeiSJ;
                     font-weight: 400;
                     color: #f81414;
                  }
               }
            }
            .second-line {
               width: 60%;
               width: 100%;
               height: vww(68);
               margin-left: vww(12);
               display: flex;
               justify-content: space-evenly;
               justify-content: flex-start;
               align-items: center;
               .coal-name {
                  width: 30%;
                  min-width: vww(50);
                  height: 30rpx;
                  font-size: 30rpx;
                  font-family: Microsoft YaHei;

                  font-weight: 300;
                  color: #515151;
                  position: relative;
                  display: flex;
                  justify-content: space-between;
                  padding: vww(2) vww(4);
                  text-align: center;
                  justify-content: center;
               }
               .black-block {
                  width: 2rpx;
                  height: 30rpx;
                  background: #515151;
               }
               .coal-type {
                  width: 24%;
                  min-width: vww(50);
                  height: 30rpx;
                  font-size: 30rpx;
                  font-family: Microsoft YaHei;

                  font-weight: 300;
                  color: #515151;
                  padding: vww(2) vww(4);
                  position: relative;
                  top: vww(2);
                  display: flex;
                  justify-content: center;
                  align-items: center;
                  .black-bar {
                     width: 2rpx;
                     height: 30rpx;
                     background: #515151;
                  }
               }
               .coal-type {
                  min-width: vww(50);
                  height: 30rpx;
                  font-size: 30rpx;
                  font-weight: 300;
                  color: #515151;
                  text-align: center;
               }
            }
            .third-line {
               width: 30%;
               width: 100%;
               height: vww(68);
               margin-left: vww(15);
               display: flex;
               justify-content: space-between;
               justify-content: flex-start;
               align-items: center;
               .send-date {
                  width: 148rpx;
                  height: 24rpx;
                  margin-left: vww(14);
                  line-height: 24rpx;
                  font-size: 28rpx;
                  font-family: Microsoft YaHei;
                  font-weight: 300;
                  color: #515151;
               }
@@ -480,10 +493,9 @@
               .button-img {
                  width: 100%;
                  height: 100%;
                  background: url('../../../static/image/banner/button.png') no-repeat;
                  background: url('https://mx.jzeg.cn:9095/appimg/image/banner/button.png') no-repeat;
                  background-size: cover;
                  font-size: 28rpx;
                  font-family: Microsoft YaHei;
                  font-weight: 300;
                  color: #ffffff;
                  text-align: center;
@@ -506,11 +518,12 @@
            justify-content: space-between;
            .first-line {
               position: relative;
               @include firstLine .main-information {
                  width: 40%;
               @include firstLine;
               .main-information {
                  width: 100%;
                  height: vww(28);
                  display: flex;
                  justify-content: space-between;
                  justify-content: flex-start;
                  align-items: center;

                  .sign {
@@ -518,12 +531,12 @@
                     height: vww(28);
                     line-height: vww(28);
                     text-align: center;
                     background: url('../../../static/image/banner/blueblock.png') no-repeat;
                     background: url('https://mx.jzeg.cn:9095/appimg/image/banner/blueblock.png') no-repeat;
                     background-size: contain;
                     font-size: 30rpx;
                     font-family: Microsoft YaHei;
                     font-weight: 400;
                     color: #ffffff;
                     margin-right: vww(20);
                  }
               }
               .main-divider {
@@ -539,51 +552,58 @@
               @include firstLine margin: 0;
               margin-left: vww(16);
               .main-information {
                  width: 40%;
                  width: 100%;
                  height: vww(28);
                  display: flex;
                  justify-content: space-between;
                  justify-content: flex-start;
                  align-items: center;
                  .sign {
                     width: vww(28);
                     height: vww(28);
                     line-height: vww(28);
                     text-align: center;
                     background: url('../../../static/image/banner/redblock.png') no-repeat;
                     background: url('https://mx.jzeg.cn:9095/appimg/image/banner/redblock.png') no-repeat;
                     background-size: contain;
                     font-size: 30rpx;
                     font-family: Microsoft YaHei;
                     font-weight: 400;
                     color: #ffffff;
                     margin-right: vww(20);
                  }
               }
            }
            .third-line {
               @include thirdLine width: 94%;
               @include thirdLine;
               width: 94%;
               justify-content: flex-start;
               .clock {
                  width: 33%;
                  height: vww(21);
                  margin-right: vww(70);
                  line-height: vww(21);
                  @include flex;
                  justify-content: flex-start;
                  .send-date {
                     margin-left: vww(14);
                  }
               }
               .type {
                  width: 40%;
                  margin-right: vww(6);
                  flex: 1;
                  margin-right: vww(10);
                  display: flex;
                  justify-content: space-between;
                  justify-content: center;
                  align-items: center;
                  .order-type,
                  .coal-name {
                     width: 120rpx;
                     // min-width: 120rpx;
                     height: 42rpx;
                     line-height: 42rpx;
                     border: 2px solid #035cfb;
                     border-radius: 4rpx;
                     font-size: 28rpx;
                     font-family: Microsoft YaHei;
                     font-weight: 300;
                     color: #035cfb;
                     text-align: center;
                     padding: vww(3) vww(11);
                  }
               }
            }