fix: 修正平面圖與點位顯示順序
This commit is contained in:
parent
84b479bc9c
commit
c92dee5213
@ -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;
|
||||
|
||||
@ -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
|
||||
);
|
||||
}
|
||||
},
|
||||
{
|
||||
|
||||
@ -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);
|
||||
}
|
||||
},
|
||||
{
|
||||
|
||||
Loading…
Reference in New Issue
Block a user