feat(login): add userID

- 修改按钮判断的逻辑，将 `userName` 替换成 `userID` 判断；解决不管是主程序还是插件修改用户名，都会存在的条件判断导致的渲染异常显示。（拆分自user的pr）

src/components/cards/UserCard.vue

@@ -21,8 +21,8 @@ const props = defineProps({
   },
 })
 
-// 当前用户名称
-const currentLoginUser = store.state.auth.userName
+// 当前用户的ID
+const currentLoginUserId = computed(() => store.state.auth.userID)
 
 // 定义触发的自定义事件
 const emit = defineEmits(['remove', 'save'])
@@ -57,7 +57,7 @@ async function fetchSubscriptions() {
 
 // 删除用户
 async function removeUser() {
-  if (props.user.name == currentLoginUser) {
+  if (props.user.id === currentLoginUserId.value) {
     $toast.error('不能删除当前登录用户！')
     return
   }
@@ -84,19 +84,6 @@ function editUser() {
   userEditDialog.value = true
 }
 
-// 计算是否有用户编辑权限
-const canEditUser = computed(() => {
-  if (store.state.auth.superUser && props.user.name !== currentLoginUser) return true
-  return false
-})
-
-// 计算是否有用户管理权限
-const canManageUser = computed(() => {
-  if (props.user.name == currentLoginUser) return false
-  if (store.state.auth.superUser) return true
-  return false
-})
-
 // 用户重新完成时
 function onUserUpdate() {
   userEditDialog.value = false
@@ -170,8 +157,21 @@ onMounted(() => {
       </VList>
     </VCardText>
     <VCardText class="flex flex-row justify-center">
-      <VBtn v-if="canEditUser" color="primary" class="me-4" @click="editUser">编辑</VBtn>
-      <VBtn v-if="canManageUser" color="error" variant="outlined" @click="removeUser"> 删除 </VBtn>
+      <VBtn
+        color="primary"
+        class="me-4"
+        @click="editUser"
+      >
+        编辑
+      </VBtn>
+      <VBtn
+        v-if="!(props.user.id === currentLoginUserId)"
+        color="error"
+        variant="outlined"
+        @click="removeUser"
+      >
+        删除
+      </VBtn>
     </VCardText>
   </VCard>
   <!-- 用户编辑弹窗 -->

src/pages/login.vue

@@ -171,6 +171,7 @@ function login() {
       // 获取token
       const token = response.access_token
       const superUser = response.super_user
+      const userID = response.user_id
       const userName = response.user_name
       const avatar = response.avatar
       const level = response.level
@@ -178,7 +179,8 @@ function login() {
       const permissions = response.permissions
 
       // 更新token和remember状态到Vuex Store
-      store.dispatch('auth/login', { token, remember, superUser, userName, avatar, level, permissions })
+      store.dispatch('auth/login', {
+        token, remember, superUser, userID, userName, avatar, level, permissions })
 
       // 登录后处理
       afterLogin(superUser)

src/store/auth.ts

@@ -5,6 +5,7 @@ interface AuthState {
   token: string | null
   remember: boolean
   superUser: boolean
+  userID: number
   userName: string
   avatar: string
   originalPath: string | null
@@ -24,6 +25,7 @@ const authModule: Module<AuthState, RootState> = {
     token: null, // 用户令牌
     remember: false, // 记住我
     superUser: false, // 超级管理员
+    userID: 999, // 用户ID
     userName: '', // 用户名
     avatar: '', // 头像
     originalPath: null, // 原始路径
@@ -43,6 +45,9 @@ const authModule: Module<AuthState, RootState> = {
     setSuperUser(state, superUser: boolean) {
       state.superUser = superUser
     },
+    setUserID(state, userID: number) {
+      state.userID = userID
+    },
     setUserName(state, userName: string) {
       state.userName = userName
     },
@@ -60,10 +65,11 @@ const authModule: Module<AuthState, RootState> = {
     },
   },
   actions: {
-    login({ commit }, { token, remember, superUser, userName, avatar, level, permissions }) {
+    login({ commit }, { token, remember, superUser, userID, userName, avatar, level, permissions }) {
       commit('setToken', token)
       commit('setRemember', remember)
       commit('setSuperUser', superUser)
+      commit('setUserID', userID)
       commit('setUserName', userName)
       commit('setAvatar', avatar)
       commit('setLevel', level)
@@ -78,6 +84,7 @@ const authModule: Module<AuthState, RootState> = {
     getToken: state => state.token,
     getRemember: state => state.remember,
     getSuperUser: state => state.superUser,
+    getUserID: state => state.userID,
     getUserName: state => state.userName,
     getAvatar: state => state.avatar,
     getOriginalPath: state => state.originalPath,