import { createRouter, createWebHashHistory } from "vue-router";
import Dashboard from "@/views/dashboard/Dashboard.vue";
import History from "@/views/history/History.vue";
import Operation from "@/views/operation/Operation.vue";
import GraphManagement from "@/views/graphManagement/GraphManagement.vue";
import AccountManagement from "@/views/accountManagement/AccountManagement.vue";
import AssetManagement from "@/views/AssetManagement/AssetManagement.vue";
import AlertManagement from "@/views/alert/AlertManagement.vue";
import ProductSetting from "@/views/productSetting/ProductSetting.vue";
import EnergyManagement from "@/views/energyManagement/EnergyManagement.vue";
import SettingManagement from "@/views/setting/SettingManagement.vue";
import Login from "@/views/login/Login.vue";
import useUserInfoStore from "@/stores/useUserInfoStore";
import useGetCookie from "@/hooks/useGetCookie";
import System from "@/views/system/System.vue";
import SystemFloor from "@/views/system/SystemFloor.vue";

import Test from "@/views/Test.vue";
import SystemMain from "@/views/system/SystemMain.vue";

const router = createRouter({
  history: createWebHashHistory(import.meta.env.BASE_URL),
  // linkActiveClass: "is-active",
  routes: [
    {
      path: "/login",
      name: "login",
      component: Login,
    },
    {
      path: "/dashboard",
      index: true,
      name: "dashboard",
      component: Dashboard,
    },
    {
      path: "/system/:main_system_id/:sub_system_id",
      name: "system",
      component: System,
      children: [
        {
          path: ":floor_id",
          name: "sub_system",
          component: SystemMain,
        },
      ],
    },
    {
      path: "/historyData",
      name: "history",
      component: History,
    },
    {
      path: "/operation",
      name: "operation",
      component: Operation,
    },
    {
      path: "/graphManagement",
      name: "graphManagement",
      component: GraphManagement,
    },
    {
      path: "/accountManagement",
      name: "accountManagement",
      component: AccountManagement,
    },
    {
      path: "/assetManagement",
      name: "assetManagement",
      component: AssetManagement,
    },
    {
      path: "/alert",
      name: "alert",
      component: AlertManagement,
    },
    {
      path: "/productSetting",
      name: "productSetting",
      component: ProductSetting,
    },
    {
      path: "/energyManagement/:main_system_id/:sub_system_id/:type",
      name: "energyManagement",
      component: EnergyManagement,
    },
    {
      path: "/setting/:main_system_id/:sub_system_id/:type",
      name: "setting",
      component: SettingManagement,
    },
    {
      path: "/mytestfile/mjm",
      name: "mytestfile",
      component: Test,
    },
  ],
});

router.beforeEach(async (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 auth = useUserInfoStore();
  const token = useGetCookie("JWT-Authorization");
  const user_name = useGetCookie("user_name");

  if ((authRequired && !token) || to.path === "/") {
    auth.user.token = "";
    next({ path: "/login" });
  } else if (!authRequired) {
    document.cookie = "JWT-Authorization=; Max-Age=0";
    document.cookie = "user_name=; Max-Age=0";
    auth.user.token = "";
    auth.user.user_name = "";
  } else {
    auth.user.token = token;
    auth.user.user_name = user_name;
  }
  next();
});

export default router;