pref:优化账号管理 请选择角色下拉框里可以点击新增角色

@@ -20,27 +20,64 @@
             toolbar
           />
         </template>
+        <template #roleSlot="{ model, field }">
+          <a-select
+            mode="multiple"
+            allowClear
+            placeholder="请选择角色"
+            v-model:value="model[field]"
+            :options="roleOptions.map((item) => ({ value: item.value, label: item.label }))"
+          >
+            <template #dropdownRender="{ menuNode: menu }">
+              <v-nodes :vnodes="menu" />
+              <a-divider style="margin: 4px 0" />
+              <div @click="handleOpenRole" style="padding: 4px 0; cursor: pointer">
+                <plus-outlined />
+                新增角色
+              </div>
+            </template>
+          </a-select>
+        </template>
       </BasicForm>
     </div>
   </BasicModal>
+  <RoleDrawer @register="registerRoleDrawer" @success="handleSuccess" />
 </template>
 <script lang="ts">
-  import { defineComponent, ref, computed, unref, reactive } from 'vue';
+  import { defineComponent, ref, computed, unref, reactive, onMounted } from 'vue';
   import { BasicModal, useModalInner } from '/@/components/Modal';
   import { BasicForm, useForm } from '/@/components/Form/index';
   import { accountFormSchema } from './account.data';
-  import { findCurrentUserRelation, SaveOrUpdateUserInfo } from '/@/api/system/system';
+  import {
+    findCurrentUserRelation,
+    SaveOrUpdateUserInfo,
+    filterRoleList,
+  } from '/@/api/system/system';
   import { BasicTree, TreeItem } from '/@/components/Tree';
   import { findCurrentUserGroups } from '/@/api/system/group';
   import { RoleOrOrganizationParam } from '/@/api/system/model/systemModel';
   import { useMessage } from '/@/hooks/web/useMessage';
   import { copyTransTreeFun } from '/@/utils/fnUtils';
+  import { TOption } from '/@/views/rule/linkedge/config/config.data';
+  import { PlusOutlined } from '@ant-design/icons-vue';
+  import { useDrawer } from '/@/components/Drawer';
+  import RoleDrawer from '../role/RoleDrawer.vue';
 
   export default defineComponent({
     name: 'AccountModal',
-    components: { BasicModal, BasicForm, BasicTree },
+    components: {
+      BasicModal,
+      BasicForm,
+      BasicTree,
+      PlusOutlined,
+      RoleDrawer,
+      VNodes: (_, { attrs }) => {
+        return attrs.vnodes;
+      },
+    },
     emits: ['success', 'register'],
     setup(_, { emit }) {
+      const roleOptions = ref<TOption[]>([]);
       const isUpdate = ref(true);
       const rowId = ref('');
       const organizationTreeData = ref<TreeItem[]>([]);
@@ -52,7 +89,29 @@
       const singleEditPostPhoneNumber = reactive({
         phoneNumber: '',
       });
+      const getRoleList = async () => {
+        const res = await filterRoleList();
+        console.log(res);
+        roleOptions.value = res.map((m) => {
+          return {
+            label: m.name,
+            value: m.id,
+          };
+        });
+      };
+      onMounted(async () => {
+        await getRoleList();
+      });
+      const [registerRoleDrawer, { openDrawer }] = useDrawer();
 
+      const handleOpenRole = () => {
+        openDrawer(true, {
+          isUpdate: false,
+        });
+      };
+      const handleSuccess = async () => {
+        await getRoleList();
+      };
       const [
         registerForm,
         { setFieldsValue, updateSchema, resetFields, validate, getFieldsValue },
@@ -163,6 +222,10 @@
         checkGroup,
         basicTreeRef,
         treeExpandData,
+        roleOptions,
+        registerRoleDrawer,
+        handleOpenRole,
+        handleSuccess,
       };
     },
   });
@@ -171,9 +234,11 @@
   :deep(.vben-basic-tree) {
     width: 100% !important;
   }
+
   :deep(.is-unflod) {
     display: none !important;
   }
+
   :deep(.is-flod) {
     display: none !important;
   }

-import { filterRoleList, isAccountExist, IsPhoneExist } from '/@/api/system/system';
+import { isAccountExist, IsPhoneExist } from '/@/api/system/system';
 import { BasicColumn } from '/@/components/Table';
 import { FormSchema } from '/@/components/Table';
 import { emailRule, ChineseRegexp, EmailRegexp, phoneRegexp } from '/@/utils/rules';
@@ -133,14 +133,9 @@ export const accountFormSchema: FormSchema[] = [
   {
     label: '角色',
     field: 'roleIds',
-    component: 'ApiSelect',
+    component: 'Select',
     colProps: { span: 12 },
-    componentProps: {
-      mode: 'multiple',
-      api: filterRoleList,
-      labelField: 'name',
-      valueField: 'id',
-    },
+    slot: 'roleSlot',
     rules: [
       {
         required: true,