"use strict"; var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); var _typeof = require("@babel/runtime/helpers/typeof"); Object.defineProperty(exports, "__esModule", { value: true }); exports.default = exports.basicLayoutProps = void 0; var _vue = require("vue"); var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties")); var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty")); var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2")); var _SiderMenu = _interopRequireWildcard(require("../SiderMenu/SiderMenu")); var _defaultSettings = require("../defaultSettings"); var _TopHeader = require("../TopHeader"); var _Header = _interopRequireWildcard(require("./Header")); var _useConfigInject2 = _interopRequireDefault(require("ant-design-vue/lib/_util/hooks/useConfigInject")); var _lodashEs = require("lodash"); var _RouteContext = require("../RouteContext"); var _util = require("../util"); var _components = require("../../components"); var _excluded = ["pure", "onCollapse", "onOpenKeys", "onSelect", "onMenuClick"]; function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); } function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; } var basicLayoutProps = (0, _objectSpread2.default)((0, _objectSpread2.default)((0, _objectSpread2.default)((0, _objectSpread2.default)((0, _objectSpread2.default)({}, _defaultSettings.defaultSettingProps), _SiderMenu.siderMenuProps), _TopHeader.baseHeaderProps), _Header.headerViewProps), {}, { pure: Boolean, loading: Boolean, locale: { type: [Function, Boolean], default: function _default() { return function (s) { return s; }; } }, /** * 是否禁用移动端模式,有的管理系统不需要移动端模式,此属性设置为true即可 */ disableMobile: { type: Boolean, required: false }, isChildrenLayout: { type: Boolean, required: false }, /** * 兼用 content 的 margin */ disableContentMargin: { type: Boolean, required: false }, colSize: { type: Number, required: false }, contentStyle: { type: [String, Object], default: function _default() { return null; } }, breadcrumb: { type: [Object, Function], default: function _default() { return null; } }, collapsedButtonRender: { type: [Function, Object, Boolean], default: function _default() { return undefined; } }, breadcrumbRender: { type: [Object, Function, Boolean], default: function _default() { return null; } }, headerContentRender: { type: [Function, Object, Boolean], default: function _default() { return undefined; } }, headerRender: { type: [Object, Function, Boolean], default: function _default() { return undefined; } } }); exports.basicLayoutProps = basicLayoutProps; var _default2 = (0, _vue.defineComponent)({ name: 'JProLayout', inheritAttrs: false, props: basicLayoutProps, emits: ['update:collapsed', 'update:open-keys', 'update:selected-keys', 'collapse', 'openKeys', 'select', 'menuHeaderClick', 'menuClick', 'backClick'], setup: function setup(props, _ref) { var emit = _ref.emit, attrs = _ref.attrs, slots = _ref.slots; var _useConfigInject = (0, _useConfigInject2.default)('layout', {}), prefixCls = _useConfigInject.prefixCls; var isTop = (0, _vue.computed)(function () { return props.layout === 'top'; }); var hasSide = (0, _vue.computed)(function () { return props.layout === 'mix' || props.layout === 'side' || false; }); var hasSplitMenu = (0, _vue.computed)(function () { return props.layout === 'mix' && props.splitMenus; }); var hasFlatMenu = (0, _vue.computed)(function () { return hasSide.value && hasSplitMenu.value; }); var siderWidth = (0, _vue.computed)(function () { return props.collapsed ? props.collapsedWidth : props.siderWidth; }); var onCollapse = function onCollapse(collapsed) { emit('update:collapsed', collapsed); emit('collapse', collapsed); }; var onOpenKeys = function onOpenKeys(openKeys) { emit('update:open-keys', openKeys); emit('openKeys', openKeys); }; var onSelect = function onSelect(selectedKeys) { emit('update:selected-keys', selectedKeys); emit('select', selectedKeys); }; var onMenuHeaderClick = function onMenuHeaderClick(e) { emit('menuHeaderClick', e); }; var onMenuClick = function onMenuClick(args) { emit('menuClick', args); }; var onBack = function onBack(args) { emit('backClick', args); }; var baseClassName = (0, _vue.computed)(function () { return "".concat(props.prefixCls, "-basicLayout"); }); var className = (0, _vue.computed)(function () { var _ref2; return _ref2 = {}, (0, _defineProperty2.default)(_ref2, baseClassName.value, true), (0, _defineProperty2.default)(_ref2, "".concat(baseClassName.value, "-top-menu"), isTop.value), (0, _defineProperty2.default)(_ref2, "".concat(baseClassName.value, "-is-children"), props.isChildrenLayout), (0, _defineProperty2.default)(_ref2, "".concat(baseClassName.value, "-fix-siderbar"), props.fixSiderbar), (0, _defineProperty2.default)(_ref2, "".concat(baseClassName.value, "-").concat(props.layout), props.layout), _ref2; }); var genLayoutStyle = (0, _vue.reactive)({ position: 'relative' }); (0, _vue.watchEffect)(function () { if (props.isChildrenLayout || props.contentStyle && props.contentStyle.minHeight) { genLayoutStyle.minHeight = 0; } }); var headerRender = function headerRender(p, matchMenuKeys) { if (p.headerRender === false || p.pure) { return null; } return (0, _vue.createVNode)(_Header.default, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, p), {}, { "matchMenuKeys": matchMenuKeys || [] }), null); }; var breadcrumb = (0, _vue.computed)(function () { return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, props.breadcrumb), {}, { itemRender: (0, _util.getSlot)(slots, props, 'breadcrumbRender') }); }); var flatMenuData = (0, _vue.computed)(function () { return hasFlatMenu.value && props.selectedKeys && (0, _util.getMenuFirstChildren)(props.menuData, props.selectedKeys[0]) || []; }); var routeContext = (0, _vue.reactive)((0, _objectSpread2.default)((0, _objectSpread2.default)((0, _objectSpread2.default)({}, _RouteContext.defaultRouteContext), (0, _lodashEs.pick)((0, _vue.toRefs)(props), ['pure', 'locale', 'menuData', 'openKeys', 'selectedKeys', 'contentWidth', 'disableMobile', 'fixSiderbar', 'fixedHeader', 'headerHeight'])), {}, { siderWidth: siderWidth, breadcrumb: breadcrumb, flatMenuData: flatMenuData, hasSide: hasSide, back: onBack, hasHeader: true, flatMenu: hasFlatMenu })); (0, _vue.provide)(_RouteContext.routeContextInjectKey, routeContext); return function () { var _slots$default, _slots$default2; var pure = props.pure, propsOnCollapse = props.onCollapse, propsOnOpenKeys = props.onOpenKeys, propsOnSelect = props.onSelect, propsOnMenuClick = props.onMenuClick, restProps = (0, _objectWithoutProperties2.default)(props, _excluded); var collapsedButtonRender = (0, _util.getSlot)(slots, props, 'collapsedButtonRender'); var headerContentRender = (0, _util.getSlot)(slots, props, 'headerContentRender'); var rightContentRender = (0, _util.getSlot)(slots, props, 'rightContentRender'); var customHeaderRender = (0, _util.getSlot)(slots, props, 'headerRender'); // menu var menuHeaderRender = (0, _util.getSlot)(slots, props, 'menuHeaderRender'); var menuExtraRender = (0, _util.getSlot)(slots, props, 'menuExtraRender'); var menuContentRender = (0, _util.getSlot)(slots, props, 'menuContentRender'); var menuItemRender = (0, _util.getSlot)(slots, props, 'menuItemRender'); var subMenuItemRender = (0, _util.getSlot)(slots, props, 'subMenuItemRender'); var headerDom = (0, _vue.computed)(function () { return headerRender((0, _objectSpread2.default)((0, _objectSpread2.default)({}, props), {}, { menuItemRender: menuItemRender, subMenuItemRender: subMenuItemRender, hasSiderMenu: !isTop.value, menuData: props.menuData, onCollapse: onCollapse, onOpenKeys: onOpenKeys, onSelect: onSelect, onMenuHeaderClick: onMenuHeaderClick, rightContentRender: rightContentRender, collapsedButtonRender: collapsedButtonRender, headerTitleRender: menuHeaderRender, menuExtraRender: menuExtraRender, menuContentRender: menuContentRender, headerContentRender: headerContentRender, headerRender: customHeaderRender, theme: (props.theme || 'dark').toLocaleLowerCase().includes('dark') ? 'dark' : 'light' }), props.matchMenuKeys); }); routeContext.hasHeader = !!headerDom.value; var contentClassName = (0, _vue.computed)(function () { var _ref3; return _ref3 = {}, (0, _defineProperty2.default)(_ref3, "".concat(baseClassName.value, "-content"), true), (0, _defineProperty2.default)(_ref3, "".concat(baseClassName.value, "-has-header"), headerDom), (0, _defineProperty2.default)(_ref3, "".concat(baseClassName.value, "-content-disable-margin"), props.disableContentMargin), _ref3; }); return (0, _vue.createVNode)(_vue.Fragment, null, [pure ? (_slots$default = slots.default) === null || _slots$default === void 0 ? void 0 : _slots$default.call(slots) : (0, _vue.createVNode)("div", { "class": className.value }, [(0, _vue.createVNode)(_components.Layout, { "style": (0, _objectSpread2.default)({ minHeight: '100vh' }, attrs.style || {}) }, { default: function _default() { return [headerDom.value, (0, _vue.createVNode)(_components.Layout, { "style": genLayoutStyle, "class": prefixCls.value }, { default: function _default() { return [!isTop.value && (0, _vue.createVNode)(_SiderMenu.default, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, restProps), {}, { "menuHeaderRender": menuHeaderRender, "menuExtraRender": menuExtraRender, "menuContentRender": menuContentRender, "menuItemRender": menuItemRender, "subMenuItemRender": subMenuItemRender, "collapsedButtonRender": collapsedButtonRender, "onCollapse": onCollapse, "onSelect": onSelect, "onOpenKeys": onOpenKeys, "onMenuClick": onMenuClick }), null), (0, _vue.createVNode)(_components.Layout, null, { default: function _default() { return [(0, _vue.createVNode)(_components.LayoutContent, null, { default: function _default() { return [(_slots$default2 = slots.default) === null || _slots$default2 === void 0 ? void 0 : _slots$default2.call(slots)]; } })]; } })]; } })]; } })])]); }; } }); exports.default = _default2;