forked from Gitlink/forgeplus-react
del
This commit is contained in:
parent
633b4fb8fd
commit
b9de31421e
|
@ -1,167 +0,0 @@
|
|||
import React , { useEffect , useState } from 'react';
|
||||
import "./Index.scss";
|
||||
import TopEdition from './TopEdition';
|
||||
import ThirdEdition from './ThirdEdition';
|
||||
import { Anchor } from 'antd';
|
||||
import F41 from './Img/4-1.png';
|
||||
import F42 from './Img/4-2.png';
|
||||
import F43 from './Img/4-3.png';
|
||||
import F44 from './Img/4-4.png';
|
||||
import SecondEdition from './SecondEdition';
|
||||
import FifthEdition from './FifthEdition';
|
||||
import { TPMIndexHOC } from '../modules/tpm/TPMIndexHOC';
|
||||
import Axios from 'axios';
|
||||
|
||||
function Index(props) {
|
||||
const [ value , setValue ] = useState("");
|
||||
const [ flag , setFlag ] = useState(true);
|
||||
|
||||
const [ bannerTab , setBannerTab ] = useState(undefined);
|
||||
const register = props && props.mygetHelmetapi && props.mygetHelmetapi.common && props.mygetHelmetapi.common.register;
|
||||
|
||||
const { current_user } = props;
|
||||
useEffect(()=>{
|
||||
window.addEventListener("scroll",scrollListener);
|
||||
getTab();
|
||||
return ComponentWillUnmount;
|
||||
},[])
|
||||
|
||||
function ComponentWillUnmount() {
|
||||
window.removeEventListener("scroll",scrollListener);
|
||||
}
|
||||
|
||||
function getTab() {
|
||||
const url = `/topics.json?topic_type=card`;
|
||||
Axios.get(url,{
|
||||
params:{
|
||||
limit:3
|
||||
}
|
||||
}).then(result=>{
|
||||
if(result){
|
||||
setBannerTab(result.data.topics);
|
||||
}
|
||||
}).catch(error=>{})
|
||||
}
|
||||
|
||||
function scrollListener(event) {
|
||||
|
||||
let third = document.getElementById("thirdContent").offsetTop;
|
||||
let top = document.documentElement.scrollTop + 60;
|
||||
if(top>= third)
|
||||
{
|
||||
setFlag(false)
|
||||
}else{
|
||||
setFlag(true)
|
||||
}
|
||||
}
|
||||
|
||||
function changeActive(params) {
|
||||
if(params){
|
||||
setValue(params);
|
||||
let h = params.split("#")[1];
|
||||
let t = document.getElementById(h).offsetTop;
|
||||
document.documentElement.scrollTop = t-100;
|
||||
}else{
|
||||
setValue("");
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
return(
|
||||
<div className="homePage">
|
||||
<div className="topEdition">
|
||||
{/* <HeadNav {...props}/> */}
|
||||
<TopEdition register={register} current_user={current_user}/>
|
||||
{
|
||||
bannerTab && bannerTab.length > 0 ?
|
||||
<ul className="topEditionUl">
|
||||
{
|
||||
bannerTab.map((i,k)=>{
|
||||
return(
|
||||
<a href={i.url} target="_blank" className="font-18">
|
||||
<li>
|
||||
{i.title}
|
||||
</li>
|
||||
</a>
|
||||
)
|
||||
})
|
||||
}
|
||||
</ul>
|
||||
:
|
||||
<ul className="topEditionUl">
|
||||
<a href="https://forum.trustie.net/forums/4666/detail" target="_blank" className="font-18">
|
||||
<li>
|
||||
CCF开源发展委员会首批执行委员名单发布
|
||||
</li>
|
||||
</a>
|
||||
<a href="https://forgeplus.trustie.net/Gitlink/forgeplus" target="_blank" className="font-18">
|
||||
<li>
|
||||
平台精选仓库:GitLink/GitLink
|
||||
</li>
|
||||
</a>
|
||||
<a href="https://forum.trustie.net/forums/4663/detail" target="_blank" className="font-18">
|
||||
<li>
|
||||
OpenHarmony系统介绍及赛题说明
|
||||
</li>
|
||||
</a>
|
||||
</ul>
|
||||
}
|
||||
|
||||
</div>
|
||||
|
||||
<div className="secondEdition">
|
||||
<p className="theTitle">GitLink,新一代开源创新服务平台</p>
|
||||
{
|
||||
flag &&
|
||||
<Anchor>
|
||||
<li onClick={()=>changeActive("#hadoop")} className={value === "#hadoop"?"active":""}><a>分布式协作开发</a></li>
|
||||
<li onClick={()=>changeActive("#oneStop")} className={value === "#oneStop"?"active":""}><a>一站式过程管理</a></li>
|
||||
<li onClick={()=>changeActive("#highDevops")} className={value === "#highDevops"?"active":""}><a>高效流水线运维</a></li>
|
||||
<li onClick={()=>changeActive("#multipleAnalyse")} className={value === "#multipleAnalyse"?"active":""}><a>多层次代码分析</a></li>
|
||||
<li onClick={()=>changeActive("#multidimensional")} className={value === "#multidimensional"?"active":""}><a>多维度用户画像</a></li>
|
||||
</Anchor>
|
||||
}
|
||||
<SecondEdition {...props} setValue={setValue}/>
|
||||
</div>
|
||||
<div id="thirdContent">
|
||||
<ThirdEdition />
|
||||
</div>
|
||||
|
||||
<div className="forthEdition">
|
||||
<p className="theTitle">加入GitLink,和社区伙伴们一起踏上开源创新的辉煌旅程!</p>
|
||||
<div style={{marginBottom:"80px"}}>
|
||||
{ !(current_user && current_user.login) && <a className="qulikyreg" href={register}>立即注册</a> }
|
||||
</div>
|
||||
<ul className="forthUl">
|
||||
<li>
|
||||
<img src={F41} alt="" width={"100px"}/>
|
||||
<span className="forthtitle">发现</span>
|
||||
<span className="forthsubtitle">探索丰富优质的开发资源</span>
|
||||
</li>
|
||||
<li>
|
||||
<img src={F42} alt="" width={"101px"}/>
|
||||
<span className="forthtitle">加入</span>
|
||||
<span className="forthsubtitle">寻找志同道合的协作伙伴</span>
|
||||
</li>
|
||||
<li>
|
||||
<img src={F43} alt="" width={"104px"}/>
|
||||
<span className="forthtitle">合作</span>
|
||||
<span className="forthsubtitle">开启开放共享的协同之旅</span>
|
||||
</li>
|
||||
<li>
|
||||
<img src={F44} alt="" width={"87px"}/>
|
||||
<span className="forthtitle">贡献</span>
|
||||
<span className="forthsubtitle">书写开源创新的精彩成就</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div className="fifthEdition">
|
||||
<p className="title">开源生态</p>
|
||||
<p className="subtitle">GitLink与各大企业、高校、科研机构开展广泛的技术合作,推动我国开源软件生态的快速构建与发展</p>
|
||||
<FifthEdition />
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
export default TPMIndexHOC(Index);
|
|
@ -1,167 +0,0 @@
|
|||
import React , { useEffect , useState } from 'react';
|
||||
import "./Index.scss";
|
||||
import TopEdition from './TopEdition';
|
||||
import ThirdEdition from './ThirdEdition';
|
||||
import { Anchor } from 'antd';
|
||||
import F41 from './Img/4-1.png';
|
||||
import F42 from './Img/4-2.png';
|
||||
import F43 from './Img/4-3.png';
|
||||
import F44 from './Img/4-4.png';
|
||||
import SecondEdition from './SecondEdition';
|
||||
import FifthEdition from './FifthEdition';
|
||||
import { TPMIndexHOC } from '../modules/tpm/TPMIndexHOC';
|
||||
import Axios from 'axios';
|
||||
|
||||
function Index(props) {
|
||||
const [ value , setValue ] = useState("");
|
||||
const [ flag , setFlag ] = useState(true);
|
||||
|
||||
const [ bannerTab , setBannerTab ] = useState(undefined);
|
||||
const register = props && props.mygetHelmetapi && props.mygetHelmetapi.common && props.mygetHelmetapi.common.register;
|
||||
|
||||
const { current_user } = props;
|
||||
useEffect(()=>{
|
||||
window.addEventListener("scroll",scrollListener);
|
||||
getTab();
|
||||
return ComponentWillUnmount;
|
||||
},[])
|
||||
|
||||
function ComponentWillUnmount() {
|
||||
window.removeEventListener("scroll",scrollListener);
|
||||
}
|
||||
|
||||
function getTab() {
|
||||
const url = `/topics.json?topic_type=card`;
|
||||
Axios.get(url,{
|
||||
params:{
|
||||
limit:3
|
||||
}
|
||||
}).then(result=>{
|
||||
if(result){
|
||||
setBannerTab(result.data.topics);
|
||||
}
|
||||
}).catch(error=>{})
|
||||
}
|
||||
|
||||
function scrollListener(event) {
|
||||
|
||||
let third = document.getElementById("thirdContent").offsetTop;
|
||||
let top = document.documentElement.scrollTop + 60;
|
||||
if(top>= third)
|
||||
{
|
||||
setFlag(false)
|
||||
}else{
|
||||
setFlag(true)
|
||||
}
|
||||
}
|
||||
|
||||
function changeActive(params) {
|
||||
if(params){
|
||||
setValue(params);
|
||||
let h = params.split("#")[1];
|
||||
let t = document.getElementById(h).offsetTop;
|
||||
document.documentElement.scrollTop = t-100;
|
||||
}else{
|
||||
setValue("");
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
return(
|
||||
<div className="homePage">
|
||||
<div className="topEdition">
|
||||
{/* <HeadNav {...props}/> */}
|
||||
<TopEdition register={register} current_user={current_user}/>
|
||||
{
|
||||
bannerTab && bannerTab.length > 0 ?
|
||||
<ul className="topEditionUl">
|
||||
{
|
||||
bannerTab.map((i,k)=>{
|
||||
return(
|
||||
<a href={i.url} target="_blank" className="font-18">
|
||||
<li>
|
||||
{i.title}
|
||||
</li>
|
||||
</a>
|
||||
)
|
||||
})
|
||||
}
|
||||
</ul>
|
||||
:
|
||||
<ul className="topEditionUl">
|
||||
<a href="https://forum.trustie.net/forums/4666/detail" target="_blank" className="font-18">
|
||||
<li>
|
||||
CCF开源发展委员会首批执行委员名单发布
|
||||
</li>
|
||||
</a>
|
||||
<a href="https://forgeplus.trustie.net/Gitlink/forgeplus" target="_blank" className="font-18">
|
||||
<li>
|
||||
平台精选仓库:GitLink/GitLink
|
||||
</li>
|
||||
</a>
|
||||
<a href="https://forum.trustie.net/forums/4663/detail" target="_blank" className="font-18">
|
||||
<li>
|
||||
OpenHarmony系统介绍及赛题说明
|
||||
</li>
|
||||
</a>
|
||||
</ul>
|
||||
}
|
||||
|
||||
</div>
|
||||
|
||||
<div className="secondEdition">
|
||||
<p className="theTitle">GitLink,新一代开源创新服务平台</p>
|
||||
{
|
||||
flag &&
|
||||
<Anchor>
|
||||
<li onClick={()=>changeActive("#hadoop")} className={value === "#hadoop"?"active":""}><a>分布式协作开发</a></li>
|
||||
<li onClick={()=>changeActive("#oneStop")} className={value === "#oneStop"?"active":""}><a>一站式过程管理</a></li>
|
||||
<li onClick={()=>changeActive("#highDevops")} className={value === "#highDevops"?"active":""}><a>高效流水线运维</a></li>
|
||||
<li onClick={()=>changeActive("#multipleAnalyse")} className={value === "#multipleAnalyse"?"active":""}><a>多层次代码分析</a></li>
|
||||
<li onClick={()=>changeActive("#multidimensional")} className={value === "#multidimensional"?"active":""}><a>多维度用户画像</a></li>
|
||||
</Anchor>
|
||||
}
|
||||
<SecondEdition {...props} setValue={setValue}/>
|
||||
</div>
|
||||
<div id="thirdContent">
|
||||
<ThirdEdition />
|
||||
</div>
|
||||
|
||||
<div className="forthEdition">
|
||||
<p className="theTitle">加入GitLink,和社区伙伴们一起踏上开源创新的辉煌旅程!</p>
|
||||
<div style={{marginBottom:"80px"}}>
|
||||
{ !(current_user && current_user.login) && <a className="qulikyreg" href={register}>立即注册</a> }
|
||||
</div>
|
||||
<ul className="forthUl">
|
||||
<li>
|
||||
<img src={F41} alt="" width={"100px"}/>
|
||||
<span className="forthtitle">发现</span>
|
||||
<span className="forthsubtitle">探索丰富优质的开发资源</span>
|
||||
</li>
|
||||
<li>
|
||||
<img src={F42} alt="" width={"101px"}/>
|
||||
<span className="forthtitle">加入</span>
|
||||
<span className="forthsubtitle">寻找志同道合的协作伙伴</span>
|
||||
</li>
|
||||
<li>
|
||||
<img src={F43} alt="" width={"104px"}/>
|
||||
<span className="forthtitle">合作</span>
|
||||
<span className="forthsubtitle">开启开放共享的协同之旅</span>
|
||||
</li>
|
||||
<li>
|
||||
<img src={F44} alt="" width={"87px"}/>
|
||||
<span className="forthtitle">贡献</span>
|
||||
<span className="forthsubtitle">书写开源创新的精彩成就</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div className="fifthEdition">
|
||||
<p className="title">开源生态</p>
|
||||
<p className="subtitle">GitLink与各大企业、高校、科研机构开展广泛的技术合作,推动我国开源软件生态的快速构建与发展</p>
|
||||
<FifthEdition />
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
export default TPMIndexHOC(Index);
|
Loading…
Reference in New Issue