fix: 修正平面圖與點位顯示順序

This commit is contained in:
MJM_2025_05\polly 2025-08-26 16:58:51 +08:00
parent 84b479bc9c
commit c92dee5213
3 changed files with 64 additions and 58 deletions

View File

@ -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); 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 publicPages = ["/login", "/"];
const authRequired = !publicPages.includes(to.path); const requiresAuth = !publicPages.includes(to.path);
const auth = useUserInfoStore(); const auth = useUserInfoStore();
const token = useGetCookie("JWT-Authorization"); const token = useGetCookie("JWT-Authorization");
const user_name = useGetCookie("user_name"); const user_name = useGetCookie("user_name");
// 處理 /logout
if (to.path === "/logout") { if (to.path === "/logout") {
document.cookie = "JWT-Authorization=; Max-Age=0"; // 清除 cookie建議補 Path 與 SameSite
document.cookie = "user_name=; Max-Age=0"; document.cookie = "JWT-Authorization=; Max-Age=0; Path=/";
document.cookie = "user_name=; Max-Age=0; Path=/";
// 清除狀態
auth.user.token = ""; auth.user.token = "";
auth.user.user_name = ""; auth.user.user_name = "";
localStorage.removeItem("EmpowerBuilding"); 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 = ""; auth.user.token = "";
next({ path: "/login" }); return next({ path: "/login", replace: true });
} else if (!authRequired) { }
document.cookie = "JWT-Authorization=; Max-Age=0";
document.cookie = "user_name=; Max-Age=0"; // 進公開頁(例如 /login清掉使用者狀態若你想保留語系就不要清
if (!requiresAuth) {
document.cookie = "JWT-Authorization=; Max-Age=0; Path=/";
document.cookie = "user_name=; Max-Age=0; Path=/";
auth.user.token = ""; auth.user.token = "";
auth.user.user_name = ""; auth.user.user_name = "";
} else { return next();
}
// 受保護頁且有 token同步 Pinia 狀態
auth.user.token = token; auth.user.token = token;
auth.user.user_name = user_name; auth.user.user_name = user_name;
} return next();
next();
}); });
export default router; export default router;

View File

@ -4,7 +4,6 @@ import EffectScatter from "@/components/chart/EffectScatter.vue";
import DashboardEffectScatterModal from "./DashboardEffectScatterModal.vue"; import DashboardEffectScatterModal from "./DashboardEffectScatterModal.vue";
import useSearchParam from "@/hooks/useSearchParam"; import useSearchParam from "@/hooks/useSearchParam";
import { computed, inject, ref, watch } from "vue"; import { computed, inject, ref, watch } from "vue";
import { twMerge } from "tailwind-merge";
import { useI18n } from "vue-i18n"; import { useI18n } from "vue-i18n";
const { t } = useI18n(); const { t } = useI18n();
@ -92,48 +91,46 @@ const handleItemClick = (params) => {
watch( watch(
[searchParams, () => asset_floor_chart.value, () => props.data], [searchParams, () => asset_floor_chart.value, () => props.data],
([newValue, newChart, newData], [oldValue]) => { ([newValue, newChart, newData], [oldValue]) => {
if ( console.groupCollapsed("[FloorMap] watch fired");
newValue.floor_id && console.log("floor_id =", newValue.floor_id);
newChart && console.log("chart ready =", !!newChart);
Object.keys(newData || {}).length > 0 console.log("data keys =", Object.keys(newData || {}).length);
) { console.groupEnd();
const isFloorChanged = currentFloorId.value !== newValue.floor_id; const floorId = newValue.floor_id;
const chartReady = !!newChart;
if (isFloorChanged) { // (1) / data SVG
// SVG if (floorId && chartReady && currentFloorId.value !== floorId) {
console.log( console.log("[FloorMap] load SVG for floor:", floorId);
"Floor changed, updating chart with new SVG", currentFloorId.value = floorId;
newValue.floor_id
);
currentFloorId.value = newValue.floor_id;
newChart.updateSvg( newChart.updateSvg(
{ {
full_name: newValue.floor_id, full_name: floorId,
path: `${FILE_BASEURL}/upload/floor_map/${newValue.floor_id}.svg`, path: `${FILE_BASEURL}/upload/floor_map/${floorId}.svg`,
}, },
defaultOption(newValue.floor_id, currentIconData.value) defaultOption(floorId, []) //
); );
//
setTimeout(() => { setTimeout(() => {
if (newChart.chart) { if (newChart.chart) {
newChart.chart.off("click"); // newChart.chart.off("click");
newChart.chart.on("click", handleItemClick); newChart.chart.on("click", handleItemClick);
} }
}, 100); }, 100);
} else if (currentFloorId.value === newValue.floor_id && newChart.chart) { }
// SVG
console.log("Data updated, refreshing chart data only"); // (2) SVG
if (
floorId &&
chartReady &&
Object.keys(newData || {}).length > 0 &&
newChart.chart
) {
console.log("[FloorMap] update series only for floor:", floorId);
newChart.chart.setOption( newChart.chart.setOption(
{ { series: defaultOption(floorId, currentIconData.value).series },
series: defaultOption(newValue.floor_id, currentIconData.value)
.series,
},
false, false,
true true
); );
} }
}
}, },
{ {
immediate: true, immediate: true,

View File

@ -8,7 +8,6 @@ import useBuildingStore from "@/stores/useBuildingStore";
const store = useBuildingStore(); const store = useBuildingStore();
const { t, locale } = useI18n(); const { t, locale } = useI18n();
const taipower_data = ref([]); const taipower_data = ref([]);
const elecUseDayData = ref([]);
const carbonValue = ref(null); const carbonValue = ref(null);
const carbonData = ref(null); const carbonData = ref(null);
const search_data = computed(() => { const search_data = computed(() => {
@ -108,7 +107,6 @@ watch(
JSON.stringify(newValue) !== JSON.stringify(oldValue) JSON.stringify(newValue) !== JSON.stringify(oldValue)
) { ) {
getData(newValue); getData(newValue);
getElecUseDayData(newValue);
} }
}, },
{ {