增加特色专区下拉项

This commit is contained in:
caishi 2024-04-25 09:51:12 +08:00
parent 9a425358c6
commit 1bcf07b20c
6 changed files with 129 additions and 54 deletions

View File

@ -8,11 +8,11 @@ const paths = require('./paths');
delete require.cache[require.resolve('./paths')];
const NODE_ENV = process.env.NODE_ENV;
if (!NODE_ENV) {
throw new Error(
'The NODE_ENV environment variable is required but was not specified.'
);
}
// if (!NODE_ENV) {
// throw new Error(
// 'The NODE_ENV environment variable is required but was not specified.'
// );
// }
// https://github.com/bkeepers/dotenv#what-other-env-files-can-i-use
var dotenvFiles = [

View File

@ -1,6 +1,6 @@
{
"name": "educoder",
"version": "0.1.0",
"name": "luntan",
"version": "1.1.0",
"private": true,
"dependencies": {
"@monaco-editor/react": "^2.3.0",
@ -118,7 +118,7 @@
},
"scripts": {
"start": "node --max_old_space_size=15360 scripts/start.js",
"build": "NODE_ENV=production node --max_old_space_size=15360 scripts/build.js",
"build": "node --max_old_space_size=15360 scripts/build.js",
"test-build": "NODE_ENV=testBuild node --max_old_space_size=15360 scripts/build.js",
"pre-build": "NODE_ENV=preBuild node --max_old_space_size=15360 scripts/build.js",
"gen_stats": "NODE_ENV=production webpack --profile --config=./config/webpack.config.prod.js --json > stats.json",

View File

@ -38,7 +38,7 @@
box-sizing: border-box;
}
.head-nav ul#header-nav li {
.head-nav ul#header-nav > li {
float: left;
height: 60px;
line-height: 60px;
@ -48,57 +48,57 @@
font-size: 16px
}
.head-nav ul#header-nav li a {
.head-nav ul#header-nav > li a {
display: block;
height: 100%;
width: 100%;
color: #fff
}
.head-nav ul#header-nav li a:hover {
.head-nav ul#header-nav > li a:hover {
color: #cccccc;
}
.head-nav ul#header-nav li:last-child {
.head-nav ul#header-nav > li:last-child {
margin-right: 0px
}
.head-nav ul#header-nav li.active a {
.head-nav ul#header-nav > li.active a {
color: #459be5 !important;
}
.head-nav ul#header-nav li.active p {
.head-nav ul#header-nav > li.active p {
color: #459be5 !important;
}
.head-nav ul#header-nav li p:hover {
.head-nav ul#header-nav > li p:hover {
color: #cccccc;
}
.head-nav ul#header-nav li p {
.head-nav ul#header-nav > li p {
display: block;
height: 100%;
width: 100%;
color: #fff
}
.head-nav ul#header-nav li.active div ul li a {
.head-nav ul#header-nav > li.active div ul li a {
color: #000 !important;
}
.head-nav ul#header-nav li.active div ul li a:hover {
.head-nav ul#header-nav > li.active div ul li a:hover {
color: #FFF !important;
}
.head-nav ul#header-nav li.active ul li a {
.head-nav ul#header-nav > li.active ul li a {
color: #000 !important;
}
.head-nav ul#header-nav li.active ul li a:hover {
.head-nav ul#header-nav > li.active ul li a:hover {
color: #FFF !important;
}
.head-nav ul#header-nav li.active:after {
.head-nav ul#header-nav > li.active:after {
content: '';
position: absolute;
left: 0px;

View File

@ -3997,7 +3997,7 @@ html>body #ajax-indicator {
box-sizing: border-box;
}
.head-nav ul#header-nav li {
.head-nav ul#header-nav > li {
float: left;
height: 58px;
line-height: 58px;
@ -4007,7 +4007,7 @@ html>body #ajax-indicator {
padding:0px 20px;
}
.head-nav ul#header-nav li a {
.head-nav ul#header-nav > li a {
display: block;
height: 100%;
width: 100%;
@ -4015,24 +4015,24 @@ html>body #ajax-indicator {
font-size: 16px;
}
.head-nav ul#header-nav li a:hover,.head-nav ul#header-nav li.active a {
.head-nav ul#header-nav > li a:hover,.head-nav ul#header-nav > li.active a {
color: #5091FF;
}
.head-nav ul#header-nav li:last-child {
.head-nav ul#header-nav > li:last-child {
margin-right: 0px
}
.head-nav ul#header-nav li.active{
.head-nav ul#header-nav > li.active{
/* background-color: #3B3B3B; */
}
.head-nav ul#header-nav li p:hover {
.head-nav ul#header-nav > li p:hover {
color: #cccccc;
}
.head-nav ul#header-nav li p {
.head-nav ul#header-nav > li p {
display: block;
height: 100%;
width: 100%;

View File

