ele-admin-plus 1.4.1-beta.1 → 1.5.0-beta.1

package/lib/ele-crud/components/table-extra.d.ts

@@ -2,7 +2,7 @@ import { PropType } from 'vue';
 import { UserComponent } from '../../ele-app/types';
 import { DataItem } from '../../ele-data-table/types';
 import { ProFormItemTypeData, ScreenSize } from '../../ele-pro-form/types';
-import { EditConfig, BtnClickAction, CrudField, EditApi, DeletePopOption, GetAndCacheCodeFunction, CrudLocale } from '../types';
+import { EditConfig, BtnClickAction, CrudField, EditApi, GetAndCacheCodeFunction, CrudLocale } from '../types';
 
 declare function __VLS_template(): Partial<Record<string, (_: any) => any>> & Partial<Record<string, (_: any) => any>> & {
     default?(_: {}): any;
@@ -16,8 +16,6 @@ declare const __VLS_component: import('vue').DefineComponent<import('vue').Extra
     editVisible: PropType<boolean>;
     /** 修改弹窗数据 */
     editData: PropType<DataItem>;
-    /** 删除气泡配置 */
-    deletePopOption: PropType<DeletePopOption>;
     /** 添加配置 */
     addConfig: PropType<EditConfig | boolean>;
     /** 修改配置 */
@@ -49,9 +47,9 @@ declare const __VLS_component: import('vue').DefineComponent<import('vue').Extra
 }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     editError: (_e: Error) => void;
     addError: (_e: Error) => void;
-    btnClick: (_action: BtnClickAction, _e: MouseEvent, _item?: DataItem | undefined) => void;
     "update:addVisible": (_visible?: boolean | undefined) => void;
     "update:editVisible": (_visible?: boolean | undefined) => void;
+    btnClick: (_action: BtnClickAction, _e: MouseEvent, _item?: DataItem | undefined) => void;
     addDone: (_msg?: string | undefined) => void;
     editDone: (_msg?: string | undefined) => void;
 }, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
@@ -63,8 +61,6 @@ declare const __VLS_component: import('vue').DefineComponent<import('vue').Extra
     editVisible: PropType<boolean>;
     /** 修改弹窗数据 */
     editData: PropType<DataItem>;
-    /** 删除气泡配置 */
-    deletePopOption: PropType<DeletePopOption>;
     /** 添加配置 */
     addConfig: PropType<EditConfig | boolean>;
     /** 修改配置 */
@@ -96,9 +92,9 @@ declare const __VLS_component: import('vue').DefineComponent<import('vue').Extra
 }>> & Readonly<{
     onEditError?: ((_e: Error) => any) | undefined;
     onAddError?: ((_e: Error) => any) | undefined;
-    onBtnClick?: ((_action: BtnClickAction, _e: MouseEvent, _item?: DataItem | undefined) => any) | undefined;
     "onUpdate:addVisible"?: ((_visible?: boolean | undefined) => any) | undefined;
     "onUpdate:editVisible"?: ((_visible?: boolean | undefined) => any) | undefined;
+    onBtnClick?: ((_action: BtnClickAction, _e: MouseEvent, _item?: DataItem | undefined) => any) | undefined;
     onAddDone?: ((_msg?: string | undefined) => any) | undefined;
     onEditDone?: ((_msg?: string | undefined) => any) | undefined;
 }>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;

package/lib/ele-crud/index.cjs

@@ -1,5 +1,7 @@
 "use strict";
 const vue = require("vue");
+const elementPlus = require("element-plus");
+const index$1 = require("../icons/index");
 const receiver = require("../ele-config-provider/receiver");
 const common = require("../utils/common");
 const hook = require("../utils/hook");
@@ -12,8 +14,7 @@ const EleProForm = require("../ele-pro-form/index");
 const util$1 = require("../ele-pro-form/util");
 const EleSplitPanel = require("../ele-split-panel/index");
 const util$2 = require("../ele-data-table/util");
-const TableToolbar = require("./components/table-toolbar");
-const TableAction = require("./components/table-action");
+const EleButtons = require("../ele-buttons/index");
 const TableExtra = require("./components/table-extra");
 const PageSide = require("./components/page-side");
 const util = require("./util");
