From fedb183d1123ecceed5d0237f44b7df9a8f5700e Mon Sep 17 00:00:00 2001
From: yyb <995253665@qq.com>
Date: 星期三, 18 三月 2026 17:05:40 +0800
Subject: [PATCH] 能耗成本核算
---
src/views/costAccounting/energyCosts/index.vue | 96 +++++++++++++++++++++++++-----------------------
1 files changed, 50 insertions(+), 46 deletions(-)
diff --git a/src/views/costAccounting/energyCosts/index.vue b/src/views/costAccounting/energyCosts/index.vue
index 655e145..88a9937 100644
--- a/src/views/costAccounting/energyCosts/index.vue
+++ b/src/views/costAccounting/energyCosts/index.vue
@@ -42,7 +42,7 @@
value="姘�" />
</el-select>
</el-form-item> -->
- <el-form-item label="鑳借�楃敤閫�">
+ <!-- <el-form-item label="鑳借�楃敤閫�">
<el-select
v-model="searchForm.type"
placeholder=""
@@ -53,7 +53,7 @@
<el-option label="鐢熶骇" value="鐢熶骇" />
<el-option label="鍔炲叕" value="鍔炲叕" />
</el-select>
- </el-form-item>
+ </el-form-item> -->
<el-form-item label="鏃堕棿鑼冨洿">
<el-date-picker
v-if="statisticsType === 'day'"
@@ -469,19 +469,19 @@
<el-card class="chart-card" shadow="never">
<template #header>
<div class="chart-head">
- <span class="chart-title">鑳借�楀崟浠峰姣�</span>
+ <span class="chart-title">鑳借�楃敤閲忓姣�</span>
<div class="chart-tools" @click.stop>
<button
class="chart-tool"
type="button"
- @click="downloadChart('price', '鑳借�楀崟浠峰姣�')"
+ @click="downloadChart('consumption', '鑳借�楃敤閲忓姣�')"
>
涓嬭浇
</button>
<button
class="chart-tool"
type="button"
- @click="openBigChart('price', '鑳借�楀崟浠峰姣�')"
+ @click="openBigChart('consumption', '鑳借�楃敤閲忓姣�')"
>
澶у浘
</button>
@@ -489,12 +489,12 @@
</div>
</template>
<div
- ref="priceChartWrap"
+ ref="consumptionChartWrap"
class="chart-wrap"
v-loading="tableLoading"
>
<div
- ref="priceChart"
+ ref="consumptionChart"
class="chart-content"
v-show="hasTableData"
></div>
@@ -568,7 +568,7 @@
</template>
<el-table-column type="index" label="搴忓彿" width="60" align="center" />
<el-table-column
- prop="timePeriod"
+ prop="meterReadingDate"
:label="timeColumnLabel"
align="center"
sortable="custom"
@@ -681,7 +681,7 @@
// 鎼滅储琛ㄥ崟
const searchForm = reactive({
// energyType: "",
- type: "",
+ // type: "",
dateRange: (() => {
// 榛樿鏈�杩�7澶�
const end = new Date();
@@ -774,7 +774,7 @@
const rows = Array.isArray(tableData.value) ? tableData.value : [];
const byTime = new Map();
for (const r of rows) {
- const t = r?.timePeriod ?? "";
+ const t = r?.meterReadingDate ?? "";
if (!t) continue;
if (!byTime.has(t)) byTime.set(t, { total: 0, production: 0, office: 0 });
const bucket = byTime.get(t);
@@ -875,13 +875,13 @@
if (key === "cost") return costChartInstance;
if (key === "type") return typeChartInstance;
if (key === "purpose") return purposeChartInstance;
- if (key === "price") return priceChartInstance;
+ if (key === "consumption") return consumptionChartInstance;
return null;
};
const ensurePanelForChart = (key) => {
if (key === "cost" || key === "type") chartPanel.value = "core";
- if (key === "purpose" || key === "price") chartPanel.value = "advanced";
+ if (key === "purpose" || key === "consumption") chartPanel.value = "advanced";
};
const downloadChart = (key, title) => {
@@ -1011,12 +1011,12 @@
const costChart = ref(null);
const typeChart = ref(null);
const purposeChart = ref(null);
-const priceChart = ref(null);
+const consumptionChart = ref(null);
const costChartWrap = ref(null);
const typeChartWrap = ref(null);
const purposeChartWrap = ref(null);
-const priceChartWrap = ref(null);
+const consumptionChartWrap = ref(null);
const tableAnchor = ref(null);
@@ -1044,7 +1044,7 @@
let costChartInstance = null;
let typeChartInstance = null;
let purposeChartInstance = null;
-let priceChartInstance = null;
+let consumptionChartInstance = null;
// 鍥捐〃鍖哄垏鎹細core | advanced | none锛堢偣鍑诲綋鍓嶉�変腑鍙敹璧凤級
const chartPanel = ref("core");
@@ -1062,10 +1062,10 @@
if (panel === "advanced") {
if (purposeChart.value && !purposeChartInstance)
purposeChartInstance = echarts.init(purposeChart.value);
- if (priceChart.value && !priceChartInstance)
- priceChartInstance = echarts.init(priceChart.value);
+ if (consumptionChart.value && !consumptionChartInstance)
+ consumptionChartInstance = echarts.init(consumptionChart.value);
if (purposeChartInstance) updatePurposeChart();
- if (priceChartInstance) updatePriceChart();
+ if (consumptionChartInstance) updateConsumptionChart();
}
};
@@ -1137,7 +1137,7 @@
},
xAxis: {
type: "category",
- data: data.map((item) => item.timePeriod),
+ data: data.map((item) => item.meterReadingDate),
axisLabel: {
rotate: statisticsType.value === "day" ? 45 : 0,
color: "rgba(15, 23, 42, 0.62)",
@@ -1331,26 +1331,32 @@
purposeChartInstance.setOption(option);
};
-// 鏇存柊鑳借�楀崟浠峰姣斿浘
-const updatePriceChart = () => {
+// 鏇存柊鑳借�楃敤閲忓姣斿浘
+const updateConsumptionChart = () => {
const data = tableData.value;
- const priceData = {};
+ const consumptionData = {};
data.forEach((item) => {
- if (!priceData[item.energyType]) {
- priceData[item.energyType] = {
+ if (!consumptionData[item.energyType]) {
+ consumptionData[item.energyType] = {
鐢熶骇: 0,
鍔炲叕: 0,
};
}
- if (priceData[item.energyType].hasOwnProperty(item.type)) {
- priceData[item.energyType][item.type] = parseFloat(item.price);
+ if (consumptionData[item.energyType].hasOwnProperty(item.type)) {
+ consumptionData[item.energyType][item.type] = parseFloat(
+ item.consumption
+ );
}
});
- const energyTypes = Object.keys(priceData);
- const productionPrices = energyTypes.map((type) => priceData[type].鐢熶骇);
- const officePrices = energyTypes.map((type) => priceData[type].鍔炲叕);
+ const energyTypes = Object.keys(consumptionData);
+ const productionConsumptions = energyTypes.map(
+ (type) => consumptionData[type].鐢熶骇
+ );
+ const officeConsumptions = energyTypes.map(
+ (type) => consumptionData[type].鍔炲叕
+ );
const option = {
tooltip: {
@@ -1364,7 +1370,7 @@
"box-shadow: 0 14px 40px rgba(15,23,42,.14); border-radius: 12px;",
},
legend: {
- data: ["鐢熶骇鑳借�楀崟浠�", "鍔炲叕鑳借�楀崟浠�"],
+ data: ["鐢熶骇鑳借�楃敤閲�", "鍔炲叕鑳借�楃敤閲�"],
top: 0,
right: 10,
textStyle: { color: "rgba(15, 23, 42, 0.62)" },
@@ -1385,7 +1391,7 @@
},
yAxis: {
type: "value",
- name: "鍗曚环(鍏�)",
+ name: "鐢ㄩ噺",
nameTextStyle: { color: "rgba(15, 23, 42, 0.58)" },
axisLabel: { color: "rgba(15, 23, 42, 0.58)" },
axisLine: { show: false },
@@ -1393,9 +1399,9 @@
},
series: [
{
- name: "鐢熶骇鑳借�楀崟浠�",
+ name: "鐢熶骇鑳借�楃敤閲�",
type: "bar",
- data: productionPrices,
+ data: productionConsumptions,
itemStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{ offset: 0, color: "#2f6fed" },
@@ -1405,9 +1411,9 @@
},
},
{
- name: "鍔炲叕鑳借�楀崟浠�",
+ name: "鍔炲叕鑳借�楃敤閲�",
type: "bar",
- data: officePrices,
+ data: officeConsumptions,
itemStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{ offset: 0, color: "#16a34a" },
@@ -1418,7 +1424,7 @@
},
],
};
- priceChartInstance.setOption(option);
+ consumptionChartInstance.setOption(option);
};
// 缁熻缁村害鍒囨崲
@@ -1457,7 +1463,7 @@
const params = {
days: 0,
// energyType: searchForm.energyType || undefined,
- type: searchForm.type || undefined,
+ // type: searchForm.type || undefined,
pageNum: page.current,
pageSize: page.size,
};
@@ -1509,10 +1515,10 @@
.then((res) => {
if (res.code === 200) {
const data = res.data;
- overview.totalConsumption = data.totalEnergyConsumption || "0";
- overview.totalAmount = data.totalEnergyCost || "0";
- overview.avgConsumption = data.averageConsumption || "0";
- overview.compareRate = data.changeVite || 0;
+ overview.totalCost = data.totalEnergyConsumption || "0";
+ overview.productionCost = data.totalEnergyCost || "0";
+ overview.avgCost = data.averageConsumption || "0";
+ overview.officeCost = data.changeVite || 0;
// 澶勭悊琛ㄦ牸鏁版嵁
tableData.value = data.energyCostDtos || [];
@@ -1528,8 +1534,6 @@
}
})
.catch((err) => {
- console.error("鑾峰彇鏁版嵁寮傚父锛�", err);
- // 銆愬亣鏁版嵁锛圡ock锛夊凡绂佺敤銆戞帴鍙ｅ紓甯告椂涓嶅啀鐢熸垚闅忔満鍋囨暟鎹紝閬垮厤璇敤鍒扮敓浜ф暟鎹摼璺�
ElMessage.error("鑾峰彇鏁版嵁寮傚父");
tableData.value = [];
page.total = 0;
@@ -1550,7 +1554,7 @@
if (costChartInstance) updateCostChart();
if (typeChartInstance) updateTypeChart();
if (purposeChartInstance) updatePurposeChart();
- if (priceChartInstance) updatePriceChart();
+ if (consumptionChartInstance) updateConsumptionChart();
});
};
@@ -1602,7 +1606,7 @@
costChartInstance && costChartInstance.resize();
typeChartInstance && typeChartInstance.resize();
purposeChartInstance && purposeChartInstance.resize();
- priceChartInstance && priceChartInstance.resize();
+ consumptionChartInstance && consumptionChartInstance.resize();
};
onMounted(() => {
@@ -1717,7 +1721,7 @@
}
.filter-form {
- flex: 1 1 auto;
+ flex: 0.1 1 auto;
min-width: 0;
}
--
Gitblit v1.9.3