Forráskód Böngészése

fix: a1-b2 样式优化

wjc 3 napja
szülő
commit
e0f7bd8fd3

+ 6 - 1
src/main.js

@@ -2,7 +2,7 @@
  * @Author: WangQiBiao
  * @Date: 2019-09-24 17:50:53
  * @LastEditors: wjc
- * @LastEditTime: 2025-11-26 15:54:39
+ * @LastEditTime: 2025-12-01 17:21:02
  * @Description:
  */
 import Vue from 'vue'
@@ -34,6 +34,11 @@ Vue.filter('safeGet', function (obj, path, defaultValue = '无') {
   // 最终值为空时返回默认值
   return result || defaultValue
 })
+Vue.filter('formatNumber', function (num = 0) {
+  return (+num).toLocaleString('zh', {
+    maximumFractionDigits: 2
+  })
+})
 
 Vue.use(VueTianditu, {
   v: '4.0',

+ 7 - 17
src/views/hui-jia/components/implementary/total.vue

@@ -7,7 +7,7 @@
     <div class="total-grid">
       <div class="total-item">
         <div class="total-label">城市总数</div>
-        <div class="total-value">{{ formatNumber(data.cities) }}</div>
+        <div class="total-value">{{ data.cities | formatNumber }}</div>
       </div>
       <div class="total-item">
         <div class="total-label">企业总数</div>
@@ -15,31 +15,27 @@
       </div>
       <div class="total-item">
         <div class="total-label">合同总数</div>
-        <div class="total-value">{{ formatNumber(data.contracts) }}</div>
+        <div class="total-value">{{ data.contracts | formatNumber }}</div>
       </div>
       <div class="total-item">
         <div class="total-label">履约次数</div>
-        <div class="total-value">{{ formatNumber(data.perform_times) }}</div>
+        <div class="total-value">{{ data.perform_times | formatNumber }}</div>
       </div>
       <div class="total-item">
         <div class="total-label">服务时长</div>
-        <div class="total-value">{{ formatNumber(data.service_time) }}</div>
+        <div class="total-value">{{ data.service_time | formatNumber }}</div>
       </div>
       <div class="total-item">
         <div class="total-label">项目总数</div>
-        <div class="total-value">{{ formatNumber(data.residences) }}</div>
+        <div class="total-value">{{ data.residences | formatNumber }}</div>
       </div>
       <div class="total-item">
         <div class="total-label">签约户数</div>
-        <div class="total-value">
-          {{ formatNumber(data.contracted_households) }}
-        </div>
+        <div class="total-value">{{ data.contracted_households | formatNumber }}</div>
       </div>
       <div class="total-item">
         <div class="total-label">实施户数</div>
-        <div class="total-value">
-          {{ formatNumber(data.actual_households) }}
-        </div>
+        <div class="total-value">{{ data.actual_households | formatNumber }}</div>
       </div>
     </div>
   </div>
@@ -63,12 +59,6 @@
       ...mapState(["entCode", "communityId"]),
     },
     methods: {
-      // 格式化数字显示
-      formatNumber(num) {
-        return num.toLocaleString("zh", {
-          maximumFractionDigits: 2,
-        })
-      },
     },
   }
 </script>

+ 4 - 4
src/views/hui-jia/components/online-water/index.vue

@@ -6,7 +6,7 @@
       </div>
       <div class="info">
         <p class="title">线上流水总额</p>
-        <p class="num">{{ onlineWaterInfo.allSum || 0 }}</p>
+        <p class="num">{{ onlineWaterInfo.allSum | formatNumber }}</p>
       </div>
     </div>
     <div class="con-center display-flex">
@@ -108,14 +108,14 @@ export default {
   }
   .img{
     width: halfW(50);
-    height: halfH(50);
+    height: halfW(50);
     padding: halfH(10) halfW(10);
     box-sizing: border-box;
     background: #12223C;
     border-radius: 50%;
     .icon{
-      width: 100%;
-      height: 100%;
+      width: halfW(30);
+      height: halfW(30);
     }
   }
   .con-top{

+ 8 - 8
src/views/hui-jia/components/resident/index.vue

@@ -7,7 +7,7 @@
         <div class="num display-flex flex-1">
           <div v-for="item in residentData" :key="item.title" class="resident-item flex-1">
             <div class="title">{{ item.title }}</div>
-            <div class="value">{{ item.value }}</div>
+            <div class="value">{{ item.value | formatNumber }}</div>
           </div>
         </div>
       </div>
@@ -17,7 +17,7 @@
             <img :src="item.icon" alt="" class="img">
           </div>
           <div class="title">{{ item.title }}</div>
-          <div class="value">{{ item.value }}</div>
+          <div class="value">{{ item.value | formatNumber }}</div>
         </div>
       </div>
     </Card>
@@ -88,7 +88,6 @@ export default {
     }
   },
   mounted () {
-    
     this.getUsersStatistics()
   },
   methods: {
@@ -231,6 +230,7 @@ export default {
         ]
       }
       myChart.setOption(option)
+      myChart.resize()
     }
   }
 }
@@ -251,16 +251,16 @@ export default {
   .num{
     flex-direction: column;
     text-align: center;
-    padding-left: halfW(10);
+    gap: halfH(20);
     .resident-item{
       align-content: center;
     }
     .title{
-      font-size: halfH(16);
+      font-size: halfW(16);
       color: #82D1F6;
     }
     .value{
-      font-size: halfH(20);
+      font-size: halfW(20);
       color: #FFFFFF;
       margin-top: halfH(10);
     }
@@ -284,12 +284,12 @@ export default {
       height: halfW(40);
     }
     .title{
-      font-size: halfH(20);
+      font-size: halfW(20);
       color: #82D1F6;
       margin: halfH(20) 0;
     }
     .value{
-      font-size: halfH(20);
+      font-size: halfW(20);
       color: #FFFFFF;
     }
   }

+ 3 - 3
src/views/hui-jia/components/user/index.vue

@@ -6,7 +6,7 @@
             <img :src="item.icon" alt="" class="img">
           </div>
           <div class="title">{{ item.title }}</div>
-          <div class="value">{{ item.value }}</div>
+          <div class="value">{{ item.value | formatNumber }}</div>
         </div>
       </div>
     </Card>
@@ -111,12 +111,12 @@ export default {
     object-fit: cover;
   }
   .title{
-    font-size: halfH(18);
+    font-size: halfW(16);
     color: #9BDAFF;
     margin: halfH(16) 0;
   }
   .value{
-    font-size: halfH(22);
+    font-size: halfW(20);
     color: #fff;
   }
 }