@@ -44,14 +45,135 @@ const index = /* @__PURE__ */ vue.defineComponent({
     const addData = vue.ref();
     const editVisible = vue.ref(false);
     const editData = vue.ref();
-    const deletePopOption = vue.ref();
+    const toolbarBtnItems = vue.computed(() => {
+      const listConfig = props2.listConfig || {};
+      const addBtnProps = listConfig.addBtnProps;
+      const delBtnProps = listConfig.delBtnProps;
+      const items = [];
+      if (addBtnProps !== false) {
+        items.push({
+          preset: "add",
+          props: addBtnProps === true ? void 0 : addBtnProps,
+          onClick: () => handleBtnClick("add")
+        });
+      }
+      if (delBtnProps !== false) {
+        items.push({
+          preset: "delBatch",
+          props: delBtnProps === true ? void 0 : delBtnProps,
+          onClick: () => handleBtnClick("delSelections")
+        });
+      }
+      return items;
+    });
+    const actionBtnItems = vue.computed(() => {
+      const listConfig = props2.listConfig || {};
+      const editLinkProps = listConfig.editLinkProps;
+      const delLinkProps = listConfig.delLinkProps;
+      const delPopConfirmProps = listConfig.delPopConfirmProps;
+      const items = [];
+      if (editLinkProps !== false) {
+        items.push({
+          preset: "edit",
+          props: editLinkProps === true ? void 0 : editLinkProps,
+          command: "edit"
+        });
+      }
+      if (delLinkProps !== false) {
+        const item = {
+          preset: "del",
+          props: delLinkProps === true ? void 0 : delLinkProps,
+          command: "del"
+        };
+        if (delPopConfirmProps != null && typeof delPopConfirmProps === "object" && delPopConfirmProps.isPopConfirm) {
+          item.popconfirmProps = {
+            content: lang.value.deleteConfirm,
+            popperOptions: {
+              strategy: "fixed",
+              modifiers: [{
+                name: "offset",
+                options: {
+                  offset: [12, 6]
+                }
+              }]
+            },
+            ...common.omit(delPopConfirmProps, ["isPopConfirm"])
+          };
+          item.command = "delConfirm";
+        }
+        items.push(item);
+      }
+      return items;
+    });
+    const tableColumns = vue.computed(() => {
+      const listConfig = props2.listConfig || {};
+      const userColumns = listConfig.tableProps?.columns;
+      if (userColumns?.length) {
+        return userColumns;
+      }
+      const fields = props2.fields;
+      const {
+        selectionColumnProps,
+        indexColumnProps,
+        actionColumnProps
+      } = listConfig;
+      const columns = [];
+      if (selectionColumnProps !== false) {
+        columns.push({
+          type: "selection",
+          columnKey: "selection",
+          width: 50,
+          align: "center",
+          fixed: "left",
+          ...(selectionColumnProps === true ? void 0 : selectionColumnProps) || {}
+        });
+      }
+      if (indexColumnProps !== false) {
+        columns.push({
+          type: "index",
+          columnKey: "index",
+          width: 50,
+          align: "center",
+          fixed: "left",
+          ...(indexColumnProps === true ? void 0 : indexColumnProps) || {}
+        });
+      }
+      common.mapTree(fields || [], (field) => {
+        if (field.hideInList === "flat") {
+          return "flatChildren";
+        } else if (!field.hideInList) {
+          return {
+            columnKey: field.key,
+            prop: field.prop,
+            label: field.label,
+            ...field.columnProps || {}
+          };
+        }
+      }).forEach((column) => {
+        columns.push(column);
+      });
+      if (actionColumnProps !== false) {
+        columns.push({
+          columnKey: "action",
+          label: lang.value.action,
+          width: 156,
+          align: "center",
+          fixed: "right",
+          slot: "action",
+          hideInPrint: true,
+          hideInExport: true,
+          ...(actionColumnProps === true ? void 0 : actionColumnProps) || {}
+        });
+      }
+      return columns;
+    });
     const searchFormProps = vue.computed(() => {
       const searchConfig = (props2.searchConfig === true ? void 0 : props2.searchConfig) || {};
       return searchConfig.formProps || {};
     });
     const searchFormItems = vue.computed(() => {
       const items = searchFormProps.value.items;
-      return (items == null ? void 0 : items.length) ? items : util.getFieldsSearchFormItems(props2.fields);
+      return items?.length ? items : util.getFieldsSearchFormItems(props2.fields);
     });
     const searchFormData = vue.reactive(util$1.getFormInitValue(searchFormItems.value, searchFormProps.value.itemTypeData || props2.itemTypeData, true));
     const searchWhere = vue.ref(util$1.cloneDeep(searchFormData));
@@ -59,6 +181,7 @@ const index = /* @__PURE__ */ vue.defineComponent({
     const treeData = vue.ref([]);
     const treeLoading = vue.ref(false);
     const treeErrorMessage = vue.ref();
+    const treeSearchkeywords = vue.ref("");
     const splitPanelCollapse = vue.ref(false);
     const [isMobile] = hook.useMobile((mobile) => {
       splitPanelCollapse.value = mobile;
@@ -74,19 +197,18 @@ const index = /* @__PURE__ */ vue.defineComponent({
       return result;
     };
     const tableDatasource = (params) => {
-      var _a, _b, _c, _d;
-      const datasource = ((_b = (_a = props2.listConfig) == null ? void 0 : _a.tableProps) == null ? void 0 : _b.datasource) || props2.listApi;
+      const datasource = props2.listConfig?.tableProps?.datasource || props2.listApi;
       if (datasource && Array.isArray(datasource)) {
         return Promise.resolve(datasource);
       }
       const func = typeof datasource === "function" ? datasource : typeof datasource === "string" && datasource.startsWith(util.codeStringPrefix) ? getAndCacheCode(datasource) : void 0;
-      const showSide = !!((_c = props2.pageConfig) == null ? void 0 : _c.splitPanelProps);
+      const showSide = !!props2.pageConfig?.splitPanelProps;
       if (!func || showSide && treeSelectedValue.value == null) {
         return Promise.resolve([]);
       }
       const where = {};
       if (showSide && treeSelectedValue.value != null) {
-        const filterField = (_d = props2.pageConfig) == null ? void 0 : _d.tableFilterField;
+        const filterField = props2.pageConfig?.tableFilterField;
         if (filterField) {
           util$1.setValue(where, filterField, treeSelectedValue.value);
         }
@@ -105,8 +227,7 @@ const index = /* @__PURE__ */ vue.defineComponent({
       emit("tableSelectionsChange", data);
     };
     const reloadTable = (page) => {
-      var _a, _b;
-      (_b = (_a = tableRef.value) == null ? void 0 : _a.reload) == null ? void 0 : _b.call(_a, {
+      tableRef.value?.reload?.({
         page
       });
     };
@@ -125,15 +246,14 @@ const index = /* @__PURE__ */ vue.defineComponent({
       util$1.mergeValue(searchFormData, util$1.getFormInitValue(searchFormItems.value, searchFormProps.value.itemTypeData || props2.itemTypeData, true));
       handleSubmitSearchForm();
     };
-    const handleBtnClick = (action, e, item) => {
-      var _a, _b, _c, _d;
+    const handleBtnClick = (action, item) => {
       if (action === "delConfirm") {
         handleDelete(item ? [item] : void 0);
       } else if (action === "del") {
-        const delPopConfirmProps = (_a = props2.listConfig) == null ? void 0 : _a.delPopConfirmProps;
+        const delPopConfirmProps = props2.listConfig?.delPopConfirmProps;
         if (delPopConfirmProps === false) {
           handleDelete(item ? [item] : void 0);
-        } else if (delPopConfirmProps === true || !(delPopConfirmProps == null ? void 0 : delPopConfirmProps.isPopConfirm)) {
+        } else {
           messageBox$1.confirm(lang.value.deleteConfirm, lang.value.deleteConfirmTitle, {
             type: "warning",
             draggable: true,
@@ -142,19 +262,13 @@ const index = /* @__PURE__ */ vue.defineComponent({
             handleDelete(item ? [item] : void 0);
           }).catch(() => {
           });
-        } else {
-          deletePopOption.value = {
-            item,
-            triggerEl: e.currentTarget,
-            confirmProps: delPopConfirmProps
-          };
         }
       } else if (action === "edit") {
         editData.value = item;
         editVisible.value = true;
       } else if (action === "add") {
-        const filterField = (_b = props2.pageConfig) == null ? void 0 : _b.tableFilterField;
-        if (((_c = props2.pageConfig) == null ? void 0 : _c.splitPanelProps) && treeSelectedValue.value != null && filterField) {
+        const filterField = props2.pageConfig?.tableFilterField;
+        if (props2.pageConfig?.splitPanelProps && treeSelectedValue.value != null && filterField) {
           const data = {};
           util$1.setValue(data, filterField, treeSelectedValue.value);
           addData.value = data;
@@ -171,7 +285,7 @@ const index = /* @__PURE__ */ vue.defineComponent({
           });
           return;
         }
-        const delConfirmProps = (_d = props2.listConfig) == null ? void 0 : _d.delConfirmProps;
+        const delConfirmProps = props2.listConfig?.delConfirmProps;
         if (delConfirmProps === false) {
           handleDelete(data);
         } else {
@@ -187,7 +301,6 @@ const index = /* @__PURE__ */ vue.defineComponent({
       }
     };
     const handleDelete = (data) => {
-      var _a, _b;
       if (!data || !props2.deleteApi) {
         return;
       }
@@ -199,7 +312,7 @@ const index = /* @__PURE__ */ vue.defineComponent({
         ...props2.messageOptions || {},
         message: lang.value.deleteLoading
       });
-      const rowKey = (_b = (_a = props2.listConfig) == null ? void 0 : _a.tableProps) == null ? void 0 : _b.rowKey;
+      const rowKey = props2.listConfig?.tableProps?.rowKey;
       const dataKeys = rowKey ? data.map((row) => util$2.getValue(row, rowKey)) : [];
       deleteApiFunc(dataKeys, data).then((msg) => {
         loading.close();
@@ -218,7 +331,7 @@ const index = /* @__PURE__ */ vue.defineComponent({
         } else {
           message$1.error({
             ...props2.messageOptions || {},
-            message: (e == null ? void 0 : e.message) ?? lang.value.deleteError
+            message: e?.message ?? lang.value.deleteError
           });
         }
       });
@@ -232,7 +345,7 @@ const index = /* @__PURE__ */ vue.defineComponent({
       } else {
         message$1.error({
           ...props2.messageOptions || {},
-          message: (e == null ? void 0 : e.message) ?? lang.value.addError
+          message: e?.message ?? lang.value.addError
         });
       }
     };
@@ -245,7 +358,7 @@ const index = /* @__PURE__ */ vue.defineComponent({
       } else {
         message$1.error({
           ...props2.messageOptions || {},
-          message: (e == null ? void 0 : e.message) ?? lang.value.editError
+          message: e?.message ?? lang.value.editError
         });
       }
     };
@@ -279,11 +392,10 @@ const index = /* @__PURE__ */ vue.defineComponent({
       }
     };
     const setTreeData = (data) => {
-      var _a;
       treeLoading.value = false;
       treeData.value = data || [];
       if (treeData.value.length) {
-        const field = util.getTreeValueField((_a = props2.pageConfig) == null ? void 0 : _a.sideConfig);
+        const field = util.getTreeValueField(props2.pageConfig?.sideConfig);
         treeSelectedValue.value = treeData.value[0][field];
         reloadTable();
       } else {
@@ -291,8 +403,7 @@ const index = /* @__PURE__ */ vue.defineComponent({
       }
     };
     const reloadTree = () => {
-      var _a;
-      if (!props2.treeListApi || !((_a = props2.pageConfig) == null ? void 0 : _a.splitPanelProps)) {
+      if (!props2.treeListApi || !props2.pageConfig?.splitPanelProps) {
         setTreeData([]);
         return;
       }
@@ -312,70 +423,19 @@ const index = /* @__PURE__ */ vue.defineComponent({
         if (e != null && typeof e === "string") {
           treeErrorMessage.value = e;
         } else {
-          treeErrorMessage.value = e == null ? void 0 : e.message;
+          treeErrorMessage.value = e?.message;
         }
       });
     };
+    const handleUpdateTreeSearchKeywords = (value) => {
+      treeSearchkeywords.value = value;
+    };
     const handleUpdateSplitPanelCollapse = (collapse) => {
       splitPanelCollapse.value = collapse;
     };
     const clearCodeCache = () => {
       codeCache.clear();
     };
-    vue.onBeforeUnmount(() => {
-      clearCodeCache();
-    });
-    const getDefaultTableColumns = (fields, selectionColumnProps, indexColumnProps, actionColumnProps) => {
-      const columns = [];
-      if (selectionColumnProps !== false) {
-        columns.push({
-          type: "selection",
-          columnKey: "selection",
-          width: 50,
-          align: "center",
-          fixed: "left",
-          ...(selectionColumnProps === true ? void 0 : selectionColumnProps) || {}
-        });
-      }
-      if (indexColumnProps !== false) {
-        columns.push({
-          type: "index",
-          columnKey: "index",
-          width: 50,
-          align: "center",
-          fixed: "left",
-          ...(indexColumnProps === true ? void 0 : indexColumnProps) || {}
-        });
-      }
-      common.mapTree(fields || [], (field) => {
-        if (field.hideInList === "flat") {
-          return "flatChildren";
-        } else if (!field.hideInList) {
-          return {
-            columnKey: field.key,
-            prop: field.prop,
-            label: field.label,
-            ...field.columnProps || {}
-          };
-        }
-      }).forEach((column) => {
-        columns.push(column);
-      });
-      if (actionColumnProps !== false) {
-        columns.push({
-          columnKey: "action",
-          label: lang.value.action,
-          width: 120,
-          align: "center",
-          fixed: "right",
-          slot: "action",
-          hideInPrint: true,
-          hideInExport: true,
-          ...(actionColumnProps === true ? void 0 : actionColumnProps) || {}
-        });
-      }
-      return columns;
-    };
     const renderSearch = () => {
       if (props2.searchConfig === false) {
         return;
@@ -385,7 +445,6 @@ const index = /* @__PURE__ */ vue.defineComponent({
       const renderForm = () => {
         return vue.h(props2.proFormComponent || EleProForm, {
           ...defaultSearchFormProps,
-          submitText: lang.value.search,
           itemTypeData: props2.itemTypeData,
           httpRequest: props2.httpRequest,
           screenSize: props2.screenSize,
@@ -395,56 +454,61 @@ const index = /* @__PURE__ */ vue.defineComponent({
           onUpdateValue: handleUpdateSearchForm,
           onSubmit: handleSubmitSearchForm,
           onReset: handleResetSearchForm
-        }, common.getMappedSlots(slots, searchConfig.formSlots, [], [], true));
+        }, {
+          footer: ({
+            submitForm,
+            resetForm
+          }) => vue.createVNode(EleButtons, {
+            "items": [{
+              preset: "search",
+              props: searchFormProps.value.submitButtonProps,
+              onClick: () => submitForm()
+            }, {
+              preset: "reset",
+              props: searchFormProps.value.resetButtonProps,
+              onClick: () => resetForm()
+            }]
+          }, null),
+          ...common.getMappedSlots(slots, searchConfig.formSlots, [], [], true)
+        });
       };
       if (!cardProps) {
         return renderForm();
       }
-      return vue.createVNode(EleCard, (cardProps === true ? void 0 : cardProps) || {}, {
+      return vue.createVNode(EleCard, vue.mergeProps({
+        "searchForm": true
+      }, (cardProps === true ? void 0 : cardProps) || {}), {
         ...common.getMappedSlots(slots, searchConfig.cardSlots),
         default: renderForm
       });
     };
     const renderTable = () => {
-      var _a;
       const listConfig = props2.listConfig || {};
       const cardProps = listConfig.cardProps;
       const tableProps = listConfig.tableProps || {};
-      const columns = ((_a = tableProps.columns) == null ? void 0 : _a.length) ? tableProps.columns : getDefaultTableColumns(props2.fields, listConfig.selectionColumnProps, listConfig.indexColumnProps, listConfig.actionColumnProps);
-      const addBtnProps = listConfig.addBtnProps;
-      const delBtnProps = listConfig.delBtnProps;
-      const editLinkProps = listConfig.editLinkProps;
-      const delLinkProps = listConfig.delLinkProps;
-      const renderTable2 = () => {
+      const renderTb = () => {
         const tSlots = common.getMappedSlots(slots, listConfig.tableSlots, [], ["default"], true);
         const toolbarSlot = tSlots.toolbar;
-        tSlots.toolbar = () => vue.createVNode(TableToolbar, {
-          "addBtnProps": addBtnProps,
-          "delBtnProps": delBtnProps,
-          "lang": lang.value,
-          "onBtnClick": handleBtnClick
+        tSlots.toolbar = (slotProps) => vue.createVNode(EleButtons, {
+          "items": toolbarBtnItems.value
         }, {
-          default: toolbarSlot
+          default: toolbarSlot ? toolbarSlot(slotProps) : void 0
         });
         const actionSlot = tSlots.action;
-        tSlots.action = ({
-          row
-        }) => vue.createVNode(TableAction, {
-          "editLinkProps": editLinkProps,
-          "delLinkProps": delLinkProps,
-          "item": row,
-          "lang": lang.value,
-          "onBtnClick": handleBtnClick
+        tSlots.action = (slotProps) => vue.createVNode(EleButtons, {
+          "type": "link",
+          "divider": true,
+          "items": actionBtnItems.value,
+          "onItemClick": (command) => handleBtnClick(command, slotProps?.row)
         }, {
-          default: actionSlot
+          default: actionSlot ? actionSlot(slotProps) : void 0
         });
         const bottomExtraSlot = tSlots.bottomExtra;
-        tSlots.bottomExtra = () => vue.createVNode(TableExtra, {
+        tSlots.bottomExtra = (slotProps) => vue.createVNode(TableExtra, {
           "addVisible": addVisible.value,
           "addData": addData.value,
           "editVisible": editVisible.value,
           "editData": editData.value,
-          "deletePopOption": deletePopOption.value,
           "addConfig": props2.addConfig,
           "editConfig": props2.editConfig,
           "fields": props2.fields,
@@ -465,12 +529,12 @@ const index = /* @__PURE__ */ vue.defineComponent({
           "onUpdate:editVisible": handleUpdateEditVisible
         }, {
           ...common.omit(slots, ["default"]),
-          default: bottomExtraSlot
+          default: bottomExtraSlot ? bottomExtraSlot(slotProps) : void 0
         });
-        const arrayDatasource = (tableProps == null ? void 0 : tableProps.datasource) == null ? props2.listApi && Array.isArray(props2.listApi) ? props2.listApi : void 0 : Array.isArray(tableProps.datasource) ? tableProps.datasource : void 0;
+        const arrayDatasource = tableProps?.datasource == null ? props2.listApi && Array.isArray(props2.listApi) ? props2.listApi : void 0 : Array.isArray(tableProps.datasource) ? tableProps.datasource : void 0;
         return vue.createVNode(EleProTable, vue.mergeProps(tableProps, {
           "ref": tableRef,
-          "columns": columns,
+          "columns": tableColumns.value,
           "datasource": arrayDatasource || tableDatasource,
           "selections": selections.value,
           "onUpdate:selections": handleUpdateSelections
@@ -479,43 +543,47 @@ const index = /* @__PURE__ */ vue.defineComponent({
         });
       };
       if (!cardProps) {
-        return renderTable2();
+        return renderTb();
       }
       return vue.createVNode(EleCard, (cardProps === true ? void 0 : cardProps) || {}, {
         ...common.getMappedSlots(slots, listConfig.cardSlots),
-        default: renderTable2
+        default: renderTb
       });
     };
-    const renderBodyContent = () => {
+    const renderContent = () => {
       const nodes = [];
       const sNodes = renderSearch();
-      if (sNodes) {
-        (Array.isArray(sNodes) ? sNodes : [sNodes]).forEach((node) => {
-          nodes.push(node);
-        });
-      }
       const tbNodes = renderTable();
-      if (tbNodes) {
-        (Array.isArray(tbNodes) ? tbNodes : [tbNodes]).forEach((node) => {
-          nodes.push(node);
-        });
-      }
-      return nodes;
-    };
-    const renderContent = () => {
-      const nodes = [];
-      const bodyNodes = renderBodyContent();
       const pageConfig = props2.pageConfig || {};
       const splitPanelProps = pageConfig.splitPanelProps;
       if (!splitPanelProps) {
-        bodyNodes.forEach((node) => {
-          nodes.push(node);
-        });
+        if (sNodes) {
+          (Array.isArray(sNodes) ? sNodes : [sNodes]).forEach((node) => {
+            nodes.push(node);
+          });
+        }
+        if (tbNodes) {
+          (Array.isArray(tbNodes) ? tbNodes : [tbNodes]).forEach((node) => {
+            nodes.push(node);
+          });
+        }
       } else {
+        const bodyNodes = [];
+        if (!pageConfig.splitSearchForm && sNodes) {
+          (Array.isArray(sNodes) ? sNodes : [sNodes]).forEach((node) => {
+            bodyNodes.push(node);
+          });
+        }
+        if (tbNodes) {
+          (Array.isArray(tbNodes) ? tbNodes : [tbNodes]).forEach((node) => {
+            bodyNodes.push(node);
+          });
+        }
         nodes.push(vue.createVNode(EleSplitPanel, vue.mergeProps({
-          "size": "256px",
-          "space": "0px",
+          "size": 258,
+          "space": 0,
           "allowCollapse": true,
+          "collapseBtnOffset": 2,
           "collapse": splitPanelCollapse.value,
           "class": "ele-crud-split-panel",
           "onUpdate:collapse": handleUpdateSplitPanelCollapse
@@ -527,10 +595,26 @@ const index = /* @__PURE__ */ vue.defineComponent({
             "loading": treeLoading.value,
             "selectedValue": treeSelectedValue.value,
             "errorMessage": treeErrorMessage.value,
+            "keywords": treeSearchkeywords.value,
+            "lang": lang.value,
             "onTreeNodeClick": handleTreeNodeClick
           }, {
             ...slots
           }),
+          sideHeader: pageConfig.sideConfig?.searchProps !== false ? () => {
+            let _slot;
+            return vue.createVNode(elementPlus.ElInput, vue.mergeProps({
+              "placeholder": lang.value.searchPlaceholder,
+              "clearable": true,
+              "prefixIcon": index$1.SearchOutlined,
+              "modelValue": treeSearchkeywords.value,
+              "onUpdate:modelValue": handleUpdateTreeSearchKeywords,
+              "class": "ele-crud-tree-search"
+            }, pageConfig.sideConfig?.searchInputProps || {}), _isSlot(_slot = common.getMappedSlots(slots, pageConfig.sideConfig?.searchInputSlots)) ? _slot : {
+              default: () => [_slot]
+            });
+          } : void 0,
+          bodyHeader: pageConfig.splitSearchForm && sNodes ? () => sNodes : void 0,
           body: () => bodyNodes
         }));
       }
@@ -544,8 +628,7 @@ const index = /* @__PURE__ */ vue.defineComponent({
       });
     };
     vue.watch(() => props2.listApi, () => {
-      var _a, _b;
-      (_b = (_a = tableRef.value) == null ? void 0 : _a.setData) == null ? void 0 : _b.call(_a, []);
+      tableRef.value?.setData?.([]);
       handleSubmitSearchForm();
     }, {
       deep: true
@@ -556,6 +639,9 @@ const index = /* @__PURE__ */ vue.defineComponent({
       deep: true,
       immediate: true
     });
+    vue.onBeforeUnmount(() => {
+      clearCodeCache();
+    });
     const exposeValue = {
       tableRef,
       getTableSelections,
@@ -563,8 +649,7 @@ const index = /* @__PURE__ */ vue.defineComponent({
     };
     expose(exposeValue);
     return () => {
-      var _a;
-      const pageProps = (_a = props2.pageConfig) == null ? void 0 : _a.pageProps;
+      const pageProps = props2.pageConfig?.pageProps;
       if (!pageProps) {
         return renderContent();
       }