forked from Gitlink/forgeplus-react
cherry-pick头部
This commit is contained in:
parent
c20332b7a3
commit
36d20c5250
|
@ -63,45 +63,64 @@ const Management = Loadable({
|
|||
})
|
||||
|
||||
const Qz2022 = (props) => {
|
||||
const {history, current_user} = props;
|
||||
const {location} = history;
|
||||
const {pathname} = location;
|
||||
const { history, current_user } = props;
|
||||
const { location } = history;
|
||||
const { pathname } = location;
|
||||
const [active, setActive] = useState();
|
||||
const [reload, setReload] = useState();
|
||||
const [reloadDetail, setReloadDetail] = useState();
|
||||
const [qzDetail, setQzDetail] = useState();
|
||||
const [enrollStatus, setEnrollStatus] = useState();
|
||||
|
||||
const [fixedTop, setFixedTop] = useState('');
|
||||
|
||||
const menu = (
|
||||
<Menu>
|
||||
<Menu.Item>
|
||||
<Link to={{ pathname: current_user && current_user.login ? `/competition/qz2022/management/applys` :'' }} onClick={()=>{current_user && !current_user.login && props.showLoginDialog()}}>报名列表</Link>
|
||||
<Link to={{ pathname: current_user && current_user.login ? `/competition/qz2022/management/applys` : '' }} onClick={() => { current_user && !current_user.login && props.showLoginDialog() }}>报名列表</Link>
|
||||
</Menu.Item>
|
||||
<Menu.Item>
|
||||
<Link to={{ pathname: current_user && current_user.login ? `/competition/qz2022/management/production` :'' }} onClick={()=>{current_user && !current_user.login && props.showLoginDialog()}}>作品列表</Link>
|
||||
<Link to={{ pathname: current_user && current_user.login ? `/competition/qz2022/management/production` : '' }} onClick={() => { current_user && !current_user.login && props.showLoginDialog() }}>作品列表</Link>
|
||||
</Menu.Item>
|
||||
</Menu>
|
||||
);
|
||||
|
||||
useEffect(()=>{
|
||||
setActive(pathname.substring(pathname.lastIndexOf('/')+1, pathname.lenght));
|
||||
useEffect(() => {
|
||||
setActive(pathname.substring(pathname.lastIndexOf('/') + 1, pathname.lenght));
|
||||
// document.body.scrollTop = 0;
|
||||
// window.scrollTo(0,0);
|
||||
}, [pathname])
|
||||
}, [pathname]);
|
||||
|
||||
useEffect(()=>{
|
||||
useEffect(() => {
|
||||
window.addEventListener("scroll", scrollListener, false);
|
||||
return () => {
|
||||
window.removeEventListener("scroll", scrollListener, false);
|
||||
}
|
||||
}, []);
|
||||
|
||||
function scrollListener() {
|
||||
let qz2022Top = document.querySelector('.qz2022').offsetTop;
|
||||
let top = document.documentElement.scrollTop;
|
||||
if (!fixedTop && top > qz2022Top - 20) {
|
||||
setFixedTop('fixed-top');
|
||||
} else if (top < qz2022Top - 19) {
|
||||
setFixedTop('');
|
||||
}
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
// 获取启智2022详情
|
||||
getQz2022().then(response=>{
|
||||
if(response && response.status===200){
|
||||
getQz2022().then(response => {
|
||||
if (response && response.status === 200) {
|
||||
setQzDetail(response.data.data);
|
||||
}
|
||||
})
|
||||
}, [reloadDetail])
|
||||
|
||||
useEffect(()=>{
|
||||
useEffect(() => {
|
||||
// 获取用户参与竞赛状态
|
||||
userCompetitionStatus('qz2022').then(response=>{
|
||||
if(response && response.status === 200){
|
||||
userCompetitionStatus('qz2022').then(response => {
|
||||
if (response && response.status === 200) {
|
||||
setEnrollStatus(response.data.data);
|
||||
}
|
||||
})
|
||||
|
@ -110,19 +129,19 @@ const Qz2022 = (props) => {
|
|||
let applyStatus; // 是否处于报名阶段
|
||||
let referStatus; // 是否处于提交作品阶段
|
||||
let referEnd; // 是否处于提交作品阶段(提交已经结束)
|
||||
if(qzDetail){
|
||||
if (qzDetail) {
|
||||
applyStatus = Date.parse(new Date()) < Date.parse(new Date(qzDetail.enroll_date));
|
||||
referStatus = !applyStatus && Date.parse(new Date()) < Date.parse(new Date(qzDetail.upload_date));
|
||||
referEnd = Date.parse(new Date()) > Date.parse(new Date(qzDetail.upload_date));
|
||||
}
|
||||
|
||||
function goToRefer(){
|
||||
if(current_user && !current_user.login){
|
||||
function goToRefer() {
|
||||
if (current_user && !current_user.login) {
|
||||
props.showLoginDialog();
|
||||
}else if(enrollStatus && !enrollStatus.enroll_status){
|
||||
props.showNotification("您还未报名竞赛!");
|
||||
}else{
|
||||
!referStatus ? props.showNotification(!referEnd ? `竞赛尚未开始提交作品,提交作品开始时间为:${qzDetail && qzDetail.enroll_date.substring(0,10)}` :"比赛已结束"):"";
|
||||
} else {
|
||||
!referStatus ? props.showNotification(!referEnd ? `竞赛尚未开始提交作品,提交作品开始时间为:${qzDetail && qzDetail.enroll_date.substring(0, 10)}` : "比赛已结束") : "";
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -151,43 +170,44 @@ const Qz2022 = (props) => {
|
|||
{/* <li className={active === "apply" ? "active" : ""}>
|
||||
<Link to={{ pathname: '/competition/qz2022/apply'}}>参赛报名</Link>
|
||||
</li> */}
|
||||
{/* <li className={active === "refer" ? "active" : ""}>
|
||||
{/* <li className={active === "refer" ? "active" : ""}>
|
||||
<Link to={{ pathname: `/competition/qz2022/refer`}}>提案提交</Link>
|
||||
</li> */}
|
||||
<li className={active === "statistics" ? "active" : ""}>
|
||||
<Link to={{ pathname: `/competition/qz2022/statistics` }}>数据统计</Link>
|
||||
</li>
|
||||
<li className={active === "chat" ? "active" : ""}>
|
||||
<Link to={{ pathname: `/competition/qz2022/chat` }}>交流互动</Link>
|
||||
</li>
|
||||
<li className={active === "contact" ? "active" : ""}>
|
||||
<Link to={{ pathname: `/competition/qz2022/contact` }}>联系我们</Link>
|
||||
</li>
|
||||
{qzDetail && qzDetail.is_manager && <li className={(active === "applys" || active === "production") ? "active" : ""}>
|
||||
<Popover content={menu} placement="bottomRight" overlayClassName="qz_manage">
|
||||
<a>后台管理</a>
|
||||
</Popover>
|
||||
</li>}
|
||||
</ul>}
|
||||
{paths.indexOf(active) !== -1 && <div className="menu_border mt20 qz_main"></div>}
|
||||
<li className={active === "statistics" ? "active" : ""}>
|
||||
<Link to={{ pathname: `/competition/qz2022/statistics` }}>数据统计</Link>
|
||||
</li>
|
||||
<li className={active === "chat" ? "active" : ""}>
|
||||
<Link to={{ pathname: `/competition/qz2022/chat` }}>交流互动</Link>
|
||||
</li>
|
||||
<li className={active === "contact" ? "active" : ""}>
|
||||
<Link to={{ pathname: `/competition/qz2022/contact` }}>联系我们</Link>
|
||||
</li>
|
||||
{qzDetail && qzDetail.is_manager && <li className={(active === "applys" || active === "production") ? "active" : ""}>
|
||||
<Popover content={menu} placement="bottomRight" overlayClassName="qz_manage">
|
||||
<a>后台管理</a>
|
||||
</Popover>
|
||||
</li>}
|
||||
</ul>}
|
||||
{paths.indexOf(active) !== -1 && <div className="menu_border mt20 qz_main"></div>}
|
||||
{/* </div> */}
|
||||
<Spin spinning={false} wrapperClassName="spinstyle qzCont" tip="正在同步镜像" size="large">
|
||||
<Switch {...props}>
|
||||
{/* 通知公告详情页 */}
|
||||
<Route path="/competition/qz2022/notice/detail/:noticeId"
|
||||
render={
|
||||
({match,history}) => (<NoticeDetail match={match} history={history}/>)
|
||||
({ match, history }) => (<NoticeDetail match={match} history={history} />)
|
||||
}
|
||||
></Route>
|
||||
{/* 通知公告编辑页 */}
|
||||
<Route path="/competition/qz2022/notice/:type/:noticeId"
|
||||
render={
|
||||
({match}) => (<NoticeEdit {...props} match={match}/>)
|
||||
({ match }) => (<NoticeEdit {...props} match={match} />)
|
||||
}
|
||||
></Route>
|
||||
{/* 通知公告新增页 */}
|
||||
<Route path="/competition/qz2022/notice/:type"
|
||||
render={
|
||||
({match}) => (<NoticeEdit {...props} match={match}/>)
|
||||
({ match }) => (<NoticeEdit {...props} match={match} />)
|
||||
}
|
||||
></Route>
|
||||
{/* 大赛介绍、大赛指南、关于我们 编辑页 */}
|
||||
|
@ -199,13 +219,13 @@ const Qz2022 = (props) => {
|
|||
{/* 通知公告 */}
|
||||
<Route path="/competition/qz2022/notice"
|
||||
render={
|
||||
() => (<Notice {...props} qzDetail={qzDetail}/>)
|
||||
() => (<Notice {...props} qzDetail={qzDetail} />)
|
||||
}
|
||||
></Route>
|
||||
{/* 参赛报名 */}
|
||||
<Route path="/competition/qz2022/apply"
|
||||
render={
|
||||
() => (<Apply {...props} qzDetail={qzDetail} enrollStatus={enrollStatus} setReload={setReload}/>)
|
||||
() => (<Apply {...props} qzDetail={qzDetail} enrollStatus={enrollStatus} setReload={setReload} />)
|
||||
}
|
||||
></Route>
|
||||
{/* 提案提交 */}
|
||||
|
@ -223,25 +243,25 @@ const Qz2022 = (props) => {
|
|||
{/* 联系我们 */}
|
||||
<Route path="/competition/qz2022/contact"
|
||||
render={
|
||||
() => (<Contact {...props} aboutUs={qzDetail&&qzDetail.about_us}/>)
|
||||
() => (<Contact {...props} aboutUs={qzDetail && qzDetail.about_us} />)
|
||||
}
|
||||
></Route>
|
||||
{/* 数据统计 */}
|
||||
<Route path="/competition/qz2022/statistics"
|
||||
render={
|
||||
() => (<Statistics {...props} qzDetail={qzDetail}/>)
|
||||
() => (<Statistics {...props} qzDetail={qzDetail} />)
|
||||
}
|
||||
></Route>
|
||||
{/* 后台管理-报名列表 */}
|
||||
<Route path="/competition/qz2022/management/applys"
|
||||
render={
|
||||
() => (<Management {...props} qzDetail={qzDetail}/>)
|
||||
() => (<Management {...props} qzDetail={qzDetail} />)
|
||||
}
|
||||
></Route>
|
||||
{/* 后台管理-作品列表 */}
|
||||
<Route path="/competition/qz2022/management/production"
|
||||
render={
|
||||
() => (<Management {...props} qzDetail={qzDetail}/>)
|
||||
() => (<Management {...props} qzDetail={qzDetail} />)
|
||||
}
|
||||
></Route>
|
||||
{/* 大赛介绍 */}
|
||||
|
@ -259,7 +279,7 @@ const Qz2022 = (props) => {
|
|||
{/* 大赛介绍 */}
|
||||
<Route path="/competition/qz2022"
|
||||
render={
|
||||
() => (<Introduce {...props} qzDetail={qzDetail}/>)
|
||||
() => (<Introduce {...props} qzDetail={qzDetail} />)
|
||||
}
|
||||
></Route>
|
||||
</Switch>
|
||||
|
|
|
@ -4,15 +4,29 @@
|
|||
}
|
||||
.qz2022 {
|
||||
font-size: 1rem;
|
||||
.qz2022-top {
|
||||
width: 100%;
|
||||
|
||||
&.fixed-top {
|
||||
position: fixed;
|
||||
z-index: 100;
|
||||
background: #fff;
|
||||
top:0;
|
||||
& + div{
|
||||
padding-top:3.75rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
.qz2022Menu {
|
||||
height: 2.25rem;
|
||||
// line-height: 2.25rem;
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
a {
|
||||
color: #2e3341;
|
||||
font-size: 1.1rem;
|
||||
transition:all .2s;
|
||||
transition: all 0.2s;
|
||||
}
|
||||
li.active {
|
||||
background-color: #fafafa;
|
||||
|
@ -29,6 +43,7 @@
|
|||
content: "";
|
||||
height: 2px;
|
||||
background: #4154f1;
|
||||
z-index: 10;
|
||||
}
|
||||
}
|
||||
.menu_border {
|
||||
|
@ -43,11 +58,11 @@
|
|||
}
|
||||
.qzCont {
|
||||
min-height: 35vh;
|
||||
border-radius:4px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
}
|
||||
.qz_manage {
|
||||
.ant-popover-inner-content{
|
||||
.ant-popover-inner-content {
|
||||
padding: 0;
|
||||
}
|
||||
.ant-dropdown-menu-item > a {
|
||||
|
|
Loading…
Reference in New Issue