车辆管理

src/pages/parkingFee/vehicleManagement.vue

@@ -6,7 +6,7 @@
       <!-- <LoginDom></LoginDom> -->
       <div class="wrap">
         <div class="wrap_plate">我的车牌</div>
-<!--        <div v-else class="wrap_plate">车牌号绑定</div>-->
+        <!--        <div v-else class="wrap_plate">车牌号绑定</div>-->
         <div
           class="plate_plate"
           :class=" 'linear-gradient-' + item.licensePlateType "
@@ -48,17 +48,17 @@
           " v-if="custTypeId > 0"></div> -->
             <div class="plate_plate_index plate_plate_index4">
               <div class="item" @click.stop="toPay(item.vehicleNo)">
-                <img :src="require(`./static/images/icon-edit.png`)" alt="" /><span>查询</span>
+                <img :src="require(`./static/images/icon-edit.png`)" alt=""/><span>查询</span>
               </div>
               <div class="item" @click="toEdit(item)">
-                <img :src="require(`./static/images/icon-find.png`)" alt="" /><span
-                  >编辑</span
-                >
+                <img :src="require(`./static/images/icon-find.png`)" alt=""/><span
+              >编辑</span
+              >
               </div>
               <div class="item" @click="toDelete(item)">
-                <img :src="require(`./static/images/icon-del-white.png`)" alt="" /><span
-                  >删除</span
-                >
+                <img :src="require(`./static/images/icon-del-white.png`)" alt=""/><span
+              >删除</span
+              >
               </div>
               <!-- <div class="plate_plate_index4_index2">
               <img src="static/images/money.png" @click="toPay(item.vehicleNo)" />
@@ -73,8 +73,14 @@
           v-if="!licensePlateList.length"
           @click="toAdd"
         >
-          <img class="addcar" :src="require(`./static/images/addcar.png`)" alt="" />
-          添加车牌
+          <div class="add_plate_no_data_title">
+            <!--          <img class="addcar" :src="require(`./static/images/addcar.png`)" alt="" />-->
+            <svg class="addcar" width="40" height="39" viewBox="0 0 40 39" fill="none" xmlns="http://www.w3.org/2000/svg">
+              <path d="M19.5557 0C8.75538 0 0 8.73044 0 19.5C0 30.2696 8.75538 39 19.5557 39C30.356 39 39.1114 30.2696 39.1114 19.5C39.1114 8.73044 30.356 0 19.5557 0ZM29.3336 21.5947H21.6946V29.2119H17.4168V21.5947H9.77786V17.3291H17.4168V9.71191H21.6946V17.3291H29.3336V21.5947Z" fill="var(--k-color-primary-01)"/>
+            </svg>
+            添加车牌
+          </div>
+          <div class="add_plate_no_data_info">添加车牌享受便捷车牌管理服务</div>
         </div>
         <div class="wrap_plate mt36">
           <div class="title">温馨提示:</div>
@@ -133,8 +139,9 @@
 <script>
 import vehicleManagementJs from './mixins/vehicleManagement'
 import baseMixins from './mixins/base'
+
 export default {
-  mixins:[baseMixins,vehicleManagementJs]
+  mixins: [baseMixins,vehicleManagementJs]
 }
 </script>
 
@@ -164,19 +171,23 @@ export default {
     .title {
       // width: 180px;
       // height: 50px;
-      font-size: 36px;
       // font-family: PingFangHK-Semibold, PingFangHK;
-      font-weight: 600;
       color: #333333;
-      line-height: 50px;
       margin-bottom: 20px;
+      font-family: 'PingFang SC';
+      font-style: normal;
+      font-weight: 400;
+      font-size: 30px;
+      line-height: 40px;
     }
 
     .desc {
-      font-size: 30px;
-      font-weight: 400;
       color: #999999;
-      line-height: 45px;
+      font-family: 'PingFang SC';
+      font-style: normal;
+      font-weight: 400;
+      font-size: 26px;
+      line-height: 40px;
     }
   }
 
@@ -429,11 +440,11 @@ export default {
 
 .add_plate_no_data {
   width: 90%;
-  height: 200px;
   text-align: center;
-  line-height: 200px;
+  height: 200px;
   // border: 1px dashed #eaeaea;
-  border: 1px solid #d8dae0;
+  border: 1px dashed var(--k-color-primary-01);
+  border-radius: 4px;
   // margin-left: 40px;
   margin: 0 auto;
   margin-top: 20px;
@@ -442,13 +453,34 @@ export default {
   font-weight: 500;
   font-size: 32px;
   background-color: var(--k-color-primary-06);
+  font-family: 'PingFang SC';
+  line-height: 45px;
   // display: flex;
   .addcar {
-    width:32px;
-    height:32px;
-    vertical-align: middle;
-}
+    width: 39px;
+    height: 39px;
+    margin-right: 13px;
+    //vertical-align: middle;
+  }
+  .add_plate_no_data_title {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    margin-bottom: 11px;
+    padding-top: 57px;
+    //vertical-align: middle;
+  }
+  .add_plate_no_data_info{
+    font-family: 'PingFang SC';
+    font-style: normal;
+    font-weight: 400;
+    font-size: 22px;
+    line-height: 31px;
+    /* identical to box height */
+    color: #666666;
+  }
 }
+
 .add_plate_box {
   text-align: center;
   // border: 1px dashed #eaeaea;
@@ -460,6 +492,7 @@ export default {
   z-index: 999;
   padding: 30px 30px 0 30px;
   box-shadow: 0px 13px 33px 0px rgba(190, 187, 187, 0.2);
+
   .btnpb {
     width: 100%;
     padding-bottom: 30px;
@@ -467,6 +500,7 @@ export default {
     padding-bottom: constant(safe-area-inset-bottom);
     padding-bottom: env(safe-area-inset-bottom);
   }
+
   .add_plate_btn {
     width: 100%;
     // margin-left: 30px;