@antdp/basic-layouts
Version:
565 lines (551 loc) • 20.7 kB
JavaScript
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.defaultThemeColors = exports.HandleMenu = void 0;
exports.getIcon = getIcon;
exports.getSiderMenus = void 0;
exports.isUrl = isUrl;
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _icons = _interopRequireDefault(require("@ant-design/icons"));
var _react = _interopRequireDefault(require("react"));
var _reactRouterDom = require("react-router-dom");
var _max = require("@umijs/max");
var _jsxRuntime = require("react/jsx-runtime");
// @ts-ignore
/**
*
* 1. 对路由权限进行判定
* 2. 保存每个子集对应的父级
* 3. 父级链
*/
var HandleMenu = exports.HandleMenu = /*#__PURE__*/function () {
function HandleMenu(props) {
(0, _classCallCheck2["default"])(this, HandleMenu);
(0, _defineProperty2["default"])(this, "authMenus", []);
/**所有直接渲染的父级菜单*/
(0, _defineProperty2["default"])(this, "parentMenu", []);
(0, _defineProperty2["default"])(this, "parentflatMenu", []);
/**子集key对应的父级key*/
(0, _defineProperty2["default"])(this, "childParent", new Map([]));
/**key对应子集数据*/
(0, _defineProperty2["default"])(this, "childMenu", new Map([]));
// 所有子集菜单 平铺
(0, _defineProperty2["default"])(this, "flatMenu", []);
// 所有菜单 平铺
(0, _defineProperty2["default"])(this, "flatAllMenu", []);
/**语言转换*/
(0, _defineProperty2["default"])(this, "intlLanguage", void 0);
/**路由数据*/
(0, _defineProperty2["default"])(this, "routers", []);
/**处理权限后的菜单**/
(0, _defineProperty2["default"])(this, "checkAuthMenus", []);
/**当前菜单对应的父级菜单*/
(0, _defineProperty2["default"])(this, "pathToParentMenus", new Map([]));
/**是否进行权限校验*/
(0, _defineProperty2["default"])(this, "isCheckAuth", false);
/**是否使用*/
(0, _defineProperty2["default"])(this, "isTOPLEFT", false);
/**记录上次父级菜单*/
(0, _defineProperty2["default"])(this, "preParentPath", '');
/**记录上次菜单*/
(0, _defineProperty2["default"])(this, "prePath", '');
var store = ANTD_IS_STORAGE ? sessionStorage : localStorage;
// 所有的 权限菜单
var auth_menus = store.getItem('authMenu');
if (auth_menus) {
this.authMenus = JSON.parse(auth_menus);
} else {
this.authMenus = [];
}
this.routers = props.routers;
this.intlLanguage = props.intlLanguage;
this.isCheckAuth = props.isCheckAuth;
this.isTOPLEFT = props.isTOPLEFT;
if (this.isCheckAuth) {
this.initAuth(this.routers);
} else {
this.checkAuthMenus = this.routers;
}
if (this.intlLanguage) {
this.initLanguage(this.checkAuthMenus);
}
this.initFlat(this.checkAuthMenus);
if (this.isTOPLEFT) {
this.handelSiderMenu(this.checkAuthMenus);
this.getTopMenus(this.checkAuthMenus);
}
/**默认 / 指定所有子集 */
this.childMenu.set('/', this.checkAuthMenus);
}
/**验证权限*/
return (0, _createClass2["default"])(HandleMenu, [{
key: "checkAuth",
value: function checkAuth(path) {
if (['/404', '/403', '/500', '/', '/welcome'].includes(path)) {
return true;
}
var finx = this.authMenus.find(function (item) {
return item === path;
});
if (finx) {
return true;
}
return false;
}
/**
* 1. 权限处理
* 1. 子集全部没权限，父级也没有权限
* 2. 子集存在权限，父级也存在权限
* 3. 没有权限的自动把 path 转换成 403
* */
}, {
key: "initAuth",
value: function initAuth(routers) {
var _this = this;
var isParent = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
var child = [];
routers.sort(function (it) {
return Number(it.order || 0);
}).forEach(function (item) {
var routes = item.routes;
var newItem = (0, _objectSpread2["default"])({}, item);
if (Array.isArray(routes)) {
newItem.routes = _this.initAuth(routes, true);
}
if (!isParent) {
_this.checkAuthMenus.push((0, _objectSpread2["default"])({}, item));
}
child.push(newItem);
});
return child;
}
/**
* 2. 国际化翻译
* */
}, {
key: "initLanguage",
value: function initLanguage() {
var _this2 = this;
var menus = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.checkAuthMenus;
var parentLocale = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'menu';
menus.forEach(function (item) {
var name = item.name,
locale = item.locale,
routes = item.routes;
var parentLocales = parentLocale;
if (name || locale) {
var _this2$intlLanguage;
var _locale = "".concat(parentLocale, ".").concat(item.locale || item.name);
parentLocales = _locale;
var localeName = (_this2$intlLanguage = _this2.intlLanguage) === null || _this2$intlLanguage === void 0 ? void 0 : _this2$intlLanguage.formatMessage({
id: _locale,
defaultMessage: item.name || item.locale
});
item.name = localeName;
item.locale = localeName;
}
if (Array.isArray(routes)) {
_this2.initLanguage(routes, parentLocales);
}
});
}
/**
* 3. 扁平化数据
*/
}, {
key: "initFlat",
value: function initFlat() {
var _this3 = this;
var menus = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.checkAuthMenus;
var parentMenu = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
menus.forEach(function (item) {
var routes = item.routes;
var newparentMenu = (0, _toConsumableArray2["default"])(parentMenu).concat([item]);
if (Array.isArray(routes)) {
_this3.initFlat(routes, newparentMenu);
}
if (item.path) {
_this3.flatAllMenu.push((0, _objectSpread2["default"])({}, item));
_this3.pathToParentMenus.set(item.path, newparentMenu);
}
if (item.path && !Array.isArray(routes)) {
_this3.flatMenu.push((0, _objectSpread2["default"])({}, item));
}
});
}
/**
* 4. 处理数据,用于顶部和侧边菜单展示联动
* */
}, {
key: "handelSiderMenu",
value: function handelSiderMenu() {
var _this4 = this;
var menus = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.checkAuthMenus;
var isSider = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
var parentPath = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : '/';
menus.forEach(function (item) {
var routes = item.routes,
side = item.side,
_item$path = item.path,
path = _item$path === void 0 ? '' : _item$path;
if (side) {
if (Array.isArray(routes) && routes.length) {
_this4.childMenu.set(path, routes);
_this4.handelSiderMenu(routes, true, path);
}
_this4.childParent.set(path, parentPath);
} else {
if (Array.isArray(routes) && routes.length) {
_this4.handelSiderMenu(routes);
}
}
if (isSider) {
_this4.childParent.set(path, parentPath);
} else {
_this4.childParent.set(path, path);
}
});
}
/**
* 5. 获取顶部渲染数据
* */
}, {
key: "getTopMenus",
value: function getTopMenus() {
var _this5 = this;
var menus = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.checkAuthMenus;
var index = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
var topMenus = [];
menus.forEach(function (item) {
var side = item.side,
path = item.path,
routes = item.routes;
var newItem = (0, _objectSpread2["default"])({}, item);
if (Array.isArray(routes)) {
newItem.routes = _this5.getTopMenus(routes, index + 1);
}
if (!side && path) {
topMenus.push((0, _objectSpread2["default"])({}, newItem));
_this5.parentflatMenu.push((0, _objectSpread2["default"])({}, newItem));
}
if (index === 0) {
_this5.parentMenu.push((0, _objectSpread2["default"])({}, newItem));
}
});
return topMenus;
}
/**
* 6. 获取导航面包屑
* */
}, {
key: "getBreadcrumb",
value: function getBreadcrumb(path) {
return this.pathToParentMenus.get(path) || [];
}
/**7. 根据当前路由地址取父级key，再使用父级key进行取渲染内容,如果不是顶部渲染方式，则直接默认*/
}, {
key: "getSiderMenus",
value: function getSiderMenus(path) {
if (this.isTOPLEFT) {
var siderMenus = this.childMenu.get(path);
if (!siderMenus) {
siderMenus = this.childMenu.get(this.getParentPath(path));
}
return siderMenus || [];
}
return this.checkAuthMenus;
}
/**8. 获取父级path*/
}, {
key: "getParentPath",
value: function getParentPath(path) {
var parentPath = this.childParent.get(path) || '/';
return parentPath;
}
// 查询所有父节点和自己是否有权限
}, {
key: "getCheckAuthAll",
value: function getCheckAuthAll(path) {
var node = this.flatAllMenu.find(function (item) {
return item.path === path;
});
if (!node) {
return false;
}
var pathList = [];
var currentNode = node;
while (currentNode) {
pathList.push(currentNode.path || '');
currentNode = this.flatAllMenu.find(function (item) {
var _currentNode;
return item.id === ((_currentNode = currentNode) === null || _currentNode === void 0 ? void 0 : _currentNode.parentId);
});
}
var hasPermission = true; // 假设有权限
// 从最上层父节点开始逐一判断权限
for (var i = pathList.length - 1; i >= 0; i--) {
var p = pathList[i];
if (!this.checkAuth(p)) {
hasPermission = false;
break;
}
}
return hasPermission;
}
/**9. 获取跳转地址*/
}, {
key: "getToPath",
value: function getToPath(path) {
var _currentItem, _currentItem2, _currentItem3;
var _matchRoutes = (0, _max.matchRoutes)(this.flatAllMenu, path),
_matchRoutes2 = (0, _slicedToArray2["default"])(_matchRoutes, 1),
currentItem = _matchRoutes2[0];
if (currentItem && currentItem.route) {
currentItem = currentItem.route;
}
// 1. 先判断是不是 side === true
// const currentItem = this.flatAllMenu.find((item) => item.path === path);
if (((_currentItem = currentItem) === null || _currentItem === void 0 ? void 0 : _currentItem.path) === '/') {
this.preParentPath = '';
this.prePath = currentItem.redirectTo;
return currentItem.redirectTo;
}
if (!currentItem) {
this.preParentPath = '';
if (this.prePath === '/404') {
return false;
}
this.prePath = '/404';
return '/404';
}
// 查询所有父节点和自己是否有权限
if (!!ANTD_AUTH_CONF && !this.getCheckAuthAll(((_currentItem2 = currentItem) === null || _currentItem2 === void 0 ? void 0 : _currentItem2.path) || '')) {
this.prePath = '/403';
this.preParentPath = '';
return '/403';
}
if (!((_currentItem3 = currentItem) !== null && _currentItem3 !== void 0 && _currentItem3.side)) {
this.prePath = currentItem.path || '';
this.preParentPath = '';
return false;
}
if (this.preParentPath === currentItem.path) {
this.prePath = currentItem.path;
return false;
}
this.preParentPath = currentItem.path;
var siderMenus = this.childMenu.get(path);
var findx = siderMenus === null || siderMenus === void 0 ? void 0 : siderMenus.find(function (item) {
return item.index || item.redirectTo;
});
var current = (findx === null || findx === void 0 ? void 0 : findx.path) || (findx === null || findx === void 0 ? void 0 : findx.redirectTo);
if (this.prePath === current) {
return false;
}
this.prePath = current;
return current;
}
/**10 更加path地址获取当前配置数据*/
}, {
key: "getPathItem",
value: function getPathItem(path) {
var currentItem = this.flatAllMenu.find(function (item) {
return item.path === path;
});
return currentItem;
}
}]);
}();
function isUrl(path) {
/* eslint no-useless-escape:0 */
return /(((^https?:(?:\/\/)?)(?:[-;:&=\+\$,\w]+@)?[A-Za-z0-9.-]+(?::\d+)?|(?:www.|[-;:&=\+\$,\w]+@)[A-Za-z0-9.-]+)((?:\/[\+~%\/.\w-_]*)?\??(?:[-\+=&;%@.\w_]*)#?(?:[\w]*))?)$/.test(path);
}
// Allow menu.js config icon as string or ReactNode
// icon: 'setting',
// icon: 'icon-geren' #For Iconfont ,
// icon: 'http://demo.com/icon.png',
// icon: <Icon type="setting" />,
function getIcon(icon) {
if (typeof icon === 'string') {
if (isUrl(icon)) {
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons["default"], {
component: function component() {
return /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
src: icon,
alt: "icon"
});
}
});
}
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {});
}
return icon;
}
/**获取菜单渲染**/
var getSiderMenus = exports.getSiderMenus = function getSiderMenus() {
var menus = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
var isSider = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
var _loop = function loop() {
var menus = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
var parentSider = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
return menus.filter(function (items) {
if (items.hideInMenu || !items.name || isSider && parentSider) {
return false;
}
return true;
}).map(function (item) {
var path = item.path,
icon = item.icon,
name = item.name,
routes = item.routes;
var ite = {};
if (icon) {
ite.icon = getIcon(icon);
}
if (name) {
ite.label = name;
ite.title = name;
}
if (routes && routes.length && (!item.side || !isSider)) {
ite.children = _loop(routes, item.side);
} else if (path && name) {
ite.label = /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactRouterDom.NavLink, {
to: path,
children: name
});
}
ite.key = path;
return ite;
});
};
return _loop(menus);
};
var defaultThemeColors = exports.defaultThemeColors = function defaultThemeColors(layout) {
if (layout === 'slider') {
return {
light: {
'--primary-slider-bg': 'rgb(36, 37, 37)',
'--primary-header-bg': '#fff',
'--primary-shadow': 'rgba(29,35,41,.05)',
'--primary-slider-trigger-border': '#fff',
'--primary-sider-trigger-text-color': '#fff',
'--primary-header-text-color': 'rgb(36, 37, 37)',
'--primary-title-text-color': '#fff',
'--primary-content-bg': '#f5f5f5',
'itemSelectedBg': 'rgb(24, 144, 255)',
'colorItemBgSelected': '#fff',
'itemActiveBg': '#fff',
'horizontalItemSelectedBg': '#fff',
'itemColor': 'rgba(229, 224, 216, 0.85)',
'itemHoverColor': 'rgba(229, 224, 216, 0.85)',
'itemSelectedColor': '#fff',
'colorBgElevated': 'rgba(229, 224, 216, 0.85)'
},
dark: {
'--primary-slider-bg': 'rgb(36, 37, 37)',
'--primary-header-bg': 'rgb(36, 37, 37)',
'--primary-shadow': 'rgba(13, 13, 13, 0.65)',
'--primary-slider-trigger-border': '#fff',
'--primary-sider-trigger-text-color': '#fff',
'--primary-header-text-color': '#fff',
'--primary-title-text-color': '#fff',
'--primary-content-bg': '#1d1d1d',
'itemSelectedBg': 'rgb(24, 144, 255)',
'colorItemBgSelected': '#fff',
'itemActiveBg': '#fff',
'horizontalItemSelectedBg': '#fff',
'itemColor': 'rgba(229, 224, 216, 0.85)',
'itemHoverColor': 'rgba(229, 224, 216, 0.85)',
'itemSelectedColor': '#fff',
'colorBgElevated': 'rgba(229, 224, 216, 0.85)'
}
};
}
if (layout === 'topleft') {
return {
light: {
'--primary-slider-bg': '#fff',
'--primary-header-bg': '#fff',
'--primary-shadow': 'rgba(0,21,41,.12)',
'--primary-slider-trigger-border': 'rgba(0,0,0,.06)',
'--primary-sider-trigger-text-color': '#1d1d1d',
'--primary-header-text-color': '#1d1d1d',
'--primary-title-text-color': '#1d1d1d',
'--primary-content-bg': '#f5f5f5',
'itemSelectedBg': '#e6f7ff',
'colorItemBgSelected': 'rgba(0, 0, 0, 0.06)',
'itemActiveBg': '#e6f7ff',
'horizontalItemSelectedBg': 'rgba(0, 0, 0, 0.06)',
'itemColor': 'rgba(0, 0, 0, 0.65)',
'itemHoverColor': 'rgba(0, 0, 0, 0.85)',
'itemSelectedColor': 'rgb(24, 144, 255)',
'colorBgElevated': '#fff'
},
dark: {
'--primary-slider-bg': 'rgb(36, 37, 37)',
'--primary-header-bg': 'rgb(36, 37, 37)',
'--primary-shadow': 'rgba(13, 13, 13, 0.65)',
'--primary-slider-trigger-border': '#fff',
'--primary-sider-trigger-text-color': '#fff',
'--primary-header-text-color': '#fff',
'--primary-title-text-color': '#fff',
'--primary-content-bg': '#1d1d1d',
'itemSelectedBg': 'rgb(24, 144, 255)',
'colorItemBgSelected': 'rgb(36, 37, 37)',
'itemActiveBg': '#fff',
'horizontalItemSelectedBg': 'rgb(36, 37, 37)',
'itemColor': 'rgba(229, 224, 216, 0.85)',
'itemHoverColor': 'rgba(229, 224, 216, 0.85)',
'itemSelectedColor': '#fff',
'colorBgElevated': 'rgba(229, 224, 216, 0.85)'
}
};
}
if (layout === 'mix') {
return {
light: {
'--primary-slider-bg': '#fff',
'--primary-header-bg': 'rgb(36, 37, 37)',
'--primary-shadow': 'rgba(0,21,41,.08)',
'--primary-slider-trigger-border': 'rgba(0,0,0,.06)',
'--primary-sider-trigger-text-color': 'rgb(36, 37, 37)',
'--primary-header-text-color': '#fff',
'--primary-title-text-color': '#fff',
'--primary-content-bg': '#f5f5f5',
'itemSelectedBg': '#e6f7ff',
'colorItemBgSelected': 'rgba(0, 0, 0, 0.06)',
'itemActiveBg': '#e6f7ff',
'horizontalItemSelectedBg': 'rgba(0, 0, 0, 0.06)',
'itemColor': 'rgba(0, 0, 0, 0.65)',
'itemHoverColor': 'rgba(0, 0, 0, 0.85)',
'itemSelectedColor': 'rgb(24, 144, 255)',
'colorBgElevated': '#fff'
},
dark: {
'--primary-slider-bg': 'rgb(36, 37, 37)',
'--primary-header-bg': 'rgb(15, 28, 41)',
'--primary-shadow': 'rgba(13, 13, 13, 0.65)',
'--primary-slider-trigger-border': '#fff',
'--primary-sider-trigger-text-color': '#fff',
'--primary-header-text-color': '#fff',
'--primary-title-text-color': '#fff',
'--primary-content-bg': '#1d1d1d',
'itemSelectedBg': 'rgb(24, 144, 255)',
'colorItemBgSelected': '#fff',
'itemActiveBg': '#fff',
'horizontalItemSelectedBg': '#fff',
'itemColor': 'rgba(229, 224, 216, 0.85)',
'itemHoverColor': 'rgba(229, 224, 216, 0.85)',
'itemSelectedColor': '#fff',
'colorBgElevated': 'rgba(229, 224, 216, 0.85)'
}
};
}
};