feat: table search form visible control (#5121)

* feat: table search form visible control

* chore: fix docs and demo

* chore: type error fixed

packages/effects/plugins/src/vxe-table/use-vxe-grid.vue

@@ -1,7 +1,10 @@
 <script lang="ts" setup>
 import type { VbenFormProps } from '@vben-core/form-ui';
 import type {
+  VxeGridDefines,
   VxeGridInstance,
+  VxeGridListeners,
+  VxeGridPropTypes,
   VxeGridProps as VxeTableGridProps,
 } from 'vxe-table';
 
@@ -57,6 +60,7 @@ const {
   formOptions,
   tableTitle,
   tableTitleHelp,
+  showSearchForm,
 } = usePriorityValues(props, state);
 
 const { isMobile } = usePreferences();
@@ -103,21 +107,37 @@ const toolbarOptions = computed(() => {
   const slotActions = slots[TOOLBAR_ACTIONS]?.();
   const slotTools = slots[TOOLBAR_TOOLS]?.();
 
+  const toolbarConfig: VxeGridPropTypes.ToolbarConfig = {
+    tools:
+      gridOptions.value?.toolbarConfig?.search && !!formOptions.value
+        ? [
+            {
+              code: 'search',
+              icon: 'vxe-icon--search',
+              circle: true,
+              status: showSearchForm.value ? 'primary' : undefined,
+              title: $t('common.search'),
+            },
+          ]
+        : [],
+  };
+
   if (!showToolbar.value) {
-    return {};
+    return { toolbarConfig };
   }
+
+  // if (gridOptions.value?.toolbarConfig?.search) {
+  // }
   // 强制使用固定的toolbar配置，不允许用户自定义
   // 减少配置的复杂度，以及后续维护的成本
-  return {
-    toolbarConfig: {
-      slots: {
-        ...(slotActions || showTableTitle.value
-          ? { buttons: TOOLBAR_ACTIONS }
-          : {}),
-        ...(slotTools ? { tools: TOOLBAR_TOOLS } : {}),
-      },
-    },
+  toolbarConfig.slots = {
+    ...(slotActions || showTableTitle.value
+      ? { buttons: TOOLBAR_ACTIONS }
+      : {}),
+    ...(slotTools ? { tools: TOOLBAR_TOOLS } : {}),
   };
+
+  return { toolbarConfig };
 });
 
 const options = computed(() => {
@@ -173,9 +193,19 @@ const options = computed(() => {
   return mergedOptions;
 });
 
+function onToolbarToolClick(event: VxeGridDefines.ToolbarToolClickEventParams) {
+  if (event.code === 'search') {
+    props.api?.toggleSearchForm?.();
+  }
+  (
+    gridEvents.value?.toolbarToolClick as VxeGridListeners['toolbarToolClick']
+  )?.(event);
+}
+
 const events = computed(() => {
   return {
     ...gridEvents.value,
+    toolbarToolClick: onToolbarToolClick,
   };
 });
 
@@ -304,7 +334,11 @@ onUnmounted(() => {
 
       <!-- form表单 -->
       <template #form>
-        <div v-if="formOptions" class="relative rounded py-3 pb-4">
+        <div
+          v-if="formOptions"
+          v-show="showSearchForm !== false"
+          class="relative rounded py-3 pb-4"
+        >
           <slot name="form">
             <Form>
               <template