import "../../../../node_modules/element-plus/es/index.mjs";
/* empty css                                                          */
/* empty css                                                             */
/* empty css                                                               */
/* empty css                                                              */
/* empty css                                                               */
import { computed, createElementBlock, openBlock, createElementVNode, createVNode, unref, withCtx, Fragment, renderList, withModifiers, normalizeClass, mergeProps, createTextVNode, toDisplayString } from "vue";
import { VueDraggable as lo } from "../../../../node_modules/vue-draggable-plus/dist/vue-draggable-plus.mjs";
import { 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 { getEditConfigData, setSelectedItem, setHoverItem, getCurrentClass } from "../utils/common.mjs";
/* empty css                        */
import _export_sfc from "../../../../_virtual/_plugin-vue_export-helper.mjs";
import { ElSwitch } from "../../../../node_modules/element-plus/es/components/switch/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 { ElIcon } from "../../../../node_modules/element-plus/es/components/icon/index.mjs";
import { ElLink } from "../../../../node_modules/element-plus/es/components/link/index.mjs";
const _hoisted_1 = { class: "page-header-setting" };
const _hoisted_2 = { class: "setting-left" };
const _hoisted_3 = { class: "setting-right" };
const _hoisted_4 = ["onMouseenter", "onClick"];
const _sfc_main = {
  __name: "PageHeaderSetting",
  setup(__props) {
    const editConfigData = computed(() => {
      return getEditConfigData();
    });
    const pageHeaderConfig = computed(() => {
      return editConfigData.value.pageHeaderConfig || {
        enabled: true,
        canBack: true,
        title: "",
        subTitle: "",
        actions: []
      };
    });
    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 addAction() {
      const newBtn = {
        id: Date.now(),
        label: "按钮",
        type: "pageHeaderBtn",
        btnType: "custom",
        btnStyle: "default"
      };
      if (!pageHeaderConfig.value.actions) {
        pageHeaderConfig.value.actions = [];
      }
      pageHeaderConfig.value.actions.push(newBtn);
    }
    function removeAction(item) {
      const index = pageHeaderConfig.value.actions.findIndex(
        (i) => i.id === item.id
      );
      if (index !== -1) {
        pageHeaderConfig.value.actions.splice(index, 1);
      }
    }
    return (_ctx, _cache) => {
      const _component_el_switch = ElSwitch;
      const _component_el_input = ElInput;
      const _component_el_button = ElButton;
      const _component_el_icon = ElIcon;
      const _component_el_link = ElLink;
      return openBlock(), createElementBlock("div", _hoisted_1, [
        createElementVNode("div", _hoisted_2, [
          _cache[6] || (_cache[6] = createElementVNode("span", { class: "text-label" }, "启用页头", -1)),
          createVNode(_component_el_switch, {
            modelValue: pageHeaderConfig.value.enabled,
            "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => pageHeaderConfig.value.enabled = $event),
            size: "small"
          }, null, 8, ["modelValue"]),
          _cache[7] || (_cache[7] = createElementVNode("div", { class: "setting-divider" }, null, -1)),
          _cache[8] || (_cache[8] = createElementVNode("span", { class: "text-label" }, "显示返回", -1)),
          createVNode(_component_el_switch, {
            modelValue: pageHeaderConfig.value.canBack,
            "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => pageHeaderConfig.value.canBack = $event),
            size: "small"
          }, null, 8, ["modelValue"]),
          _cache[9] || (_cache[9] = createElementVNode("div", { class: "setting-divider" }, null, -1)),
          _cache[10] || (_cache[10] = createElementVNode("span", { class: "text-label" }, "标题", -1)),
          createVNode(_component_el_input, {
            modelValue: pageHeaderConfig.value.title,
            "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => pageHeaderConfig.value.title = $event),
            size: "small",
            placeholder: "请输入标题",
            style: { "width": "180px" }
          }, null, 8, ["modelValue"]),
          _cache[11] || (_cache[11] = createElementVNode("div", { class: "setting-divider" }, null, -1)),
          _cache[12] || (_cache[12] = createElementVNode("span", { class: "text-label" }, "描述", -1)),
          createVNode(_component_el_input, {
            modelValue: pageHeaderConfig.value.subTitle,
            "onUpdate:modelValue": _cache[3] || (_cache[3] = ($event) => pageHeaderConfig.value.subTitle = $event),
            size: "small",
            placeholder: "请输入次标题",
            style: { "width": "220px" }
          }, null, 8, ["modelValue"])
        ]),
        createElementVNode("div", _hoisted_3, [
          createVNode(unref(lo), {
            modelValue: pageHeaderConfig.value.actions,
            "onUpdate:modelValue": _cache[5] || (_cache[5] = ($event) => pageHeaderConfig.value.actions = $event),
            animation: 150,
            group: { name: "pageHeaderActions" },
            ghostClass: "ghost",
            class: "optBtnDraggable"
          }, {
            default: withCtx(() => [
              (openBlock(true), createElementBlock(Fragment, null, renderList(pageHeaderConfig.value.actions, (item) => {
                return openBlock(), createElementBlock("div", {
                  class: normalizeClass(["optBtn", unref(getCurrentClass)(item)]),
                  onMouseenter: ($event) => unref(setHoverItem)(item),
                  onMouseleave: _cache[4] || (_cache[4] = ($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) => removeAction(item), ["stop"])
                  }, {
                    default: withCtx(() => [
                      createVNode(unref(close_default))
                    ]),
                    _: 2
                  }, 1032, ["onClick"])
                ], 42, _hoisted_4);
              }), 256))
            ]),
            _: 1
          }, 8, ["modelValue"]),
          createVNode(_component_el_link, {
            class: "optBtn addLink",
            underline: "never",
            type: "primary",
            icon: unref(plus_default),
            onClick: withModifiers(addAction, ["stop"])
          }, {
            default: withCtx(() => _cache[13] || (_cache[13] = [
              createTextVNode("按钮")
            ])),
            _: 1
          }, 8, ["icon"])
        ])
      ]);
    };
  }
};
const PageHeaderSetting = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-aeab999f"]]);
export {
  PageHeaderSetting as default
};
