From 8142a7ab6da9503540070b443b24e3344a069858 Mon Sep 17 00:00:00 2001
From: roymondchen <roymondchen@tencent.com>
Date: Tue, 27 May 2025 14:58:29 +0800
Subject: [PATCH] =?UTF-8?q?feat(form):=20select=20before/after=20request?=
 =?UTF-8?q?=E9=85=8D=E7=BD=AE=E5=87=BD=E6=95=B0=E6=94=AF=E6=8C=81=E5=BC=82?=
 =?UTF-8?q?=E6=AD=A5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/form-schema/src/base.ts    |  4 ++--
 packages/form/src/fields/Select.vue | 30 +++++++++++++++++++----------
 2 files changed, 22 insertions(+), 12 deletions(-)

diff --git a/packages/form-schema/src/base.ts b/packages/form-schema/src/base.ts
index d34af7d0..e429baa2 100644
--- a/packages/form-schema/src/base.ts
+++ b/packages/form-schema/src/base.ts
@@ -283,7 +283,7 @@ type RemoteSelectOptionAfterRequestFunction = (
     prop: string;
     postOptions: Record<string, any>;
   },
-) => any;
+) => any | Promise<any>;
 
 type RemoteSelectOptionBeforeRequestFunction = (
   mForm: FormState | undefined,
@@ -295,7 +295,7 @@ type RemoteSelectOptionBeforeRequestFunction = (
     config: any;
     prop: string;
   },
-) => Record<string, any>;
+) => Record<string, any> | Promise<Record<string, any>>;
 
 type RemoteSelectOptionItemFunction = (optionsData: Record<string, any>) => SelectOption[] | SelectGroupOption[];
 type SelectOptionValueFunction = (item: Record<string, any>) => any;
diff --git a/packages/form/src/fields/Select.vue b/packages/form/src/fields/Select.vue
index 6a8a51c1..660ccb07 100644
--- a/packages/form/src/fields/Select.vue
+++ b/packages/form/src/fields/Select.vue
@@ -188,7 +188,7 @@ const getOptions = async () => {
   const requestFuc = getConfig('request') as Function;
 
   if (typeof option.beforeRequest === 'function') {
-    postOptions = option.beforeRequest(mForm, postOptions, {
+    postOptions = await option.beforeRequest(mForm, postOptions, {
       model: props.model,
       formValue: mForm?.values,
       formValues: mForm?.values,
@@ -204,7 +204,7 @@ const getOptions = async () => {
   let res = await requestFuc(postOptions);
 
   if (typeof option.afterRequest === 'function') {
-    res = option.afterRequest(mForm, res, {
+    res = await option.afterRequest(mForm, res, {
       model: props.model,
       formValue: mForm?.values,
       formValues: mForm?.values,
@@ -270,6 +270,7 @@ const getInitLocalOption = async () => {
   if (config.multiple && value.findIndex) {
     return (localOptions.value as any[]).filter((item) => value.findIndex((v: any) => equalValue(item.value, v)) > -1);
   }
+
   return (localOptions.value as any[]).filter((item) => equalValue(item.value, value));
 };
 
@@ -316,7 +317,7 @@ const getInitOption = async () => {
   };
 
   if (typeof option.beforeInitRequest === 'function') {
-    postOptions = option.beforeInitRequest(mForm, postOptions, {
+    postOptions = await option.beforeInitRequest(mForm, postOptions, {
       model: props.model,
       formValue: mForm?.values,
       formValues: mForm?.values,
@@ -333,7 +334,7 @@ const getInitOption = async () => {
   let res = await requestFuc(postOptions);
 
   if (typeof option.afterRequest === 'function') {
-    res = option.afterRequest(mForm, res, {
+    res = await option.afterRequest(mForm, res, {
       model: props.model,
       formValue: mForm?.values,
       formValues: mForm?.values,
@@ -359,6 +360,10 @@ const getInitOption = async () => {
   return options;
 };
 
+const setOptions = (data: SelectOption[] | SelectGroupOption[]) => {
+  options.value = data;
+};
+
 if (typeof props.config.options === 'function') {
   watchEffect(() => {
     typeof props.config.options === 'function' &&
@@ -371,12 +376,12 @@ if (typeof props.config.options === 'function') {
           config: props.config,
         }),
       ).then((data) => {
-        options.value = data;
+        setOptions(data);
       });
   });
 } else if (Array.isArray(props.config.options)) {
   watchEffect(() => {
-    options.value = props.config.options as SelectOption[] | SelectGroupOption[];
+    setOptions(props.config.options as SelectOption[] | SelectGroupOption[]);
   });
 } else if (props.config.option) {
   onBeforeMount(() => {
@@ -384,7 +389,7 @@ if (typeof props.config.options === 'function') {
     const v = props.model[props.name];
     if (Array.isArray(v) ? v.length : typeof v !== 'undefined') {
       getInitOption().then((data) => {
-        options.value = data;
+        setOptions(data);
       });
     }
   });
@@ -413,7 +418,7 @@ if (props.config.remote) {
         }
         moreLoadingVisible.value = true;
         pgIndex.value += 1;
-        options.value = await getOptions();
+        setOptions(await getOptions());
         moreLoadingVisible.value = false;
       });
     },
@@ -438,7 +443,7 @@ const visibleHandler = async (visible: boolean) => {
     tMagicSelect.value.setPreviousQuery(query.value);
     tMagicSelect.value.setSelectedLabel(query.value);
   } else if (options.value.length <= (props.config.multiple ? props.model?.[props.name].length : 1)) {
-    options.value = await getOptions();
+    setOptions(await getOptions());
   }
 };
 
@@ -446,7 +451,7 @@ const remoteMethod = async (q: string) => {
   if (!localOptions.value.length) {
     query.value = q;
     pgIndex.value = 0;
-    options.value = await getOptions();
+    setOptions(await getOptions());
     // 多选时如果过滤选项会导致已选好的标签异常，需要重新刷新一下el-select的状态
     if (props.config.multiple)
       setTimeout(() => {
@@ -454,4 +459,9 @@ const remoteMethod = async (q: string) => {
       }, 0);
   }
 };
+
+defineExpose({
+  options,
+  setOptions,
+});
 </script>