修改bug

src/views/account-management/account/index.vue

@@ -67,11 +67,34 @@
                 v-model="formData.user_type"
                 placeholder="请选择账号类型"
                 style="width: 100%"
+                @change="handleUserTypeChange"
               >
                 <ElOption label="超级管理员" :value="1" />
                 <ElOption label="平台用户" :value="2" />
               </ElSelect>
             </ElFormItem>
+            <ElFormItem v-if="dialogType === 'add' && formData.user_type === 2" label="分配角色">
+              <ElSelect
+                v-model="formData.role_id"
+                placeholder="请选择角色（可选）"
+                style="width: 100%"
+                clearable
+              >
+                <ElOption
+                  v-for="role in availableRolesForCreate"
+                  :key="role.ID"
+                  :label="role.role_name"
+                  :value="role.ID"
+                >
+                  <div style="display: flex; justify-content: space-between; align-items: center">
+                    <span>{{ role.role_name }}</span>
+                    <ElTag :type="role.role_type === 1 ? 'primary' : 'success'" size="small">
+                      {{ role.role_type === 1 ? '平台角色' : '客户角色' }}
+                    </ElTag>
+                  </div>
+                </ElOption>
+              </ElSelect>
+            </ElFormItem>
           </ElForm>
           <template #footer>
             <div class="dialog-footer">
@@ -105,18 +128,18 @@
                 />
               </div>
               <div class="panel-body">
-                <ElCheckboxGroup v-model="rolesToAdd" class="role-list">
+                <ElRadioGroup v-model="roleToAdd" class="role-list">
                   <div v-for="role in filteredAvailableRoles" :key="role.ID" class="role-item">
-                    <ElCheckbox :label="role.ID" :disabled="selectedRoles.includes(role.ID)">
+                    <ElRadio :label="role.ID" :disabled="selectedRoles.includes(role.ID)">
                       <span class="role-info">
                         <span>{{ role.role_name }}</span>
                         <ElTag :type="role.role_type === 1 ? 'primary' : 'success'" size="small">
                           {{ role.role_type === 1 ? '平台角色' : '客户角色' }}
                         </ElTag>
                       </span>
-                    </ElCheckbox>
+                    </ElRadio>
                   </div>
-                </ElCheckboxGroup>
+                </ElRadioGroup>
               </div>
             </div>
 
@@ -126,9 +149,9 @@
                 type="primary"
                 :icon="'ArrowRight'"
                 @click="addRoles"
-                :disabled="rolesToAdd.length === 0"
+                :disabled="!roleToAdd"
               >
-                添加
+                分配
               </ElButton>
             </div>
 
@@ -206,7 +229,7 @@
   const currentAccountType = ref<number>(0)
   const selectedRoles = ref<number[]>([])
   const allRoles = ref<PlatformRole[]>([])
-  const rolesToAdd = ref<number[]>([])
+  const roleToAdd = ref<number | undefined>(undefined)
   const leftRoleFilter = ref('')
   const rightRoleFilter = ref('')
 
@@ -364,6 +387,7 @@
       formData.shop_id = row.shop_id || null
       formData.enterprise_id = row.enterprise_id || null
       formData.password = ''
+      formData.role_id = undefined
     } else {
       formData.id = ''
       formData.username = ''
@@ -372,9 +396,16 @@
       formData.shop_id = null
       formData.enterprise_id = null
       formData.password = ''
+      formData.role_id = undefined
     }
   }
 
