fix: CRUD&CRUD2列搜索配置使用Form组件无法匹配问题 (#9032) (#9135)

Co-authored-by: wanglinfang <wanglinfang@baidu.com>

docs/zh-CN/components/crud.md

@@ -1011,6 +1011,36 @@ amis 只负责生成排序组件，并将排序参数传递给接口，而不会
 }
 ```
 
+也可以通过`searchable`来自定义搜索表单
+
+```schema: scope="body"
+{
+    "type": "crud",
+    "syncLocation": false,
+    "api": "/api/mock2/sample",
+    "columns": [
+        {
+            "name": "id",
+            "label": "ID"
+        },
+        {
+            "name": "engine",
+            "label": "Rendering engine",
+            "searchable": {
+              "type": "form",
+              "wrapWithPanel": false,
+              "body": [
+                {
+                  "type": "input-text",
+                  "name": "engine"
+                }
+              ]
+            }
+        }
+    ]
+}
+```
+
 amis 只负责生成搜索组件，并将搜索参数传递给接口，而不会在前端对数据进行搜索处理。参数格式如下：
 
 ```json
@@ -1074,7 +1104,7 @@ amis 只负责生成下拉选择器组件，并将搜索参数传递给接口，
 
 #### 下拉数据源
 
-过滤器的数据域支持API接口和上下文数据(`3.6.0`及以上版本)
+过滤器的数据域支持 API 接口和上下文数据(`3.6.0`及以上版本)
 
 ```schema
 {
@@ -3378,22 +3408,22 @@ itemAction 里的 onClick 还能通过 `data` 参数拿到当前行的数据，
 除了 Table 组件默认支持的列配置，CRUD 的列配置还额外支持以下属性：
 
 | 属性名             | 类型                                                            | 默认值  | 说明                                                                        | 版本 |
-| ------------------ | --------------------------------------------------------------- | ------- | --------------------------------------------------------------------------- | --- |
+| ------------------ | --------------------------------------------------------------- | ------- | --------------------------------------------------------------------------- | ---- |
 | sortable           | `boolean`                                                       | `false` | 是否可排序                                                                  |
 | searchable         | `boolean` \| `Schema`                                           | `false` | 是否可快速搜索，开启`autoGenerateFilter`后，`searchable`支持配置`Schema`    |
 | filterable         | `boolean` \| [`QuickFilterConfig`](./crud.md#quickfilterconfig) | `false` | 是否可快速搜索，`options`属性为静态选项，支持设置`source`属性从接口获取选项 |
 | quickEdit          | `boolean` \| [`QuickEditConfig`](./crud.md#quickeditconfig)     | -       | 快速编辑，一般需要配合`quickSaveApi`接口使用                                |
-| quickEditEnabledOn | `SchemaExpression`                                              | -       | 开启快速编辑条件[表达式](../../docs/concepts/expression)                    |     |
+| quickEditEnabledOn | `SchemaExpression`                                              | -       | 开启快速编辑条件[表达式](../../docs/concepts/expression)                    |      |
 
 #### QuickFilterConfig
 
-| 属性名        | 类型                          | 默认值  | 说明                                                     | 版本    |
+| 属性名        | 类型                                      | 默认值  | 说明                                                     | 版本                        |
-| ------------- | ----------------------------- | ------- | -------------------------------------------------------- | ------- |
+| ------------- | ----------------------------------------- | ------- | -------------------------------------------------------- | --------------------------- |
-| options       | `Array<any>`                  | -       | 静态选项                                                 |         |
+| options       | `Array<any>`                              | -       | 静态选项                                                 |                             |
-| multiple      | `boolean`                     | `false` | 是否支持多选                                             |         |
+| multiple      | `boolean`                                 | `false` | 是否支持多选                                             |                             |
-| source        | [`Api`](../../docs/types/api) \| `string`  | -       | 选项 API 接口                                            |   `3.6.0`版本后支持上下文变量      |
+| source        | [`Api`](../../docs/types/api) \| `string` | -       | 选项 API 接口                                            | `3.6.0`版本后支持上下文变量 |
-| refreshOnOpen | `boolean`                     | `false` | 配置 source 前提下，每次展开筛选浮层是否重新加载选项数据 | `2.9.0` |
+| refreshOnOpen | `boolean`                                 | `false` | 配置 source 前提下，每次展开筛选浮层是否重新加载选项数据 | `2.9.0`                     |
-| strictMode    | `boolean`                     | `false` | 严格模式，开启严格模式后，会采用 JavaScript 严格相等比较 | `2.3.0` |
+| strictMode    | `boolean`                                 | `false` | 严格模式，开启严格模式后，会采用 JavaScript 严格相等比较 | `2.3.0`                     |
 
 #### QuickEditConfig
 

packages/amis/src/renderers/Table/HeadCellSearchDropdown.tsx

@@ -81,14 +81,20 @@ export function HeadCellSearchDropDown({
       }
     }
 
-    if (schema) {
+    function findFormItems(schema: any) {
       Array.isArray(schema.body) &&
         schema.body.forEach((item: any) => {
           item.name && formItems.push(item.name);
           item.extraName &&
             typeof item.extraName === 'string' &&
             formItems.push(item.extraName);
+          findFormItems(item);
         });
+    }
+
+    if (schema) {
+      // schema有可能配置为{type: 'form', body[]} 所以真正的formItem需要到form的body里去找
+      findFormItems(schema);
       schema = {
         ...schema,
         type: 'form',

packages/amis/src/renderers/Table2/HeadCellSearchDropdown.tsx

@@ -117,14 +117,16 @@ export class HeadCellSearchDropDown extends React.Component<
     }
 
     if (schema) {
+      // 如果schema是直接配置的{type: 'form', body: []}
       const formItems: Array<string> = [];
-      schema.controls?.forEach(
+      (schema.controls || schema.body || []).forEach(
         (item: any) =>
           item.name &&
           item.name !== 'orderBy' &&
           item.name !== 'order' &&
           formItems.push(item.name)
       );
+
       this.formItems = formItems;
       schema = {
         ...schema,
@@ -291,6 +293,7 @@ export class HeadCellSearchDropDown extends React.Component<
 
 export default observer((props: HeadCellSearchProps) => {
   const store = props.store;
+
   return (
     <HeadCellSearchDropDown
       {...props}

packages/amis/src/renderers/Table2/index.tsx

@@ -1551,7 +1551,7 @@ export default class Table2 extends React.Component<Table2Props, object> {
 
   @autobind
   async handleSearch(name: string, values: any) {
-    const {data, dispatchEvent, store} = this.props;
+    const {data, dispatchEvent, store, onSearch} = this.props;
 
     const rendererEvent = await dispatchEvent(
       'columnSearch',
@@ -1566,6 +1566,8 @@ export default class Table2 extends React.Component<Table2Props, object> {
     }
 
     store.updateQuery(values);
+
+    onSearch && onSearch({[name]: values[name]});
   }
 
   @autobind