Skip to content

C
CivWeb
Commit 118764ae authored by 曾婧's avatar 曾婧
Browse files
Options

fix: 华农菜单栏

parent 414052e4
Show whitespace changes
Inline Side-by-side
Showing with 102 additions and 33 deletions
src/layouts/AppLayout/components/SlideMenu/index.js
View file @ 118764ae
......@@ -19,7 +19,7 @@ const Menu = props => {
const { prefixCls, collapsed, onCollapse, onMenuClick, menuHeaderRender, onMenuHeaderClick } = props;
const { route } = props;
const history = useHistory();
const [activeMenu, setActiveMenu] = useState('首页');
const [activeMenu, setActiveMenu] = useState("首页");
const [sunRoute, setsunRoute] = useState(route);
const [selectIndex, setSelectIndex] = useMergedState(() => -1, {
value: props.active,
......@@ -55,6 +55,16 @@ const Menu = props => {
}
onMenuClick && onMenuClick(current, childrenRoutes, index);
};
useEffect(() => {
let all=props.flatMenu;
all.forEach((it)=>{
if(it.path===props.location.pathname){
setActiveMenu(it.name)
return;
}
})
}, [props.location.pathname]);
useEffect(() => {
if (route && route.routes) {
setsunRoute(route);
......@@ -120,7 +130,9 @@ const Menu = props => {
[`hight-active`]: item.name === activeMenu,
})}
>
{item.extData.icon=='1'?(<span></span>):/.svg/.test(item.extData.icon) ? (
{item.extData.icon == '1' ? (
<span />
) : /.svg/.test(item.extData.icon) ? (
<div className="my-svg">
<ReactSVG src={item.extData.icon} style={{ width: '100%', height: '100%' }} />
</div>
......@@ -138,11 +150,13 @@ const Menu = props => {
}
subMenuItemRender={(item, dom) => (
<div className={classNames(`test-icon`)}>
{item.extData.icon=='1'?(<span></span>):/.svg/.test(item.extData.icon) ? (
{item.extData.icon == '1' ? (
<span />
) : /.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>
......
src/layouts/AppLayout/components/TopNavHeader/index.js
View file @ 118764ae
......@@ -107,7 +107,7 @@ const Index = props => {
<>
{item.icon ? (
item.icon
) : item.extData && item.extData.icon == '1' ? (
) : item.extData && item.extData.icon === '1' ? (
<span />
) : /.svg/.test(item.extData.icon) ? (
<ReactSVG src={item.extData.icon} style={{ width: '18px', height: '18px' }} />
......
src/layouts/AppLayout/layouts/BasicLayout.js
View file @ 118764ae
......@@ -20,6 +20,8 @@ import RouteContext from '@wisdom-utils/components/lib/AppLayout/layouts/RouteCo
import { getPageTitleInfo } from '@wisdom-utils/components/lib/AppLayout/layouts/getPageTitle';
import omit from 'omit.js';
import classNames from 'classnames';
import { connect } from 'react-redux';
import { withRouter } from '@wisdom-utils/runtime';
import useDocumentTitle from '@wisdom-utils/components/lib/AppLayout/layouts/hooks/useDocumentTitle';
import defaultSettings from '@wisdom-utils/components/lib/AppLayout/layouts/defaultSettings';
import isBrowser from '@wisdom-utils/components/lib/AppLayout/layouts/utils/isBrowser';
......@@ -87,7 +89,7 @@ const renderSiderMenu = (props) => {
if (menuRender === false) {
return null;
}
const defaultDom = <SlideMenu {...props} />;
const defaultDom = <SlideMenu {...props}/>;
if (menuRender) {
return menuRender(props, defaultDom);
......@@ -259,6 +261,25 @@ const BasicLayout = (props) => {
setCurrentRoute(newRoutes);
}
}, [route, currentMenuIndex]);
useEffect(() => {
let all=props.flatMenu;
let currentObj;
all.forEach((it)=>{
if(it.path===props.location.pathname){
currentObj=it;
setSubRoutes([
{
extData: currentObj.extData,
path: `${currentObj.path}`,
name: `${currentObj.name}`,
},
]);
setTabActiveKey(currentObj.path);
return;
}
})
}, [props.location.pathname]);
useEffect(() => {
const initSelectRoute = findPathByLeafId(
......@@ -362,23 +383,31 @@ const BasicLayout = (props) => {
}, []);
useEffect(() => {
if (selectIndex !== -1 && currentRoute && currentRoute.hasOwnProperty('routes')) {
const routes = currentRoute.routes[selectIndex];
if (routes) {
if (routes && routes.routes) {
const route =
routes &&
routes.routes &&
routes.routes.find(
(item) => item.path === decodeURI(window.location.pathname.replace('/civbase', '')),
);
if (route && route.path) {
setTabActiveKey(route.path);
}
}
}
}
onPageChange && onPageChange(props.location);
// if (selectIndex !== -1 && currentRoute && currentRoute.hasOwnProperty('routes')) {
// const routes = currentRoute.routes[selectIndex];
// setSubRoutes([
// {
// icon: currentObj.extData.icon,
// path: `${currentObj.path}`,
// name: `${currentObj.name}`,
// },
// ]);
// if (routes) {
// if (routes && routes.routes) {
// const route =
// routes &&
// routes.routes &&
// routes.routes.find(
// (item) => item.path === decodeURI(window.location.pathname.replace('/civbase', '')),
// );
// if (route && route.path) {
// console.log('route000000000',route)
// setTabActiveKey(route.path);
// }
// }
// }
// }
// onPageChange && onPageChange(props.location);
}, [props.location, location.pathname.search]);
useDocumentTitle(pageTitleInfo, props.title || false);
......@@ -470,5 +499,29 @@ BasicLayout.defaultProps = {
...defaultSettings,
location: isBrowser() ? window.location : undefined,
};
export default BasicLayout;
const mapStateToProps = state => ({
flatMenu: state.getIn(['global', 'flatMenu']),
menu: state.getIn(['global', 'menu']),
recentKeywords: state.getIn(['global', 'recentKeywords']),
recentVisited: state.getIn(['global', 'recentVisited']),
recentProducts: state.getIn(['global', 'recentProducts']),
});
const mapDispatchToProps = dispatch => ({
updateConfig(config) {
dispatch(actionCreators.getConfig(config));
},
createContext(data) {
dispatch(actionCreators.createContext(data));
},
updateLoginMode(mode) {
dispatch(actionCreators.changeLoginMode(mode));
},
updateCurrentIndex(index) {
dispatch(actionCreators.updateCurrentIndex(index));
},
});
export default connect(
mapStateToProps,
mapDispatchToProps,
)(withRouter(BasicLayout));
\ No newline at end of file
src/layouts/HN.less
View file @ 118764ae
......@@ -250,7 +250,7 @@
margin-bottom: 0!important;
.test-icon{
margin-left: 20px;
padding-left: 20px!important;
padding:0 10px!important;
}
.@{ant-prefix}-menu-title-content{
......@@ -293,13 +293,12 @@
}
.test-icon{
margin-left: 20px;
padding-left: 20px!important;
padding:10px 0!important;
}
}
}
}
.test-icon {
width: 100%;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
......@@ -335,12 +334,11 @@
}
}
.my-desc {
margin-left: 4px;
margin-left: 2px;
color: #7c7c7a;
}
}
.test-icon:hover{
color: @hn-greenColor;
.my-desc {
color: @hn-greenColor;
}
......@@ -352,7 +350,6 @@
}
}
.hight-active:hover{
color: #fff;
.my-desc {
color: #fff;
}
......@@ -378,10 +375,14 @@
text-overflow: ellipsis;
vertical-align: bottom;
}
.@{ant-prefix}-menu-submenu-title{
padding-right: 14px!important;
}
.ant-menu-submenu-title{
padding-right: 14px!important;
}
.hight-active {
color: #fff;
background: @hn-greenColor;
// background: #00b278;
border-radius: 5px;
.my-desc {
color: #fff;
......
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