"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _ui = require("../../../ui");
var _xeUtils = _interopRequireDefault(require("xe-utils"));
var _utils = require("../../../ui/src/utils");
var _vn = require("../../../ui/src/vn");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
const {
  getIcon,
  renderEmptyElement
} = _ui.VxeUI;
var _default = exports.default = {
  name: 'VxeTableMenuPanel',
  props: {
    ctxMenuStore: Object,
    ctxMenuOpts: Object
  },
  inject: {
    $xeTable: {
      default: null
    }
  },
  mounted() {
    const $xeMenuPanel = this;
    const $xeTable = $xeMenuPanel.$xeTable;
    const menuOpts = $xeTable.computeMenuOpts;
    const {
      transfer
    } = menuOpts;
    const el = this.$refs.refElem;
    if (transfer && el) {
      document.body.appendChild(el);
    }
  },
  beforeDestroy() {
    const el = this.$refs.refElem;
    if (el && el.parentNode) {
      el.parentNode.removeChild(el);
    }
  },
  render(h) {
    const $xeMenuPanel = this;
    const $xeTable = $xeMenuPanel.$xeTable;
    const tableReactData = $xeTable;
    const {
      ctxMenuStore
    } = tableReactData;
    const menuOpts = $xeTable.computeMenuOpts;
    const {
      destroyOnClose
    } = menuOpts;
    const {
      visible,
      list,
      className
    } = ctxMenuStore;
    return h('div', {
      ref: 'refElem',
      class: ['vxe-table--context-menu-wrapper', className, {
        'is--visible': visible
      }],
      style: ctxMenuStore.style
    }, (destroyOnClose ? visible : true) ? list.map((options, gIndex) => {
      return options.every(item => item.visible === false) ? renderEmptyElement($xeTable) : h('ul', {
        class: 'vxe-context-menu--option-wrapper',
        key: gIndex
      }, options.map((item, index) => {
        const hasChildMenus = item.children && item.children.some(child => child.visible !== false);
        const prefixOpts = Object.assign({}, item.prefixConfig);
        const prefixIcon = prefixOpts.icon || item.prefixIcon;
        const suffixOpts = Object.assign({}, item.suffixConfig);
        const suffixIcon = suffixOpts.icon || item.suffixIcon;
        const menuContent = (0, _utils.getFuncText)(item.name);
        return item.visible === false ? renderEmptyElement($xeTable) : h('li', {
          class: [item.className, {
            'link--disabled': item.disabled,
            'link--active': item === ctxMenuStore.selected
          }],
          key: `${gIndex}_${index}`
        }, [h('a', {
          class: 'vxe-context-menu--link',
          on: {
            click(evnt) {
              $xeTable.ctxMenuLinkEvent(evnt, item);
            },
            mouseover(evnt) {
              $xeTable.ctxMenuMouseoverEvent(evnt, item);
            },
            mouseout(evnt) {
              $xeTable.ctxMenuMouseoutEvent(evnt, item);
            }
          }
        }, [h('div', {
          class: ['vxe-context-menu--link-prefix', prefixOpts.className || '']
        }, [prefixIcon && _xeUtils.default.isFunction(prefixIcon) ? h('span', {}, (0, _vn.getSlotVNs)(prefixIcon.call($xeTable, {}))) : h('i', {
          class: prefixIcon
        }), prefixOpts.content ? h('span', {}, `${prefixOpts.content}`) : renderEmptyElement($xeTable)]), h('span', {
          class: 'vxe-context-menu--link-content',
          attrs: {
            title: menuContent
          }
        }, menuContent), h('div', {
          class: ['vxe-context-menu--link-suffix', suffixOpts.className || '']
        }, [suffixIcon && _xeUtils.default.isFunction(suffixIcon) ? h('span', {}, (0, _vn.getSlotVNs)(suffixIcon.call($xeTable, {}))) : h('i', {
          class: suffixIcon || (hasChildMenus ? getIcon().TABLE_MENU_OPTIONS : '')
        }), suffixOpts.content ? h('span', `${suffixOpts.content}`) : renderEmptyElement($xeTable)])]), hasChildMenus && item.children ? h('ul', {
          class: ['vxe-table--context-menu-clild-wrapper', {
            'is--show': item === ctxMenuStore.selected && ctxMenuStore.showChild
          }]
        }, item.children.map((child, cIndex) => {
          const childPrefixOpts = Object.assign({}, child.prefixConfig);
          const childPrefixIcon = childPrefixOpts.icon || child.prefixIcon;
          const childSuffixOpts = Object.assign({}, child.suffixConfig);
          const childSuffixIcon = childSuffixOpts.icon || child.suffixIcon;
          const childMenuContent = (0, _utils.getFuncText)(child.name);
          return child.visible === false ? null : h('li', {
            class: [child.className, {
              'link--disabled': child.disabled,
              'link--active': child === ctxMenuStore.selectChild
            }],
            key: `${gIndex}_${index}_${cIndex}`
          }, [h('a', {
            class: 'vxe-context-menu--link',
            on: {
              click(evnt) {
                $xeTable.ctxMenuLinkEvent(evnt, child);
              },
              mouseover(evnt) {
                $xeTable.ctxMenuMouseoverEvent(evnt, item, child);
              },
              mouseout(evnt) {
                $xeTable.ctxMenuMouseoutEvent(evnt, item);
              }
            }
          }, [h('div', {
            class: ['vxe-context-menu--link-prefix', childPrefixOpts.className || '']
          }, [childPrefixIcon && _xeUtils.default.isFunction(childPrefixIcon) ? h('span', {}, (0, _vn.getSlotVNs)(childPrefixIcon.call($xeTable, {}))) : h('i', {
            class: childPrefixIcon
          }), childPrefixOpts.content ? h('span', `${childPrefixOpts.content}`) : renderEmptyElement($xeTable)]), h('span', {
            class: 'vxe-context-menu--link-content',
            attrs: {
              title: childMenuContent
            }
          }, childMenuContent), h('div', {
            class: ['vxe-context-menu--link-suffix', childSuffixOpts.className || '']
          }, [childSuffixIcon && _xeUtils.default.isFunction(childSuffixIcon) ? h('span', {}, (0, _vn.getSlotVNs)(childSuffixIcon.call($xeTable, {}))) : h('i', {
            class: childSuffixIcon
          }), childSuffixOpts.content ? h('span', `${childSuffixOpts.content}`) : renderEmptyElement($xeTable)])])]);
        })) : null]);
      }));
    }) : []);
  }
};