forked from Gitlink/forgeplus-react
修改头部及左侧栏
This commit is contained in:
parent
d1d9213527
commit
28bb01f3fe
|
@ -90,6 +90,7 @@ module.exports = {
|
|||
src: path.join(paths.appSrc),
|
||||
forge: path.join(paths.appSrc, 'forge'),
|
||||
military: path.join(paths.appSrc, 'military'),
|
||||
components: path.join(paths.appSrc, 'components'),
|
||||
// Support React Native Web
|
||||
// https://www.smashingmagazine.com/2016/08/a-glimpse-into-the-future-with-react-native-for-web/
|
||||
"react-native": "react-native-web",
|
||||
|
|
|
@ -106,52 +106,6 @@
|
|||
line-height: 1.6875em;
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
// 首页特定头部样式起
|
||||
|
||||
&.newHeaders {
|
||||
// background-color: #1a2358;
|
||||
background-color: #0037af;
|
||||
z-index: 1000;
|
||||
}
|
||||
.newFooter{
|
||||
background: inherit;
|
||||
}
|
||||
.head-nav {
|
||||
min-width: auto;
|
||||
}
|
||||
.head-nav ul#header-nav li a {
|
||||
font-size: 1em;
|
||||
color: #fff;
|
||||
}
|
||||
.head-nav ul#header-nav li:hover a,
|
||||
.head-nav ul#header-nav li.active a {
|
||||
color: #ffa13a;
|
||||
}
|
||||
.head-nav ul#header-nav li.active a::after {
|
||||
background-color: #ffa13a;
|
||||
}
|
||||
|
||||
.logoDiv img {
|
||||
min-width: 2.8125em;
|
||||
height: 2.8125em;
|
||||
}
|
||||
|
||||
.color-home {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.color-home:hover {
|
||||
color: #4154f1;
|
||||
}
|
||||
|
||||
.register-button {
|
||||
height: 3em;
|
||||
margin-left: 1.25em;
|
||||
padding: 0 1.5625em;
|
||||
font-size: 0.875em;
|
||||
}
|
||||
// 首页特定头部样式止
|
||||
}
|
||||
|
||||
// 波浪样式起
|
||||
|
|
|
@ -0,0 +1,148 @@
|
|||
|
||||
/**
|
||||
* 路由配置表
|
||||
* key:必填,唯一标识
|
||||
* name:必填,菜单名称
|
||||
* location:路由地址
|
||||
* icon:左侧图标
|
||||
* target:打开方式,参考HTML标签的target属性
|
||||
* urltype:路由类别,用于拓展其它项目管理菜单,self为在当前项目下跳转路由,main_web_site_url或其它为匹配setting中对应路参数径
|
||||
* children:子元素数组
|
||||
*/
|
||||
|
||||
export default [
|
||||
{
|
||||
"key": "task",
|
||||
"name": "创客空间",
|
||||
"location": "",
|
||||
"icon": "icon-jinggao",
|
||||
"target": "_self",
|
||||
"urltype": "self",
|
||||
"children": [{
|
||||
"key": "basics",
|
||||
"name": "基础数据",
|
||||
"location": "",
|
||||
"menustatus": "Y",
|
||||
"parentKey": 'task',
|
||||
"icon": "",
|
||||
"target": "_self",
|
||||
"urltype": "",
|
||||
"children": [ {
|
||||
"key": "categories",
|
||||
"name": "任务领域",
|
||||
"location": "/admin/categories/list",
|
||||
"menustatus": "Y",
|
||||
"parentKey": 'task',
|
||||
"icon": "",
|
||||
"target": "_self",
|
||||
"urltype": "main_web_site_url",
|
||||
"children": [],
|
||||
},{
|
||||
"key": "industries",
|
||||
"name": "行业信息",
|
||||
"location": "/managements/industries/list",
|
||||
"menustatus": "Y",
|
||||
"parentKey": 'task',
|
||||
"icon": "",
|
||||
"target": "_self",
|
||||
"urltype": "main_web_site_url",
|
||||
"children": [],
|
||||
},{
|
||||
"key": "placements",
|
||||
"name": "职位信息",
|
||||
"location": "/managements/placements/list",
|
||||
"menustatus": "Y",
|
||||
"parentKey": 'task',
|
||||
"icon": "",
|
||||
"target": "_self",
|
||||
"urltype": "main_web_site_url",
|
||||
"children": [],
|
||||
}],
|
||||
},
|
||||
{
|
||||
"key": "commission",
|
||||
"name": "代办事项",
|
||||
"location": "",
|
||||
"menustatus": "Y",
|
||||
"parentKey": 'task',
|
||||
"icon": "",
|
||||
"target": "_self",
|
||||
"urltype": "",
|
||||
"children": [{
|
||||
"key": "categories",
|
||||
"name": "延期任务处理",
|
||||
"location": "/managements/task/delayManage",
|
||||
"menustatus": "Y",
|
||||
"parentKey": 'task',
|
||||
"icon": "",
|
||||
"target": "_self",
|
||||
"urltype": "self",
|
||||
"children": [],
|
||||
},{
|
||||
"key": "industries",
|
||||
"name": "支付报酬凭证上传",
|
||||
"location": "/managements/task/payProof",
|
||||
"menustatus": "Y",
|
||||
"parentKey": 'task',
|
||||
"icon": "",
|
||||
"target": "_self",
|
||||
"urltype": "self",
|
||||
"children": [],
|
||||
}],
|
||||
},
|
||||
{
|
||||
"key": "placements",
|
||||
"name": "创客任务列表",
|
||||
"location": "/managements/task/taskAdmin",
|
||||
"menustatus": "Y",
|
||||
"parentKey": 'task',
|
||||
"icon": "",
|
||||
"target": "",
|
||||
"urltype": "self",
|
||||
"children": [],
|
||||
}
|
||||
],
|
||||
},
|
||||
{
|
||||
"key": "competition",
|
||||
"name": "竞赛活动",
|
||||
"location": "",
|
||||
"icon": "icon-ioon",
|
||||
"target": "_self",
|
||||
"urltype": "self",
|
||||
"children": [{
|
||||
"key": "competitionList",
|
||||
"name": "竞赛列表",
|
||||
"location": "/managements/competition/list",
|
||||
"menustatus": "Y",
|
||||
"parentKey": 'task',
|
||||
"icon": "",
|
||||
"target": "",
|
||||
"urltype": "self",
|
||||
"children": [],
|
||||
},
|
||||
{
|
||||
"key": "competitionRegion",
|
||||
"name": "赛区配置",
|
||||
"location": "/admin/competitions/region_zone_edit",
|
||||
"menustatus": "Y",
|
||||
"parentKey": 'task',
|
||||
"icon": "",
|
||||
"target": "_blank",
|
||||
"urltype": "main_web_site_url",
|
||||
"children": [],
|
||||
},
|
||||
{
|
||||
"key": "competitionExpert",
|
||||
"name": "竞赛评审列表",
|
||||
"location": "/managements/expert/competition",
|
||||
"menustatus": "Y",
|
||||
"parentKey": 'task',
|
||||
"icon": "",
|
||||
"target": "",
|
||||
"urltype": "self",
|
||||
"children": [],
|
||||
}
|
||||
],
|
||||
},
|
||||
]
|
|
@ -1,37 +1,74 @@
|
|||
import React, { useState ,useEffect } from 'react';
|
||||
import React, { useState, useEffect } from 'react';
|
||||
import { Link } from "react-router-dom";
|
||||
import { Menu,Icon, Dropdown, } from 'antd';
|
||||
import { Menu, Icon, Dropdown, } from 'antd';
|
||||
import urlConfig from './config';
|
||||
|
||||
import './index.scss';
|
||||
|
||||
const { SubMenu } = Menu;
|
||||
|
||||
export default (props) => {
|
||||
|
||||
const {current_user,history}=props;
|
||||
const main_web_site_url =localStorage.chromesetting&& JSON.parse(localStorage.chromesetting).main_web_site_url;
|
||||
const current_main_site_url =localStorage.chromesetting&& JSON.parse(localStorage.chromesetting).current_main_site_url;
|
||||
const noticeUrl =localStorage.chromesetting&& JSON.parse(localStorage.chromesetting).api_urls.notice;
|
||||
useEffect(()=>{
|
||||
sessionStorage.setItem('current_user',JSON.stringify(current_user));
|
||||
},[current_user.login]);
|
||||
|
||||
const { current_user, history } = props;
|
||||
const setting = localStorage.chromesetting && JSON.parse(localStorage.chromesetting) ||{};
|
||||
const main_web_site_url = localStorage.chromesetting && JSON.parse(localStorage.chromesetting).main_web_site_url;
|
||||
useEffect(() => {
|
||||
sessionStorage.setItem('current_user', JSON.stringify(current_user));
|
||||
}, [current_user.login]);
|
||||
|
||||
const [current,setCurrent]=useState(JSON.parse(sessionStorage.adminRouter||'[]'));
|
||||
const [title,setTitle]=useState('');
|
||||
|
||||
function handleClick (e){
|
||||
const [current, setCurrent] = useState(JSON.parse(sessionStorage.adminRouter || '[]'));
|
||||
const [title, setTitle] = useState('');
|
||||
|
||||
function handleClick(e) {
|
||||
setCurrent([e.key]);
|
||||
setTitle(e.item.props.title);
|
||||
sessionStorage.setItem( 'adminRouter',JSON.stringify([e.key]));
|
||||
// setTitle(e.item.props.title);
|
||||
// sessionStorage.setItem( 'adminRouter',JSON.stringify([e.key]));
|
||||
};
|
||||
|
||||
|
||||
function getMenuList(menus) {
|
||||
return menus.map(function (item) {
|
||||
if (Array.isArray(item.children) && item.children.length > 0) {
|
||||
let list = [];
|
||||
let title = (<span><i className={'left-icon iconfont ' + item.icon}></i><span>{item.name}</span></span>);
|
||||
item.children.map((it) => {
|
||||
list.push(<Menu.Item key={it.key} >
|
||||
{
|
||||
it.urltype == "self" ? <Link target={item.target} to={it.location}>{it.name}</Link>
|
||||
: <a target={it.target} href={`${setting[it.urltype] + it.location}`}>{it.name}</a>
|
||||
}
|
||||
</Menu.Item>)
|
||||
});
|
||||
|
||||
return (
|
||||
<SubMenu key={item.key} children={item.children} title={title}>
|
||||
{list}
|
||||
</SubMenu>
|
||||
)
|
||||
}
|
||||
else {
|
||||
return (
|
||||
<Menu.Item title={item.name} key="payProof"><Link target={item.target} to={item.location}>{item.name}</Link></Menu.Item>
|
||||
)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
return (
|
||||
<div className="layouts">
|
||||
<Menu
|
||||
<Menu mode="inline"
|
||||
defaultSelectedKeys={['1']}
|
||||
defaultOpenKeys={['sub1']}
|
||||
defaultOpenKeys={['task']}
|
||||
mode="inline"
|
||||
onClick={handleClick}
|
||||
>
|
||||
{getMenuList(urlConfig)}
|
||||
</Menu>
|
||||
{/* <Menu
|
||||
defaultSelectedKeys={['1']}
|
||||
defaultOpenKeys={['task']}
|
||||
mode="inline"
|
||||
>
|
||||
<SubMenu
|
||||
|
@ -48,7 +85,6 @@ export default (props) => {
|
|||
<Menu.Item key="7" onClick={() => { history.push('/activity') }}>项目活跃度统计</Menu.Item>
|
||||
</SubMenu>
|
||||
|
||||
|
||||
<SubMenu
|
||||
key="task"
|
||||
title={
|
||||
|
@ -59,12 +95,12 @@ export default (props) => {
|
|||
}
|
||||
>
|
||||
<SubMenu title="基础数据" >
|
||||
<Menu.Item><a href={`${main_web_site_url}/admin/categories/list`}>任务领域</a></Menu.Item>
|
||||
<Menu.Item><a href={`${main_web_site_url}/admin/industries/list`}>行业信息</a></Menu.Item>
|
||||
<Menu.Item><a href={`${main_web_site_url}/admin/placements/list`}>职位信息</a></Menu.Item>
|
||||
<Menu.Item><a href={`${main_web_site_url}/admin/task_templates/list`}>需求导入模板</a></Menu.Item>
|
||||
<Menu.Item><a href={`${main_web_site_url}/admin/agreement_setting`}>签订协议内容</a></Menu.Item>
|
||||
<Menu.Item><a href={`${main_web_site_url}/admin/sign_agreement_setting`}>应征投稿协议内容</a></Menu.Item>
|
||||
<Menu.Item key="categories"><a href={`${main_web_site_url}/admin/categories/list`}>任务领域</a></Menu.Item>
|
||||
<Menu.Item key="industries"><a href={`${main_web_site_url}/admin/industries/list`}>行业信息</a></Menu.Item>
|
||||
<Menu.Item key="placements"><a href={`${main_web_site_url}/admin/placements/list`}>职位信息</a></Menu.Item>
|
||||
<Menu.Item key="task_templates"><a href={`${main_web_site_url}/admin/task_templates/list`}>需求导入模板</a></Menu.Item>
|
||||
<Menu.Item key="agreement_setting"><a href={`${main_web_site_url}/admin/agreement_setting`}>签订协议内容</a></Menu.Item>
|
||||
<Menu.Item key="sign_agreement_setting"><a href={`${main_web_site_url}/admin/sign_agreement_setting`}>应征投稿协议内容</a></Menu.Item>
|
||||
</SubMenu>
|
||||
<SubMenu title="代办事项" >
|
||||
<Menu.Item title="task" key="delayManage"><Link to="/managements/task/delayManage">延期任务处理</Link></Menu.Item>
|
||||
|
@ -73,7 +109,7 @@ export default (props) => {
|
|||
<Menu.Item title="task" key="taskAdmin"><Link to="/managements/task/taskAdmin">创客任务列表</Link></Menu.Item>
|
||||
</SubMenu>
|
||||
|
||||
</Menu>
|
||||
</Menu> */}
|
||||
</div>
|
||||
|
||||
);
|
||||
|
|
|
@ -1,10 +1,19 @@
|
|||
|
||||
.layouts {
|
||||
background: #aaa;
|
||||
position: fixed;
|
||||
top: 70px;
|
||||
bottom: 107px;
|
||||
left:0;
|
||||
width: 10vw;
|
||||
width: 13.75rem;
|
||||
overflow: hidden;
|
||||
overflow-y: scroll;
|
||||
&::-webkit-scrollbar{
|
||||
width: 0;
|
||||
}
|
||||
.left-icon{
|
||||
font-size: 1.25rem;
|
||||
margin-right: .625rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 600px) {
|
||||
|
|
|
@ -1,5 +1,13 @@
|
|||
.managements{
|
||||
.centerbox{
|
||||
margin-left: 10vw;
|
||||
margin-left: 13.75rem;
|
||||
}
|
||||
}
|
||||
|
||||
// 系统默认字体大小是16px,大屏的在此基础上增大字体
|
||||
@media screen and (min-width: 1921px) {
|
||||
html{
|
||||
font-size: calc(100% + 6 * (100vw - 1920px) / 1000 );
|
||||
font-size: calc(100% + 6 * (100vw - 1920px) / 1000 );
|
||||
}
|
||||
}
|
|
@ -638,7 +638,7 @@ class NewHeader extends Component {
|
|||
goshowqqgtounp,
|
||||
visible,
|
||||
} = this.state;
|
||||
let activeIndex =match.path === '/'?true: '';
|
||||
let activeIndex =match.path === '/' || (match.path&&match.path.startsWith('/managements'))?true: '';
|
||||
let headtypes = '/';
|
||||
if (settings) {
|
||||
if (settings.navbar) {
|
||||
|
|
|
@ -14,3 +14,47 @@
|
|||
.login-box{
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
/* 新版首页头部样式 */
|
||||
.homePage.newHeaders {
|
||||
background-color: #0037af;
|
||||
z-index: 1000;
|
||||
}
|
||||
.homePage .newFooter{
|
||||
background: inherit;
|
||||
}
|
||||
.homePage .head-nav {
|
||||
min-width: auto;
|
||||
}
|
||||
.homePage .head-nav ul#header-nav li a {
|
||||
font-size: 1em;
|
||||
color: #fff;
|
||||
}
|
||||
.homePage .head-nav ul#header-nav li:hover a,
|
||||
.homePage .head-nav ul#header-nav li.active a {
|
||||
color: #ffa13a;
|
||||
}
|
||||
.homePage .head-nav ul#header-nav li.active a::after {
|
||||
background-color: #ffa13a;
|
||||
}
|
||||
|
||||
.homePage .logoDiv img {
|
||||
min-width: 2.8125em;
|
||||
height: 2.8125em;
|
||||
}
|
||||
|
||||
.homePage .color-home {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.homePage .color-home:hover {
|
||||
color: #4154f1;
|
||||
}
|
||||
|
||||
.homePage .register-button {
|
||||
height: 3em;
|
||||
margin-left: 1.25em;
|
||||
padding: 0 1.5625em;
|
||||
font-size: 0.875em;
|
||||
}
|
||||
/* 新版首页头部样式 */
|
||||
|
|
Loading…
Reference in New Issue