refactor: 改进数据源选择组件逻辑

apps/web-antd/src/views/infra/codegen/codegen.data.ts

@@ -3,6 +3,8 @@ import type { VbenFormProps } from '@vben/common-ui';
 import type { VxeGridProps } from '#/adapter/vxe-table';
 import type { CodegenApi } from '#/api/infra/codegen';
 
+import { getDataSourceConfigList } from '#/api/infra/data-source-config';
+
 export namespace CodegenDefaultData {
   /**
    * 代码生成字段定义 表格配置
@@ -78,10 +80,22 @@ export namespace CodegenImportTableModalData {
     {
       label: '数据源',
       fieldName: 'dataSourceConfigId',
-      component: 'Select',
+      component: 'ApiSelect',
       componentProps: {
+        defaultSelectedFirst: true,
         allowClear: true,
         placeholder: '请选择数据源',
+        api: getDataSourceConfigList,
+        labelField: 'name',
+        valueField: 'id',
+      },
+      componentEvents: (events, formApi) => {
+        return {
+          optionsChange: (value: any) => {
+            // 设置默认选中第一个
+            formApi.setFieldValue('dataSourceConfigId', value[0].id);
+          },
+        };
       },
     },
     {

apps/web-antd/src/views/infra/codegen/components/import-table-modal.vue

@@ -9,19 +9,12 @@ import {
 } from '@vben/plugins/vxe-table';
 
 import { getSchemaTableList } from '#/api/infra/codegen';
-import {
-  type DataSourceConfigApi,
-  getDataSourceConfigList,
-} from '#/api/infra/data-source-config';
 
 import { CodegenImportTableModalData } from '../codegen.data';
 
 // checked
 const checkedStatus = ref<boolean>(false);
 
-const dataSourceConfigList =
-  ref<DataSourceConfigApi.DataSourceConfigRespVO[]>();
-
 /**
  * 表格查询表单配置
  */
@@ -82,31 +75,8 @@ const [Grid, gridApi] = useVbenVxeGrid(
 
 const [Modal] = useVbenModal({
   class: 'w-[800px] h-[800px]',
-  onOpenChange: async (isOpen) => {
+  onOpened: async () => {
-    if (isOpen) {
+    gridApi.reload(await gridApi.formApi.getValues());
-      // 获取数据源配置列表
-      dataSourceConfigList.value = await getDataSourceConfigList();
-      // 设置下拉框
-      gridApi.formApi.updateSchema([
-        {
-          fieldName: 'dataSourceConfigId',
-          componentProps: {
-            options: dataSourceConfigList.value?.map((item) => ({
-              label: item.name,
-              value: item.id,
-            })),
-          },
-        },
-      ]);
-      // 设置默认值
-      gridApi.formApi.setFieldValue(
-        'dataSourceConfigId',
-        dataSourceConfigList.value?.[0]?.id,
-      );
-
-      // 加载表格数据
-      gridApi.reload(await gridApi.formApi.getValues());
-    }
   },
 });
 </script>