Skip to content

C
CivWeb
Commit 715215a2 authored by 曾婧's avatar 曾婧
Browse files
Options

华农主题提交本地一版本

parent b5637430
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 1837 additions and 8 deletions
config/micor.js
View file @ 715215a2
/*
* @Author: ZengJing
* @Date: 2022-04-12 18:26:15
* @LastEditTime: 2022-04-14 09:47:56
* @LastEditors: ZengJing
* @Description:
* @FilePath: \CivWeb\config\micor.js
*/
export function genActiveRule(routerPrefix) {
return location => {
......@@ -34,18 +42,24 @@ export default {
// origin: `//127.0.0.1:8345`,
// },
// },
{
name: 'civ_webgis',
entry: `//${window.location.hostname}:8081/civ_webgis`,
container: '#micro-container',
activeRule: '/civbase/civ_webgis',
},
// {
// name: 'civ_webgis',
// entry: `//${window.location.hostname}:8081/civ_webgis`,
// container: '#micro-container',
// activeRule: '/civbase/civ_webgis',
// },
{
name: 'civweb4',
entry: `//${window.location.hostname}:3020/civweb4`,
container: '#micro-container',
activeRule: '/civbase/civweb4',
},
{
name: 'civ_energy',
entry: `//${window.location.hostname}:8081/civ_energy`,
container: '#micro-container',
activeRule: '/civbase/civ_energy',
},
// {
// name: 'middleground',
// entry: `//${window.location.hostname}:8082/middleground`,
......
config/proxy.js
View file @ 715215a2
......@@ -2,7 +2,7 @@
// const proxyURL = process.env.NODE_ENV !== 'production' ? 'http://192.168.10.150:8777' : window.location.origin;
// const proxyURL = 'https://work.panda-water.cn';
// const proxyURL = 'http://192.168.12.47:8082';
const proxyURL = 'https://panda-water.cn';
const proxyURL = 'http://localhost:8086';
module.exports = {
......
package.json
View file @ 715215a2
This diff is collapsed.
src/assets/basic/HN-logo.png 0 → 100644
View file @ 715215a2
This diff was suppressed by a .gitattributes entry.
src/components/GlobalHeader/HNRightContent.js 0 → 100644
View file @ 715215a2
This diff is collapsed.
src/layouts/AppLayout/components/SlideMenu/index copy.js 0 → 100644
View file @ 715215a2
import React, { useContext } from 'react';
import { ConfigProvider, Divider, Skeleton, Tooltip } from 'antd';
import './index.less';
import classNames from 'classnames';
import { ReactSVG } from 'react-svg';
import useMergedState from 'rc-util/lib/hooks/useMergedState';
import { useHistory } from '@wisdom-utils/runtime';
const LoadingSkeleton = (props) => {
const route = props.route;
return (
<div style={{ padding: route && !route.routes ? '20px 6px 6px 6px' : '0px' }}>
<Skeleton loading={route && !route.routes} active title={false} paragraph={{ rows: 10 }}>
{props.children}
</Skeleton>
</div>
);
};
const Menu = (props) => {
const {
prefixCls,
collapsed,
onCollapse,
onMenuClick,
menuHeaderRender,
onMenuHeaderClick,
} = props;
const route = props.route;
const history = useHistory();
const [selectIndex, setSelectIndex] = useMergedState(() => -1, {
value: props.active,
onChange: props.onActiveChange,
});
const toLink = (path) => {
if (!window.__POWERED_BY_QIANKUN__) {
history.push(path);
} else {
window.history.pushState(null, '', path);
}
};
const onSelectItem = (item, index) => {
let current = void 0;
let childrenRoutes = [];
if (item && item.routes) {
current = item.routes[0];
childrenRoutes = item.routes;
} else {
current = item;
childrenRoutes = [item];
}
setSelectIndex(index);
if (/iframe/.test(current.path)) {
history.push({
path: 'iframe',
state: current.params,
});
} else {
window.__POWERED_BY_QIANKUN__ ? toLink(`/civbase${current.path}`) : toLink(current.path);
}
onMenuClick && onMenuClick(current, childrenRoutes, index);
};
return (
<LoadingSkeleton {...props}>
{route && route.routes && route.routes.length > 0 && (
<React.Fragment>
{menuHeaderRender ? (
menuHeaderRender(props)
) : (
<>
<ul
className={classNames(`${prefixCls}-menu`)}
style={{ minHeight: '0px', marginBottom: '0px' }}
>
<li className={`${prefixCls}-menu-item`} onClick={onMenuHeaderClick}>
<Tooltip placement="right" title={collapsed ? route.name : ''}>
<a>
{route && route.extData && route.extData.icon && (
<img src={route.extData.icon} />
)}
{collapsed ? null : (
<span
className={classNames(
`${prefixCls}-menu-item-text`,
`${prefixCls}-menu-item-current`,
)}
>
{route && route.name}
</span>
)}
</a>
</Tooltip>
</li>
</ul>
<div className={`${prefixCls}-line`} />
</>
)}
<ul className={classNames(`${prefixCls}-menu ${prefixCls}-menu-vertical`)}>
{route &&
(route.routes || [])
.filter((item) => !item.hideInMenu)
.map((item, index) => {
return (
<React.Fragment key={index}>
<li
key={index}
className={classNames(`${prefixCls}-menu-item`, {
[`${prefixCls}-menu-item-active`]: index === selectIndex,
})}
onClick={() => onSelectItem(item, index)}
>
<Tooltip placement="right" title={collapsed ? item.name : ''}>
<a>
{item.icon ? (
item.icon
) : item.extData && /.svg/.test(item.extData.icon) ? (
<ReactSVG
src={item.extData.icon}
style={{ width: '20px', height: '20px' }}
className={`${prefixCls}-menu-item-icon`}
/>
) : (
item.extData && <img src={item.extData.icon} />
)}
{collapsed ? (
item.extData && (
<span className={`${prefixCls}-menu-item-text`}>
{(item.extData.shortName || item.name).substr(0, 2)}
</span>
)
) : (
<span className={`${prefixCls}-menu-item-text`}>{item.name}</span>
)}
</a>
</Tooltip>
</li>
<Divider
style={{
border: '1px solid rgb(49, 53, 62, 0.3)',
margin: '0 auto',
minWidth: '80%',
width: '80%',
}}
/>
</React.Fragment>
);
})}
</ul>
</React.Fragment>
)}
</LoadingSkeleton>
);
};
export default (props) => {
const { getPrefixCls } = useContext(ConfigProvider.ConfigContext);
const prefixCls = getPrefixCls('layout-slider');
const { menuItemRender, menuHeaderRender, siderWidth } = props;
const { collapsed, onCollapse, route, style } = props;
return (
<>
<div
style={{
width: collapsed ? '48px' : `${siderWidth}px`,
overflow: 'hidden',
flex: `0 0 ${collapsed ? 48 : siderWidth}px`,
maxWidth: collapsed ? 48 : siderWidth,
minWidth: collapsed ? 48 : siderWidth,
transition:
'background-color 0.3s ease 0s, min-width 0.3s ease 0s, max-width 0.3s cubic-bezier(0.645, 0.045, 0.355, 1) 0s',
...style,
}}
/>
<aside
className={classNames(`${prefixCls}`, `${prefixCls}-fixed`, {
[`${prefixCls}-collapsed`]: collapsed,
})}
>
<div className={`${prefixCls}-children`}>
<div
className={`${prefixCls}-wrapper`}
style={{ flex: '1 1 0%', overflow: 'hidden auto' }}
>
{/*{LoadingSkeleton(props)}*/}
{menuItemRender
? menuItemRender(props)
: Menu(Object.assign({}, props, { prefixCls: prefixCls }))}
</div>
{route && route.routes && route.routes.length > 0 && (
<div className={`${prefixCls}-pro-sider-links`}>
<ul
className={`${prefixCls}-menu ${prefixCls}-menu-root ${prefixCls}-menu-inline ${prefixCls}-menu-dark ${prefixCls}-pro-sider-link-menu`}
role="menu"
tabIndex="0"
>
<li
className={`${prefixCls}-menu-item ${prefixCls}-menu-item-only-child ${prefixCls}-pro-sider-collapsed-button`}
style={{ height: '40px', lineHeight: '40px' }}
role="menuitem"
tabIndex="-1"
onClick={onCollapse}
>
<span className={`${prefixCls}-menu-title-content`}>
<span
role="img"
aria-label="menu-fold"
className="anticon anticon-menu-fold"
style={{ color: '#fff' }}
>
<svg
viewBox="64 64 896 896"
focusable="false"
width="1em"
height="1em"
fill="currentColor"
aria-hidden="true"
>
<path d="M408 442h480c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8H408c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8zm-8 204c0 4.4 3.6 8 8 8h480c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8H408c-4.4 0-8 3.6-8 8v56zm504-486H120c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zm0 632H120c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zM115.4 518.9L271.7 642c5.8 4.6 14.4.5 14.4-6.9V388.9c0-7.4-8.5-11.5-14.4-6.9L115.4 505.1a8.74 8.74 0 000 13.8z"></path>
</svg>
</span>
</span>
</li>
</ul>
<div aria-hidden="true" style={{ display: 'none' }} />
</div>
)}
</div>
</aside>
</>
);
};
src/layouts/AppLayout/components/SlideMenu/index.js 0 → 100644
View file @ 715215a2
/*
* @Author: ZengJing
* @Date: 2022-04-15 09:34:03
* @LastEditTime: 2022-04-15 18:06:00
* @LastEditors: ZengJing
* @Description:
* @FilePath: \CivWeb\src\layouts\AppLayout\components\SlideMenu\index.js
*/
import React, { useContext, useEffect } from 'react';
import { ConfigProvider, Divider, Skeleton, Tooltip } from 'antd';
import classNames from 'classnames';
import { connect } from 'react-redux';
import { ReactSVG } from 'react-svg';
import ProLayout, { getPageTitle } from '@ant-design/pro-layout';
import useMergedState from 'rc-util/lib/hooks/useMergedState';
import { useHistory } from '@wisdom-utils/runtime';
const LoadingSkeleton = props => {
const route = props.route;
return (
<div style={{ padding: route && !route.routes ? '20px 6px 6px 6px' : '0px' }}>
<Skeleton loading={route && !route.routes} active title={false} paragraph={{ rows: 10 }}>
{props.children}
</Skeleton>
</div>
);
};
const Menu = props => {
const { prefixCls, collapsed, onCollapse, onMenuClick, menuHeaderRender, onMenuHeaderClick, title } = props;
const route = props.route;
const history = useHistory();
const [selectIndex, setSelectIndex] = useMergedState(() => -1, {
value: props.active,
onChange: props.onActiveChange,
});
const toLink = path => {
if (!window.__POWERED_BY_QIANKUN__) {
history.push(path);
} else {
window.history.pushState(null, '', path);
}
};
const onSelectItem = (item,dom) => {
let current = void 0;
let childrenRoutes = [];
console.log('item', item,dom);
if (item && item.child) {
current = item.child[0];
childrenRoutes = item.child;
} else {
current = item;
childrenRoutes = [item];
}
if (/iframe/.test(current.path)) {
history.push({
path: 'iframe',
state: current.params,
});
} else {
window.__POWERED_BY_QIANKUN__ ? toLink(`/civbase${current.path}`) : toLink(current.path);
}
console.log('current', childrenRoutes);
onMenuClick && onMenuClick(current, childrenRoutes);
};
useEffect(() => {
route.routes = treeRoutes(route.routes);
console.log('newRoutes************', route.routes);
}, [route]);
const treeRoutes = iroute =>
iroute
.filter(item => item.level !== 3)
.map(item => {
console.log('item..>', item);
if (item.routes && Array.isArray(item.routes) && item.routes.length >= 1) {
if(item.level===2){
item.child = item.routes;
}
item.routes = treeRoutes(item.routes);
}
return item;
});
return (
<LoadingSkeleton {...props}>
{route && route.routes && route.routes.length > 0 && (
<ProLayout
route={route}
title={props.title}
logo={null}
siderWidth={140}
config={props.global}
currentMenuIndex={props.currentMenuIndex}
// onHeaderLogo={handlerIndustry}
// onPageChange={handlerPageChange}
// onMenuPanelItemClick={handleUpdateCurrentIndex}
menuItemRender={(item, dom) => {
return item.level < 3 ? (
<div
onClick={() => {
onSelectItem(item,dom);
}}
className="test-icon"
>
{/.svg/.test(item.extData.icon) ? (
<div className="my-svg">
<ReactSVG src={item.extData.icon} style={{ width: '100%', height: '100%' }} />
</div>
) : (
<div className="my-img">
<img src={item.extData.icon} style={{ width: '100%', height: '100%' }} />
</div>
)}
<span style={{ marginLeft: '5px' }}> {dom} </span>
</div>
) : null;
}}
subMenuItemRender={(item, dom) => (
<div className="test-icon">
{/.svg/.test(item.extData.icon) ? (
<div className="my-svg">
<ReactSVG src={item.extData.icon} style={{ width: '100%', height: '100%' }} />
</div>
) : (
<div className="my-img">
<img src={item.extData.icon} style={{ width: '100%', height: '100%' }} />
</div>
)}
<span style={{ marginLeft: '5px' }}> {dom} </span>
</div>
)}
// headerSiteRender={() =>
// renderSite({
// data: cityData,
// config: props.global,
// loading: siteLoading,
// setLoading: setSiteLoading,
// action: siteAction,
// })
// }
>
<>
{/* <Suspense fallback={<></>}>
{window.location.pathname.startsWith('/civbase/civ_3d') ? (
<KeepAlive>
<CesiumMap />
</KeepAlive>
) : window.location.pathname.startsWith('/civbase/civ_webgis') ? (
mapMode === 'AMap' ? (
<AMap />
) : (
<ArcgisMap options={{ type: 'ArcgisMap' }} />
)
) : null}
</Suspense>
<div id="micro-container" className="subapp-container">
{props.children}
</div> */}
</>
</ProLayout>
)}
</LoadingSkeleton>
);
};
const mapStateToProps = state => ({
global: state.getIn(['global', 'globalConfig']),
settings: state.getIn(['global', 'defaultSetting']),
collapsed: state.getIn(['global', 'collapsed']),
menu: state.getIn(['global', 'menu']),
currentMenuIndex: state.getIn(['global', 'currentMenuIndex']),
flatMenu: state.getIn(['global', 'flatMenu']),
authValidate: state.getIn(['global', 'authValidate']),
pathname: state.getIn(['global', 'pathname']),
selectedKeys: state.getIn(['global', 'selectedKeys']),
openKeys: state.getIn(['global', 'openKeys']),
complexConfig: state.getIn(['global', 'complexConfig']),
complexPathName: state.getIn(['global', 'complexPathName']),
microMounted: state.getIn(['global', 'microMounted']),
});
const mapDispatchToProps = dispatch => ({
updageSetting(setting) {
dispatch(actionCreators.updageSetting(setting));
},
updateConfig(config) {
dispatch(actionCreators.getConfig(config));
},
updateCurrentIndex(index) {
dispatch(actionCreators.updateCurrentIndex(index));
},
updateCollapsed(collapsed) {
dispatch(actionCreators.updateCollapsed(collapsed));
},
updateAuthValidate(auth) {
dispatch(actionCreators.updateAuthValidate(auth));
},
updatePathname(pathname) {
dispatch(actionCreators.updatePathname(pathname));
},
updateSelectedKeys(keys) {
dispatch(actionCreators.updateSelectedKeys(keys));
},
updateOpenKeys(keys) {
dispatch(actionCreators.updateOpenKeys(keys));
},
updateComplexConfig(config) {
dispatch(actionCreators.updateComplexConfig(config));
},
updateComplexPathName(pathname) {
dispatch(actionCreators.updateComplexPathName(pathname));
},
logout() {
dispatch(actionCreators.logout());
},
});
export default connect(
mapStateToProps,
mapDispatchToProps,
)(Menu);
src/layouts/AppLayout/components/SlideMenu/index.less 0 → 100644
View file @ 715215a2
@import '~antd/es/style/themes/default.less';
@panda-prefix-cls: ~'@{ant-prefix}-layout-slider';
@primary-color: #1685ff;
@primary-1: color(~`colorPalette('@{primary-color}', 1) `); // replace tint(@primary-color, 90%)
@primary-2: color(~`colorPalette('@{primary-color}', 2) `); // replace tint(@primary-color, 80%)
@primary-3: color(~`colorPalette('@{primary-color}', 3) `); // unused
@primary-4: color(~`colorPalette('@{primary-color}', 4) `); // unused
@primary-5: color(
~`colorPalette('@{primary-color}', 5) `
); // color used to control the text color in many active and hover states, replace tint(@primary-color, 20%)
@primary-6: @primary-color; // color used to control the text color of active buttons, don't use, use @primary-color
@primary-7: color(~`colorPalette('@{primary-color}', 7) `); // replace shade(@primary-color, 5%)
@primary-8: color(~`colorPalette('@{primary-color}', 8) `); // unused
@primary-9: color(~`colorPalette('@{primary-color}', 9) `); // unused
@primary-10: color(~`colorPalette('@{primary-color}', 10) `); // unused
@slider-light: #fff;
@color-black: #fff;
.@{panda-prefix-cls} {
overflow: hidden;
flex: 0 0 80px;
max-width: 80px;
min-width: 80px;
width: 80px;
background-color: @layout-header-background;
transition: background 0.3s, width 0.3s cubic-bezier(0.2, 0, 0, 1) 0s;
&-logo{
display: none;
}
&-fixed {
position: fixed !important;
top: 46px;
left: 0;
z-index: 600;
height: calc(100% - 46px);
// overflow: auto;
overflow-x: hidden;
box-shadow: 2px 0 8px 0 rgb(29 35 41 / 5%);
transition: all 0.2s;
}
&-collapsed {
flex: 0 0 48px;
max-width: 48px;
min-width: 48px;
width: 48px;
transition: background 0.3s, width 0.5s cubic-bezier(0.2, 0, 0, 1) 0s;
.sliderMenu {
.splitLine {
width: 48px;
}
}
}
&-children {
display: flex;
flex-direction: column;
height: 100%;
}
&-wrapper {
flex: 1 1 0%;
}
&-menu {
position: relative;
min-height: 100%;
&-item {
height: 74px;
display: flex;
align-items: center;
text-align: center;
width: 100%;
justify-content: center;
cursor: pointer;
transition: border-color 0.3s, background 0.3s,
padding 0.1s cubic-bezier(0.215, 0.61, 0.355, 1);
a {
text-align: center;
display: flex;
flex-direction: column;
align-items: center;
img {
width: 22px;
height: 22px;
opacity: 0.7;
}
}
&-icon {
transition: font-size 0.15s cubic-bezier(0.215, 0.61, 0.355, 1),
margin 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), color 0.3s;
font-size: 14px;
svg {
path,
rect,
circle,
.cls-1 {
fill: hsla(0, 0%, 100%, 0.65) !important;
stroke: hsla(0, 0%, 100%, 0.65) !important;
stroke-width: 0 !important;
stroke-linecap: round;
stroke-miterlimit: 10;
}
}
}
&-text {
display: block;
color: hsla(0, 0%, 100%, 0.65);
padding-top: 4px;
max-width: 70px;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
opacity: 1;
transition: opacity 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), margin 0.3s, color 0.3s;
}
&-current {
color: @color-black;
}
&.hover {
span {
color: #fff;
}
.icon {
&.fillCurrent {
svg {
path {
fill: hsla(0, 0%, 100%, 0.65) !important;
stroke: hsla(0, 0%, 100%, 0.65) !important;
}
}
}
// svg {
// path:not(.st0) {
// fill: #fff!important;
// }
// path.st0 {
// fill:url(#SVGID_1_)!important;
// }
// path.st1 {
// fill:url(#SVGID_2_)!important;
// }
// }
}
}
&-active {
background: @primary-color;
box-shadow: 0px 1px 0px 0px rgba(238, 238, 238, 0.17);
span {
color: #ffffff;
}
.icon {
svg {
path,
rect,
circle {
// fill: #fff!important;
}
}
}
}
}
}
}
src/layouts/AppLayout/components/SliderPanel/Categories.js 0 → 100644
View file @ 715215a2
import React, { useState } from 'react';
import classNames from 'classnames';
import styles from './index.less';
const Categories = (props) => {
const [currentIndex, setCurrentIndex] = useState(props.currentMenuIndex);
const selectCategories = (event, index) => {
event.preventDefault();
event.stopPropagation();
event.nativeEvent.stopImmediatePropagation();
setCurrentIndex(index);
// eslint-disable-next-line no-unused-expressions
props.onChange && props.onChange(index);
};
return (
<div
className={classNames(styles['menu-categories'], {
[styles['min-cateorites']]: props.mode,
})}
>
{(props.data || []).map((item, index) => {
const categorieCls = classNames(
styles['categorie-name'],
styles.btn,
currentIndex === index ? styles.active : '',
);
return (
<div
className={categorieCls}
key={item.name}
onClick={(event) => selectCategories(event, index)}
>
{/* eslint-disable-next-line jsx-a11y/alt-text */}
<img src={item.extData.icon} />
<span>{item.extData.label}</span>
</div>
);
})}
</div>
);
};
export default Categories;
src/layouts/AppLayout/components/SliderPanel/Menu.js 0 → 100644
View file @ 715215a2
import React from 'react';
import styles from './index.less';
const Menu = (props) => {
const renderTitle = (title) => <h4 className={styles.title}>{title}</h4>;
const renderMenuItem = (data) => {
let menuItem = [];
if (!data) {
return;
}
// eslint-disable-next-line no-prototype-builtins
if (!data.hasOwnProperty('routes')) {
menuItem = (
<div
className={styles['main-menus-recentAll-menu-group-items-menu-item']}
onClick={(event) => props.handleClick(event, data)}
>
<img src={data.extData.icon} alt="" />
<a
className={`${styles['main-menus-recentAll-menu-group-items-menu-item-name']} ${styles.pad}`}
>
{data.name}
</a>
</div>
);
} else {
data.routes.forEach((item, index) => {
const render = (
<div
className={styles['main-menus-recentAll-menu-group-items-menu-item']}
key={item.name}
onClick={(event) => props.handleClick(event, item)}
>
<img src={item.extData.icon} alt="" />
<a
className={`${styles['main-menus-recentAll-menu-group-items-menu-item-name']} ${styles.pad}`}
>
{item.name}
</a>
</div>
);
menuItem.push(render);
});
}
// eslint-disable-next-line consistent-return
return menuItem;
};
return (
<div className={styles['main-menus']}>
<div className={styles['main-menus-recentAll']}>
<div className={styles['main-menus-recentAll-menu-group']}>
{(props.data.routes || []).map((item, index) => (
<div className={styles['main-menus-recentAll-menu-group-items']} key={item.name}>
{renderTitle(item.name)}
{renderMenuItem(item)}
</div>
))}
</div>
</div>
</div>
);
};
export default Menu;
src/layouts/AppLayout/components/SliderPanel/MinCategories.js 0 → 100644
View file @ 715215a2
import React, { useState } from 'react';
import classNames from 'classnames';
import styles from './min.less';
const Categories = (props) => {
const [currentIndex, setCurrentIndex] = useState(props.currentMenuIndex);
const selectCategories = (event, index) => {
event.preventDefault();
event.stopPropagation();
event.nativeEvent.stopImmediatePropagation();
setCurrentIndex(index);
// eslint-disable-next-line no-unused-expressions
props.onChange && props.onChange(index);
};
return (
<div
className={classNames(styles['menu-categories'], {
[styles['min-cateorites']]: props.mode,
})}
>
{(props.data || [])
.filter((item) => !item.hideInMenu)
.map((item, index) => {
const categorieCls = classNames(
styles['categorie-name'],
styles.btn,
currentIndex === index ? styles.active : '',
);
return (
<div
className={categorieCls}
key={item.name}
onClick={(event) => selectCategories(event, index)}
>
{/* eslint-disable-next-line jsx-a11y/alt-text */}
<img src={item.extData.icon} />
<span>{item.extData.label}</span>
</div>
);
})}
</div>
);
};
export default Categories;
src/layouts/AppLayout/components/SliderPanel/MinPanel.js 0 → 100644
View file @ 715215a2
import React, { useEffect, useRef, useState, useContext } from 'react';
import classNames from 'classnames';
import propTypes from 'prop-types';
import KeyCode from 'rc-util/lib/KeyCode';
import Icon from '@ant-design/icons';
import Categories from './MinCategories';
import './min.less';
import { ConfigProvider } from 'antd';
// eslint-disable-next-line import/extensions
import { events } from '@wisdom-utils/utils/lib/helpers';
const ThLarge = (props) => (
<svg viewBox="0 0 1024 1024" version="1.1" width="14" height="14">
<path
d="M592 64h384c26.51 0 48 21.49 48 48v320c0 26.51-21.49 48-48 48H592c-26.51 0-48-21.49-48-48V112c0-26.51 21.49-48 48-48z m-160 0H48C21.49 64 0 85.49 0 112v320c0 26.51 21.49 48 48 48h384c26.51 0 48-21.49 48-48V112c0-26.51-21.49-48-48-48zM0 592v320c0 26.51 21.49 48 48 48h384c26.51 0 48-21.49 48-48V592c0-26.51-21.49-48-48-48H48c-26.51 0-48 21.49-48 48z m592 368h384c26.51 0 48-21.49 48-48V592c0-26.51-21.49-48-48-48H592c-26.51 0-48 21.49-48 48v320c0 26.51 21.49 48 48 48z"
fill="#737f97"
/>
</svg>
);
const ThLargeIcon = (props) => <Icon component={ThLarge} {...props} />;
const MinPanel = (props) => {
const { getPrefixCls } = useContext(ConfigProvider.ConfigContext);
const prefixCls = getPrefixCls('panel-min');
const getCategories = () => {
let { data } = props;
// eslint-disable-next-line no-prototype-builtins
data = data.filter((item) => item.hasOwnProperty('extData'));
return data;
};
const categories = getCategories();
const wcls = categories.length <= 10 ? 'w110' : 'w210';
const panelCls = classNames(
[`${prefixCls}-mainPane`],
props.visible ? `${prefixCls}-mainPane-visible` : `${prefixCls}-mainPane-hidden`,
[`${prefixCls}-mainPane-${wcls}`],
);
const domRef = useRef();
// eslint-disable-next-line no-debugger;
const [currentMenu, setCurrentMenu] = useState(null);
useEffect(() => {
setCurrentMenu(props.data[props.currentMenuIndex]);
}, [props.data, props.currentMenuIndex]);
// eslint-disable-next-line no-underscore-dangle
let _clickEvents = null;
const handleKeyDown = (event) => {
if (event.keyCode === KeyCode.ESC) {
const { onClose } = props;
event.stopPropagation();
if (onClose) {
onClose(event);
}
}
};
const domFocus = () => {
if (domRef) {
domRef.current.focus();
}
};
const handleDocumentClick = (e) => {
if (props.visible) {
const node = domRef && domRef.current;
if (
node &&
(node === e.target ||
node.contains(e.target) ||
(e.target !== document && !document.documentElement.contains(e.target)))
) {
return;
}
// eslint-disable-next-line no-unused-expressions
props.onClose && props.onClose(e);
}
};
const addDocumentEvents = () => {
if (props.canCloseByOutSideClick) {
_clickEvents = events.on(document, 'click', handleDocumentClick);
}
};
const removeDocumentEvents = () => {
_clickEvents.off();
_clickEvents = null;
};
const selectItem = (event, item) => {
// eslint-disable-next-line no-unused-expressions
props.onSelect && props.onSelect(item);
};
const handleCategories = (index) => {
setCurrentMenu(props.data[index]);
// eslint-disable-next-line no-unused-expressions
props.onChange && props.onChange(index);
};
useEffect(() => {
if (props.visible) {
domFocus();
}
addDocumentEvents();
return () => removeDocumentEvents();
}, [props.visible]);
return (
<div
className={panelCls}
tabIndex="-1"
onKeyDown={(event) => (props.visible && props.keyboard ? handleKeyDown(event) : undefined)}
ref={domRef}
>
<div className={`${prefixCls}-mainPane-main`}>
<div className={`${prefixCls}-mainPane-main-left`}>
<Categories
mode="mini"
data={categories}
onChange={handleCategories}
currentMenuIndex={props.currentMenuIndex}
/>
</div>
</div>
</div>
);
};
MinPanel.propTypes = {
visible: propTypes.bool,
keyboard: propTypes.bool,
onClose: propTypes.func,
canCloseByOutSideClick: propTypes.bool,
};
MinPanel.defaultProps = {
visible: false,
keyboard: true,
canCloseByOutSideClick: true,
onClose: () => {},
};
export default MinPanel;
src/layouts/AppLayout/components/SliderPanel/Panel.js 0 → 100644
View file @ 715215a2
import React, { useEffect, useRef, useState } from 'react';
import classNames from 'classnames';
import propTypes from 'prop-types';
import KeyCode from 'rc-util/lib/KeyCode';
import { Spin } from 'antd';
import Icon, { MenuOutlined } from '@ant-design/icons';
import { events } from '@wisdom-utils/utils/lib/helpers';
import Categories from './Categories';
import styles from './index.less';
import Menu from './Menu';
// eslint-disable-next-line import/extensions
const ThLarge = (props) => (
<svg viewBox="0 0 1024 1024" version="1.1" width="14" height="14">
<path
d="M592 64h384c26.51 0 48 21.49 48 48v320c0 26.51-21.49 48-48 48H592c-26.51 0-48-21.49-48-48V112c0-26.51 21.49-48 48-48z m-160 0H48C21.49 64 0 85.49 0 112v320c0 26.51 21.49 48 48 48h384c26.51 0 48-21.49 48-48V112c0-26.51-21.49-48-48-48zM0 592v320c0 26.51 21.49 48 48 48h384c26.51 0 48-21.49 48-48V592c0-26.51-21.49-48-48-48H48c-26.51 0-48 21.49-48 48z m592 368h384c26.51 0 48-21.49 48-48V592c0-26.51-21.49-48-48-48H592c-26.51 0-48 21.49-48 48v320c0 26.51 21.49 48 48 48z"
fill="#737f97"
/>
</svg>
);
const ThLargeIcon = (props) => <Icon component={ThLarge} {...props} />;
const Panel = (props) => {
const panelCls = classNames(styles.mainPane, props.visible ? styles.visible : styles.hidden);
const domRef = useRef();
// eslint-disable-next-line no-debugger;
const [currentMenu, setCurrentMenu] = useState(null);
useEffect(() => {
setCurrentMenu(props.data[props.currentMenuIndex]);
}, [props.data, props.currentMenuIndex]);
// eslint-disable-next-line no-underscore-dangle
let _clickEvents = null;
const handleKeyDown = (event) => {
if (event.keyCode === KeyCode.ESC) {
const { onClose } = props;
event.stopPropagation();
if (onClose) {
onClose(event);
}
}
};
const domFocus = () => {
if (domRef) {
domRef.current.focus();
}
};
const handleDocumentClick = (e) => {
if (props.visible) {
const node = domRef && domRef.current;
if (
node &&
(node === e.target ||
node.contains(e.target) ||
(e.target !== document && !document.documentElement.contains(e.target)))
) {
return;
}
// eslint-disable-next-line no-unused-expressions
props.onClose && props.onClose(e);
}
};
const addDocumentEvents = () => {
if (props.canCloseByOutSideClick) {
_clickEvents = events.on(document, 'click', handleDocumentClick);
}
};
const removeDocumentEvents = () => {
_clickEvents.off();
_clickEvents = null;
};
const getCategories = () => {
let { data } = props;
// eslint-disable-next-line no-prototype-builtins
data = data.filter((item) => item.hasOwnProperty('extData'));
return data;
};
const handleCategories = (index) => {
setCurrentMenu(props.data[index]);
// eslint-disable-next-line no-unused-expressions
props.onChange && props.onChange(index);
};
const selectItem = (event, item) => {
// eslint-disable-next-line no-unused-expressions
props.onSelect && props.onSelect(item);
};
useEffect(() => {
if (props.visible) {
domFocus();
}
addDocumentEvents();
return () => removeDocumentEvents();
}, [props.visible]);
return (
<div
className={panelCls}
tabIndex="-1"
onKeyDown={(event) => (props.visible && props.keyboard ? handleKeyDown(event) : undefined)}
ref={domRef}
>
<div className={styles.header}>
<ThLargeIcon />
<div className={styles['header-title']}>切换子系统</div>
<span className={styles.subheader}>
<MenuOutlined />
子系统功能一览
</span>
<span className={styles.marks}>
<img
src="https://panda-water.cn/web4/assets/images/waterMarks/%E8%8F%9C%E5%8D%95%E6%B0%B4%E5%8D%B0.SVG"
alt=""
/>
</span>
</div>
<div className={styles.main}>
<div className={styles['main-left']}>
<Categories
data={getCategories()}
onChange={handleCategories}
currentMenuIndex={props.currentMenuIndex}
/>
</div>
<div className={styles['main-menus']}>
<Spin spinning={!currentMenu}>
<Menu data={currentMenu || []} handleClick={selectItem} />
</Spin>
</div>
</div>
</div>
);
};
Panel.propTypes = {
visible: propTypes.bool,
keyboard: propTypes.bool,
onClose: propTypes.func,
canCloseByOutSideClick: propTypes.bool,
};
Panel.defaultProps = {
visible: false,
keyboard: true,
canCloseByOutSideClick: true,
onClose: () => {},
};
export default Panel;
src/layouts/AppLayout/components/SliderPanel/index.js 0 → 100644
View file @ 715215a2
import Panel from './Panel';
import MinPanel from './MinPanel';
export { Panel, MinPanel };
src/layouts/AppLayout/components/SliderPanel/index.less 0 → 100644
View file @ 715215a2
@import '~antd/es/style/themes/default.less';
@dark-menu-catatories-color: rgba(255, 255, 255, 0.65);
.mainPane {
position: absolute;
&.hidden {
// display: none;
flex: 1 1 0%;
// position: relative;
z-index: 5;
background-color: rgb(247, 247, 247);
// min-width: 490px;
// max-width: 980px;
width: 0;
overflow: hidden;
transition: all 0.25s cubic-bezier(0, 0, 0.2, 1) 0s;
transform: translateX(-1240px);
}
&.visible {
display: block;
flex: 1 1 0%;
position: absolute;
z-index: 30;
background-color: #001529;
min-width: 500px;
max-width: 640px;
overflow: hidden;
height: 100%;
transition: all 0.25s cubic-bezier(0, 0, 0.2, 1) 0s;
}
.header {
width: 100%;
height: 40px;
line-height: 20px;
text-align: center;
padding: 0 0 0 18px;
display: inline-flex;
align-items: center;
&-title {
color: #fff;
padding-left: 12px;
}
.subheader {
color: #fff;
display: flex;
align-items: center;
margin-left: 20px;
:global(.@{ant-prefix}icon-menu) {
color: #737f97;
padding-right: 12px;
}
}
.marks {
position: absolute;
right: 12px;
top: 8px;
}
}
.main {
// padding: 32px 0px 0px 32px;
padding: 0px 0px 0px 4px;
height: 100%;
overflow: hidden;
box-sizing: border-box;
display: flex;
&-left {
// padding-top: 32px;
width: 125px;
height: 100%;
overflow: hidden auto;
box-sizing: border-box;
.menu-categories {
&.min-cateorites {
position: relative;
top: 46px;
}
.categorie-name {
border-width: 0px 0px 0px 1px;
border-top-style: initial;
border-right-style: initial;
border-bottom-style: initial;
border-top-color: initial;
border-right-color: initial;
border-bottom-color: initial;
border-image: initial;
border-left-style: solid;
border-left-color: rgb(222, 222, 222);
display: flex;
align-items: center;
&.btn {
box-sizing: border-box;
outline: medium;
background: none;
cursor: pointer;
font-family: inherit;
font-size: inherit;
text-decoration: none;
transition: all 0.3s ease-out 0s;
border: 1px solid transparent;
vertical-align: middle;
text-align: left;
color: rgb(85, 85, 85);
// display: block;
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
padding: 0px 12px;
height: 40px;
line-height: 40px;
&:hover {
border-left: 2px solid @primary-color;
span {
color: #fff;
}
}
&:hover,
&:link:hover,
&:visited:hover {
color: #273150;
}
}
img {
width: 17px;
height: 17px;
}
span {
margin-left: 12px;
color: @dark-menu-catatories-color;
}
&.active {
background-color: @primary-color;
// border-left: 2px solid @primary-2;
transition: all 0.25s cubic-bezier(0, 0, 0.2, 1) 0s;
}
}
}
}
&-menus {
flex: 1 1 0%;
height: 100%;
overflow: hidden;
display: flex;
flex-direction: row;
margin-left: 12px;
&::-webkit-scrollbar {
width: 0px;
height: 0px;
}
&-recentAll {
flex: 1 1 0%;
padding: 0px 32px 32px 0px;
overflow: auto;
&-menu-group {
margin-bottom: 12px;
columns: 120px 3;
column-gap: 12px;
&-items {
display: inline-block;
margin-bottom: 20px;
width: 100%;
break-inside: avoid;
.title {
margin: 0px 0px 8px 0px;
padding: 0px;
height: 30px;
line-height: 30px;
font-size: 12px;
font-weight: 600;
color: #fff;
transition: all 250ms linear 0s;
}
&-menu-item {
position: relative;
transition: all 300ms ease 0s;
display: flex;
align-items: center;
img {
width: 14px;
height: 14px;
}
&-name {
box-sizing: border-box;
outline: medium;
background: none;
cursor: pointer;
font-family: inherit;
font-size: inherit;
text-decoration: none;
transition: all 0.3s ease-out 0s;
border: 1px solid transparent;
vertical-align: middle;
text-align: left;
color: rgba(255, 255, 255, 0.65);
display: block;
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
padding: 0px 12px;
height: 32px;
line-height: 30px;
&.pad {
padding: 0px 4px;
}
&:link,
&:visited,
&:hover {
// color: rgb(85, 85, 85);
color: #fff;
}
}
}
}
}
}
}
}
}
src/layouts/AppLayout/components/SliderPanel/min.less 0 → 100644
View file @ 715215a2
@import '~antd/es/style/themes/default.less';
@dark-menu-catatories-color: rgba(255, 255, 255, 0.65);
@primary-color: #1685ff;
@panda-prefix-cls: ~'@{ant-prefix}-panel-min';
.@{panda-prefix-cls}-mainPane {
position: absolute;
&-hidden {
// display: none;
flex: 1 1 0%;
// position: relative;
z-index: 5;
background-color: rgb(247, 247, 247);
// min-width: 490px;
// max-width: 980px;
width: 0;
overflow: hidden;
transition: all 0.25s cubic-bezier(0, 0, 0.2, 1) 0s;
transform: translateX(-1240px);
}
&-visible {
display: block;
flex: 1;
position: absolute;
z-index: 610;
background-color: rgba(0, 21, 41, 0.99);
min-width: 210px;
max-width: 210px;
overflow: hidden;
height: 100%;
transition: all 0.25s cubic-bezier(0, 0, 0.2, 1) 0s;
}
&-w110 {
min-width: 110px;
max-width: 110px;
}
&-w210 {
min-width: 210px;
max-width: 210px;
}
&-header {
width: 100%;
height: 40px;
line-height: 20px;
text-align: center;
padding: 0 0 0 18px;
display: inline-flex;
align-items: center;
&-title {
color: #fff;
padding-left: 12px;
}
.subheader {
color: #fff;
display: flex;
align-items: center;
margin-left: 20px;
:global(.@{ant-prefix}icon-menu) {
color: #737f97;
padding-right: 12px;
}
}
.marks {
position: absolute;
right: 12px;
top: 8px;
}
}
&-main {
// padding: 32px 0px 0px 32px;
padding: 0px 0px 0px 4px;
height: 100%;
overflow: hidden;
box-sizing: border-box;
display: flex;
&-left {
// padding-top: 32px;
// width: 125px;
height: 100%;
overflow: hidden auto;
box-sizing: border-box;
.menu-categories {
&.min-cateorites {
position: relative;
top: 48px;
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
.categorie-name {
border-width: 0px 0px 0px 1px;
border-top-style: initial;
border-right-style: initial;
border-bottom-style: initial;
border-top-color: initial;
border-right-color: initial;
border-bottom-color: initial;
border-image: initial;
border-left-style: solid;
border-left-color: rgb(222, 222, 222);
display: flex;
align-items: center;
&.btn {
box-sizing: border-box;
outline: medium;
background: none;
cursor: pointer;
font-family: inherit;
font-size: inherit;
text-decoration: none;
transition: all 0.3s ease-out 0s;
border: 1px solid transparent;
vertical-align: middle;
text-align: left;
color: #555555;
width: 100px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
padding: 12px 12px;
height: 74px;
display: flex;
flex-direction: column;
align-items: center;
margin-bottom: 2px;
&:hover {
// border-left: 2px solid @primary-color;
// span {
// color: #fff;
// }
span {
color: #fff;
transition: all 0.25s cubic-bezier(0, 0, 0.2, 1) 0s;
}
}
&:hover,
&:link:hover,
&:visited:hover {
color: #273150;
}
}
img {
width: 22px;
height: 22px;
}
span {
// margin-left: 12px;
padding-top: 4px;
color: @dark-menu-catatories-color;
opacity: 1;
transition: opacity 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), margin 0.3s, color 0.3s;
}
&.active {
background-color: rgba(0, 0, 0, 0.2);
// border-left: 2px solid @primary-2;
transition: all 0.25s cubic-bezier(0, 0, 0.2, 1) 0s;
span {
color: #fff;
}
}
}
}
}
&-menus {
flex: 1 1 0%;
height: 100%;
overflow: hidden;
display: flex;
flex-direction: row;
margin-left: 12px;
&::-webkit-scrollbar {
width: 0px;
height: 0px;
}
&-recentAll {
flex: 1 1 0%;
padding: 0px 32px 32px 0px;
overflow: auto;
&-menu-group {
margin-bottom: 12px;
columns: 120px 3;
column-gap: 12px;
&-items {
display: inline-block;
margin-bottom: 20px;
width: 100%;
break-inside: avoid;
.title {
margin: 0px 0px 8px 0px;
padding: 0px;
height: 30px;
line-height: 30px;
font-size: 12px;
font-weight: 600;
color: #fff;
transition: all 250ms linear 0s;
}
&-menu-item {
position: relative;
transition: all 300ms ease 0s;
display: flex;
align-items: center;
img {
width: 14px;
height: 14px;
}
&-name {
box-sizing: border-box;
outline: medium;
background: none;
cursor: pointer;
font-family: inherit;
font-size: inherit;
text-decoration: none;
transition: all 0.3s ease-out 0s;
border: 1px solid transparent;
vertical-align: middle;
text-align: left;
color: rgba(255, 255, 255, 0.65);
display: block;
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
padding: 0px 12px;
height: 32px;
line-height: 30px;
&.pad {
padding: 0px 4px;
}
&:link,
&:visited,
&:hover {
// color: rgb(85, 85, 85);
color: #fff;
}
}
}
}
}
}
}
}
}
src/layouts/AppLayout/layouts/BasicLayout.js 0 → 100644
View file @ 715215a2
This diff is collapsed.
src/layouts/AppLayout/layouts/BasicLayout.less 0 → 100644
View file @ 715215a2
@import '~antd/es/style/themes/default.less';
@primary-color: #1685ff;
@primary-1: color(~`colorPalette('@{primary-color}', 1) `); // replace tint(@primary-color, 90%)
@primary-2: color(~`colorPalette('@{primary-color}', 2) `); // replace tint(@primary-color, 80%)
@primary-3: color(~`colorPalette('@{primary-color}', 3) `); // unused
@primary-4: color(~`colorPalette('@{primary-color}', 4) `); // unused
@primary-5: color(
~`colorPalette('@{primary-color}', 5) `
); // color used to control the text color in many active and hover states, replace tint(@primary-color, 20%)
@primary-6: @primary-color; // color used to control the text color of active buttons, don't use, use @primary-color
@primary-7: color(~`colorPalette('@{primary-color}', 7) `); // replace shade(@primary-color, 5%)
@primary-8: color(~`colorPalette('@{primary-color}', 8) `); // unused
@primary-9: color(~`colorPalette('@{primary-color}', 9) `); // unused
@primary-10: color(~`colorPalette('@{primary-color}', 10) `); // unused
@slider-light: #fff;
@color-black: #fff;
@panda-prefix-cls: ~'@{ant-prefix}';
.@{panda-prefix-cls}-basic-layout * {
box-sizing: border-box;
}
.@{panda-prefix-cls}-basic-layout {
display: flex;
flex-direction: column;
width: 100%;
min-height: 100%;
&-has-slider {
flex-direction: row;
display: flex;
flex: auto;
}
&-content {
position: relative;
height: calc(100vh - 82px);
margin-top: 82px;
overflow: hidden;
&.hook_web4 {
height: calc(100% - 82px);
margin-top: 82px;
}
}
}
.@{panda-prefix-cls}-layout {
position: relative;
flex: auto;
flex-direction: column;
min-height: 0;
background: #f0f2f5;
width: 100%;
}
.@{panda-prefix-cls}-global-page-header {
position: fixed;
top: 0px;
width: 100%;
left: 0px;
z-index: 999;
box-sizing: border-box;
margin: 0;
color: rgba(0, 0, 0, 0.85);
font-size: 14px;
font-variant: tabular-nums;
line-height: 1.5715;
list-style: none;
font-feature-settings: 'tnum', 'tnum';
position: relative;
height: 46px;
background-color: #0678f5;
background-size: cover;
display: flex;
flex-direction: row;
box-sizing: border-box;
&-header {
position: absolute;
width: 100%;
display: flex;
align-items: center;
height: 100%;
padding-left: 17px;
&-logo {
display: flex;
align-items: center;
height: 100%;
padding-left: 7px;
img {
//width: 48px;
width: 42px;
height: auto;
//height: 25px;
}
}
&-title {
min-width: 200px;
font-size: 26px;
font-weight: 400;
color: #ffffff;
opacity: 0.9;
padding-left: 25px;
font-family: PangMenZhengDaoBiaoTiTi;
letter-spacing: 2px;
}
}
}
src/layouts/AppLayout/layouts/assets/header.png 0 → 100644
View file @ 715215a2
This diff was suppressed by a .gitattributes entry.
src/layouts/AppLayout/layouts/assets/site.png 0 → 100644
View file @ 715215a2
This diff was suppressed by a .gitattributes entry.
src/layouts/AppLayout/layouts/assets/图层 998@2x.png 0 → 100644
View file @ 715215a2
This diff was suppressed by a .gitattributes entry.
src/layouts/HN.less 0 → 100644
View file @ 715215a2
@hn-greenColor: #00b278;
:global {
.panda-console-base-userWrapper-userInfo-header {
//右上角弹框
background-color: @hn-greenColor;
}
}
.hnlayout {
:global {
.panda-console-base-global-page-header-header-logo {
& > img {
width: 144px !important;
height: 36px;
}
}
.panda-console-base-global-page-header {
background-color: @hn-greenColor;
& > img {
display: none;
}
}
.panda-console-base-layout-slider {
background-color: #fff;
}
.panda-console-base-layout-slider-menu-item-active {
background-color: @hn-greenColor;
.panda-console-base-layout-slider-menu-item-text {
color: #fff;
}
}
.panda-console-base-layout-slider-menu-item-text {
color: #7c7c7a;
}
.panda-console-base-divider-horizontal {
border: none !important;
}
.panda-console-base-menu-item-children :global .panda-console-base-tabs-tab:hover svg path,
.panda-console-base-menu-item-children :global .panda-console-base-tabs-tab:hover svg rect,
.panda-console-base-menu-item-children :global .panda-console-base-tabs-tab:hover svg circle {
fill: @hn-greenColor !important;
stroke: @hn-greenColor !important;
}
.panda-console-base-menu-item-children :global .panda-console-base-tabs-tab:hover img {
filter: drop-shadow(10px 0px @hn-greenColor);
}
.panda-console-base-menu-item-children :global .panda-console-base-tabs-tab:hover .menu-item-name {
color: @hn-greenColor;
}
.panda-console-base-menu-item-children :global .panda-console-base-tabs-tab:hover .panda-console-base-tabs-tab-btn {
color: @hn-greenColor;
}
.panda-console-base-menu-item-children
:global
.panda-console-base-tabs-tab
.panda-console-base-tabs-tab-btn
.panda-console-base-dropdown-trigger
div
div {
width: 100%;
height: 100%;
}
.panda-console-base-menu-item-children .menu-item {
float: left;
}
.panda-console-base-menu-item-children :global(.panda-console-base-tabs-tab) {
display: flex !important;
}
.panda-console-base-menu-item-children :global(.panda-console-base-tabs-tab-btn) {
position: relative;
display: flex;
align-items: center;
color: #737983;
transform: scale(0.92);
}
.panda-console-base-menu-item-children
:global(.panda-console-base-tabs-tab.panda-console-base-tabs-tab-active .panda-console-base-tabs-tab-btn) {
color: @hn-greenColor !important;
}
.panda-console-base-menu-item-children :global(.panda-console-base-tabs-tab-btn > div > div) {
display: flex;
}
.panda-console-base-menu-item-children :global(.panda-console-base-tabs-nav::before) {
border-bottom: none !important;
}
.panda-console-base-menu-item-children .menu-item-name {
margin-left: 8px;
color: #737983;
transition: border-color 0.3s, color 0.3s, padding 0.1s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.panda-console-base-menu-item-children .menu-item-name:hover {
color: @hn-greenColor;
}
.panda-console-base-menu-item-children :global .panda-console-base-divider-vertical {
left: 20px;
margin: 0 1px !important;
}
.panda-console-base-menu-item-children :global .panda-console-base-tabs-nav-operations .ant-tabs-nav-more {
margin-right: 0px !important;
}
.panda-console-base-menu-item-children :global(.panda-console-base-tabs-ink-bar) {
background: @hn-greenColor !important;
}
.panda-console-base-menu-item-children :global(.panda-console-base-tabs-tab-active) {
color: @hn-greenColor !important;
}
.panda-console-base-menu-item-children
:global(.panda-console-base-tabs-tab-active .panda-pro-layouts-basic-layout-menu-item-name) {
color: @hn-greenColor !important;
}
.panda-console-base-menu-item-children :global .panda-console-base-tabs-tab-active svg path,
.panda-console-base-menu-item-children :global .panda-console-base-tabs-tab-active svg rect,
.panda-console-base-menu-item-children :global .panda-console-base-tabs-tab-active svg circle {
fill: @hn-greenColor !important;
stroke: @hn-greenColor !important;
}
.panda-console-base-menu-item-children :global .panda-console-base-tabs-tab-active img {
filter: drop-shadow(10px 0px @hn-greenColor);
}
.panda-console-base-panel-min-mainPane-visible {
background-color: #fff;
}
.panda-console-base-panel-min-mainPane-main-left .menu-categories .categorie-name span {
color: #737983;
}
.panda-console-base-panel-min-mainPane-main-left .menu-categories .categorie-name.active {
}
.panda-console-base-panel-min-mainPane-main-left .menu-categories .categorie-name.btn:hover span {
color: #333;
}
.panda-console-base-layout-slider-menu-item:hover span {
color: #333;
}
.panda-console-base-panel-min-mainPane-main-left .menu-categories .categorie-name.active {
background: none;
span {
color: @hn-greenColor;
}
}
.panda-console-base-pro-basicLayout-content {
margin: 0;
}
.panda-console-base-pro-sider-links {
position: fixed;
bottom: 0;
z-index: 999;
display: none;
width: 50px;
}
.panda-console-base-pro-sider-logo {
display: none;
}
.test-icon {
.my-svg {
width: 18px;
height: 18px;
display: inline-block;
}
.my-img {
width: 18px;
height: 18px;
display: inline-block;
}
&>span{
}
}
.panda-console-base-pro-menu-item-title {
display: inline-block;
overflow: hidden;
text-align: left;
text-overflow: ellipsis;
vertical-align: bottom;
}
.panda-console-base-menu-sub .panda-console-base-menu-item.panda-console-base-menu-item-only-child{
padding-left: 26px!important;
}
.panda-console-base-pro-sider .panda-console-base-layout-sider-children{
margin-top: 44px;
}
}
}
src/layouts/HNLayout.js 0 → 100644
View file @ 715215a2
This diff is collapsed.
src/routes/config.js
View file @ 715215a2
import LoadingComponent from '@wisdom-utils/components/lib/AppLayout/components/PageLoading';
import { dynamic } from '@wisdom-utils/runtime';
import BasicLayout from '../layouts/BasicLayout';
import BasicLayout from '../layouts/HNLayout';
import { UserLayout } from '@wisdom-utils/components/lib/AppLayout';
import BootPage from '../pages/bootpage';
import Iframe from '../pages/iframe';
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment