build(projects): 依赖升级，规范目录

src/store/modules/app/index.ts

@@ -0,0 +1,26 @@
+import { defineStore } from 'pinia';
+import { store } from '../../index';
+
+interface AppState {
+  /** 侧边栏折叠 */
+  asideCollapse: boolean;
+}
+
+const appStore = defineStore({
+  id: 'app-store',
+  state: (): AppState => ({
+    asideCollapse: false
+  }),
+  actions: {
+    handleAsideCollapse(collapse: boolean) {
+      this.asideCollapse = collapse;
+    },
+    toggleAside() {
+      this.asideCollapse = !this.asideCollapse;
+    }
+  }
+});
+
+export default function useAppStore() {
+  return appStore(store);
+}

src/store/modules/aside/index.ts

@@ -1,33 +0,0 @@
-import { inject, reactive } from 'vue';
-import type { App, InjectionKey } from 'vue';
-
-interface AsideState {
-  collapse: boolean;
-}
-
-interface AsideStore {
-  /** aside状态 */
-  asideState: AsideState;
-  /** 切换collapse */
-  toggle: () => void;
-}
-
-const injectKey: InjectionKey<AsideStore> = Symbol('aside-store');
-
-export function createAsideStore(app: App) {
-  const state = reactive<AsideState>({
-    collapse: false
-  });
-  function toggle() {
-    state.collapse = !state.collapse;
-  }
-  const provideData: AsideStore = {
-    asideState: state,
-    toggle
-  };
-  app.provide(injectKey, provideData);
-}
-
-export function useAsideStore() {
-  return inject(injectKey)!;
-}

src/store/modules/auth/index.ts

@@ -1,44 +1,40 @@
-import { computed, inject, reactive } from 'vue';
-import type { ComputedRef, App, InjectionKey } from 'vue';
-
-interface UserInfo {
-  userId: string;
-  userName: string;
-  userPhone: string;
-}
+import { defineStore } from 'pinia';
+import type { UserInfo } from '@/interface';
+import { store } from '../../index';
 
 interface AuthState {
+  /** 用户token */
   token: string;
+  /** 用户信息 */
   userInfo: UserInfo;
 }
 
-interface AuthStore {
-  /** auth状态 */
-  authState: AuthState;
-  /** 是否登录 */
-  isLogin: ComputedRef<boolean>;
-}
-
-const injectKey: InjectionKey<AuthStore> = Symbol('auth-store');
-
-export function createAuthStore(app: App) {
-  const state = reactive<AuthState>({
-    token: '',
-    userInfo: {
-      userId: '',
-      userName: '',
-      userPhone: ''
+const authStore = defineStore({
+  /** 区分不通状态的唯一标识 */
+  id: 'auth-store',
+  /** 状态 */
+  state: (): AuthState => {
+    return {
+      token: '',
+      userInfo: {
+        userId: '',
+        userName: '',
+        userPhone: ''
+      }
+    };
+  },
+  getters: {
+    /** 是否登录 */
+    isLogin: state => Boolean(state.token)
+  },
+  actions: {
+    /** 重置auth状态 */
+    resetAuthState() {
+      this.$reset();
     }
-  });
-  const isLogin = computed(() => Boolean(state.token));
+  }
+});
 
-  const provideData: AuthStore = {
-    authState: state,
-    isLogin
-  };
-  app.provide(injectKey, provideData);
-}
-
-export function useAuthStore() {
-  return inject(injectKey)!;
+export default function useAuthStore() {
+  return authStore(store);
 }

src/store/modules/index.ts

@@ -0,0 +1,4 @@
+import useAppStore from './app';
+import useAuthStore from './auth';
+
+export { useAppStore, useAuthStore };