junru0303
/
forgeplus-react
forked from Gitlink/forgeplus-react
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Merge branch 'gitlink_server' of https://git.trustie.net/Gitlink/forgeplus-react into gitlink_server

This commit is contained in:
caishi 2022-05-26 16:30:24 +08:00
parent f053b25744 2403b8a420
commit 5b69d12802
29 changed files with 467 additions and 248 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/glcc/api.js
View File

@ -89,3 +89,11 @@ export function studentApplyList(params) {
params params
}); });
} }
// 课题详情
export function getTaskById(id) {
return fetch({
url: `/api/applyInformation/task/${id}`,
method: 'get'
});
}

6
src/glcc/home/contact/index.jsx
View File

@ -15,15 +15,15 @@ function Contact() {
<div className="contact-info"> <div className="contact-info">
<h4 className="contact-invite">期待你的加入，和我们一起推动开源繁荣发展！</h4> <h4 className="contact-invite">期待你的加入，和我们一起推动开源繁荣发展！</h4>
<div className="contact-way"> <div className="contact-way">
<p>问题资讯: 243275429@qq.com</p> <p>交流QQ群: 210174286</p>
<p>合作推广: gitlink@ccf.org.cn</p> <p>合作推广: gitlink@ccf.org.cn</p>
</div> </div>
</div> </div>
<div className='attention'> <div className='attention'>
<div className='one'> <div className='one'>
<div className='attentionDiv'><img src={gitlink1} alt="gitlink1"/></div> <div className='attentionDiv'><img src={gitlink1} alt="gitlink1"/></div>
<p>加入GitLink</p> <p>加入编程夏令营</p>
<p>社区QQ群</p> <p>交流QQ群</p>
</div> </div>
<div> <div>
<div className='attentionDiv'><img src={gitlink2} alt="gitlink2"/></div> <div className='attentionDiv'><img src={gitlink2} alt="gitlink2"/></div>

13
src/glcc/home/index.jsx
View File

@ -14,7 +14,7 @@ import apply2 from "../img/apply2.png";
import './index.scss'; import './index.scss';
export default (props) => { export default (props) => {
const { current_user, isGlccApplyDate, showNotification } = props; const { current_user, isGlccApplyDate, showNotification, studentApplyStart } = props;
function goToApply() { function goToApply() {
if (isGlccApplyDate) { if (isGlccApplyDate) {
if (current_user && current_user.login) { if (current_user && current_user.login) {
@ -30,9 +30,10 @@ export default (props) => {
function goToStudent(){ function goToStudent(){
// 学生报名时间 // 学生报名时间
const studentApply = Date.parse(new Date()) > 1653494400000; if(!studentApplyStart){
if(!studentApply){
showNotification("不在报名时间，报名开始时间为5月26日"); showNotification("不在报名时间，报名开始时间为5月26日");
}else{
window.location.href="/glcc/subjects";
} }
} }
@ -52,7 +53,7 @@ export default (props) => {
<div className="apply project"> <div className="apply project">
<div> <div>
<img src={apply1} alt="" className="applyIcon"/> <img src={apply1} alt="" className="applyIcon"/>
<span className="hover-none"><span className="til">项目报名</span> ></span> <span className="hover-none"><span className="til">项目报名</span> </span>
<span className="hover-show">项目报名已截止</span> <span className="hover-show">项目报名已截止</span>
</div> </div>
<div className="pt6">项目报名开启，导师席位虚位以待</div> <div className="pt6">项目报名开启，导师席位虚位以待</div>
@ -61,7 +62,7 @@ export default (props) => {
<div className="apply" onClick={goToStudent}> <div className="apply" onClick={goToStudent}>
<div> <div>
<img src={apply2} alt="" className="applyIcon"/> <img src={apply2} alt="" className="applyIcon"/>
<span className="til">学生报名</span> > <span className="til">学生报名</span>
</div> </div>
<div className="pt6">选择感兴趣的课题，开启您的开源之旅</div> <div className="pt6">选择感兴趣的课题，开启您的开源之旅</div>
</div> </div>
@ -76,7 +77,7 @@ export default (props) => {
</div> </div>
</div> </div>
</div> </div>
<Lightspot isGlccApplyDate={isGlccApplyDate} current_user={current_user} showNotification={showNotification} /> <Lightspot isGlccApplyDate={isGlccApplyDate} current_user={current_user} showNotification={showNotification} studentApplyStart={studentApplyStart}/>
<TimerShaft /> <TimerShaft />
<Award /> <Award />
<News /> <News />

9
src/glcc/home/lightspot/index.jsx
View File

@ -12,7 +12,7 @@ import { Link } from 'react-router-dom';
function Lightspot(props) { function Lightspot(props) {
const {current_user, isGlccApplyDate, showNotification} = props; const {current_user, isGlccApplyDate, showNotification, studentApplyStart} = props;
function goToApply(){ function goToApply(){
if(isGlccApplyDate){ if(isGlccApplyDate){
@ -29,9 +29,10 @@ function Lightspot(props) {
function goToStudent(){ function goToStudent(){
// 学生报名时间 // 学生报名时间
const studentApply = Date.parse(new Date()) > 1653494400000; if(!studentApplyStart){
if(!studentApply){
showNotification("不在报名时间，报名开始时间为5月26日"); showNotification("不在报名时间，报名开始时间为5月26日");
}else{
window.location.href="/glcc/subjects";
} }
} }
@ -61,7 +62,7 @@ function Lightspot(props) {
<div className="info-item"> <div className="info-item">
<img className="info-item-img" src={lightspot1} alt=''></img> <img className="info-item-img" src={lightspot1} alt=''></img>
<h3 className="info-item-tit">汇聚行业顶尖开源项目</h3> <h3 className="info-item-tit">汇聚行业顶尖开源项目</h3>
<div className="info-item-content">平台汇聚商汤、腾讯、百度、阿里巴巴、亚马逊云科技、滴滴等行业尖端开源项目，把握开源生态发展脉搏</div> <div className="info-item-content">平台汇聚腾讯、百度、阿里巴巴、亚马逊云科技、滴滴等行业尖端开源项目，把握开源生态发展脉搏</div>
</div> </div>
<div className="info-item"> <div className="info-item">

101
src/glcc/home/partner/index.jsx
View File

@ -3,6 +3,15 @@ import './index.scss';
import ccf from '../../img/ccf_logo.png'; import ccf from '../../img/ccf_logo.png';
import gitlink from '../../img/gitlink.png'; import gitlink from '../../img/gitlink.png';
import xjy from '../../img/xjy.png'; import xjy from '../../img/xjy.png';
import sponsor11 from '../../img/sponsor11.png';
import sponsor21 from '../../img/sponsor21.png';
import sponsor22 from '../../img/sponsor22.png';
import sponsor23 from '../../img/sponsor23.png';
import sponsor31 from '../../img/sponsor31.png';
import sponsor32 from '../../img/sponsor32.png';
import sponsor41 from '../../img/sponsor41.png';
import log34 from '../../img/34@2x.png'; import log34 from '../../img/34@2x.png';
import log35 from '../../img/35@2x.png'; import log35 from '../../img/35@2x.png';
import log36 from '../../img/36@2x.png'; import log36 from '../../img/36@2x.png';
@ -50,81 +59,39 @@ function Partner() {
</div> </div>
</div> </div>
</div> </div>
{false && <div className='cont cont2'>
赞助商 <div className='cont cont3 mt15'>
{/* 一级赞助商 */} 钻石赞助商
<div className='one_sponsor mt10'> <div className='pt10'>
<div> <div className="sponsor" onClick={()=>{window.open("https://openmmlab.com/")}}><img src={sponsor11} className='gitlink' alt='OpenMMLab'/></div>
<img src={gitlink} className='gitlink'/>
<p className='bor'></p>
<p>钻石赞助商</p>
</div>
<div>
<img src={gitlink} className='gitlink'/>
<p className='bor'></p>
<p>钻石赞助商</p>
</div>
<div>
<img src={gitlink} className='gitlink'/>
<p className='bor'></p>
<p>钻石赞助商</p>
</div> </div>
</div> </div>
{/* 二级赞助商 */}
<div className='two_sponsor'> <div className='cont cont3 mt15'>
<div> 白金赞助商
<img src={gitlink} className='gitlink'/> <div className='pt10'>
<p className='bor'></p> <div className="sponsor" onClick={()=>{window.open("http://www.baidu.com/")}}><img src={sponsor21} className='gitlink' alt='百度'/></div>
<p className='op83'>铂金赞助商</p> <div className="sponsor" onClick={()=>{window.open("https://www.alibaba.com/")}}><img src={sponsor22} className='gitlink' alt='蚂蚁集团'/></div>
</div> <div className="sponsor" onClick={()=>{window.open("https://www.antgroup.com/")}}><img src={sponsor23} className='gitlink' alt='阿里巴巴'/></div>
<div>
<img src={gitlink} className='gitlink'/>
<p className='bor'></p>
<p className='op83'>铂金赞助商</p>
</div>
<div>
<img src={gitlink} className='gitlink'/>
<p className='bor'></p>
<p className='op83'>铂金赞助商</p>
</div> </div>
</div> </div>
{/* 三级赞助商 */}
<div className='three_sponsor'> <div className='cont cont3 mt15'>
<div> 黄金赞助商
<img src={gitlink} className='gitlink'/> <div className='pt10'>
<p className='bor'></p> <div className="sponsor" onClick={()=>{window.open("https://aws.amazon.com/cn/")}}><img src={sponsor31} className='gitlink' alt='亚马逊云科技'/></div>
<p>黄金赞助商</p> <div className="sponsor" onClick={()=>{window.open("https://www.didiglobal.com/")}}><img src={sponsor32} className='gitlink' alt='滴滴出行'/></div>
</div>
<div>
<img src={gitlink} className='gitlink'/>
<p className='bor'></p>
<p>黄金赞助商</p>
</div>
<div>
<img src={gitlink} className='gitlink'/>
<p className='bor'></p>
<p>黄金赞助商</p>
</div> </div>
</div> </div>
{/* 四级赞助商 */}
<div className='four_sponsor'> <div className='cont cont3 mt15'>
<div> 白银赞助商
<img src={gitlink} className='gitlink'/> <div className='pt10'>
<p className='bor'></p> <div className="sponsor" onClick={()=>{window.open("https://www.bytedance.com/")}}><img src={sponsor41} className='gitlink' alt='字节跳动'/></div>
<p>白银赞助商</p>
</div>
<div>
<img src={gitlink} className='gitlink'/>
<p className='bor'></p>
<p>白银赞助商</p>
</div>
<div>
<img src={gitlink} className='gitlink'/>
<p className='bor'></p>
<p>白银赞助商</p>
</div> </div>
</div> </div>
</div>}
<div className='cont cont3 mt15'> <div className='cont cont3 mt15'>
参与高校 参与高校
<div className='pt10'> <div className='pt10'>

106
src/glcc/home/partner/index.scss
View File

@ -37,57 +37,57 @@
.div8b9 .gitlink{width: 180px;} .div8b9 .gitlink{width: 180px;}
.div8b9 .xjy{width: 200px;} .div8b9 .xjy{width: 200px;}
} }
.cont2>div>div{ // .cont2>div>div{
width:156px; // width:156px;
height:87px; // height:87px;
padding: 12px 20px; // padding: 12px 20px;
margin-right: 50px; // margin-right: 50px;
>img{width: 110px; // >img{width: 110px;
margin: 0 auto;} // margin: 0 auto;}
>.bor{ // >.bor{
width: 100px; // width: 100px;
height: 2px; // height: 2px;
margin: 0 auto; // margin: 0 auto;
} // }
>p{ // >p{
width: auto; // width: auto;
font-size: 12px; // font-size: 12px;
margin: 2px auto; // margin: 2px auto;
text-align: center;} // text-align: center;}
} // }
.cont2>div{ // .cont2>div{
display: flex; // display: flex;
margin-top: 30px; // margin-top: 30px;
>div{border-radius:4px; // >div{border-radius:4px;
&:hover{ // &:hover{
box-shadow:0px 0px 10px rgba(255, 255, 255, 0.76); // box-shadow:0px 0px 10px rgba(255, 255, 255, 0.76);
}} // }}
&.one_sponsor>div{ // &.one_sponsor>div{
background-image:linear-gradient(135.33deg,#333333 0%,#474747 21.34%,#929292 44.35%,#575757 61.08%,#444444 75.73%,#212121 100%); // background-image:linear-gradient(135.33deg,#333333 0%,#474747 21.34%,#929292 44.35%,#575757 61.08%,#444444 75.73%,#212121 100%);
border:1px solid #c4bfba; // border:1px solid #c4bfba;
>.bor{background-image:linear-gradient(242.92deg,#f9e9b1 0%,#fff2d2 52.29%,#ebcc90 100%);} // >.bor{background-image:linear-gradient(242.92deg,#f9e9b1 0%,#fff2d2 52.29%,#ebcc90 100%);}
} // }
&.two_sponsor>div{ // &.two_sponsor>div{
background-image:linear-gradient(135.33deg,#ffffff 0%,#d8d8d8 21.34%,#aeaeae 34.31%,#fcfcfc 47.69%,#bbbbbb 64.44%,#f2f2f2 81.59%,#828282 100%); // background-image:linear-gradient(135.33deg,#ffffff 0%,#d8d8d8 21.34%,#aeaeae 34.31%,#fcfcfc 47.69%,#bbbbbb 64.44%,#f2f2f2 81.59%,#828282 100%);
border:1px solid #dbdbdd; // border:1px solid #dbdbdd;
>.bor{background-color:#ffffff;} // >.bor{background-color:#ffffff;}
>.op83{ // >.op83{
color:#000000; // color:#000000;
opacity: .83; // opacity: .83;
} // }
} // }
&.three_sponsor>div{ // &.three_sponsor>div{
background-image:linear-gradient(135.33deg,#ba973a 0%,#c7a948 21.34%,#d1ae33 47.69%,#ffdb72 72.15%,#b37907 100%); // background-image:linear-gradient(135.33deg,#ba973a 0%,#c7a948 21.34%,#d1ae33 47.69%,#ffdb72 72.15%,#b37907 100%);
border:1px solid #efe3ca; // border:1px solid #efe3ca;
>.bor{background-image:linear-gradient(242.92deg,#f9e9b1 0%,#fff2d2 52.29%,#ebcc90 100%);} // >.bor{background-image:linear-gradient(242.92deg,#f9e9b1 0%,#fff2d2 52.29%,#ebcc90 100%);}
} // }
&.four_sponsor>div{ // &.four_sponsor>div{
background-image:linear-gradient(135.33deg,#636363 0%,#bebebe 21.34%,#979797 43.51%,#9c9c9c 61.08%,#8d8d8d 75.73%,#727272 100%); // background-image:linear-gradient(135.33deg,#636363 0%,#bebebe 21.34%,#979797 43.51%,#9c9c9c 61.08%,#8d8d8d 75.73%,#727272 100%);
border:1px solid #dbdbdd; // border:1px solid #dbdbdd;
>.bor{background-color:#ffffff;} // >.bor{background-color:#ffffff;}
// >p{color: #000000;} // // >p{color: #000000;}
} // }
} // }
.cont3>div{ .cont3>div{
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
@ -101,11 +101,15 @@
align-items: center; align-items: center;
justify-content: center; justify-content: center;
margin: 0 20px 20px 0; margin: 0 20px 20px 0;
&.sponsor{
margin-bottom: 0;
}
&:hover{ &:hover{
cursor: pointer; cursor: pointer;
box-shadow:0px 0px 10px rgba(255, 255, 255, 0.76); box-shadow:0px 0px 10px rgba(255, 255, 255, 0.76);
} }
>img{width: 95%;} >img{width: 95%;}
} }
} }
} }

BIN
src/glcc/img/bgPng.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 23 KiB

BIN
src/glcc/img/gitlink1.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 46 KiB

After

Width:  |  Height:  |  Size: 150 KiB

BIN
src/glcc/img/logo.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 12 KiB

BIN
src/glcc/img/qqChat.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 67 KiB

After

Width:  |  Height:  |  Size: 150 KiB

BIN
src/glcc/img/sponsor11.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 12 KiB

BIN
src/glcc/img/sponsor21.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 11 KiB

BIN
src/glcc/img/sponsor22.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 15 KiB

BIN
src/glcc/img/sponsor23.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.2 KiB

BIN
src/glcc/img/sponsor31.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 13 KiB

BIN
src/glcc/img/sponsor32.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.7 KiB

BIN
src/glcc/img/sponsor41.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 12 KiB

54
src/glcc/index.jsx
View File

@ -12,6 +12,8 @@ import Loadable from "react-loadable";
import Loading from "../Loading"; import Loading from "../Loading";
import { ImageLayerOfCommentHOC } from "../modules/page/layers/ImageLayerOfCommentHOC"; import { ImageLayerOfCommentHOC } from "../modules/page/layers/ImageLayerOfCommentHOC";
import { useState } from "react"; import { useState } from "react";
import { useEffect } from "react";
import { getStudentApplyInfo } from "./api";
// 任务管理审核 // 任务管理审核
@ -40,11 +42,41 @@ const Project = Loadable({
loader: () => import("./project"), loader: () => import("./project"),
loading: Loading, loading: Loading,
}); });
// 课题详情页面
const TaskDetail = Loadable({
loader: () => import("./project/taskDetail"),
loading: Loading,
});
const Glcc = (propsF) => { const Glcc = (propsF) => {
const {current_user} = propsF;
// 判断时间是否在开源夏令营报名时间内（4月15日~5月20日） // 判断时间是否在开源夏令营报名时间内（4月15日~5月20日）
const isGlccApplyDate = Date.parse(new Date()) < 1653062400000; const isGlccApplyDate = Date.parse(new Date()) < 1653062400000;
// 学生报名时间new Date().getTime() > new Date('2022-05-26').getTime()
const studentApplyStart = new Date().getTime() > new Date('2022-05-26').getTime();
const isStudentApplyDate = new Date().getTime() > new Date('2022-05-26').getTime() && new Date().getTime() < new Date('2022-06-25').getTime();
const studentApplyEnd = new Date().getTime() > new Date('2022-06-25').getTime();
// 用户已报名课题id数组
const [applyTaskId, setApplyTaskId] = useState({});
// 刷新用户课题报名信息
const [studentInfoReset, setStudentInfoReset] = useState(undefined);
useEffect(()=>{
// 获取用户课题报名信息current_user user_id
current_user && current_user.login && getStudentApplyInfo({userId: current_user.user_id}).then(response=>{
if(response && response.message === "success"){
// setData(response.data.rows);
const data = {};
response.data && response.data.registrationStudentTaskList.map(item=>{
data[item.taskId] = item.id;
})
setApplyTaskId(data);
}
})
},[studentInfoReset, current_user])
return ( return (
<div className="newMain clearfix"> <div className="newMain clearfix">
<Switch {...propsF}> <Switch {...propsF}>
@ -52,7 +84,7 @@ const Glcc = (propsF) => {
<Route <Route
path="/glcc/student/apply/:taskId" path="/glcc/student/apply/:taskId"
render={(props) => ( render={(props) => (
<Student {...propsF} {...props} isGlccApplyDate={isGlccApplyDate}/> <Student {...propsF} {...props} isGlccApplyDate={isGlccApplyDate} setStudentInfoReset={setStudentInfoReset}/>
)} )}
></Route> ></Route>
{/* 开源夏令营报名页面 */} {/* 开源夏令营报名页面 */}
@ -69,18 +101,32 @@ const Glcc = (propsF) => {
<Help {...propsF} {...props} /> <Help {...propsF} {...props} />
)} )}
></Route> ></Route>
<Route
path="/glcc/subjects/detail/:taskId"
render={(props) => (
<TaskDetail {...propsF} {...props} isStudentApplyDate={isStudentApplyDate} studentApplyEnd={studentApplyEnd} applyTaskId={applyTaskId}/>
)}
></Route>
{/* 项目/课题列表 */} {/* 项目/课题列表 */}
<Route <Route
path="/glcc/student" path="/glcc/projects"
render={(props) => ( render={(props) => (
<Project {...propsF} {...props}/> <Project {...propsF} {...props} isStudentApplyDate={isStudentApplyDate} studentApplyEnd={studentApplyEnd} applyTaskId={applyTaskId} setStudentInfoReset={setStudentInfoReset}/>
)}
></Route>
{/* 课题列表 */}
<Route
path="/glcc/subjects"
render={(props) => (
<Project {...propsF} {...props} isStudentApplyDate={isStudentApplyDate} studentApplyEnd={studentApplyEnd} applyTaskId={applyTaskId} setStudentInfoReset={setStudentInfoReset}/>
)} )}
></Route> ></Route>
{/* 首页 */} {/* 首页 */}
<Route <Route
path="/glcc" path="/glcc"
render={(props) => ( render={(props) => (
<Home {...propsF} {...props} isGlccApplyDate={isGlccApplyDate}/> <Home {...propsF} {...props} studentApplyStart={studentApplyStart}/>
)} )}
></Route> ></Route>

23
src/glcc/project/component/projectDetail.jsx
View File

@ -1,5 +1,5 @@
import React, { useState } from 'react'; import React, { useState } from 'react';
import { Button, message } from 'antd'; import { Button, message, Tooltip } from 'antd';
import Nodata from '../../../forge/Nodata'; import Nodata from '../../../forge/Nodata';
import { useEffect } from 'react'; import { useEffect } from 'react';
import { getProjectById } from '../../api'; import { getProjectById } from '../../api';
@ -39,23 +39,26 @@ export default ({ detail, projectId, applyTaskId, current_user, showLoginDialog,
<div className="projectDetailHead"> <div className="projectDetailHead">
<span className='name'>{info.projectName}</span> <span className='name'>{info.projectName}</span>
{info.projectType && <span className='type'>{info.projectType}</span>} {info.projectType && <span className='type'>{info.projectType}</span>}
<p>GitLink项目地址:&nbsp;&nbsp;<a href={info.gitlinkUrl} className='linkUrl'>{info.gitlinkUrl}</a></p> <p>GitLink项目地址:&nbsp;&nbsp;<a href={info.gitlinkUrl} className='linkUrl' target={"_blank"}>{info.gitlinkUrl}</a></p>
<div>项目简介:&nbsp;&nbsp;{info.projectIntro}</div> <div>项目简介:&nbsp;&nbsp;{info.projectIntro}</div>
</div> </div>
{info.registrationTaskList && info.registrationTaskList.length > 0 ? info.registrationTaskList.map(item=>{ {info.registrationTaskList && info.registrationTaskList.length > 0 ? info.registrationTaskList.map((item, index)=>{
return <div className='taskItem mt20'> return <div className='taskItem mt20' key={index}>
<div className="left"> <div className="left">
<div className="taskTitle">{item.taskName}</div> <div className="taskTitle" onClick={()=>{window.location.href=`/glcc/subjects/detail/${item.id}`}}><Tooltip title={item.taskName}>{item.taskName}</Tooltip></div>
<div className='mt20 oneLine leftWidth'>导师姓名: &nbsp;&nbsp;{item.tutorName}</div> <div className='mt20 oneLine leftWidth'>导师姓名: &nbsp;&nbsp;{item.tutorName}</div>
<div className='mb20 email oneLine leftWidth'>邮箱地址: &nbsp;&nbsp;<span>{item.tutorMail}</span></div> {item.tutorMail && <div className='mb20 email oneLine leftWidth'>邮箱地址: &nbsp;&nbsp;<span><Tooltip title={item.tutorMail}>{item.tutorMail}</Tooltip></span></div>}
</div> </div>
<div className="center"> <div className="center">
<div className="taskDesc">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{item.taskDesc}</div> <div className="taskDesc">{item.taskDesc}</div>
<div className="right oneLine taskUrl mt5">奖金: &nbsp;&nbsp;<span className='taskReward'>{item.taskReward}</span></div> {item.taskUrl && <div className="taskUrl oneLine">课题链接: &nbsp;&nbsp;<a href={item.taskUrl} target={"_blank"}>{item.taskUrl}</a></div>}
{item.taskUrl && <div className="taskUrl">课题链接: &nbsp;&nbsp;<span><a href={info.taskUrl}>{item.taskUrl}</a></span></div>} <div>
<div>{(isStudentApplyDate || studentApplyEnd) && (applyTaskId && item.id && Object.keys(applyTaskId).includes(item.id.toString()) ? <Button onClick={()=>{window.location.href=`/glcc/student/apply/${item.id}`}} className='lookDetail'>报名详情</Button> : isStudentApplyDate && <Button type='primary' className='applyBut' onClick={()=>{applyTask(item.id)}}>申请课题</Button>)}</div> {(isStudentApplyDate || studentApplyEnd) && (applyTaskId && item.id && Object.keys(applyTaskId).includes(item.id.toString()) ? <Button onClick={()=>{window.location.href=`/glcc/student/apply/${item.id}`}} className='lookDetail mr10'>报名详情</Button> : isStudentApplyDate && <Button type='primary' className='applyBut mr10' onClick={()=>{applyTask(item.id)}}>申请课题</Button>)}
<Button onClick={()=>{window.open(`/glcc/subjects/detail/${item.id}`)}} className='lookDetail'>课题详情</Button>
</div> </div>
</div> </div>
<div className="right oneLine taskUrl"><span className='taskReward'>￥{item.taskReward}</span></div>
</div>
}) : <Nodata _html="课题暂无数据" small={true}/>} }) : <Nodata _html="课题暂无数据" small={true}/>}
</div>: <div className="projectDetailBox nodata"><Nodata _html="暂无数据" small={true}/></div> </div>: <div className="projectDetailBox nodata"><Nodata _html="暂无数据" small={true}/></div>
) )

41
src/glcc/project/index.jsx
View File

@ -1,4 +1,4 @@
import React , { useEffect , useState } from 'react'; import React from 'react';
import { Spin } from 'antd'; import { Spin } from 'antd';
import { Route, Switch } from "react-router-dom"; import { Route, Switch } from "react-router-dom";
import banner from "../img/studentProject.png"; import banner from "../img/studentProject.png";
@ -6,7 +6,7 @@ import './index.scss';
import Loadable from "react-loadable"; import Loadable from "react-loadable";
import Loading from "../../Loading"; import Loading from "../../Loading";
import { Link } from 'react-router-dom'; import { Link } from 'react-router-dom';
import { getStudentApplyInfo } from '../api'; import { useEffect } from 'react';
// 项目列表页面 // 项目列表页面
const ProjectList = Loadable({ const ProjectList = Loadable({
@ -20,37 +20,18 @@ const TaskList = Loadable({
}); });
function Project(propsF) { function Project(propsF) {
const {location, current_user, showLoginDialog} = propsF; const {location, current_user, showLoginDialog, isStudentApplyDate, studentApplyEnd, applyTaskId, setStudentInfoReset} = propsF;
const {pathname} = location; const {pathname} = location;
const isStudentApplyDate = Date.parse(new Date()) > 1653494400000 && Date.parse(new Date()) < 1656086400000;
const studentApplyEnd = Date.parse(new Date()) > 1656086400000;
// const studentApplyEnd = false;
// const isStudentApplyDate = true;
// 用户已报名课题id数组
const [applyTaskId, setApplyTaskId] = useState({});
// 刷新用户课题报名信息
const [studentInfoReset, setStudentInfoReset] = useState(undefined);
useEffect(()=>{ useEffect(()=>{
// 获取用户课题报名信息current_user user_id window.scrollTo(0, 0);
current_user && current_user.login && getStudentApplyInfo({userId: current_user.user_id}).then(response=>{ },[])
if(response && response.message === "success"){
// setData(response.data.rows);
const data = {};
response.data && response.data.registrationStudentTaskList.map(item=>{
data[item.taskId] = item.id;
})
setApplyTaskId(data);
}
})
},[studentInfoReset, current_user])
return( return(
<div className="glcc_project"> <div className="glcc_project">
<img className="glcc-banner" src={banner} alt=''></img> <img className="glcc-banner" src={banner} alt=''></img>
<div className='head'> <div className='head'>
<Link to="/glcc/student/2" className={!pathname.endsWith('/1') ? 'active' : ''}>课题列表</Link> <Link to="/glcc/subjects" className={!pathname.endsWith('projects') ? 'active' : ''}>课题列表</Link>
<Link to="/glcc/student/1" className={pathname.endsWith('/1') ? 'active' : ''}>项目列表</Link> <Link to="/glcc/projects" className={pathname.endsWith('projects') ? 'active' : ''}>项目列表</Link>
</div> </div>
<div className='gobackBox'> <div className='gobackBox'>
<a href='/glcc'>开源夏令营 / </a> <a href='/glcc'>开源夏令营 / </a>
@ -59,15 +40,15 @@ function Project(propsF) {
<Spin spinning={false}> <Spin spinning={false}>
<Switch {...propsF}> <Switch {...propsF}>
<Route <Route
path="/glcc/student/1" path="/glcc/projects"
render={(props) => ( render={(props) => (
<ProjectList applyTaskId={applyTaskId} current_user={current_user} showLoginDialog={showLoginDialog} isStudentApplyDate={isStudentApplyDate} studentApplyEnd={studentApplyEnd}/> <ProjectList applyTaskId={applyTaskId} current_user={current_user} showLoginDialog={showLoginDialog} isStudentApplyDate={isStudentApplyDate} studentApplyEnd={studentApplyEnd}/>
)} )}
></Route> ></Route>
<Route <Route
path="/glcc/student/2" path="/glcc/subjects"
render={(props) => ( render={(props) => (
<TaskList applyTaskId={applyTaskId} studentInfoReset={studentInfoReset} setStudentInfoReset={setStudentInfoReset} current_user={current_user} showLoginDialog={showLoginDialog} isStudentApplyDate={isStudentApplyDate} studentApplyEnd={studentApplyEnd}/> <TaskList applyTaskId={applyTaskId} setStudentInfoReset={setStudentInfoReset} current_user={current_user} showLoginDialog={showLoginDialog} isStudentApplyDate={isStudentApplyDate} studentApplyEnd={studentApplyEnd}/>
)} )}
></Route> ></Route>
<Route <Route

49
src/glcc/project/index.scss
View File

@ -32,9 +32,12 @@
} }
.listBox{ .listBox{
background-image:linear-gradient(180deg,#ebf2ff 0%,#ebf2ff 43.09%,#f3f4f8 100%); background-image:linear-gradient(180deg,#ebf2ff 0%,#ebf2ff 43.09%,#f3f4f8 100%);
position: relative;
.list{ .list{
width: 1200px; width: 1200px;
margin: 0 auto; margin: 0 auto;
position: relative;
z-index: 1;
.search{ .search{
width: 40%; width: 40%;
margin: 0 auto; margin: 0 auto;
@ -64,9 +67,18 @@
background-color:#466aff; background-color:#466aff;
border-color: #466aff; border-color: #466aff;
} }
// .ant-input:hover{ }
// border-color: #466aff; .bgPng3, .bgPng4{
// } width: 146px;
position: absolute;
z-index: 0;
top: 162px;
left: 100px;
}
.bgPng4{
top: 450px;
left: auto;
right: 310px;
} }
} }
} }
@ -83,9 +95,8 @@
padding: 30px 30px 50px; padding: 30px 30px 50px;
.taskItem{ .taskItem{
.center{ .center{
// width: 60%; width: 640px;
} }
.right{padding-right: 10px;}
} }
} }
&.nodata{width: 200px;} &.nodata{width: 200px;}
@ -130,14 +141,20 @@
padding: 22px 20px; padding: 22px 20px;
color:#25304a; color:#25304a;
.taskTitle{ .taskTitle{
cursor: pointer;
color:#1834a7; color:#1834a7;
font-size:18px; font-size:18px;
display: -webkit-box;
overflow: hidden;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
text-overflow: ellipsis;
} }
.email span{color:#466aff;} .email span{color:#466aff;}
.leftWidth{width: 270px;} .leftWidth{width: 270px;}
} }
.center{ .center{
// width: 650px; width: 665px;
text-align: left; text-align: left;
padding: 20px; padding: 20px;
display: flex; display: flex;
@ -145,6 +162,11 @@
justify-content: space-between; justify-content: space-between;
.taskDesc{ .taskDesc{
color:#6b6b6b; color:#6b6b6b;
display: -webkit-box;
overflow: hidden;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
text-overflow: ellipsis;
} }
.taskUrl{ .taskUrl{
color:#465474; color:#465474;
@ -161,13 +183,14 @@
} }
.taskReward{color:#ff8800;} .taskReward{color:#ff8800;}
} }
// .right{ .right{
// min-width: 150px; margin-top: 35px;
// font-weight:700; padding-right: 10px;
// color:#ff8800; width: 120px;
// font-size:24px; font-weight:700;
// padding: 30px 30px 0 0; color:#ff8800;
// } font-size:24px;
}
} }
} }
.projectItemPopover{ .projectItemPopover{

12
src/glcc/project/projectList/index.jsx
View File

@ -1,9 +1,11 @@
import React , { useEffect , useState } from 'react'; import React , { useEffect , useState } from 'react';
import { Input, Popover, Spin, Table, Tooltip } from 'antd'; import { Input, Popover, Spin } from 'antd';
import { main_site_url } from '../../fetch'; import { main_site_url } from '../../fetch';
import './index.scss'; import './index.scss';
import { projectList } from '../../api'; import { projectList } from '../../api';
import ProjectDetail from '../component/projectDetail'; import ProjectDetail from '../component/projectDetail';
import bgPng from "../../img/bgPng.png";
import logo from "../../img/logo.png";
const {Search} = Input; const {Search} = Input;
// 项目列表 // 项目列表
@ -18,7 +20,7 @@ function ProjectList({applyTaskId, current_user, showLoginDialog, isStudentApply
const params = { const params = {
curPage: 1, curPage: 1,
keyword, keyword,
pageSize: 20 pageSize: 10000
} }
projectList(params).then(response=>{ projectList(params).then(response=>{
if(response && response.message === "success"){ if(response && response.message === "success"){
@ -35,10 +37,10 @@ function ProjectList({applyTaskId, current_user, showLoginDialog, isStudentApply
<Spin spinning={loading}> <Spin spinning={loading}>
<div className='projectListBox'> <div className='projectListBox'>
{data && data.map((item, index)=>{ {data && data.map((item, index)=>{
return <Popover placement= {(index+1)%3 === 0 ? 'bottomRight' : (index+1)%3%2 === 0 ? 'bottom' : 'bottomLeft'} content={<ProjectDetail detail={item} applyTaskId={applyTaskId} current_user={current_user} showLoginDialog={showLoginDialog} isStudentApplyDate={isStudentApplyDate} studentApplyEnd={studentApplyEnd}/>} trigger='click' overlayClassName='projectItemPopover' autoAdjustOverflow={false}> return <Popover key={index} placement= {(index+1)%3 === 0 ? 'bottomRight' : (index+1)%3%2 === 0 ? 'bottom' : 'bottomLeft'} content={<ProjectDetail detail={item} applyTaskId={applyTaskId} current_user={current_user} showLoginDialog={showLoginDialog} isStudentApplyDate={isStudentApplyDate} studentApplyEnd={studentApplyEnd}/>} trigger='click' overlayClassName='projectItemPopover' autoAdjustOverflow={false}>
<div className={`projectItem ${(index+1)%3 === 0 || (index+1)%3%2 === 0 ? '' : 'firstBox'}`}> <div className={`projectItem ${(index+1)%3 === 0 || (index+1)%3%2 === 0 ? '' : 'firstBox'}`}>
<div className="border"></div> <div className="border"></div>
<div className="projectLogo"><img src={`${main_site_url}/api/attachments/${item.projectLogoId}`} alt=''/></div> <div className="projectLogo"><img src={item.projectLogoId ? `${main_site_url}/api/attachments/${item.projectLogoId}` : logo} alt=''/></div>
<div className="title">{item.projectName}</div> <div className="title">{item.projectName}</div>
<div className="intro">{item.projectIntro}</div> <div className="intro">{item.projectIntro}</div>
</div> </div>
@ -47,6 +49,8 @@ function ProjectList({applyTaskId, current_user, showLoginDialog, isStudentApply
</div> </div>
</Spin> </Spin>
</div> </div>
<img src={bgPng} alt='' className='bgPng3'/>
<img src={bgPng} alt='' className='bgPng4'/>
</div> </div>
) )
} }

6
src/glcc/project/projectList/index.scss
View File

@ -32,14 +32,16 @@
width: 100px; width: 100px;
height: 100px; height: 100px;
border: 1px solid #fff; border: 1px solid #fff;
background-color: #fff;
border-radius: 50%; border-radius: 50%;
text-align: center; text-align: center;
overflow: hidden; overflow: hidden;
margin: 25px auto 10px; margin: 25px auto 10px;
line-height: 100px;
img{ img{
width: 100%; width: 100%;
height: 100%; // height: 100%;
display: block; // display: block;
} }
} }
.title{ .title{

76
src/glcc/project/taskDetail/index.jsx Normal file
View File

@ -0,0 +1,76 @@
import React, {useEffect, useState } from 'react';
import { Button, message, Spin} from 'antd';
import '../index.scss';
import './index.scss';
import { getTaskById } from '../../api';
import banner from "../../img/studentProject.png";
import bgPng from "../../img/bgPng.png";
// 课题列表
function TaskDetail(props) {
const {match, current_user, showLoginDialog, isStudentApplyDate, studentApplyEnd, applyTaskId} = props
const taskId = Number(match.params.taskId);
const [detail, setDetail] = useState(undefined);
useEffect(()=>{
getTaskById(taskId).then(res=>{
if(res && res.message === "success"){
setDetail(res.data);
}
})
},[])
// 申请课题按钮点击函数
function applyTask(id){
// 判断用户是否已经登录
if(current_user && current_user.login){
// 判断用户是否已经报名两个课题
if(applyTaskId && Object.keys(applyTaskId).length >= 2){
message.error('最多只能同时报名两个课题');
}else{
// 跳转到学生报名页
window.location.href=`/glcc/student/apply/${id}`;
}
}else{
showLoginDialog();
}
}
return (
<div className="taskDetailBgBox">
{/* <img className="glcc-banner" src={banner} alt=''></img> */}
<Spin spinning={!detail}>
{detail && <div className="bgBox">
<div className="detailBox">
<div className='goBackBox'>
<a href='/glcc'>开源夏令营 / </a>
<a href='/glcc/subjects'>课题及项目列表 / </a>
课题详情
</div>
</div>
<div className="detailContent">
<div className="detailHead">
<div className="title">{detail.taskName}</div>
<div className='box'>
{detail.projectType && <span className='classify'>{detail.projectType}</span>}
{detail.taskUrl && <span>课题链接: <a href={detail.taskUrl} className='link'>{detail.taskUrl}</a></span>}
</div>
</div>
<div className="detailCont">
<div><span className='smallTil'>所属项目</span>{detail.projectName}</div>
<div className='moneyBox'><span className='smallTil'>课题奖金</span><span className='money'>￥{detail.taskReward}</span></div>
<div><span className='smallTil'>导师信息</span>{detail.tutorName}{detail.tutorMail &&` | ${detail.tutorMail}`}</div>
<div className="bor"></div>
<div><span className='smallTil'>课题简介</span></div>
<div className='desc'>{detail.taskDesc}</div>
</div>
{(isStudentApplyDate || studentApplyEnd) && (applyTaskId && taskId && Object.keys(applyTaskId).includes(taskId.toString()) ? <Button onClick={()=>{window.location.href=`/glcc/student/apply/${taskId}`}} className='lookDetail detailBut'>报名详情</Button> : isStudentApplyDate && <Button type='primary' className='applyBut detailBut' onClick={()=>{applyTask(taskId)}}>申请课题</Button>)}
</div>
<img src={bgPng} alt='' className='bgPng1'/>
<img src={bgPng} alt='' className='bgPng2'/>
</div>}
</Spin>
</div>
)
}
export default TaskDetail;

119
src/glcc/project/taskDetail/index.scss Normal file
View File

@ -0,0 +1,119 @@
.taskDetailBgBox{
text-align: center;
.glcc-banner {
width: 100%;
}
.goBackBox{
width: 1200px;
margin: 0 auto;
padding: 25px 0 12px;
color: #202d40;
font-size: 16px;
border-bottom: 1px dashed #bec5d5;
a{
color:#a4aabb;
}
}
.bgBox{
text-align: left;
background-image:linear-gradient(180deg,#ebf2ff 0%,#ebf2ff 43.09%,#f3f4f8 100%);
padding-bottom: 100px;
position: relative;
.bgPng1{
width: 146px;
position: absolute;
top: 230px;
left: 110px;
z-index: 0;
}
.bgPng2{
width: 186px;
position: absolute;
top: 520px;
right: 310px;
z-index: 0;
}
}
.detailContent{
position: relative;
z-index: 1;
width: 1200px;
margin: 25px auto 0;
background-image:linear-gradient(180deg,#f1f5ff 0%,#f3f8ff 100%);
border:1px solid #ffffff;
border-radius:4px;
padding: 40px 30px 30px;
.detailHead{
border-bottom: 1px dashed #bec5d5;
.title{
font-weight:700;
color:#3753c5;
font-size:20px;
}
.box{
color:#465474;
font-size:15px;
margin: 15px 0;
.classify{
padding: 0px 8px;
display: inline-block;
border:1px solid #6680bb;
border-radius: 4px;
margin-right: 25px;
}
}
.link{margin-left: 6px;}
}
}
.detailCont{
background-color:#e9efff;
padding: 20px 15px;
color:#465474;
font-size:15px;
margin-top: 20px;
.bor{
margin: 0 -15px 20px -15px;
border-bottom: 1px dashed #bec5d5;;
}
.smallTil{
font-weight:500;
color:#000000;
margin-right: 15px;
}
.moneyBox{
display: flex;
align-items: center;
}
.money{
font-weight:700;
color:#ff8800;
font-size:20px;
}
div{
margin-bottom: 15px;
}
.desc{
white-space: pre-wrap;
}
}
.link{
color:#466aff;
&:hover{
color: #5d7cff !important;
}
&:active{
color: #1140ff !important;
}
}
.applyBut{
background-color:#466aff;
border-color: #466aff;
&:hover{background-color:#5d7cff;}
&:focus{background-color:#1140ff;}
}
.detailBut{
height: 36px;
line-height: 36px;
margin-top: 25px;
}
}

33
src/glcc/project/taskList/index.jsx
View File

@ -1,12 +1,13 @@
import React, { Fragment, useEffect, useState } from 'react'; import React, { Fragment, useEffect, useState } from 'react';
import { Checkbox, Input, message, Modal, Table, Tooltip } from 'antd'; import { Checkbox, Input, message, Modal, Table, Tooltip } from 'antd';
import './index.scss'; import './index.scss';
import { cancelTaskApply, taskList, studentApplyList } from '../../api'; import { cancelTaskApply, taskList } from '../../api';
import ProjectDetail from '../component/projectDetail'; import ProjectDetail from '../component/projectDetail';
import bgPng from "../../img/bgPng.png";
const { Search } = Input; const { Search } = Input;
// 课题列表 // 课题列表
function TaskList({applyTaskId, setStudentInfoReset, current_user, showLoginDialog, isStudentApplyDate, studentApplyEnd, studentInfoReset}) { function TaskList({applyTaskId, setStudentInfoReset, current_user, showLoginDialog, isStudentApplyDate, studentApplyEnd}) {
const [visible, setVisible] = useState(false); const [visible, setVisible] = useState(false);
const [deleteTaskId, setDeleteTaskId] = useState(undefined); const [deleteTaskId, setDeleteTaskId] = useState(undefined);
// 输入搜索框 // 输入搜索框
@ -23,7 +24,7 @@ function TaskList({applyTaskId, setStudentInfoReset, current_user, showLoginDial
const columns = [ const columns = [
{ title: '序号', dataIndex: 'index', align: 'center', className:"taskTableColumns", width: '6%', render: (text, item, index) => <span>{(current-1)*pageSize+index + 1}</span> }, { title: '序号', dataIndex: 'index', align: 'center', className:"taskTableColumns", width: '6%', render: (text, item, index) => <span>{(current-1)*pageSize+index + 1}</span> },
{ title: '课题名称', dataIndex: 'taskName', className:"taskTableColumns taskName", width: '28%', ellipsis: true, render: (text, item) => <Tooltip title={text} placement="topLeft"><span onClick={()=>{window.location.href=item.taskUrl}}>{text}</span></Tooltip> }, { title: '课题名称', dataIndex: 'taskName', className:"taskTableColumns taskName", width: '28%', ellipsis: true, render: (text, item) => <Tooltip title={text} placement="topLeft"><span onClick={()=>{window.open(`/glcc/subjects/detail/${item.id}`)}}>{text}</span></Tooltip> },
{ title: '项目名称', dataIndex: 'projectName', className:"taskTableColumns", width: '28%', ellipsis: true, render: (text) => <Tooltip title={text} placement="topLeft">{text}</Tooltip> }, { title: '项目名称', dataIndex: 'projectName', className:"taskTableColumns", width: '28%', ellipsis: true, render: (text) => <Tooltip title={text} placement="topLeft">{text}</Tooltip> },
{ title: '课题奖金', dataIndex: 'taskReward', className:"taskTableColumns", ellipsis: true, width: `${isStudentApplyDate || studentApplyEnd ? '15%' : ''}`, render: (text) => <Tooltip title={text} placement="topLeft"><span>{text}</span></Tooltip> }, { title: '课题奖金', dataIndex: 'taskReward', className:"taskTableColumns", ellipsis: true, width: `${isStudentApplyDate || studentApplyEnd ? '15%' : ''}`, render: (text) => <Tooltip title={text} placement="topLeft"><span>{text}</span></Tooltip> },
{ {
@ -102,12 +103,14 @@ function TaskList({applyTaskId, setStudentInfoReset, current_user, showLoginDial
// 改变pagesize // 改变pagesize
function onShowSizeChange(current, pageSize){ function onShowSizeChange(current, pageSize){
window.scrollTo(0, 0);
setCurrent(1); setCurrent(1);
setPageSize(pageSize); setPageSize(pageSize);
} }
// 切换页数 // 切换页数
function changePage(page, pageSize){ function changePage(page, pageSize){
window.scrollTo(0, 0);
setCurrent(page); setCurrent(page);
} }
@ -124,7 +127,8 @@ function TaskList({applyTaskId, setStudentInfoReset, current_user, showLoginDial
const params = { const params = {
curPage: current, curPage: current,
keyword, keyword,
pageSize pageSize,
userId: apply ? current_user.user_id : ''
} }
taskList(params).then(response => { taskList(params).then(response => {
if (response && response.message === "success") { if (response && response.message === "success") {
@ -139,28 +143,13 @@ function TaskList({applyTaskId, setStudentInfoReset, current_user, showLoginDial
} }
setLoading(false); setLoading(false);
}) })
}, [keyword, current, pageSize, applyTaskId]) }, [keyword, current, pageSize, applyTaskId, apply])
useEffect(()=>{
// if(apply){
// // 判断用户是否已经登录
// if(current_user && current_user.login){
// apply && studentApplyList().then(response => {
// if (response && response.message === "success") {
// console.log(response);
// }
// })
// }else{
// showLoginDialog();
// }
// }
},[apply])
return ( return (
<div className="taskList listBox"> <div className="taskList listBox">
<div className="list"> <div className="list">
<div className='search task'> <div className='search task'>
<Checkbox onChange={(e)=>{setApply(e.target.checked)}}>已报名</Checkbox> {current_user && current_user.login ? <Checkbox onChange={(e)=>{setCurrent(1);setApply(e.target.checked)}}>已报名</Checkbox> : <div></div>}
<Search className='taskSearch' placeholder='请输入课题名称进行搜索' allowClear enterButton onSearch={(value) => { setCurrent(1); setKeyword(value) }} /> <Search className='taskSearch' placeholder='请输入课题名称进行搜索' allowClear enterButton onSearch={(value) => { setCurrent(1); setKeyword(value) }} />
<div></div> <div></div>
</div> </div>
@ -178,6 +167,8 @@ function TaskList({applyTaskId, setStudentInfoReset, current_user, showLoginDial
pagination={{current: current, pageSize: pageSize, total: total, showSizeChanger: true, onShowSizeChange:onShowSizeChange, showQuickJumper: true, onChange: changePage}} pagination={{current: current, pageSize: pageSize, total: total, showSizeChanger: true, onShowSizeChange:onShowSizeChange, showQuickJumper: true, onChange: changePage}}
/> />
</div> </div>
<img src={bgPng} alt='' className='bgPng3'/>
<img src={bgPng} alt='' className='bgPng4'/>
<Modal <Modal
okText="确认删除" okText="确认删除"
okType='default' okType='default'

33
src/glcc/student/index.jsx
View File

@ -49,16 +49,16 @@ function Apply(props) {
useEffect(() => { useEffect(() => {
// 进入此页面到填写页面 // 进入此页面到填写页面
setTimeout(()=>{ // setTimeout(()=>{
let clientWidth = document.body.clientWidth; // let clientWidth = document.body.clientWidth;
let scrollHeight = 500 * clientWidth / 1920; // let scrollHeight = 500 * clientWidth / 1920;
window.scrollTo(0, scrollHeight); // window.scrollTo(0, scrollHeight);
},200); // },200);
// window.scrollTo(0, 50); window.scrollTo(0, 50);
if (new Date().getTime() < new Date('2022-05-26').getTime()) { if (new Date().getTime() < new Date('2022-05-26').getTime()) {
// 不在开源夏令营报名时间之内 // 不在开源夏令营报名时间之内
window.location.href = "/glcc/student/2"; window.location.href = "/glcc/subjects";
} else if (current_user && current_user.login) { } else if (current_user && current_user.login) {
} else { } else {
@ -190,20 +190,20 @@ function Apply(props) {
studentApplyEdit(params).then(response => { studentApplyEdit(params).then(response => {
if (response && response.message === "success") { if (response && response.message === "success") {
showNotification("修改信息成功"); showNotification("修改信息成功");
// setStudentInfoReset(Math.random()); setStudentInfoReset(Math.random());
setReload(Math.random()); setReload(Math.random());
setLoading(false); setLoading(false);
history.push(`/glcc/student/2`) history.push(`/glcc/subjects`)
} }
}); });
} else { } else {
studentApply(params).then(response => { studentApply(params).then(response => {
if (response && response.message === "success") { if (response && response.message === "success") {
showNotification("报名成功"); showNotification("报名成功");
// setStudentInfoReset(Math.random()); setStudentInfoReset(Math.random());
setReload(Math.random()); setReload(Math.random());
setLoading(false); setLoading(false);
history.push(`/glcc/student/2`) history.push(`/glcc/subjects`)
} }
}); });
} }
@ -346,12 +346,12 @@ function Apply(props) {
return ( return (
<div className="glcc_student_apply"> <div className="glcc_student_apply">
<img className="glcc-banner" src={banner} alt=''></img> {/* <img className="glcc-banner" src={banner} alt=''></img> */}
<Spin spinning={loading}> <Spin spinning={loading}>
<div className='apply'> <div className='apply'>
<Breadcrumb className='glcc_breadcrumb font-16'> <Breadcrumb className='glcc_breadcrumb font-16'>
<Breadcrumb.Item><Link to="/glcc">开源夏令营</Link></Breadcrumb.Item> <Breadcrumb.Item><Link to="/glcc">开源夏令营</Link></Breadcrumb.Item>
<Breadcrumb.Item><Link to="/glcc/student/2">课题及项目列表</Link></Breadcrumb.Item> <Breadcrumb.Item><Link to="/glcc/subjects">课题及项目列表</Link></Breadcrumb.Item>
<Breadcrumb.Item style={{ color: '#202D40' }}>学生报名</Breadcrumb.Item> <Breadcrumb.Item style={{ color: '#202D40' }}>学生报名</Breadcrumb.Item>
</Breadcrumb> </Breadcrumb>
@ -361,10 +361,10 @@ function Apply(props) {
<div className="head_content">2、本次GLCC夏令营基于GitLink代码托管平台完成编程任务，若您没有平台账户，请先注册后完成课题申请</div> <div className="head_content">2、本次GLCC夏令营基于GitLink代码托管平台完成编程任务，若您没有平台账户，请先注册后完成课题申请</div>
<div className="head_content">3、每位学员最多可申请2个课题，至多有且仅有1个课题可以入选</div> <div className="head_content">3、每位学员最多可申请2个课题，至多有且仅有1个课题可以入选</div>
<div className="head_content">4、建议在提交课题申请，与课题导师邮件沟通，详细了解课题描述、编码任务、技能要求&编程语言、预期产出结果等信息，以便您能够选择最适合的课题</div> <div className="head_content">4、建议在提交课题申请，与课题导师邮件沟通，详细了解课题描述、编码任务、技能要求&编程语言、预期产出结果等信息，以便您能够选择最适合的课题</div>
<div className="head_content">5、提交申请后，请耐心等待，我们会在2022年7月1日公布入围结果。如有任何问题，请添加开源夏令营微信群进行咨询</div> <div className="head_content">5、提交申请后，请耐心等待，我们会在2022年7月1日公布入围结果。如有任何问题，请添加开源夏令营QQ群进行咨询</div>
</div> </div>
<div className="main-tit"> <div className="main-tit">
<img src={studentSvg} /><span className="tit-text">学生报名</span> <img src={studentSvg} alt=''/><span className="tit-text">学生报名</span>
</div> </div>
<div className="form-content"> <div className="form-content">
<div className="form-tit">申请课题</div> <div className="form-tit">申请课题</div>
@ -438,7 +438,7 @@ function Apply(props) {
onChange={handleChange} onChange={handleChange}
> >
{imageUrl ? <img src={imageUrl} alt="avatar" style={{ maxWidth: '100px', maxHeight: '100px' }} /> : userApplyInfo && userApplyInfo.proveAttachmentId ? {imageUrl ? <img src={imageUrl} alt="avatar" style={{ maxWidth: '100px', maxHeight: '100px' }} /> : userApplyInfo && userApplyInfo.proveAttachmentId ?
<div><img src={`${getUrl()}/api/attachments/${userApplyInfo.proveAttachmentId}`} alt='' /></div> : <div> <div><img src={`${getUrl()}/api/attachments/${userApplyInfo.proveAttachmentId}`} alt='' style={{maxWidth: '100px'}}/></div> : <div>
<i className='iconfont icon-tianjiadaohang font-30'></i> <i className='iconfont icon-tianjiadaohang font-30'></i>
<div className="ant-upload-text font-13">请上传学生证明</div> <div className="ant-upload-text font-13">请上传学生证明</div>
</div>} </div>}
@ -456,6 +456,7 @@ function Apply(props) {
[{ required: true, message: "请选择课题名称" }], [{ required: true, message: "请选择课题名称" }],
<Select <Select
placeholder="请选择课题名称" placeholder="请选择课题名称"
dropdownClassName="glcc_select"
showSearch showSearch
disabled={editable ? false : true} disabled={editable ? false : true}
className={editable ? "" : "disabledInput"} className={editable ? "" : "disabledInput"}

16
src/glcc/student/index.scss
View File

@ -155,18 +155,7 @@
border: none; border: none;
color: #202d40; color: #202d40;
} }
.projectLogo {
width: 120px;
height: 120px;
border: 1px dashed #b3c3db;
border-radius: 4px;
line-height: 120px;
text-align: center;
img {
max-width: 100px;
max-height: 100px;
}
}
} }
.ant-cascader-picker { .ant-cascader-picker {
background: none; background: none;
@ -319,6 +308,9 @@
} }
} }
} }
.glcc_select .ant-select-dropdown-menu-item-active:not(.ant-select-dropdown-menu-item-disabled){
background: #e9efff;
}
.glcc_cascader{ .glcc_cascader{
.ant-cascader-menu{ .ant-cascader-menu{
width: 240px; width: 240px;

2
src/modules/login/LoginDialog.css
View File

@ -153,7 +153,7 @@
} }
.zindextest { .zindextest {
z-index: 1000 !important; z-index: 1300 !important;
} }
.MuiModal-root-15 { .MuiModal-root-15 {