去除右上角初始值

src/main.js

@@ -19,6 +19,7 @@ import Messages from './components/message/message'
 import "vue-easytable/libs/theme-default/index.css";
 import  '@/assets/css/public.scss'
 import "@/assets/css/index.scss"
+import EventBus from './utils/eventBus'
 
 
 import * as filters from '@/directives/filters'
@@ -37,6 +38,9 @@ Vue.use(Radio);
 Vue.use(Button);
 Vue.use(RadioGroup)
 
+// 安装事件总线
+Vue.use(EventBus)
+
 // datav组件
 Vue.use(loading)
 Vue.use(borderBox13)

src/utils/eventBus.js

@@ -0,0 +1,11 @@
+import Vue from 'vue'
+
+// 创建事件总线
+export const EventBus = new Vue()
+
+// 安装插件
+EventBus.install = function (Vue) {
+  Vue.prototype.$eventBus = EventBus
+}
+
+export default EventBus

src/views/indexs/center-bottom.vue

@@ -35,9 +35,16 @@ export default {
   mounted() {
     this.getData();
     window.addEventListener("resize", this.handleResize);
+
+    // 监听事件总线的刷新事件
+    this.$eventBus.$on('refresh-all-data', this.getData);
   },
   beforeDestroy() {
     window.removeEventListener("resize", this.handleResize);
+
+    // 移除事件总线的刷新事件监听
+    this.$eventBus.$off('refresh-all-data', this.getData);
+
     if (this.chart) {
       this.chart.dispose();
     }

src/views/indexs/center-map.vue

@@ -81,6 +81,12 @@ export default {
     this.currentBgColor2 = "#00D4AA";
     this.getData("china");
     //this.getData("440000");
+
+    // 监听事件总线的刷新事件
+    this.$eventBus.$on('refresh-all-data', () => {
+      this.getYearData();
+      this.getData(this.code);
+    });
   },
   methods: {
     changeShow1() {
@@ -768,6 +774,10 @@ export default {
   destroyed() {
     // 销毁事件监听
     this.$refs.CenterMap.chart.off("click");
+
+    // 移除事件总线的刷新事件监听
+    this.$eventBus.$off('refresh-all-data');
+
     if (this.charts) {
       this.echarts.dispose();
     }

src/views/indexs/chart/month-carbon.vue

@@ -18,9 +18,16 @@ export default {
   mounted() {
     this.getMonthData();
     window.addEventListener("resize", this.handleResize);
+
+    // 监听事件总线的刷新事件
+    this.$eventBus.$on('refresh-all-data', this.getMonthData);
   },
   beforeDestroy() {
     window.removeEventListener("resize", this.handleResize);
+
+    // 移除事件总线的刷新事件监听
+    this.$eventBus.$off('refresh-all-data', this.getMonthData);
+
     if (this.chart) {
       this.chart.dispose();
     }

src/views/indexs/index.vue

@@ -157,6 +157,8 @@ export default {
   },
   data() {
     return {
+      refreshInterval: null,
+      refreshTime: 1800000, // 30分钟刷新一次，可根据需要调整
       yearCarbonTon: 0,
       // 左侧卡片数据
       leftCards: [
@@ -177,13 +179,13 @@ export default {
       rightCards: [
         {
           id: 3,
-          value: "403 / 977",
+          value: "",
           unit: "辆",
-          label: "在线数量",
+          label: "总车辆数",
         },
         {
           id: 4,
-          value: "18012.87",
+          value: "",
           unit: "km",
           label: "当日行驶里程",
         },
@@ -207,6 +209,10 @@ export default {
   mounted() {
     this.getYearData();
     this.getDayData();
+    this.startRefreshTimer();
+  },
+  beforeDestroy() {
+    this.clearRefreshTimer();
   },
   methods: {
     getYearData() {
@@ -244,16 +250,35 @@ export default {
         this.$set(this.leftCards[1], "value", dayHydrogen);
 
         // 更新右侧卡片 - 在线数量
-        this.$set(
-          this.rightCards[0],
-          "value",
-          onLineCount + " / " + vehicleCount
-        );
+        this.$set(this.rightCards[0], "value", vehicleCount);
 
         // 更新右侧卡片 - 当日行驶里程
         this.$set(this.rightCards[1], "value", dayMileage);
       });
     },
+    // 启动定时器
+    startRefreshTimer() {
+      this.refreshInterval = setInterval(() => {
+        this.refreshAllData();
+      }, this.refreshTime);
+    },
+    // 清除定时器
+    clearRefreshTimer() {
+      if (this.refreshInterval) {
+        clearInterval(this.refreshInterval);
+        this.refreshInterval = null;
+      }
+    },
+    // 统一刷新所有数据
+    refreshAllData() {
+      console.log("开始刷新数据...");
+      // 刷新主页面数据
+      this.getYearData();
+      this.getDayData();
+
+      // 通过事件总线通知子组件刷新数据
+      this.$eventBus.$emit("refresh-all-data");
+    },
   },
 };
 </script>

src/views/indexs/left-bottom.vue

@@ -33,9 +33,16 @@ export default {
   mounted() {
     this.getMonthData();
     window.addEventListener("resize", this.handleResize);
+
+    // 监听事件总线的刷新事件
+    this.$eventBus.$on('refresh-all-data', this.getMonthData);
   },
   beforeDestroy() {
     window.removeEventListener("resize", this.handleResize);
+
+    // 移除事件总线的刷新事件监听
+    this.$eventBus.$off('refresh-all-data', this.getMonthData);
+
     if (this.chart) {
       this.chart.dispose();
     }

src/views/indexs/left-center.vue

@@ -37,9 +37,15 @@ export default {
   created() {
     this.getData();
   },
-  mounted() {},
+  mounted() {
+    // 监听事件总线的刷新事件
+    this.$eventBus.$on('refresh-all-data', this.getData);
+  },
   beforeDestroy() {
     this.clearData();
+
+    // 移除事件总线的刷新事件监听
+    this.$eventBus.$off('refresh-all-data', this.getData);
   },
   methods: {
     clearData() {

src/views/indexs/left-top.vue

@@ -105,6 +105,13 @@ export default {
   },
   mounted() {
     this.getData();
+
+    // 监听事件总线的刷新事件
+    this.$eventBus.$on('refresh-all-data', this.getData);
+  },
+  beforeDestroy() {
+    // 移除事件总线的刷新事件监听
+    this.$eventBus.$off('refresh-all-data', this.getData);
   },
   methods: {
     getData() {
@@ -186,7 +193,11 @@ export default {
   display: flex;
   align-items: center;
   justify-content: center;
-  background: linear-gradient(135deg, rgba(0, 212, 170, 0.1), rgba(0, 212, 170, 0.05));
+  background: linear-gradient(
+    135deg,
+    rgba(0, 212, 170, 0.1),
+    rgba(0, 212, 170, 0.05)
+  );
   border-radius: 8px;
 }
 
@@ -217,7 +228,7 @@ export default {
 .card-value .number {
   font-size: 22px;
   font-weight: 700;
-  color: #00D4AA;
+  color: #00d4aa;
   line-height: 1;
 }
 
@@ -235,7 +246,11 @@ export default {
   justify-content: center;
   gap: 8px;
   padding: 16px 24px;
-  background: linear-gradient(135deg, rgba(0, 212, 170, 0.05), rgba(0, 212, 170, 0.02));
+  background: linear-gradient(
+    135deg,
+    rgba(0, 212, 170, 0.05),
+    rgba(0, 212, 170, 0.02)
+  );
   border-radius: 8px;
   border: 1px solid rgba(0, 212, 170, 0.2);
 }
@@ -251,7 +266,7 @@ export default {
   display: inline-flex;
   align-items: center;
   padding: 4px 12px;
-  background: #00D4AA;
+  background: #00d4aa;
   color: #ffffff;
   font-size: 12px;
   font-weight: 500;

src/views/indexs/right-bottom.vue

@@ -64,6 +64,13 @@ export default {
   },
   mounted() {
     this.getExchangeData();
+
+    // 监听事件总线的刷新事件
+    this.$eventBus.$on('refresh-all-data', this.getExchangeData);
+  },
+  beforeDestroy() {
+    // 移除事件总线的刷新事件监听
+    this.$eventBus.$off('refresh-all-data', this.getExchangeData);
   },
   methods: {
     getExchangeData() {

src/views/indexs/right-top-day.vue

@@ -21,7 +21,7 @@
         <table @click="tableClick">
           <tbody>
             <tr v-for="(item, index) in tableData" :key="index">
-              <td style="width: 24%">{{ item.plateNumber }}</td>
+              <td style="width: 24%">{{ maskPlateNumber(item.plateNumber) }}</td>
               <td style="width: 19%">{{ item.totalMileage }}km</td>
               <td style="width: 19%">{{ item.dayMileage }}km</td>
               <td style="width: 19%">{{ item.dayHydrogen }}kg</td>
@@ -141,6 +141,13 @@ export default {
   },
   mounted() {
     this.getExchangeData();
+
+    // 监听事件总线的刷新事件
+    this.$eventBus.$on('refresh-all-data', this.getExchangeData);
+  },
+  beforeDestroy() {
+    // 移除事件总线的刷新事件监听
+    this.$eventBus.$off('refresh-all-data', this.getExchangeData);
   },
   methods: {
     tableClick() {
@@ -150,6 +157,15 @@ export default {
     closeDialog() {
       this.setVehicleDialog = false;
     },
+    maskPlateNumber(plateNumber) {
+      if (!plateNumber || typeof plateNumber !== 'string') return plateNumber;
+      // 车牌号格式：省份简称+字母+5位数字（如：粤A12345）
+      // 隐藏中间四位数字
+      if (plateNumber.length >= 7) {
+        return plateNumber.substring(0, 2) + '****' + plateNumber.substring(6);
+      }
+      return plateNumber;
+    },
     getExchangeData() {
       currentGET("big13").then((res) => {
         console.log("当日汇总数据：");