zc

src/views/components/usageRateComponent.vue

@@ -10,7 +10,7 @@
         <p>使用率</p>
       </div>
       <div class="for-big-box" v-for="(item,index) in selectedItems" :key="index">
-        <p :class="item.id=='0'?'one-p':(item.id=='1'?'tow-p':'')">{{item.id != '0' && item.id != '1'?item.id:''}}<span v-if="item.id == '0' || item.id == '1'"></span></p>
+        <p :class="item.id=='0'?'one-p':(item.id=='1'?'tow-p':'none-p')"><span>{{item.id != '0' && item.id != '1'?item.id:''}}</span></p>
         <p>{{item.name}}</p>
         <p>{{item.num}}</p>
         <p>{{item.value}}</p>
@@ -395,6 +395,19 @@
             background-size: 100% 100%;
           }
         }
+        .none-p{
+          span{
+            text-align: center;
+            display: inline-block;
+            width:22px;
+            height:22px;
+            line-height: 22px;
+            background: #0E52C3;
+            border-radius: 50%;
+            border: 1px solid #0576FF;
+            margin: 9px;
+          }
+        }
         p{
           height:48px;
           line-height:48px;