定时任务
This commit is contained in:
@@ -19,6 +19,7 @@ import Messages from './components/message/message'
|
|||||||
import "vue-easytable/libs/theme-default/index.css";
|
import "vue-easytable/libs/theme-default/index.css";
|
||||||
import '@/assets/css/public.scss'
|
import '@/assets/css/public.scss'
|
||||||
import "@/assets/css/index.scss"
|
import "@/assets/css/index.scss"
|
||||||
|
import EventBus from './utils/eventBus'
|
||||||
|
|
||||||
|
|
||||||
import * as filters from '@/directives/filters'
|
import * as filters from '@/directives/filters'
|
||||||
@@ -37,6 +38,9 @@ Vue.use(Radio);
|
|||||||
Vue.use(Button);
|
Vue.use(Button);
|
||||||
Vue.use(RadioGroup)
|
Vue.use(RadioGroup)
|
||||||
|
|
||||||
|
// 安装事件总线
|
||||||
|
Vue.use(EventBus)
|
||||||
|
|
||||||
// datav组件
|
// datav组件
|
||||||
Vue.use(loading)
|
Vue.use(loading)
|
||||||
Vue.use(borderBox13)
|
Vue.use(borderBox13)
|
||||||
|
|||||||
11
src/utils/eventBus.js
Normal file
11
src/utils/eventBus.js
Normal file
@@ -0,0 +1,11 @@
|
|||||||
|
import Vue from 'vue'
|
||||||
|
|
||||||
|
// 创建事件总线
|
||||||
|
export const EventBus = new Vue()
|
||||||
|
|
||||||
|
// 安装插件
|
||||||
|
EventBus.install = function (Vue) {
|
||||||
|
Vue.prototype.$eventBus = EventBus
|
||||||
|
}
|
||||||
|
|
||||||
|
export default EventBus
|
||||||
@@ -35,9 +35,16 @@ export default {
|
|||||||
mounted() {
|
mounted() {
|
||||||
this.getData();
|
this.getData();
|
||||||
window.addEventListener("resize", this.handleResize);
|
window.addEventListener("resize", this.handleResize);
|
||||||
|
|
||||||
|
// 监听事件总线的刷新事件
|
||||||
|
this.$eventBus.$on('refresh-all-data', this.getData);
|
||||||
},
|
},
|
||||||
beforeDestroy() {
|
beforeDestroy() {
|
||||||
window.removeEventListener("resize", this.handleResize);
|
window.removeEventListener("resize", this.handleResize);
|
||||||
|
|
||||||
|
// 移除事件总线的刷新事件监听
|
||||||
|
this.$eventBus.$off('refresh-all-data', this.getData);
|
||||||
|
|
||||||
if (this.chart) {
|
if (this.chart) {
|
||||||
this.chart.dispose();
|
this.chart.dispose();
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -81,6 +81,12 @@ export default {
|
|||||||
this.currentBgColor2 = "#00D4AA";
|
this.currentBgColor2 = "#00D4AA";
|
||||||
this.getData("china");
|
this.getData("china");
|
||||||
//this.getData("440000");
|
//this.getData("440000");
|
||||||
|
|
||||||
|
// 监听事件总线的刷新事件
|
||||||
|
this.$eventBus.$on('refresh-all-data', () => {
|
||||||
|
this.getYearData();
|
||||||
|
this.getData(this.code);
|
||||||
|
});
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
changeShow1() {
|
changeShow1() {
|
||||||
@@ -768,6 +774,10 @@ export default {
|
|||||||
destroyed() {
|
destroyed() {
|
||||||
// 销毁事件监听
|
// 销毁事件监听
|
||||||
this.$refs.CenterMap.chart.off("click");
|
this.$refs.CenterMap.chart.off("click");
|
||||||
|
|
||||||
|
// 移除事件总线的刷新事件监听
|
||||||
|
this.$eventBus.$off('refresh-all-data');
|
||||||
|
|
||||||
if (this.charts) {
|
if (this.charts) {
|
||||||
this.echarts.dispose();
|
this.echarts.dispose();
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -18,9 +18,16 @@ export default {
|
|||||||
mounted() {
|
mounted() {
|
||||||
this.getMonthData();
|
this.getMonthData();
|
||||||
window.addEventListener("resize", this.handleResize);
|
window.addEventListener("resize", this.handleResize);
|
||||||
|
|
||||||
|
// 监听事件总线的刷新事件
|
||||||
|
this.$eventBus.$on('refresh-all-data', this.getMonthData);
|
||||||
},
|
},
|
||||||
beforeDestroy() {
|
beforeDestroy() {
|
||||||
window.removeEventListener("resize", this.handleResize);
|
window.removeEventListener("resize", this.handleResize);
|
||||||
|
|
||||||
|
// 移除事件总线的刷新事件监听
|
||||||
|
this.$eventBus.$off('refresh-all-data', this.getMonthData);
|
||||||
|
|
||||||
if (this.chart) {
|
if (this.chart) {
|
||||||
this.chart.dispose();
|
this.chart.dispose();
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -157,6 +157,8 @@ export default {
|
|||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
refreshInterval: null,
|
||||||
|
refreshTime: 1800000, // 30分钟刷新一次,可根据需要调整
|
||||||
yearCarbonTon: 0,
|
yearCarbonTon: 0,
|
||||||
// 左侧卡片数据
|
// 左侧卡片数据
|
||||||
leftCards: [
|
leftCards: [
|
||||||
@@ -177,9 +179,9 @@ export default {
|
|||||||
rightCards: [
|
rightCards: [
|
||||||
{
|
{
|
||||||
id: 3,
|
id: 3,
|
||||||
value: "403 / 977",
|
value: "1004",
|
||||||
unit: "辆",
|
unit: "辆",
|
||||||
label: "在线数量",
|
label: "总车辆数",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: 4,
|
id: 4,
|
||||||
@@ -207,6 +209,10 @@ export default {
|
|||||||
mounted() {
|
mounted() {
|
||||||
this.getYearData();
|
this.getYearData();
|
||||||
this.getDayData();
|
this.getDayData();
|
||||||
|
this.startRefreshTimer();
|
||||||
|
},
|
||||||
|
beforeDestroy() {
|
||||||
|
this.clearRefreshTimer();
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
getYearData() {
|
getYearData() {
|
||||||
@@ -244,16 +250,35 @@ export default {
|
|||||||
this.$set(this.leftCards[1], "value", dayHydrogen);
|
this.$set(this.leftCards[1], "value", dayHydrogen);
|
||||||
|
|
||||||
// 更新右侧卡片 - 在线数量
|
// 更新右侧卡片 - 在线数量
|
||||||
this.$set(
|
this.$set(this.rightCards[0], "value", vehicleCount);
|
||||||
this.rightCards[0],
|
|
||||||
"value",
|
|
||||||
onLineCount + " / " + vehicleCount
|
|
||||||
);
|
|
||||||
|
|
||||||
// 更新右侧卡片 - 当日行驶里程
|
// 更新右侧卡片 - 当日行驶里程
|
||||||
this.$set(this.rightCards[1], "value", dayMileage);
|
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>
|
</script>
|
||||||
|
|||||||
@@ -33,9 +33,16 @@ export default {
|
|||||||
mounted() {
|
mounted() {
|
||||||
this.getMonthData();
|
this.getMonthData();
|
||||||
window.addEventListener("resize", this.handleResize);
|
window.addEventListener("resize", this.handleResize);
|
||||||
|
|
||||||
|
// 监听事件总线的刷新事件
|
||||||
|
this.$eventBus.$on('refresh-all-data', this.getMonthData);
|
||||||
},
|
},
|
||||||
beforeDestroy() {
|
beforeDestroy() {
|
||||||
window.removeEventListener("resize", this.handleResize);
|
window.removeEventListener("resize", this.handleResize);
|
||||||
|
|
||||||
|
// 移除事件总线的刷新事件监听
|
||||||
|
this.$eventBus.$off('refresh-all-data', this.getMonthData);
|
||||||
|
|
||||||
if (this.chart) {
|
if (this.chart) {
|
||||||
this.chart.dispose();
|
this.chart.dispose();
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -37,9 +37,15 @@ export default {
|
|||||||
created() {
|
created() {
|
||||||
this.getData();
|
this.getData();
|
||||||
},
|
},
|
||||||
mounted() {},
|
mounted() {
|
||||||
|
// 监听事件总线的刷新事件
|
||||||
|
this.$eventBus.$on('refresh-all-data', this.getData);
|
||||||
|
},
|
||||||
beforeDestroy() {
|
beforeDestroy() {
|
||||||
this.clearData();
|
this.clearData();
|
||||||
|
|
||||||
|
// 移除事件总线的刷新事件监听
|
||||||
|
this.$eventBus.$off('refresh-all-data', this.getData);
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
clearData() {
|
clearData() {
|
||||||
|
|||||||
@@ -105,6 +105,13 @@ export default {
|
|||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
this.getData();
|
this.getData();
|
||||||
|
|
||||||
|
// 监听事件总线的刷新事件
|
||||||
|
this.$eventBus.$on('refresh-all-data', this.getData);
|
||||||
|
},
|
||||||
|
beforeDestroy() {
|
||||||
|
// 移除事件总线的刷新事件监听
|
||||||
|
this.$eventBus.$off('refresh-all-data', this.getData);
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
getData() {
|
getData() {
|
||||||
@@ -186,7 +193,11 @@ export default {
|
|||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: 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;
|
border-radius: 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -217,7 +228,7 @@ export default {
|
|||||||
.card-value .number {
|
.card-value .number {
|
||||||
font-size: 22px;
|
font-size: 22px;
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
color: #00D4AA;
|
color: #00d4aa;
|
||||||
line-height: 1;
|
line-height: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -235,7 +246,11 @@ export default {
|
|||||||
justify-content: center;
|
justify-content: center;
|
||||||
gap: 8px;
|
gap: 8px;
|
||||||
padding: 16px 24px;
|
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-radius: 8px;
|
||||||
border: 1px solid rgba(0, 212, 170, 0.2);
|
border: 1px solid rgba(0, 212, 170, 0.2);
|
||||||
}
|
}
|
||||||
@@ -251,7 +266,7 @@ export default {
|
|||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
padding: 4px 12px;
|
padding: 4px 12px;
|
||||||
background: #00D4AA;
|
background: #00d4aa;
|
||||||
color: #ffffff;
|
color: #ffffff;
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
|
|||||||
@@ -64,6 +64,13 @@ export default {
|
|||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
this.getExchangeData();
|
this.getExchangeData();
|
||||||
|
|
||||||
|
// 监听事件总线的刷新事件
|
||||||
|
this.$eventBus.$on('refresh-all-data', this.getExchangeData);
|
||||||
|
},
|
||||||
|
beforeDestroy() {
|
||||||
|
// 移除事件总线的刷新事件监听
|
||||||
|
this.$eventBus.$off('refresh-all-data', this.getExchangeData);
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
getExchangeData() {
|
getExchangeData() {
|
||||||
|
|||||||
@@ -21,7 +21,7 @@
|
|||||||
<table @click="tableClick">
|
<table @click="tableClick">
|
||||||
<tbody>
|
<tbody>
|
||||||
<tr v-for="(item, index) in tableData" :key="index">
|
<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.totalMileage }}km</td>
|
||||||
<td style="width: 19%">{{ item.dayMileage }}km</td>
|
<td style="width: 19%">{{ item.dayMileage }}km</td>
|
||||||
<td style="width: 19%">{{ item.dayHydrogen }}kg</td>
|
<td style="width: 19%">{{ item.dayHydrogen }}kg</td>
|
||||||
@@ -141,6 +141,13 @@ export default {
|
|||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
this.getExchangeData();
|
this.getExchangeData();
|
||||||
|
|
||||||
|
// 监听事件总线的刷新事件
|
||||||
|
this.$eventBus.$on('refresh-all-data', this.getExchangeData);
|
||||||
|
},
|
||||||
|
beforeDestroy() {
|
||||||
|
// 移除事件总线的刷新事件监听
|
||||||
|
this.$eventBus.$off('refresh-all-data', this.getExchangeData);
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
tableClick() {
|
tableClick() {
|
||||||
@@ -150,6 +157,15 @@ export default {
|
|||||||
closeDialog() {
|
closeDialog() {
|
||||||
this.setVehicleDialog = false;
|
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() {
|
getExchangeData() {
|
||||||
currentGET("big13").then((res) => {
|
currentGET("big13").then((res) => {
|
||||||
console.log("当日汇总数据:");
|
console.log("当日汇总数据:");
|
||||||
|
|||||||
Reference in New Issue
Block a user