@fmdevui/fm-dev/lib/packages/core/layout/navMenu/vertical.vue2.js

Page level components developed based on Element Plus.

'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 index = require('../../utils/other/index.js');
require('./subItem.vue.js');
var subItem_vue_vue_type_script_setup_true_name_navMenuSubItem_lang = require('./subItem.vue2.js');
var themeConfig = require('../../stores/themeConfig.js');

const _hoisted_1 = ["onClick"];
var _sfc_main = /* @__PURE__ */ vue.defineComponent({
  __name: "vertical",
  props: {
    // 菜单列表
    menuList: {
      type: Array,
      default: () => []
    }
  },
  setup(__props) {
    const SubItem = subItem_vue_vue_type_script_setup_true_name_navMenuSubItem_lang.default;
    const props = __props;
    const storesThemeConfig = themeConfig.useThemeConfig();
    const { themeConfig: themeConfig$1 } = pinia.storeToRefs(storesThemeConfig);
    const route = vueRouter.useRoute();
    const state = vue.reactive({
      // 修复：
      defaultActive: route.meta.isDynamic ? route.meta.isDynamicPath : route.path,
      isCollapse: false
    });
    const menuLists = vue.computed(() => {
      return props.menuList;
    });
    const getThemeConfig = vue.computed(() => {
      return themeConfig$1.value;
    });
    const setParentHighlight = (currentRoute) => {
      const { path, meta } = currentRoute;
      const pathSplit = meta?.isDynamic ? meta.isDynamicPath.split("/") : path.split("/");
      if (pathSplit.length >= 4 && meta?.isHide) return pathSplit.splice(0, 3).join("/");
      else return path;
    };
    const onALinkClick = (val) => {
      index.default.handleOpenLink(val);
    };
    vue.onMounted(() => {
      state.defaultActive = setParentHighlight(route);
    });
    vueRouter.onBeforeRouteUpdate((to) => {
      state.defaultActive = setParentHighlight(to);
      const clientWidth = document.body.clientWidth;
      if (clientWidth < 1e3) themeConfig$1.value.isCollapse = false;
    });
    vue.watch(
      () => themeConfig$1.value.isCollapse,
      (isCollapse) => {
        document.body.clientWidth <= 1e3 ? state.isCollapse = false : state.isCollapse = isCollapse;
      },
      {
        immediate: true
      }
    );
    return (_ctx, _cache) => {
      const _component_SvgIcon = vue.resolveComponent("SvgIcon");
      const _component_el_sub_menu = vue.resolveComponent("el-sub-menu");
      const _component_el_menu_item = vue.resolveComponent("el-menu-item");
      const _component_el_menu = vue.resolveComponent("el-menu");
      return vue.openBlock(), vue.createBlock(_component_el_menu, {
        router: "",
        "default-active": state.defaultActive,
        "background-color": "transparent",
        collapse: state.isCollapse,
        "unique-opened": getThemeConfig.value.isUniqueOpened,
        "collapse-transition": false
      }, {
        default: vue.withCtx(() => [
          (vue.openBlock(true), vue.createElementBlock(
            vue.Fragment,
            null,
            vue.renderList(menuLists.value, (val) => {
              return vue.openBlock(), vue.createElementBlock(
                vue.Fragment,
                null,
                [
                  val.children && val.children.length > 0 ? (vue.openBlock(), vue.createBlock(_component_el_sub_menu, {
                    index: val.path,
                    key: val.path
                  }, {
                    title: vue.withCtx(() => [
                      vue.createVNode(_component_SvgIcon, {
                        name: val.meta.icon
                      }, null, 8, ["name"]),
                      vue.createCommentVNode(" <span>{{ $t(val.meta.title) }}</span> "),
                      vue.createElementVNode(
                        "span",
                        null,
                        vue.toDisplayString(_ctx.$t(`message.menu.${val.meta.title}`)),
                        1
                        /* TEXT */
                      )
                    ]),
                    default: vue.withCtx(() => [
                      vue.createVNode(vue.unref(SubItem), {
                        chil: val.children
                      }, null, 8, ["chil"])
                    ]),
                    _: 2
                    /* DYNAMIC */
                  }, 1032, ["index"])) : (vue.openBlock(), vue.createBlock(_component_el_menu_item, {
                    index: val.path,
                    key: val.path
                  }, vue.createSlots({
                    default: vue.withCtx(() => [
                      vue.createVNode(_component_SvgIcon, {
                        name: val.meta.icon
                      }, null, 8, ["name"])
                    ]),
                    _: 2
                    /* DYNAMIC */
                  }, [
                    !val.meta.isLink || val.meta.isLink && val.meta.isIframe ? {
                      name: "title",
                      fn: vue.withCtx(() => [
                        vue.createCommentVNode(" <span>{{ $t(val.meta.title) }}</span> "),
                        vue.createElementVNode(
                          "span",
                          null,
                          vue.toDisplayString(_ctx.$t(`message.menu.${val.meta.title}`)),
                          1
                          /* TEXT */
                        )
                      ]),
                      key: "0"
                    } : {
                      name: "title",
                      fn: vue.withCtx(() => [
                        vue.createElementVNode("a", {
                          class: "w100",
                          onClick: vue.withModifiers(($event) => onALinkClick(val), ["prevent"])
                        }, vue.toDisplayString(_ctx.$t(`message.menu.${val.meta.title}`)), 9, _hoisted_1)
                      ]),
                      key: "1"
                    }
                  ]), 1032, ["index"]))
                ],
                64
                /* STABLE_FRAGMENT */
              );
            }),
            256
            /* UNKEYED_FRAGMENT */
          ))
        ]),
        _: 1
        /* STABLE */
      }, 8, ["default-active", "collapse", "unique-opened"]);
    };
  }
});

exports.default = _sfc_main;