@ -14,11 +14,9 @@ import 'antd/lib/input/style/index.css';
import './TPMIndex.css';
import logo from './images/logo.png';
let old_url ;
const $ = window.$
// TODO 这部分脚本从公共脚本中直接调用
const { Search } = Input;
let old_url;
const gitlinkUrl = `https://www.gitlink.org.cn`;
window._header_componentHandler = null;
class NewHeader extends Component {
constructor(props) {
@ -48,7 +46,9 @@ class NewHeader extends Component {
mygetHelmetapi2: null,
goshowqqgtounp: false,
visiblemyss: false,
navbar: []
navbar: [],
showSubMenu:false,
zoneList:[]
}
}
componentDidMount() {
@ -81,6 +81,27 @@ class NewHeader extends Component {
try {
window.sessionStorage.setItem("yslgeturls", JSON.stringify(window.location.href))
} catch (e) {}
this.getZoneList()
}
// 获取专区下拉
getZoneList = () =>{
const url = `https://gateway.gitlink.org.cn/api/zone/open/list`
axios.get(url).then((response) => {
if (response && response.data && response.data.data && response.data.data.length > 0) {
let newArray = [];
response.data.data.forEach((e, i) => {
newArray[i] = {
name: e.name,
link: `/zone/${e.key}`
}
});
this.setState({ zoneList: newArray })
} else {
}
}).catch((error) => {
});
}
openNotification = (messge) => {
@ -644,6 +665,8 @@ class NewHeader extends Component {
isRender,
mygetHelmetapi2,
goshowqqgtounp,
zoneList,
showSubMenu,
navbar
} = this.state;
@ -685,30 +708,48 @@ class NewHeader extends Component {
{
navbar && navbar.map((item, key) => {
var new_link = item.link;
var user_login = this.props.user && this.props.user.login;
// var user_login = this.props.user && this.props.user.login;
var is_hidden = item.hidden
if (new_link && (new_link.indexOf("courses") > -1 || new_link.indexOf("contests") > -1)) {
if (user_login) {
if (new_link.indexOf("courses") > -1) {
new_link = new_link.replace(/courses/g, "users/" + user_login + "/courses")
} else if (new_link.indexOf("contests") > -1) {
new_link = new_link.replace(/contests/g, "users/" + user_login + "/contests")
}
} else {
is_hidden = true
}
}
if (user_login && (new_link && new_link.indexOf("homes") > -1)) {
new_link = new_link.replace(/homes/g, "users/" + user_login + "/user_activities")
}
// if (new_link && (new_link.indexOf("courses") > -1 || new_link.indexOf("contests") > -1)) {
// if (user_login) {
// if (new_link.indexOf("courses") > -1) {
// new_link = new_link.replace(/courses/g, "users/" + user_login + "/courses")
// } else if (new_link.indexOf("contests") > -1) {
// new_link = new_link.replace(/contests/g, "users/" + user_login + "/contests")
// }
// } else {
// is_hidden = true
// }
// }
// if (user_login && (new_link && new_link.indexOf("homes") > -1)) {
// new_link = new_link.replace(/homes/g, "users/" + user_login + "/user_activities")
// }
if (item.name === '特色专区') {
is_hidden = true
return(
// 特色专区下拉菜单
zoneList && zoneList.length > 0 ? <li
className={`drop-li`}
onMouseOver={ () => { this.setState( {showSubMenu: true }) } }
onMouseOut={ () => { this.setState( {showSubMenu: false }) } }
>
<a onClick={ () => { this.setState( {showSubMenu: true }) } }>特色专区</a>
<ul className={ `drop-down ${ showSubMenu ? 'drop-down-show' : '' }` } style={{ height : showSubMenu ? `${ current_user && current_user.login ? ((zoneList.length+1) * 46) : (zoneList.length * 46)}px` : 0 }}>
{
zoneList.map((e, k) => {
return <li className="drop-down-item" key={ k }><a href={ `${gitlinkUrl}${e.link}` } className="task-hide" title={ e.name } target="_blank">{ e.name }</a></li>
})
}
{current_user && current_user.login && <li className="drop-down-item"><a href={`${gitlinkUrl}/zone/apply`} target="_blank">+申请创建</a></li> }
</ul>
</li> : ''
)
}else{
return (
<li key={key} onClick={() => this.headtypesonClick(item.link, true)} className={`${this.matchpaths(item.link) === true ? 'pr active' : 'pr'}`} style={!is_hidden ? { display: 'flex' } : { display: 'none' }}>
<a href={new_link}>{item.name}</a>
</li>
)
}
return (
<li key={key} onClick={() => this.headtypesonClick(item.link, true)} className={`${this.matchpaths(item.link) === true ? 'pr active' : 'pr'}`} style={!is_hidden ? { display: 'flex' } : { display: 'none' }}>
<a href={new_link}>{item.name}</a>
</li>
)
})
}
</ul>

View File

@ -413,4 +413,38 @@ body>.-task-title {
.progress-container {
flex: 1 0 0;
margin-left: 20px;
}
.drop-li {
display: flex;
flex-direction: column;
align-items: center;
}
.drop-li .drop-down {
position: fixed;
top: 58px;
background-color: #ffffff;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
transition: height 0.2s ease-in-out;
overflow: hidden;
box-shadow:0px 0px 6px rgba(6, 44, 107, 0.15);
}
.drop-li .drop-down .drop-down-item {
height: 46px !important;
line-height: 46px !important;
padding-right:unset;
position: relative;
padding:0px 20px;
}
.head-nav .drop-li .drop-down .drop-down-item:hover {
background-color: #ebf0ff;
}
.drop-li .drop-down .drop-down-item a {
color: #252b3a !important;
display: inline-block;
height: 100%;
max-width: 160px;
}
.drop-li .drop-down .drop-down-item a &:hover {
background-color: #ebf0ff;
}