From 37c3b5aa45a91a14013530f1efef7cad723cef11 Mon Sep 17 00:00:00 2001
From: Jimmy Liow <lyj@hainatravel.com>
Date: Wed, 26 Jun 2024 11:44:53 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BD=BF=E7=94=A8Lifecycle=E5=9B=9E=E8=B0=83?=
 =?UTF-8?q?=E6=9D=83=E9=99=90=E5=88=9D=E5=A7=8B=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/main.jsx           | 16 ++++++++++------
 src/stores/Auth.js     | 15 +++++++++++++--
 src/utils/lifecycle.js | 42 ++++++++++++++++++++++++++++++++++++++++++
 3 files changed, 65 insertions(+), 8 deletions(-)
 create mode 100644 src/utils/lifecycle.js

diff --git a/src/main.jsx b/src/main.jsx
index 5c6a620..c6764aa 100644
--- a/src/main.jsx
+++ b/src/main.jsx
@@ -34,7 +34,7 @@ import { ThemeContext } from '@/stores/ThemeContext'
 import { usingStorage } from '@/hooks/usingStorage'
 import { isNotEmpty } from '@/utils/commons'
 import { appendRequestParams } from '@/utils/request'
-import useAuthStore from '@/stores/Auth'
+import { fireAuth } from "./utils/lifecycle"
 
 import { PERM_ACCOUNT_MANAGEMENT, PERM_ROLE_NEW, PERM_OVERSEA, PERM_AIR_TICKET } from '@/config'
 
@@ -42,14 +42,18 @@ import './i18n';
 
 const { loginToken, userId } = usingStorage()
 
-if (isNotEmpty(loginToken)) {
-  appendRequestParams('token', loginToken)
-}
+const initAppliction = async () => {
+  if (isNotEmpty(loginToken)) {
+    appendRequestParams('token', loginToken)
+  }
 
-if (isNotEmpty(userId)) {
-  useAuthStore.getState().loadUserPermission(userId)
+  if (isNotEmpty(userId)) {
+    await fireAuth()
+  }
 }
 
+await initAppliction()
+
 const router = createBrowserRouter([
   {
     path: "/",
diff --git a/src/stores/Auth.js b/src/stores/Auth.js
index 55ab140..b462a1d 100644
--- a/src/stores/Auth.js
+++ b/src/stores/Auth.js
@@ -3,6 +3,9 @@ import { appendRequestParams, fetchJSON, postForm } from '@/utils/request'
 import { HT_HOST } from "@/config"
 import { loadPageSpy } from '@/pageSpy'
 import { usingStorage } from '@/hooks/usingStorage'
+import { devtools } from 'zustand/middleware'
+
+import { obervseLifecycle } from '@/utils/lifecycle'
 
 const KEY_LOGIN_TOKEN = 'G-STR:LOGIN_TOKEN'
 const KEY_TRAVEL_AGENCY_ID = 'G-INT:TRAVEL_AGENCY_ID'
@@ -42,7 +45,14 @@ async function fetchLastRequet() {
   return errcode !== 0 ? {} : result
 }
 
-const useAuthStore = create((set, get) => ({
+const useAuthStore = create(obervseLifecycle((set, get) => ({
+
+  onAuth: () => {
+    const { startTokenInterval, loadUserPermission } = get()
+    const { userId } = usingStorage()
+    loadUserPermission(userId)
+    startTokenInterval()
+  },
 
   tokenInterval: null,
 
@@ -157,6 +167,7 @@ const useAuthStore = create((set, get) => ({
         }
       });
   },
-}))
+
+})))
 
 export default useAuthStore
\ No newline at end of file
diff --git a/src/utils/lifecycle.js b/src/utils/lifecycle.js
new file mode 100644
index 0000000..a2de514
--- /dev/null
+++ b/src/utils/lifecycle.js
@@ -0,0 +1,42 @@
+const initListener = []
+const authListener = []
+
+export const onInit = (fn) => {
+  initListener.push(fn)
+}
+
+export const onAuth = (fn) => {
+  authListener.push(fn)
+}
+
+export const fireInit = async () => {
+  initListener.forEach(async (fn) => {
+    await fn()
+  })
+}
+
+export const fireAuth = (obj) => {
+  authListener.forEach(fn => fn(obj))
+}
+
+// Zustand 中间件，用于订阅前端应用的生命周期，实验阶段
+export const obervseLifecycle = (fn) => (set, get, store) => {
+
+  onInit(() => {
+    if (store.getState().hasOwnProperty('onInit')) {
+      store.getState().onInit()
+    } else {
+      console.info('store has no function: onInit.')
+    }
+  })
+
+  onAuth(() => {
+    if (store.getState().hasOwnProperty('onAuth')) {
+      store.getState().onAuth()
+    } else {
+      console.info('store has no function: onAuth.')
+    }
+  })
+
+  return fn(set, get, store)
+}
\ No newline at end of file