"use strict";
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
require("../../../../../node_modules/element-plus/es/index.js");
;/* empty css                                                             */
;/* empty css                                                                  */
;/* empty css                                                                */
;/* empty css                                                                     */
;/* empty css                                                                  */
;/* empty css                                                                 */
;/* empty css                                                                     */
;/* empty css                                                                             */
require("../../../../../node_modules/element-plus/theme-chalk/el-date-picker.css.js");
;/* empty css                                                               */
;/* empty css                                                                  */
;/* empty css                                                                        */
;/* empty css                                                                  */
const Vue = require("vue");
const vueDraggablePlus = require("../../../../../node_modules/vue-draggable-plus/dist/vue-draggable-plus.js");
const index$2 = require("../../../../../node_modules/@element-plus/icons-vue/dist/index.js");
const common = require("../../utils/common.js");
;/* empty css                      */
const _pluginVue_exportHelper = require("../../../../../_virtual/_plugin-vue_export-helper.js");
const index = require("../../../../../node_modules/element-plus/es/components/form/index.js");
const index$1 = require("../../../../../node_modules/element-plus/es/components/icon/index.js");
const index$3 = require("../../../../../node_modules/element-plus/es/components/input/index.js");
const index$4 = require("../../../../../node_modules/element-plus/es/components/select/index.js");
const index$5 = require("../../../../../node_modules/element-plus/es/components/date-picker/index.js");
const index$6 = require("../../../../../node_modules/element-plus/es/components/button/index.js");
const _hoisted_1 = { class: "fixed-mode-config" };
const _hoisted_2 = { class: "filter-form-section" };
const _hoisted_3 = { class: "form-item-label" };
const _sfc_main = {
  __name: "FixedModeConfig",
  props: {
    modelValue: {
      type: Array,
      default: () => []
    }
  },
  emits: ["update:modelValue"],
  setup(__props, { emit: __emit }) {
    const props = __props;
    const emit = __emit;
    const editConfigData = Vue.computed(() => common.getEditConfigData());
    const filterFields = Vue.computed({
      get: () => props.modelValue,
      set: (val) => emit("update:modelValue", val)
    });
    const columnCount = Vue.computed(() => {
      var _a, _b;
      return ((_b = (_a = editConfigData.value) == null ? void 0 : _a.queryConfig) == null ? void 0 : _b.columnCount) || 3;
    });
    const isSingleLine = Vue.computed(() => {
      return filterFields.value.length <= columnCount.value;
    });
    const formData = Vue.reactive({});
    function getFieldInfo(filterField) {
      var _a, _b;
      const allFields = [
        ...((_a = editConfigData.value) == null ? void 0 : _a.fieldsData) || [],
        ...((_b = editConfigData.value) == null ? void 0 : _b.hiddenFields) || []
      ];
      const field = allFields.find((f) => f.id == filterField.fieldId);
      return field;
    }
    function getFieldLabel(filterField) {
      const fieldInfo = getFieldInfo(filterField);
      return (fieldInfo == null ? void 0 : fieldInfo.label) || "";
    }
    Vue.watch(
      filterFields,
      (fields) => {
        fields.forEach((filterField) => {
          const fieldInfo = getFieldInfo(filterField);
          if (fieldInfo && !(fieldInfo.fieldName in formData)) {
            formData[fieldInfo.fieldName] = fieldInfo.fieldType == "daterange" ? [] : "";
          }
        });
        const currentFieldNames = fields.map((filterField) => {
          const fieldInfo = getFieldInfo(filterField);
          return fieldInfo == null ? void 0 : fieldInfo.fieldName;
        }).filter(Boolean);
        Object.keys(formData).forEach((key) => {
          if (!currentFieldNames.includes(key)) {
            delete formData[key];
          }
        });
      },
      { immediate: true, deep: true }
    );
    function removeField(field) {
      var _a, _b;
      const index2 = filterFields.value.findIndex((f) => f.id == field.id);
      if (index2 !== -1) {
        filterFields.value.splice(index2, 1);
        let fieldItem = (_a = editConfigData.value) == null ? void 0 : _a.fieldsData.find(
          (item) => item.id == field.fieldId
        );
        if (!fieldItem) {
          fieldItem = (_b = editConfigData.value) == null ? void 0 : _b.hiddenFields.find(
            (item) => item.id == field.fieldId
          );
        }
        if (fieldItem) {
          fieldItem.isFilter = false;
        }
      }
    }
    function isInputType(field) {
      const inputTypes = ["text", "textarea", "number"];
      return inputTypes.includes(field.fieldType);
    }
    function isSelectType(field) {
      const selectTypes = ["select", "radio", "checkbox", "switch"];
      return selectTypes.includes(field.fieldType);
    }
    function isDateType(field) {
      const dateTypes = [
        "date",
        "datetime",
        "time",
        "month",
        "year",
        "dates",
        "week"
      ];
      return dateTypes.includes(field.fieldType);
    }
    function handleSearch() {
    }
    function resetForm() {
    }
    return (_ctx, _cache) => {
      const _component_el_icon = index$1.ElIcon;
      const _component_el_input = index$3.ElInput;
      const _component_el_option = index$4.ElOption;
      const _component_el_select = index$4.ElSelect;
      const _component_el_date_picker = index$5.ElDatePicker;
      const _component_el_form_item = index.ElFormItem;
      const _component_el_form = index.ElForm;
      const _component_el_button = index$6.ElButton;
      return Vue.openBlock(), Vue.createElementBlock("div", _hoisted_1, [
        Vue.createElementVNode("div", _hoisted_2, [
          Vue.createVNode(_component_el_form, {
            ref: "formRef",
            model: formData,
            class: "filter-form",
            "label-width": "80px"
          }, {
            default: Vue.withCtx(() => [
              Vue.createVNode(Vue.unref(vueDraggablePlus.VueDraggable), {
                modelValue: filterFields.value,
                "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => filterFields.value = $event),
                animation: 150,
                group: { name: "filterFields" },
                ghostClass: "ghost",
                class: "form-items-draggable",
                style: Vue.normalizeStyle({ "--column-count": columnCount.value })
              }, {
                default: Vue.withCtx(() => [
                  (Vue.openBlock(true), Vue.createElementBlock(Vue.Fragment, null, Vue.renderList(filterFields.value, (filterField) => {
                    return Vue.openBlock(), Vue.createBlock(_component_el_form_item, {
                      key: filterField.id,
                      label: getFieldLabel(filterField),
                      onMouseenter: ($event) => Vue.unref(common.setHoverItem)(filterField),
                      onMouseleave: _cache[0] || (_cache[0] = ($event) => Vue.unref(common.setHoverItem)()),
                      onClick: Vue.withModifiers(($event) => Vue.unref(common.setSelectedItem)(filterField), ["stop"]),
                      class: Vue.normalizeClass(Vue.unref(common.getCurrentClass)(filterField))
                    }, {
                      label: Vue.withCtx(() => [
                        Vue.createElementVNode("div", _hoisted_3, [
                          Vue.createElementVNode("span", null, Vue.toDisplayString(getFieldLabel(filterField)), 1)
                        ])
                      ]),
                      default: Vue.withCtx(() => [
                        Vue.createVNode(_component_el_icon, {
                          class: "delete-icon",
                          onClick: Vue.withModifiers(($event) => removeField(filterField), ["stop"])
                        }, {
                          default: Vue.withCtx(() => [
                            Vue.createVNode(Vue.unref(index$2.Close))
                          ]),
                          _: 2
                        }, 1032, ["onClick"]),
                        isInputType(getFieldInfo(filterField)) ? (Vue.openBlock(), Vue.createBlock(_component_el_input, {
                          key: 0,
                          modelValue: formData[getFieldInfo(filterField).fieldName],
                          "onUpdate:modelValue": ($event) => formData[getFieldInfo(filterField).fieldName] = $event,
                          class: "filter-item"
                        }, null, 8, ["modelValue", "onUpdate:modelValue"])) : isSelectType(getFieldInfo(filterField)) ? (Vue.openBlock(), Vue.createBlock(_component_el_select, {
                          key: 1,
                          modelValue: formData[getFieldInfo(filterField).fieldName],
                          "onUpdate:modelValue": ($event) => formData[getFieldInfo(filterField).fieldName] = $event,
                          class: "filter-item"
                        }, {
                          default: Vue.withCtx(() => [
                            Vue.createVNode(_component_el_option, {
                              label: "选项1",
                              value: "1"
                            }),
                            Vue.createVNode(_component_el_option, {
                              label: "选项2",
                              value: "2"
                            })
                          ]),
                          _: 2
                        }, 1032, ["modelValue", "onUpdate:modelValue"])) : isDateType(getFieldInfo(filterField)) ? (Vue.openBlock(), Vue.createBlock(_component_el_date_picker, {
                          key: 2,
                          modelValue: formData[getFieldInfo(filterField).fieldName],
                          "onUpdate:modelValue": ($event) => formData[getFieldInfo(filterField).fieldName] = $event,
                          type: "daterange",
                          "range-separator": "至",
                          "start-placeholder": "开始日期",
                          "end-placeholder": "结束日期",
                          class: "filter-item"
                        }, null, 8, ["modelValue", "onUpdate:modelValue"])) : (Vue.openBlock(), Vue.createBlock(_component_el_input, {
                          key: 3,
                          modelValue: formData[getFieldInfo(filterField).fieldName],
                          "onUpdate:modelValue": ($event) => formData[getFieldInfo(filterField).fieldName] = $event,
                          class: "filter-item"
                        }, null, 8, ["modelValue", "onUpdate:modelValue"]))
                      ]),
                      _: 2
                    }, 1032, ["label", "onMouseenter", "onClick", "class"]);
                  }), 128))
                ]),
                _: 1
              }, 8, ["modelValue", "style"])
            ]),
            _: 1
          }, 8, ["model"])
        ]),
        Vue.createElementVNode("div", {
          class: Vue.normalizeClass(["fixed-search-btn", { inline: isSingleLine.value }])
        }, [
          Vue.createVNode(_component_el_button, {
            icon: Vue.unref(index$2.Search),
            type: "primary",
            onClick: handleSearch
          }, {
            default: Vue.withCtx(() => _cache[2] || (_cache[2] = [
              Vue.createTextVNode("搜索")
            ])),
            _: 1
          }, 8, ["icon"]),
          Vue.createVNode(_component_el_button, {
            icon: Vue.unref(index$2.Refresh),
            onClick: resetForm,
            class: "reset-btn"
          }, {
            default: Vue.withCtx(() => _cache[3] || (_cache[3] = [
              Vue.createTextVNode("重置")
            ])),
            _: 1
          }, 8, ["icon"])
        ], 2)
      ]);
    };
  }
};
const FixedModeConfig = /* @__PURE__ */ _pluginVue_exportHelper.default(_sfc_main, [["__scopeId", "data-v-ad9c58ca"]]);
exports.default = FixedModeConfig;
