diff --git a/components.d.ts b/components.d.ts index 522d612..99c46df 100644 --- a/components.d.ts +++ b/components.d.ts @@ -22,7 +22,6 @@ declare module 'vue' { ElMenuItem: typeof import('element-plus/es')['ElMenuItem'] ElRow: typeof import('element-plus/es')['ElRow'] ElStatistic: typeof import('element-plus/es')['ElStatistic'] - ElSubMenu: typeof import('element-plus/es')['ElSubMenu'] EnergyBar: typeof import('./src/components/EnergyBar.vue')['default'] EnergyLine: typeof import('./src/components/EnergyLine.vue')['default'] EnergyPie: typeof import('./src/components/EnergyPie.vue')['default'] diff --git a/package-lock.json b/package-lock.json index 1b70699..dddb11d 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,6 +8,7 @@ "name": "ems_front", "version": "0.0.0", "dependencies": { + "axios": "^1.9.0", "dayjs": "^1.11.13", "echarts": "^5.6.0", "element-plus": "^2.9.6", @@ -1318,6 +1319,30 @@ "resolved": "https://registry.npmjs.org/aws4/-/aws4-1.13.2.tgz", "integrity": "sha512-lHe62zvbTB5eEABUVi/AwVh0ZKY9rMMDhmm+eeyuuUQbQ3+J+fONVQOZyj+DdrvD4BY33uYniyRJ4UJIaSKAfw==" }, + "node_modules/axios": { + "version": "1.9.0", + "resolved": "https://registry.npmjs.org/axios/-/axios-1.9.0.tgz", + "integrity": "sha512-re4CqKTJaURpzbLHtIi6XpDv20/CnpXOtjRY5/CU32L8gU8ek9UIivcfvSWvmKEngmVbrUtPpdDwWDWL7DNHvg==", + "dependencies": { + "follow-redirects": "^1.15.6", + "form-data": "^4.0.0", + "proxy-from-env": "^1.1.0" + } + }, + "node_modules/axios/node_modules/form-data": { + "version": "4.0.2", + "resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.2.tgz", + "integrity": "sha512-hGfm/slu0ZabnNt4oaRZ6uREyfCj6P4fT/n6A1rGV+Z0VdGXjfOhVUpkn6qVQONHGIFwmveGXyDs75+nr6FM8w==", + "dependencies": { + "asynckit": "^0.4.0", + "combined-stream": "^1.0.8", + "es-set-tostringtag": "^2.1.0", + "mime-types": "^2.1.12" + }, + "engines": { + "node": ">= 6" + } + }, "node_modules/balanced-match": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz", @@ -1391,6 +1416,18 @@ "integrity": "sha512-7VPMEPuYznPSoR21NE1zvd2Xna6c/CloiZCfcMXR1Jny6PjX0N4Nsa38zcBFo/FMK+BlA+FLKbJCQ0i2yxp+Xg==", "dev": true }, + "node_modules/call-bind-apply-helpers": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/call-bind-apply-helpers/-/call-bind-apply-helpers-1.0.2.tgz", + "integrity": "sha512-Sp1ablJ0ivDkSzjcaJdxEunN5/XvksFJ2sMBFfq6x0ryhQV/2b/KwFe21cMpmHtPOSij8K99/wSfoEuTObmuMQ==", + "dependencies": { + "es-errors": "^1.3.0", + "function-bind": "^1.1.2" + }, + "engines": { + "node": ">= 0.4" + } + }, "node_modules/canvg": { "version": "1.5.3", "resolved": "https://registry.npmjs.org/canvg/-/canvg-1.5.3.tgz", @@ -1561,6 +1598,19 @@ "node": ">=0.4.0" } }, + "node_modules/dunder-proto": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/dunder-proto/-/dunder-proto-1.0.1.tgz", + "integrity": "sha512-KIN/nDJBQRcXw0MLVhZE9iQHmG68qAVIBg9CqmUYjmQIhgij9U5MFvrqkUL5FbtyyzZuOeOt0zdeRe4UY7ct+A==", + "dependencies": { + "call-bind-apply-helpers": "^1.0.1", + "es-errors": "^1.3.0", + "gopd": "^1.2.0" + }, + "engines": { + "node": ">= 0.4" + } + }, "node_modules/ecc-jsbn": { "version": "0.1.2", "resolved": "https://registry.npmjs.org/ecc-jsbn/-/ecc-jsbn-0.1.2.tgz", @@ -1618,6 +1668,47 @@ "url": "https://github.com/fb55/entities?sponsor=1" } }, + "node_modules/es-define-property": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/es-define-property/-/es-define-property-1.0.1.tgz", + "integrity": "sha512-e3nRfgfUZ4rNGL232gUgX06QNyyez04KdjFrF+LTRoOXmrOgFKDg4BCdsjW8EnT69eqdYGmRpJwiPVYNrCaW3g==", + "engines": { + "node": ">= 0.4" + } + }, + "node_modules/es-errors": { + "version": "1.3.0", + "resolved": "https://registry.npmjs.org/es-errors/-/es-errors-1.3.0.tgz", + "integrity": "sha512-Zf5H2Kxt2xjTvbJvP2ZWLEICxA6j+hAmMzIlypy4xcBg1vKVnx89Wy0GbS+kf5cwCVFFzdCFh2XSCFNULS6csw==", + "engines": { + "node": ">= 0.4" + } + }, + "node_modules/es-object-atoms": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/es-object-atoms/-/es-object-atoms-1.1.1.tgz", + "integrity": "sha512-FGgH2h8zKNim9ljj7dankFPcICIK9Cp5bm+c2gQSYePhpaG5+esrLODihIorn+Pe6FGJzWhXQotPv73jTaldXA==", + "dependencies": { + "es-errors": "^1.3.0" + }, + "engines": { + "node": ">= 0.4" + } + }, + "node_modules/es-set-tostringtag": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/es-set-tostringtag/-/es-set-tostringtag-2.1.0.tgz", + "integrity": "sha512-j6vWzfrGVfyXxge+O0x5sh6cvxAog0a/4Rdd2K36zCMV5eJ+/+tOAngRO8cODMNWbVRdVlmGZQL2YS3yR8bIUA==", + "dependencies": { + "es-errors": "^1.3.0", + "get-intrinsic": "^1.2.6", + "has-tostringtag": "^1.0.2", + "hasown": "^2.0.2" + }, + "engines": { + "node": ">= 0.4" + } + }, "node_modules/es6-promise": { "version": "4.2.8", "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.2.8.tgz", @@ -1806,6 +1897,25 @@ "node": ">=8" } }, + "node_modules/follow-redirects": { + "version": "1.15.9", + "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.9.tgz", + "integrity": "sha512-gew4GsXizNgdoRyqmyfMHyAmXsZDk6mHkSxZFCzW9gwlbtOW44CDtYavM+y+72qD/Vq2l550kMF52DT8fOLJqQ==", + "funding": [ + { + "type": "individual", + "url": "https://github.com/sponsors/RubenVerborgh" + } + ], + "engines": { + "node": ">=4.0" + }, + "peerDependenciesMeta": { + "debug": { + "optional": true + } + } + }, "node_modules/forever-agent": { "version": "0.6.1", "resolved": "https://registry.npmjs.org/forever-agent/-/forever-agent-0.6.1.tgz", @@ -1842,6 +1952,49 @@ "node": "^8.16.0 || ^10.6.0 || >=11.0.0" } }, + "node_modules/function-bind": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz", + "integrity": "sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==", + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/get-intrinsic": { + "version": "1.3.0", + "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.3.0.tgz", + "integrity": "sha512-9fSjSaos/fRIVIp+xSJlE6lfwhES7LNtKaCBIamHsjr2na1BiABJPo0mOjjz8GJDURarmCPGqaiVg5mfjb98CQ==", + "dependencies": { + "call-bind-apply-helpers": "^1.0.2", + "es-define-property": "^1.0.1", + "es-errors": "^1.3.0", + "es-object-atoms": "^1.1.1", + "function-bind": "^1.1.2", + "get-proto": "^1.0.1", + "gopd": "^1.2.0", + "has-symbols": "^1.1.0", + "hasown": "^2.0.2", + "math-intrinsics": "^1.1.0" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/get-proto": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/get-proto/-/get-proto-1.0.1.tgz", + "integrity": "sha512-sTSfBjoXBp89JvIKIefqw7U2CCebsc74kiY6awiGogKtoSGbgjYE/G/+l9sF3MWFPNc9IcoOC4ODfKHfxFmp0g==", + "dependencies": { + "dunder-proto": "^1.0.1", + "es-object-atoms": "^1.0.0" + }, + "engines": { + "node": ">= 0.4" + } + }, "node_modules/getpass": { "version": "0.1.7", "resolved": "https://registry.npmjs.org/getpass/-/getpass-0.1.7.tgz", @@ -1863,6 +2016,17 @@ "node": ">= 6" } }, + "node_modules/gopd": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/gopd/-/gopd-1.2.0.tgz", + "integrity": "sha512-ZUKRh6/kUFoAiTAtTYPZJ3hw9wNxx+BIBOijnlG9PnrJsCcSjs1wyyD6vJpaYtgnzDrKYRSqf3OO6Rfa93xsRg==", + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/har-schema": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/har-schema/-/har-schema-2.0.0.tgz", @@ -1893,6 +2057,42 @@ "node": ">=8" } }, + "node_modules/has-symbols": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.1.0.tgz", + "integrity": "sha512-1cDNdwJ2Jaohmb3sg4OmKaMBwuC48sYni5HUw2DvsC8LjGTLK9h+eb1X6RyuOHe4hT0ULCW68iomhjUoKUqlPQ==", + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/has-tostringtag": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/has-tostringtag/-/has-tostringtag-1.0.2.tgz", + "integrity": "sha512-NqADB8VjPFLM2V0VvHUewwwsw0ZWBaIdgo+ieHtK3hasLz4qeCRjYcqfB6AQrBggRKppKF8L52/VqdVsO47Dlw==", + "dependencies": { + "has-symbols": "^1.0.3" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/hasown": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.2.tgz", + "integrity": "sha512-0hJU9SCPvmMzIBdZFqNPXWa6dqh7WdH0cII9y+CyS8rG3nL48Bclra9HmKhVVUHyPWNH5Y7xDwAB7bfgSjkUMQ==", + "dependencies": { + "function-bind": "^1.1.2" + }, + "engines": { + "node": ">= 0.4" + } + }, "node_modules/he": { "version": "1.2.0", "resolved": "https://registry.npmjs.org/he/-/he-1.2.0.tgz", @@ -2178,6 +2378,14 @@ "@jridgewell/sourcemap-codec": "^1.5.0" } }, + "node_modules/math-intrinsics": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/math-intrinsics/-/math-intrinsics-1.1.0.tgz", + "integrity": "sha512-/IXtbwEk5HTPyEwyKX6hGkYXxM9nbj64B+ilVJnC/R6B0pH5G4V3b0pVbL7DBj4tkhBAppbQUlf6F6Xl9LHu1g==", + "engines": { + "node": ">= 0.4" + } + }, "node_modules/memoize-one": { "version": "6.0.0", "resolved": "https://registry.npmjs.org/memoize-one/-/memoize-one-6.0.0.tgz", @@ -2462,6 +2670,11 @@ "node": ">= 0.8.0" } }, + "node_modules/proxy-from-env": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-1.1.0.tgz", + "integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==" + }, "node_modules/psl": { "version": "1.15.0", "resolved": "https://registry.npmjs.org/psl/-/psl-1.15.0.tgz", diff --git a/package.json b/package.json index ec212c7..992594e 100644 --- a/package.json +++ b/package.json @@ -9,6 +9,7 @@ "preview": "vite preview" }, "dependencies": { + "axios": "^1.9.0", "dayjs": "^1.11.13", "echarts": "^5.6.0", "element-plus": "^2.9.6", diff --git a/src/components/EnergyLine.vue b/src/components/EnergyLine.vue index 2429ddb..4fac865 100644 --- a/src/components/EnergyLine.vue +++ b/src/components/EnergyLine.vue @@ -170,8 +170,6 @@ watch( onMounted(async () => { // 等待數據加載 await storeDemand.getElecDemandFromBaja(); - // 測試 - await storeDemand.getElecDatatTestBaja(); // 初始化圖表 chartInstance = echarts.init(demand_chart.value); chartInstance.setOption(chartOption.value); diff --git a/src/components/Navbar.vue b/src/components/Navbar.vue index 65547c8..7bf0e31 100644 --- a/src/components/Navbar.vue +++ b/src/components/Navbar.vue @@ -6,11 +6,7 @@ @select="handleSelect" > 能源圖表 - - - 住宅型 - 標準型 - + 電價表 能源報表 @@ -29,13 +25,9 @@ const handleSelect = (key: string, keyPath: string[]) => { router.push({ name: "EnergyChart" }); activeIndex.value = "chart"; break; - case "elecPricingSimple": - router.push({ name: "ElecPricingSimple" }); - activeIndex.value = "elecPricingSimple"; - break; - case "elecPricingStandard": - router.push({ name: "ElecPricingStandard" }); - activeIndex.value = "elecPricingStandard"; + case "elecPricing": + router.push({ name: "elecPricing" }); + activeIndex.value = "elecPricing"; break; case "monthlyReport": router.push({ name: "monthlyReport" }); diff --git a/src/router/index.ts b/src/router/index.ts index 0f85604..839e528 100644 --- a/src/router/index.ts +++ b/src/router/index.ts @@ -13,14 +13,9 @@ const routes: Array = [ component: () => import("../views/EnergyChart.vue"), }, { - path: "elecPricingSimple", - name: "ElecPricingSimple", - component: () => import("../views/ElecPriceRes.vue"), - }, - { - path: "elecPricingStandard", - name: "ElecPricingStandard", - component: () => import("../views/ElecPriceStd.vue"), + path: "elecPricing", + name: "elecPricing", + component: () => import("../views/EnergyPricing.vue"), }, { path: "monthlyReport", diff --git a/src/stores/useElecDemandStore.ts b/src/stores/useElecDemandStore.ts index 2a2cb8a..7dae1fb 100644 --- a/src/stores/useElecDemandStore.ts +++ b/src/stores/useElecDemandStore.ts @@ -14,20 +14,16 @@ const useElecDemandStore = defineStore("elecDemand", () => { window.requirejs(["baja!"], (baja: any) => { let eleclist: NiagaraElecDemandData[] = []; baja.Ord.make( - `local:|foxs:4912|station:|neql:EMS:kw|bql:select slotPath,parent.displayName,name` + `local:|foxs:4918|station:|neql:EMS:kw|bql:select slotPath,parent.displayName,name,out` ).get({ cursor: { before: () => {}, each: (record: any) => { - const slotPath = record.get("slotPath"); - const displayName = record.get("parent$2edisplayName"); - const name = record.get("name"); - const newItem: NiagaraElecDemandData = { - slotPath: slotPath, - displayName: displayName, - name: name, - out: 0, + slotPath: record.get("slotPath"), + displayName: record.get("parent$2edisplayName"), + name: record.get("name"), + out: record.get("out")?.get("value") ?? 0, }; eleclist.push(newItem); }, @@ -45,7 +41,7 @@ const useElecDemandStore = defineStore("elecDemand", () => { const subscribeToHistory = (item: NiagaraElecDemandData, index: number) => { const slotPath = item.slotPath; - const ordString = `local:|foxs:4912|station:|${slotPath}`; + const ordString = `local:|foxs:4918|station:|${slotPath}`; // @ts-ignore window.require && @@ -67,12 +63,7 @@ const useElecDemandStore = defineStore("elecDemand", () => { ); if (updatedIndex !== -1) { - const newElecData = [...elecData.value]; - newElecData[updatedIndex] = { - ...newElecData[updatedIndex], - out: Number(newValue), - }; - elecData.value = newElecData; + elecData.value[updatedIndex].out = Number(newValue); console.log(`Niagara 用電需求 ${item.name} 更新:`, newValue); } } @@ -106,34 +97,10 @@ const useElecDemandStore = defineStore("elecDemand", () => { console.log("所有訂閱已清除"); }; - // 測試 - const getElecDatatTestBaja = () => { - // @ts-ignore - window.require && - // @ts-ignore - window.requirejs(["baja!"], (baja: any) => { - console.log("進入 bajaSubscriber 準備執行 BQL 訂閱"); - baja.Ord.make( - `local:|foxs:4918|history:/testStation_MJM/MGCB_KWH?period=timerange;start=2025-04-20T00:00:00.000+08:00;end=2025-04-21T00:00:00.000+08:00|bql:history:HistoryRollup.rollup(baja:RelTime '3600000')` - ).get({ - cursor: { - before: () => {}, - each: (record: any) => { - console.log("recordtest", record); - }, - after: () => {}, - limit: -1, - offset: 0, - }, - }); - }); - }; - return { getElecDemandFromBaja, elecData, - clearAllSubscriber, - getElecDatatTestBaja, + clearAllSubscriber }; }); diff --git a/src/stores/useElecPriceStore.ts b/src/stores/useElecPriceStore.ts new file mode 100644 index 0000000..a362c19 --- /dev/null +++ b/src/stores/useElecPriceStore.ts @@ -0,0 +1,120 @@ +import { ref } from "vue"; +import { defineStore } from "pinia"; +import type { NiagaraElecData } from "../utils/types"; + +const useElecPriceStore = defineStore("elecPriceData", () => { + const elecData = ref([]); + const subscribers = ref([]); + + // get data from baja + const getElecDataFromBaja = () => { + // @ts-ignore + window.require && + // @ts-ignore + window.requirejs(["baja!"], (baja: any) => { + console.log("進入 bajaSubscriber 準備執行 BQL 訂閱"); + + // 定義BQL 查詢 + const Total_kwhBql = `local:|foxs:4918|station:|neql:EMS:parameter|bql:select slotPath,parent.displayName,displayName,NumericInterval.historyConfig.id,out`; + + // 執行查詢 + fetchElecData(baja, Total_kwhBql); + }); + }; + + const fetchElecData = (baja: any, bql: string) => { + let eleclist: NiagaraElecData[] = []; + baja.Ord.make(bql).get({ + cursor: { + before: () => {}, + each: (record: any) => { + eleclist.push({ + slotPath: record.get("slotPath"), + displayName: record.get("displayName"), + id: record.get("NumericInterval$2ehistoryConfig$2eid").$cEncStr, + out: record.get("out")?.get("value") ?? 0, + }); + }, + after: () => { + elecData.value = []; + elecData.value.push(...eleclist); + elecData.value.forEach((item, index) => { + subscribeToCost(item, index); + }); + }, + limit: -1, + offset: 0, + }, + }); + }; + + const subscribeToCost = (item: NiagaraElecData, index: number) => { + const slotPath = item.slotPath; + const ordString = `local:|foxs:4918|station:|${slotPath}`; + + // @ts-ignore + window.require && + // @ts-ignore + window.requirejs(["baja!"], (baja: any) => { + // 建立訂閱器 + const subscriber = new baja.Subscriber(); + + // 定義 changed 事件的處理函數 + subscriber.attach("changed", (prop: any) => { + try { + if (prop && prop.getName() === "out") { + // 取得 out 的新值 + const match = prop.$display.match(/^(\d+(\.\d+)?)/); + const newValue = match ? parseFloat(match[0]) : 0; + // 更新 elecData 中對應的 out 值 + const updatedIndex = elecData.value.findIndex( + (data) => data.slotPath === item.slotPath + ); + + if (updatedIndex !== -1) { + elecData.value[updatedIndex].out = Number(newValue); + console.log(`電價表更新 ${item.displayName} 更新:`, newValue); + } + } + } catch (error: any) { + console.error( + `處理 ${item.displayName || index} 電價表變化失敗: ${ + error.message + }`, + error + ); + } + }); + + baja.Ord.make(ordString) + .get({ subscriber }) + .then(() => { + console.log(`Successfuly subscribed to ${item.displayName}`); + }) + .catch((err: any) => { + console.error( + `訂閱 ${item.displayName || index} 失敗: ${err.message}` + ); + subscriber.detach("changed"); // 移除事件監聽器 + }); + subscribers.value.push(subscriber); + }); + }; + + const clearAllSubscriber = () => { + subscribers.value.forEach((subscriber) => { + subscriber.detach("changed"); + subscriber.unsubscribeAll(); // 移除所有訂閱 + }); + subscribers.value = []; + console.log("所有訂閱已清除"); + }; + + return { + getElecDataFromBaja, + clearAllSubscriber, + elecData, + }; +}); + +export default useElecPriceStore; diff --git a/src/utils/CalcuEleCost.ts b/src/utils/CalcuEleCost.ts new file mode 100644 index 0000000..e69de29 diff --git a/src/utils/types.ts b/src/utils/types.ts index 0362142..3d62def 100644 --- a/src/utils/types.ts +++ b/src/utils/types.ts @@ -11,4 +11,33 @@ export interface NiagaraElecDemandData { displayName: string; name: string; out: number; +} + +export interface DailyResult { + dateStr: string; + off: number; + half: number; + peak: number; + offcost:number; + halfcost:number; + peakcost:number; + dailyEleCost: number; + dailyFlowCost: number; +} + +export interface ElecCostSummary { + dailyResults: DailyResult[]; + totalEleCost: number; + totalFlowCost: number; + total_Off: number; + total_half: number; + total_peak: number; + total_OffCost: number; + total_halfCost: number; + total_peakCost: number; +} + +export interface DailyEntry { + time: Date; + value: number; } \ No newline at end of file diff --git a/src/views/EnergyPricing.vue b/src/views/EnergyPricing.vue new file mode 100644 index 0000000..1381746 --- /dev/null +++ b/src/views/EnergyPricing.vue @@ -0,0 +1,543 @@ + + + + + \ No newline at end of file diff --git a/src/views/Home.vue b/src/views/Home.vue index 3506684..6284fa2 100644 --- a/src/views/Home.vue +++ b/src/views/Home.vue @@ -8,7 +8,19 @@