1.首页总累计运行数据修改数据来源为电表报表

This commit is contained in:
xiaoyang
2026-04-21 16:32:47 +08:00
parent 9380fd1ad5
commit d45adba0df
2 changed files with 71 additions and 175 deletions

View File

@ -16,6 +16,14 @@ export function getDzjkHomeTotalView(siteId) {
}) })
} }
// 获取单个站点首页总累计运行数据(首页专用)
export function getDzjkHomeRunningData(siteId) {
return request({
url: `/ems/siteMonitor/homeRunningData?siteId=${siteId}`,
method: 'get'
})
}
// 鍗曠珯鐩戞帶椤圭洰鐐逛綅閰嶇疆锛堜緵鍗曠珯鐩戞帶鍔熻兘鏌ヨ锛? // 鍗曠珯鐩戞帶椤圭洰鐐逛綅閰嶇疆锛堜緵鍗曠珯鐩戞帶鍔熻兘鏌ヨ锛?
export function getProjectPointMapping(siteId) { export function getProjectPointMapping(siteId) {
return request({ return request({

View File

@ -1,8 +1,8 @@
<template> <template>
<div> <div>
<el-row style="background: #fff" class="row-container" :gutter="15"> <el-row style="background: #fff" class="row-container" :gutter="15">
<el-col :xs="24" :sm="24" :lg="5"> <el-col :xs="24" :sm="24" :lg="5">
<!-- 站点信息--> <!-- 站点信息 -->
<el-card <el-card
shadow="always" shadow="always"
class="common-card-container common-card-container-body-no-padding" class="common-card-container common-card-container-body-no-padding"
@ -16,7 +16,7 @@
<div <div
style="box-sizing: border-box; height: 218px; padding: 20px 15px" style="box-sizing: border-box; height: 218px; padding: 20px 15px"
> >
<!-- 地址运行时间--> <!-- 地址运行时间 -->
<div class="site-info site-info-address"> <div class="site-info site-info-address">
<div class="title"> <div class="title">
<i class="el-icon-location"></i> <i class="el-icon-location"></i>
@ -35,7 +35,7 @@
<span v-else>{{ info.runningTime || '-' }}</span> <span v-else>{{ info.runningTime || '-' }}</span>
</div> </div>
</div> </div>
<!-- 装机功率容量 --> <!-- 装机功率容量 -->
<el-row :gutter="10" style="margin-top:20px;"> <el-row :gutter="10" style="margin-top:20px;">
<el-col <el-col
:span="12" :span="12"
@ -65,7 +65,7 @@
</div> </div>
</el-card> </el-card>
</el-col> </el-col>
<!-- 总累计运行数据--> <!-- 总累计运行数据 -->
<el-col :xs="24" :sm="24" :lg="19"> <el-col :xs="24" :sm="24" :lg="19">
<el-card <el-card
shadow="always" shadow="always"
@ -151,7 +151,7 @@
<script> <script>
import * as echarts from "echarts"; import * as echarts from "echarts";
import {getSingleSiteBaseInfo} from "@/api/ems/zddt"; import {getSingleSiteBaseInfo} from "@/api/ems/zddt";
import {getAmmeterData, getDzjkHomeTotalView, getProjectDisplayData} from "@/api/ems/dzjk"; import {getDzjkHomeRunningData, getProjectDisplayData} from "@/api/ems/dzjk";
import {getPointConfigCurve} from "@/api/ems/site"; import {getPointConfigCurve} from "@/api/ems/site";
import WeekChart from "./WeekChart.vue"; import WeekChart from "./WeekChart.vue";
import ActiveChart from "./ActiveChart.vue"; import ActiveChart from "./ActiveChart.vue";
@ -225,11 +225,15 @@ export default {
attr: "yesterdayRevenue", attr: "yesterdayRevenue",
color: '#f67438' color: '#f67438'
}, },
{
title: "总收入(元)",
attr: "totalRevenue",
color: '#f67438'
},
], ],
info: {}, //基本信息 info: {},
runningInfo: {}, //总累计运行数据+报警表格 runningInfo: {},
runningDisplayData: [], //单站监控项目配置展示数据 runningDisplayData: [],
ammeterDailySummary: {},
}; };
}, },
computed: { computed: {
@ -238,40 +242,21 @@ export default {
}, },
isRunningInfoLoading() { isRunningInfoLoading() {
const state = this.$data || {}; const state = this.$data || {};
return !!(state.runningInfoLoading || state.runningUpdateSpinning || state.loading); return !!(state.runningInfoLoading || state.loading);
}, },
tableData() { tableData() {
return this.runningInfo?.siteMonitorHomeAlarmVo || []; return this.runningInfo?.siteMonitorHomeAlarmVo || [];
}, },
totalRunningSectionData() {
return (this.runningDisplayData || []).filter(item => item.sectionName === "总累计运行数据");
},
totalRevenueDisplayItem() { totalRevenueDisplayItem() {
const sectionData = this.totalRunningSectionData || []; return this.fallbackSjglData.find(item => item.attr === "totalRevenue") || null;
const byFieldCode = sectionData.find(item => item.fieldCode === "totalRevenue");
if (byFieldCode) {
return byFieldCode;
}
return sectionData.find(item => item.fieldName === "总收入");
}, },
totalRevenueDisplayValue() { totalRevenueDisplayValue() {
return this.totalRevenueDisplayItem ? this.totalRevenueDisplayItem.fieldValue : this.runningInfo.totalRevenue; return this.runningInfo.totalRevenue;
}, },
runningDataCards() { runningDataCards() {
const sectionData = this.totalRunningSectionData || []; return this.fallbackSjglData
if (sectionData.length > 0) { .filter(item => item.attr !== "totalRevenue")
const revenueFieldCode = this.totalRevenueDisplayItem ? this.totalRevenueDisplayItem.fieldCode : ""; .map(item => ({
return sectionData
.filter(item => item.fieldCode !== revenueFieldCode)
.map((item, index) => ({
title: item.fieldName,
value: this.getRunningCardValue(item),
color: this.getCardColor(index),
loading: this.isRunningInfoLoading,
raw: item,
}));
}
return this.fallbackSjglData.map(item => ({
title: item.title, title: item.title,
value: this.getRunningCardValue(item), value: this.getRunningCardValue(item),
color: item.color, color: item.color,
@ -321,7 +306,7 @@ export default {
openCurveDialog({pointId, title}) { openCurveDialog({pointId, title}) {
const range = this.getDefaultCurveRange(); const range = this.getDefaultCurveRange();
this.curveCustomRange = range; this.curveCustomRange = range;
this.curveDialogTitle = `点位曲线 - ${title || pointId}`; this.curveDialogTitle = `鐐逛綅鏇茬嚎 - ${title || pointId}`;
this.curveQuery = { this.curveQuery = {
siteId: this.siteId, siteId: this.siteId,
pointId, pointId,
@ -496,103 +481,17 @@ export default {
return Number.isNaN(num) ? value : num; return Number.isNaN(num) ? value : num;
}, },
getAmmeterSummaryAttr(item) { getAmmeterSummaryAttr(item) {
const fieldCode = String(item?.fieldCode || item?.attr || "").trim(); return String(item?.attr || "").trim();
const fieldName = String(item?.fieldName || item?.title || "").trim(); },
if (["dayChargedCap", "今日充电量kWh"].includes(fieldCode) || fieldName === "今日充电量kWh") { getRunningValueFromApi(item, source = this.runningInfo) {
return "dayChargedCap"; const mappedAttr = this.getAmmeterSummaryAttr(item);
} if (mappedAttr) {
if (["dayDisChargedCap", "今日放电量kWh"].includes(fieldCode) || fieldName === "今日放电量kWh") { return source?.[mappedAttr];
return "dayDisChargedCap";
}
if (["yesterdayChargedCap", "昨日充电量kWh"].includes(fieldCode) || fieldName === "昨日充电量kWh") {
return "yesterdayChargedCap";
}
if (["yesterdayDisChargedCap", "昨日放电量kWh"].includes(fieldCode) || fieldName === "昨日放电量kWh") {
return "yesterdayDisChargedCap";
}
if (["totalChargedCap", "总充电量kWh"].includes(fieldCode) || fieldName === "总充电量kWh") {
return "totalChargedCap";
}
if (["totalDischargedCap", "总放电量kWh"].includes(fieldCode) || fieldName === "总放电量kWh") {
return "totalDischargedCap";
} }
return ""; return "";
}, },
getRunningCardValue(item) { getRunningCardValue(item) {
const summaryAttr = this.getAmmeterSummaryAttr(item); return this.toDisplayNumber(this.getRunningValueFromApi(item));
if (summaryAttr) {
const summaryValue = this.ammeterDailySummary?.[summaryAttr];
if (summaryValue !== undefined && summaryValue !== null && summaryValue !== "") {
return summaryValue;
}
}
const rawValue = item?.fieldValue !== undefined ? item.fieldValue : this.runningInfo?.[item?.attr];
return this.toDisplayNumber(rawValue);
},
queryAllAmmeterDailyRows({ startTime = "", endTime = "", pageSize = 500, pageNum = 1, rows = [] } = {}) {
return getAmmeterData({
siteId: this.siteId,
startTime,
endTime,
pageSize,
pageNum,
}).then((response) => {
const currentRows = Array.isArray(response?.rows) ? response.rows : [];
const allRows = rows.concat(currentRows);
const total = Number(response?.total) || 0;
if (allRows.length >= total || currentRows.length < pageSize) {
return allRows;
}
return this.queryAllAmmeterDailyRows({
startTime,
endTime,
pageSize,
pageNum: pageNum + 1,
rows: allRows,
});
});
},
getAmmeterDailySummary() {
const today = new Date();
const yesterday = new Date(today);
yesterday.setDate(yesterday.getDate() - 1);
const startTime = this.formatDateOnly(yesterday);
const endTime = this.formatDateOnly(today);
return Promise.all([
this.queryAllAmmeterDailyRows({
startTime,
endTime,
pageSize: 20,
pageNum: 1,
}),
this.queryAllAmmeterDailyRows(),
]).then(([recentRows, allRows]) => {
const rowMap = recentRows.reduce((result, row) => {
const dateKey = this.normalizeDateOnly(row?.dataTime);
if (dateKey) {
result[dateKey] = row;
}
return result;
}, {});
const todayKey = this.formatDateOnly(today);
const yesterdayKey = this.formatDateOnly(yesterday);
const todayRow = rowMap[todayKey] || {};
const yesterdayRow = rowMap[yesterdayKey] || {};
const totalChargedCap = allRows.reduce((result, row) => {
return result + (Number(row?.activeTotalKwh) || 0);
}, 0);
const totalDischargedCap = allRows.reduce((result, row) => {
return result + (Number(row?.reActiveTotalKwh) || 0);
}, 0);
return {
dayChargedCap: this.toDisplayNumber(todayRow.activeTotalKwh),
dayDisChargedCap: this.toDisplayNumber(todayRow.reActiveTotalKwh),
yesterdayChargedCap: this.toDisplayNumber(yesterdayRow.activeTotalKwh),
yesterdayDisChargedCap: this.toDisplayNumber(yesterdayRow.reActiveTotalKwh),
totalChargedCap: this.toDisplayNumber(totalChargedCap),
totalDischargedCap: this.toDisplayNumber(totalDischargedCap),
};
}).catch(() => ({}));
}, },
toAlarm() { toAlarm() {
this.$router.push({path: "/dzjk/gzgj", query: this.$route.query}); this.$router.push({path: "/dzjk/gzgj", query: this.$route.query});
@ -607,25 +506,28 @@ export default {
if (!hasOldData) { if (!hasOldData) {
this.setRunningInfoLoading(true); this.setRunningInfoLoading(true);
} }
return Promise.all([ const homeTask = getDzjkHomeRunningData(this.siteId)
getDzjkHomeTotalView(this.siteId), .then((homeResponse) => {
getProjectDisplayData(this.siteId), const nextRunningInfo = homeResponse?.data || {};
this.getAmmeterDailySummary(), const changed = hasOldData && this.hasTotalRunningChanged(nextRunningInfo);
]).then(([homeResponse, displayResponse, ammeterDailySummary]) => { this.runningInfo = nextRunningInfo;
const nextRunningInfo = homeResponse?.data || {}; if (changed) {
const nextRunningDisplayData = displayResponse?.data || []; this.triggerRunningUpdateSpinner();
const changed = hasOldData && this.hasTotalRunningChanged(nextRunningInfo, nextRunningDisplayData, ammeterDailySummary || {}); }
this.runningInfo = nextRunningInfo; })
this.runningDisplayData = nextRunningDisplayData; .finally(() => {
this.ammeterDailySummary = ammeterDailySummary || {}; if (!hasOldData) {
if (changed) { this.setRunningInfoLoading(false);
this.triggerRunningUpdateSpinner(); }
} });
}).finally(() => {
if (!hasOldData) { const displayTask = getProjectDisplayData(this.siteId)
this.setRunningInfoLoading(false); .then((displayResponse) => {
} this.runningDisplayData = displayResponse?.data || [];
}); })
.catch(() => {});
return Promise.allSettled([homeTask, displayTask]);
}, },
triggerRunningUpdateSpinner() { triggerRunningUpdateSpinner() {
if (this.runningUpdateTimer) { if (this.runningUpdateTimer) {
@ -637,32 +539,17 @@ export default {
this.runningUpdateTimer = null; this.runningUpdateTimer = null;
}, 800); }, 800);
}, },
hasTotalRunningChanged(nextRunningInfo, nextRunningDisplayData, nextAmmeterDailySummary = {}) { hasTotalRunningChanged(nextRunningInfo) {
const oldSnapshot = this.getTotalRunningSnapshot(this.runningInfo, this.runningDisplayData, this.ammeterDailySummary || {}); const oldSnapshot = this.getTotalRunningSnapshot(this.runningInfo);
const newSnapshot = this.getTotalRunningSnapshot(nextRunningInfo, nextRunningDisplayData, nextAmmeterDailySummary); const newSnapshot = this.getTotalRunningSnapshot(nextRunningInfo);
return JSON.stringify(oldSnapshot) !== JSON.stringify(newSnapshot); return JSON.stringify(oldSnapshot) !== JSON.stringify(newSnapshot);
}, },
getTotalRunningSnapshot(runningInfo, runningDisplayData, ammeterDailySummary = {}) { getTotalRunningSnapshot(runningInfo) {
const snapshot = {}; const snapshot = {};
const sectionData = (runningDisplayData || []).filter(item => item.sectionName === "总累计运行数据");
if (sectionData.length > 0) {
sectionData.forEach(item => {
const key = item.fieldCode || item.fieldName;
if (!key) return;
const summaryAttr = this.getAmmeterSummaryAttr(item);
const value = summaryAttr ? ammeterDailySummary?.[summaryAttr] : item.fieldValue;
snapshot[`cfg:${key}`] = this.normalizeRunningCompareValue(value);
});
return snapshot;
}
this.fallbackSjglData.forEach(item => { this.fallbackSjglData.forEach(item => {
const summaryAttr = this.getAmmeterSummaryAttr(item); const value = this.getRunningValueFromApi(item, runningInfo);
const value = summaryAttr
? ammeterDailySummary?.[summaryAttr]
: runningInfo?.[item.attr];
snapshot[`fallback:${item.attr}`] = this.normalizeRunningCompareValue(value); snapshot[`fallback:${item.attr}`] = this.normalizeRunningCompareValue(value);
}); });
snapshot["fallback:totalRevenue"] = this.normalizeRunningCompareValue(runningInfo?.totalRevenue);
return snapshot; return snapshot;
}, },
normalizeRunningCompareValue(value) { normalizeRunningCompareValue(value) {
@ -676,10 +563,10 @@ export default {
init() { init() {
// 功率曲线 // 功率曲线
this.$refs.activeChart.init(this.siteId); this.$refs.activeChart.init(this.siteId);
// 一周放曲线 // 一周放曲线
this.$refs.weekChart.init(this.siteId); this.$refs.weekChart.init(this.siteId);
// 静态信息 this.getBaseInfo() // 静态信息 this.getBaseInfo()
// 总累计运行数据+故障告警 this.getRunningInfo() // 总累计运行数据/故障告警 this.getRunningInfo()
Promise.all([this.getBaseInfo(), this.getRunningInfo()]); Promise.all([this.getBaseInfo(), this.getRunningInfo()]);
// 一分钟循环一次总累计运行数据 // 一分钟循环一次总累计运行数据
this.updateInterval(this.getRunningInfo); this.updateInterval(this.getRunningInfo);
@ -689,7 +576,7 @@ export default {
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
//设备告警 //璁惧鍛婅
.alarm-msg { .alarm-msg {
background: #ff4949; background: #ff4949;
padding: 2px 5px; padding: 2px 5px;
@ -705,7 +592,7 @@ export default {
transform: translateY(-50%); transform: translateY(-50%);
} }
//基本信息-地址 运行️时间 //鍩烘湰淇℃伅-鍦板潃 杩愯锔忔椂闂?
.site-info { .site-info {
display: flex; display: flex;
font-size: 12px; font-size: 12px;
@ -732,7 +619,7 @@ export default {
} }
} }
//总收入 //鎬绘敹鍏?
.total-count { .total-count {
position: absolute; position: absolute;
right: 10px; right: 10px;
@ -778,7 +665,7 @@ export default {
} }
} }
//数据概览 //鏁版嵁姒傝
.sjgl-col { .sjgl-col {
.sjgl-wrapper { .sjgl-wrapper {
text-align: left; text-align: left;
@ -839,3 +726,4 @@ export default {
} }
} }
</style> </style>