diff --git a/src/views/system/user/index.vue b/src/views/system/user/index.vue
index 07966786..4a0889c3 100644
--- a/src/views/system/user/index.vue
+++ b/src/views/system/user/index.vue
@@ -135,7 +135,7 @@ let tableColumns: ColumnsType = [
   {
     title: t('views.system.user.permission'),
     key: 'roles',
-    align: 'center',
+    align: 'left',
   },
   {
     title: t('views.system.user.className'),
@@ -1258,7 +1258,12 @@ onMounted(() => {
       @ok="fnModalOk"
       @cancel="fnModalCancel"
     >
-      <a-form name="modalStateFromByEdit" layout="horizontal">
+      <a-form
+        name="modalStateFromByEdit"
+        layout="horizontal"
+        :label-col="{ span: 6 }"
+        :labelWrap="true"
+      >
         <a-row :gutter="16" v-if="!modalState.from.userId">
           <a-col :lg="12" :md="12" :xs="24">
             <a-form-item
@@ -1309,22 +1314,20 @@ onMounted(() => {
               ></a-input>
             </a-form-item>
           </a-col>
-          <a-col :lg="6" :md="6" :xs="24">
-            <a-form-item :label="t('views.system.user.sex')" name="sex">
+          <a-col :lg="12" :md="12" :xs="24">
+            <a-form-item
+              :label="t('views.system.user.userWork')"
+              name="postIds"
+            >
               <a-select
-                v-model:value="modalState.from.sex"
-                default-value="1"
-                :options="dict.sysUserSex"
-              >
-              </a-select>
-            </a-form-item>
-          </a-col>
-          <a-col :lg="6" :md="6" :xs="24">
-            <a-form-item :label="t('views.system.user.status')" name="status">
-              <a-select
-                v-model:value="modalState.from.status"
-                default-value="0"
-                :options="dict.sysNormalDisable"
+                v-model:value="modalState.from.postIds"
+                allow-clear
+                mode="multiple"
+                show-search
+                option-filter-prop="postName"
+                option-label-prop="postName"
+                :options="modalState.options.posts"
+                :field-names="{ label: 'postName', value: 'postId' }"
               >
               </a-select>
             </a-form-item>
@@ -1360,7 +1363,53 @@ onMounted(() => {
           </a-col>
         </a-row>
 
-        <a-form-item :label="t('views.system.user.fromClass')" name="deptId">
+        <a-row :gutter="16">
+          <a-col :lg="12" :md="12" :xs="24">
+            <a-form-item :label="t('views.system.user.sex')" name="sex">
+              <a-select
+                v-model:value="modalState.from.sex"
+                default-value="1"
+                :options="dict.sysUserSex"
+              >
+              </a-select>
+            </a-form-item>
+          </a-col>
+          <a-col :lg="12" :md="12" :xs="24">
+            <a-form-item :label="t('views.system.user.status')" name="status">
+              <a-select
+                v-model:value="modalState.from.status"
+                default-value="0"
+                :options="dict.sysNormalDisable"
+              >
+              </a-select>
+            </a-form-item>
+          </a-col>
+        </a-row>
+
+        <a-form-item
+          :label="t('views.system.user.permission')"
+          name="roleIds"
+          :label-col="{ span: 3 }"
+          v-perms:has="['system:user:editRole']"
+        >
+          <a-select
+            v-model:value="modalState.from.roleIds"
+            :allow-clear="false"
+            mode="multiple"
+            show-search
+            option-filter-prop="roleName"
+            option-label-prop="roleName"
+            :options="modalState.options.roles"
+            :field-names="{ label: 'roleName', value: 'roleId' }"
+          >
+          </a-select>
+        </a-form-item>
+
+        <a-form-item
+          :label="t('views.system.user.fromClass')"
+          name="deptId"
+          :label-col="{ span: 3 }"
+        >
           <a-tree-select
             v-model:value="modalState.from.deptId"
             show-search
@@ -1379,46 +1428,11 @@ onMounted(() => {
           </a-tree-select>
         </a-form-item>
 
-        <a-row :gutter="16">
-          <a-col :lg="12" :md="12" :xs="24">
-            <a-form-item
-              :label="t('views.system.user.userWork')"
-              name="postIds"
-            >
-              <a-select
-                v-model:value="modalState.from.postIds"
-                allow-clear
-                mode="multiple"
-                show-search
-                option-filter-prop="postName"
-                option-label-prop="postName"
-                :options="modalState.options.posts"
-                :field-names="{ label: 'postName', value: 'postId' }"
-              >
-              </a-select>
-            </a-form-item>
-          </a-col>
-          <a-col :lg="12" :md="12" :xs="24">
-            <a-form-item
-              :label="t('views.system.user.permission')"
-              name="roleIds"
-            >
-              <a-select
-                v-model:value="modalState.from.roleIds"
-                :allow-clear="false"
-                mode="multiple"
-                show-search
-                option-filter-prop="roleName"
-                option-label-prop="roleName"
-                :options="modalState.options.roles"
-                :field-names="{ label: 'roleName', value: 'roleId' }"
-              >
-              </a-select>
-            </a-form-item>
-          </a-col>
-        </a-row>
-
-        <a-form-item :label="t('views.system.user.userTip')" name="remark">
+        <a-form-item
+          :label="t('views.system.user.userTip')"
+          name="remark"
+          :label-col="{ span: 3 }"
+        >
           <a-textarea
             v-model:value="modalState.from.remark"
             :auto-size="{ minRows: 4, maxRows: 6 }"