From c92dee5213400b0656dcbb49939ebd83a7931e76 Mon Sep 17 00:00:00 2001 From: "MJM_2025_05\\polly" Date: Tue, 26 Aug 2025 16:58:51 +0800 Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E6=AD=A3=E5=B9=B3=E9=9D=A2?= =?UTF-8?q?=E5=9C=96=E8=88=87=E9=BB=9E=E4=BD=8D=E9=A1=AF=E7=A4=BA=E9=A0=86?= =?UTF-8?q?=E5=BA=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/router/index.js | 43 +++++++---- .../components/DashboardEffectScatter.vue | 77 +++++++++---------- .../components/DashboardEmission.vue | 2 - 3 files changed, 64 insertions(+), 58 deletions(-) diff --git a/src/router/index.js b/src/router/index.js index 49db595..290953e 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -79,38 +79,49 @@ const router = createRouter({ ], }); -router.beforeEach(async (to, from, next) => { +router.beforeEach((to, from, next) => { console.log("route", to, location, document.cookie); - // redirect to login page if not logged in and trying to access a restricted page const publicPages = ["/login", "/"]; - const authRequired = !publicPages.includes(to.path); + const requiresAuth = !publicPages.includes(to.path); + const auth = useUserInfoStore(); const token = useGetCookie("JWT-Authorization"); const user_name = useGetCookie("user_name"); + // 處理 /logout if (to.path === "/logout") { - document.cookie = "JWT-Authorization=; Max-Age=0"; - document.cookie = "user_name=; Max-Age=0"; + // 清除 cookie(建議補 Path 與 SameSite) + document.cookie = "JWT-Authorization=; Max-Age=0; Path=/"; + document.cookie = "user_name=; Max-Age=0; Path=/"; + + // 清除狀態 auth.user.token = ""; auth.user.user_name = ""; localStorage.removeItem("EmpowerBuilding"); - window.location.reload(); - next({ path: "/login" }); + + // 直接導回登入(避免 reload 與 next() 交疊) + return next({ path: "/login", replace: true }); } - if ((authRequired && !token) || to.path === "/") { + // 未登入:擋住受保護頁 + if (requiresAuth && !token) { auth.user.token = ""; - next({ path: "/login" }); - } else if (!authRequired) { - document.cookie = "JWT-Authorization=; Max-Age=0"; - document.cookie = "user_name=; Max-Age=0"; + return next({ path: "/login", replace: true }); + } + + // 進公開頁(例如 /login):清掉使用者狀態(若你想保留語系就不要清) + if (!requiresAuth) { + document.cookie = "JWT-Authorization=; Max-Age=0; Path=/"; + document.cookie = "user_name=; Max-Age=0; Path=/"; auth.user.token = ""; auth.user.user_name = ""; - } else { - auth.user.token = token; - auth.user.user_name = user_name; + return next(); } - next(); + + // 受保護頁且有 token:同步 Pinia 狀態 + auth.user.token = token; + auth.user.user_name = user_name; + return next(); }); export default router; diff --git a/src/views/dashboard/components/DashboardEffectScatter.vue b/src/views/dashboard/components/DashboardEffectScatter.vue index dc3a4f6..1425032 100644 --- a/src/views/dashboard/components/DashboardEffectScatter.vue +++ b/src/views/dashboard/components/DashboardEffectScatter.vue @@ -4,7 +4,6 @@ import EffectScatter from "@/components/chart/EffectScatter.vue"; import DashboardEffectScatterModal from "./DashboardEffectScatterModal.vue"; import useSearchParam from "@/hooks/useSearchParam"; import { computed, inject, ref, watch } from "vue"; -import { twMerge } from "tailwind-merge"; import { useI18n } from "vue-i18n"; const { t } = useI18n(); @@ -92,47 +91,45 @@ const handleItemClick = (params) => { watch( [searchParams, () => asset_floor_chart.value, () => props.data], ([newValue, newChart, newData], [oldValue]) => { + console.groupCollapsed("[FloorMap] watch fired"); + console.log("floor_id =", newValue.floor_id); + console.log("chart ready =", !!newChart); + console.log("data keys =", Object.keys(newData || {}).length); + console.groupEnd(); + const floorId = newValue.floor_id; + const chartReady = !!newChart; + // (1) 首次/樓層切換:不等 data,先載 SVG + if (floorId && chartReady && currentFloorId.value !== floorId) { + console.log("[FloorMap] load SVG for floor:", floorId); + currentFloorId.value = floorId; + newChart.updateSvg( + { + full_name: floorId, + path: `${FILE_BASEURL}/upload/floor_map/${floorId}.svg`, + }, + defaultOption(floorId, []) // 先不帶點位 + ); + setTimeout(() => { + if (newChart.chart) { + newChart.chart.off("click"); + newChart.chart.on("click", handleItemClick); + } + }, 100); + } + + // (2) 資料到齊後,再補點位(不重載 SVG) if ( - newValue.floor_id && - newChart && - Object.keys(newData || {}).length > 0 + floorId && + chartReady && + Object.keys(newData || {}).length > 0 && + newChart.chart ) { - const isFloorChanged = currentFloorId.value !== newValue.floor_id; - - if (isFloorChanged) { - // 樓層切換時才重新載入 SVG - console.log( - "Floor changed, updating chart with new SVG", - newValue.floor_id - ); - currentFloorId.value = newValue.floor_id; - newChart.updateSvg( - { - full_name: newValue.floor_id, - path: `${FILE_BASEURL}/upload/floor_map/${newValue.floor_id}.svg`, - }, - defaultOption(newValue.floor_id, currentIconData.value) - ); - - // 添加點擊事件監聽 - setTimeout(() => { - if (newChart.chart) { - newChart.chart.off("click"); // 移除舊的監聽器 - newChart.chart.on("click", handleItemClick); - } - }, 100); - } else if (currentFloorId.value === newValue.floor_id && newChart.chart) { - // 只是資料更新時,只更新圖表資料,不重新載入 SVG - console.log("Data updated, refreshing chart data only"); - newChart.chart.setOption( - { - series: defaultOption(newValue.floor_id, currentIconData.value) - .series, - }, - false, - true - ); - } + console.log("[FloorMap] update series only for floor:", floorId); + newChart.chart.setOption( + { series: defaultOption(floorId, currentIconData.value).series }, + false, + true + ); } }, { diff --git a/src/views/dashboard/components/DashboardEmission.vue b/src/views/dashboard/components/DashboardEmission.vue index 410d8b1..989f5b9 100644 --- a/src/views/dashboard/components/DashboardEmission.vue +++ b/src/views/dashboard/components/DashboardEmission.vue @@ -8,7 +8,6 @@ import useBuildingStore from "@/stores/useBuildingStore"; const store = useBuildingStore(); const { t, locale } = useI18n(); const taipower_data = ref([]); -const elecUseDayData = ref([]); const carbonValue = ref(null); const carbonData = ref(null); const search_data = computed(() => { @@ -108,7 +107,6 @@ watch( JSON.stringify(newValue) !== JSON.stringify(oldValue) ) { getData(newValue); - getElecUseDayData(newValue); } }, {