@fecp/vue 1.1.2 → 1.1.3

package/lib/packages/vue/src/components/forms/form/Form.vue.js

@@ -29,6 +29,7 @@ const index = require("../../../../../../node_modules/.pnpm/element-plus@2.13.2_
 const index$3 = require("../../../../../../node_modules/.pnpm/element-plus@2.13.2_vue@3.5.13_typescript@5.7.3_/node_modules/element-plus/es/components/form/index.js");
 const gridLayout_vue = require("../../../../../../node_modules/.pnpm/grid-layout-plus@1.1.1_vue@3.5.13_typescript@5.7.3_/node_modules/grid-layout-plus/es/components/grid-layout.vue.js");
 const index$5 = require("../../../../../../node_modules/.pnpm/element-plus@2.13.2_vue@3.5.13_typescript@5.7.3_/node_modules/element-plus/es/components/message/index.js");
+const _hoisted_1 = ["name", "value"];
 const _sfc_main = /* @__PURE__ */ Object.assign({
   inheritAttrs: false
 }, {
@@ -59,6 +60,7 @@ const _sfc_main = /* @__PURE__ */ Object.assign({
     const dataSourceOptions = vue.ref({});
     const dictionaryOptions = vue.ref({});
     const fieldsData = vue.ref({});
+    const hiddenFields = vue.ref({});
     const pageEvents = usePageEvents.usePageEvents(() => ({
       pageEventConfig: localConfig.value.pageEventConfig,
       ctx,
@@ -84,6 +86,7 @@ const _sfc_main = /* @__PURE__ */ Object.assign({
         );
         localConfig.value = option;
         fieldsData.value = option.fieldsData.map((item) => item.component);
+        hiddenFields.value = option.hiddenFields || [];
         initFormData();
         await loadFieldDataSources();
         loadEventFlow();
@@ -120,6 +123,13 @@ const _sfc_main = /* @__PURE__ */ Object.assign({
           }
         });
       }
+      if (hiddenFields.value && hiddenFields.value.length > 0) {
+        hiddenFields.value.forEach((field) => {
+          if (field.fieldName) {
+            data[field.fieldName] = field.value !== void 0 ? field.value : null;
+          }
+        });
+      }
       formData.value = data;
       formRules.value = rules;
     };
@@ -228,7 +238,7 @@ const _sfc_main = /* @__PURE__ */ Object.assign({
         getEventHandlers: createEventHandlers,
         handleEvent: createHandleEvent
       } = eventFlowHandler.useEventFlow({
-        fields: fieldsData.value,
+        fields: [...fieldsData.value, ...hiddenFields.value],
         ctx,
         dataSources: localConfig.value.dataSources,
         components: {
@@ -278,36 +288,52 @@ const _sfc_main = /* @__PURE__ */ Object.assign({
     };
     const getFormData = () => {
       const result = { ...formData.value };
+      const processField = (field) => {
+        const fieldName = field.fieldName;
+        const fieldType = field.fieldType;
+        if (fieldName && (fieldType === "checkbox" || fieldType === "multipleSelection")) {
+          const value = result[fieldName];
+          if (Array.isArray(value)) {
+            result[fieldName] = value.join("|");
+          }
+        }
+      };
       if (localConfig.value.fieldsData) {
         localConfig.value.fieldsData.forEach(({ component }) => {
-          const fieldName = component.fieldName;
-          const fieldType = component.fieldType;
-          if (fieldName && (fieldType === "checkbox" || fieldType === "multipleSelection")) {
-            const value = result[fieldName];
-            if (Array.isArray(value)) {
-              result[fieldName] = value.join("|");
-            }
-          }
+          processField(component);
+        });
+      }
+      if (hiddenFields.value && hiddenFields.value.length > 0) {
+        hiddenFields.value.forEach((field) => {
+          processField(field);
         });
       }
       return result;
     };
     const setFormData = (data) => {
       const processedData = { ...data };
+      const processField = (field) => {
+        const fieldName = field.fieldName;
+        const fieldType = field.fieldType;
+        if (fieldName && (fieldType === "checkbox" || fieldType === "multipleSelection")) {
+          const value = processedData[fieldName];
+          if (typeof value === "string" && value.includes("|")) {
+            processedData[fieldName] = value.split("|");
+          } else if (typeof value === "string" && value !== "") {
+            processedData[fieldName] = [value];
+          } else if (value === "" || value === null || value === void 0) {
+            processedData[fieldName] = [];
+          }
+        }
+      };
       if (localConfig.value.fieldsData) {
         localConfig.value.fieldsData.forEach(({ component }) => {
-          const fieldName = component.fieldName;
-          const fieldType = component.fieldType;
-          if (fieldName && (fieldType === "checkbox" || fieldType === "multipleSelection")) {
-            const value = processedData[fieldName];
-            if (typeof value === "string" && value.includes("|")) {
-              processedData[fieldName] = value.split("|");
-            } else if (typeof value === "string" && value !== "") {
-              processedData[fieldName] = [value];
-            } else if (value === "" || value === null || value === void 0) {
-              processedData[fieldName] = [];
-            }
-          }
+          processField(component);
+        });
+      }
+      if (hiddenFields.value && hiddenFields.value.length > 0) {
+        hiddenFields.value.forEach((field) => {
+          processField(field);
         });
       }
       Object.assign(formData.value, processedData);
@@ -325,64 +351,75 @@ const _sfc_main = /* @__PURE__ */ Object.assign({
     return (_ctx, _cache) => {
       const _component_el_form = index$3.ElForm;
       const _component_el_container = index.ElContainer;
-      return vue.openBlock(), vue.createBlock(_component_el_container, {
-        direction: "vertical",
-        style: { "height": "100%" }
-      }, {
-        default: vue.withCtx(() => [
-          !configLoading.value ? (vue.openBlock(), vue.createBlock(vue.unref(index$1.header), {
-            key: 0,
-            pageHeaderConfig: localConfig.value.pageHeaderConfig
-          }, null, 8, ["pageHeaderConfig"])) : vue.createCommentVNode("", true),
-          vue.createVNode(vue.unref(index$2.main), null, {
-            default: vue.withCtx(() => [
-              vue.createVNode(_component_el_form, {
-                ref_key: "formRef",
-                ref: formRef,
-                model: formData.value,
-                rules: formRules.value,
-                "label-position": localConfig.value.labelPosition,
-                style: { "padding": "18px" },
-                "validate-on-rule-change": false
-              }, {
-                default: vue.withCtx(() => [
-                  !configLoading.value ? (vue.openBlock(), vue.createBlock(vue.unref(gridLayout_vue.default), {
-                    key: 0,
-                    ref: "gridLayout",
-                    layout: localConfig.value.fieldsData,
-                    "onUpdate:layout": _cache[0] || (_cache[0] = ($event) => localConfig.value.fieldsData = $event),
-                    "row-height": localConfig.value.labelPosition == "top" ? 90 : 60,
-                    margin: [0, 0],
-                    "col-num": localConfig.value.columns,
-                    "is-draggable": false,
-                    "is-resizable": false
-                  }, {
-                    item: vue.withCtx(({ item: { component } }) => [
-                      vue.createVNode(FormItem.default, {
-                        modelValue: formData.value[component.fieldName],
-                        "onUpdate:modelValue": ($event) => formData.value[component.fieldName] = $event,
-                        config: component,
-                        localConfig: localConfig.value,
-                        error: getFieldError(component.fieldName),
-                        formRef: formRef.value,
-                        onChange: handleFieldChange
-                      }, null, 8, ["modelValue", "onUpdate:modelValue", "config", "localConfig", "error", "formRef"])
-                    ]),
-                    _: 1
-                  }, 8, ["layout", "row-height", "col-num"])) : vue.createCommentVNode("", true)
-                ]),
-                _: 1
-              }, 8, ["model", "rules", "label-position"])
-            ]),
-            _: 1
-          }),
-          vue.createVNode(vue.unref(index$4.footer), {
-            pageFooterConfig: localConfig.value.pageFooterConfig,
-            onCustomButtonClick: handleCustomButtonClick
-          }, null, 8, ["pageFooterConfig"])
-        ]),
-        _: 1
-      });
+      return vue.openBlock(), vue.createElementBlock(vue.Fragment, null, [
+        vue.createVNode(_component_el_container, {
+          direction: "vertical",
+          style: { "height": "100%" }
+        }, {
+          default: vue.withCtx(() => [
+            !configLoading.value ? (vue.openBlock(), vue.createBlock(vue.unref(index$1.header), {
+              key: 0,
+              pageHeaderConfig: localConfig.value.pageHeaderConfig
+            }, null, 8, ["pageHeaderConfig"])) : vue.createCommentVNode("", true),
+            vue.createVNode(vue.unref(index$2.main), null, {
+              default: vue.withCtx(() => [
+                vue.createVNode(_component_el_form, {
+                  ref_key: "formRef",
+                  ref: formRef,
+                  model: formData.value,
+                  rules: formRules.value,
+                  "label-position": localConfig.value.labelPosition,
+                  style: { "padding": "18px" },
+                  "validate-on-rule-change": false
+                }, {
+                  default: vue.withCtx(() => [
+                    !configLoading.value ? (vue.openBlock(), vue.createBlock(vue.unref(gridLayout_vue.default), {
+                      key: 0,
+                      ref: "gridLayout",
+                      layout: localConfig.value.fieldsData,
+                      "onUpdate:layout": _cache[0] || (_cache[0] = ($event) => localConfig.value.fieldsData = $event),
+                      "row-height": localConfig.value.labelPosition == "top" ? 90 : 60,
+                      margin: [0, 0],
+                      "col-num": localConfig.value.columns,
+                      "is-draggable": false,
+                      "is-resizable": false
+                    }, {
+                      item: vue.withCtx(({ item: { component } }) => [
+                        vue.createVNode(FormItem.default, {
+                          modelValue: formData.value[component.fieldName],
+                          "onUpdate:modelValue": ($event) => formData.value[component.fieldName] = $event,
+                          config: component,
+                          localConfig: localConfig.value,
+                          error: getFieldError(component.fieldName),
+                          formRef: formRef.value,
+                          onChange: handleFieldChange
+                        }, null, 8, ["modelValue", "onUpdate:modelValue", "config", "localConfig", "error", "formRef"])
+                      ]),
+                      _: 1
+                    }, 8, ["layout", "row-height", "col-num"])) : vue.createCommentVNode("", true),
+                    (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(hiddenFields.value, (field) => {
+                      return vue.openBlock(), vue.createElementBlock("input", {
+                        key: field.fieldName,
+                        type: "hidden",
+                        name: field.fieldName,
+                        value: formData.value[field.fieldName]
+                      }, null, 8, _hoisted_1);
+                    }), 128))
+                  ]),
+                  _: 1
+                }, 8, ["model", "rules", "label-position"])
+              ]),
+              _: 1
+            }),
+            vue.createVNode(vue.unref(index$4.footer), {
+              pageFooterConfig: localConfig.value.pageFooterConfig,
+              onCustomButtonClick: handleCustomButtonClick
+            }, null, 8, ["pageFooterConfig"])
+          ]),
+          _: 1
+        }),
+        vue.createTextVNode(" " + vue.toDisplayString(formData.value), 1)
+      ], 64);
     };
   }
 });

package/lib/packages/vue/src/components/forms/text/Text.vue.js

@@ -131,5 +131,5 @@ const _sfc_main = /* @__PURE__ */ Object.assign({
     };
   }
 });
-const _Text = /* @__PURE__ */ _pluginVue_exportHelper.default(_sfc_main, [["__scopeId", "data-v-4b100f9c"]]);
-exports.default = _Text;
+const TextComponent = /* @__PURE__ */ _pluginVue_exportHelper.default(_sfc_main, [["__scopeId", "data-v-4b100f9c"]]);
+exports.default = TextComponent;

package/lib/packages/vue/src/components/table/Table.vue.js

@@ -9,6 +9,7 @@ const datasource = require("../../utils/datasource.js");
 const Pagination = require("./Pagination.vue.js");
 const CustomButtons = require("./CustomButtons.vue.js");
 const TableColumn = require("./TableColumn.vue.js");
+const TableFilter = require("./TableFilter.vue.js");
 const getInstance = require("../../utils/getInstance.js");
 ;/* empty css                                                                                                                                     */
 ;/* empty css                                                                                                                                       */
@@ -139,7 +140,7 @@ const _sfc_main = /* @__PURE__ */ Object.assign({
       const fieldDataSources = /* @__PURE__ */ new Set();
       const dictionaryKeys = /* @__PURE__ */ new Set();
       for (const field of fields) {
-        if (field.fieldType === "select" && field.optionConfig) {
+        if ((field.fieldType === "select" || field.fieldType === "multipleSelection") && field.optionConfig) {
           const { optionSource, dataSourceValue, dictionaryValue } = field.optionConfig;
           if (optionSource === "dataSource" && dataSourceValue) {
             fieldDataSources.add(dataSourceValue);
@@ -194,6 +195,42 @@ const _sfc_main = /* @__PURE__ */ Object.assign({
           console.error("Failed to load dictionary data:", error);
         }
       }
+      mergeOptionsToFields();
+    };
+    const mergeOptionsToFields = () => {
+      if (localConfig.value.fieldsData) {
+        localConfig.value.fieldsData.forEach((field) => {
+          if (!field.optionConfig) return;
+          const {
+            optionSource,
+            dataSourceValue,
+            dictionaryValue,
+            displayField,
+            valueField
+          } = field.optionConfig;
+          if (optionSource === "dataSource" && dataSourceOptions.value[dataSourceValue]) {
+            const rawOptions = dataSourceOptions.value[dataSourceValue];
+            const labelField = displayField || "label";
+            const keyField = valueField || "value";
+            field.optionConfig.options = rawOptions.map((item) => ({
+              label: item[labelField],
+              value: item[keyField],
+              disabled: item.disabled || false
+            }));
+          } else if (optionSource === "dictionary" && dictionaryOptions.value[dictionaryValue]) {
+            const rawOptions = dictionaryOptions.value[dictionaryValue];
+            const labelField = "optName";
+            const keyField = "optCode";
+            field.optionConfig.options = rawOptions.map((item) => ({
+              label: item[labelField],
+              value: item[keyField],
+              disabled: item.disabled || false
+            }));
+          } else if (optionSource === "custom") {
+            field.optionConfig.options = field.optionConfig.options || [];
+          }
+        });
+      }
     };
     const { handleEvent } = eventFlowHandler.useEventFlow({
       fields: localConfig.value.fieldsData,
@@ -247,6 +284,18 @@ const _sfc_main = /* @__PURE__ */ Object.assign({
     const handleRadioChange = (checked) => {
       emit("selection-change", [checked.row]);
     };
+    const handleFilterSearch = (filters) => {
+      if (dataSourceManager.value) {
+        dataSourceManager.value.updateParams(filters);
+        dataSourceManager.value.fetch();
+      }
+    };
+    const handleFilterReset = () => {
+      if (dataSourceManager.value) {
+        dataSourceManager.value.clearParams();
+        dataSourceManager.value.fetch();
+      }
+    };
     const refresh = (options = {}) => {
       var _a;
       const {
@@ -375,6 +424,12 @@ const _sfc_main = /* @__PURE__ */ Object.assign({
         ref: tableContainer,
         class: "fec-table-container"
       }, [
+        vue.createVNode(TableFilter.default, {
+          "query-config": localConfig.value.queryConfig,
+          "fields-data": localConfig.value.fieldsData,
+          onSearch: handleFilterSearch,
+          onReset: handleFilterReset
+        }, null, 8, ["query-config", "fields-data"]),
         vue.createVNode(CustomButtons.default, {
           "custom-btns": localConfig.value.customBtns,
           onClick: handleCustomBtnClick
@@ -436,5 +491,5 @@ const _sfc_main = /* @__PURE__ */ Object.assign({
     };
   }
 });
-const _Table = /* @__PURE__ */ _pluginVue_exportHelper.default(_sfc_main, [["__scopeId", "data-v-9014257e"]]);
+const _Table = /* @__PURE__ */ _pluginVue_exportHelper.default(_sfc_main, [["__scopeId", "data-v-d11bb28c"]]);
 exports.default = _Table;

package/lib/packages/vue/src/components/table/TableColumn.vue.js

@@ -110,6 +110,7 @@ const _sfc_main = {
           }
           return value;
         case "select":
+        case "multipleSelection":
           if (field.optionConfig) {
             let options = [];
             let displayField = "label";
@@ -127,6 +128,14 @@ const _sfc_main = {
               displayField = "optName";
               valueField = "optCode";
             }
+            if (typeof value === "string" && value.includes("|")) {
+              const values = value.split("|");
+              const displayValues = values.map((val) => {
+                const option2 = options.find((opt) => opt[valueField] == val);
+                return option2 ? option2[displayField] : val;
+              });
+              return displayValues.join(", ");
+            }
             const option = options.find((opt) => opt[valueField] == value);
             return option ? option[displayField] : value;
           }
@@ -300,5 +309,5 @@ const _sfc_main = {
     };
   }
 };
-const TableColumn = /* @__PURE__ */ _pluginVue_exportHelper.default(_sfc_main, [["__scopeId", "data-v-28498ce1"]]);
+const TableColumn = /* @__PURE__ */ _pluginVue_exportHelper.default(_sfc_main, [["__scopeId", "data-v-c7ca0774"]]);
 exports.default = TableColumn;

package/lib/packages/vue/src/components/table/TableFilter.vue.js

@@ -0,0 +1,267 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+;/* empty css                                                                                                                                 */
+;/* empty css                                                                                                                                       */
+;/* empty css                                                                                                                                    */
+;/* empty css                                                                                                                                      */
+;/* empty css                                                                                                                                         */
+require("../../../../../node_modules/.pnpm/element-plus@2.13.2_vue@3.5.13_typescript@5.7.3_/node_modules/element-plus/theme-chalk/el-date-picker.css.js");
+;/* empty css                                                                                                                                                 */
+;/* empty css                                                                                                                                     */
+;/* empty css                                                                                                                                         */
+;/* empty css                                                                                                                                      */
+const vue = require("vue");
+const index$3 = require("../../../../../node_modules/.pnpm/@element-plus_icons-vue@2.3.2_vue@3.5.13_typescript@5.7.3_/node_modules/@element-plus/icons-vue/dist/index.js");
+const index$a = require("../forms/text/index.js");
+const index$6 = require("../forms/select/index.js");
+const index$7 = require("../forms/multipleSelection/index.js");
+const index$9 = require("../forms/date/index.js");
+const index$8 = require("../forms/number/index.js");
+;/* empty css                  */
+const _pluginVue_exportHelper = require("../../../../../_virtual/_plugin-vue_export-helper.js");
+const index = require("../../../../../node_modules/.pnpm/element-plus@2.13.2_vue@3.5.13_typescript@5.7.3_/node_modules/element-plus/es/components/form/index.js");
+const index$1 = require("../../../../../node_modules/.pnpm/element-plus@2.13.2_vue@3.5.13_typescript@5.7.3_/node_modules/element-plus/es/components/date-picker/index.js");
+const index$2 = require("../../../../../node_modules/.pnpm/element-plus@2.13.2_vue@3.5.13_typescript@5.7.3_/node_modules/element-plus/es/components/button/index.js");
+const index$4 = require("../../../../../node_modules/.pnpm/element-plus@2.13.2_vue@3.5.13_typescript@5.7.3_/node_modules/element-plus/es/components/divider/index.js");
+const index$5 = require("../../../../../node_modules/.pnpm/element-plus@2.13.2_vue@3.5.13_typescript@5.7.3_/node_modules/element-plus/es/components/icon/index.js");
+const _sfc_main = {
+  __name: "TableFilter",
+  props: {
+    queryConfig: {
+      type: Object,
+      default: () => ({})
+    },
+    fieldsData: {
+      type: Array,
+      default: () => []
+    }
+  },
+  emits: ["search", "reset"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    vue.useCssVars((_ctx) => ({
+      "50ac82f0": `${config.value.collapseRows * 90}px`
+    }));
+    const props = __props;
+    const emit = __emit;
+    const config = vue.computed(() => {
+      var _a, _b, _c, _d, _e;
+      return {
+        enabled: ((_a = props.queryConfig) == null ? void 0 : _a.enabled) ?? false,
+        mode: ((_b = props.queryConfig) == null ? void 0 : _b.mode) || "fixed",
+        columnCount: ((_c = props.queryConfig) == null ? void 0 : _c.columnCount) || 3,
+        collapseRows: ((_d = props.queryConfig) == null ? void 0 : _d.collapseRows) || 2,
+        filterFields: ((_e = props.queryConfig) == null ? void 0 : _e.filterFields) || []
+      };
+    });
+    const getFieldConfig = (fieldId) => {
+      return props.fieldsData.find((field) => field.id === fieldId) || {};
+    };
+    const completeFilterFields = vue.computed(() => {
+      return config.value.filterFields.map((filterField) => {
+        const fieldConfig = getFieldConfig(filterField.fieldId);
+        return {
+          ...filterField,
+          ...fieldConfig
+        };
+      });
+    });
+    const filterValues = vue.ref({});
+    const isCollapsed = vue.ref(true);
+    const shouldShowToggle = vue.computed(() => {
+      const fieldCount = completeFilterFields.value.length;
+      const maxVisibleFields = config.value.columnCount * config.value.collapseRows;
+      return fieldCount > maxVisibleFields;
+    });
+    const isSingleLine = vue.computed(() => {
+      if (isCollapsed.value) {
+        return config.value.collapseRows === 1;
+      } else {
+        const totalRows = Math.ceil(
+          completeFilterFields.value.length / config.value.columnCount
+        );
+        return totalRows === 1;
+      }
+    });
+    const getFilterComponent = (fieldType) => {
+      const componentMap = {
+        text: index$a.Text,
+        select: index$6.Select,
+        date: index$9.Date,
+        number: index$8.Number,
+        multipleSelection: index$7.MultipleSelection,
+        switch: index$6.Select
+      };
+      return componentMap[fieldType] || index$a.Text;
+    };
+    const getComponentConfig = (field) => {
+      return { ...field };
+    };
+    const getPlaceholder = (field, type = "default") => {
+      const placeholderMap = {
+        text: "请输入",
+        select: "请选择",
+        date: type === "start" ? "开始日期" : type === "end" ? "结束日期" : "请选择日期",
+        number: "请输入",
+        radio: "请选择",
+        checkbox: "请选择",
+        switch: "请选择"
+      };
+      if (field.fieldType === "date") {
+        return placeholderMap.date;
+      }
+      return `${placeholderMap[field.fieldType] || "请输入"}${field.label || ""}`;
+    };
+    const toggleCollapse = () => {
+      isCollapsed.value = !isCollapsed.value;
+    };
+    const handleSearch = () => {
+      const filters = {};
+      Object.keys(filterValues.value).forEach((key) => {
+        const value = filterValues.value[key];
+        if (value !== "" && value !== null && value !== void 0) {
+          const fieldConfig = completeFilterFields.value.find(
+            (field) => field.id == key
+          );
+          const fieldName = (fieldConfig == null ? void 0 : fieldConfig.fieldName) || key;
+          if (Array.isArray(value)) {
+            filters[fieldName] = value.join("|");
+          } else {
+            filters[fieldName] = value;
+          }
+        }
+      });
+      console.log("🚀 ~ handleSearch ~ filters:", filters);
+      emit("search", filters);
+    };
+    const handleReset = () => {
+      filterValues.value = {};
+      emit("reset");
+    };
+    vue.watch(
+      () => props.queryConfig,
+      () => {
+        filterValues.value = {};
+        isCollapsed.value = true;
+      },
+      { deep: true }
+    );
+    __expose({
+      getFilterValues: () => filterValues.value,
+      setFilterValues: (values) => {
+        filterValues.value = { ...values };
+      },
+      reset: handleReset
+    });
+    return (_ctx, _cache) => {
+      const _component_el_date_picker = index$1.ElDatePicker;
+      const _component_el_form_item = index.ElFormItem;
+      const _component_el_button = index$2.ElButton;
+      const _component_el_form = index.ElForm;
+      const _component_el_icon = index$5.ElIcon;
+      const _component_el_divider = index$4.ElDivider;
+      return vue.openBlock(), vue.createElementBlock(vue.Fragment, null, [
+        config.value.enabled ? (vue.openBlock(), vue.createBlock(_component_el_form, {
+          key: 0,
+          model: filterValues.value,
+          class: "fec-table-filter",
+          "label-width": "100px",
+          "label-position": "right",
+          style: vue.normalizeStyle({ "--column-count": config.value.columnCount })
+        }, {
+          default: vue.withCtx(() => [
+            vue.createElementVNode("div", {
+              class: vue.normalizeClass(["filter-fields", { "is-collapsed": isCollapsed.value }])
+            }, [
+              (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(completeFilterFields.value, (field, index2) => {
+                return vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", {
+                  key: field.id,
+                  class: "filter-field"
+                }, [
+                  vue.createVNode(_component_el_form_item, {
+                    label: field.label || "筛选条件"
+                  }, {
+                    default: vue.withCtx(() => [
+                      field.fieldType !== "date" ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(getFilterComponent(field.fieldType)), vue.mergeProps({
+                        key: 0,
+                        modelValue: filterValues.value[field.fieldId],
+                        "onUpdate:modelValue": ($event) => filterValues.value[field.fieldId] = $event,
+                        config: { ...field, eventHandlers: {} },
+                        ref_for: true
+                      }, getComponentConfig(field), {
+                        placeholder: getPlaceholder(field)
+                      }), null, 16, ["modelValue", "onUpdate:modelValue", "config", "placeholder"])) : (vue.openBlock(), vue.createBlock(_component_el_date_picker, {
+                        key: 1,
+                        modelValue: filterValues.value[field.fieldId],
+                        "onUpdate:modelValue": ($event) => filterValues.value[field.fieldId] = $event,
+                        type: "daterange",
+                        "start-placeholder": getPlaceholder(field, "start"),
+                        "end-placeholder": getPlaceholder(field, "end"),
+                        format: "YYYY-MM-DD",
+                        "value-format": "YYYY-MM-DD",
+                        clearable: "",
+                        style: { "width": "100%" }
+                      }, null, 8, ["modelValue", "onUpdate:modelValue", "start-placeholder", "end-placeholder"]))
+                    ]),
+                    _: 2
+                  }, 1032, ["label"])
+                ])), [
+                  [
+                    vue.vShow,
+                    !isCollapsed.value || index2 < config.value.columnCount * config.value.collapseRows
+                  ]
+                ]);
+              }), 128))
+            ], 2),
+            vue.createElementVNode("div", {
+              class: vue.normalizeClass(["filter-actions", { inline: isSingleLine.value }])
+            }, [
+              vue.createVNode(_component_el_button, {
+                type: "primary",
+                onClick: handleSearch,
+                icon: vue.unref(index$3.Search)
+              }, {
+                default: vue.withCtx(() => _cache[0] || (_cache[0] = [
+                  vue.createTextVNode("搜索")
+                ])),
+                _: 1
+              }, 8, ["icon"]),
+              vue.createVNode(_component_el_button, {
+                onClick: handleReset,
+                icon: vue.unref(index$3.Refresh)
+              }, {
+                default: vue.withCtx(() => _cache[1] || (_cache[1] = [
+                  vue.createTextVNode("重置")
+                ])),
+                _: 1
+              }, 8, ["icon"])
+            ], 2)
+          ]),
+          _: 1
+        }, 8, ["model", "style"])) : vue.createCommentVNode("", true),
+        shouldShowToggle.value ? (vue.openBlock(), vue.createBlock(_component_el_divider, {
+          key: 1,
+          "border-style": "dashed",
+          class: "filter-divider"
+        }, {
+          default: vue.withCtx(() => [
+            vue.createElementVNode("div", {
+              onClick: toggleCollapse,
+              class: "collapse-toggle"
+            }, [
+              vue.createElementVNode("span", null, vue.toDisplayString(isCollapsed.value ? "更多筛选项" : "收起"), 1),
+              vue.createVNode(_component_el_icon, { style: { "transform": "rotate(90deg)" } }, {
+                default: vue.withCtx(() => [
+                  isCollapsed.value ? (vue.openBlock(), vue.createBlock(vue.unref(index$3.DArrowRight), { key: 0 })) : (vue.openBlock(), vue.createBlock(vue.unref(index$3.DArrowLeft), { key: 1 }))
+                ]),
+                _: 1
+              })
+            ])
+          ]),
+          _: 1
+        })) : vue.createCommentVNode("", true)
+      ], 64);
+    };
+  }
+};
+const TableFilter = /* @__PURE__ */ _pluginVue_exportHelper.default(_sfc_main, [["__scopeId", "data-v-e94ef8a9"]]);
+exports.default = TableFilter;