Merge branch 'dev-v5_cmj' into dev-v5

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>

packages/@core/ui-kit/form-ui/src/form-render/form-field.vue

@@ -28,6 +28,7 @@ interface Props extends FormSchema {}
 const {
   commonComponentProps,
   component,
+  componentEvents,
   componentProps,
   dependencies,
   description,
@@ -159,6 +160,12 @@ const computedProps = computed(() => {
   };
 });
 
+const computedEvents = computed(() => {
+  return isFunction(componentEvents)
+    ? componentEvents(values.value, formApi!)
+    : componentEvents;
+});
+
 watch(
   () => computedProps.value?.autofocus,
   (value) => {
@@ -315,6 +322,7 @@ function autofocus() {
                 'border-destructive focus:border-destructive hover:border-destructive/80 focus:shadow-[0_0_0_2px_rgba(255,38,5,0.06)]':
                   isInValid,
               }"
+              v-on="computedEvents"
               v-bind="createComponentProps(slotProps)"
               :disabled="shouldDisabled"
             >

packages/@core/ui-kit/form-ui/src/types.ts

@@ -60,6 +60,8 @@ export type MaybeComponentPropKey =
   | keyof HtmlHTMLAttributes
   | (Record<never, never> & string);
 
+export type MaybeComponentEvents = { [K in MaybeComponentPropKey]?: any };
+
 export type MaybeComponentProps = { [K in MaybeComponentPropKey]?: any };
 
 export type FormActions = FormContext<GenericObject>;
@@ -128,6 +130,13 @@ export interface FormItemDependencies {
   triggerFields: string[];
 }
 
+type ComponentEvents =
+  | ((
+      value: Partial<Record<string, any>>,
+      actions: FormActions,
+    ) => MaybeComponentEvents)
+  | MaybeComponentEvents;
+
 type ComponentProps =
   | ((
       value: Partial<Record<string, any>>,
@@ -217,6 +226,8 @@ export interface FormSchema<
 > extends FormCommonConfig {
   /** 组件 */
   component: Component | T;
+  /** 组件事件 */
+  componentEvents?: ComponentEvents;
   /** 组件参数 */
   componentProps?: ComponentProps;
   /** 默认值 */