forked from Gitlink/forgeplus-react
增加调用后台数据
This commit is contained in:
何童崇
parent
eb180d3570
commit
97f3fa75c1
|
|
@ -34,6 +34,21 @@ export function getImage(path) {
|
|||
}
|
||||
}
|
||||
|
||||
export function getTestImage(path) {
|
||||
// https://www.educoder.net
|
||||
// https://testbdweb.trustie.net
|
||||
// const local = 'http://localhost:3000'
|
||||
const local = 'http://117.50.100.12:49999';
|
||||
if(path.indexOf("http://")===-1){
|
||||
if (isDev) {
|
||||
return `${local}${path}`
|
||||
}
|
||||
return `${path}`;
|
||||
}else{
|
||||
return path;
|
||||
}
|
||||
}
|
||||
|
||||
export function getLogoImageUrl(path) {
|
||||
const local = 'http://117.50.100.12:49999';
|
||||
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@ export {
|
|||
getUploadLogoActionUrl as getUploadLogoActionUrl,
|
||||
getImageUrl as getImageUrl,getImage as getImage, getmyUrl as getmyUrl, getRandomNumber as getRandomNumber, getUrl as getUrl, publicSearchs as publicSearchs, getRandomcode as getRandomcode, getUrlmys as getUrlmys, getUrl2 as getUrl2, setImagesUrl as setImagesUrl
|
||||
, getUploadActionUrl as getUploadActionUrl, getUploadActionUrltwo as getUploadActionUrltwo, getUploadActionUrlthree as getUploadActionUrlthree, getUploadActionUrlOfAuth as getUploadActionUrlOfAuth
|
||||
, getTaskUrlById as getTaskUrlById, TEST_HOST, htmlEncode as htmlEncode, getupload_git_file as getupload_git_file, getcdnImageUrl as getcdnImageUrl,getLogoImageUrl as getLogoImageUrl
|
||||
, getTaskUrlById as getTaskUrlById, TEST_HOST, htmlEncode as htmlEncode, getupload_git_file as getupload_git_file, getcdnImageUrl as getcdnImageUrl,getTestImage as getTestImage,getLogoImageUrl as getLogoImageUrl
|
||||
} from './UrlTool';
|
||||
|
||||
export { setmiyah as setmiyah } from './Component';
|
||||
|
|
|
|||
|
|
@ -14,8 +14,6 @@ for (const item of taskModeIdArr) {
|
|||
}
|
||||
|
||||
|
||||
|
||||
|
||||
let taskArrMock = [
|
||||
{
|
||||
id: 447,
|
||||
|
|
@ -53,7 +51,7 @@ function getSomeDayAfter(initailDate, nDay) {
|
|||
return moment(new Date(initailDate).setDate(new Date(initailDate).getDate() + nDay)).format('YYYY-MM-DD');
|
||||
}
|
||||
|
||||
function FifthSection({ fifth }) {
|
||||
function FifthSection({ fifth,history }) {
|
||||
|
||||
const [taskCategoryArr, setTaskCategoryArr] = useState([]);
|
||||
const [taskArr, serTaskArr] = useState(taskArrMock);
|
||||
|
|
@ -244,7 +242,7 @@ function FifthSection({ fifth }) {
|
|||
</div>
|
||||
|
||||
<div className="text-center">
|
||||
<Button className="homepage-btn " type="primary">寻找创客 <i className="iconfont icon-gengduoicon"></i></Button>
|
||||
<Button className="homepage-btn " type="primary" onClick={()=>{history.push('/task')}}>寻找创客 <i className="iconfont icon-gengduoicon"></i></Button>
|
||||
</div>
|
||||
|
||||
<svg className="waves waves-low "
|
||||
|
|
|
|||
|
|
@ -24,15 +24,17 @@ function FirstSection({ first }) {
|
|||
|
||||
useEffect(() => {
|
||||
const playGlass = document.getElementById("playGlass");
|
||||
playGlass.addEventListener("webkitAnimationEnd", () => {
|
||||
setCirculation('circulation');
|
||||
});
|
||||
playGlass.addEventListener("webkitAnimationEnd", secondAnimation);
|
||||
return () => {
|
||||
setCirculation('');
|
||||
playGlass.removeEventListener("webkitAnimationEnd");
|
||||
playGlass.removeEventListener("webkitAnimationEnd",secondAnimation);
|
||||
};
|
||||
}, []);
|
||||
|
||||
function secondAnimation(){
|
||||
setCirculation('circulation');
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
setCirculation('');
|
||||
}, [first]);
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@ const code = [
|
|||
// { str: <span><span className='code-green'>======END======</span></span> },
|
||||
]
|
||||
|
||||
function FourthSection({ fourth }) {
|
||||
function FourthSection({ fourth, history }) {
|
||||
return (
|
||||
<div className="fourth-main homepage-main">
|
||||
<div className="fourth-title">
|
||||
|
|
@ -33,7 +33,7 @@ function FourthSection({ fourth }) {
|
|||
<h2 className="homePage-blue-tit">开源项目</h2>
|
||||
<h4 className="homePage-subhead">开源项目版块集项目托管、版本管理等功能于一体，为开源协作和群智汇聚提供创作环境</h4>
|
||||
<Line />
|
||||
<Button className="homepage-btn" type="primary">查看项目 <i className="iconfont icon-gengduoicon"></i></Button>
|
||||
<Button className="homepage-btn" type="primary" onClick={()=>{history.push('/projects')}}>查看项目 <i className="iconfont icon-gengduoicon"></i></Button>
|
||||
</div>
|
||||
|
||||
<div className={fourth ? "code-box clearfix activeCode" : "code-box clearfix"} >
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
import React, { memo } from 'react';
|
||||
import React, { memo, useEffect, useState } from 'react';
|
||||
import { Button } from 'antd';
|
||||
import axios from 'axios';
|
||||
import Slider from 'react-slick';
|
||||
import "slick-carousel/slick/slick.css";
|
||||
import "slick-carousel/slick/slick-theme.css";
|
||||
|
|
@ -23,42 +24,35 @@ let setting = {
|
|||
vertical: true,
|
||||
}
|
||||
|
||||
const sliderData = [
|
||||
{
|
||||
id: 1,
|
||||
type: 1,
|
||||
tag: '热点资讯',
|
||||
title: "数字化转型要重视开源",
|
||||
content: "习主席指出，要紧跟科技强国建设进程，优化国防创新布局和环境条件，用好用足各方面优势力量和资源, sunt in culpa qui officia deserunt mollit id est laborum.",
|
||||
time: "2021-09-13",
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
type: 1,
|
||||
tag: '热点资讯',
|
||||
title: "数字化转型要重视开源数字化转型要重视开源数字化转型要重视开源",
|
||||
content: "习主席指出，要紧跟科技强国建设进程，优化国防创新布局和环境条件，用好用足各方面优势力量和资源,加快推进国防科技创新加优化国防创新布局和环境条件，用好用足各方面优势力量和资源，大幅加强科研投入，提高科研产出优化国防创新布局和环境条件，用好用足各方面优势力量和资源，大幅加强科研投入，提高科研产出",
|
||||
time: "2021-09-13",
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
type: 2,
|
||||
tag: '红山书籍',
|
||||
title: "数字化转型要重视开源数字化转型要重视开源数字化转型要重视开源",
|
||||
content: "习主席指出，要紧跟科技强国建设进程，优化国防创新布局和环境条件，用好用足各方面优势力量和资源, sunt in culpa qui officia deserunt mollit id est laborum.",
|
||||
time: "2021-09-13",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
type: 3,
|
||||
tag: '热点资讯',
|
||||
title: "数字化转型要重视开源",
|
||||
content: "习主席指出，要紧跟科技强国建设进程，优化国防创新布局和环境条件，用好用足各方面优势力量和资源, sunt in culpa qui officia deserunt mollit id est laborum.",
|
||||
time: "2021-09-13",
|
||||
}
|
||||
]
|
||||
|
||||
function SecondSection({ second }) {
|
||||
function SecondSection({ second ,main_web_site_url}) {
|
||||
|
||||
const [leftItem, setLeftItem] = useState({});
|
||||
const [list, setList] = useState([]);
|
||||
|
||||
useEffect(() => {
|
||||
const url = `/home/platform_communicates.json`;
|
||||
axios.get(url, {
|
||||
params: {
|
||||
limit: 10,
|
||||
page: 1
|
||||
}
|
||||
}).then(result => {
|
||||
if (result && result.data) {
|
||||
let communicates = result.data.communicates;
|
||||
if (communicates.length) {
|
||||
setLeftItem(communicates[0]);
|
||||
setList(communicates.slice(1, 5));
|
||||
}
|
||||
}
|
||||
}).catch(error => { });
|
||||
}, [])
|
||||
|
||||
|
||||
function goDetail(id) {
|
||||
window.open(`${main_web_site_url}/forums/${id}/detail`);
|
||||
}
|
||||
|
||||
return (
|
||||
<React.Fragment>
|
||||
<h2 className="homePage-blue-tit">社区动态</h2>
|
||||
|
|
@ -76,31 +70,30 @@ function SecondSection({ second }) {
|
|||
<i className="iconfont icon-quxiaoguanzhu"></i>
|
||||
</h3>
|
||||
|
||||
<h4 className="community-left-tit">IDRLnet: 基于内嵌物理知识神经网络的开源求解框架</h4>
|
||||
<h4 className="community-left-tit" onClick={() => { goDetail(leftItem.fake_id) }}>{leftItem.title}</h4>
|
||||
|
||||
<div className="community-left-content">
|
||||
为解决飞行器设计优化过程中物理场快速仿真问题和运行监测阶段物理场精确反演问题，国防科技创新研究院无人系统技术研究中心智能设计与鲁棒学习团队推出微分方程智能求解框架IDRLnet。
|
||||
该框架是国内首款基于内嵌物理知识神经网络的开源框架。IDRLnet作为该团队自主研发IDaaS平台的一个重要解算单元，与平台其他工具协同提升智能设计水平。IDRLnet已在红山开源平台上发布，旨在助力相关学术成果涌现，推动相关技术迭代，促进相关应用落地。
|
||||
{leftItem.content}
|
||||
</div>
|
||||
|
||||
<div className="text-center">
|
||||
<Button className="homepage-btn" type="primary">更多动态 <i className="iconfont icon-gengduoicon"></i></Button>
|
||||
<Button className="homepage-btn" type="primary" onClick={() => { window.open(`${main_web_site_url}/forums`)}}>更多动态 <i className="iconfont icon-gengduoicon"></i></Button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="home-second-section-slide">
|
||||
<Slider {...setting}>
|
||||
{
|
||||
sliderData.map((item, i) => {
|
||||
list.map((item, i) => {
|
||||
return (
|
||||
<div className="news-slide-item" key={i}>
|
||||
<div className="slide-title">
|
||||
<div className="slide-title" onClick={() => { goDetail(item.fake_id) }}>
|
||||
<span className="order-num">{i + 1}</span>
|
||||
<h3 className="slide-title-content ellipsis-1">{item.title}</h3>
|
||||
<span className={`slide-tag slide-tag-${item.type}`}>{item.tag}</span>
|
||||
</div>
|
||||
<p className="ellipsis-2">{item.content}</p>
|
||||
<span className="news-time">{item.time}</span>
|
||||
<span className="news-time">{item.created_time}</span>
|
||||
</div>
|
||||
)
|
||||
})
|
||||
|
|
|
|||
|
|
@ -1,17 +1,12 @@
|
|||
import React, { memo } from 'react';
|
||||
import React, { memo, useEffect, useState } from 'react';
|
||||
import { Button } from 'antd';
|
||||
import axios from 'axios';
|
||||
import Slider from 'react-slick';
|
||||
import "slick-carousel/slick/slick.css";
|
||||
import "slick-carousel/slick/slick-theme.css";
|
||||
import { getTestImage } from "educoder";
|
||||
import Line from '../Line';
|
||||
|
||||
import head1 from '../img/7-head1.png';
|
||||
import head2 from '../img/7-head2.png';
|
||||
import head3 from '../img/7-head3.png';
|
||||
import head4 from '../img/7-head4.png';
|
||||
import head5 from '../img/7-head5.png';
|
||||
import head6 from '../img/7-head6.png';
|
||||
import head7 from '../img/7-head7.png';
|
||||
|
||||
import './index.scss';
|
||||
|
||||
|
|
@ -29,71 +24,60 @@ let setting = {
|
|||
arrows: false,
|
||||
}
|
||||
|
||||
const personArr=[
|
||||
{
|
||||
id:1,
|
||||
name:"opersou",
|
||||
head:"/img/head.png",
|
||||
title:"Linux基金会发布《2021开源职业报告》提出新的方案，促进人才成长合作发展",
|
||||
content:"新冠疫情的大规模爆发对社会经济、人民生活各方面均造成较大影响，众多企业面临劳动用工、合同履约以及银行信贷三重危机。而今，世界各地经济正逐渐从新冠疫情常态化趋势下复苏，后疫情时代中雇佣模式的转变，对劳动关系领域带来了新挑战，这一变化与挑战在科技领域尤为凸显。当云原生技术的加速应用成为远程化工作的主流，使得相关信息化人才缺口在本次全球化疫情中更加恶化。新冠疫情的大规模爆发对社会经济、人民生活各方面均造成较大影响，众多企业面临劳动用工、合同履约以及银行信贷三重危机。而今，世界各地经济正逐渐从新冠疫情常态化趋势下复苏，后疫情时代中雇佣模式的转变，对劳动关系领域带来了新挑战，这一变化与挑战在科技领域尤为凸显。当云原生技术的加速应用成为远程化工作的主流，使得相关信息化人才缺口在本次全球化疫情中更加恶化。",
|
||||
},
|
||||
{
|
||||
id:2,
|
||||
name:"zhaojing",
|
||||
head:"/img/head.png",
|
||||
title:"Linux基金会发布《2021开源职业报告》提出新的方案，促进人才成长合作发展",
|
||||
content:"新冠疫情的大规模爆发对社会经济、人民生活各方面均造成较大影响，众多企业面临劳动用工、合同履约以及银行信贷三重危机。而今，世界各地经济正逐渐从新冠疫情常态化趋势下复苏，后疫情时代中雇佣模式的转变，对劳动关系领域带来了新挑战，这一变化与挑战在科技领域尤为凸显。",
|
||||
},
|
||||
{
|
||||
id:3,
|
||||
name:"ligang",
|
||||
head:"/img/head.png",
|
||||
title:"Linux基金会发布《2021开源职业报告》提出新的方案，促进人才成长合作发展",
|
||||
content:"新冠疫情的大规模爆发对社会经济、人民生活各方面均造成较大影响，众多企业面临劳动用工、合同履约以及银行信贷三重危机。而今，世界各地经济正逐渐从新冠疫情常态化趋势下复苏，后疫情时代中雇佣模式的转变，对劳动关系领域带来了新挑战，这一变化与挑战在科技领域尤为凸显。",
|
||||
|
||||
function SeventhSection({main_web_site_url}) {
|
||||
|
||||
const [list, setList] = useState([]);
|
||||
|
||||
useEffect(() => {
|
||||
const url = `/home/platform_people.json`;
|
||||
axios.get(url, {
|
||||
params: {
|
||||
limit: 6,
|
||||
page: 1
|
||||
}
|
||||
}).then(result => {
|
||||
if (result && result.data) {
|
||||
setList(result.data.people);
|
||||
}
|
||||
}).catch(error => { });
|
||||
}, [])
|
||||
|
||||
function goDetail(fake_login) {
|
||||
window.open(`${main_web_site_url}/accounts/${fake_login}`);
|
||||
}
|
||||
|
||||
|
||||
]
|
||||
|
||||
function SeventhSection() {
|
||||
return (
|
||||
<div className="homepage-main seventh-main">
|
||||
<h2 className="homePage-blue-tit">论坛交流</h2>
|
||||
<h4 className="homePage-subhead">论坛交流版块通过技术交流、学术探讨等方式，为社区用户提供自主交流空间，实现思维碰撞和智慧融合</h4>
|
||||
<Line />
|
||||
<div className="clients">
|
||||
<img className="client" src={head2} alt="images-not_found"/>
|
||||
<img className="client" src={head3} alt="images-not_found"/>
|
||||
<img className="client" src={head4} alt="images-not_found"/>
|
||||
<img className="client" src={head5} alt="images-not_found"/>
|
||||
<img className="client" src={head6} alt="images-not_found"/>
|
||||
<img className="client" src={head7} alt="images-not_found"/>
|
||||
{
|
||||
list.map((item, i) => {
|
||||
return (<img className="client" key={i} src={getTestImage(item.image_url)} onClick={() => { goDetail(item.fake_login) }} alt="images-not_found" />)
|
||||
})
|
||||
}
|
||||
<i className="start-icon iconfont icon-a-shuangyinhao12x"></i>
|
||||
<i className="end-icon iconfont icon-a-shuangyinhao12x"></i>
|
||||
|
||||
</div>
|
||||
<Slider {...setting}>
|
||||
<div className="issue-item" key={1}>
|
||||
<img className="author-head" src={head1} />
|
||||
<span className="issue-author">opersou</span>
|
||||
<h3 className="issue-title ellipsis-1">Linux基金会发布《2021开源职业报告》提出新的方案，促进人才成长合作发展</h3>
|
||||
<p className="issue-content ellipsis-5">新冠疫情的大规模爆发对社会经济、人民生活各方面均造成较大影响，众多企业面临劳动用工、合同履约以及银行信贷三重危机。而今，世界各地经济正逐渐从新冠疫情常态化趋势下复苏，后疫情时代中雇佣模式的转变，对劳动关系领域带来了新挑战，这一变化与挑战在科技领域尤为凸显。当云原生技术的加速应用成为远程化工作的主流，使得相关信息化人才缺口在本次全球化疫情中更加恶化。
|
||||
新冠疫情的大规模爆发对社会经济、人民生活各方面均造成较大影响，众多企业面临劳动用工、合同履约以及银行信贷三重危机。而今，世界各地经济正逐渐从新冠疫情常态化趋势下复苏，后疫情时代中雇佣模式的转变，对劳动关系领域带来了新挑战，这一变化与挑战在科技领域尤为凸显。当云原生技术的加速应用成为远程化工作的主流，使得相关信息化人才缺口在本次全球化疫情中更加恶化。</p>
|
||||
<span className="issue-time">2021-09-13</span>
|
||||
</div>
|
||||
|
||||
<div className="issue-item" key={2}>
|
||||
<img className="author-head" src={head2} />
|
||||
<span className="issue-author">李刚</span>
|
||||
<h3 className="issue-title ellipsis-1">Linux基金会发布《2021开源职业报告》</h3>
|
||||
<p className="issue-content ellipsis-5">新冠疫情的大规模爆发对社会经济、人民生活各方面均造成较大影响，众多企业面临劳动用工、合同履约以及银行信贷三重危机。而今，世界各地经济正逐渐从新冠疫情常态化趋势下复苏，后疫情时代中雇佣模式的转变，对劳动关系领域带来了新挑战，这一变化与挑战在科技领域尤为凸显。当云原生技术的加速应用成为远程化工作的主流，使得相关信息化人才缺口在本次全球化疫情中更加恶化。
|
||||
新冠疫情的大规模爆发对社会经济、人民生活各方面均造成较大影响，众多企业面临劳动用工、合同履约以及银行信贷三重危机。而今，世界各地经济正逐渐从新冠疫情常态化趋势下复苏，后疫情时代中雇佣模式的转变，对劳动关系领域带来了新挑战，这一变化与挑战在科技领域尤为凸显。当云原生技术的加速应用成为远程化工作的主流，使得相关信息化人才缺口在本次全球化疫情中更加恶化。</p>
|
||||
<span className="issue-time">2021-09-13</span>
|
||||
</div>
|
||||
{
|
||||
list.map((item, i) => {
|
||||
return (<div className="issue-item" key={i} >
|
||||
<img className="author-head" src={getTestImage(item.image_url)} onClick={() => { goDetail(item.fake_login) }} alt="images-not_found"/>
|
||||
<span className="issue-author" onClick={() => { goDetail(item.fake_login) }}>{item.name}</span>
|
||||
<h3 className="issue-title ellipsis-1">{item.announcement}</h3>
|
||||
<p className="issue-content ellipsis-5">{item.content}</p>
|
||||
<span className="issue-time">{item.created_time&&item.created_time.split(' ')[0]}</span>
|
||||
</div>)
|
||||
})
|
||||
}
|
||||
|
||||
</Slider>
|
||||
|
||||
<Button className="homepage-btn" type="primary">参与交流 <i className="iconfont icon-gengduoicon"></i></Button>
|
||||
<Button className="homepage-btn" type="primary" onClick={() => { window.open(`${main_web_site_url}/forums`)}}>参与交流 <i className="iconfont icon-gengduoicon"></i></Button>
|
||||
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
import React, { memo } from 'react';
|
||||
import React, { memo, useEffect, useState } from 'react';
|
||||
import { Button } from 'antd';
|
||||
import axios from 'axios';
|
||||
import Line from '../Line';
|
||||
import completeIcon1 from '../img/6-completeIcon1.png';
|
||||
import completeIcon2 from '../img/6-completeIcon2.png';
|
||||
|
|
@ -12,65 +13,48 @@ import overall from '../img/6-overall.png';
|
|||
import pillar1 from '../img/6-pillar1.png';
|
||||
import pillar2 from '../img/6-pillar2.png';
|
||||
import pillar3 from '../img/6-pillar3.png';
|
||||
|
||||
|
||||
import './index.scss';
|
||||
let iconArr = [completeIcon1, completeIcon2, completeIcon3];
|
||||
|
||||
|
||||
const completeArr=[{
|
||||
id:1,
|
||||
name:"CCKS 2021",
|
||||
timeStart:"2021.05.17",
|
||||
timeEnd:"2021.07.20",
|
||||
describe:"本次评测任务，探索能够落地见效的无人机领域知识图谱构建技术，促进技术发展，时代进步，技术进步",
|
||||
},{
|
||||
id:2,
|
||||
name:"CCKS 2021111",
|
||||
timeStart:"2021.05.17",
|
||||
timeEnd:"2021.07.20",
|
||||
describe:"本次评测任务，探索能够落地见效的无人机领域知识图谱构建技术，促进技术发展，时代进步，技术进步",
|
||||
},{
|
||||
id:3,
|
||||
name:"CCKS 20211111",
|
||||
timeStart:"2021.05.17",
|
||||
timeEnd:"2021.07.20",
|
||||
describe:"本次评测任务，探索能够落地见效的无人机领域知识图谱构建技术，促进技术发展，时代进步，技术进步",
|
||||
}];
|
||||
|
||||
function SixthSection({ sixth, main_web_site_url }) {
|
||||
|
||||
const [list, setList] = useState();
|
||||
|
||||
useEffect(() => {
|
||||
const url = `/home/competitions.json`;
|
||||
axios.get(url).then(result => {
|
||||
if (result && result.data) {
|
||||
setList(result.data.competitions);
|
||||
}
|
||||
}).catch(error => { });
|
||||
}, [])
|
||||
|
||||
function goDetail(id) {
|
||||
window.open(`${main_web_site_url}/competitions/${id}/enroll`);
|
||||
}
|
||||
|
||||
function SixthSection({ sixth }) {
|
||||
return (
|
||||
<div className="grid-picture">
|
||||
<div className="homepage-main sixth-main">
|
||||
|
||||
<div className={sixth ? "active complete-des" : "complete-des"}>
|
||||
|
||||
<div className="des-item">
|
||||
<img className="des-item-img" src={completeIcon1}></img>
|
||||
{
|
||||
list && list.map((item, i) => {
|
||||
return (
|
||||
<div className="des-item" key={i}>
|
||||
<img className="des-item-img" alt="竞赛" src={iconArr[i]}></img>
|
||||
<div className="des-item-content">
|
||||
<h4 className="des-item-title ellipsis-1">CCKS 2021</h4>
|
||||
<p className="des-item-time">竞赛时间：2021.05.17-2021.07.20</p>
|
||||
<p className="des-item-intro ellipsis-2">赛事简介： 本次评测任务，探索能够落地见效的无人机领域知识图谱构建技术，促进技术发展，时代进步，技术进步</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="des-item">
|
||||
<img className="des-item-img" src={completeIcon2}></img>
|
||||
<div className="des-item-content">
|
||||
<h4 className="des-item-title ellipsis-1">CCKS 2021</h4>
|
||||
<p className="des-item-time">竞赛时间：2021.05.17-2021.07.20</p>
|
||||
<p className="des-item-intro ellipsis-2">赛事简介： 本次评测任务，探索能够落地见效的无人机领域知识图谱构建技术，促进技术发展，时代进步，技术进步</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="des-item">
|
||||
<img className="des-item-img" src={completeIcon3}></img>
|
||||
<div className="des-item-content">
|
||||
<h4 className="des-item-title ellipsis-1">CCKS 2021 探索能够落地见效的无人机领域知识图谱构建技术</h4>
|
||||
<p className="des-item-time">竞赛时间：2021.05.17-2021.07.20</p>
|
||||
<p className="des-item-intro ellipsis-2">赛事简介： 本次评测任务，探索能够落地见效的无人机领域知识图谱构建技术，促进技术发展，时代进步，技术进步</p>
|
||||
<h4 className="des-item-title ellipsis-1" onClick={() => { goDetail(item.id) }}>{item.title}</h4>
|
||||
<p className="des-item-time">竞赛时间：{item.start_time && item.start_time.split(' ')[0]}-{item.end_time && item.end_time.split(' ')[0]}</p>
|
||||
<p className="des-item-intro ellipsis-2">赛事简介： {item.content}</p>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
})
|
||||
}
|
||||
</div>
|
||||
|
||||
<div className="sixth-right">
|
||||
|
|
@ -81,21 +65,21 @@ function SixthSection({ sixth }) {
|
|||
</div>
|
||||
|
||||
<div className="sixth-play-img">
|
||||
<img className="overall" src={overall}></img>
|
||||
<img className="ball" src={ball}></img>
|
||||
<img className="cup" src={cup}></img>
|
||||
<img className="net" src={net}></img>
|
||||
<img className="yLetter" src={yLetter}></img>
|
||||
<img className="pillar3" src={pillar3}></img>
|
||||
<img className="pillar2" src={pillar2}></img>
|
||||
<img className="pillar1" src={pillar1}></img>
|
||||
<img alt="images-not_found" className="overall" src={overall}></img>
|
||||
<img alt="images-not_found" className="ball" src={ball}></img>
|
||||
<img alt="images-not_found" className="cup" src={cup}></img>
|
||||
<img alt="images-not_found" className="net" src={net}></img>
|
||||
<img alt="images-not_found" className="yLetter" src={yLetter}></img>
|
||||
<img alt="images-not_found" className="pillar3" src={pillar3}></img>
|
||||
<img alt="images-not_found" className="pillar2" src={pillar2}></img>
|
||||
<img alt="images-not_found" className="pillar1" src={pillar1}></img>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<Button className="homepage-btn" type="primary">我要参赛 <i className="iconfont icon-gengduoicon"></i></Button>
|
||||
<Button className="homepage-btn" type="primary" onClick={() => { window.open(`${main_web_site_url}/competitions`) }}>我要参赛 <i className="iconfont icon-gengduoicon"></i></Button>
|
||||
<svg className="waves"
|
||||
viewBox="0 24 150 28" preserveAspectRatio="none" shapeRendering="auto">
|
||||
<defs>
|
||||
|
|
|
|||
|
|
@ -1,24 +1,28 @@
|
|||
import React, { memo } from 'react';
|
||||
import React, { memo, useEffect, useState } from 'react';
|
||||
import CountUp from 'react-countup';
|
||||
import axios from 'axios';
|
||||
import Line from '../Line';
|
||||
import './index.scss';
|
||||
|
||||
const countUpProps = {
|
||||
redraw: true,
|
||||
start: 0,
|
||||
duration:2
|
||||
duration: 1
|
||||
};
|
||||
|
||||
// 数据统计总量
|
||||
const statisticsNum={
|
||||
clickCount:23191,
|
||||
userCount:4493,
|
||||
projectCount:1526,
|
||||
taskCount:666,
|
||||
postCount:2000,
|
||||
};
|
||||
|
||||
function ThirdSection({ third }) {
|
||||
const [statisticsNum, setStatisticsNum] = useState({});
|
||||
|
||||
useEffect(() => {
|
||||
const url = `/home/platform_statistics.json`;
|
||||
axios.get(url).then(result => {
|
||||
if (result && result.data) {
|
||||
setStatisticsNum(result.data);
|
||||
}
|
||||
}).catch(error => { });
|
||||
}, [])
|
||||
|
||||
return (
|
||||
<div className="ball-background">
|
||||
<h2 className="third-tit">数据统计总览</h2>
|
||||
|
|
@ -26,10 +30,10 @@ function ThirdSection({third}) {
|
|||
<div className="homepage-main third-main ">
|
||||
<div className="circle-item">
|
||||
<div className="circle-item-box">
|
||||
<div className="circle-item-num">
|
||||
<div className="circle-item-num" style={{fontSize:statisticsNum.visits>9999999?'24px':statisticsNum.visits>99999?'36px':'48px'}}>
|
||||
<CountUp
|
||||
{...countUpProps}
|
||||
end={statisticsNum.clickCount}
|
||||
end={statisticsNum.visits}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -39,7 +43,7 @@ function ThirdSection({third}) {
|
|||
<div className="circle-item">
|
||||
<div className="circle-item-box">
|
||||
<div className="circle-item-num">
|
||||
<CountUp {...countUpProps} end={statisticsNum.userCount}/>
|
||||
<CountUp {...countUpProps} end={statisticsNum.users_count} />
|
||||
</div>
|
||||
</div>
|
||||
<h4 >平台用户数</h4>
|
||||
|
|
@ -48,7 +52,7 @@ function ThirdSection({third}) {
|
|||
<div className="circle-item">
|
||||
<div className="circle-item-box">
|
||||
<div className="circle-item-num">
|
||||
<CountUp {...countUpProps} end={statisticsNum.projectCount} />
|
||||
<CountUp {...countUpProps} end={statisticsNum.projects_count} />
|
||||
</div>
|
||||
</div>
|
||||
<h4 >开源项目托管数</h4>
|
||||
|
|
@ -57,7 +61,7 @@ function ThirdSection({third}) {
|
|||
<div className="circle-item">
|
||||
<div className="circle-item-box">
|
||||
<div className="circle-item-num">
|
||||
<CountUp {...countUpProps} end={statisticsNum.taskCount} />
|
||||
<CountUp {...countUpProps} end={statisticsNum.tasks_count} />
|
||||
</div>
|
||||
</div>
|
||||
<h4 >创客任务发布数</h4>
|
||||
|
|
@ -66,7 +70,7 @@ function ThirdSection({third}) {
|
|||
<div className="circle-item">
|
||||
<div className="circle-item-box">
|
||||
<div className="circle-item-num">
|
||||
<CountUp {...countUpProps} end={statisticsNum.postCount}/>
|
||||
<CountUp {...countUpProps} end={statisticsNum.memos_count} />
|
||||
</div>
|
||||
</div>
|
||||
<h4 >论坛发帖数量</h4>
|
||||
|
|
|
|||
Binary file not shown.
|
Before Width: | Height: | Size: 99 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 65 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 52 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 92 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 74 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 60 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 75 KiB |
|
|
@ -12,13 +12,14 @@ import SeventhSection from './SeventhSection';
|
|||
import Footer from './Footer';
|
||||
|
||||
|
||||
function HomePage(props) {
|
||||
|
||||
function HomePage({ history }) {
|
||||
|
||||
useEffect(() => {
|
||||
window.addEventListener("scroll", scrollListener);
|
||||
window.addEventListener("scroll", scrollListener, false);
|
||||
return () => {
|
||||
window.removeEventListener("scroll");
|
||||
};
|
||||
window.removeEventListener("scroll", scrollListener, false);
|
||||
}
|
||||
}, []);
|
||||
|
||||
const [first, setFirst] = useState(true);
|
||||
|
|
@ -28,6 +29,9 @@ function HomePage(props) {
|
|||
const [fifth, setFifth] = useState(false);
|
||||
const [sixth, setSixth] = useState(false);
|
||||
|
||||
let settings = JSON.parse(localStorage.chromesetting);
|
||||
let main_web_site_url = settings.main_web_site_url;
|
||||
|
||||
|
||||
function scrollListener() {
|
||||
let clientHeight = document.body.clientHeight;
|
||||
|
|
@ -107,7 +111,7 @@ function HomePage(props) {
|
|||
|
||||
|
||||
<div className="home-second-section">
|
||||
<SecondSection second={second} />
|
||||
<SecondSection second={second} main_web_site_url={main_web_site_url} />
|
||||
</div>
|
||||
|
||||
|
||||
|
|
@ -116,19 +120,19 @@ function HomePage(props) {
|
|||
</div>
|
||||
|
||||
<div className="home-fourth-section">
|
||||
<FourthSection fourth={fourth} />
|
||||
<FourthSection fourth={fourth} history={history} />
|
||||
</div>
|
||||
|
||||
<div className="home-fifth-section">
|
||||
<FifthSection fifth={fifth} />
|
||||
<FifthSection fifth={fifth} history={history} />
|
||||
</div>
|
||||
|
||||
<div className="home-sixth-section">
|
||||
<SixthSection sixth={sixth} />
|
||||
<SixthSection sixth={sixth} main_web_site_url={main_web_site_url} />
|
||||
</div>
|
||||
|
||||
<div className="home-seventh-section">
|
||||
<SeventhSection />
|
||||
<SeventhSection main_web_site_url={main_web_site_url} />
|
||||
</div>
|
||||
|
||||
<Footer />
|
||||
|
|
|
|||
Loading…
Reference in New Issue