2025基本目录文件
This commit is contained in:
parent
c32a1d9485
commit
44d979fe85
|
|
@ -11,6 +11,16 @@ export const Competitions = {
|
|||
path: '/competitions/2024/information/:id',
|
||||
component: '@/pages/metting/information/detail',
|
||||
},
|
||||
{
|
||||
path: '/competitions/2026',
|
||||
component: '@/pages/2026/banner',
|
||||
routes: [
|
||||
{
|
||||
path: '/competitions/2026',
|
||||
component: '@/pages/2026/home',
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
path: '/competitions/2024',
|
||||
component: '@/pages/metting/banner',
|
||||
|
|
|
|||
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
|
@ -2,6 +2,18 @@
|
|||
font-family: YouSheBiaoTiHei;
|
||||
src: url(../../public/font/YouSheBiaoTiHei-2.ttf);
|
||||
}
|
||||
@font-face {
|
||||
font-family: alibabaPuhuiM;
|
||||
src: url(../../public/font/alibabaPuhuiM.ttf);
|
||||
}
|
||||
@font-face {
|
||||
font-family: DouyinSansBold;
|
||||
src: url(../../public/font/DouyinSansBold.ttf);
|
||||
}
|
||||
@font-face {
|
||||
font-family: DingTalk JinBuTi;
|
||||
src: url(../../public/font/DingTalk-JinBuTi.ttf);
|
||||
}
|
||||
.loading {
|
||||
position: fixed !important;
|
||||
top: 50% !important;
|
||||
|
|
|
|||
|
|
@ -98,7 +98,7 @@ const UserModel: UserModelType = {
|
|||
},
|
||||
*getUserInfo({ payload }, { call, put }) {
|
||||
// location.search,,debug:"admin"
|
||||
const response = yield call(getUserInfo, { ...payload})
|
||||
const response = yield call(getUserInfo, { ...payload,debug:"admin"})
|
||||
localStorage.userInfo = JSON.stringify(response);
|
||||
|
||||
yield put({
|
||||
|
|
|
|||
|
|
@ -0,0 +1,112 @@
|
|||
|
||||
import http from './index'
|
||||
import { config } from './info';
|
||||
|
||||
/**
|
||||
* 获取基础信息
|
||||
* @param {*} params
|
||||
* @returns
|
||||
*/
|
||||
export function getBaseInfo(params) {
|
||||
return http({
|
||||
url: `/api/zone/open/zoneKey/${config.zoneKey}`,
|
||||
method: 'get',
|
||||
params
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取会议议程主会场（指定新闻列表）
|
||||
* @param {*} cateId 指定专栏id
|
||||
* @param {*} params
|
||||
* @returns
|
||||
*/
|
||||
export function getDocList(cateId, params) {
|
||||
return http({
|
||||
url: `/api/cms/doc/open/dir/${cateId}/docList`,
|
||||
method: 'get',
|
||||
params
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取会议议程分会场（指定新闻列表内容）
|
||||
* @param {*} cateId 指定专栏id
|
||||
* @param {*} params
|
||||
* @returns
|
||||
*/
|
||||
export function getSubAgenda(cateId, params) {
|
||||
return http({
|
||||
url: `/api/cms/doc/open/dir/${cateId}/docContentList`,
|
||||
method: 'get',
|
||||
params
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* 获取会议指南（专区首页文章列表
|
||||
* @returns
|
||||
*/
|
||||
export function gethomePageDocList() {
|
||||
return http({
|
||||
url: `/api/cms/doc/open/zone/${config.zoneId}/homePageDocList`,
|
||||
method: 'get',
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取与会嘉宾
|
||||
* @returns
|
||||
*/
|
||||
export function getMemberList() {
|
||||
return http({
|
||||
url: `/api/zone/open/${config.zoneId}/member/homePageList`,
|
||||
method: 'get',
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 合作伙伴
|
||||
* @returns
|
||||
*/
|
||||
export function getPartnerList() {
|
||||
return http({
|
||||
url: `/api/zone/open/${config.zoneId}/partners/list`,
|
||||
method: 'get',
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取组织机构
|
||||
* @returns
|
||||
*/
|
||||
export function getOrganization(){
|
||||
return http({
|
||||
url:`/api/zone/open/${config.zoneId}/member/overviewList`,
|
||||
method: 'get',
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取文章详情
|
||||
* @param {*} id 文章id
|
||||
* @returns
|
||||
*/
|
||||
export function getDocDetail(id){
|
||||
return http({
|
||||
url:`/api/cms/doc/open/${id}`,
|
||||
method: 'get',
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取所有栏目列表
|
||||
* @returns
|
||||
*/
|
||||
export function getDirList(){
|
||||
return http({
|
||||
url:`/api/cms/doc/open/zone/${config.zoneId}/dirList`,
|
||||
method: 'get',
|
||||
})
|
||||
}
|
||||
|
|
@ -0,0 +1,45 @@
|
|||
import './index.less';
|
||||
import { useModel , useLocation , Link } from 'umi';
|
||||
import { useEffect } from 'react';
|
||||
import { setDocumentTitle } from '@/utils/util';
|
||||
import { menu } from '../info';
|
||||
import BannerImg from '../img/1@2x.webp';
|
||||
|
||||
function Banner(props) {
|
||||
const location = useLocation();
|
||||
const { mainInfo } = useModel('defaultConfig');
|
||||
|
||||
const matchItem = (item) => {
|
||||
if(location.pathname.indexOf("/track/")>-1){
|
||||
return item.indexOf("/track/") > -1
|
||||
}else{
|
||||
return item === location.pathname
|
||||
}
|
||||
}
|
||||
|
||||
useEffect(()=>{
|
||||
setDocumentTitle(mainInfo?.name);
|
||||
})
|
||||
return(
|
||||
<div className='mainroot'>
|
||||
<div className='mainBanner'>
|
||||
<div className="header">
|
||||
<img src={BannerImg} />
|
||||
<div className='bannerContent'>
|
||||
<ul className='banners'>
|
||||
{
|
||||
menu && menu?.length > 0 && menu.map((i,k)=>{
|
||||
return(
|
||||
<Link to={i.link} key={k} className={`${matchItem(i.link) ? `active` : ``}`}>{i.name}</Link>
|
||||
)
|
||||
})
|
||||
}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{props.children}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
export default Banner;
|
||||
|
|
@ -0,0 +1,69 @@
|
|||
|
||||
.bannerContent{
|
||||
font-family: alibabaPuhuiM;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
height: 98px;
|
||||
background:linear-gradient(89.22deg,rgba(13, 33, 153, 0) 9.76%,rgba(93, 110, 217, 0.51) 45.4%,rgba(255, 255, 255, 0) 99.47%);
|
||||
backdrop-filter:blur(3.4px);
|
||||
.banners{
|
||||
width: 1200px;
|
||||
margin:0px auto;
|
||||
height: 100%;
|
||||
padding:0px 40px;
|
||||
border-radius: 12px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
a{
|
||||
flex: 1;
|
||||
position: relative;
|
||||
font-weight: bold;
|
||||
font-size: 20px;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
&.active{
|
||||
}
|
||||
img{
|
||||
margin-right: 18px;
|
||||
}
|
||||
&:not(:last-child):before{
|
||||
position: absolute;
|
||||
right: 0px;
|
||||
opacity:37%;
|
||||
height:28px;
|
||||
border-left:1px solid #ffffff;
|
||||
top: 0px;
|
||||
content: "";
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.mainroot{
|
||||
background: url('../img/back.png') no-repeat;
|
||||
background-size: 100% 100%;
|
||||
.mainBanner{
|
||||
width: 100%;
|
||||
.header {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
color: #ffffff;
|
||||
position: relative;
|
||||
font-size: 15px;
|
||||
width: 100%;
|
||||
height: calc(100vh - 60px);
|
||||
&>img{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width:1400px) {
|
||||
.mainroot{.mainBanner{.header {
|
||||
&>img{
|
||||
object-fit: cover;
|
||||
}
|
||||
}}}
|
||||
}
|
||||
|
|
@ -0,0 +1,229 @@
|
|||
|
||||
import {useState, useEffect} from 'react';
|
||||
import {
|
||||
Link , useModel
|
||||
}from 'umi';
|
||||
import './index.less';
|
||||
import { getPartnerList , gethomePageDocList , getDocDetail } from '../api.js';
|
||||
import { getCount } from '@/service/user';
|
||||
import Left from '../img/left.png';
|
||||
import Right from '../img/right.png';
|
||||
import Arrow from '../img/arrow.png';
|
||||
import ArrowPurple from '../img/arrowPurple.png';
|
||||
import Diamond from '../img/liu.png';
|
||||
import Number6 from '../img/6@2x.webp';
|
||||
import Number7 from '../img/7@2x.webp';
|
||||
import Number8 from '../img/8@2x.webp';
|
||||
import Team from '../img/team.png';
|
||||
import trackBack from '../img/track.png';
|
||||
import trackBack2 from '../img/track2.png';
|
||||
import Dynamics from '../img/dynamics.png';
|
||||
import Dynamicsicon from '../img/dynamicsicon.png';
|
||||
|
||||
function Home(){
|
||||
const [ partner, setPartner ] = useState([]);
|
||||
const [newsList, setNewsList] = useState([]);
|
||||
const [ visits , setVisits ] = useState(0);
|
||||
const [ counts , setCounts ] = useState({});
|
||||
const { mainInfo } = useModel('defaultConfig');
|
||||
|
||||
useEffect(()=>{
|
||||
getPartner();
|
||||
getNewsList();
|
||||
getCountForEdu();
|
||||
getVisit();
|
||||
},[])
|
||||
const getVisit=()=>{
|
||||
getDocDetail(656).then(res=>{
|
||||
res && setVisits(res?.data?.visits);
|
||||
}).catch(console.error())
|
||||
}
|
||||
|
||||
|
||||
const getCountForEdu=()=>{
|
||||
getCount().then(res=>{
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
const getPartner = () => {
|
||||
getPartnerList().then(res => {
|
||||
setPartner(res.rows);
|
||||
}).catch(console.error())
|
||||
}
|
||||
const getNewsList = () => {
|
||||
gethomePageDocList().then(res => {
|
||||
setNewsList(res.rows)
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
function formatMoney (value){
|
||||
if (value === 0) {
|
||||
return value;
|
||||
};
|
||||
if (value == '' || !value) {
|
||||
return 0;
|
||||
}
|
||||
value = Number(value);
|
||||
if (isNaN(value)) return '';
|
||||
|
||||
return value.toFixed(0).replace(/\B(?=(\d{3})+(?!\d))/g, ',');
|
||||
}
|
||||
return(
|
||||
<div className="page headpage">
|
||||
<div className='part'>
|
||||
<p className="homeSubtitle"><img src={Left} width={16}/>four tracks<img src={Right} width={36}/></p>
|
||||
<p className='homeMaintitle title-animate'><span>赛事介绍</span><span>亮点剧透</span></p>
|
||||
<div className='homeDesc'>面向产业互联网领域规格最高、规模最大、覆盖面最广的年度战略发布会，2019年至今已成功举办六届。大会致力于汇聚全球智慧洞察数字发展新机遇，描绘云、AI、大数据、安全等关键技术的发展蓝图，展示腾讯最新的研究成果、战略规划、技术产品、解决方案。大会还汇聚腾讯数字生态伙伴在助力推进产业数字化和数字产业化过程中沉淀的行业最佳实践，是政府、企业、合作伙伴、开发者以及社会大众了解腾讯全球数字生态的全景式界面。
|
||||
<br/>2025年开源大会将于9月16日-17日举行，本届大会以“智·向远大”为主题，旨在探讨如何以自主创新技术，助力千行百业深挖智能化、国际化新机遇，让智能可用、创新可控，以高效数字化推动产业升级与可持续发展。通过1场主峰会、3场主题峰会以及50+主题专场，荟萃100+大咖嘉宾的智慧分享，解码全球科技、产业发展的新趋势，探索各行各业的最佳实践。通过50+产品功能发布、6000+平米展区，全面解码腾讯云最新能力、腾讯AI产品全新体验，带来前沿科技的真实体验。 </div>
|
||||
<ul className='team highlight-list'>
|
||||
<li className='highlight-card hovered'>
|
||||
<span>01</span>
|
||||
<img src={Number7} height={32} width={32}/>
|
||||
<p className='t-title'><span>权威主办</span></p>
|
||||
<p className='t-desc'>我是大厂赛题的副文案内容占最多我是大厂赛题的副文案内容占最多2行</p>
|
||||
</li>
|
||||
<li className='highlight-card'>
|
||||
<span>02</span>
|
||||
<img src={Number6} height={32} width={32}/>
|
||||
<p className='t-title'><span>大厂赛题</span></p>
|
||||
<p className='t-desc'>我是大厂赛题的副文案内容占最多我是大厂赛题的副文案内容占最多2行</p>
|
||||
</li>
|
||||
<li className='highlight-card'>
|
||||
<span>03</span>
|
||||
<img src={Number8} height={32} width={32}/>
|
||||
<p className='t-title'><span>高额奖金</span></p>
|
||||
<p className='t-desc'>我是大厂赛题的副文案内容占最多我是大厂赛题的副文案内容占最多2行</p>
|
||||
</li>
|
||||
<li className='highlight-card'>
|
||||
<span>04</span>
|
||||
<img src={Number6} height={32} width={32}/>
|
||||
<p className='t-title'><span>XXXXXX</span></p>
|
||||
<p className='t-desc'>我是大厂赛题的副文案内容占最多我是大厂赛题的副文案内容占最多2行</p>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div className='part'>
|
||||
<p className="homeSubtitle"><img src={Left} width={16}/>four tracks<img src={Right} width={36}/></p>
|
||||
<p className='homeMaintitle title-animate'><span>两大方向</span><span>四个赛道</span></p>
|
||||
|
||||
</div>
|
||||
|
||||
<div className='part'>
|
||||
<p className="homeSubtitle"><img src={Left} width={16}/>four tracks<img src={Right} width={36}/></p>
|
||||
<p className='homeMaintitle title-animate'><span>赛事日程</span><span>抢先知晓</span></p>
|
||||
<div className='track'>
|
||||
<li className='direction-card'>
|
||||
<div className='trackContent'>
|
||||
<div className='flex1'>
|
||||
<p className='tracktitle'><span>泛在操作系统方向</span></p>
|
||||
<p style={{opacity:"0.71"}}>面向万物互联时代，研究跨设备、跨场景的操作系统技术与生态构建</p>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</div>
|
||||
<div className='track'>
|
||||
<li>
|
||||
<img src={trackBack} alt="" className='backimg'/>
|
||||
<div className='trackContent'>
|
||||
<div className='flex1'>
|
||||
<p className='tracktitle'><span>开源项目贡献赛道</span></p>
|
||||
<p style={{opacity:"0.71"}}>向真实开源项目提交贡献，用代码质量和社区反馈衡量实力。</p>
|
||||
</div>
|
||||
<a className='applicationBtn shine-button' href='/competitions/2026/track/675'>立即参与<img src={ArrowPurple} width={19}/></a>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<img src={trackBack2} alt="" className='backimg'/>
|
||||
<div className='trackContent'>
|
||||
<div className='flex1'>
|
||||
<p className='tracktitle'><span>开源人物挑战赛道</span></p>
|
||||
<p style={{opacity:"0.71"}}>聚焦开源领域杰出贡献者，分享技术布道与生态建设的实践经验。</p>
|
||||
</div>
|
||||
<a className='applicationBtn shine-button' href='/competitions/2026/track/677'>立即参与<img src={ArrowPurple} width={19}/></a>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<img src={trackBack2} alt="" className='backimg'/>
|
||||
<div className='trackContent'>
|
||||
<div className='flex1'>
|
||||
<p className='tracktitle'><span>开源案例教学赛道</span></p>
|
||||
<p style={{opacity:"0.71"}}>提炼优秀开源项目实践经验，甄选优质开源实战案例，打造可复用的技术教学案例库。</p>
|
||||
</div>
|
||||
<a className='applicationBtn shine-button' href='/competitions/2026/track/679'>立即参与<img src={ArrowPurple} width={19}/></a>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<img src={trackBack} alt="" className='backimg'/>
|
||||
<div className='trackContent'>
|
||||
<div className='flex1'>
|
||||
<p className='tracktitle'><span>开源代码评注赛道</span></p>
|
||||
<p style={{opacity:"0.71"}}>精读优秀代码，撰写详尽评注与技术分析，助力开发者掌握编程范式与工程实践精髓。</p>
|
||||
</div>
|
||||
<a className='applicationBtn shine-button' href='/competitions/2026/track/678'>立即参与<img src={ArrowPurple} width={19}/></a>
|
||||
</div>
|
||||
</li>
|
||||
</div>
|
||||
</div>
|
||||
<div className='part'>
|
||||
<p className="homeSubtitle"><img src={Left} width={16}/>Event Updates<img src={Right} width={36}/></p>
|
||||
<p className='homeMaintitle title-animate'><span>赛事动态</span><span>不容错过</span></p>
|
||||
{
|
||||
newsList && newsList.length > 0 &&
|
||||
<div className='dynamics'>
|
||||
<ul className='dynamicsNews'>
|
||||
{ newsList.map((i, k) => {
|
||||
return k < 3 ?
|
||||
<li className='news-card-hover'>
|
||||
<p className='uper'><img src={Dynamicsicon} width={26}/>{ i.name }</p>
|
||||
<p className='under'>
|
||||
<span>{i.publishTime}</span>
|
||||
<Link to={`/competitions/2026/information/${ i.id }`} className='applicationBtn arrow-hover'>探索更多动态<img src={Arrow} width={19}/></Link>
|
||||
</p>
|
||||
</li>
|
||||
: ''
|
||||
})}
|
||||
</ul>
|
||||
<div className='dynamicsImg'>
|
||||
<img src={Dynamics} alt="" />
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
<a className='applicationBtn hoverBtn shine-button' href="/competitions/2026/information" style={{marginTop:32}}>不容错过<img src={Arrow} width={19}/></a>
|
||||
</div>
|
||||
<div className='part'>
|
||||
<p className="homeSubtitle"><img src={Left} width={16}/>partner<img src={Right} width={36}/></p>
|
||||
<p className='homeMaintitle title-animate'><span>合作伙伴</span><span>四字文案</span></p>
|
||||
<div className="partner-content">
|
||||
{
|
||||
partner.map((e, k) => {
|
||||
return (
|
||||
e.zonePartnersList.length > 0 && e.typeName.indexOf("高校") === -1 ?
|
||||
<div className="partner-type partner-hover" key={ k }>
|
||||
<div className="type-title">
|
||||
<span>{ e.typeName }</span>
|
||||
</div>
|
||||
<div className="type-content">
|
||||
{
|
||||
e.zonePartnersList.map((i, subK) => {
|
||||
return <a key={ subK } href={ i.link } target="_blank">
|
||||
<div className="partner-item">
|
||||
<img src={ i.logo } alt=""/>
|
||||
</div>
|
||||
</a>
|
||||
})
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
:''
|
||||
)
|
||||
})
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
export default Home;
|
||||
|
|
@ -0,0 +1,638 @@
|
|||
|
||||
.part{
|
||||
text-align: center;
|
||||
width: 1600px;
|
||||
}
|
||||
.page.headpage {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
.banner {
|
||||
height: 100vh;
|
||||
width: 100%;
|
||||
position: relative;
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
// object-fit: cover;
|
||||
}
|
||||
}
|
||||
.homeMaintitle{
|
||||
font-size: 48px;
|
||||
position: relative;
|
||||
margin: 0px auto;
|
||||
width: fit-content;
|
||||
height: 58px;
|
||||
line-height: 58px;
|
||||
margin-top: -15px;
|
||||
font-family: DouyinSansBold;
|
||||
img{
|
||||
width: 12px;
|
||||
position: absolute;
|
||||
&:first-child{
|
||||
left: -12px;
|
||||
}
|
||||
&:last-child{
|
||||
bottom: 0px;
|
||||
}
|
||||
}
|
||||
span{
|
||||
margin:0px 16px;
|
||||
font-weight:700;
|
||||
color:#091221;
|
||||
font-size:48px;
|
||||
position: relative;
|
||||
&:last-child::after{
|
||||
content: "";
|
||||
left: -21px;
|
||||
top: 24px;
|
||||
position: absolute;
|
||||
width:10px;
|
||||
height:10px;
|
||||
background:#091221;
|
||||
border-radius:2px;
|
||||
}
|
||||
}
|
||||
text-align: center;
|
||||
}
|
||||
.homeSubtitle{
|
||||
text-align: center;
|
||||
position: relative;
|
||||
font-size: 28px;
|
||||
font-family: alibabaPuhuiM;
|
||||
color: rgba(9, 18, 33, 0.09);
|
||||
text-transform: uppercase;
|
||||
font-weight: 500;
|
||||
margin-bottom: 0px;
|
||||
margin-top: 90px;
|
||||
img{
|
||||
margin-top: -4px;
|
||||
&:first-child{
|
||||
margin-right: 2px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.homeDesc{
|
||||
line-height: 40px;
|
||||
letter-spacing: 1px;
|
||||
margin-top: 37px;
|
||||
text-align: left;
|
||||
font-family:alibabaPuhuiM;
|
||||
font-weight:500;
|
||||
color:#1d1e1f;
|
||||
font-size:17px;
|
||||
}
|
||||
.applicationBtn{
|
||||
margin-top:20px;
|
||||
height: 44px;
|
||||
line-height: 44px;
|
||||
background: linear-gradient( 103deg, #5950F3 0%, #6B16CA 100%);
|
||||
border-radius: 5px 5px 5px 5px;
|
||||
padding:0px 24px;
|
||||
color: #fff;
|
||||
font-weight: 400;
|
||||
font-size: 20px;
|
||||
display: inline-block;
|
||||
img{
|
||||
margin:0px 0px 4px 15px;
|
||||
}
|
||||
}
|
||||
.numbersData{
|
||||
display: flex;
|
||||
padding:50px 0px;
|
||||
position: relative;
|
||||
&::before{
|
||||
content: "";
|
||||
height: 3px;
|
||||
background: linear-gradient( 103deg, #5950F3 0%, #6B16CA 100%);
|
||||
left: calc(1200px / 6 + 10px);
|
||||
right: calc(1200px / 6 - 10px);
|
||||
position: absolute;
|
||||
top:50%;
|
||||
margin-top: 3.5px;
|
||||
}
|
||||
li{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex: 1;
|
||||
span.number{
|
||||
font-family: YouSheBiaoTiHei;
|
||||
font-weight: 400;
|
||||
font-size: 28px;
|
||||
color: #040E29;
|
||||
line-height: 40px;
|
||||
em{
|
||||
font-size: 50px;
|
||||
background: -webkit-linear-gradient(103deg, #5950F3 0%, #6B16CA 100%);
|
||||
background: linear-gradient( 103deg, #5950F3 0%, #6B16CA 100%);
|
||||
-webkit-background-clip: text;
|
||||
background-clip: text;
|
||||
-webkit-text-fill-color: transparent; /* 针对WebKit浏览器 */
|
||||
color: transparent; /* 兼容其他浏览器 */
|
||||
margin-right:12px;
|
||||
padding:0px 10px;
|
||||
font-style: normal;
|
||||
}
|
||||
}
|
||||
span.btn{
|
||||
width: 140px;
|
||||
height: 50px;
|
||||
line-height: 46px;
|
||||
background: #F6F7FA;
|
||||
box-shadow: 0px 0px 10px 1px rgba(7,70,165,0.11);
|
||||
border-radius: 9px 9px 9px 9px;
|
||||
border: 2px solid #FFFFFF;
|
||||
font-weight: bold;
|
||||
font-size: 20px;
|
||||
color: #040E29;
|
||||
text-align: center;
|
||||
}
|
||||
&>.line{
|
||||
margin:40px 0px 27px;
|
||||
width: 100%;
|
||||
position: relative;
|
||||
text-align: center;
|
||||
height: 20px;
|
||||
img{
|
||||
position: absolute;
|
||||
margin-left: -12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.team{
|
||||
display: flex;
|
||||
margin-top: 40px;
|
||||
width: 100%;
|
||||
padding-left: 0px;
|
||||
li{
|
||||
height: 343px;
|
||||
padding:30px 30px 34px 30px;
|
||||
box-sizing: border-box;
|
||||
border-radius: 20px;
|
||||
flex: 1 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 0;
|
||||
margin-right: 25px;
|
||||
transition: 0.2s;
|
||||
color: #fff;
|
||||
text-align: left;
|
||||
position: relative;
|
||||
&>span{
|
||||
margin-bottom: auto;
|
||||
font-family:DingTalk JinBuTi;
|
||||
font-size:18px;
|
||||
}
|
||||
&:nth-child(n){
|
||||
background:linear-gradient(180deg,#6058f5 0%,#6058f5 100%);
|
||||
&::after{
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
content: "";
|
||||
left: 0;
|
||||
top: 0;
|
||||
background-image: url(../img/5@2x.webp);
|
||||
background-position: right bottom;
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100%;
|
||||
}
|
||||
}
|
||||
&:nth-child(2n){
|
||||
background:linear-gradient(180deg,#1466ea 0%,#1466ea 100%);
|
||||
&::after{
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
content: "";
|
||||
left: 0;
|
||||
top: 0;
|
||||
background-image: url(../img/5@2x.webp);
|
||||
background-position: right;
|
||||
background-image: url(../img/4@2x.webp);
|
||||
background-position: right bottom;
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100%;
|
||||
}
|
||||
}
|
||||
&:nth-child(3n){
|
||||
background:linear-gradient(180deg,#6a51dd 0%,#6a51dd 100%);
|
||||
&::after{
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
content: "";
|
||||
left: 0;
|
||||
top: 0;
|
||||
background-image: url(../img/2@2x.webp);
|
||||
background-repeat: no-repeat;
|
||||
background-position: right bottom;
|
||||
background-size: 100%;
|
||||
}
|
||||
}
|
||||
&:nth-child(4n){
|
||||
background:linear-gradient(180deg,#1349cb 0%,#0a5ced 100%);
|
||||
&::after{
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
content: "";
|
||||
left: 0;
|
||||
top: 0;
|
||||
background-image: url(../img/3@2x.webp);
|
||||
background-position: right bottom;
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100%;
|
||||
}
|
||||
}
|
||||
&:last-child{
|
||||
margin-right: 0px;
|
||||
}
|
||||
&.hovered{
|
||||
flex: 2 1;
|
||||
}
|
||||
.t-title{
|
||||
margin-bottom: 20px;
|
||||
margin-top: 14px;
|
||||
text-align: left;
|
||||
span{
|
||||
display: block;
|
||||
font-weight: 500;
|
||||
font-size: 22px;
|
||||
line-height: 30px;
|
||||
}
|
||||
}
|
||||
.t-desc{
|
||||
font-weight: 400;
|
||||
font-size: 15px;
|
||||
line-height: 28px;
|
||||
height: 56px;
|
||||
text-align: left;
|
||||
word-break: break-all;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 2;
|
||||
opacity: 0.9;
|
||||
}
|
||||
.t-time{
|
||||
font-weight: 400;
|
||||
font-size: 15px;
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
}
|
||||
.track{
|
||||
margin-top: 18px;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
margin-bottom: 42px;
|
||||
li{
|
||||
list-style-type: none;
|
||||
height: 175px;
|
||||
margin: 39px 40px 0px 0px;
|
||||
background: linear-gradient( 92deg, #9356E4 0%, #5D3E9A 100%);
|
||||
border-radius: 12px;
|
||||
box-sizing: border-box;
|
||||
color: #fff;
|
||||
text-align: left;
|
||||
width:calc( 50% - 20px);
|
||||
font-weight: 400;
|
||||
font-size: 15px;
|
||||
color: #FFFFFF;
|
||||
line-height: 28px;
|
||||
position: relative;
|
||||
.backimg{
|
||||
position: absolute;
|
||||
right: 0;
|
||||
height: 100%;
|
||||
z-index: 0;
|
||||
width: 80%;
|
||||
}
|
||||
&:nth-child(2n){
|
||||
margin-right: 0px;
|
||||
}
|
||||
&:nth-child(2){
|
||||
background: linear-gradient( 92deg, #4779EC 0%, #11317A 100%);
|
||||
}
|
||||
&:nth-child(3){
|
||||
background: linear-gradient( 92deg, #088592 0%, #0D569C 100%);
|
||||
}
|
||||
&:nth-child(4){
|
||||
background: linear-gradient( 92deg, #736CF0 0%, #3C1E85 100%);
|
||||
}
|
||||
.trackContent{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding:28px 27px 28px 39px ;
|
||||
.money{
|
||||
font-weight: 400;
|
||||
font-size: 34px;
|
||||
color: #FFFFFF;
|
||||
line-height: 40px;
|
||||
height: 40px;
|
||||
letter-spacing: 2px;
|
||||
font-family:'Alimama ShuHeiTi';
|
||||
width: 228px;
|
||||
text-align: right;
|
||||
&>span{
|
||||
font-size: 17px;
|
||||
}
|
||||
}
|
||||
.tracktitle{
|
||||
font-weight: 400;
|
||||
font-size: 22px;
|
||||
color: #FFFFFF;
|
||||
line-height: 38px;
|
||||
height: 38px;
|
||||
margin-bottom: 22px;
|
||||
span{
|
||||
font-weight: bold;
|
||||
font-size: 26px;
|
||||
}
|
||||
}
|
||||
.applicationBtn{
|
||||
background: #fff;
|
||||
color: #6233DE;
|
||||
margin-left: 66px;
|
||||
// display: none;
|
||||
margin-top: 0px;
|
||||
}
|
||||
&:hover{
|
||||
.applicationBtn{display: block;}
|
||||
.money{display: none;}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.flex1{
|
||||
flex: 1;
|
||||
}
|
||||
.dynamics{
|
||||
display: flex;
|
||||
margin-top:60px;
|
||||
justify-content: space-between;
|
||||
.dynamicsNews{
|
||||
width: 40%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
li{
|
||||
background: #F6F7FA;
|
||||
box-shadow: 0px 0px 10px 1px rgba(7,70,165,0.11);
|
||||
border-radius: 13px;
|
||||
border: 2px solid #FFFFFF;
|
||||
text-align: left;
|
||||
padding:22px 12px 18px 38px;
|
||||
.uper{
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
color: #040E29;
|
||||
line-height: 26px;
|
||||
height: 48px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 2;
|
||||
img{
|
||||
margin-right: 10px;
|
||||
float: left;
|
||||
margin-top:3px ;
|
||||
}
|
||||
}
|
||||
.under{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-weight: 400;
|
||||
font-size: 14px;
|
||||
color: #040E29;
|
||||
height: 20px;
|
||||
margin-bottom: 0px;
|
||||
.applicationBtn{
|
||||
height: 36px;
|
||||
line-height: 36px;
|
||||
font-weight: 400;
|
||||
font-size: 15px;
|
||||
padding:0px 11px;
|
||||
margin-left: auto;
|
||||
margin-top: 0px;
|
||||
opacity: 0;
|
||||
transition: 0.8s;
|
||||
img{
|
||||
margin-bottom: 2px;
|
||||
}
|
||||
}
|
||||
}
|
||||
&:hover .applicationBtn{
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
.dynamicsImg{
|
||||
width: calc( 60% - 32px);
|
||||
img{
|
||||
width: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
border-radius: 2px;
|
||||
}
|
||||
}
|
||||
.partner-content {
|
||||
margin-top: 10px;
|
||||
margin-bottom: 50px;
|
||||
.partner-type {
|
||||
width:fit-content;
|
||||
.type-title {
|
||||
line-height: 28px;
|
||||
font-weight: bold;
|
||||
font-size: 20px;
|
||||
color: #151313;
|
||||
letter-spacing: 5px;
|
||||
margin-bottom: 30px;
|
||||
text-align: left;
|
||||
span{
|
||||
position: relative;
|
||||
&::before{
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
height: 2px;
|
||||
width: 32px;
|
||||
content: "";
|
||||
bottom:-7px;
|
||||
background: linear-gradient( 90deg, #5374B4 0%, #853CB8 100%);
|
||||
}
|
||||
}
|
||||
}
|
||||
.type-content {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
div {
|
||||
margin-right: 42px;
|
||||
padding: 6px;
|
||||
background-color:#ffffff;
|
||||
border-radius:4px;
|
||||
box-shadow:0px 0px 6px rgba(28, 48, 175, 0.03);
|
||||
height: 83px;
|
||||
width: 163px;
|
||||
line-height: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-bottom: 35px;
|
||||
border:1px solid #fff;
|
||||
&:hover{
|
||||
border-color: #6233DE;
|
||||
}
|
||||
}
|
||||
a{
|
||||
&:nth-child(6n) div{
|
||||
margin-right: 0px;
|
||||
}
|
||||
}
|
||||
img {
|
||||
max-height: 55px;
|
||||
max-width: 130px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.hoverBtn:hover{
|
||||
opacity: 0.77;
|
||||
}
|
||||
|
||||
.title-animate {
|
||||
animation: titleFadeIn 0.8s ease-out forwards;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
@keyframes titleFadeIn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translateY(20px);
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
|
||||
.shine-button {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.shine-button::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: -100%;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.4), transparent);
|
||||
animation: shine 3s infinite;
|
||||
}
|
||||
|
||||
@keyframes shine {
|
||||
0% {
|
||||
left: -100%;
|
||||
}
|
||||
100% {
|
||||
left: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.arrow-hover {
|
||||
img {
|
||||
transition: transform 0.3s ease;
|
||||
}
|
||||
&:hover img {
|
||||
transform: translateX(5px);
|
||||
}
|
||||
}
|
||||
|
||||
.news-card-hover {
|
||||
transition: all 0.3s ease;
|
||||
&:hover {
|
||||
transform: translateY(-5px);
|
||||
box-shadow: 0px 5px 20px 1px rgba(7,70,165,0.2);
|
||||
}
|
||||
}
|
||||
|
||||
.partner-hover {
|
||||
.partner-item {
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.direction-card {
|
||||
transition: all 0.3s ease;
|
||||
&:hover {
|
||||
transform: translateY(-5px);
|
||||
box-shadow: 0px 5px 20px 1px rgba(7,70,165,0.2);
|
||||
}
|
||||
}
|
||||
|
||||
.highlight-01, .highlight-02, .highlight-03, .highlight-04 {
|
||||
position: relative;
|
||||
padding-left: 30px;
|
||||
&::before {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 50%;
|
||||
font-weight: bold;
|
||||
font-size: 14px;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.highlight-01::before {
|
||||
content: '1';
|
||||
background: linear-gradient(103deg, #5950F3 0%, #6B16CA 100%);
|
||||
}
|
||||
|
||||
.highlight-02::before {
|
||||
content: '2';
|
||||
background: linear-gradient(103deg, #4779EC 0%, #11317A 100%);
|
||||
}
|
||||
|
||||
.highlight-03::before {
|
||||
content: '3';
|
||||
background: linear-gradient(103deg, #088592 0%, #0D569C 100%);
|
||||
}
|
||||
|
||||
.highlight-04::before {
|
||||
content: '4';
|
||||
background: linear-gradient(103deg, #736CF0 0%, #3C1E85 100%);
|
||||
}
|
||||
|
||||
.partner-item {
|
||||
transition: all 0.3s ease;
|
||||
&:hover {
|
||||
transform: scale(1.05);
|
||||
box-shadow: 0px 0px 15px rgba(98, 51, 222, 0.2);
|
||||
}
|
||||
}
|
||||
}
|
||||
@media screen and (max-width:1600px) {
|
||||
.part{
|
||||
width: 1400px;
|
||||
}
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 436 B |
Binary file not shown.
|
After Width: | Height: | Size: 660 B |
Binary file not shown.
|
After Width: | Height: | Size: 972 B |
Binary file not shown.
|
After Width: | Height: | Size: 217 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 928 B |
Binary file not shown.
|
After Width: | Height: | Size: 328 B |
Binary file not shown.
|
After Width: | Height: | Size: 1.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 21 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 212 B |
Binary file not shown.
|
After Width: | Height: | Size: 534 B |
Binary file not shown.
|
After Width: | Height: | Size: 304 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 196 B |
Binary file not shown.
|
After Width: | Height: | Size: 2.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 372 B |
Binary file not shown.
|
After Width: | Height: | Size: 7.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 36 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 24 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 13 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 22 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 742 B |
Binary file not shown.
|
After Width: | Height: | Size: 52 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 590 B |
Binary file not shown.
|
After Width: | Height: | Size: 794 B |
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 368 B |
Binary file not shown.
|
After Width: | Height: | Size: 517 B |
Binary file not shown.
|
After Width: | Height: | Size: 1.4 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 998 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.7 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 139 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 724 B |
Binary file not shown.
|
After Width: | Height: | Size: 2.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 46 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.8 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.7 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 998 B |
Binary file not shown.
|
After Width: | Height: | Size: 1.8 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 29 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 9.7 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 619 B |
Binary file not shown.
|
After Width: | Height: | Size: 3.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 86 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 127 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 398 B |
Binary file not shown.
|
After Width: | Height: | Size: 28 KiB |
|
|
@ -0,0 +1,41 @@
|
|||
import axios from 'axios';
|
||||
import { message , notification } from 'antd';
|
||||
|
||||
function beforeFetch(){
|
||||
if (window.location.href.indexOf('localhost') < 0) {
|
||||
axios.defaults.withCredentials = true;
|
||||
}
|
||||
|
||||
const service = axios.create({
|
||||
baseURL: 'https://gateway.gitlink.org.cn',
|
||||
timeout: 1800000, // 请求超时时间
|
||||
});
|
||||
|
||||
service.interceptors.response.use(
|
||||
response => {
|
||||
const res = response||{};
|
||||
if(res && res.data && res.data.code === 404){
|
||||
message.error("错误链接！");
|
||||
window.location.href = '/nopage';
|
||||
return Promise.reject('error');
|
||||
}else if(res && res.data && res.data.code === 500){
|
||||
message.error(res.data.msg);
|
||||
return Promise.reject('error');
|
||||
}else{
|
||||
return response.data;
|
||||
}
|
||||
},
|
||||
error => {
|
||||
console.log(error);
|
||||
// notification.open({
|
||||
// message: "提示",
|
||||
// description: error.message,
|
||||
// });
|
||||
// return Promise.reject(error);
|
||||
}
|
||||
)
|
||||
return service;
|
||||
}
|
||||
|
||||
const service = beforeFetch();
|
||||
export default service;
|
||||
|
|
@ -0,0 +1,62 @@
|
|||
|
||||
export const menu = [
|
||||
{
|
||||
name: '大赛首页',
|
||||
link: '/competitions/2026',
|
||||
},
|
||||
{
|
||||
name: '组织架构',
|
||||
link: '/competitions/2026/organization',
|
||||
},
|
||||
{
|
||||
name: '赛程赛制',
|
||||
link: '/competitions/2026/track/675',
|
||||
},
|
||||
{
|
||||
name: '赛事中心',
|
||||
link: '/competitions/2026/track/675',
|
||||
},
|
||||
{
|
||||
name: '赛事动态',
|
||||
link: '/competitions/2026/information',
|
||||
},
|
||||
{
|
||||
name: '培训答疑',
|
||||
link: '/competitions/2026/information',
|
||||
}
|
||||
]
|
||||
|
||||
export const defaultPage = {
|
||||
'/register': 300,
|
||||
'/contact': 299
|
||||
}
|
||||
|
||||
export const information = {
|
||||
title: '大会资讯',
|
||||
desc: '方便您第一时间收集各会议论坛信息，解读大会通知资讯',
|
||||
category: [
|
||||
{
|
||||
title: '赛事安排',
|
||||
eng: 'Event arrangement',
|
||||
anchor: 'forum',
|
||||
},
|
||||
{
|
||||
title: '赛事动态',
|
||||
eng: 'Event dynamics',
|
||||
anchor: 'guide',
|
||||
},
|
||||
{
|
||||
title: '赛题发布',
|
||||
eng: 'Competition question release',
|
||||
anchor: 'notice',
|
||||
}
|
||||
]
|
||||
}
|
||||
export const config = {
|
||||
// zoneKey: 'kydhgw',
|
||||
// zoneId: 6,
|
||||
zoneKey:"KYDS7th",
|
||||
zoneId:11
|
||||
}
|
||||
|
||||
export const hidenMemberType = ['与会嘉宾', '院士嘉宾']
|
||||
|
|
@ -0,0 +1,69 @@
|
|||
import './index.less'
|
||||
import RenderHtml from '@/components/RenderHtml'
|
||||
import { useLocation, useParams } from 'umi';
|
||||
import { Base64 } from 'js-base64';
|
||||
import { Breadcrumb , Divider } from 'antd';
|
||||
import views from '../img/views.png'
|
||||
import { useEffect } from 'react';
|
||||
import { getDocDetail } from '../api'
|
||||
import { useState } from 'react';
|
||||
import { defaultPage } from '../info';
|
||||
import moment from 'moment';
|
||||
|
||||
|
||||
function Detail() {
|
||||
const location = useLocation();
|
||||
const { id } = location.pathname.includes('information') ? useParams() : { id: defaultPage[location.pathname] };
|
||||
const [ detail, setDetail ] = useState({});
|
||||
const [ cmsDir , setCmsDir ] = useState(undefined);
|
||||
const [ content , setContent]=useState(undefined);
|
||||
|
||||
useEffect(()=>{
|
||||
getDetail();
|
||||
},[id])
|
||||
|
||||
const getDetail = () => {
|
||||
getDocDetail(id).then(res => {
|
||||
setDetail(res.data);
|
||||
setCmsDir(res.data.cmsDir);
|
||||
setContent(Base64.decode(res.data.content));
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
return <div className="detail">
|
||||
{
|
||||
detail &&
|
||||
<div className="detail-content">
|
||||
{
|
||||
location.pathname.includes('information') && <Breadcrumb separator=">">
|
||||
{ cmsDir && <Breadcrumb.Item href="/competitions/2024/information">{ cmsDir.name }</Breadcrumb.Item> }
|
||||
<Breadcrumb.Item>正文</Breadcrumb.Item>
|
||||
</Breadcrumb>
|
||||
}
|
||||
<div className="detail-info">
|
||||
{
|
||||
location.pathname.includes('information') && <>
|
||||
<div className="info-text-main">
|
||||
<p className="info-name">{ detail.name }</p>
|
||||
<ul className="info-ul-value">
|
||||
<li>发布于{ moment(detail.publishTime).format("YYYY-MM-DD") }</li>
|
||||
{ detail.visits && <li><img src={ views } alt="" className="mr5" />{ detail.visits }</li> }
|
||||
</ul>
|
||||
</div>
|
||||
<Divider dashed={true} />
|
||||
</>
|
||||
}
|
||||
{
|
||||
content ?
|
||||
<RenderHtml className="informations_detail imageLayerParent" value={ content } url={ location } linkReplace={false}/>
|
||||
:
|
||||
<span>暂无详情~</span>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
}
|
||||
export default Detail
|
||||
|
|
@ -0,0 +1,192 @@
|
|||
import './index.less'
|
||||
import { Spin, Divider , Input } from 'antd';
|
||||
import { useState , useEffect } from 'react';
|
||||
import { information } from '../info';
|
||||
import { getDocList } from '../api'
|
||||
import empty from '../img/empty.png';
|
||||
import { useModel , Link } from 'umi';
|
||||
import Left from '../img/left.png';
|
||||
import Right from '../img/right.png';
|
||||
import SubBanner from '../img/subBanner.png';
|
||||
import Search from '../img/search.png';
|
||||
import { throttle } from '@/utils/mettingUtil';
|
||||
|
||||
function Information() {
|
||||
const [ isSpin , setIsSpin ] = useState(false);
|
||||
const [ informationList , setInformationList ] = useState([]);
|
||||
const { dirList } = useModel('defaultConfig');
|
||||
const [ tabKey , setTabKey ] = useState(0);
|
||||
const [ positionNum ,setPositionNum ] = useState([]);
|
||||
const [ showAnchor , setShowAnchor ] = useState(false);
|
||||
const[ title ,setTitle] = useState(undefined);
|
||||
const[ searchTitle ,setSearchTitle] = useState(undefined);
|
||||
|
||||
useEffect(()=>{
|
||||
if (location.pathname === '/competitions/2024/information') {
|
||||
window.addEventListener('scroll', throttleHandleScroll);
|
||||
return ComponentWillUnmount;
|
||||
} else {
|
||||
ComponentWillUnmount()
|
||||
}
|
||||
},[location.pathname,positionNum])
|
||||
|
||||
function ComponentWillUnmount() {
|
||||
window.removeEventListener("scroll", throttleHandleScroll);
|
||||
}
|
||||
|
||||
|
||||
function handleScroll() {
|
||||
let scrollTop = document.documentElement.scrollTop; //滚动条滚动高度
|
||||
setShowAnchor(scrollTop > 362);
|
||||
if(scrollTop < 362) setTabKey(0);
|
||||
if(positionNum && positionNum.length>0){
|
||||
for(let i=0;i<positionNum.length;i++){
|
||||
if(scrollTop <= positionNum[i]+360){
|
||||
setTabKey(i);
|
||||
return;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const throttleHandleScroll = throttle(handleScroll, 100)
|
||||
|
||||
useEffect(()=>{
|
||||
if ( JSON.stringify(dirList) !== '{}' ) {
|
||||
getAllLists();
|
||||
}
|
||||
let anchor = document.getElementsByClassName("anchor");
|
||||
if(anchor && anchor.length>1){
|
||||
let arr = [];
|
||||
for(let i=0;i<anchor.length;i++){
|
||||
arr.push(anchor[i].getBoundingClientRect().top)
|
||||
}
|
||||
setPositionNum(arr);
|
||||
}
|
||||
},[dirList,searchTitle])
|
||||
|
||||
const getAllLists = () => {
|
||||
setIsSpin(true);
|
||||
const requestList = [];
|
||||
information.category.map(e => {
|
||||
dirList[e.title] && requestList.push(getList(dirList[e.title], e.anchor,searchTitle))
|
||||
})
|
||||
Promise.all(requestList).then(res => {
|
||||
let totalList = {}
|
||||
res.map(e => {
|
||||
totalList[e.name] = e.list
|
||||
})
|
||||
setInformationList(totalList)
|
||||
setIsSpin(false)
|
||||
})
|
||||
}
|
||||
|
||||
const getList = (id, name,title) => {
|
||||
return new Promise((resolve, reject) => {
|
||||
getDocList(id).then(res => {
|
||||
let list = res.rows;
|
||||
list = title ? list.filter(i=>i.name.indexOf(title)>-1 || i.summary.indexOf(title)>-1) : list;
|
||||
list.forEach(e => {
|
||||
if (e.publishTime) {
|
||||
let time = e.publishTime.split('/');
|
||||
e.date1 = `${time[0]}年${time[1]}月`;
|
||||
e.date2 = `${time[2]}日`;
|
||||
} else {
|
||||
e.date1 = e.date2 = '-'
|
||||
}
|
||||
})
|
||||
resolve({ name, list: list });
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
const scrollToAnchor = (anchorName) => {
|
||||
if (anchorName) {
|
||||
let anchorElement = document.getElementById(anchorName);
|
||||
if(anchorElement) { anchorElement.scrollIntoView({block: 'start', behavior: 'smooth'}); }
|
||||
}
|
||||
}
|
||||
|
||||
return <div className="information">
|
||||
{/* {
|
||||
information.category &&
|
||||
<div className="tab">
|
||||
<div className='tabPanel'>
|
||||
{
|
||||
information.category.map((e, k) => {
|
||||
return <div key={ k } onClick={() => { scrollToAnchor(e.anchor);setTabKey(k) }} className={`tab-item ${k===tabKey?"active":""}`}>{ e.title }</div>
|
||||
})
|
||||
}
|
||||
<Input
|
||||
className="searchInput"
|
||||
value={ title }
|
||||
// onBlur={ (e) => { setTitle(e.target.value) } }
|
||||
onChange={ (e) => { setTitle(e.target.value) } }
|
||||
onPressEnter={()=>{setSearchTitle(title)}}
|
||||
placeholder="请搜索文章标题关键词"
|
||||
suffix={<img src={Search} width={16}/>}
|
||||
style={{width:"213px"}}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
} */}
|
||||
<div className="tabPanel">
|
||||
<Input
|
||||
className="searchInput"
|
||||
value={ title }
|
||||
// onBlur={ (e) => { setTitle(e.target.value) } }
|
||||
onChange={ (e) => { setTitle(e.target.value) } }
|
||||
onPressEnter={()=>{setSearchTitle(title)}}
|
||||
placeholder="请搜索文章标题关键词"
|
||||
suffix={<img src={Search} width={16}/>}
|
||||
style={{width:"213px"}}
|
||||
/>
|
||||
</div>
|
||||
{
|
||||
information.category && showAnchor &&
|
||||
<div className='anchorPart' style={{top:362,left:(document.documentElement.clientWidth-1200)/2-125}}>
|
||||
{
|
||||
information.category.map((e,k)=>{
|
||||
return <li key={ k } className={`${k===tabKey?"active":""}`} onClick={() => { scrollToAnchor(e.anchor);}}>{ e.title }</li>
|
||||
})
|
||||
}
|
||||
</div>
|
||||
}
|
||||
<Spin spinning={isSpin}>
|
||||
{
|
||||
information.category.map((e) => {
|
||||
return <div className="content" key={ e.anchor }>
|
||||
<div className="anchor" id={ e.anchor }></div>
|
||||
{/* <div className="content-title">
|
||||
<p>{ e.title }</p>
|
||||
<p>{ e.eng }</p>
|
||||
</div> */}
|
||||
<div style={{textAlign:"center",paddingTop:18,paddingBottom:50}}>
|
||||
<p className='homeMaintitle'><img src={Left} /><span>{ e.title }</span><img src={Right} /></p>
|
||||
<p className="homeSubtitle"><span>{ e.eng.toUpperCase() }</span></p>
|
||||
</div>
|
||||
<div className="content-wrapper">
|
||||
{
|
||||
informationList[e.anchor] && informationList[e.anchor].length > 0 ? informationList[e.anchor].map(( e, k ) => {
|
||||
return <div className="content-item" key={ k }>
|
||||
<div className="item-left">{ e.date2 }</div>
|
||||
<div className="item-right">
|
||||
<p className="time">{ e.date1 }</p>
|
||||
<Divider style={{ color: 'rgba(9, 37, 77, 0.1)', margin: '0px' }}/>
|
||||
<Link to={ `/competitions/2024/information/${ e.id }` } className="item-title task-hide">{ e.name }</Link>
|
||||
<p className="item-desc task-hide-2">{ e.summary }</p>
|
||||
<a href={ `/competitions/2024/information/${ e.id }` } className="read-more">阅读全文 <span>→</span></a>
|
||||
</div>
|
||||
</div>
|
||||
}):
|
||||
<img className="empty" src={ empty } alt="" />
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
})
|
||||
}
|
||||
</Spin>
|
||||
</div>
|
||||
}
|
||||
|
||||
export default Information
|
||||
|
|
@ -0,0 +1,280 @@
|
|||
.information {
|
||||
.anchorPart{
|
||||
width: 115px;
|
||||
background-color: #fff;
|
||||
position: fixed;
|
||||
box-shadow: 0px 0px 12px 1px rgba(107,136,204,0.06);
|
||||
border-radius: 4px 4px 4px 4px;
|
||||
z-index: 11;
|
||||
padding:12px 0px;
|
||||
li{
|
||||
position: relative;
|
||||
list-style-type: none;
|
||||
padding:0px 15px;
|
||||
height: 45px;
|
||||
line-height: 45px;
|
||||
font-weight: 400;
|
||||
font-size: 15px;
|
||||
color: #1F2329;
|
||||
cursor: pointer;
|
||||
&.active{
|
||||
color: #6233DE;
|
||||
}
|
||||
&.active::after{
|
||||
width: 2px;
|
||||
height: 29px;
|
||||
background: linear-gradient( 103deg, #5950F3 0%, #6B16CA 100%);
|
||||
border-radius: 0px 0px 0px 0px;
|
||||
left: 0px;
|
||||
content: "";
|
||||
top: 8px;
|
||||
position: absolute;
|
||||
}
|
||||
}
|
||||
}
|
||||
.homeMaintitle{
|
||||
font-size: 48px;
|
||||
position: relative;
|
||||
margin: 0px auto;
|
||||
width: 224px;
|
||||
img{
|
||||
width: 12px;
|
||||
position: absolute;
|
||||
&:first-child{
|
||||
left: -12px;
|
||||
}
|
||||
&:last-child{
|
||||
bottom: 0px;
|
||||
}
|
||||
}
|
||||
span{
|
||||
margin:0px 22px;
|
||||
font-family: YouSheBiaoTiHei;
|
||||
}
|
||||
text-align: center;
|
||||
}
|
||||
.ant-spin-container {
|
||||
background: url('../img/back.png') no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
.header {
|
||||
width: 100%;
|
||||
height: 300px;
|
||||
text-align: center;
|
||||
color: #ffffff;
|
||||
position: relative;
|
||||
font-size: 15px;
|
||||
width: 100%;
|
||||
&>img{
|
||||
width: 100%;
|
||||
height: 300px;
|
||||
object-fit: cover;
|
||||
}
|
||||
// .title {
|
||||
// font-size: 30px;
|
||||
// }
|
||||
// .desc {
|
||||
// margin-top: 19px;
|
||||
// opacity: 80%;
|
||||
// }
|
||||
|
||||
}
|
||||
.tab {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
height:62px;
|
||||
background-color:#ffffff;
|
||||
}
|
||||
.tabPanel{
|
||||
width: 1200px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin:35px auto 0px;
|
||||
position: relative;
|
||||
height: 32px;
|
||||
.tab-item {
|
||||
margin: 0 69px;
|
||||
cursor: pointer;
|
||||
height:62px;
|
||||
line-height:62px;
|
||||
position: relative;
|
||||
font-size: 16px;
|
||||
&.active::after{
|
||||
position: absolute;
|
||||
width: 67px;
|
||||
height: 2px;
|
||||
background: linear-gradient( 103deg, #5950F3 0%, #6B16CA 100%);
|
||||
border-radius: 0px 0px 0px 0px;
|
||||
content: "";
|
||||
left: 50%;
|
||||
margin-left: -33px;
|
||||
bottom: 0px;
|
||||
}
|
||||
&.active,&:hover{
|
||||
color: #6233DE;
|
||||
}
|
||||
}
|
||||
.searchInput{
|
||||
position: absolute;
|
||||
right: 0px;
|
||||
background-color: #fff;
|
||||
&:hover,&.ant-input-affix-wrapper:focus{
|
||||
border-color: #6233DE!important;
|
||||
box-shadow: 0 0 0 2px rgba(98, 51, 222, 0.1)!important;
|
||||
}
|
||||
}
|
||||
}
|
||||
.anchor {
|
||||
position: absolute;
|
||||
top: -50px;
|
||||
}
|
||||
.content {
|
||||
width: 1200px;
|
||||
margin: auto;
|
||||
position: relative;
|
||||
padding:50px 0px;
|
||||
.content-title {
|
||||
width: 531px;
|
||||
height: 157px;
|
||||
background: url('../img/info-title-bg.png') no-repeat;
|
||||
background-size: 100% 100%;
|
||||
margin: auto;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
p:first-child {
|
||||
font-family: Alimama ShuHeiTi;
|
||||
color: #0e1015;
|
||||
font-size: 40px;
|
||||
margin-top: 60px;
|
||||
}
|
||||
p:last-child {
|
||||
font-family:PingFang SC;
|
||||
color: #0d41c5;
|
||||
font-size: 15px;
|
||||
margin-top: 14px;
|
||||
}
|
||||
}
|
||||
.content-wrapper {
|
||||
.content-item {
|
||||
display: flex;
|
||||
margin-bottom: 10px;
|
||||
.item-left {
|
||||
font-family: PingFang SC;
|
||||
font-weight: 700;
|
||||
color: #6233DE;
|
||||
font-size: 24px;
|
||||
margin-right: 30px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.item-right {
|
||||
flex: 1;
|
||||
.time {
|
||||
color: #5F6577;
|
||||
font-size: 14px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.item-title {
|
||||
font-weight: 700;
|
||||
color: #252b3a;
|
||||
font-size: 18px;
|
||||
margin-top: 20px;
|
||||
display: block;
|
||||
&:hover{
|
||||
color: #6233DE;
|
||||
}
|
||||
}
|
||||
.item-desc {
|
||||
color: #49454F;
|
||||
font-size: 16px;
|
||||
line-height: 32px;
|
||||
margin-top: 20px;
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
.read-more {
|
||||
float: right;
|
||||
color: #6233DE;
|
||||
font-size: 15px;
|
||||
margin-top: 10px;
|
||||
display: flex;
|
||||
span{
|
||||
transition: 0.2s;
|
||||
display: block;
|
||||
}
|
||||
&:hover>span {
|
||||
transform: translateX(3px);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.detail{
|
||||
background: url('../img/information-detail-bg.png') no-repeat;
|
||||
background-size: 100% 100%;
|
||||
width: 100%;
|
||||
flex-grow: 1;
|
||||
padding-bottom: 60px;
|
||||
.detail-content {
|
||||
width: 1200px;
|
||||
margin: 0px auto;
|
||||
padding: 30px 0px;
|
||||
}
|
||||
.ant-breadcrumb {
|
||||
a {
|
||||
color: #0d41c5;
|
||||
}
|
||||
}
|
||||
.detail-info{
|
||||
background-color:#fefefe;
|
||||
border-radius:4px;
|
||||
box-shadow:0px 0px 15px rgba(30, 47, 162, 0.06);
|
||||
padding:30px 35px 50px;
|
||||
margin-top: 28px;
|
||||
.info-text-main{
|
||||
.info-name{
|
||||
color:#1f2329;
|
||||
font-size:22px;
|
||||
line-height: 30px;
|
||||
margin-bottom: 14px!important;
|
||||
word-break: break-all;
|
||||
}
|
||||
.info-ul-value{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
li{
|
||||
color:#4c5876;
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
margin-right: 25px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
img {
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
.homeSubtitle{
|
||||
margin-top: 12px;
|
||||
text-align: center;
|
||||
span{
|
||||
font-size: 16px;
|
||||
font-family: YouSheBiaoTiHei;
|
||||
background: -webkit-linear-gradient(76deg, rgba(24,163,168,0.77) 0%, #2E89FF 51%, rgba(158,3,127,0.77) 100%);
|
||||
background: linear-gradient(76deg, rgba(24,163,168,0.77) 0%, #2E89FF 51%, rgba(158,3,127,0.77) 100%);
|
||||
-webkit-background-clip: text;
|
||||
background-clip: text;
|
||||
-webkit-text-fill-color: transparent; /* 针对WebKit浏览器 */
|
||||
color: transparent; /* 兼容其他浏览器 */
|
||||
letter-spacing: 2px;
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,21 @@
|
|||
import { Tooltip } from 'antd'
|
||||
import './index.less'
|
||||
|
||||
function MemberItem(props) {
|
||||
const { className, data } = props
|
||||
|
||||
return <div className={ `${ className } member-item` }>
|
||||
{
|
||||
data.name && <>
|
||||
<img src={ data.imageUrl } alt="" className="head-img"/>
|
||||
<span className="task-hide">{ data.name }</span>
|
||||
<Tooltip title={ data.introduction }>
|
||||
<p className="task-hide-2">{ data.introduction }</p>
|
||||
</Tooltip>
|
||||
<div className="line"></div>
|
||||
</>
|
||||
}
|
||||
</div>
|
||||
}
|
||||
|
||||
export default MemberItem
|
||||
|
|
@ -0,0 +1,45 @@
|
|||
.member-item {
|
||||
width: 200px;
|
||||
height: 315px;
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
border-bottom: 1.5px solid linear-gradient(90deg,#08428e 0%,#019765 100%);
|
||||
margin-bottom: 35px;
|
||||
.head-img {
|
||||
width: 200px;
|
||||
height: 250px;
|
||||
border: 2px solid #ffffff;
|
||||
object-fit: cover;
|
||||
background-color: #B6B6BB;
|
||||
}
|
||||
span {
|
||||
position: absolute;
|
||||
font-weight: bold;
|
||||
color: #ffffff;
|
||||
font-size: 18px;
|
||||
bottom: 78px;
|
||||
left: -40px;
|
||||
width:84px;
|
||||
line-height: 29px;
|
||||
background-image:url('../img/orz1.png');
|
||||
background-size: 100% 100%;
|
||||
text-align: center;
|
||||
padding: 0 10px;
|
||||
}
|
||||
p {
|
||||
margin-top: 15px;
|
||||
color: #252b3a;
|
||||
font-size: 15px;
|
||||
line-height: 1.5;
|
||||
text-align: center;
|
||||
}
|
||||
.line {
|
||||
position: absolute;
|
||||
bottom: -5px;
|
||||
width: 100%;
|
||||
height: 1.5px;
|
||||
background: linear-gradient( 103deg, #5950F3 0%, #6B16CA 100%);
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,149 @@
|
|||
import './index.less'
|
||||
import { Spin } from 'antd';
|
||||
import React,{ useState , useEffect } from 'react';
|
||||
import MemberItem from '../memberitem'
|
||||
import { getOrganization , getPartnerList , getDocList , getDocDetail } from '../api.js';
|
||||
import { hidenMemberType } from '../info';
|
||||
import { Base64 } from 'js-base64';
|
||||
import RenderHtml from '@/components/RenderHtml'
|
||||
import orz2 from '../img/orz2.png';
|
||||
import Logo from '../img/logo.png';
|
||||
import Team from '../img/team.png';
|
||||
import Left from '../img/left.png';
|
||||
import Right from '../img/right.png';
|
||||
|
||||
function Organization() {
|
||||
const [ isSpin , setIsSpin ] = useState(false);
|
||||
const [ organization, setOrganization ] = useState([])
|
||||
const [ partner, setPartner ] = useState([]);
|
||||
const [ orz , setOrz ] = useState([]);
|
||||
|
||||
useEffect(()=>{
|
||||
getList();
|
||||
getPartner();
|
||||
Init();
|
||||
},[])
|
||||
|
||||
const getPartner = () => {
|
||||
getPartnerList().then(res => {
|
||||
let rows = res?.rows.length > 0 ? res?.rows.filter(i=>i.typeName.includes("高校")):[];
|
||||
setPartner(rows);
|
||||
}).catch(console.error())
|
||||
}
|
||||
|
||||
const getList = () => {
|
||||
setIsSpin(true);
|
||||
getOrganization().then(res => {
|
||||
let rows = res?.rows;
|
||||
rows = rows.map(i=>{
|
||||
let members= i.zoneMemberList && i.zoneMemberList.length>0 ? i.zoneMemberList.filter(e=>e.memberLevel !== "主席"):i.zoneMemberList;
|
||||
return {...i,unPresident:members.length>0?members.map(e=>{return e.name}):[]}
|
||||
})
|
||||
setOrganization(rows);
|
||||
setIsSpin(false);
|
||||
})
|
||||
}
|
||||
|
||||
const Init=()=>{
|
||||
getDocList(658).then(res => {
|
||||
if( res?.rows?.length > 0){
|
||||
let arr = [];
|
||||
for(let i=0;i<res?.rows.length;i++){
|
||||
let e = res?.rows[i];
|
||||
arr.push(getDetailForId(e.id));
|
||||
}
|
||||
Promise.all(arr).then(res=>{
|
||||
setOrz(res)
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
const getDetailForId = (id) => {
|
||||
return new Promise((resolve, reject) => {
|
||||
getDocDetail(id).then(res => {
|
||||
let detail = res.data;
|
||||
resolve({detail:detail});
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
return <div className="organization">
|
||||
<div className='orzLogo'>
|
||||
<img src={Logo} alt="" height={84}/>
|
||||
<div className='orzDesc'>
|
||||
<img src={orz2} alt="" width={138}/>
|
||||
<div className='descCon'>
|
||||
<img src={Team} width={33}/>CCF开源发展委员会是一个致力于推动开源文化、技术、教育和产业发展的专业组织。重点聚焦共同打造开源、开放、中立的产学研协同开源创新服务平台，探索建立CCF开源项目孵化机制，培育原始开源创新项目，依托CCF联接科教资源、产业资源和社会资源等，形成产、教、研联动的开源创新模式，推动CCF开源品牌建设和开源社区运营，为CCF会员乃至全球开源创新实践者提供高水平的开源创新服务，助力我国开源生态建设的发展。
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<p className='homeMaintitle' style={{margin:"50px auto 0px"}}><img src={Left} /><span>组织架构</span><img src={Right} /></p>
|
||||
<p className="homeSubtitle"><span>ORGANIZARIONAL STRUCTURE</span></p>
|
||||
<Spin spinning={isSpin}>
|
||||
{/* {
|
||||
organization && organization.length > 0 && organization.map((i, k) => {
|
||||
if (!hidenMemberType.includes(i.typeName)) {
|
||||
return <div className="module" key={ k }>
|
||||
<p className='homeMaintitle'><img src={Left} /><span>{ i.typeName }</span><img src={Right} /></p>
|
||||
<p className="homeSubtitle"><span>{subtitle[k]}</span></p>
|
||||
<p className="module-desc">{ i.typeIntroduction }</p>
|
||||
{
|
||||
i.zoneMemberList && i.zoneMemberList.length > 0 && <div className="module-content">
|
||||
{
|
||||
i.zoneMemberList.map(( e, subK ) => {
|
||||
return e.memberLevel === "主席" && <MemberItem key={ subK } className={`module-item`} data={ e } ></MemberItem>
|
||||
})
|
||||
}
|
||||
</div>
|
||||
}
|
||||
{
|
||||
i.unPresident && i.unPresident.length>0 && <p className='membersSub'><img src={Team} width={33} />{i.typeName}委员：{ i.unPresident.join("、")}</p>
|
||||
}
|
||||
</div>
|
||||
}
|
||||
})
|
||||
} */}
|
||||
{
|
||||
orz && orz.length > 0 && orz.map((i,k)=>{
|
||||
let detail = i.detail;
|
||||
return(
|
||||
<>
|
||||
<p className='orzTitle'><img src={Team} width={33} style={{marginRight:13}}/>{detail.name}</p>
|
||||
<div className="module" key={ k }>
|
||||
{
|
||||
detail.content ?
|
||||
<RenderHtml className="informations_detail imageLayerParent" value={ Base64.decode(detail.content) } url={ location } />
|
||||
:
|
||||
""
|
||||
}
|
||||
</div>
|
||||
</>
|
||||
)
|
||||
})
|
||||
}
|
||||
</Spin>
|
||||
{
|
||||
partner?.length > 0 ?
|
||||
<div style={{textAlign:"center",paddingTop:68,paddingBottom:50}}>
|
||||
<p className='homeMaintitle' style={{width:224,margin:"0px auto"}}><img src={Left} /><span>合作高校</span><img src={Right} /></p>
|
||||
<p className="homeSubtitle"><span>PARTNERS</span></p>
|
||||
<div className='partnersLogo'>
|
||||
{
|
||||
partner.map((i,k)=>{
|
||||
return i.zonePartnersList && i.zonePartnersList.length >0 ? i.zonePartnersList.map((e,key)=>{
|
||||
return(
|
||||
<a key={k}><img src={e.logo} alt=""/></a>
|
||||
)
|
||||
})
|
||||
:""
|
||||
})
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
:""
|
||||
}
|
||||
</div>
|
||||
}
|
||||
|
||||
export default Organization
|
||||
|
|
@ -0,0 +1,203 @@
|
|||
.organization {
|
||||
width: 100%;
|
||||
margin: auto;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
min-height: 100vh;
|
||||
position: relative;
|
||||
padding-bottom: 60px;
|
||||
.ant-spin-nested-loading {
|
||||
width: 1200px;
|
||||
}
|
||||
.homeMaintitle{
|
||||
font-size: 48px;
|
||||
position: relative;
|
||||
margin-bottom: 0px;
|
||||
img{
|
||||
width: 12px;
|
||||
position: absolute;
|
||||
&:first-child{
|
||||
left: -12px;
|
||||
}
|
||||
&:last-child{
|
||||
bottom: 0px;
|
||||
}
|
||||
}
|
||||
span{
|
||||
margin:0px 22px;
|
||||
font-family: YouSheBiaoTiHei;
|
||||
}
|
||||
text-align: center;
|
||||
}
|
||||
.homeSubtitle{
|
||||
margin-top: 12px;
|
||||
text-align: center;
|
||||
span{
|
||||
font-size: 16px;
|
||||
font-family: YouSheBiaoTiHei;
|
||||
background: -webkit-linear-gradient(76deg, rgba(24,163,168,0.77) 0%, #2E89FF 51%, rgba(158,3,127,0.77) 100%);
|
||||
background: linear-gradient(76deg, rgba(24,163,168,0.77) 0%, #2E89FF 51%, rgba(158,3,127,0.77) 100%);
|
||||
-webkit-background-clip: text;
|
||||
background-clip: text;
|
||||
-webkit-text-fill-color: transparent; /* 针对WebKit浏览器 */
|
||||
color: transparent; /* 兼容其他浏览器 */
|
||||
letter-spacing: 2px;
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
.back-img {
|
||||
width: 100%;
|
||||
img{
|
||||
width: 100%;
|
||||
height: 300px;
|
||||
object-fit: cover;
|
||||
}
|
||||
}
|
||||
.orzLogo{
|
||||
padding-top:48px;
|
||||
text-align: center;
|
||||
.orzDesc{
|
||||
position: relative;
|
||||
width: 1200px;
|
||||
min-height: 170px;
|
||||
margin-top: 30px;
|
||||
&>img{
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
top:-18px;
|
||||
z-index: 1;
|
||||
}
|
||||
.descCon{
|
||||
position: absolute;
|
||||
background: #F6F7FA;
|
||||
box-shadow: 0px 0px 10px 1px rgba(7,70,165,0.11);
|
||||
border-radius: 10px 10px 10px 10px;
|
||||
border: 2px solid #FFFFFF;
|
||||
padding:20px 50px 20px 110px;
|
||||
line-height: 34px;
|
||||
text-align: left;
|
||||
left: 50px;
|
||||
text-align: justify;
|
||||
font-size: 15px;
|
||||
color: #040E29;
|
||||
img{
|
||||
float: left;
|
||||
margin-right: 8px;
|
||||
margin-top: 3px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.orzTitle{
|
||||
font-family: YouSheBiaoTiHei;
|
||||
font-weight: 400;
|
||||
font-size: 38px;
|
||||
color: #0A0A0A;
|
||||
letter-spacing: 3px;
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
.module {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-top: 24px;
|
||||
background: #F6F7FA;
|
||||
box-shadow: 0px 0px 10px 1px rgba(7,70,165,0.11);
|
||||
border-radius: 22px;
|
||||
padding:20px 40px;
|
||||
margin-bottom: 35px;
|
||||
border: 2px solid #FFFFFF;
|
||||
.module-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-family:Alimama ShuHeiTi;
|
||||
color:#0e1015;
|
||||
font-size:34px;
|
||||
margin-bottom: 30px;
|
||||
span {
|
||||
margin: 0 30px;
|
||||
position: relative;
|
||||
&::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
bottom: -3px;
|
||||
left: -10px;
|
||||
opacity: 9%;
|
||||
width: 100%;
|
||||
height: 11px;
|
||||
background-color: #0d41c5;
|
||||
}
|
||||
}
|
||||
img {
|
||||
width: 48px;
|
||||
height: 21px;
|
||||
&:last-child {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
}
|
||||
}
|
||||
.module-desc {
|
||||
color: #252b3a;
|
||||
font-size: 15px;
|
||||
margin-bottom: 37px;
|
||||
line-height: 1.8;
|
||||
}
|
||||
.module-content {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
.module-item {
|
||||
margin-right: 55px;
|
||||
margin-left: 55px;
|
||||
margin-bottom: 32px;
|
||||
&:nth-child(4n) {
|
||||
margin-right: 0px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.ant-carousel{
|
||||
width: 1200px;
|
||||
}
|
||||
.membersSub{
|
||||
width: 100%;
|
||||
font-weight: bold;
|
||||
font-size: 20px;
|
||||
color: #040E29;
|
||||
line-height: 40px;
|
||||
img{
|
||||
float: left;
|
||||
margin: 5px 10px 0px 0px;
|
||||
}
|
||||
}
|
||||
.partnersLogo{
|
||||
display: flex!important;
|
||||
flex-wrap: wrap;
|
||||
margin-top: 54px;
|
||||
width: 1200px;
|
||||
a{
|
||||
margin-right: 42px;
|
||||
padding: 6px;
|
||||
background-color: #ffffff;
|
||||
border-radius: 4px;
|
||||
box-shadow: 0px 0px 6px rgba(28, 48, 175, 0.03);
|
||||
height: 83px;
|
||||
width: 163px;
|
||||
line-height: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-bottom: 35px;
|
||||
border:1px solid #fff;
|
||||
&:hover{
|
||||
border-color: #6233DE;
|
||||
}
|
||||
&:nth-child(6n){
|
||||
margin-right: 0px;
|
||||
}
|
||||
img{
|
||||
max-height: 55px;
|
||||
max-width: 130px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,112 @@
|
|||
import './index.less'
|
||||
import { useState , useEffect } from 'react';
|
||||
import RenderHtml from '@/components/RenderHtml';
|
||||
import { useParams , Link } from 'umi';
|
||||
import { getDocDetail } from '../api';
|
||||
import { Base64 } from 'js-base64';
|
||||
import { throttle } from '@/utils/mettingUtil';
|
||||
|
||||
function Track(props) {
|
||||
const [ tabKey , setTabKey ] = useState(0);
|
||||
const [ content , setContent]=useState(undefined);
|
||||
const [ dealContent , setDealContent]=useState(undefined);
|
||||
const [ showAnchor , setShowAnchor ] = useState(false);
|
||||
const [ anchor , setAnchor ] = useState(false);
|
||||
const [ menu , setMenu]=useState([]);
|
||||
const { id } = useParams();
|
||||
|
||||
useEffect(()=>{
|
||||
if (location.pathname.indexOf('/competitions/2024/track')>-1) {
|
||||
window.addEventListener('scroll', throttleHandleScroll);
|
||||
return ComponentWillUnmount;
|
||||
} else {
|
||||
ComponentWillUnmount()
|
||||
}
|
||||
},[location.pathname])
|
||||
|
||||
function ComponentWillUnmount() {
|
||||
window.removeEventListener("scroll", throttleHandleScroll);
|
||||
}
|
||||
function handleScroll() {
|
||||
let scrollTop = document.documentElement.scrollTop; //滚动条滚动高度
|
||||
setShowAnchor(scrollTop > 320);
|
||||
if(scrollTop < 320){setAnchor("")}
|
||||
}
|
||||
const throttleHandleScroll = throttle(handleScroll, 100)
|
||||
|
||||
useEffect(()=>{
|
||||
if(id){
|
||||
setTabKey(id);
|
||||
getDetail();
|
||||
}
|
||||
},[id])
|
||||
|
||||
|
||||
const getDetail = () => {
|
||||
getDocDetail(id).then(res => {
|
||||
let content = Base64.decode(res.data.content);
|
||||
setContent(content);
|
||||
})
|
||||
}
|
||||
|
||||
const scrollToAnchor = (anchorName) => {
|
||||
if (anchorName) {
|
||||
let anchorElement = document.getElementById(anchorName);
|
||||
if(anchorElement) { setAnchor(anchorName);anchorElement.scrollIntoView({block: 'start', behavior: 'smooth'}); }
|
||||
}
|
||||
}
|
||||
useEffect(() => {
|
||||
if(content){
|
||||
let c = content;
|
||||
const hTagsRegex = /<h([1-6])(.*?)>(.*?)<\/h\1>/g;
|
||||
let match;
|
||||
let list = [];
|
||||
while ((match = hTagsRegex.exec(content))) {
|
||||
list.push({level:+match[1],id:match[3]})
|
||||
c = c.replace(`${match[0]}`, `<div id="${match[3]}"></div>${match[0]}`);
|
||||
}
|
||||
setMenu(list);
|
||||
setDealContent(c);
|
||||
}
|
||||
}, [content]);
|
||||
return(
|
||||
<div className='track'>
|
||||
<div className='tabPanel'>
|
||||
<div className="tab">
|
||||
<Link key={ 675 } to='/competitions/2024/track/675' className={`tab-item ${tabKey === "675" ?"active":""}`}>开源项目贡献赛道</Link>
|
||||
<Link key={ 677 } to='/competitions/2024/track/677' className={`tab-item ${tabKey === "677" ?"active":""}`}>开源任务挑战赛道</Link>
|
||||
<Link key={ 679 } to='/competitions/2024/track/679' className={`tab-item ${tabKey === "679" ?"active":""}`}>开源案例教学赛道</Link>
|
||||
<Link key={ 678 } to='/competitions/2024/track/678' className={`tab-item ${tabKey === "678" ?"active":""}`}>开源代码评注赛道</Link>
|
||||
</div>
|
||||
</div>
|
||||
<div className="detail-info">
|
||||
{/* <div className="info-text-main">
|
||||
<p className="info-name">{ detail.name }</p>
|
||||
<ul className="info-ul-value">
|
||||
{ cmsDir && <li>发布于{ cmsDir.createdAt }</li> }
|
||||
{ detail && detail.visits && <li><img src={ views } alt="" className="mr5" />{ detail.visits }</li> }
|
||||
</ul>
|
||||
</div>
|
||||
<Divider dashed={true} /> */}
|
||||
{
|
||||
menu?.length > 0 && showAnchor ?
|
||||
<ul className='menuPanel' style={{top:320,left:(document.documentElement.clientWidth-1200)/2-225}}>
|
||||
{
|
||||
menu.map((i,k)=>{
|
||||
return <li key={k} style={{paddingLeft:`${i.level*10}px`}} className={`${anchor ===i.id?"active":""}`}><a onClick={()=>scrollToAnchor(i.id)}>{i?.id}</a></li>
|
||||
})
|
||||
}
|
||||
</ul>
|
||||
:""
|
||||
}
|
||||
{
|
||||
dealContent ?
|
||||
<RenderHtml className="informations_detail imageLayerParent" value={ dealContent } url={ location } />
|
||||
:
|
||||
<span>暂无详情~</span>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
export default Track;
|
||||
|
|
@ -0,0 +1,103 @@
|
|||
.track{
|
||||
padding-bottom: 40px;
|
||||
position: relative;
|
||||
.tabPanel{
|
||||
text-align: center;
|
||||
padding:35px 0px 0px;
|
||||
}
|
||||
.tab {
|
||||
width: 1200px;
|
||||
margin:0px auto;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-left:40px;
|
||||
.tab-item {
|
||||
margin-right: 78px;
|
||||
font-weight: 400;
|
||||
font-size: 17px;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
color: #040E29;
|
||||
border-radius: 4px;
|
||||
padding:0px 10px;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
&.active{
|
||||
color: #fff;
|
||||
background: linear-gradient( 103deg, #5950F3 0%, #6B16CA 100%);
|
||||
}
|
||||
}
|
||||
}
|
||||
.detail-info{
|
||||
width: 1200px;
|
||||
border-radius:4px;
|
||||
box-shadow:0px 0px 15px rgba(30, 47, 162, 0.06);
|
||||
padding:30px 35px 50px;
|
||||
margin:28px auto 0px;
|
||||
background-color: #fff;
|
||||
.menuPanel{
|
||||
position: fixed;
|
||||
background-color: #fff;
|
||||
border-radius: 4px;
|
||||
width: 200px;
|
||||
max-height: 320px;
|
||||
overflow-y: auto;
|
||||
padding:12px 0px;
|
||||
box-shadow: 0px 0px 12px 1px rgba(107, 136, 204, 0.06);
|
||||
li{
|
||||
position: relative;
|
||||
&.active::before{
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
top: 0px;
|
||||
height: 100%;
|
||||
width: 2px;
|
||||
content: "";
|
||||
background: linear-gradient(103deg, #5950F3 0%, #6B16CA 100%);
|
||||
}
|
||||
&.active,&:hover{
|
||||
a{
|
||||
color: #6B16CA;
|
||||
}
|
||||
}
|
||||
a{
|
||||
font-size: 14px;
|
||||
height: 28px;
|
||||
line-height: 28px;
|
||||
font-weight: 400;
|
||||
font-size: 15px;
|
||||
color: #1F2329;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
max-width: 145px;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
.info-text-main{
|
||||
.info-name{
|
||||
color:#1f2329;
|
||||
font-size:22px;
|
||||
line-height: 30px;
|
||||
margin-bottom: 14px!important;
|
||||
word-break: break-all;
|
||||
}
|
||||
.info-ul-value{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
li{
|
||||
color:#4c5876;
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
margin-right: 25px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
img {
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -647,7 +647,7 @@ async function JoinTeams(name: any) {
|
|||
see.current?.handleVisible()
|
||||
return
|
||||
}
|
||||
gotocourse(e, HeaderDetail, HeaderDetail.mode === 2 ? 'ismodel' : HeaderDetail.personal ? 'personal' : `/competitions/index/${HeaderDetail.identifier}/enroll`)
|
||||
gotocourse(e, HeaderDetail, HeaderDetail.mode === 2 ? 'ismodel' : `/competitions/index/${HeaderDetail.identifier}/enroll`)
|
||||
}
|
||||
}>{StaffDetail.enrolled ? ((HeaderDetail.identifier === "track1_2023" || HeaderDetail.identifier === "track2_2023" || HeaderDetail.identifier === "track4_2023" ) ? "立即报名" : HeaderDetail.need_attachment ? '上传作品' : '已报名') : (HeaderDetail?.enroll_url ? '前往大赛官网报名' : '立即报名')}</Button>
|
||||
: null
|
||||
|
|
@ -655,7 +655,7 @@ async function JoinTeams(name: any) {
|
|||
</div>
|
||||
{/* 红山赛事无当前按钮 */}
|
||||
{user.userInfo.real_name != "游客" && !HeaderDetail?.enroll_url && !hongshanId.includes(HeaderDetail?.identifier) &&
|
||||
<span onClick={(e) => gotocourse(e, HeaderDetail, HeaderDetail.mode === 2 ? 'ismodel' : HeaderDetail.personal ? 'personal' : `/competitions/index/${HeaderDetail.identifier}/enroll`)} className={styles.myteam}>{isSuperAdmin() ? '参赛战队>>' : '我的战队>>'}</span>
|
||||
<span onClick={(e) => gotocourse(e, HeaderDetail, HeaderDetail.mode === 2 ? 'ismodel' :`/competitions/index/${HeaderDetail.identifier}/enroll`)} className={styles.myteam}>{isSuperAdmin() ? '参赛战队>>' : '我的战队>>'}</span>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Reference in New Issue