"use strict";
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
require("../../../../node_modules/.pnpm/vue@3.3.4/node_modules/vue/dist/vue.runtime.esm-bundler.js");
const Draggable = require("vuedraggable");
const cloneDeep = require("../../../../node_modules/.pnpm/lodash@4.17.21/node_modules/lodash/cloneDeep.js");
const index$2 = require("../ContentBox/index.vue.js");
const chartLayoutStore = require("../../../store/modules/chartLayoutStore/chartLayoutStore.js");
const chartLayoutStore_d = require("../../../store/modules/chartLayoutStore/chartLayoutStore.d.js");
const chartEditStore = require("../../../store/modules/chartEditStore/chartEditStore.js");
const useContextMenu_hook = require("../hooks/useContextMenu.hook.js");
const editPageEnum = require("../../../enums/editPageEnum.js");
const index$1 = require("./components/LayersListItem/index.vue.js");
const index = require("./components/LayersGroupListItem/index.vue.js");
require("../../../../node_modules/.pnpm/vue3-lazyload@0.2.5-beta_a6dezdz3je235ci4e3tu4rayna/node_modules/vue3-lazyload/dist/vue3-lazyload.esm.js");
require("../../../../node_modules/.pnpm/screenfull@6.0.2/node_modules/screenfull/index.js");
require("../../../../node_modules/.pnpm/lodash@4.17.21/node_modules/lodash/_root.js");
require("../../../../node_modules/.pnpm/lodash@4.17.21/node_modules/lodash/_baseGetTag.js");
require("../../../../node_modules/.pnpm/html2canvas@1.4.1/node_modules/html2canvas/dist/html2canvas.esm.js");
require("../../../../node_modules/.pnpm/crypto-js@4.1.1/node_modules/crypto-js/index.js");
require("../../../enums/pageEnum.js");
require("../../../router/index.js");
require("../../../store/modules/designStore/designStore.js");
require("../../../settings/designSetting.js");
require("../../../components/GoLoading/index.js");
require("../../../components/GoSkeleton/index.vue.js");
const icon = require("../../../plugins/icon.js");
const runtimeCore_esmBundler = require("../../../../node_modules/.pnpm/@vue_runtime-core@3.3.4/node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js");
const reactivity_esmBundler = require("../../../../node_modules/.pnpm/@vue_reactivity@3.3.4/node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js");
const shared_esmBundler = require("../../../../node_modules/.pnpm/@vue_shared@3.3.4/node_modules/@vue/shared/dist/shared.esm-bundler.js");
const _hoisted_1 = { class: "go-content-layer-box" };
const _sfc_main = /* @__PURE__ */ runtimeCore_esmBundler.defineComponent({
  __name: "index",
  setup(__props) {
    const { LayersIcon, GridIcon, ListIcon } = icon.icon.ionicons5;
    const { LaptopIcon } = icon.icon.carbon;
    const chartLayoutStore$1 = chartLayoutStore.useChartLayoutStore();
    const chartEditStore$1 = chartEditStore.useChartEditStore();
    const { handleContextMenu, onClickOutSide } = useContextMenu_hook.useContextMenu();
    [
      { label: "缩略图", icon: LaptopIcon, value: chartLayoutStore_d.LayerModeEnum.THUMBNAIL },
      { label: "文本列表", icon: ListIcon, value: chartLayoutStore_d.LayerModeEnum.TEXT }
    ];
    const layerList = reactivity_esmBundler.ref([]);
    const layerMode = reactivity_esmBundler.ref(chartLayoutStore$1.getLayerType);
    const reverseList = runtimeCore_esmBundler.computed(() => {
      const list = cloneDeep.default(chartEditStore$1.getComponentList);
      return list.reverse();
    });
    runtimeCore_esmBundler.watch(
      () => reverseList.value,
      (newValue) => {
        layerList.value = newValue;
      }
    );
    const optionsHandle = (targetList, allList, targetInstance) => {
      if (chartEditStore$1.getTargetChart.selectId.length > 1) {
        return targetList.filter((i) => i.key === editPageEnum.MenuEnum.GROUP);
      }
      const statusMenuEnums = [];
      if (targetInstance.status.lock) {
        statusMenuEnums.push(editPageEnum.MenuEnum.LOCK);
      } else {
        statusMenuEnums.push(editPageEnum.MenuEnum.UNLOCK);
      }
      if (targetInstance.status.hide) {
        statusMenuEnums.push(editPageEnum.MenuEnum.HIDE);
      } else {
        statusMenuEnums.push(editPageEnum.MenuEnum.SHOW);
      }
      return targetList.filter((item) => !statusMenuEnums.includes(item.key));
    };
    const backHandle = () => {
      chartLayoutStore$1.setItem(chartLayoutStore_d.ChartLayoutStoreEnum.LAYERS, false);
    };
    const onMoveCallback = (val) => {
      const { oldIndex, newIndex } = val.moved;
      if (newIndex - oldIndex > 0) {
        const moveTarget = chartEditStore$1.getComponentList.splice(-(oldIndex + 1), 1)[0];
        chartEditStore$1.getComponentList.splice(-newIndex, 0, moveTarget);
      } else {
        const moveTarget = chartEditStore$1.getComponentList.splice(-(oldIndex + 1), 1)[0];
        if (newIndex === 0) {
          chartEditStore$1.getComponentList.push(moveTarget);
        } else {
          chartEditStore$1.getComponentList.splice(-newIndex, 0, moveTarget);
        }
      }
    };
    const boxMousedownHandle = (e) => {
      const box = document.querySelector(".go-content-layer-box");
      if (e.target.contains(box)) {
        chartEditStore$1.setTargetSelectChart();
      }
    };
    const mousedownHandle = (e, item) => {
      var _a;
      onClickOutSide();
      const id = item.id;
      if (e.buttons === editPageEnum.MouseEventButton.LEFT && ((_a = window.$KeyboardActive) == null ? void 0 : _a.ctrl)) {
        if (chartEditStore$1.targetChart.selectId.includes(id)) {
          const exList = chartEditStore$1.targetChart.selectId.filter((e2) => e2 !== id);
          chartEditStore$1.setTargetSelectChart(exList);
        } else {
          chartEditStore$1.setTargetSelectChart(id, true);
        }
        return;
      }
      chartEditStore$1.setTargetSelectChart(id);
    };
    const mouseenterHandle = (item) => {
      chartEditStore$1.setTargetHoverChart(item.id);
    };
    const mouseleaveHandle = (item) => {
      chartEditStore$1.setTargetHoverChart(void 0);
    };
    return (_ctx, _cache) => {
      const _component_n_icon = runtimeCore_esmBundler.resolveComponent("n-icon");
      const _component_n_text = runtimeCore_esmBundler.resolveComponent("n-text");
      const _component_n_space = runtimeCore_esmBundler.resolveComponent("n-space");
      return runtimeCore_esmBundler.openBlock(), runtimeCore_esmBundler.createBlock(reactivity_esmBundler.unref(index$2.default), {
        class: shared_esmBundler.normalizeClass(["go-content-layers", { scoped: !reactivity_esmBundler.unref(chartLayoutStore$1).getLayers }]),
        title: "图层",
        depth: 2,
        onBack: backHandle,
        onMousedown: _cache[1] || (_cache[1] = ($event) => boxMousedownHandle($event))
      }, {
        icon: runtimeCore_esmBundler.withCtx(() => [
          runtimeCore_esmBundler.createVNode(_component_n_icon, {
            size: "16",
            depth: 2,
            component: reactivity_esmBundler.unref(LayersIcon)
          }, null, 8, ["component"])
        ]),
        default: runtimeCore_esmBundler.withCtx(() => [
          reverseList.value.length === 0 ? (runtimeCore_esmBundler.openBlock(), runtimeCore_esmBundler.createBlock(_component_n_space, {
            key: 0,
            justify: "center"
          }, {
            default: runtimeCore_esmBundler.withCtx(() => [
              runtimeCore_esmBundler.createVNode(_component_n_text, { class: "not-layer-text" }, {
                default: runtimeCore_esmBundler.withCtx(() => [
                  runtimeCore_esmBundler.createTextVNode("暂无图层~")
                ]),
                _: 1
              })
            ]),
            _: 1
          })) : runtimeCore_esmBundler.createCommentVNode("", true),
          runtimeCore_esmBundler.createVNode(reactivity_esmBundler.unref(Draggable), {
            "item-key": "id",
            modelValue: layerList.value,
            "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => layerList.value = $event),
            ghostClass: "ghost",
            onChange: onMoveCallback
          }, {
            item: runtimeCore_esmBundler.withCtx(({ element }) => [
              runtimeCore_esmBundler.createElementVNode("div", _hoisted_1, [
                element.isGroup ? (runtimeCore_esmBundler.openBlock(), runtimeCore_esmBundler.createBlock(reactivity_esmBundler.unref(index.default), {
                  key: 0,
                  componentGroupData: element,
                  "layer-mode": layerMode.value
                }, null, 8, ["componentGroupData", "layer-mode"])) : (runtimeCore_esmBundler.openBlock(), runtimeCore_esmBundler.createBlock(reactivity_esmBundler.unref(index$1.default), {
                  key: 1,
                  componentData: element,
                  "layer-mode": layerMode.value,
                  onMousedown: ($event) => mousedownHandle($event, element),
                  onMouseenter: ($event) => mouseenterHandle(element),
                  onMouseleave: ($event) => mouseleaveHandle(element),
                  onContextmenu: ($event) => reactivity_esmBundler.unref(handleContextMenu)($event, element, optionsHandle)
                }, null, 8, ["componentData", "layer-mode", "onMousedown", "onMouseenter", "onMouseleave", "onContextmenu"]))
              ])
            ]),
            _: 1
          }, 8, ["modelValue"])
        ]),
        _: 1
      }, 8, ["class"]);
    };
  }
});
exports.default = _sfc_main;
