Browse Source

feat 代码优化

Funny 3 năm trước cách đây
mục cha
commit
4cc18f6fb5

BIN
dist.zip


+ 49 - 42
src/components/Home.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="mainContent">
     <el-row class="order_tab">
-      <el-col :span="12">
+      <el-col class="tab-list-wrap" :span="12">
         <div class="tabList">
           <div class="tab_item" @click="changeTab(i, item.status)" :class="{ tab_item_ac: tabNum == i ? true : false }" v-for="(item, i) in tabList" :key="i">
             <div class="point" v-show="item.num">{{ item.num }}</div>
@@ -388,62 +388,69 @@ export default {
   width: 100%;
   height: 100%;
   .order_tab {
+    display: flex;
     width: 100%;
+    min-width: 550px;
+    overflow-x: auto;
     height: 74px;
     background: #fff;
+    .tab-list-wrap {
+      min-width: 550px;
+      .tabList {
+        display: flex;
+        justify-content: space-around;
+        width: 100%;
+        padding-top: 26px;
+        // padding-left: 36px;
+        // box-sizing: border-box;
 
-    .tabList {
-      display: flex;
-      justify-content: space-around;
-      width: 100%;
-      padding-top: 26px;
-      padding-left: 36px;
-      box-sizing: border-box;
-      overflow-x: auto;
-
-      .tab_item {
-        font-size: 16px;
-        font-weight: 500;
-        color: #b1b1b1;
-        position: relative;
-        text-align: center;
-        cursor: pointer;
+        .tab_item {
+          flex-shrink: 0;
+          font-size: 16px;
+          font-weight: 500;
+          color: #b1b1b1;
+          position: relative;
+          text-align: center;
+          cursor: pointer;
 
-        .tab_line {
-          width: 58px;
-          height: 6px;
-          background: #fff;
-          border-radius: 3px;
-          margin-top: 15px;
-        }
+          .tab_line {
+            width: 58px;
+            height: 6px;
+            background: #fff;
+            border-radius: 3px;
+            margin-top: 15px;
+          }
 
-        .point {
-          width: 16px;
-          height: 16px;
-          border-radius: 50%;
-          background: #f74141;
-          font-size: 12px;
-          font-weight: 400;
-          color: #ffffff;
-          position: absolute;
-          top: -5px;
-          right: -10px;
-          text-align: center;
-          line-height: 16px;
+          .point {
+            width: 16px;
+            height: 16px;
+            border-radius: 50%;
+            background: #f74141;
+            font-size: 12px;
+            font-weight: 400;
+            color: #ffffff;
+            position: absolute;
+            top: -5px;
+            right: -10px;
+            text-align: center;
+            line-height: 16px;
+          }
         }
-      }
 
-      .tab_item_ac {
-        color: #fc7200;
+        .tab_item_ac {
+          color: #fc7200;
 
-        .tab_line {
-          background: #fc7200;
+          .tab_line {
+            background: #fc7200;
+          }
         }
       }
     }
+
     .search {
       display: flex;
       justify-content: flex-end;
+      min-width: 700px;
       .header_serch {
         height: 74px;
         padding-right: 25px;

+ 2 - 2
src/components/orderComponents/orderList.vue

@@ -125,14 +125,14 @@
               <!-- 取货中 -->
               <div class="order_item_header_r" v-if="item.buttonStatus === 2">
                 <el-tag v-if="[-1,7].includes(tabNum)" class="header_r">取货中</el-tag>
-                <span v-show="Number(item.riderArriveMinute)" class="header_r">预计{{Number(item.riderArriveMinute)}}分钟取件</span>
+                <!-- <span v-show="Number(item.riderArriveMinute)" class="header_r">预计{{Number(item.riderArriveMinute)}}分钟取件</span> -->
                 <!-- <el-button size='small' @click.stop="cancelOrder(item.id)">取消订单</el-button> -->
                 <el-button size="small" class="btn" @click.stop="orderPrinter(item.waimaiOrderId)" v-if="item.waimaiOrderId">补打发票</el-button>
               </div>
               <!-- 配送中 -->
               <div class="order_item_header_r" v-if="item.buttonStatus === 3">
                 <el-tag v-if="[-1,7].includes(tabNum)" class="header_r">配送中</el-tag>
-                <span class="header_r" v-if="item.exceptTime">预计{{ item.exceptTime }}送达,{{item.surPlusMinute >= 0 ? '剩余'+item.surPlusMinute + '分钟' : '超时' +item.surPlusMinute +"分钟" }}</span>
+                <!-- <span class="header_r" v-if="item.exceptTime">预计{{ item.exceptTime }}送达,{{item.surPlusMinute >= 0 ? '剩余'+item.surPlusMinute + '分钟' : '超时' +item.surPlusMinute +"分钟" }}</span> -->
                 <el-button size="small" class="btn" @click.stop="orderPrinter(item.waimaiOrderId)" v-if="item.waimaiOrderId">补打发票</el-button>
               </div>
               <!-- 异常单 -->

+ 4 - 1
src/components/orderSearch.vue

@@ -79,7 +79,7 @@ export default {
         orderType: 0,
         searchType: 1,
         searchKey: "",
-        searchKeyType: '1',
+        searchKeyType: "1",
         shopId: "",
         startDate: "",
         endDate: "",
@@ -313,11 +313,14 @@ export default {
 }
 .mainContent {
   width: 100%;
+  height: 100%;
   .order_tab {
     display: flex;
     flex-direction: column;
     justify-content: space-around;
     width: 100%;
+    min-width: 550px;
+    overflow: auto;
     background: #fff;
     height: 74px;
     .search {