diff --git a/src/views/energyManagement/components/ImmediateDemandChart.vue b/src/views/energyManagement/components/ImmediateDemandChart.vue
index 02c007f..c2f6ac3 100644
--- a/src/views/energyManagement/components/ImmediateDemandChart.vue
+++ b/src/views/energyManagement/components/ImmediateDemandChart.vue
@@ -66,21 +66,35 @@ watch(
() => elecDay_data.value,
(newData) => {
if (newData.length > 0) {
+ // 將資料依時間排序(假設 time 欄位格式為 YYYY-MM-DD HH:mm:ss)
+ const sortedData = [...newData].sort(
+ (a, b) => new Date(a.time) - new Date(b.time)
+ );
+
+ // 取出最近 7 筆(假設資料為每天一筆)
+ const recent7Data = sortedData.slice(-7);
+
const categories = [];
const seriesData = [];
- newData.forEach((item) => {
- categories.push(item.time.split(" ")[0]);
- const dailyUsage =(item.degreePeak + item.degreeHalfPeak + item.degreeOffPeak).toFixed(1);
+ recent7Data.forEach((item) => {
+ categories.push(item.time.split(" ")[0]); // 取日期部分當 x 軸刻度
+ const dailyUsage = (
+ item.degreePeak +
+ item.degreeHalfPeak +
+ item.degreeOffPeak
+ ).toFixed(1);
seriesData.push(dailyUsage);
});
+
+ // 更新圖表資料
demand_chart.value.chart.setOption({
xAxis: {
data: categories,
},
- series:{
+ series: {
data: seriesData,
- }
+ },
});
todayUsage.value = seriesData[seriesData.length - 1];
@@ -98,7 +112,7 @@ watch(
>
- {{$t("energy.latest_elec_consumption")}}
+ {{ $t("energy.latest_elec_consumption") }}
{{ todayUsage }} kWh
{
watch(
() => elecMonth_data.value,
(newData) => {
+ // 🔍 Log 1:整個資料
+ console.log("📦 elecMonth_data 原始資料:", newData);
+ const latestData = newData[newData.length - 1];
+ // 🔍 Log 2:最新一筆資料
+ console.log("🧾 latestData(用於 IntervalElecBills 的來源):", latestData);
+
+ // 🔍 Log 3:各段電費
+ console.log("💰 各時段費用:", {
+ costPeak: latestData.costPeak,
+ costHalfPeak: latestData.costHalfPeak,
+ costOffPeak: latestData.costOffPeak,
+ costBase: latestData.costBase,
+ });
+
+ // 🔍 Log 4:總電費計算(原始值)
+ const rawIntervalElec =
+ latestData.costPeak +
+ latestData.costHalfPeak +
+ latestData.costOffPeak +
+ latestData.costBase;
+ console.log("💵 IntervalElecBills 原始總額(未格式化):", rawIntervalElec);
+
// 計算總電費與用電度數
totalElecBills.value = newData
.reduce((sum, item) => {
@@ -36,7 +58,7 @@ watch(
.replace(/\B(?=(\d{3})+(?!\d))/g, ",");
// 計算區間電費與用電度數,取最新一筆數據
- const latestData = newData[newData.length - 1];
+
IntervalElecBills.value = (
latestData.costPeak +
latestData.costHalfPeak +
@@ -52,12 +74,15 @@ watch(
)
.toFixed(2)
.replace(/\B(?=(\d{3})+(?!\d))/g, ",");
- const monthDays = latestData.time ? daysInMonth(latestData.time) : 0;
+ const today = new Date();
+ const todayStr = today.toISOString().split("T")[0];
IntervalDate.value = latestData.time
- ? `${latestData.time}-01~${latestData.time}-${monthDays}`
+ ? `${latestData.time}-01 ~ ${todayStr}`
: "";
- totalDate.value = `${newData[0].time}-01 ~ ${latestData.time}-${monthDays}`;
+ // totalDate 還是顯示從 1 月 1 日起
+ const startYear = newData[0]?.time?.split("-")[0] ?? "";
+ totalDate.value = startYear ? `${startYear}-01-01 ~ ${todayStr}` : "";
},
{ deep: true }
);