[test] tag ui
This commit is contained in:
parent
f1309b06d2
commit
12264f8202
@ -60,6 +60,7 @@ export class AuthLayout extends Component {
|
|||||||
<div className={styles.lang}>
|
<div className={styles.lang}>
|
||||||
<SelectLang />
|
<SelectLang />
|
||||||
</div>
|
</div>
|
||||||
|
<div>hello tag 19600d286060</div>
|
||||||
<div className={styles.main}>
|
<div className={styles.main}>
|
||||||
<div className={styles.top}>
|
<div className={styles.top}>
|
||||||
<div className={styles.header} style={{ width: 'fit-content' }}>
|
<div className={styles.header} style={{ width: 'fit-content' }}>
|
||||||
|
|||||||
@ -1,334 +1,334 @@
|
|||||||
// // Copyright 2021 99cloud
|
// Copyright 2021 99cloud
|
||||||
// //
|
//
|
||||||
// // Licensed under the Apache License, Version 2.0 (the "License");
|
// Licensed under the Apache License, Version 2.0 (the "License");
|
||||||
// // you may not use this file except in compliance with the License.
|
// you may not use this file except in compliance with the License.
|
||||||
// // You may obtain a copy of the License at
|
// You may obtain a copy of the License at
|
||||||
// //
|
//
|
||||||
// // http://www.apache.org/licenses/LICENSE-2.0
|
// http://www.apache.org/licenses/LICENSE-2.0
|
||||||
// //
|
//
|
||||||
// // Unless required by applicable law or agreed to in writing, software
|
// Unless required by applicable law or agreed to in writing, software
|
||||||
// // distributed under the License is distributed on an "AS IS" BASIS,
|
// distributed under the License is distributed on an "AS IS" BASIS,
|
||||||
// // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||||
// // See the License for the specific language governing permissions and
|
// See the License for the specific language governing permissions and
|
||||||
// // limitations under the License.
|
// limitations under the License.
|
||||||
|
|
||||||
// import React, { Component } from 'react';
|
import React, { Component } from 'react';
|
||||||
// import { inject, observer } from 'mobx-react';
|
import { inject, observer } from 'mobx-react';
|
||||||
// import { toJS, reaction } from 'mobx';
|
import { toJS, reaction } from 'mobx';
|
||||||
// import i18n from 'core/i18n';
|
import i18n from 'core/i18n';
|
||||||
// import { isAdminPage, isUserCenterPage } from 'utils/index';
|
import { isAdminPage, isUserCenterPage } from 'utils/index';
|
||||||
// import { BellOutlined } from '@ant-design/icons';
|
import { BellOutlined } from '@ant-design/icons';
|
||||||
// import checkItemPolicy from 'resources/skyline/policy';
|
import checkItemPolicy from 'resources/skyline/policy';
|
||||||
// import { Layout, Modal } from 'antd';
|
import { Layout, Modal } from 'antd';
|
||||||
// import GlobalHeader from 'components/Layout/GlobalHeader';
|
import GlobalHeader from 'components/Layout/GlobalHeader';
|
||||||
// import { setRouteMap, getPath } from 'utils/route-map';
|
import { setRouteMap, getPath } from 'utils/route-map';
|
||||||
// import renderAdminMenu from '../admin-menu';
|
import renderAdminMenu from '../admin-menu';
|
||||||
// import renderMenu from '../menu';
|
import renderMenu from '../menu';
|
||||||
// import renderUserMenu from '../user-menu';
|
import renderUserMenu from '../user-menu';
|
||||||
// import RightContext from './Right';
|
import RightContext from './Right';
|
||||||
// import LayoutMenu from './Menu';
|
import LayoutMenu from './Menu';
|
||||||
// import styles from './index.less';
|
import styles from './index.less';
|
||||||
|
|
||||||
// const { Header } = Layout;
|
const { Header } = Layout;
|
||||||
|
|
||||||
// export class BaseLayout extends Component {
|
export class BaseLayout extends Component {
|
||||||
// autoReaction = reaction(
|
autoReaction = reaction(
|
||||||
// () => (this.props.rootStore.user || {}).keystone_token,
|
() => (this.props.rootStore.user || {}).keystone_token,
|
||||||
// () => {
|
() => {
|
||||||
// setRouteMap(this.menu);
|
setRouteMap(this.menu);
|
||||||
// }
|
}
|
||||||
// );
|
);
|
||||||
|
|
||||||
// constructor(props) {
|
constructor(props) {
|
||||||
// super(props);
|
super(props);
|
||||||
// this.state = {
|
this.state = {
|
||||||
// collapsed: false,
|
collapsed: false,
|
||||||
// isOpenedInPopup: false, // State to track if opened in a popup
|
isOpenedInPopup: false, // State to track if opened in a popup
|
||||||
// };
|
};
|
||||||
// this.init();
|
this.init();
|
||||||
// }
|
}
|
||||||
|
|
||||||
// componentDidMount() {
|
componentDidMount() {
|
||||||
// // Listen for postMessage from the parent app
|
// Listen for postMessage from the parent app
|
||||||
// window.addEventListener('message', this.handleMessage, false);
|
window.addEventListener('message', this.handleMessage, false);
|
||||||
// }
|
}
|
||||||
|
|
||||||
// componentWillUnmount() {
|
componentWillUnmount() {
|
||||||
// window.removeEventListener('message', this.handleMessage, false);
|
window.removeEventListener('message', this.handleMessage, false);
|
||||||
// this.autoReaction();
|
this.autoReaction();
|
||||||
// }
|
}
|
||||||
|
|
||||||
// get isAdminPage() {
|
get isAdminPage() {
|
||||||
// const { pathname } = this.props.location;
|
const { pathname } = this.props.location;
|
||||||
// return isAdminPage(pathname);
|
return isAdminPage(pathname);
|
||||||
// }
|
}
|
||||||
|
|
||||||
// get isUserCenterPage() {
|
get isUserCenterPage() {
|
||||||
// const { pathname } = this.props.location;
|
const { pathname } = this.props.location;
|
||||||
// return isUserCenterPage(pathname);
|
return isUserCenterPage(pathname);
|
||||||
// }
|
}
|
||||||
|
|
||||||
// get rootStore() {
|
get rootStore() {
|
||||||
// return this.props.rootStore;
|
return this.props.rootStore;
|
||||||
// }
|
}
|
||||||
|
|
||||||
// get noticeCount() {
|
get noticeCount() {
|
||||||
// return (
|
return (
|
||||||
// this.rootStore.noticeCount - (this.rootStore.noticeCountWaitRemove || 0)
|
this.rootStore.noticeCount - (this.rootStore.noticeCountWaitRemove || 0)
|
||||||
// );
|
);
|
||||||
// }
|
}
|
||||||
|
|
||||||
// get user() {
|
get user() {
|
||||||
// return toJS(this.rootStore.user) || null;
|
return toJS(this.rootStore.user) || null;
|
||||||
// }
|
}
|
||||||
|
|
||||||
// get hasAdminRole() {
|
get hasAdminRole() {
|
||||||
// return this.user && this.rootStore.hasAdminRole;
|
return this.user && this.rootStore.hasAdminRole;
|
||||||
// }
|
}
|
||||||
|
|
||||||
// get hasAdminPageRole() {
|
get hasAdminPageRole() {
|
||||||
// return this.user && this.rootStore.hasAdminPageRole;
|
return this.user && this.rootStore.hasAdminPageRole;
|
||||||
// }
|
}
|
||||||
|
|
||||||
// get originMenu() {
|
get originMenu() {
|
||||||
// let ret = [];
|
let ret = [];
|
||||||
// if (this.isUserCenterPage) {
|
if (this.isUserCenterPage) {
|
||||||
// ret = renderUserMenu(i18n.t);
|
ret = renderUserMenu(i18n.t);
|
||||||
// } else if (this.isAdminPage) {
|
} else if (this.isAdminPage) {
|
||||||
// ret = renderAdminMenu(i18n.t);
|
ret = renderAdminMenu(i18n.t);
|
||||||
// } else {
|
} else {
|
||||||
// ret = renderMenu(i18n.t);
|
ret = renderMenu(i18n.t);
|
||||||
// }
|
}
|
||||||
// return ret;
|
return ret;
|
||||||
// }
|
}
|
||||||
|
|
||||||
// get globalNav() {
|
get globalNav() {
|
||||||
// return this.menu;
|
return this.menu;
|
||||||
// }
|
}
|
||||||
|
|
||||||
// get menu() {
|
get menu() {
|
||||||
// const menu = this.filterMenuByHidden(this.originMenu);
|
const menu = this.filterMenuByHidden(this.originMenu);
|
||||||
// const newMenu = this.getMenuAllowed(menu);
|
const newMenu = this.getMenuAllowed(menu);
|
||||||
// const filteredMenu = newMenu.filter((it) => {
|
const filteredMenu = newMenu.filter((it) => {
|
||||||
// const { hasChildren = true, children } = it;
|
const { hasChildren = true, children } = it;
|
||||||
// return !hasChildren || (hasChildren && children.length);
|
return !hasChildren || (hasChildren && children.length);
|
||||||
// });
|
});
|
||||||
// return filteredMenu;
|
return filteredMenu;
|
||||||
// }
|
}
|
||||||
|
|
||||||
// get menuAll() {
|
get menuAll() {
|
||||||
// // include hide menu
|
// include hide menu
|
||||||
// return this.getMenuAllowed(this.originMenu);
|
return this.getMenuAllowed(this.originMenu);
|
||||||
// }
|
}
|
||||||
|
|
||||||
// getRouteName(routeName) {
|
getRouteName(routeName) {
|
||||||
// return this.isAdminPage ? `${routeName}Admin` : routeName;
|
return this.isAdminPage ? `${routeName}Admin` : routeName;
|
||||||
// }
|
}
|
||||||
|
|
||||||
// getRoutePath(routeName, params = {}, query = {}) {
|
getRoutePath(routeName, params = {}, query = {}) {
|
||||||
// const realName = this.getRouteName(routeName);
|
const realName = this.getRouteName(routeName);
|
||||||
// return getPath({ key: realName, params, query });
|
return getPath({ key: realName, params, query });
|
||||||
// }
|
}
|
||||||
|
|
||||||
// filterMenuByHidden = (menu = []) => {
|
filterMenuByHidden = (menu = []) => {
|
||||||
// if (menu.length === 0) {
|
if (menu.length === 0) {
|
||||||
// return menu;
|
return menu;
|
||||||
// }
|
}
|
||||||
// const newMenu = menu.filter((it) => !it.hidden);
|
const newMenu = menu.filter((it) => !it.hidden);
|
||||||
// newMenu.forEach((item) => {
|
newMenu.forEach((item) => {
|
||||||
// item.children = this.filterMenuByHidden(item.children);
|
item.children = this.filterMenuByHidden(item.children);
|
||||||
// });
|
});
|
||||||
// return newMenu;
|
return newMenu;
|
||||||
// };
|
};
|
||||||
|
|
||||||
// handleMessage = (event) => {
|
handleMessage = (event) => {
|
||||||
// const trustedOrigins = [
|
const trustedOrigins = [
|
||||||
// 'https://baha-dev.felcloud.io',
|
'https://baha-dev.felcloud.io',
|
||||||
// 'https://demo.felcloud.io',
|
'https://demo.felcloud.io',
|
||||||
// ];
|
];
|
||||||
// if (trustedOrigins.includes(event.origin)) {
|
if (trustedOrigins.includes(event.origin)) {
|
||||||
// const { message } = event.data;
|
const { message } = event.data;
|
||||||
// if (message === 'openedInPopup') {
|
if (message === 'openedInPopup') {
|
||||||
// this.setState({ isOpenedInPopup: true });
|
this.setState({ isOpenedInPopup: true });
|
||||||
// }
|
}
|
||||||
// }
|
}
|
||||||
// };
|
};
|
||||||
|
|
||||||
// checkItemEndpoints = (key) => this.rootStore.checkEndpoint(key);
|
checkItemEndpoints = (key) => this.rootStore.checkEndpoint(key);
|
||||||
|
|
||||||
// getMenuAllowed = (menu) => {
|
getMenuAllowed = (menu) => {
|
||||||
// // update menu according to license addons
|
// update menu according to license addons
|
||||||
// const newMenu = [];
|
const newMenu = [];
|
||||||
// menu.forEach((it) => {
|
menu.forEach((it) => {
|
||||||
// const result = this.updateMenuItemByAllowed(it);
|
const result = this.updateMenuItemByAllowed(it);
|
||||||
// if (result) {
|
if (result) {
|
||||||
// newMenu.push(result);
|
newMenu.push(result);
|
||||||
// }
|
}
|
||||||
// });
|
});
|
||||||
// return newMenu;
|
return newMenu;
|
||||||
// };
|
};
|
||||||
|
|
||||||
// onCollapseChange = (collapsed) => {
|
onCollapseChange = (collapsed) => {
|
||||||
// this.setState({
|
this.setState({
|
||||||
// collapsed,
|
collapsed,
|
||||||
// });
|
});
|
||||||
// };
|
};
|
||||||
|
|
||||||
// checkPath = (path, pathname, realPath) => {
|
checkPath = (path, pathname, realPath) => {
|
||||||
// if (path instanceof RegExp) {
|
if (path instanceof RegExp) {
|
||||||
// return path.test(pathname);
|
return path.test(pathname);
|
||||||
// }
|
}
|
||||||
// if (realPath) {
|
if (realPath) {
|
||||||
// return pathname === realPath;
|
return pathname === realPath;
|
||||||
// }
|
}
|
||||||
// return path === pathname;
|
return path === pathname;
|
||||||
// };
|
};
|
||||||
|
|
||||||
// getCurrentMenu = (pathname) => {
|
getCurrentMenu = (pathname) => {
|
||||||
// const item = this.menuAll.find((it) => this.checkPath(it.path, pathname));
|
const item = this.menuAll.find((it) => this.checkPath(it.path, pathname));
|
||||||
// if (item) {
|
if (item) {
|
||||||
// return [item];
|
return [item];
|
||||||
// }
|
}
|
||||||
// let found = false;
|
let found = false;
|
||||||
// let ret = [];
|
let ret = [];
|
||||||
// this.menuAll.forEach((detail) => {
|
this.menuAll.forEach((detail) => {
|
||||||
// if (!found && detail.children) {
|
if (!found && detail.children) {
|
||||||
// const current = detail.children.find((it) =>
|
const current = detail.children.find((it) =>
|
||||||
// this.checkPath(it.path, pathname)
|
this.checkPath(it.path, pathname)
|
||||||
// );
|
);
|
||||||
// if (current) {
|
if (current) {
|
||||||
// found = true;
|
found = true;
|
||||||
// ret = [detail, current];
|
ret = [detail, current];
|
||||||
// }
|
}
|
||||||
// if (!found) {
|
if (!found) {
|
||||||
// detail.children.forEach((subDetail) => {
|
detail.children.forEach((subDetail) => {
|
||||||
// if (subDetail.children) {
|
if (subDetail.children) {
|
||||||
// const subCurrent = subDetail.children.find((it) =>
|
const subCurrent = subDetail.children.find((it) =>
|
||||||
// this.checkPath(it.path, pathname)
|
this.checkPath(it.path, pathname)
|
||||||
// );
|
);
|
||||||
// if (subCurrent) {
|
if (subCurrent) {
|
||||||
// found = true;
|
found = true;
|
||||||
// ret = [detail, subDetail, subCurrent];
|
ret = [detail, subDetail, subCurrent];
|
||||||
// }
|
}
|
||||||
// }
|
}
|
||||||
// });
|
});
|
||||||
// }
|
}
|
||||||
// }
|
}
|
||||||
// });
|
});
|
||||||
// return ret;
|
return ret;
|
||||||
// };
|
};
|
||||||
|
|
||||||
// clearAllNotice = () => {
|
clearAllNotice = () => {
|
||||||
// const elements = document.getElementsByClassName('ant-notification-notice');
|
const elements = document.getElementsByClassName('ant-notification-notice');
|
||||||
// while (elements.length > 0) {
|
while (elements.length > 0) {
|
||||||
// elements[0].parentNode.removeChild(elements[0]);
|
elements[0].parentNode.removeChild(elements[0]);
|
||||||
// }
|
}
|
||||||
// this.rootStore.clearNoticeCount();
|
this.rootStore.clearNoticeCount();
|
||||||
// };
|
};
|
||||||
|
|
||||||
// updateMenuItemByAllowed(menuItem) {
|
updateMenuItemByAllowed(menuItem) {
|
||||||
// const { policy, endpoints, children = [], ...rest } = menuItem;
|
const { policy, endpoints, children = [], ...rest } = menuItem;
|
||||||
// if (policy && !checkItemPolicy({ policy })) {
|
if (policy && !checkItemPolicy({ policy })) {
|
||||||
// return null;
|
return null;
|
||||||
// }
|
}
|
||||||
// if (endpoints && !this.checkItemEndpoints(endpoints)) {
|
if (endpoints && !this.checkItemEndpoints(endpoints)) {
|
||||||
// return null;
|
return null;
|
||||||
// }
|
}
|
||||||
// if (children.length === 0) {
|
if (children.length === 0) {
|
||||||
// return menuItem;
|
return menuItem;
|
||||||
// }
|
}
|
||||||
// const newChildren = children
|
const newChildren = children
|
||||||
// .map((it) => this.updateMenuItemByAllowed(it))
|
.map((it) => this.updateMenuItemByAllowed(it))
|
||||||
// .filter((it) => !!it);
|
.filter((it) => !!it);
|
||||||
// return {
|
return {
|
||||||
// ...rest,
|
...rest,
|
||||||
// children: newChildren,
|
children: newChildren,
|
||||||
// };
|
};
|
||||||
// }
|
}
|
||||||
|
|
||||||
// init() {
|
init() {
|
||||||
// if (this.isAdminPage && !this.hasAdminPageRole) {
|
if (this.isAdminPage && !this.hasAdminPageRole) {
|
||||||
// window.location.href = '/base/overview';
|
window.location.href = '/base/overview';
|
||||||
// }
|
}
|
||||||
// this.routes = this.props.route.routes;
|
this.routes = this.props.route.routes;
|
||||||
// setRouteMap(this.menu);
|
setRouteMap(this.menu);
|
||||||
// }
|
}
|
||||||
|
|
||||||
// renderNotice() {
|
renderNotice() {
|
||||||
// if (this.noticeCount < 3) {
|
if (this.noticeCount < 3) {
|
||||||
// return null;
|
return null;
|
||||||
// }
|
}
|
||||||
// return (
|
return (
|
||||||
// <div className={styles.notice} onClick={this.clearAllNotice}>
|
<div className={styles.notice} onClick={this.clearAllNotice}>
|
||||||
// <BellOutlined />
|
<BellOutlined />
|
||||||
// <span style={{ marginLeft: 8, fontSize: 12 }}>
|
<span style={{ marginLeft: 8, fontSize: 12 }}>
|
||||||
// {t('Close all notifications.')}
|
{t('Close all notifications.')}
|
||||||
// </span>
|
</span>
|
||||||
// </div>
|
</div>
|
||||||
// );
|
);
|
||||||
// }
|
}
|
||||||
|
|
||||||
// renderHeader = () => (
|
renderHeader = () => (
|
||||||
// <GlobalHeader
|
<GlobalHeader
|
||||||
// {...this.props}
|
{...this.props}
|
||||||
// isAdminPage={this.isAdminPage}
|
isAdminPage={this.isAdminPage}
|
||||||
// navItems={this.globalNav}
|
navItems={this.globalNav}
|
||||||
// isUserCenterPage={this.isUserCenterPage}
|
isUserCenterPage={this.isUserCenterPage}
|
||||||
// />
|
/>
|
||||||
// );
|
);
|
||||||
|
|
||||||
// render() {
|
render() {
|
||||||
// const { pathname } = this.props.location;
|
const { pathname } = this.props.location;
|
||||||
// const currentRoutes = this.getCurrentMenu(pathname);
|
const currentRoutes = this.getCurrentMenu(pathname);
|
||||||
// console.log('testing popup');
|
console.log('testing popup');
|
||||||
// if (this.state.isOpenedInPopup) {
|
if (this.state.isOpenedInPopup) {
|
||||||
// return (
|
return (
|
||||||
// <Modal
|
<Modal
|
||||||
// visible
|
visible
|
||||||
// closable={false}
|
closable={false}
|
||||||
// footer={null}
|
footer={null}
|
||||||
// style={{
|
style={{
|
||||||
// position: 'fixed',
|
position: 'fixed',
|
||||||
// top: 0,
|
top: 0,
|
||||||
// left: 0,
|
left: 0,
|
||||||
// width: '100vw',
|
width: '100vw',
|
||||||
// height: '100vh',
|
height: '100vh',
|
||||||
// display: 'flex',
|
display: 'flex',
|
||||||
// justifyContent: 'center',
|
justifyContent: 'center',
|
||||||
// alignItems: 'center',
|
alignItems: 'center',
|
||||||
// }}
|
}}
|
||||||
// bodyStyle={{
|
bodyStyle={{
|
||||||
// textAlign: 'center',
|
textAlign: 'center',
|
||||||
// fontSize: '18px',
|
fontSize: '18px',
|
||||||
// padding: '20px',
|
padding: '20px',
|
||||||
// }}
|
}}
|
||||||
// >
|
>
|
||||||
// <p>Connexion... Please wait!</p>
|
<p>Connexion... Please wait!</p>
|
||||||
// </Modal>
|
</Modal>
|
||||||
// );
|
);
|
||||||
// }
|
}
|
||||||
|
|
||||||
// return (
|
return (
|
||||||
// <div className={styles['base-layout']}>
|
<div className={styles['base-layout']}>
|
||||||
// {this.renderNotice()}
|
{this.renderNotice()}
|
||||||
// <Header className={styles.header}>{this.renderHeader()}</Header>
|
<Header className={styles.header}>{this.renderHeader()}</Header>
|
||||||
// <LayoutMenu
|
<LayoutMenu
|
||||||
// pathname={pathname}
|
pathname={pathname}
|
||||||
// isAdminPage={this.isAdminPage}
|
isAdminPage={this.isAdminPage}
|
||||||
// menu={this.menu}
|
menu={this.menu}
|
||||||
// menuAll={this.menuAll}
|
menuAll={this.menuAll}
|
||||||
// currentRoutes={currentRoutes}
|
currentRoutes={currentRoutes}
|
||||||
// onCollapseChange={this.onCollapseChange}
|
onCollapseChange={this.onCollapseChange}
|
||||||
// />
|
/>
|
||||||
// <RightContext
|
<RightContext
|
||||||
// {...this.props}
|
{...this.props}
|
||||||
// {...this.state}
|
{...this.state}
|
||||||
// currentRoutes={currentRoutes}
|
currentRoutes={currentRoutes}
|
||||||
// isAdminPage={this.isAdminPage}
|
isAdminPage={this.isAdminPage}
|
||||||
// />
|
/>
|
||||||
// </div>
|
</div>
|
||||||
// );
|
);
|
||||||
// }
|
}
|
||||||
// }
|
}
|
||||||
|
|
||||||
// export default inject('rootStore')(observer(BaseLayout));
|
export default inject('rootStore')(observer(BaseLayout));
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user