feat(user): 优化用户角色分配功能

- 修正角色选项展示字段，从 name 改为 roleName
- 调整列表底部自适应偏移量为 120
- 性别字段由 sex 修改为 gender，更新展示和标签逻辑
- 角色分配功能改为异步操作，调用 assignUserRoles 接口分配角色
- 弹窗数据改为异步获取完整角色列表，提升准确性
- 增加操作成功与失败的消息提示
- 角色相关类型定义优化，角色列表类型改为 SysRole，选中角色类型改为 number[]

src/views/system/user/form/role.vue

@@ -41,9 +41,9 @@ const newFormInline = ref(props.formInline);
               v-for="(item, index) in newFormInline.roleOptions"
               :key="index"
               :value="item.id"
-              :label="item.name"
+              :label="item.roleName"
             >
-              {{ item.name }}
+              {{ item.roleName }}
             </el-option>
           </el-select>
         </el-form-item>

src/views/system/user/index.vue

@@ -139,7 +139,7 @@ const {
           ref="tableRef"
           row-key="id"
           adaptive
-          :adaptiveConfig="{ offsetBottom: 108 }"
+          :adaptiveConfig="{ offsetBottom: 10 }"
           align-whole="center"
           table-layout="auto"
           :loading="loading"

src/views/system/user/utils/hook.tsx

@@ -16,7 +16,12 @@ import {
   hideTextAtIndex,
   deviceDetection
 } from "@pureadmin/utils";
-import { getUserRoleIds, getUserList, getAllRoleList } from "@/api/system";
+import {
+  getUserRoleIds,
+  getUserList,
+  getAllRoleList,
+  assignUserRoles
+} from "@/api/system";
 import { syncFeishuUsers } from "@/api/feishu";
 import {
   ElForm,
@@ -86,15 +91,15 @@ export function useUser(tableRef: Ref) {
     },
     {
       label: "性别",
-      prop: "sex",
+      prop: "gender",
       minWidth: 90,
       cellRenderer: ({ row, props }) => (
         <el-tag
           size={props.size}
-          type={row.sex === 1 ? "danger" : null}
+          type={row.gender === 2 ? "danger" : null}
           effect="plain"
         >
-          {row.sex === 1 ? "女" : "男"}
+          {row.gender === 1 ? "男" : "女"}
         </el-tag>
       )
     },
@@ -429,7 +434,10 @@ export function useUser(tableRef: Ref) {
 
   /** 分配角色 */
   async function handleRole(row) {
-    // 选中的角色列表
+    // 获取所有角色列表
+    const rolesRes = await getAllRoleList();
+    const roleList = rolesRes.data ?? [];
+    // 获取用户当前的角色列表
     const ids = (await getUserRoleIds(row.id)).data ?? [];
     addDialog({
       title: `分配 ${row.username} 用户的角色`,
@@ -437,7 +445,7 @@ export function useUser(tableRef: Ref) {
         formInline: {
           username: row?.username ?? "",
           nickname: row?.nickname ?? "",
-          roleOptions: roleOptions.value ?? [],
+          roleOptions: roleList,
           ids
         }
       },
@@ -447,12 +455,18 @@ export function useUser(tableRef: Ref) {
       fullscreenIcon: true,
       closeOnClickModal: false,
       contentRenderer: () => h(roleForm),
-      beforeSure: (done, { options }) => {
+      beforeSure: async (done, { options }) => {
         const curData = options.props.formInline as RoleFormItemProps;
-        console.log("curIds", curData.ids);
+        try {
-        // 根据实际业务使用curData.ids和row里的某些字段去调用修改角色接口即可
+          const { code } = await assignUserRoles(row.id, curData.ids);
+          if (code === 200) {
+            message(`已成功为 ${row.username} 分配角色`, { type: "success" });
             done(); // 关闭弹框
           }
+        } catch {
+          message("分配角色失败", { type: "error" });
+        }
+      }
     });
   }
 

src/views/system/user/utils/types.ts

@@ -1,3 +1,5 @@
+import type { SysRole } from "@/api/system";
+
 interface FormItemProps {
   id?: number;
   /** 用于判断是`新增`还是`修改` */
@@ -25,9 +27,9 @@ interface RoleFormItemProps {
   username: string;
   nickname: string;
   /** 角色列表 */
-  roleOptions: any[];
+  roleOptions: SysRole[];
   /** 选中的角色列表 */
-  ids: Record<number, unknown>[];
+  ids: number[];
 }
 interface RoleFormProps {
   formInline: RoleFormItemProps;