🦄 refactor: 优化代码结构

src/api/index.ts

@@ -1,5 +1,8 @@
+import { userInfoResponseSchema } from '@/schemas';
 import { useUserStore } from '@/stores/user';
-import axios from 'axios';
+import axios, { type AxiosError } from 'axios';
+import { ElMessage } from 'element-plus';
+import { errorMessage } from '../utils/api';
 
 const baseURL = 'https://wzpmc.cn:18080/';
 const axiosInstance = axios.create({
@@ -23,3 +26,25 @@ axiosInstance.interceptors.response.use((response) => {
 });
 export default axiosInstance;
 export type RawResp = Record<string, unknown>;
+export async function getUserInfo(showErrorMessage: boolean, userID?: string) {
+  let url = '/api/user/info';
+  if (userID) {
+    url += `/${userID}`;
+  }
+  const raw = await axiosInstance
+    .get<RawResp>(url)
+    .then((r) => r.data)
+    .catch((e: AxiosError) => {
+      if (!showErrorMessage) return;
+      ElMessage.error(errorMessage('获取用户信息失败', e.code, e.message));
+    });
+  if (!raw) return;
+  const resp = userInfoResponseSchema.parse(raw);
+  if (resp.type === 'error') {
+    if (showErrorMessage) {
+      ElMessage.error(errorMessage('获取用户信息失败', resp.code, resp.msg));
+    }
+    return;
+  }
+  return resp;
+}

src/schemas/response.ts

@@ -38,17 +38,17 @@ export const idAndNameSchema = z.object({
   name: z.string(),
 });
 
-const _authSchema = idAndNameSchema.extend({
+const authSchema = idAndNameSchema.extend({
   permissions: idAndNameSchema.array(),
 });
 export const userInfoResponseSchema = createResponseSchema(
   idAndNameSchema.extend({
     avatar: z.nullable(z.string()),
-    auth: _authSchema,
+    auth: authSchema,
     club: z.nullable(
       idAndNameSchema.extend({
         commit: z.string(),
-        auth: _authSchema,
+        auth: authSchema,
       }),
     ),
   }),

src/stores/user.ts

@@ -1,14 +1,11 @@
-import axiosInstance, { type RawResp } from '@/api';
+import { getUserInfo } from '@/api';
 import router from '@/router';
 import type { UserInfo } from '@/schemas';
-import { type idAndNameSchema, userInfoResponseSchema } from '@/schemas';
-import { errorMessage } from '@/utils/api';
+import { type idAndNameSchema } from '@/schemas';
 import type { MaybePromise } from '@/utils/types';
 import { StorageSerializers, useLocalStorage } from '@vueuse/core';
-import { AxiosError } from 'axios';
-import { ElMessage } from 'element-plus';
 import { defineStore } from 'pinia';
-import { computed, onUnmounted, ref, watch } from 'vue';
+import { computed, ref, watch } from 'vue';
 import { z } from 'zod';
 
 type Permission = z.infer<typeof idAndNameSchema>;
@@ -40,20 +37,8 @@ export const useUserStore = defineStore('user', () => {
   async function updateSelfUserInfo(showErrorMessage: boolean): Promise<boolean> {
     initializing.value = true;
     try {
-      const raw = await axiosInstance
-        .get<RawResp>('/api/user/info')
-        .then((r) => r.data)
-        .catch((e: AxiosError) => {
-          if (!showErrorMessage) return;
-          ElMessage.error(errorMessage('获取用户信息失败', e.code, e.message));
-        });
-      const resp = userInfoResponseSchema.parse(raw);
-      if (resp.type === 'error') {
-        if (showErrorMessage) {
-          ElMessage.error(errorMessage('获取用户信息失败', resp.code, resp.msg));
-        }
-        return false;
-      }
+      const resp = await getUserInfo(showErrorMessage);
+      if (!resp) return false;
       userInfo.value = resp.data;
       return true;
     } finally {
@@ -89,12 +74,3 @@ export const useUserStore = defineStore('user', () => {
   };
 });
 export type LogoutInterceptor = () => MaybePromise<boolean | void>;
-export function useLogoutInterceptor(fn: LogoutInterceptor) {
-  const userStore = useUserStore();
-  userStore.addLogoutInterceptor(fn);
-  const remove = () => {
-    userStore.removeLogoutInterceptor(fn);
-  };
-  onUnmounted(remove);
-  return remove;
-}

src/utils/user.ts

@@ -0,0 +1,12 @@
+import { useUserStore, type LogoutInterceptor } from '@/stores/user';
+import { onUnmounted } from 'vue';
+
+export function useLogoutInterceptor(fn: LogoutInterceptor) {
+  const userStore = useUserStore();
+  userStore.addLogoutInterceptor(fn);
+  const remove = () => {
+    userStore.removeLogoutInterceptor(fn);
+  };
+  onUnmounted(remove);
+  return remove;
+}

src/views/GobangPlayPage.vue

@@ -235,8 +235,9 @@ import GobangSide from '@/components/gobang/GobangSide.vue';
 import GobangUser from '@/components/gobang/GobangUser.vue';
 import router from '@/router';
 import { useMediaStore } from '@/stores/media';
-import { useLogoutInterceptor, useUserStore } from '@/stores/user';
+import { useUserStore } from '@/stores/user';
 import { create2DArray, iter2DArray, zip } from '@/utils/array';
+import { useLogoutInterceptor } from '@/utils/user';
 import { useGobangSocket, WinFace, type RoomDetail, type RoomId } from '@/views/GobangListPage.vue';
 import { ElMessage, ElMessageBox, ElNotification, type Action } from 'element-plus';
 import { storeToRefs } from 'pinia';