修改样式

src/views/securityCheck/views/agentHome.vue

@@ -34,7 +34,10 @@
                     <div class="child" @click="echarup('', item.name)">
                       件数：{{ item.value }}
                     </div>
-                    <div class="child">占比：{{ item.proportion }}</div>
+                    <div class="child">
+                      占比：
+                      <p>{{ item.proportion }}</p>
+                    </div>
                   </div>
                 </div>
               </div>
@@ -78,7 +81,10 @@
                     <div class="child" @click="echarup(item, '普通')">
                       件数：{{ item.value }}
                     </div>
-                    <div class="child">占比：{{ item.prot }}</div>
+                    <div class="child">
+                      占比：
+                      <p>{{ item.prot }}</p>
+                    </div>
                   </div>
                 </div>
               </div>
@@ -122,7 +128,10 @@
                     <div class="child" @click="echarup(item, '低风险')">
                       件数：{{ item.value }}
                     </div>
-                    <div class="child">占比：{{ item.prot }}</div>
+                    <div class="child">
+                      占比：
+                      <p>{{ item.prot }}</p>
+                    </div>
                   </div>
                 </div>
               </div>
@@ -166,7 +175,10 @@
                     <div class="child" @click="echarup(item, '高风险')">
                       件数：{{ item.value }}
                     </div>
-                    <div class="child">占比：{{ item.prot }}</div>
+                    <div class="child">
+                      占比：
+                      <p>{{ item.prot }}</p>
+                    </div>
                   </div>
                 </div>
               </div>
@@ -785,6 +797,15 @@ export default {
           font-weight: 400;
           color: #747784;
           cursor: pointer;
+          display: flex;
+          justify-content: space-between;
+          align-items: center;
+          > p {
+            width: 36px;
+            margin-bottom: 0;
+            display: flex;
+            justify-content: flex-end;
+          }
         }
         > .child:hover {
           color: blue;
@@ -838,6 +859,15 @@ export default {
           font-weight: 400;
           color: #747784;
           cursor: pointer;
+          display: flex;
+          justify-content: space-between;
+          align-items: center;
+          > p {
+            width: 36px;
+            margin-bottom: 0;
+            display: flex;
+            justify-content: flex-end;
+          }
         }
         > .child:hover {
           color: blue;

src/views/securityCheck/views/cargoStatisticsHome.vue

@@ -38,7 +38,10 @@
                     <div class="child" @click="echarup('', item.name)">
                       件数：{{ item.value }}
                     </div>
-                    <div class="child">占比：{{ item.proportion }}</div>
+                    <div class="child">
+                      占比：
+                      <p>{{ item.proportion }}</p>
+                    </div>
                   </div>
                 </div>
               </div>
@@ -82,7 +85,10 @@
                     <div class="child" @click="echarup(item, '低风险')">
                       件数：{{ item.value }}
                     </div>
-                    <div class="child">占比：{{ item.prot }}</div>
+                    <div class="child">
+                      占比：
+                      <p>{{ item.prot }}</p>
+                    </div>
                   </div>
                 </div>
               </div>
@@ -126,7 +132,10 @@
                     <div class="child" @click="echarup(item, '优先级')">
                       件数：{{ item.value }}
                     </div>
-                    <div class="child">占比：{{ item.prot }}</div>
+                    <div class="child">
+                      占比：
+                      <p>{{ item.prot }}</p>
+                    </div>
                   </div>
                 </div>
               </div>
@@ -170,7 +179,10 @@
                     <div class="child" @click="echarup(item, '普通')">
                       件数：{{ item.value }}
                     </div>
-                    <div class="child">占比：{{ item.prot }}</div>
+                    <div class="child">
+                      占比：
+                      <p>{{ item.prot }}</p>
+                    </div>
                   </div>
                 </div>
               </div>
@@ -214,7 +226,10 @@
                     <div class="child" @click="echarup(item, '严控级')">
                       件数：{{ item.value }}
                     </div>
-                    <div class="child">占比：{{ item.prot }}</div>
+                    <div class="child">
+                      占比：
+                      <p>{{ item.prot }}</p>
+                    </div>
                   </div>
                 </div>
               </div>
@@ -258,7 +273,10 @@
                     <div class="child" @click="echarup(item, '高风险')">
                       件数：{{ item.value }}
                     </div>
-                    <div class="child">占比：{{ item.prot }}</div>
+                    <div class="child">
+                      占比：
+                      <p>{{ item.prot }}</p>
+                    </div>
                   </div>
                 </div>
               </div>
@@ -989,6 +1007,15 @@ export default {
           font-weight: 400;
           color: #747784;
           cursor: pointer;
+          display: flex;
+          justify-content: space-between;
+          align-items: center;
+          > p {
+            width: 36px;
+            margin-bottom: 0;
+            display: flex;
+            justify-content: flex-end;
+          }
         }
         > .child:hover {
           color: blue;
@@ -1052,6 +1079,15 @@ export default {
           font-weight: 400;
           color: #747784;
           cursor: pointer;
+          display: flex;
+          justify-content: space-between;
+          align-items: center;
+          > p {
+            width: 36px;
+            margin-bottom: 0;
+            display: flex;
+            justify-content: flex-end;
+          }
         }
         > .child:hover {
           color: blue;