"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _comp = require("../../ui/src/comp");
var _xeUtils = _interopRequireDefault(require("xe-utils"));
var _ui = require("../../ui");
var _dom = require("../../ui/src/dom");
var _utils = require("../../ui/src/utils");
var _vn = require("../../ui/src/vn");
var _log = require("../../ui/src/log");
var _loading = _interopRequireDefault(require("../../loading"));
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
var _createComponentLog = (0, _log.createComponentLog)('menu'),
  errLog = _createComponentLog.errLog;
var menus = _ui.VxeUI.menus,
  getConfig = _ui.VxeUI.getConfig,
  getIcon = _ui.VxeUI.getIcon;
function createInternalData() {
  return {
    lastActiveTime: 0,
    menuInitMaps: {},
    menuCacheMaps: {},
    menuKeyMaps: {},
    menuEffectMaps: {}
  };
}
function createReactData() {
  return {
    initialized: false,
    isEnterCollapse: false,
    collapseStyle: {},
    collapseZindex: 0,
    activeName: '',
    menuList: [],
    itemHeight: 1
  };
}
var nemuUniqueKey = 100000000;
var _default2 = exports.default = /* define-vxe-component start */(0, _comp.defineVxeComponent)({
  name: 'VxeMenu',
  mixins: [_ui.globalMixins.sizeMixin, _ui.globalMixins.permissionMixin],
  props: {
    value: [String, Number],
    expandAll: Boolean,
    expandKeys: Array,
    accordion: {
      type: Boolean,
      default: function _default() {
        return getConfig().menu.accordion;
      }
    },
    border: {
      type: [Boolean, String],
      default: function _default() {
        return getConfig().menu.border;
      }
    },
    optionProps: {
      type: Object,
      default: function _default() {
        return getConfig().menu.optionProps;
      }
    },
    collapsed: {
      type: Boolean,
      default: null
    },
    collapseFixed: Boolean,
    loading: Boolean,
    options: {
      type: Array,
      default: function _default() {
        return [];
      }
    },
    size: {
      type: String,
      default: function _default() {
        return getConfig().menu.size || getConfig().size;
      }
    },
    menuConfig: Object
  },
  inject: {
    $xeLayoutAside: {
      default: null
    }
  },
  data: function data() {
    var reactData = createReactData();
    return Object.assign(Object.assign({}, {}), {
      xID: _xeUtils.default.uniqueId(),
      reactData: reactData
    });
  },
  computed: Object.assign(Object.assign({}, {}), {
    computePropsOpts: function computePropsOpts() {
      var $xeMenu = this;
      var props = $xeMenu;
      return Object.assign({}, getConfig().menu.optionProps, props.optionProps);
    },
    computeTitleField: function computeTitleField() {
      var $xeMenu = this;
      var propsOpts = $xeMenu.computePropsOpts;
      return propsOpts.title || 'title';
    },
    computeKeyField: function computeKeyField() {
      var $xeMenu = this;
      var propsOpts = $xeMenu.computePropsOpts;
      return propsOpts.name || 'name';
    },
    computeChildrenField: function computeChildrenField() {
      var $xeMenu = this;
      var propsOpts = $xeMenu.computePropsOpts;
      return propsOpts.children || 'children';
    },
    computeLinkUrlField: function computeLinkUrlField() {
      var $xeMenu = this;
      var propsOpts = $xeMenu.computePropsOpts;
      return propsOpts.linkUrl || 'linkUrl';
    },
    computeRouterLinkField: function computeRouterLinkField() {
      var $xeMenu = this;
      var propsOpts = $xeMenu.computePropsOpts;
      return propsOpts.routerLink || 'routerLink';
    },
    computeCurrBorder: function computeCurrBorder() {
      var $xeMenu = this;
      var props = $xeMenu;
      var border = props.border;
      if (border) {
        return border === true ? 'first-group' : border;
      }
      return '';
    },
    computeMenuOpts: function computeMenuOpts() {
      var $xeMenu = this;
      var props = $xeMenu;
      return Object.assign({}, getConfig().tree.menuConfig, props.menuConfig);
    },
    computeIsCollapsed: function computeIsCollapsed() {
      var $xeMenu = this;
      var $xeLayoutAside = $xeMenu.$xeLayoutAside;
      var collapsed = $xeMenu.collapsed;
      if (_xeUtils.default.isBoolean(collapsed)) {
        return collapsed;
      }
      if ($xeLayoutAside) {
        return !!$xeLayoutAside.collapsed;
      }
      return false;
    },
    computeVarStyle: function computeVarStyle() {
      var $xeMenu = this;
      var $xeLayoutAside = $xeMenu.$xeLayoutAside;
      if ($xeLayoutAside) {
        var asideVarStyle = $xeLayoutAside.computeVarStyle;
        return asideVarStyle;
      }
      return {};
    },
    computeCollapseEnterWidth: function computeCollapseEnterWidth() {
      var $xeMenu = this;
      var $xeLayoutAside = $xeMenu.$xeLayoutAside;
      var width = '';
      if ($xeLayoutAside) {
        width = $xeLayoutAside.width || '';
      }
      return width;
    }
  }),
  methods: {
    //
    // Method
    //
    dispatchEvent: function dispatchEvent(type, params, evnt) {
      var $xeMenu = this;
      $xeMenu.$emit(type, (0, _ui.createEvent)(evnt, {
        $menu: $xeMenu
      }, params));
    },
    emitModel: function emitModel(value) {
      var $xeMenu = this;
      var reactData = $xeMenu.reactData;
      var _events = $xeMenu._events;
      reactData.activeName = value;
      $xeMenu.$emit('input', value);
      if (_events && _events.modelValue) {
        $xeMenu.$emit('modelValue', value);
      } else {
        $xeMenu.$emit('model-value', value);
      }
    },
    callSlot: function callSlot(slotFunc, params, h) {
      var $xeMenu = this;
      var slots = $xeMenu.$scopedSlots;
      if (slotFunc) {
        if (_xeUtils.default.isString(slotFunc)) {
          slotFunc = slots[slotFunc] || null;
        }
        if (_xeUtils.default.isFunction(slotFunc)) {
          return (0, _vn.getSlotVNs)(slotFunc.call($xeMenu, params, h));
        }
      }
      return [];
    },
    setExpandByMenuKey: function setExpandByMenuKey(menuKeys, expanded) {
      var $xeMenu = this;
      var internalData = $xeMenu.internalData;
      var menuKeyMaps = internalData.menuKeyMaps,
        menuInitMaps = internalData.menuInitMaps;
      if (menuKeys) {
        if (!_xeUtils.default.isArray(menuKeys)) {
          menuKeys = [menuKeys];
        }
        menuKeys.forEach(function (mKey) {
          var menuItem = menuKeyMaps[mKey];
          if (menuItem) {
            if (expanded) {
              menuInitMaps[menuItem.itemId] = true;
            }
            menuItem.isExpand = !!expanded;
          }
        });
      }
      return $xeMenu.$nextTick();
    },
    clearAllExpandMenu: function clearAllExpandMenu() {
      var $xeMenu = this;
      var reactData = $xeMenu.reactData;
      var internalData = $xeMenu.internalData;
      var menuList = reactData.menuList;
      _xeUtils.default.eachTree(menuList, function (item) {
        item.isExpand = false;
      }, {
        children: 'childList'
      });
      internalData.menuInitMaps = {};
      return $xeMenu.$nextTick();
    },
    handleScrollToView: function handleScrollToView(itemId) {
      var $xeMenu = this;
      var el = $xeMenu.$refs.refElem;
      var nemuEl = el ? el.querySelector(".vxe-menu--item-wrapper[data-menu-id=\"".concat(itemId, "\"]")) : null;
      if (nemuEl) {
        (0, _dom.scrollToView)(nemuEl);
        return true;
      }
      return false;
    },
    scrollToMenuKey: function scrollToMenuKey(menuKey) {
      var $xeMenu = this;
      var internalData = $xeMenu.internalData;
      var menuKeyMaps = internalData.menuKeyMaps;
      var menuItem = menuKeyMaps[menuKey];
      if (!menuItem) {
        return $xeMenu.$nextTick();
      }
      var itemId = menuItem.itemId;
      if ($xeMenu.handleScrollToView(itemId)) {
        return $xeMenu.$nextTick();
      }
      return $xeMenu.$nextTick().then(function () {
        $xeMenu.handleScrollToView(itemId);
      });
    },
    scrollToActiveMenu: function scrollToActiveMenu() {
      var $xeMenu = this;
      var reactData = $xeMenu.reactData;
      var activeName = reactData.activeName;
      if (activeName) {
        return $xeMenu.scrollToMenuKey(activeName);
      }
      return $xeMenu.$nextTick().then(function () {
        var activeName = reactData.activeName;
        if (activeName) {
          return $xeMenu.scrollToMenuKey(activeName);
        }
      });
    },
    getMenuTitle: function getMenuTitle(item) {
      return "".concat(item.title || item.name);
    },
    updateZindex: function updateZindex() {
      var $xeMenu = this;
      var reactData = $xeMenu.reactData;
      if (reactData.collapseZindex < (0, _utils.getLastZIndex)()) {
        reactData.collapseZindex = (0, _utils.nextZIndex)();
      }
    },
    updateActiveMenu: function updateActiveMenu(isDefExpand) {
      var $xeMenu = this;
      var reactData = $xeMenu.reactData;
      var internalData = $xeMenu.internalData;
      var activeName = reactData.activeName;
      var menuInitMaps = internalData.menuInitMaps;
      _xeUtils.default.eachTree(reactData.menuList, function (item, index, items, path, parent, nodes) {
        if (item.itemKey === activeName) {
          nodes.forEach(function (obj) {
            obj.isActive = true;
            if (isDefExpand) {
              obj.isExpand = true;
              menuInitMaps[obj.itemId] = true;
            }
          });
          item.isExactActive = true;
        } else {
          item.isExactActive = false;
          item.isActive = false;
        }
      }, {
        children: 'childList'
      });
    },
    updateMenuConfig: function updateMenuConfig() {
      var $xeMenu = this;
      var props = $xeMenu;
      var reactData = $xeMenu.reactData;
      var internalData = $xeMenu.internalData;
      var options = props.options,
        expandAll = props.expandAll,
        expandKeys = props.expandKeys;
      var muInitMaps = {};
      var titleField = $xeMenu.computeTitleField;
      var keyField = $xeMenu.computeKeyField;
      var childrenField = $xeMenu.computeChildrenField;
      var linkUrlField = $xeMenu.computeLinkUrlField;
      var routerLinkField = $xeMenu.computeRouterLinkField;
      var defaultExpandMaps = {};
      if (expandKeys) {
        expandKeys.forEach(function (key) {
          defaultExpandMaps[key] = true;
        });
      }
      var muCacheMaps = {};
      var muKeyMaps = {};
      reactData.menuList = _xeUtils.default.mapTree(options, function (item, index, items, path, parentItem) {
        var itemId = ++nemuUniqueKey;
        var itemKey = item[keyField] || path.join(',');
        var childList = item[childrenField];
        var hasChild = childList && childList.length > 0;
        var isExpand = hasChild ? _xeUtils.default.isBoolean(item.expanded) ? item.expanded : defaultExpandMaps[itemKey] || !!expandAll : false;
        if (isExpand) {
          muInitMaps[itemId] = true;
        }
        var objItem = {
          itemConf: item,
          title: item[titleField],
          name: item[keyField],
          icon: item.icon,
          linkUrl: item[linkUrlField],
          linkTarget: item.linkTarget,
          routerLink: item[routerLinkField],
          permissionCode: item.permissionCode,
          children: childList,
          slots: item.slots,
          parentKey: parentItem ? parentItem.name || path.slice(0, path.length - 1).join(',') : '',
          level: path.length,
          itemId: itemId,
          itemKey: itemKey,
          isExactActive: false,
          isActive: false,
          isExpand: isExpand,
          hasChild: hasChild,
          childList: []
        };
        if (muKeyMaps[itemKey]) {
          errLog('vxe.error.repeatKey', [keyField, item[keyField]]);
        }
        muCacheMaps[itemId] = objItem;
        muKeyMaps[itemKey] = objItem;
        return objItem;
      }, {
        children: 'children',
        mapChildren: 'childList'
      });
      internalData.menuInitMaps = muInitMaps;
      internalData.menuCacheMaps = muCacheMaps;
      internalData.menuKeyMaps = muKeyMaps;
    },
    updateCollapseStyle: function updateCollapseStyle() {
      var $xeMenu = this;
      var props = $xeMenu;
      var reactData = $xeMenu.reactData;
      var collapseFixed = props.collapseFixed;
      if (collapseFixed) {
        $xeMenu.$nextTick(function () {
          var isCollapsed = $xeMenu.computeIsCollapsed;
          var el = $xeMenu.$refs.refElem;
          if (el) {
            var clientRect = el.getBoundingClientRect();
            var parentNode = el.parentNode;
            reactData.collapseStyle = isCollapsed ? {
              top: (0, _dom.toCssUnit)(clientRect.top),
              left: (0, _dom.toCssUnit)(clientRect.left),
              height: (0, _dom.toCssUnit)(parentNode.clientHeight),
              zIndex: reactData.collapseZindex
            } : {};
          }
        });
      }
    },
    handleCollapseMenu: function handleCollapseMenu() {
      var $xeMenu = this;
      var props = $xeMenu;
      var reactData = $xeMenu.reactData;
      var collapseFixed = props.collapseFixed;
      if (collapseFixed) {
        var initialized = reactData.initialized;
        var isCollapsed = $xeMenu.computeIsCollapsed;
        if (isCollapsed) {
          if (!initialized) {
            reactData.initialized = true;
            $xeMenu.$nextTick(function () {
              var collapseEl = $xeMenu.$refs.refCollapseElem;
              if (collapseEl) {
                document.body.appendChild(collapseEl);
              }
            });
          }
        }
        reactData.isEnterCollapse = false;
        $xeMenu.updateZindex();
        $xeMenu.updateCollapseStyle();
      }
    },
    handleClickIconCollapse: function handleClickIconCollapse(evnt, item, itemList) {
      var $xeMenu = this;
      var props = $xeMenu;
      var internalData = $xeMenu.internalData;
      var accordion = props.accordion;
      var menuEffectMaps = internalData.menuEffectMaps,
        menuInitMaps = internalData.menuInitMaps;
      var itemId = item.itemId,
        hasChild = item.hasChild,
        isExpand = item.isExpand;
      var isCollapsed = $xeMenu.computeIsCollapsed;
      var expanded = !isExpand;
      if (hasChild) {
        evnt.stopPropagation();
        evnt.preventDefault();
        if (menuEffectMaps[itemId]) {
          clearTimeout(menuEffectMaps[itemId]);
        }
        if (accordion) {
          itemList.forEach(function (obj) {
            if (obj !== item) {
              obj.isExpand = false;
            }
          });
        }
        item.isExpand = expanded;
        menuInitMaps[itemId] = true;
        var wrapperEl = isCollapsed ? $xeMenu.$refs.refCollapseElem : $xeMenu.$refs.refElem;
        if (wrapperEl) {
          var nemuEl = wrapperEl.querySelector(".vxe-menu--item-wrapper[data-menu-id=\"".concat(itemId, "\"]"));
          var groupEl = nemuEl ? nemuEl.querySelector('.vxe-menu--item-group') : null;
          if (groupEl) {
            if (expanded) {
              groupEl.style.height = '0';
              groupEl.setAttribute('data-effect', 'y');
              requestAnimationFrame(function () {
                groupEl.style.height = "".concat(groupEl.scrollHeight, "px");
              });
            } else {
              groupEl.style.height = "".concat(groupEl.scrollHeight, "px");
              groupEl.setAttribute('data-effect', 'y');
              requestAnimationFrame(function () {
                groupEl.style.height = '0';
              });
            }
            menuEffectMaps[itemId] = setTimeout(function () {
              delete menuEffectMaps[itemId];
              groupEl.removeAttribute('data-effect');
              groupEl.style.height = '';
            }, 350);
          }
        }
      }
    },
    handleContextmenuEvent: function handleContextmenuEvent(evnt, item) {
      var $xeMenu = this;
      var props = $xeMenu;
      var menuConfig = props.menuConfig;
      var menuOpts = $xeMenu.computeMenuOpts;
      if (menuConfig ? (0, _utils.isEnableConf)(menuOpts) : menuOpts.enabled) {
        var options = menuOpts.options,
          visibleMethod = menuOpts.visibleMethod;
        if (!visibleMethod || visibleMethod({
          $menu: $xeMenu,
          options: options,
          currentMenu: item,
          currentOption: item.itemConf
        })) {
          if (_ui.VxeUI.contextMenu) {
            _ui.VxeUI.contextMenu.openByEvent(evnt, {
              options: options,
              events: {
                optionClick: function optionClick(eventParams) {
                  var option = eventParams.option;
                  var gMenuOpts = menus.get(option.code);
                  var mmMethod = gMenuOpts ? gMenuOpts.menuMenuMethod : null;
                  var params = {
                    menu: option,
                    currentMenu: item,
                    currentOption: item.itemConf,
                    $event: evnt,
                    $menu: $xeMenu
                  };
                  if (mmMethod) {
                    mmMethod(params, evnt);
                  }
                  $xeMenu.dispatchEvent('menu-click', params, eventParams.$event);
                }
              }
            });
          }
        }
      }
      $xeMenu.dispatchEvent('option-menu', {
        currentMenu: item
      }, evnt);
    },
    handleClickMenu: function handleClickMenu(evnt, item, itemList) {
      var $xeMenu = this;
      var reactData = $xeMenu.reactData;
      var internalData = $xeMenu.internalData;
      var itemKey = item.itemKey,
        linkUrl = item.linkUrl,
        routerLink = item.routerLink,
        hasChild = item.hasChild;
      if (linkUrl || routerLink) {
        $xeMenu.emitModel(itemKey);
        reactData.isEnterCollapse = false;
        internalData.lastActiveTime = Date.now();
      } else {
        if (hasChild) {
          $xeMenu.handleClickIconCollapse(evnt, item, itemList);
        } else {
          $xeMenu.emitModel(itemKey);
          reactData.isEnterCollapse = false;
          internalData.lastActiveTime = Date.now();
        }
      }
      var params = {
        currentMenu: item,
        currentOption: item.itemConf,
        option: item.itemConf,
        // 已废弃
        menu: item
      };
      $xeMenu.dispatchEvent('click', params, evnt);
    },
    handleMenuMouseenter: function handleMenuMouseenter() {
      var $xeMenu = this;
      var reactData = $xeMenu.reactData;
      var internalData = $xeMenu.internalData;
      var lastActiveTime = internalData.lastActiveTime;
      if (lastActiveTime < Date.now() - 500) {
        reactData.isEnterCollapse = true;
      }
    },
    handleMenuMouseleave: function handleMenuMouseleave() {
      var $xeMenu = this;
      var reactData = $xeMenu.reactData;
      reactData.isEnterCollapse = false;
    },
    //
    //
    // Render
    //
    renderMenuTitle: function renderMenuTitle(h, item, itemList) {
      var $xeMenu = this;
      var slots = $xeMenu.$scopedSlots;
      var icon = item.icon,
        isExpand = item.isExpand,
        hasChild = item.hasChild;
      var itemSlots = item.slots || {};
      var optionSlot = itemSlots.default || slots.option;
      var titleSlot = itemSlots.title || slots.optionTitle || slots['option-title'];
      var iconSlot = itemSlots.icon || slots.optionIcon || slots['option-icon'];
      var title = $xeMenu.getMenuTitle(item);
      var isCollapsed = $xeMenu.computeIsCollapsed;
      var params = {
        currentMenu: item,
        currentOption: item.itemConf,
        option: item.itemConf,
        collapsed: isCollapsed
      };
      return [optionSlot ? (0, _ui.renderEmptyElement)($xeMenu) : h('div', {
        class: 'vxe-menu--item-link-icon'
      }, iconSlot ? $xeMenu.callSlot(iconSlot, params, h) : icon ? [h('i', {
        class: icon
      })] : []), optionSlot ? h('div', {
        class: 'vxe-menu--item-custom-title'
      }, $xeMenu.callSlot(optionSlot, params, h)) : h('div', {
        class: 'vxe-menu--item-link-title',
        attrs: {
          title: title
        }
      }, titleSlot ? $xeMenu.callSlot(titleSlot, params, h) : title), hasChild ? h('div', {
        class: 'vxe-menu--item-link-collapse',
        on: {
          click: function click(evnt) {
            $xeMenu.handleClickIconCollapse(evnt, item, itemList);
          }
        }
      }, [h('i', {
        class: isExpand ? getIcon().MENU_ITEM_EXPAND_OPEN : getIcon().MENU_ITEM_EXPAND_CLOSE
      })]) : (0, _ui.renderEmptyElement)($xeMenu)];
    },
    renderDefaultChildren: function renderDefaultChildren(h, item, itemList) {
      var $xeMenu = this;
      var reactData = $xeMenu.reactData;
      var internalData = $xeMenu.internalData;
      var itemId = item.itemId,
        itemKey = item.itemKey,
        level = item.level,
        hasChild = item.hasChild,
        isActive = item.isActive,
        isExactActive = item.isExactActive,
        isExpand = item.isExpand,
        linkUrl = item.linkUrl,
        routerLink = item.routerLink,
        linkTarget = item.linkTarget,
        childList = item.childList;
      var isEnterCollapse = reactData.isEnterCollapse;
      var menuInitMaps = internalData.menuInitMaps;
      var isCollapsed = $xeMenu.computeIsCollapsed;
      if (item.permissionCode) {
        if (!_ui.permission.checkVisible(item.permissionCode)) {
          return (0, _ui.renderEmptyElement)($xeMenu);
        }
      }
      var isExpandChild = (!isCollapsed || isEnterCollapse) && isExpand;
      var linkOns = {
        contextmenu: function contextmenu(evnt) {
          $xeMenu.handleContextmenuEvent(evnt, item);
        },
        click: function click(evnt) {
          $xeMenu.handleClickMenu(evnt, item, itemList);
        }
      };
      return h('div', {
        key: itemKey,
        class: ['vxe-menu--item-wrapper', "vxe-menu--item-level".concat(level), {
          'has--child': hasChild,
          'is--exact-active': isExactActive,
          'is--active': isActive,
          'is--expand': isExpandChild
        }],
        attrs: {
          'data-menu-id': itemId
        }
      }, [linkUrl ? h('a', {
        class: 'vxe-menu--item-link is--link',
        attrs: {
          href: linkUrl,
          target: linkTarget
        },
        on: linkOns
      }, $xeMenu.renderMenuTitle(h, item, itemList)) : routerLink ? h('router-link', {
        class: 'vxe-menu--item-link is--router',
        props: {
          custom: true,
          to: routerLink,
          target: linkTarget
        },
        on: linkOns
      }, $xeMenu.renderMenuTitle(h, item, itemList)) : h('div', {
        class: 'vxe-menu--item-link is--default',
        on: linkOns
      }, $xeMenu.renderMenuTitle(h, item, itemList)), hasChild ? h('div', {
        class: 'vxe-menu--item-group'
      }, isExpandChild || menuInitMaps[itemId] ? childList.map(function (child) {
        return $xeMenu.renderDefaultChildren(h, child, childList);
      }) : []) : (0, _ui.renderEmptyElement)($xeMenu)]);
    },
    renderCollapseChildren: function renderCollapseChildren(h, item, itemList) {
      var $xeMenu = this;
      var itemId = item.itemId,
        itemKey = item.itemKey,
        level = item.level,
        hasChild = item.hasChild,
        isActive = item.isActive,
        isExactActive = item.isExactActive,
        routerLink = item.routerLink,
        linkUrl = item.linkUrl,
        linkTarget = item.linkTarget,
        childList = item.childList;
      if (item.permissionCode) {
        if (!_ui.permission.checkVisible(item.permissionCode)) {
          return (0, _ui.renderEmptyElement)($xeMenu);
        }
      }
      var linkOns = {
        contextmenu: function contextmenu(evnt) {
          $xeMenu.handleContextmenuEvent(evnt, item);
        },
        click: function click(evnt) {
          $xeMenu.handleClickMenu(evnt, item, itemList);
        }
      };
      return h('div', {
        key: itemKey,
        class: ['vxe-menu--item-wrapper', "vxe-menu--item-level".concat(level), {
          'has--child': hasChild,
          'is--exact-active': isExactActive,
          'is--active': isActive
        }],
        attrs: {
          'data-menu-id': itemId
        }
      }, [linkUrl ? h('a', {
        class: 'vxe-menu--item-link is--link',
        attrs: {
          href: linkUrl,
          target: linkTarget
        },
        on: linkOns
      }, $xeMenu.renderMenuTitle(h, item, itemList)) : routerLink ? h('router-link', {
        class: 'vxe-menu--item-link is--router',
        props: {
          custom: true,
          to: routerLink,
          target: linkTarget
        },
        on: linkOns
      }, $xeMenu.renderMenuTitle(h, item, itemList)) : h('div', {
        class: 'vxe-menu--item-link is--default',
        on: linkOns
      }, $xeMenu.renderMenuTitle(h, item, itemList)), hasChild ? h('div', {
        class: 'vxe-menu--item-group'
      }, childList.map(function (child) {
        return $xeMenu.renderDefaultChildren(h, child, childList);
      })) : (0, _ui.renderEmptyElement)($xeMenu)]);
    },
    renderVN: function renderVN(h) {
      var $xeMenu = this;
      var props = $xeMenu;
      var slots = $xeMenu.$scopedSlots;
      var reactData = $xeMenu.reactData;
      var loading = props.loading,
        collapseFixed = props.collapseFixed;
      var initialized = reactData.initialized,
        menuList = reactData.menuList,
        collapseStyle = reactData.collapseStyle,
        isEnterCollapse = reactData.isEnterCollapse;
      var vSize = $xeMenu.computeSize;
      var isCollapsed = $xeMenu.computeIsCollapsed;
      var currBorder = $xeMenu.computeCurrBorder;
      var varStyle = $xeMenu.computeVarStyle;
      var headerSlot = slots.header;
      var footerSlot = slots.footer;
      var ons = {};
      if (collapseFixed) {
        ons = {
          mouseenter: $xeMenu.handleMenuMouseenter,
          mouseleave: $xeMenu.handleMenuMouseleave
        };
      }
      var stParams = {
        collapsed: isCollapsed
      };
      return h('div', {
        ref: 'refElem',
        class: ['vxe-menu', _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "border--".concat(currBorder), currBorder), "size--".concat(vSize), vSize), 'is--collapsed', isCollapsed), 'is--loading', loading)]
      }, [headerSlot ? h('div', {
        class: 'vxe-menu--header'
      }, headerSlot(stParams)) : (0, _ui.renderEmptyElement)($xeMenu), h('div', {
        class: 'vxe-menu--body'
      }, menuList.map(function (child) {
        return isCollapsed ? $xeMenu.renderCollapseChildren(h, child, menuList) : $xeMenu.renderDefaultChildren(h, child, menuList);
      })), footerSlot ? h('div', {
        class: 'vxe-menu--footer'
      }, footerSlot(stParams)) : (0, _ui.renderEmptyElement)($xeMenu), initialized ? h('div', {
        ref: 'refCollapseElem',
        class: ['vxe-menu--collapse-wrapper', _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "size--".concat(vSize), vSize), 'is--collapsed', isCollapsed), 'is--enter', isEnterCollapse), 'is--loading', loading)],
        style: Object.assign({}, varStyle, collapseStyle),
        on: ons
      }, isCollapsed ? [headerSlot ? h('div', {
        class: 'vxe-menu--header'
      }, headerSlot(stParams)) : (0, _ui.renderEmptyElement)($xeMenu), h('div', {
        class: 'vxe-menu--body'
      }, menuList.map(function (child) {
        return $xeMenu.renderDefaultChildren(h, child, menuList);
      })), footerSlot ? h('div', {
        class: 'vxe-menu--footer'
      }, footerSlot(stParams)) : (0, _ui.renderEmptyElement)($xeMenu)] : []) : (0, _ui.renderEmptyElement)($xeMenu),
      /**
       * 加载中
       */
      h(_loading.default, {
        class: 'vxe-list-view--loading',
        props: {
          value: loading
        }
      })]);
    }
  },
  watch: {
    value: function value(val) {
      var $xeMenu = this;
      var reactData = $xeMenu.reactData;
      reactData.activeName = val;
    },
    options: function options() {
      var $xeMenu = this;
      $xeMenu.updateMenuConfig();
      $xeMenu.updateActiveMenu(true);
      $xeMenu.$nextTick(function () {
        $xeMenu.scrollToActiveMenu();
      });
    },
    'reactData.activeName': function reactDataActiveName() {
      var $xeMenu = this;
      $xeMenu.updateActiveMenu(true);
    },
    computeIsCollapsed: function computeIsCollapsed() {
      var $xeMenu = this;
      $xeMenu.handleCollapseMenu();
    }
  },
  created: function created() {
    var $xeMenu = this;
    var props = $xeMenu;
    $xeMenu.internalData = createInternalData();
    var reactData = $xeMenu.reactData;
    reactData.initialized = !!props.collapsed;
    reactData.activeName = props.value;
    $xeMenu.updateMenuConfig();
    $xeMenu.updateActiveMenu(true);
  },
  mounted: function mounted() {
    var $xeMenu = this;
    var props = $xeMenu;
    var menuConfig = props.menuConfig;
    var VxeUIContextMenu = _ui.VxeUI.getComponent('VxeContextMenu');
    if (menuConfig && !VxeUIContextMenu) {
      errLog('vxe.error.reqComp', ['vxe-context-menu']);
    }
    $xeMenu.updateCollapseStyle();
    _ui.globalEvents.on($xeMenu, 'resize', $xeMenu.updateCollapseStyle);
    $xeMenu.$nextTick(function () {
      $xeMenu.scrollToActiveMenu();
    });
  },
  beforeDestroy: function beforeDestroy() {
    var $xeMenu = this;
    var reactData = $xeMenu.reactData;
    var internalData = $xeMenu.internalData;
    var collapseEl = $xeMenu.$refs.refCollapseElem;
    if (collapseEl) {
      var parentNode = collapseEl.parentNode;
      if (parentNode) {
        parentNode.removeChild(collapseEl);
      }
    }
    _ui.globalEvents.off($xeMenu, 'resize');
    _xeUtils.default.assign(reactData, createReactData());
    _xeUtils.default.assign(internalData, createInternalData());
  },
  render: function render(h) {
    return this.renderVN(h);
  }
});
/* define-vxe-component end */