From 0dc9d032376f0bf5607ee508963dc2482780d188 Mon Sep 17 00:00:00 2001
From: pany <939630029@qq.com>
Date: Wed, 27 Nov 2024 16:43:38 +0800
Subject: [PATCH] =?UTF-8?q?refactor:=20=E6=9E=84=E5=BB=BA=20login=20?=
 =?UTF-8?q?=E5=BE=AE=E6=A8=A1=E5=9D=97?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/http/apis/user/index.ts                   |  10 ++++++++++
 src/http/apis/user/type.ts                    |   1 +
 src/pages/error/403.vue                       |   2 +-
 src/pages/error/404.vue                       |   2 +-
 .../error => pages/error/images}/403.svg      |   0
 .../error => pages/error/images}/404.svg      |   0
 .../apis/login => pages/login/apis}/index.ts  |   8 --------
 .../apis/login => pages/login/apis}/type.ts   |   2 --
 src/pages/login/components/Owl.vue            |  12 ++++++------
 .../login/images}/close-eyes.png              | Bin
 .../login => pages/login/images}/face.png     | Bin
 .../login/images}/hand-down-left.png          | Bin
 .../login/images}/hand-down-right.png         | Bin
 .../login/images}/hand-up-left.png            | Bin
 .../login/images}/hand-up-right.png           | Bin
 src/pages/login/index.vue                     |   9 ++++++---
 src/pinia/stores/user.ts                      |  18 ++++++++----------
 17 files changed, 33 insertions(+), 31 deletions(-)
 create mode 100644 src/http/apis/user/index.ts
 create mode 100644 src/http/apis/user/type.ts
 rename src/{common/assets/images/error => pages/error/images}/403.svg (100%)
 rename src/{common/assets/images/error => pages/error/images}/404.svg (100%)
 rename src/{http/apis/login => pages/login/apis}/index.ts (73%)
 rename src/{http/apis/login => pages/login/apis}/type.ts (76%)
 rename src/{common/assets/images/login => pages/login/images}/close-eyes.png (100%)
 rename src/{common/assets/images/login => pages/login/images}/face.png (100%)
 rename src/{common/assets/images/login => pages/login/images}/hand-down-left.png (100%)
 rename src/{common/assets/images/login => pages/login/images}/hand-down-right.png (100%)
 rename src/{common/assets/images/login => pages/login/images}/hand-up-left.png (100%)
 rename src/{common/assets/images/login => pages/login/images}/hand-up-right.png (100%)

diff --git a/src/http/apis/user/index.ts b/src/http/apis/user/index.ts
new file mode 100644
index 00000000..53a57978
--- /dev/null
+++ b/src/http/apis/user/index.ts
@@ -0,0 +1,10 @@
+import type * as Login from "./type"
+import { request } from "@/http/request"
+
+/** 获取当前登陆用户详情 */
+export function getUserInfoApi() {
+  return request<Login.UserInfoResponseData>({
+    url: "users/info",
+    method: "get"
+  })
+}
diff --git a/src/http/apis/user/type.ts b/src/http/apis/user/type.ts
new file mode 100644
index 00000000..c3f50edf
--- /dev/null
+++ b/src/http/apis/user/type.ts
@@ -0,0 +1 @@
+export type UserInfoResponseData = ApiResponseData<{ username: string, roles: string[] }>
diff --git a/src/pages/error/403.vue b/src/pages/error/403.vue
index 59b7bd53..db16d5bd 100644
--- a/src/pages/error/403.vue
+++ b/src/pages/error/403.vue
@@ -1,6 +1,6 @@
 <script lang="ts" setup>
-import Svg403 from "@@/assets/images/error/403.svg?component" // vite-svg-loader 插件的功能
 import Layout from "./components/Layout.vue"
+import Svg403 from "./images/403.svg?component" // vite-svg-loader 插件的功能
 </script>
 
 <template>
diff --git a/src/pages/error/404.vue b/src/pages/error/404.vue
index bad3fa5c..982b6f1c 100644
--- a/src/pages/error/404.vue
+++ b/src/pages/error/404.vue
@@ -1,6 +1,6 @@
 <script lang="ts" setup>
-import Svg404 from "@@/assets/images/error/404.svg?component" // vite-svg-loader 插件的功能
 import Layout from "./components/Layout.vue"
