修改角色bug

src/views/group-user/user/UserForm.vue

@@ -57,14 +57,14 @@
                 </Col>
             </Row>
 
-            <!-- 第 5 行：所在组(只读)（仅编辑展示，显示用户全部所属组；不提交） -->
+            <!-- 第 5 行：所在组(只读)（仅编辑展示，默认选中当前组；提交时不带 groupId，不改变所在组） -->
             <Row v-if="isEdit">
                 <Col span="24">
                 <FormItem label="所在组(只读)：">
-                    <div class="group-readonly-box" :title="userGroups.map(g => g.name).join(' / ')">
-                        <span v-for="g in userGroups" :key="g.id" class="group-readonly-tag">{{ g.name }}</span>
-                        <span v-if="userGroups.length === 0" class="group-readonly-empty">—</span>
-                    </div>
+                    <Select v-model="form.userGroupIds" multiple transfer
+                        placeholder="默认选中当前组（提交不改变所在组）">
+                        <Option v-for="g in userGroups" :key="g.id" :value="g.id" :label="g.name" />
+                    </Select>
                 </FormItem>
                 </Col>
             </Row>
@@ -105,6 +105,7 @@
 
 <script setup lang="ts">
 import { computed, reactive, ref, watch } from "vue";
+import { useDefaultStore } from "@/store";
 
 /* ---------- Props / Emits ---------- */
 const props = withDefaults(defineProps<{
@@ -143,6 +144,7 @@ const defaultForm = (): Record<string, any> => ({
     gender: 0,
     userType: [] as number[],
     appRoles: [] as number[],
+    userGroupIds: [] as number[],
 });
 
 const form = reactive(defaultForm());
@@ -157,15 +159,25 @@ watch(() => props.initForm, (val) => {
 }, { immediate: true, deep: true });
 
 /* ---------- 用户身份（业务身份多选）---------- */
-const userTypeOptions = [
-    { value: 1, label: '管理员' },
-    { value: 2, label: '老师' },
-    { value: 3, label: '校领导' },
-    { value: 4, label: '局领导' },
-    { value: 5, label: '学生' },
-    { value: 6, label: '家长' },
-    { value: 7, label: '工作号' },
+// 唯一真源：后端 SysRoleEnum（经 GetSysDict.sysrole 下发），杜绝前端硬编码漂移。
+// 若字典未加载（接口异常）则回退到与 SysRoleEnum 完全一致的兜底值。
+const SYS_ROLE_FALLBACK = [
+    { value: 1, label: '老师' },
+    { value: 2, label: '校领导' },
+    { value: 3, label: '学生' },
+    { value: 4, label: '家长' },
+    { value: 5, label: '局领导' },
+    { value: 6, label: '工作号' },
+    { value: 7, label: '管理员' },
 ];
+const store = useDefaultStore();
+const userTypeOptions = computed(() => {
+    const sysrole = (store.getSysDict as any)?.sysrole;
+    if (Array.isArray(sysrole) && sysrole.length) {
+        return sysrole.map((it: any) => ({ value: it.k, label: it.v }));
+    }
+    return SYS_ROLE_FALLBACK;
+});
 
 /* ---------- 校验规则 ---------- */
 // 自定义确认密码校验：新增必填且必须与密码一致；编辑时两者皆空表示不修改，任一非空则必须一致
@@ -296,44 +308,4 @@ function onVisibleChange(val: boolean) {
     flex-wrap: wrap;
     gap: 0 18px;
 }
-
-/* 所在组(只读)：白底圆角盒子 + 标签展示，视觉等同只读 Select。
-   改用纯 Vue 渲染，彻底绕开 view-ui-plus disabled+multiple Select
-   在「空数据挂载后异步补选项」时不重渲染已选标签的渲染竞态。 */
-.group-readonly-box {
-    min-height: 32px;
-    border: 1px solid #dcdee2;
-    border-radius: 4px;
-    background: #fff;
-    padding: 3px 7px;
-    display: flex;
-    flex-wrap: wrap;
-    align-items: center;
-    gap: 4px 6px;
-    cursor: default;
-    transition: border-color .2s ease;
-}
-
-.group-readonly-tag {
-    display: inline-flex;
-    align-items: center;
-    height: 24px;
-    line-height: 22px;
-    padding: 0 8px;
-    border: 1px solid #e3e5e8;
-    border-radius: 3px;
-    background: #f7f7f7;
-    color: #515a6e;
-    font-size: 12px;
-    white-space: nowrap;
-    max-width: 100%;
-    overflow: hidden;
-    text-overflow: ellipsis;
-}
-
-.group-readonly-empty {
-    color: #c5c8ce;
-    font-size: 13px;
-    line-height: 24px;
-}
 </style>