'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var vue = require('vue');
var vueRouter = require('vue-router');
var pinia = require('pinia');
require('../../../../stores/index.js');
var mitt = require('../../../../utils/mitt.js');
var routesList = require('../../../../stores/routesList.js');
var themeConfig = require('../../../../stores/themeConfig.js');

const _hoisted_1 = { class: "layout-columns-aside" };
const _hoisted_2 = { class: "layout-columns-logo" };
const _hoisted_3 = ["src"];
const _hoisted_4 = ["onClick", "onMouseenter", "title"];
const _hoisted_5 = { class: "columns-vertical-title font12" };
const _hoisted_6 = ["href"];
const _hoisted_7 = { class: "columns-vertical-title font12" };
var _sfc_main = /* @__PURE__ */ vue.defineComponent({
  __name: "columnsAside",
  setup(__props) {
    const columnsAsideOffsetTopRefs = vue.ref([]);
    const columnsAsideActiveRef = vue.ref();
    const stores = routesList.useRoutesList();
    const storesThemeConfig = themeConfig.useThemeConfig();
    const { routesList: routesList$1, isColumnsMenuHover, isColumnsNavHover } = pinia.storeToRefs(stores);
    const { themeConfig: themeConfig$1 } = pinia.storeToRefs(storesThemeConfig);
    const route = vueRouter.useRoute();
    const router = vueRouter.useRouter();
    const state = vue.reactive({
      columnsAsideList: [],
      liIndex: 0,
      liOldIndex: null,
      liHoverIndex: null,
      liOldPath: null,
      difference: 0,
      routeSplit: []
    });
    const setColumnsAsideMove = (k) => {
      if (k === void 0) return false;
      state.liIndex = k;
      columnsAsideActiveRef.value.style.top = `${columnsAsideOffsetTopRefs.value[k].offsetTop + state.difference}px`;
    };
    const onColumnsAsideMenuClick = async (v) => {
      var _a, _b, _c;
      let { path, redirect } = v;
      if (redirect) {
        onColumnsAsideDown(v.k);
        if (route.path.startsWith(redirect)) mitt.default.emit("setSendColumnsChildren", setSendChildren(redirect));
        else router.push(redirect);
      } else {
        if (!v.children || ((_a = v.children) == null ? void 0 : _a.length) === 0) {
          router.push(path);
          onColumnsAsideDown(v.k);
        } else {
          const resData = setSendChildren(path);
          if (Object.keys(resData).length <= 0) return false;
          onColumnsAsideDown((_b = resData.item) == null ? void 0 : _b.k);
          mitt.default.emit("setSendColumnsChildren", resData);
        }
      }
      if (!v.children || ((_c = v.children) == null ? void 0 : _c.length) === 0) themeConfig$1.value.isCollapse = true;
      else if (v.children.length > 1) themeConfig$1.value.isCollapse = false;
    };
    const onColumnsAsideMenuMouseenter = (v, k) => {
      if (!themeConfig$1.value.isColumnsMenuHoverPreload) return false;
      let { path } = v;
      state.liOldPath = path;
      state.liOldIndex = k;
      state.liHoverIndex = k;
      mitt.default.emit("setSendColumnsChildren", setSendChildren(path));
      stores.setColumnsMenuHover(false);
      stores.setColumnsNavHover(true);
    };
    const onColumnsAsideMenuMouseleave = async () => {
      if (!themeConfig$1.value.isColumnsMenuHoverPreload) return false;
      await stores.setColumnsNavHover(false);
      setTimeout(() => {
        if (!isColumnsMenuHover && !isColumnsNavHover) mitt.default.emit("restoreDefault");
      }, 100);
    };
    const onColumnsAsideDown = (k) => {
      vue.nextTick(() => {
        setColumnsAsideMove(k);
      });
    };
    const setMenuAutoCollaps = (path) => {
      var _a, _b;
      const resData = setSendChildren(path);
      !((_a = resData.item) == null ? void 0 : _a.redirect) && resData.children.length == 0 || ((_b = resData.item) == null ? void 0 : _b.redirect) && resData.children.length <= 1 ? themeConfig$1.value.isCollapse = true : themeConfig$1.value.isCollapse = false;
      return resData;
    };
    const setFilterRoutes = () => {
      var _a;
      state.columnsAsideList = filterRoutesFun(routesList$1.value);
      const resData = setMenuAutoCollaps(route.path);
      onColumnsAsideDown((_a = resData.item) == null ? void 0 : _a.k);
      setTimeout(() => {
        mitt.default.emit("setSendColumnsChildren", resData);
      }, 500);
    };
    const setSendChildren = (path) => {
      const currentPathSplit = path.split("/");
      let currentData = { children: [] };
      state.columnsAsideList.map((v, k) => {
        if (v.path === `/${currentPathSplit[1]}`) {
          v["k"] = k;
          currentData["item"] = { ...v };
          currentData["children"] = [{ ...v }];
          if (v.children) currentData["children"] = v.children;
        }
      });
      return currentData;
    };
    const filterRoutesFun = (arr) => {
      return arr.filter((item) => {
        var _a;
        return !((_a = item.meta) == null ? void 0 : _a.isHide);
      }).map((item) => {
        item = Object.assign({}, item);
        if (item.children) item.children = filterRoutesFun(item.children);
        return item;
      });
    };
    const setColumnsMenuHighlight = (path) => {
      state.routeSplit = path.split("/");
      state.routeSplit.shift();
      const routeFirst = `/${state.routeSplit[0]}`;
      const currentSplitRoute = state.columnsAsideList.find((v) => v.path === routeFirst);
      if (!currentSplitRoute) return false;
      setTimeout(() => {
        onColumnsAsideDown(currentSplitRoute.k);
      }, 0);
    };
    vue.onMounted(() => {
      setFilterRoutes();
      mitt.default.on("restoreDefault", () => {
        state.liOldIndex = null;
        state.liOldPath = null;
      });
    });
    vue.onUnmounted(() => {
      mitt.default.off("restoreDefault", () => {
      });
    });
    vueRouter.onBeforeRouteUpdate((to) => {
      const resData = setMenuAutoCollaps(to.path);
      setColumnsMenuHighlight(to.path);
      mitt.default.emit("setSendColumnsChildren", resData);
    });
    vue.watch(
      [() => themeConfig$1.value.columnsAsideStyle, isColumnsMenuHover, isColumnsNavHover],
      () => {
        themeConfig$1.value.columnsAsideStyle === "columnsRound" ? state.difference = 3 : state.difference = 0;
        if (!isColumnsMenuHover.value && !isColumnsNavHover.value) {
          state.liHoverIndex = null;
          mitt.default.emit("setSendColumnsChildren", setSendChildren(route.path));
        } else {
          state.liHoverIndex = state.liOldIndex;
          if (!state.liOldPath) return false;
          mitt.default.emit("setSendColumnsChildren", setSendChildren(state.liOldPath));
        }
      },
      {
        deep: true
      }
    );
    return (_ctx, _cache) => {
      const _component_SvgIcon = vue.resolveComponent("SvgIcon");
      const _component_el_scrollbar = vue.resolveComponent("el-scrollbar");
      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
        vue.createElementVNode("div", _hoisted_2, [
          vue.createElementVNode("img", {
            src: vue.unref(themeConfig$1).logoUrl,
            class: "layout-columns-logo-medium-img"
          }, null, 8, _hoisted_3)
        ]),
        vue.createVNode(_component_el_scrollbar, null, {
          default: vue.withCtx(() => [
            vue.createElementVNode(
              "ul",
              {
                onMouseleave: _cache[0] || (_cache[0] = ($event) => onColumnsAsideMenuMouseleave())
              },
              [
                (vue.openBlock(true), vue.createElementBlock(
                  vue.Fragment,
                  null,
                  vue.renderList(state.columnsAsideList, (v, k) => {
                    return vue.openBlock(), vue.createElementBlock("li", {
                      key: k,
                      onClick: ($event) => onColumnsAsideMenuClick(v),
                      onMouseenter: ($event) => onColumnsAsideMenuMouseenter(v, k),
                      ref_for: true,
                      ref: (el) => {
                        if (el) columnsAsideOffsetTopRefs.value[k] = el;
                      },
                      class: vue.normalizeClass({ "layout-columns-active": state.liIndex === k, "layout-columns-hover": state.liHoverIndex === k }),
                      title: _ctx.$t(`message.menu.${v.meta.title}`)
                    }, [
                      !v.meta.isLink || v.meta.isLink && v.meta.isIframe ? (vue.openBlock(), vue.createElementBlock(
                        "div",
                        {
                          key: 0,
                          class: vue.normalizeClass(vue.unref(themeConfig$1).columnsAsideLayout)
                        },
                        [
                          vue.createVNode(_component_SvgIcon, {
                            name: v.meta.icon
                          }, null, 8, ["name"]),
                          vue.createElementVNode(
                            "div",
                            _hoisted_5,
                            vue.toDisplayString(_ctx.$t(`message.menu.${v.meta.title}`)),
                            1
                            /* TEXT */
                          )
                        ],
                        2
                        /* CLASS */
                      )) : (vue.openBlock(), vue.createElementBlock(
                        "div",
                        {
                          key: 1,
                          class: vue.normalizeClass(vue.unref(themeConfig$1).columnsAsideLayout)
                        },
                        [
                          vue.createElementVNode("a", {
                            href: v.meta.isLink,
                            target: "_blank"
                          }, [
                            vue.createVNode(_component_SvgIcon, {
                              name: v.meta.icon
                            }, null, 8, ["name"]),
                            vue.createElementVNode(
                              "div",
                              _hoisted_7,
                              vue.toDisplayString(_ctx.$t(`message.menu.${v.meta.title}`)),
                              1
                              /* TEXT */
                            )
                          ], 8, _hoisted_6)
                        ],
                        2
                        /* CLASS */
                      ))
                    ], 42, _hoisted_4);
                  }),
                  128
                  /* KEYED_FRAGMENT */
                )),
                vue.createElementVNode(
                  "div",
                  {
                    ref_key: "columnsAsideActiveRef",
                    ref: columnsAsideActiveRef,
                    class: vue.normalizeClass(vue.unref(themeConfig$1).columnsAsideStyle)
                  },
                  null,
                  2
                  /* CLASS */
                )
              ],
              32
              /* NEED_HYDRATION */
            )
          ]),
          _: 1
          /* STABLE */
        })
      ]);
    };
  }
});

exports.default = _sfc_main;
