diff --git a/docs/src/components/common-ui/vben-form.md b/docs/src/components/common-ui/vben-form.md
index 5b4c12ce625..ccb438c92fd 100644
--- a/docs/src/components/common-ui/vben-form.md
+++ b/docs/src/components/common-ui/vben-form.md
@@ -267,6 +267,7 @@ useVbenForm 返回的第二个参数，是一个对象，包含了一些表单
 | submitButtonOptions | 提交按钮组件参数 | `ActionButtonOptions` | - |
 | showDefaultActions | 是否显示默认操作按钮 | `boolean` | `true` |
 | collapsed | 是否折叠，在`是否展开，在showCollapseButton=true`时生效 | `boolean` | `false` |
+| collapseTriggerResize | 折叠时，触发`resize`事件 | `boolean` | `false` |
 | collapsedRows | 折叠时保持的行数 | `number` | `1` |
 | commonConfig | 表单项的通用配置，每个配置都会传递到每个表单项，表单项可覆盖 | `FormCommonConfig` | - |
 | schema | 表单项的每一项配置 | `FormSchema` | - |
diff --git a/packages/@core/ui-kit/form-ui/src/components/form-actions.vue b/packages/@core/ui-kit/form-ui/src/components/form-actions.vue
index 2f2b95ec45c..3c03c7573e3 100644
--- a/packages/@core/ui-kit/form-ui/src/components/form-actions.vue
+++ b/packages/@core/ui-kit/form-ui/src/components/form-actions.vue
@@ -1,9 +1,9 @@
 <script setup lang="ts">
-import { computed, toRaw, unref } from 'vue';
+import { computed, toRaw, unref, watch } from 'vue';
 
 import { useSimpleLocale } from '@vben-core/composables';
 import { VbenExpandableArrow } from '@vben-core/shadcn-ui';
-import { cn, isFunction } from '@vben-core/shared/utils';
+import { cn, isFunction, triggerWindowResize } from '@vben-core/shared/utils';
 
 import { COMPONENT_MAP } from '../config';
 import { injectFormProps } from '../use-form-context';
@@ -65,6 +65,16 @@ async function handleReset(e: Event) {
     form.resetForm();
   }
 }
+
+watch(
+  () => collapsed.value,
+  () => {
+    const props = unref(rootProps);
+    if (props.collapseTriggerResize) {
+      triggerWindowResize();
+    }
+  },
+);
 </script>
 <template>
   <div
diff --git a/packages/@core/ui-kit/form-ui/src/form-api.ts b/packages/@core/ui-kit/form-ui/src/form-api.ts
index 43496cb9981..e82b5584d71 100644
--- a/packages/@core/ui-kit/form-ui/src/form-api.ts
+++ b/packages/@core/ui-kit/form-ui/src/form-api.ts
@@ -24,6 +24,7 @@ function getDefaultState(): VbenFormProps {
     actionWrapperClass: '',
     collapsed: false,
     collapsedRows: 1,
+    collapseTriggerResize: false,
     commonConfig: {},
     handleReset: undefined,
     handleSubmit: undefined,
diff --git a/packages/@core/ui-kit/form-ui/src/types.ts b/packages/@core/ui-kit/form-ui/src/types.ts
index 3d5fb10a003..7386c2879bf 100644
--- a/packages/@core/ui-kit/form-ui/src/types.ts
+++ b/packages/@core/ui-kit/form-ui/src/types.ts
@@ -244,6 +244,11 @@ export interface FormRenderProps<
    * @default 1
    */
   collapsedRows?: number;
+  /**
+   * 是否触发resize事件
+   * @default false
+   */
+  collapseTriggerResize?: boolean;
   /**
    * 表单项通用后备配置，当子项目没配置时使用这里的配置，子项目配置优先级高于此配置
    */
diff --git a/packages/effects/plugins/package.json b/packages/effects/plugins/package.json
index c3146b1507f..dfaf1f9e281 100644
--- a/packages/effects/plugins/package.json
+++ b/packages/effects/plugins/package.json
@@ -24,10 +24,12 @@
     }
   },
   "dependencies": {
+    "@vben-core/form-ui": "workspace:*",
     "@vben-core/shadcn-ui": "workspace:*",
     "@vben-core/shared": "workspace:*",
     "@vben/hooks": "workspace:*",
     "@vben/icons": "workspace:*",
+    "@vben/locales": "workspace:*",
     "@vben/preferences": "workspace:*",
     "@vben/types": "workspace:*",
     "@vben/utils": "workspace:*",
diff --git a/packages/effects/plugins/postcss.config.mjs b/packages/effects/plugins/postcss.config.mjs
new file mode 100644
index 00000000000..3d807045561
--- /dev/null
+++ b/packages/effects/plugins/postcss.config.mjs
@@ -0,0 +1 @@
+export { default } from '@vben/tailwind-config/postcss';
diff --git a/packages/effects/plugins/src/vxe-table/api.ts b/packages/effects/plugins/src/vxe-table/api.ts
index 13022260672..07db122ef36 100644
--- a/packages/effects/plugins/src/vxe-table/api.ts
+++ b/packages/effects/plugins/src/vxe-table/api.ts
@@ -23,6 +23,7 @@ function getDefaultState(): VxeGridProps {
       total: 0,
     },
     gridEvents: {},
+    formOptions: undefined,
   };
 }
 
