## CODE REVIEW (針對總後台與代理後台)

### 1. 登入頁/忘記密碼 頁面切換:

[說明]

原本我是用link href 用相對路徑去切換

<el-link href="/forget-password">忘記密碼</el-link>

但是由於總後台與代理後台的網址 是 `根目錄/efinity_dashboard` 導致在切換路徑時 少了
`efinity_dashboard`

後來調整成 this.$router.push({ path: "/forget-password" })

-----------------
另外為了本地叫好測試出測試站的路徑狀況, 我修改vue.config.js `publicPath` 讓本地呈現`http://192.168.8.200:8080/efinity_dashboard/#/forget-password`

但是由於少了判斷總後台/代理後台不同path, 導致代理後台路徑不對, 這部分需要注意!

### 2. 在開發時 有時候需要有formatter 的函式

但是在**vue2** 要引用寫好的function時 , 直接import 後的function 是無法直接使用的, 必須透過computed, 宣告過才能在template上使用

import { ACTION_TYPE, actionTypeFormat } from "@/utils/common.js";

  computed: {
    ACTION_TYPE() {
      return ACTION_TYPE;
    },
    actionTypeFormat() {
      return actionTypeFormat;
    },
    filterStartDate() {
      return this.filetDateRange.length ? this.filetDateRange[0] : null;
    },
    filterEndDate() {
      return this.filetDateRange.length ? this.filetDateRange[1] : null;
    },
  },

但是**vue3** 是無需這樣做~

直接引用後, 便可以在template上使用

### 3. 在路由中, 當時因為少了 "導航守衛", 導致當sectionStorge 被清掉時, 無法自動導到login, 後來加上這段

// 判定登入
router.beforeEach((to, from, next) => {
  const token = sessionStorage.getItem("userToken");
  if (to.name !== "ForgetPassword" && to.name !== "Login" && !token)
    next({ name: "Login" });
  else next();
});

### 4. 目前每次刷新頁面時, 都會執行一次取user-info

在app.vue 中執行

  mounted() {
    setTimeout(() => {
      this.checkLogin();
    }, 500);
  },

    checkLogin() {
      // 這隻應該是多打的, 造成沒有token時,會報錯
      // this.$store.dispatch("user/getProfile");
      const token = sessionStorage.getItem("userToken");
      const currentRouteName = this.$router.currentRoute.name;
      if (token) {
        this.$store
          .dispatch("user/getProfile")
          .then((res) => {})
          .catch((err) => {
            if (
              currentRouteName !== "ForgetPassword" &&
              currentRouteName !== "Login" &&
              currentRouteName !== "Logout"
            ) {
              this.go("/login");
            }
          });
      } else {
        if (
          currentRouteName !== "ForgetPassword" &&
          currentRouteName !== "Login" &&
          currentRouteName !== "Logout"
        ) {
          this.go("/login");
        }
      }
    },

但是這也導致每次F5 都會重取一次 , 建議是可以存在localStorge 或是 sectionStorge

----
後來思考後, 覺得如果是因為"權限"被上層帳號改動時 希望即時性被強制登出 又或是選單即時增減狀況, 需要重取user-info 的話, 最好的做法是可以透過`webSocket` 或是 `socketIO` 做處理, 當然這製作成品就會相對提高 , 需要後端一起配合