qukaidi 4 years ago
parent
commit
c82ca9d56b
1 changed files with 70 additions and 35 deletions
  1. 70 35
      src/views/index.vue

+ 70 - 35
src/views/index.vue

@@ -6,7 +6,9 @@
           <div slot="content">
             <div class="content-top">
               <div class="content-top-left">
-                <div style="display: flex; align-self: center;margin-left: 5px">
+                <div
+                  style="display: flex; align-self: center; margin-left: 5px"
+                >
                   <div style="align-self: center">
                     <svg
                       t="1616396514864"
@@ -36,7 +38,12 @@
                   </div>
                 </div>
                 <div
-                  style="font-size: 36px; align-self: center; font-weight: 600;color:#014da1"
+                  style="
+                    font-size: 36px;
+                    align-self: center;
+                    font-weight: 600;
+                    color: #014da1;
+                  "
                 >
                   {{ upperLeftCntrs.planQuantity }}
                 </div>
@@ -47,7 +54,7 @@
                     display: flex;
                     align-self: center;
                     min-width: 120px;
-                    margin-left: 5px
+                    margin-left: 5px;
                   "
                 >
                   <div style="align-self: center">
@@ -78,14 +85,19 @@
                   </div>
                 </div>
                 <div
-                  style="font-size: 36px; align-self: center; font-weight: 600;color:#014da1"
+                  style="
+                    font-size: 36px;
+                    align-self: center;
+                    font-weight: 600;
+                    color: #014da1;
+                  "
                 >
                   {{ upperLeftCntrs.surplusQuantity }}
                 </div>
               </div>
             </div>
             <div class="content-bottom">
-              <div style="display: flex; align-self: center;margin-left: 5px">
+              <div style="display: flex; align-self: center; margin-left: 5px">
                 <div style="align-self: center">
                   <svg
                     t="1616402886142"
@@ -119,7 +131,12 @@
                 </div>
               </div>
               <div
-                style="font-size: 36px; align-self: center; font-weight: 600;color:#014da1"
+                style="
+                  font-size: 36px;
+                  align-self: center;
+                  font-weight: 600;
+                  color: #014da1;
+                "
               >
                 {{ fleetData.upperLeftCarQuantity }}
               </div>
@@ -127,7 +144,12 @@
             </div>
             <div class="content-bottom">
               <div
-                style="display: flex; align-self:center; min-width: 120px;margin-left: 5px"
+                style="
+                  display: flex;
+                  align-self: center;
+                  min-width: 120px;
+                  margin-left: 5px;
+                "
               >
                 <div style="align-self: center">
                   <svg
@@ -158,7 +180,12 @@
                 </div>
               </div>
               <div
-                style="font-size: 36px; align-self: center; font-weight: 600;color:#014da1"
+                style="
+                  font-size: 36px;
+                  align-self: center;
+                  font-weight: 600;
+                  color: #014da1;
+                "
               >
                 {{ fleetData.upperLeftOldCarQuantity }}
               </div>
@@ -180,29 +207,31 @@
       </div>
       <div class="home-right">
         <chi-card title="运行车辆" iconName="el-icon-s-order" :More="true">
-          <div slot="content" class="upper-right">
-            <div
-              style="display: flex; padding: 4px 15px; font-size: 14px"
-              v-for="(item, index) in fleetData.upperRight.slice(0 , 10)"
-              :key="index"
-              :style="{
-                backgroundColor: index % 2 == 0 ? '#fafbfd' : '#FFFFFF',
-              }"
-            >
-              <div style="width: 30%">{{ item.mblno }}</div>
-              <div style="width: 20%">{{ item.carregNo }}</div>
-              <div style="width: 15%; color: #67c23a">
-                {{ item.orderStatus | statusType }}
-              </div>
+          <div slot="content" >
+            <div class="upper-right" v-if="fleetData.upperRight.length > 0">
               <div
-                style="
-                  width: 35%;
-                  overflow: hidden;
-                  text-overflow: ellipsis;
-                  white-space: nowrap;
-                "
+                style="display: flex; padding: 4px 15px; font-size: 14px"
+                v-for="(item, index) in fleetData.upperRight.slice(0, 10)"
+                :key="index"
+                :style="{
+                  backgroundColor: index % 2 == 0 ? '#fafbfd' : '#FFFFFF',
+                }"
               >
-                {{ item.corpName }}
+                <div style="width: 30%">{{ item.mblno }}</div>
+                <div style="width: 20%">{{ item.carregNo }}</div>
+                <div style="width: 15%; color: #67c23a">
+                  {{ item.orderStatus | statusType }}
+                </div>
+                <div
+                  style="
+                    width: 35%;
+                    overflow: hidden;
+                    text-overflow: ellipsis;
+                    white-space: nowrap;
+                  "
+                >
+                  {{ item.corpName }}
+                </div>
               </div>
             </div>
           </div>
@@ -220,14 +249,18 @@
               <div style="width: 30%" class="single_line">FK221516485645</div>
               <div style="width: 20%" class="single_line">运费运费运费</div>
               <div style="width: 15%" class="single_line">李刚</div>
-              <div style="width: 15%; color: #67c23a" class="single_line">待审批</div>
+              <div style="width: 15%; color: #67c23a" class="single_line">
+                待审批
+              </div>
               <div style="width: 20%" class="single_line">2020/10/10</div>
             </div>
-            <div style="font-size: 14px; display: flex; margin: 4px 15px;">
+            <div style="font-size: 14px; display: flex; margin: 4px 15px">
               <div style="width: 30%" class="single_line">FK221516485645</div>
               <div style="width: 20%" class="single_line">运费运费运费</div>
               <div style="width: 15%" class="single_line">李刚</div>
-              <div style="width: 15%; color: #67c23a" class="single_line">待审批</div>
+              <div style="width: 15%; color: #67c23a" class="single_line">
+                待审批
+              </div>
               <div style="width: 20%" class="single_line">2020/10/10</div>
             </div>
           </div>
@@ -248,11 +281,13 @@
               <div style="width: 15%; color: #67c23a">待审批</div>
               <div style="width: 20%" class="single_line">2020/10/10</div>
             </div>
-            <div style="font-size: 14px; display: flex; margin: 4px 15px;">
+            <div style="font-size: 14px; display: flex; margin: 4px 15px">
               <div style="width: 30%" class="single_line">FK221516485645</div>
               <div style="width: 20%" class="single_line">运费运费运费</div>
               <div style="width: 15%" class="single_line">李刚</div>
-              <div style="width: 15%; color: #67c23a" class="single_line">待审批</div>
+              <div style="width: 15%; color: #67c23a" class="single_line">
+                待审批
+              </div>
               <div style="width: 20%" class="single_line">2020/10/10</div>
             </div>
           </div>
@@ -1143,7 +1178,7 @@ export default {
     padding: 10px 0;
     height: 260px;
   }
-   .upper-right2 {
+  .upper-right2 {
     padding: 10px 0;
     height: 130px;
   }