diff --git a/packages/effects/plugins/src/vxe-table/init.ts b/packages/effects/plugins/src/vxe-table/init.ts
index 45e1f742c0c..6a71d3adfe5 100644
--- a/packages/effects/plugins/src/vxe-table/init.ts
+++ b/packages/effects/plugins/src/vxe-table/init.ts
@@ -3,6 +3,7 @@ import type { SetupVxeTable } from './types';
 import { defineComponent, watch } from 'vue';
 
 import { usePreferences } from '@vben/preferences';
+import { useVbenForm } from '@vben-core/form-ui';
 
 import {
   VxeButton,
@@ -29,6 +30,7 @@ import {
   // VxeTextarea,
 } from 'vxe-pc-ui';
 import enUS from 'vxe-pc-ui/lib/language/en-US';
+
 // 导入默认的语言
 import zhCN from 'vxe-pc-ui/lib/language/zh-CN';
 import {
@@ -42,6 +44,9 @@ import {
 // 是否加载过
 let isInit = false;
 
+// eslint-disable-next-line import/no-mutable-exports
+export let useTableForm: typeof useVbenForm;
+
 // 部分组件，如果没注册，vxe-table 会报错，这里实际没用组件，只是为了不报错，同时可以减少打包体积
 const createVirtualComponent = (name = '') => {
   return defineComponent({
@@ -89,8 +94,10 @@ export function initVxeTable() {
 }
 
 export function setupVbenVxeTable(setupOptions: SetupVxeTable) {
+  const { configVxeTable, useVbenForm } = setupOptions;
+
   initVxeTable();
-  const { configVxeTable } = setupOptions;
+  useTableForm = useVbenForm;
 
   const preference = usePreferences();
 
diff --git a/packages/effects/plugins/src/vxe-table/types.ts b/packages/effects/plugins/src/vxe-table/types.ts
index e93a53a70fe..118b1b8b9c5 100644
--- a/packages/effects/plugins/src/vxe-table/types.ts
+++ b/packages/effects/plugins/src/vxe-table/types.ts
@@ -1,4 +1,5 @@
 import type { DeepPartial } from '@vben/types';
+import type { VbenFormProps } from '@vben-core/form-ui';
 import type { VbenPaginationProps } from '@vben-core/shadcn-ui';
 import type {
   VxeGridListeners,
@@ -10,6 +11,8 @@ import type { VxeGridApi } from './api';
 
 import type { Ref } from 'vue';
 
+import { useVbenForm } from '@vben-core/form-ui';
+
 export interface VxePaginationInfo {
   currentPage: number;
   pageSize: number;
@@ -30,6 +33,10 @@ export interface VxeGridProps {
    */
   gridOptions?: DeepPartial<VxeTableGridProps>;
   gridEvents?: DeepPartial<VxeGridListeners>;
+  /**
+   * 表单配置
+   */
+  formOptions?: VbenFormProps;
   /**
    * 分页样式
    */
@@ -52,4 +59,5 @@ export type ExtendedVxeGridApi = {
 
 export interface SetupVxeTable {
   configVxeTable: (ui: VxeUIExport) => void;
+  useVbenForm: typeof useVbenForm;
 }
diff --git a/packages/effects/plugins/src/vxe-table/use-vxe-grid.vue b/packages/effects/plugins/src/vxe-table/use-vxe-grid.vue
index 9eed4d2315c..dfe287f5aeb 100644
--- a/packages/effects/plugins/src/vxe-table/use-vxe-grid.vue
+++ b/packages/effects/plugins/src/vxe-table/use-vxe-grid.vue
@@ -1,4 +1,5 @@
 <script lang="ts" setup>
+import type { VbenFormProps } from '@vben-core/form-ui';
 import type {
   VxeGridInstance,
   VxeGridProps as VxeTableGridProps,
@@ -10,6 +11,7 @@ import { computed, onMounted, toRaw, useSlots, useTemplateRef } from 'vue';
 
 import { usePriorityValues } from '@vben/hooks';
 import { EmptyIcon } from '@vben/icons';
+import { $t } from '@vben/locales';
 import {
   cn,
   getNestedValue,
@@ -20,6 +22,8 @@ import { VbenLoading, VbenPagination } from '@vben-core/shadcn-ui';
 
 import { VxeGrid, VxeUI } from 'vxe-table';
 
+import { useTableForm } from './init';
+
 import 'vxe-table/styles/cssvar.scss';
 import 'vxe-pc-ui/styles/cssvar.scss';
 import './theme.css';
@@ -42,10 +46,13 @@ const {
   gridClass,
   paginationInfo,
   gridEvents,
+  formOptions,
 } = usePriorityValues(props, state);
 
 const slots = useSlots();
 
+const [Form, formApi] = useTableForm({});
+
 const showToolbar = computed(() => {
   return !!slots['toolbar-actions']?.() || !!slots['toolbar-tools']?.();
 });
@@ -79,6 +86,9 @@ const options = computed(() => {
     mergedOptions.proxyConfig.enabled = !!ajax;
   }
 
+  if (!showToolbar.value && mergedOptions.toolbarConfig) {
+    mergedOptions.toolbarConfig.enabled = false;
+  }
   return mergedOptions;
 });
 
@@ -88,11 +98,51 @@ const events = computed(() => {
   };
 });
 
+const vbenFormOptions = computed(() => {
+  const defaultFormProps: VbenFormProps = {
+    handleSubmit: async () => {
+      props.api.reload(1);
+    },
+    handleReset: async () => {
+      formApi.resetForm();
+      props.api.reload(1);
+    },
+    collapseTriggerResize: true,
+    // 所有表单项共用，可单独在表单内覆盖
+    commonConfig: {
+      // 所有表单项
+      componentProps: {
+        class: 'w-full',
+      },
+    },
+    showCollapseButton: true,
+    submitButtonOptions: {
+      text: $t('common.query'),
+    },
+    // 大屏一行显示3个，中屏一行显示2个，小屏一行显示1个
+    wrapperClass: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-3',
+  };
+  return {
+    ...mergeWithArrayOverride({}, formOptions.value, defaultFormProps),
+  };
+});
+
 const delegatedSlots = computed(() => {
   const resultSlots: string[] = [];
 
   for (const key of Object.keys(slots)) {
-    if (!['empty', 'loading', 'pager'].includes(key)) {
+    if (!['empty', 'form', 'loading', 'pager'].includes(key)) {
+      resultSlots.push(key);
+    }
+  }
+  return resultSlots;
+});
+
+const delegatedFormSlots = computed(() => {
+  const resultSlots: string[] = [];
+
+  for (const key of Object.keys(slots)) {
+    if (key.startsWith('form-')) {
       resultSlots.push(key);
     }
   }
@@ -126,9 +176,11 @@ function extendProxyOptions(options: VxeTableGridProps) {
   // const responseResult = mergeOptions.proxyConfig.response?.result ?? 'result';
 
   const wrapperQuery = async (params: any, ...args: any[]) => {
+    const formValues = await formApi.getValues();
     const data = await configQuery(
       {
         ...params,
+        form: formValues,
         page: props.api.getPaginationInfo(),
       },
       ...args,
@@ -171,14 +223,14 @@ onMounted(() => {
 </script>
 
 <template>
-  <div :class="cn('bg-card h-full rounded-sm', className)">
+  <div :class="cn('bg-card h-full rounded-md', className)">
     <VxeGrid
       ref="gridRef"
       :class="
         cn(
           'p-2',
           {
-            'pt-0': showToolbar,
+            'pt-0': showToolbar && !formOptions,
           },
           gridClass,
         )
@@ -193,6 +245,24 @@ onMounted(() => {
       >
         <slot :name="slotName" v-bind="slotProps"></slot>
       </template>
+      <template #form>
+        <div v-if="formOptions" class="relative rounded py-3 pb-6">
+          <slot name="form">
+            <Form v-bind="vbenFormOptions">
+              <template
+                v-for="slotName in delegatedFormSlots"
+                :key="slotName"
+                #[slotName]="slotProps"
+              >
+                <slot :name="slotName" v-bind="slotProps"></slot>
+              </template>
+            </Form>
+          </slot>
+          <div
+            class="bg-background-deep z-100 absolute -left-2 bottom-2 h-4 w-[calc(100%+1rem)] overflow-hidden"
+          ></div>
+        </div>
+      </template>
       <template #loading>
         <slot name="loading">
           <VbenLoading :spinning="true" />
@@ -201,7 +271,7 @@ onMounted(() => {
       <template #empty>
         <slot name="empty">
           <EmptyIcon class="mx-auto" />
-          <div class="mt-2">暂无数据</div>
+          <div class="mt-2">{{ $t('common.noData') }}</div>
         </slot>
       </template>
       <template v-if="options.pagerConfig" #pager>
diff --git a/packages/effects/plugins/tailwind.config.mjs b/packages/effects/plugins/tailwind.config.mjs
new file mode 100644
index 00000000000..f17f556fa9f
--- /dev/null
+++ b/packages/effects/plugins/tailwind.config.mjs
@@ -0,0 +1 @@
+export { default } from '@vben/tailwind-config';
diff --git a/packages/locales/src/langs/en-US.json b/packages/locales/src/langs/en-US.json
index 6b42d8488b0..9048f49113b 100644
--- a/packages/locales/src/langs/en-US.json
+++ b/packages/locales/src/langs/en-US.json
@@ -31,7 +31,8 @@
     "confirm": "Comfirm",
     "noData": "No Data",
     "refresh": "Refresh",
-    "loadingMenu": "Loading Menu"
+    "loadingMenu": "Loading Menu",
+    "query": "Search"
   },
   "fallback": {
     "pageNotFound": "Oops! Page Not Found",
diff --git a/packages/locales/src/langs/zh-CN.json b/packages/locales/src/langs/zh-CN.json
index b5a24d7cd66..3b9acdc3749 100644
--- a/packages/locales/src/langs/zh-CN.json
+++ b/packages/locales/src/langs/zh-CN.json
@@ -31,7 +31,8 @@
     "confirm": "确认",
     "noData": "暂无数据",
     "refresh": "刷新",
-    "loadingMenu": "加载菜单中"
+    "loadingMenu": "加载菜单中",
+    "query": "查询"
   },
   "fallback": {
     "pageNotFound": "哎呀！未找到页面",
diff --git a/playground/src/adapter/vxe-table.ts b/playground/src/adapter/vxe-table.ts
index bee6564595b..969ec750d4c 100644
--- a/playground/src/adapter/vxe-table.ts
+++ b/playground/src/adapter/vxe-table.ts
@@ -4,6 +4,8 @@ import { setupVbenVxeTable, useVbenVxeGrid } from '@vben/plugins/vxe-table';
 
 import { Button, Image } from 'ant-design-vue';
 
+import { useVbenForm } from './form';
+
 setupVbenVxeTable({
   configVxeTable: (vxeUI) => {
     vxeUI.setConfig({
@@ -49,6 +51,7 @@ setupVbenVxeTable({
     // 这里可以自行扩展 vxe-table 的全局配置，比如自定义格式化
     // vxeUI.formats.add
   },
+  useVbenForm,
 });
 
 export { useVbenVxeGrid };
diff --git a/playground/src/views/examples/vxe-table/form.vue b/playground/src/views/examples/vxe-table/form.vue
index 1ff9dcfd589..5ffda90e14d 100644
--- a/playground/src/views/examples/vxe-table/form.vue
+++ b/playground/src/views/examples/vxe-table/form.vue
@@ -1,10 +1,8 @@
 <script lang="ts" setup>
-import type { VxeGridProps } from '#/adapter';
+import type { VbenFormProps, VxeGridProps } from '#/adapter';
 
 import { Page } from '@vben/common-ui';
 
-import { Button } from 'ant-design-vue';
-
 import { useVbenVxeGrid } from '#/adapter';
 import { getExampleTableApi } from '#/api';
 
@@ -17,6 +15,50 @@ interface RowType {
   releaseDate: string;
 }
 
+const formOptions: VbenFormProps = {
+  schema: [
+    {
+      component: 'Input',
+      fieldName: 'category',
+      label: 'Category',
+    },
+    {
+      component: 'Input',
+      fieldName: 'productName',
+      label: 'ProductName',
+    },
+    {
+      component: 'Input',
+      fieldName: 'price',
+      label: 'Price',
+    },
+    {
+      component: 'Select',
+      componentProps: {
+        allowClear: true,
+        options: [
+          {
+            label: 'Color1',
+            value: '1',
+          },
+          {
+            label: 'Color2',
+            value: '2',
+          },
+        ],
+        placeholder: '请选择',
+      },
+      fieldName: 'color',
+      label: 'Color',
+    },
+    {
+      component: 'DatePicker',
+      fieldName: 'datePicker',
+      label: 'Date',
+    },
+  ],
+};
+
 const gridOptions: VxeGridProps<RowType> = {
   checkboxConfig: {
     highlight: true,
@@ -36,32 +78,22 @@ const gridOptions: VxeGridProps<RowType> = {
   pagerConfig: {},
   proxyConfig: {
     ajax: {
-      query: async ({ page }) => {
+      query: async ({ form, page }) => {
         return await getExampleTableApi({
           page: page.currentPage,
           pageSize: page.pageSize,
+          ...form,
         });
       },
     },
   },
 };
 
-const [Grid, gridApi] = useVbenVxeGrid({ gridOptions });
-
-function reload(page?: number) {
-  gridApi.reload(page);
-}
+const [Grid] = useVbenVxeGrid({ formOptions, gridOptions });
 </script>
 
 <template>
   <Page auto-content-height>
-    <Grid>
-      <template #toolbar-tools>
-        <Button class="mr-2" type="primary" @click="reload()">
-          刷新当前页面
-        </Button>
-        <Button type="primary" @click="reload(1)"> 刷新并返回第一页 </Button>
-      </template>
-    </Grid>
+    <Grid />
   </Page>
 </template>
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 111896a46a9..0be8cbcc47b 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -1596,6 +1596,9 @@ importers:
 
   packages/effects/plugins:
     dependencies:
+      '@vben-core/form-ui':
+        specifier: workspace:*
+        version: link:../../@core/ui-kit/form-ui
       '@vben-core/shadcn-ui':
         specifier: workspace:*
         version: link:../../@core/ui-kit/shadcn-ui
@@ -1608,6 +1611,9 @@ importers:
       '@vben/icons':
         specifier: workspace:*
         version: link:../../icons
+      '@vben/locales':
+        specifier: workspace:*
+        version: link:../../locales
       '@vben/preferences':
         specifier: workspace:*
         version: link:../../preferences