style: 显示用户权限列

src/views/system/user/index.vue

@@ -130,8 +130,8 @@ let tableColumns: ColumnsType = [
     align: 'center',
   },
   {
-    title: '手机号码',
-    dataIndex: 'phonenumber',
+    title: '用户权限',
+    key: 'roles',
     align: 'center',
   },
   {
@@ -965,6 +965,11 @@ onMounted(() => {
         }"
       >
         <template #bodyCell="{ column, record }">
+          <template v-if="column.key === 'roles'">
+            <a-tag color="cyan" v-for="r in record.roles">
+              {{ r.roleName }}
+            </a-tag>
+          </template>
           <template v-if="column.key === 'deptId'">
             {{ record.dept?.deptName }}
           </template>
@@ -1159,12 +1164,12 @@ onMounted(() => {
             </a-form-item>
           </a-col>
           <a-col :lg="12" :md="12" :xs="24">
-            <a-form-item label="用户角色" name="roleIds">
+            <a-form-item label="用户权限" name="roleIds">
               <a-select
                 :value="modalState.from.roleIds"
                 disabled
                 mode="multiple"
-                placeholder="请选择用户角色"
+                placeholder="请选择用户权限"
                 option-label-prop="roleName"
                 :options="modalState.options.roles"
                 :field-names="{ label: 'roleName', value: 'roleId' }"
@@ -1341,12 +1346,12 @@ onMounted(() => {
             </a-form-item>
           </a-col>
           <a-col :lg="12" :md="12" :xs="24">
-            <a-form-item label="用户角色" name="roleIds">
+            <a-form-item label="用户权限" name="roleIds">
               <a-select
                 v-model:value="modalState.from.roleIds"
-                allow-clear
+                :allow-clear="false"
                 mode="multiple"
-                placeholder="请选择用户角色"
+                placeholder="请选择用户权限"
                 show-search
                 option-filter-prop="roleName"
                 option-label-prop="roleName"