import { Fragment as _Fragment } from "vue";
import { createVNode as _createVNode } from "vue";

function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }

function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

import { Layout } from 'ant-design-vue';
import { GlobalFooter, GlobalHeader, PageLoading, RightContent, SideMenu } from '@antd-vue/pro-layout';
import { computed, defineComponent, reactive, unref } from 'vue';
import { getRenderComponent, PropRenderType, PropTypes } from '../utils';
import { DefaultGlobalHeaderProps } from '../GlobalHeader';
import { CONSTANT } from '../RightContent';
/**
 * 布局头部渲染
 */

export var DefaultProLayoutProps = _objectSpread(_objectSpread({}, DefaultGlobalHeaderProps), {}, {
  prefixCls: PropTypes.string.def('ant-pro-layout'),
  menus: PropTypes.array.def([]),
  loading: PropTypes.bool.def(false),

  /* 自定义头部渲染 */
  headerRender: PropRenderType,

  /* 自定义页脚的 render 方法 (props: any) => VNode */
  footerRender: PropRenderType,
  // collapsedButtonRender: {
  //   type: PropRenderType.type,
  //   default: (collapsed: boolean) => {
  //     return collapsed ? <MenuUnfoldOutlined/> : <MenuFoldOutlined/>;
  //   }
  // },
  layout: PropTypes.string.def('side'),
  theme: PropTypes.string.def('dark'),
  fixedHeader: PropTypes.bool.def(false),
  fixedSidebar: PropTypes.bool.def(false),
  headerHeight: PropTypes.number.def(48),
  disableContentMargin: PropTypes.bool.def(false),
  collapse: PropTypes.func.def(function () {})
});
var ProLayout = defineComponent({
  name: 'ProLayout',
  props: _objectSpread({}, DefaultProLayoutProps),
  emits: ['collapse', 'menuClick', 'logout', 'onOpenKeys', 'OnSelectedKeys'],
  setup: function setup(props, _ref) {
    var attrs = _ref.attrs,
        slots = _ref.slots,
        emit = _ref.emit;
    var state = reactive(props);

    var handleCollapsed = function handleCollapsed(collapsed) {
      emit('collapse', collapsed);
    };

    var handleMenuClick = function handleMenuClick(menu) {
      emit('menuClick', menu);
      /* 用户退出系统事件 */

      if (CONSTANT.presonal.exit === menu.id) {
        emit('logout', menu);
      }
    };
    /* 侧边菜单渲染 */


    var sideMenuDom = computed(function () {
      return _createVNode(SideMenu, _objectSpread(_objectSpread({}, props), {}, {
        "onCollapse": handleCollapsed,
        "onMenuClick": handleMenuClick
      }), null);
    });
    var className = computed(function () {
      var _ref2;

      return _ref2 = {}, _defineProperty(_ref2, props.prefixCls, true), _defineProperty(_ref2, "".concat(props.prefixCls, "-fixed-header"), props.fixedHeader), _defineProperty(_ref2, "".concat(props.prefixCls, "-fixed-sidebar"), props.fixedSidebar), _defineProperty(_ref2, "".concat(props.prefixCls, "-").concat(props.layout), props.layout), _ref2;
    });
    var styles = computed(function () {
      var s = {};

      if (props.fixedHeader || props.layout === 'mix') {
        s.paddingTop = "".concat(props.headerHeight, "px");
      }

      if (props['headerRender'] || slots['headerRender']) {
        s.paddingTop = undefined;
      }

      return s;
    });
    var builtInContentStyle = computed(function () {
      var styles = {
        flex: '1 0 auto',
        margin: props.disableContentMargin ? 0 : "".concat(16, "px"),
        width: props.collapsed ? "calc(100vw - ".concat(props.collapsedWidth + (props.disableContentMargin ? 0 : 16 * 2) + 8, "px)") : "calc(100vw - ".concat(props.sideWidth + (props.disableContentMargin ? 0 : 16 * 2) + 8, "px)")
      };

      if (props.layout === 'top') {
        styles.width = "calc(100vw - ".concat(8, "px)");
      }

      return styles;
    });
    /* 计算内容区域样式 */

    var contentClassName = computed(function () {
      return ["".concat(props.prefixCls, "-content")];
    });
    return function () {
      var _slots$default;

      /* 注意：渲染函数内的所有逻辑代码每次都会执行，函数式组件一样（优化代码 => 将非必需重复执行的代码提升到渲染函数外部） */
      var contentStyle = props.contentStyle,
          loading = props.loading;
      /* 头部左侧区域渲染 */

      var leftContentDom = getRenderComponent('leftContentRender', props, slots, undefined, {
        propsArgs: [props],
        slotArg: props
      });
      /* 头部右侧区域渲染 */

      var rightContentDom = getRenderComponent('rightContentRender', props, slots, _createVNode(RightContent, _objectSpread(_objectSpread({}, props), {}, {
        "onMenuClick": handleMenuClick
      }), null), {
        propsArgs: [props],
        slotArg: props
      });
      var defHeader = computed(function () {
        return _createVNode(GlobalHeader, _objectSpread(_objectSpread({}, props), {}, {
          "leftContentRender": leftContentDom,
          "rightContentRender": rightContentDom,
          "onCollapse": handleCollapsed,
          "onMenuClick": handleMenuClick
        }), null);
      });
      /* 布局头部渲染 */

      var headerDom = getRenderComponent('headerRender', props, slots, defHeader, {
        propsArgs: [props, defHeader],
        slotArg: props
      });

      var defFooter = _createVNode(GlobalFooter, null, null);
      /* 布局底部渲染 */


      var footerDom = getRenderComponent('footerRender', props, slots, defFooter, {
        propsArgs: [props, defFooter],
        slotArg: props
      });
      return _createVNode(_Fragment, null, [_createVNode("div", {
        "class": unref(className)
      }, [_createVNode(Layout, {
        "id": 'layout-pos'
      }, {
        default: function _default() {
          return [unref(sideMenuDom), _createVNode("div", {
            "class": 'ant-layout',
            "style": _objectSpread({
              position: 'relative'
            }, unref(styles))
          }, [unref(headerDom), _createVNode(Layout.Content, {
            "class": unref(contentClassName),
            "style": _objectSpread(_objectSpread({}, contentStyle), unref(builtInContentStyle))
          }, {
            default: function _default() {
              return [loading ? _createVNode(PageLoading, null, null) : (_slots$default = slots.default) === null || _slots$default === void 0 ? void 0 : _slots$default.call(slots)];
            }
          }), unref(footerDom)])];
        }
      })])]);
    };
  }
}); // ProLayout.install = (app: App) => {
//   app.component('ProLayout', ProLayout);
// };

export default ProLayout;