import "../../../../../node_modules/element-plus/es/index.mjs";
/* empty css                                                             */
/* empty css                                                                               */
/* empty css                                                                */
/* empty css                                                                     */
/* empty css                                                                  */
/* empty css                                                                 */
/* empty css                                                                     */
/* empty css                                                                  */
/* empty css                                                                             */
import "../../../../../node_modules/element-plus/theme-chalk/el-date-picker.css.mjs";
/* empty css                                                               */
/* empty css                                                                  */
/* empty css                                                                        */
/* empty css                                                                  */
/* empty css                                                                    */
/* empty css                                                                          */
/* empty css                                                                           */
/* empty css                                                                */
/* empty css                                                                */
import "../../../../../node_modules/element-plus/theme-chalk/el-tab-pane.css.mjs";
import { computed, reactive, watch, createElementBlock, openBlock, createElementVNode, createVNode, createCommentVNode, withCtx, unref, toDisplayString, Fragment, renderList, createBlock, createSlots, createTextVNode, withModifiers, normalizeClass, mergeProps, normalizeStyle } from "vue";
import { getEditConfigData, setSelectedItem, setHoverItem, getCurrentClass } from "../../utils/common.mjs";
import { ArrowLeftBold as arrow_left_bold_default, Search as search_default, Close as close_default, Plus as plus_default, Setting as setting_default, Download as download_default, Refresh as refresh_default } from "../../../../../node_modules/@element-plus/icons-vue/dist/index.mjs";
import { VueDraggable as lo } from "../../../../../node_modules/vue-draggable-plus/dist/vue-draggable-plus.mjs";
import { defaultCustomBtn } from "../default.mjs";
import { loadOptions } from "../../../utils/optionLoader.mjs";
/* empty css                        */
import _export_sfc from "../../../../../_virtual/_plugin-vue_export-helper.mjs";
import { ElIcon } from "../../../../../node_modules/element-plus/es/components/icon/index.mjs";
import { ElTabs, ElTabPane } from "../../../../../node_modules/element-plus/es/components/tabs/index.mjs";
import { ElInput } from "../../../../../node_modules/element-plus/es/components/input/index.mjs";
import { ElButton } from "../../../../../node_modules/element-plus/es/components/button/index.mjs";
import { ElLink } from "../../../../../node_modules/element-plus/es/components/link/index.mjs";
import { ElCollapseTransition } from "../../../../../node_modules/element-plus/es/components/collapse-transition/index.mjs";
import { ElForm, ElFormItem } from "../../../../../node_modules/element-plus/es/components/form/index.mjs";
import { ElCheckboxGroup, ElCheckboxButton } from "../../../../../node_modules/element-plus/es/components/checkbox/index.mjs";
import { ElSelect, ElOption } from "../../../../../node_modules/element-plus/es/components/select/index.mjs";
import { ElDatePicker } from "../../../../../node_modules/element-plus/es/components/date-picker/index.mjs";
const _hoisted_1 = { class: "dynamic-mode-config" };
const _hoisted_2 = { class: "dynamic-row" };
const _hoisted_3 = {
  key: 0,
  class: "back-icon"
};
const _hoisted_4 = {
  key: 1,
  class: "template-name"
};
const _hoisted_5 = {
  key: 2,
  class: "tab-display-section"
};
const _hoisted_6 = { class: "search-display-section" };
const _hoisted_7 = {
  key: 0,
  class: "search-input-group"
};
const _hoisted_8 = ["onMouseenter", "onClick"];
const _hoisted_9 = {
  key: 0,
  class: "expand-filter-section"
};
const _hoisted_10 = { class: "filter-form-section" };
const _hoisted_11 = { class: "form-item-label" };
const _sfc_main = {
  __name: "DynamicModeConfig",
  props: {
    modelValue: {
      type: Object,
      default: () => ({})
    },
    enabled: {
      type: Boolean,
      default: false
    }
  },
  emits: ["update:modelValue"],
  setup(__props, { emit: __emit }) {
    const props = __props;
    const emit = __emit;
    const editConfigData = computed(() => getEditConfigData());
    const dynamicConfig = computed({
      get: () => props.modelValue,
      set: (val) => emit("update:modelValue", val)
    });
    const tabConfigs = computed(() => {
      var _a;
      return ((_a = dynamicConfig.value) == null ? void 0 : _a.tabConfigs) || [];
    });
    const activeTab = computed({
      get: () => {
        var _a;
        if (dynamicConfig.value.tabActive) {
          return dynamicConfig.value.tabActive;
        }
        if (tabConfigs.value.length > 0) {
          return ((_a = tabConfigs.value[0]) == null ? void 0 : _a.id) || "";
        }
        return "";
      },
      set: (val) => {
        dynamicConfig.value.tabActive = val;
      }
    });
    computed(() => {
      var _a, _b;
      const allFields = [
        ...((_a = editConfigData.value) == null ? void 0 : _a.fieldsData) || [],
        ...((_b = editConfigData.value) == null ? void 0 : _b.hiddenFields) || []
      ];
      return allFields;
    });
    const btnTypeConfig = {
      custom: { type: "primary" },
      refresh: { icon: refresh_default },
      export: { icon: download_default },
      personalize: { icon: setting_default }
    };
    function getBtnProps(item) {
      const data = btnTypeConfig[item.btnType] || {};
      if (!item.label) {
        data.class = "system";
      } else {
        data.class = "";
      }
      return data;
    }
    function addOptBtns(state) {
      const newBtn = {
        id: Date.now(),
        ...defaultCustomBtn
      };
      {
        editConfigData.value.customBtns[state].unshift(newBtn);
      }
    }
    function removeOptBtns(state, item) {
      const index = editConfigData.value.customBtns[state].findIndex(
        (i) => i.id === item.id
      );
      if (index !== -1) {
        editConfigData.value.customBtns[state].splice(index, 1);
      }
    }
    const filterFields = computed({
      get: () => {
        var _a, _b;
        return ((_b = (_a = editConfigData.value) == null ? void 0 : _a.queryConfig) == null ? void 0 : _b.filterFields) || [];
      },
      set: (val) => {
        editConfigData.value.queryConfig.filterFields = val;
      }
    });
    const formData = 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) || "";
    }
    const optionsMap = reactive({});
    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];
          }
        });
        fields.forEach((filterField) => {
          if (filterField.isButtonStyle) {
            getOptions(filterField);
          }
        });
      },
      { immediate: true, deep: true }
    );
    function removeField(field) {
      var _a, _b, _c, _d;
      const index = filterFields.value.findIndex((f) => f.id == field.id);
      if (index !== -1) {
        if ((_a = editConfigData.value.queryConfig) == null ? void 0 : _a.filterFields) {
          (_b = editConfigData.value.queryConfig) == null ? void 0 : _b.filterFields.splice(index, 1);
        }
        let fieldItem = (_c = editConfigData.value) == null ? void 0 : _c.fieldsData.find(
          (item) => item.id == field.fieldId
        );
        if (!fieldItem) {
          fieldItem = (_d = editConfigData.value) == null ? void 0 : _d.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",
        "multipleSelection"
      ];
      return selectTypes.includes(field.fieldType);
    }
    function isDateType(field) {
      const dateTypes = [
        "date",
        "datetime",
        "time",
        "month",
        "year",
        "dates",
        "week"
      ];
      return dateTypes.includes(field.fieldType);
    }
    function getOptions(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);
      if (field) {
        loadOptions(field).then((data) => {
          optionsMap[filterField.fieldId] = data;
        });
      } else {
        optionsMap[filterField.fieldId] = [];
      }
    }
    const dynamicPlaceholder = computed(() => {
      const searchFields = dynamicConfig.value.searchFields || [];
      if (searchFields.length == 0) {
        return "请输入筛选条件";
      }
      const labelArr = searchFields.map((item) => item.label);
      return `搜索${labelArr.join("/")}`;
    });
    return (_ctx, _cache) => {
      const _component_el_icon = ElIcon;
      const _component_el_tab_pane = ElTabPane;
      const _component_el_tabs = ElTabs;
      const _component_el_button = ElButton;
      const _component_el_input = ElInput;
      const _component_el_link = ElLink;
      const _component_el_checkbox_button = ElCheckboxButton;
      const _component_el_checkbox_group = ElCheckboxGroup;
      const _component_el_option = ElOption;
      const _component_el_select = ElSelect;
      const _component_el_date_picker = ElDatePicker;
      const _component_el_form_item = ElFormItem;
      const _component_el_form = ElForm;
      const _component_el_collapse_transition = ElCollapseTransition;
      return openBlock(), createElementBlock("div", _hoisted_1, [
        createElementVNode("div", _hoisted_2, [
          editConfigData.value.showReturn ? (openBlock(), createElementBlock("div", _hoisted_3, [
            createVNode(_component_el_icon, null, {
              default: withCtx(() => [
                createVNode(unref(arrow_left_bold_default))
              ]),
              _: 1
            })
          ])) : createCommentVNode("", true),
          editConfigData.value.showTitle ? (openBlock(), createElementBlock("div", _hoisted_4, toDisplayString(editConfigData.value.templateName), 1)) : createCommentVNode("", true),
          __props.enabled && tabConfigs.value.length > 0 ? (openBlock(), createElementBlock("div", _hoisted_5, [
            createVNode(_component_el_tabs, {
              modelValue: activeTab.value,
              "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => activeTab.value = $event),
              class: "dynamic-tabs"
            }, {
              default: withCtx(() => [
                (openBlock(true), createElementBlock(Fragment, null, renderList(tabConfigs.value, (tab) => {
                  return openBlock(), createBlock(_component_el_tab_pane, {
                    key: tab.id,
                    label: tab.label,
                    name: tab.id
                  }, null, 8, ["label", "name"]);
                }), 128))
              ]),
              _: 1
            }, 8, ["modelValue"])
          ])) : createCommentVNode("", true),
          createElementVNode("div", _hoisted_6, [
            __props.enabled ? (openBlock(), createElementBlock("div", _hoisted_7, [
              createVNode(_component_el_input, {
                placeholder: dynamicPlaceholder.value,
                title: dynamicPlaceholder.value,
                class: "search-input"
              }, createSlots({
                suffix: withCtx(() => [
                  createVNode(_component_el_icon, {
                    class: "el-input__icon",
                    style: { "cursor": "pointer" }
                  }, {
                    default: withCtx(() => [
                      createVNode(unref(search_default))
                    ]),
                    _: 1
                  })
                ]),
                _: 2
              }, [
                dynamicConfig.value.advancedSearch ? {
                  name: "append",
                  fn: withCtx(() => [
                    createVNode(_component_el_button, { type: "primary" }, {
                      default: withCtx(() => _cache[6] || (_cache[6] = [
                        createTextVNode(toDisplayString("高级搜索"))
                      ])),
                      _: 1
                    })
                  ]),
                  key: "0"
                } : void 0
              ]), 1032, ["placeholder", "title"])
            ])) : createCommentVNode("", true),
            createVNode(unref(lo), {
              modelValue: editConfigData.value.customBtns.right,
              "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => editConfigData.value.customBtns.right = $event),
              animation: 150,
              group: { name: "tableBtn" },
              ghostClass: "ghost",
              class: "optBtnDraggable"
            }, {
              default: withCtx(() => [
                (openBlock(true), createElementBlock(Fragment, null, renderList(editConfigData.value.customBtns.right, (item) => {
                  return openBlock(), createElementBlock("div", {
                    class: normalizeClass(["optBtn", unref(getCurrentClass)(item)]),
                    onMouseenter: ($event) => unref(setHoverItem)(item),
                    onMouseleave: _cache[1] || (_cache[1] = ($event) => unref(setHoverItem)()),
                    onClick: withModifiers(($event) => unref(setSelectedItem)(item), ["stop"])
                  }, [
                    createVNode(_component_el_button, mergeProps({
                      class: "elBtn",
                      ref_for: true
                    }, getBtnProps(item)), {
                      default: withCtx(() => [
                        createTextVNode(toDisplayString(item.label), 1)
                      ]),
                      _: 2
                    }, 1040),
                    createVNode(_component_el_icon, {
                      class: "delete-icon",
                      onClick: withModifiers(($event) => removeOptBtns("right", item), ["stop"])
                    }, {
                      default: withCtx(() => [
                        createVNode(unref(close_default))
                      ]),
                      _: 2
                    }, 1032, ["onClick"])
                  ], 42, _hoisted_8);
                }), 256))
              ]),
              _: 1
            }, 8, ["modelValue"]),
            createVNode(_component_el_link, {
              class: "optBtn addLink",
              underline: "never",
              type: "primary",
              icon: unref(plus_default),
              onClick: _cache[3] || (_cache[3] = withModifiers(($event) => addOptBtns("right"), ["stop"]))
            }, {
              default: withCtx(() => _cache[7] || (_cache[7] = [
                createTextVNode("按钮")
              ])),
              _: 1
            }, 8, ["icon"])
          ])
        ]),
        createVNode(_component_el_collapse_transition, null, {
          default: withCtx(() => [
            dynamicConfig.value.advancedSearch && filterFields.value.length > 0 ? (openBlock(), createElementBlock("div", _hoisted_9, [
              createElementVNode("div", _hoisted_10, [
                createVNode(_component_el_form, {
                  ref: "formRef",
                  model: formData,
                  class: "filter-form",
                  "label-width": "100px",
                  inline: ""
                }, {
                  default: withCtx(() => [
                    createVNode(unref(lo), {
                      modelValue: filterFields.value,
                      "onUpdate:modelValue": _cache[5] || (_cache[5] = ($event) => filterFields.value = $event),
                      animation: 150,
                      group: { name: "filterFields" },
                      ghostClass: "ghost",
                      class: "form-items-draggable"
                    }, {
                      default: withCtx(() => [
                        (openBlock(true), createElementBlock(Fragment, null, renderList(filterFields.value, (filterField) => {
                          return openBlock(), createElementBlock("div", {
                            key: filterField.id,
                            style: normalizeStyle(filterField.isExclusiveRow ? "width:100%" : "")
                          }, [
                            createVNode(_component_el_form_item, {
                              label: getFieldLabel(filterField),
                              onMouseenter: ($event) => unref(setHoverItem)(filterField),
                              onMouseleave: _cache[4] || (_cache[4] = ($event) => unref(setHoverItem)()),
                              onClick: withModifiers(($event) => unref(setSelectedItem)(filterField), ["stop"]),
                              class: normalizeClass(unref(getCurrentClass)(filterField))
                            }, {
                              label: withCtx(() => [
                                createElementVNode("div", _hoisted_11, [
                                  createElementVNode("span", null, toDisplayString(getFieldLabel(filterField)) + ":", 1)
                                ])
                              ]),
                              default: withCtx(() => [
                                createVNode(_component_el_icon, {
                                  class: "delete-icon",
                                  onClick: withModifiers(($event) => removeField(filterField), ["stop"])
                                }, {
                                  default: withCtx(() => [
                                    createVNode(unref(close_default))
                                  ]),
                                  _: 2
                                }, 1032, ["onClick"]),
                                filterField.isButtonStyle ? (openBlock(), createBlock(_component_el_checkbox_group, { key: 0 }, {
                                  default: withCtx(() => [
                                    (openBlock(true), createElementBlock(Fragment, null, renderList(optionsMap[filterField.fieldId], (option) => {
                                      return openBlock(), createBlock(_component_el_checkbox_button, {
                                        key: option.value,
                                        value: option.value
                                      }, {
                                        default: withCtx(() => [
                                          createTextVNode(toDisplayString(option.label), 1)
                                        ]),
                                        _: 2
                                      }, 1032, ["value"]);
                                    }), 128))
                                  ]),
                                  _: 2
                                }, 1024)) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
                                  isInputType(getFieldInfo(filterField)) ? (openBlock(), 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)) ? (openBlock(), createBlock(_component_el_select, {
                                    key: 1,
                                    modelValue: formData[getFieldInfo(filterField).fieldName],
                                    "onUpdate:modelValue": ($event) => formData[getFieldInfo(filterField).fieldName] = $event,
                                    class: "filter-item"
                                  }, {
                                    default: withCtx(() => [
                                      createVNode(_component_el_option, {
                                        label: "选项1",
                                        value: "1"
                                      }),
                                      createVNode(_component_el_option, {
                                        label: "选项2",
                                        value: "2"
                                      })
                                    ]),
                                    _: 2
                                  }, 1032, ["modelValue", "onUpdate:modelValue"])) : isDateType(getFieldInfo(filterField)) ? (openBlock(), 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"])) : (openBlock(), 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"]))
                                ], 64))
                              ]),
                              _: 2
                            }, 1032, ["label", "onMouseenter", "onClick", "class"])
                          ], 4);
                        }), 128))
                      ]),
                      _: 1
                    }, 8, ["modelValue"])
                  ]),
                  _: 1
                }, 8, ["model"])
              ])
            ])) : createCommentVNode("", true)
          ]),
          _: 1
        })
      ]);
    };
  }
};
const DynamicModeConfig = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-93791225"]]);
export {
  DynamicModeConfig as default
};