+import Svg404 from "./images/404.svg?component" // vite-svg-loader 插件的功能
 </script>
 
 <template>
diff --git a/src/common/assets/images/error/403.svg b/src/pages/error/images/403.svg
similarity index 100%
rename from src/common/assets/images/error/403.svg
rename to src/pages/error/images/403.svg
diff --git a/src/common/assets/images/error/404.svg b/src/pages/error/images/404.svg
similarity index 100%
rename from src/common/assets/images/error/404.svg
rename to src/pages/error/images/404.svg
diff --git a/src/http/apis/login/index.ts b/src/pages/login/apis/index.ts
similarity index 73%
rename from src/http/apis/login/index.ts
rename to src/pages/login/apis/index.ts
index f611296b..89466273 100644
--- a/src/http/apis/login/index.ts
+++ b/src/pages/login/apis/index.ts
@@ -17,11 +17,3 @@ export function loginApi(data: Login.LoginRequestData) {
     data
   })
 }
-
-/** 获取用户详情 */
-export function getUserInfoApi() {
-  return request<Login.UserInfoResponseData>({
-    url: "users/info",
-    method: "get"
-  })
-}
diff --git a/src/http/apis/login/type.ts b/src/pages/login/apis/type.ts
similarity index 76%
rename from src/http/apis/login/type.ts
rename to src/pages/login/apis/type.ts
index 9f25f275..edc4cfb0 100644
--- a/src/http/apis/login/type.ts
+++ b/src/pages/login/apis/type.ts
@@ -10,5 +10,3 @@ export interface LoginRequestData {
 export type LoginCodeResponseData = ApiResponseData<string>
 
 export type LoginResponseData = ApiResponseData<{ token: string }>
-
-export type UserInfoResponseData = ApiResponseData<{ username: string, roles: string[] }>
diff --git a/src/pages/login/components/Owl.vue b/src/pages/login/components/Owl.vue
index 621814dc..ca3cf65d 100644
--- a/src/pages/login/components/Owl.vue
+++ b/src/pages/login/components/Owl.vue
@@ -28,7 +28,7 @@ const props = defineProps<Props>()
   width: 120px;
   height: 95px;
   transform: translateY(12%);
-  @include backgroundImage("@@/assets/images/login/face.png");
+  @include backgroundImage("../images/face.png");
   .hand-down-left,
   .hand-down-right {
     z-index: 2;
@@ -40,12 +40,12 @@ const props = defineProps<Props>()
   .hand-down-left {
     bottom: 3px;
     left: -35px;
-    @include backgroundImage("@@/assets/images/login/hand-down-left.png");
+    @include backgroundImage("../images/hand-down-left.png");
   }
   .hand-down-right {
     bottom: 3px;
     right: -40px;
-    @include backgroundImage("@@/assets/images/login/hand-down-right.png");
+    @include backgroundImage("../images/hand-down-right.png");
   }
   .hand-up-left,
   .hand-up-right {
@@ -59,12 +59,12 @@ const props = defineProps<Props>()
   .hand-up-left {
     bottom: 11px;
     left: -5px;
-    @include backgroundImage("@@/assets/images/login/hand-up-left.png");
+    @include backgroundImage("../images/hand-up-left.png");
   }
   .hand-up-right {
     bottom: 11px;
     right: 5px;
-    @include backgroundImage("@@/assets/images/login/hand-up-right.png");
+    @include backgroundImage("../images/hand-up-right.png");
   }
   .close-eyes {
     z-index: 1;
@@ -72,7 +72,7 @@ const props = defineProps<Props>()
     height: 100%;
     opacity: 0;
     transition: opacity 0.1s linear 0.1s;
-    @include backgroundImage("@@/assets/images/login/close-eyes.png");
+    @include backgroundImage("../images/close-eyes.png");
   }
 }
 
diff --git a/src/common/assets/images/login/close-eyes.png b/src/pages/login/images/close-eyes.png
similarity index 100%
rename from src/common/assets/images/login/close-eyes.png
rename to src/pages/login/images/close-eyes.png
diff --git a/src/common/assets/images/login/face.png b/src/pages/login/images/face.png
similarity index 100%
rename from src/common/assets/images/login/face.png
rename to src/pages/login/images/face.png
diff --git a/src/common/assets/images/login/hand-down-left.png b/src/pages/login/images/hand-down-left.png
similarity index 100%
rename from src/common/assets/images/login/hand-down-left.png
rename to src/pages/login/images/hand-down-left.png
diff --git a/src/common/assets/images/login/hand-down-right.png b/src/pages/login/images/hand-down-right.png
similarity index 100%
rename from src/common/assets/images/login/hand-down-right.png
rename to src/pages/login/images/hand-down-right.png
diff --git a/src/common/assets/images/login/hand-up-left.png b/src/pages/login/images/hand-up-left.png
similarity index 100%
rename from src/common/assets/images/login/hand-up-left.png
rename to src/pages/login/images/hand-up-left.png
diff --git a/src/common/assets/images/login/hand-up-right.png b/src/pages/login/images/hand-up-right.png
similarity index 100%
rename from src/common/assets/images/login/hand-up-right.png
rename to src/pages/login/images/hand-up-right.png
diff --git a/src/pages/login/index.vue b/src/pages/login/index.vue
index 9fb68a01..c1e53058 100644
--- a/src/pages/login/index.vue
+++ b/src/pages/login/index.vue
@@ -1,18 +1,20 @@
 <script lang="ts" setup>
-import type { LoginRequestData } from "@/http/apis/login/type"
 import type { FormInstance, FormRules } from "element-plus"
-import { getLoginCodeApi } from "@/http/apis/login"
+import type { LoginRequestData } from "./apis/type"
 import { useUserStore } from "@/pinia/stores/user"
 import ThemeSwitch from "@@/components/ThemeSwitch/index.vue"
 import { Key, Loading, Lock, Picture, User } from "@element-plus/icons-vue"
 import { ElMessage } from "element-plus"
 import { reactive, ref } from "vue"
 import { useRouter } from "vue-router"
+import { getLoginCodeApi, loginApi } from "./apis"
 import Owl from "./components/Owl.vue"
 import { useFocus } from "./composables/useFocus"
 
 const router = useRouter()
 
+const userStore = useUserStore()
+
 const { isFocus, handleBlur, handleFocus } = useFocus()
 
 /** 登录表单元素的引用 */
@@ -53,7 +55,8 @@ function handleLogin() {
       return
     }
     loading.value = true
-    useUserStore().login(loginFormData).then(() => {
+    loginApi(loginFormData).then(({ data }) => {
+      userStore.setToken(data.token)
       router.push({ path: "/" })
     }).catch(() => {
       createCode()
diff --git a/src/pinia/stores/user.ts b/src/pinia/stores/user.ts
index b337958e..b8177f7b 100644
--- a/src/pinia/stores/user.ts
+++ b/src/pinia/stores/user.ts
@@ -1,9 +1,8 @@
-import type { LoginRequestData } from "@/http/apis/login/type"
-import { getUserInfoApi, loginApi } from "@/http/apis/login"
+import { getUserInfoApi } from "@/http/apis/user"
 import { pinia } from "@/pinia"
 import { resetRouter } from "@/router"
 import { routerConfig } from "@/router/config"
-import { getToken, removeToken, setToken } from "@@/utils/cache/cookies"
+import { setToken as _setToken, getToken, removeToken } from "@@/utils/cache/cookies"
 import { defineStore } from "pinia"
 import { ref } from "vue"
 import { useSettingsStore } from "./settings"
@@ -17,11 +16,10 @@ export const useUserStore = defineStore("user", () => {
   const tagsViewStore = useTagsViewStore()
   const settingsStore = useSettingsStore()
 
-  // 登录
-  const login = async ({ username, password, code }: LoginRequestData) => {
-    const { data } = await loginApi({ username, password, code })
-    setToken(data.token)
-    token.value = data.token
+  // 设置 Token
+  const setToken = async (value: string) => {
+    _setToken(value)
+    token.value = value
   }
 
   // 获取用户详情
@@ -36,7 +34,7 @@ export const useUserStore = defineStore("user", () => {
   const changeRoles = async (role: string) => {
     const newToken = `token-${role}`
     token.value = newToken
-    setToken(newToken)
+    _setToken(newToken)
     // 用刷新页面代替重新登录
     window.location.reload()
   }
@@ -65,7 +63,7 @@ export const useUserStore = defineStore("user", () => {
     }
   }
 
-  return { token, roles, username, login, getInfo, changeRoles, logout, resetToken }
+  return { token, roles, username, setToken, getInfo, changeRoles, logout, resetToken }
 })
 
 /**