"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _comp = require("../../../ui/src/comp");
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,
  getI18n,
  renderEmptyElement
} = _ui.VxeUI;
var _default = exports.default = /* define-vxe-component start */(0, _comp.defineVxeComponent)({
  name: 'VxeTableMenuPanel',
  inject: {
    $xeTable: {
      default: null
    }
  },
  computed: Object.assign({}, {}),
  mounted() {
    const $xeMenuPanel = this;
    const $xeTable = $xeMenuPanel.$xeTable;
    const menuOpts = $xeTable.computeMenuOpts;
    const {
      transfer
    } = menuOpts;
    const el = $xeMenuPanel.$refs.refElem;
    if (transfer && el) {
      document.body.appendChild(el);
    }
  },
  beforeDestroy() {
    const $xeMenuPanel = this;
    const el = $xeMenuPanel.$refs.refElem;
    if (el && el.parentNode) {
      el.parentNode.removeChild(el);
    }
  },
  methods: {
    renderVN(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 {
            children,
            loading
          } = item;
          const hasChildMenus = children && 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--loading': loading,
              '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 || '']
          }, [loading ? h('span', {
            class: getIcon('TABLE_MENU_OPTION_LOADING')
          }) : prefixIcon && _xeUtils.default.isFunction(prefixIcon) ? h('span', {}, (0, _vn.getSlotVNs)(prefixIcon.call($xeTable, {}))) : h('span', {}, [h('i', {
            class: prefixIcon
          })]), prefixOpts.content ? h('span', {}, `${prefixOpts.content}`) : renderEmptyElement($xeTable)]), h('span', {
            class: 'vxe-context-menu--link-content',
            attrs: {
              title: menuContent
            }
          }, loading ? getI18n('vxe.table.menuLoading') : 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 {
              loading: childLoading
            } = child;
            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--loading': childLoading,
                '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 || '']
            }, [child.loading ? h('span', {
              class: getIcon('TABLE_MENU_OPTION_LOADING')
            }) : childPrefixIcon && _xeUtils.default.isFunction(childPrefixIcon) ? h('span', {}, (0, _vn.getSlotVNs)(childPrefixIcon({}))) : h('span', {}, [h('i', {
              class: childPrefixIcon
            })]), childPrefixOpts.content ? h('span', `${childPrefixOpts.content}`) : renderEmptyElement($xeTable)]), h('span', {
              class: 'vxe-context-menu--link-content',
              attrs: {
                title: childMenuContent
              }
            }, childLoading ? getI18n('vxe.table.menuLoading') : 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]);
        }));
      }) : []);
    }
  },
  render(h) {
    return this.renderVN(h);
  }
});
/* define-vxe-component end */