+  // 账号类型变更处理
+  const handleUserTypeChange = () => {
+    // 清空角色选择
+    formData.role_id = undefined
+  }
+
   // 删除账号
   const deleteAccount = (row: any) => {
     ElMessageBox.confirm(`确定要删除账号 ${row.username} 吗？`, '删除账号', {
@@ -506,7 +537,8 @@
     phone: '',
     user_type: 2,
     shop_id: null as number | null,
-    enterprise_id: null as number | null
+    enterprise_id: null as number | null,
+    role_id: undefined as number | undefined
   })
 
   onMounted(() => {
@@ -534,6 +566,28 @@
     }
   }
 
+  // 计算属性：新建账号时可选的角色（根据账号类型过滤）
+  const availableRolesForCreate = computed(() => {
+    let roles = allRoles.value
+
+    // 根据账号类型过滤角色
+    if (formData.user_type === 1) {
+      // 超级管理员：不能分配角色
+      return []
+    } else if (formData.user_type === 2) {
+      // 平台用户：只显示平台角色
+      roles = roles.filter((role) => role.role_type === 1)
+    } else if (formData.user_type === 3) {
+      // 代理账号：只显示客户角色
+      roles = roles.filter((role) => role.role_type === 2)
+    } else if (formData.user_type === 4) {
+      // 企业账号：只显示客户角色
+      roles = roles.filter((role) => role.role_type === 2)
+    }
+
+    return roles
+  })
+
   // 计算属性：过滤后的可分配角色（根据账号类型过滤）
   const filteredAvailableRoles = computed(() => {
     let roles = allRoles.value
@@ -573,7 +627,7 @@
     currentAccountName.value = row.username
     currentAccountType.value = row.user_type
     selectedRoles.value = []
-    rolesToAdd.value = []
+    roleToAdd.value = undefined
     leftRoleFilter.value = ''
     rightRoleFilter.value = ''
 
@@ -596,24 +650,18 @@
     }
   }
 
-  // 批量添加角色
+  // 添加角色（单选）
   const addRoles = async () => {
-    if (rolesToAdd.value.length === 0) return
+    if (!roleToAdd.value) return
 
     try {
-      // 所有账号只能分配一个角色
-      if (rolesToAdd.value.length > 1) {
-        ElMessage.warning('只能分配一个角色')
-        return
-      }
-
       // 新角色会替换之前的角色
-      const newRoles = rolesToAdd.value
+      const newRoles = [roleToAdd.value]
 
       await AccountService.assignRolesToAccount(currentAccountId.value, newRoles)
 
       selectedRoles.value = newRoles
-      rolesToAdd.value = []
+      roleToAdd.value = undefined
 
       ElMessage.success('角色分配成功')
       // 刷新列表以更新角色显示
@@ -746,8 +794,23 @@
               data.enterprise_id = formData.enterprise_id
             }
 
-            await AccountService.createAccount(data)
-            ElMessage.success('添加成功')
+            const createRes = await AccountService.createAccount(data)
+
+            // 创建成功后分配角色（如果选择了）
+            if (createRes.code === 0) {
+              const accountId = createRes.data?.ID || createRes.data?.id
+              if (formData.role_id && accountId) {
+                try {
+                  await AccountService.assignRolesToAccount(accountId, [formData.role_id])
+                  ElMessage.success('账号创建并分配角色成功')
+                } catch (error) {
+                  console.error('分配角色失败:', error)
+                  ElMessage.warning('账号创建成功，但角色分配失败')
+                }
+              } else {
+                ElMessage.success('添加成功')
+              }
+            }
           } else {
             // 编辑账号 - 只提交username和phone
             const data: any = {
@@ -906,12 +969,16 @@
           display: flex;
           flex-direction: column;
           gap: 8px;
+          width: 100%;
 
           .role-item {
+            display: block;
+            width: 100%;
             padding: 10px 12px;
             border: 1px solid var(--el-border-color-lighter);
             border-radius: 4px;
             transition: all 0.2s;
+            box-sizing: border-box;
 
             &:hover {
               background: var(--el-fill-color-light);
@@ -925,10 +992,14 @@
               align-items: center;
             }
 
-            :deep(.el-checkbox) {
+            :deep(.el-checkbox),
+            :deep(.el-radio) {
+              display: flex;
               width: 100%;
 
-              .el-checkbox__label {
+              .el-checkbox__label,
+              .el-radio__label {
+                display: flex;
                 width: 100%;
               }
             }