开芯院首页
This commit is contained in:
黄心宇
parent
c7569e3c08
commit
fe4215ad5c
|
|
@ -388,6 +388,14 @@ class App extends Component {
|
|||
}
|
||||
}>
|
||||
</Route>
|
||||
<Route
|
||||
path={"/zone1/:deptId"}
|
||||
render={
|
||||
(props) => {
|
||||
return (<Information {...this.props} {...props} {...this.state} />)
|
||||
}
|
||||
}>
|
||||
</Route>
|
||||
<Route
|
||||
path={"/settings"}
|
||||
render={
|
||||
|
|
|
|||
|
|
@ -0,0 +1,42 @@
|
|||
import React , { useEffect } from 'react';
|
||||
import Slider from 'react-slick';
|
||||
import { Link } from 'react-router-dom';
|
||||
|
||||
const settings = {
|
||||
dots: true,
|
||||
infinite: true,
|
||||
speed: 500,
|
||||
slidesToShow: 3,
|
||||
slidesToScroll: 3,
|
||||
arrows: false,
|
||||
adaptiveHeight: true,
|
||||
};
|
||||
|
||||
function Contributor(props) {
|
||||
const { personList } = props
|
||||
return(
|
||||
<div className="boxmain zone_c_lists">
|
||||
{
|
||||
personList && personList.length > 0 ?
|
||||
<Slider {...settings}>
|
||||
{
|
||||
personList.map((i,k)=>{
|
||||
return(
|
||||
<div className="container">
|
||||
<div className="c_item">
|
||||
<Link to={`/${i.login}`}><img src={i.imageUrl} alt="" /></Link>
|
||||
<span className="c_name">{i.name}</span>
|
||||
<p className="c_desc task-hide-2" style={{display:i.introduction?"":"flex"}}>{i.introduction || "暂无~"}</p>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
})
|
||||
}
|
||||
</Slider>
|
||||
:""
|
||||
}
|
||||
</div>
|
||||
|
||||
)
|
||||
}
|
||||
export default Contributor;
|
||||
|
|
@ -1,7 +1,7 @@
|
|||
import React from 'react';
|
||||
import { Link } from 'react-router-dom';
|
||||
|
||||
function Hot({list , title,deptId}){
|
||||
function Hot({list , title, deptId, temp}){
|
||||
return(
|
||||
<div>
|
||||
<p className="hot_title">{title}</p>
|
||||
|
|
@ -13,7 +13,7 @@ function Hot({list , title,deptId}){
|
|||
return(
|
||||
<li>
|
||||
<span style={{opacity:k<3 ? `${1-((k+1)/10)}` :"0.3"}}>{k+1}</span>
|
||||
<Link to={`/zone/${deptId}/newdetail/${i.id}`}>{i.name}</Link>
|
||||
<Link to={`/${temp}/${deptId}/newdetail/${i.id}`}>{i.name}</Link>
|
||||
</li>
|
||||
)
|
||||
})
|
||||
|
|
|
|||
|
|
@ -0,0 +1,50 @@
|
|||
import React , { useState } from 'react';
|
||||
|
||||
|
||||
|
||||
function PublicBanner(props){
|
||||
const [ key , setKey ] = useState("1");
|
||||
const { deptId } = props.match.params;
|
||||
const { pathname } = props.history.location;
|
||||
const { data , adminUrl } = props;
|
||||
|
||||
return(
|
||||
<div className="zone_news">
|
||||
<p className="in_title mb40">新闻动态</p>
|
||||
<div className="boxmain" style={{display:"flex"}}>
|
||||
<div className="zone_new_first">
|
||||
<img src={newsList[0].headImg || img1} alt="" height="302px" style={{width:"100%",objectFit:"cover"}} className="mb30"/>
|
||||
<Link to={`/${temp}/${deptId}/newdetail/${newsList[0].id}`} className="zone_n_title task-hide">{newsList[0].name}</Link>
|
||||
<p className="zone_n_desc task-hide-2">{newsList[0].summary}</p>
|
||||
<p className="font-13 mt10 flexCenter" style={{color:"#8d95a3"}}>
|
||||
<img src={shijian} alt="" className="mr3" />
|
||||
{newsList[0].publishTime}
|
||||
</p>
|
||||
<p className="mt15">
|
||||
<Link to={`/${temp}/${deptId}/newdetail/${newsList[0].id}`} className="color-blue flexCenter zone_btn">查看详情<img src={guideArrow} alt="" width="14px" className="ml3"/></Link>
|
||||
</p>
|
||||
</div>
|
||||
<ul className={`zone_new_three ${newsList.length <4 ? "flexStart" : "spaceeTween"}`}>
|
||||
{
|
||||
newsList.map((i,k)=>{
|
||||
return(
|
||||
k > 0 && <li>
|
||||
<Link className="zone_n_title task-hide" to={`/${temp}/${deptId}/newdetail/${i.id}`}>{i.name}</Link>
|
||||
<p className="zone_n_desc task-hide-2 mt10">{i.summary}</p>
|
||||
<p className="zone_n_value">
|
||||
<span className="font-13" style={{color:"#8d95a3"}}>
|
||||
<img src={shijian} alt="" className="mr3" />
|
||||
{i.publishTime}
|
||||
</span>
|
||||
<Link to={`/${temp}/${deptId}/newdetail/${i.id}`} className="color-blue flexCenter zone_btn">查看详情<img src={guideArrow} alt="" width="14px"/></Link>
|
||||
</p>
|
||||
</li>
|
||||
)
|
||||
})
|
||||
}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
export default newBox;
|
||||
|
|
@ -0,0 +1,95 @@
|
|||
import React , { useEffect } from 'react';
|
||||
import Slider from 'react-slick';
|
||||
import { httpUrl } from '../fetch';
|
||||
import axios from 'axios';
|
||||
import { useState } from 'react';
|
||||
|
||||
const settings = {
|
||||
dots: false,
|
||||
infinite: true,
|
||||
slidesToShow: 1,
|
||||
slidesToScroll: 1,
|
||||
vertical: true,
|
||||
verticalSwiping: true,
|
||||
autoplay:true,
|
||||
arrows:false
|
||||
};
|
||||
function Partner(props) {
|
||||
const [ topics ,setTopics ] = useState(undefined);
|
||||
const { id } = props;
|
||||
|
||||
useEffect(()=>{
|
||||
getPartnerList();
|
||||
},[id])
|
||||
|
||||
function getPartnerList(){
|
||||
const url = `${httpUrl}/zone/open/${id}/partners/list`;
|
||||
axios.get(url).then(result=>{
|
||||
if(result){
|
||||
getUnit(result.data.rows)
|
||||
}
|
||||
}).catch(error=>{})
|
||||
}
|
||||
|
||||
function getUnit(array){
|
||||
const newArray = [];
|
||||
for(let i = 0; i< array.length;) {
|
||||
newArray.push(array.slice(i, i += 5));
|
||||
}
|
||||
setTopics(newArray)
|
||||
}
|
||||
|
||||
function Init() {
|
||||
let box = document.getElementById('scrollBox1');
|
||||
scrollUp();
|
||||
var myTimer = setInterval(scrollUp, 10);
|
||||
// 鼠标移入container 元素上 清除定时器 停止滚动
|
||||
box.onmouseover = () => {
|
||||
clearInterval(myTimer);
|
||||
}
|
||||
// 鼠标移出container 元素上 继续滚动
|
||||
// 60表示每隔60毫秒向上滚动一次
|
||||
box.onmouseout = () => {
|
||||
myTimer = setInterval(scrollUp, 10);
|
||||
}
|
||||
}
|
||||
|
||||
function scrollUp() {
|
||||
let box = document.getElementById('scrollBox1');
|
||||
if(box){
|
||||
let con1 = document.getElementById('box1');
|
||||
if (box.scrollLeft >= con1.clientWidth) {
|
||||
box.scrollLeft = 0;
|
||||
} else {
|
||||
box.scrollLeft++;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return(
|
||||
<div id={"scrollBox1"}>
|
||||
{
|
||||
topics && topics.length>0 ?
|
||||
<Slider {...settings} className="unitMainSlider">
|
||||
{
|
||||
topics.map((i,k)=>{
|
||||
return(
|
||||
<div className="slickMainline">
|
||||
{
|
||||
i.map((j,k1)=>{
|
||||
return(
|
||||
<a href={j.link} target="_blank"><img src={j.logo} alt=""/></a>
|
||||
)
|
||||
})
|
||||
}
|
||||
</div>
|
||||
)
|
||||
})
|
||||
}
|
||||
</Slider>
|
||||
:""
|
||||
}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
export default Partner;
|
||||
|
|
@ -0,0 +1,58 @@
|
|||
import React , { useEffect } from 'react';
|
||||
import Slider from 'react-slick';
|
||||
import projectRight from '../img/projectRight.png';
|
||||
import projectLeft from '../img/projectLeft.png';
|
||||
|
||||
function SampleNextArrow(props) {
|
||||
const { className, style } = props;
|
||||
return (
|
||||
<img src={projectRight} className={`right_arraw ${className}`}></img>
|
||||
);
|
||||
}
|
||||
|
||||
function SamplePrevArrow(props) {
|
||||
const { className, style } = props;
|
||||
return (
|
||||
<img src={projectLeft} className={`left_arraw ${className}`}></img>
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
const settings = {
|
||||
className: "center",
|
||||
centerMode: true,
|
||||
centerPadding: "100px",
|
||||
slidesToShow: 3,
|
||||
speed: 500,
|
||||
nextArrow: <SampleNextArrow className="right_arraw"/>,
|
||||
prevArrow: <SamplePrevArrow className="left_arraw"/>
|
||||
};
|
||||
|
||||
function Projects(props) {
|
||||
const { projectList } = props
|
||||
|
||||
return(
|
||||
<div className="boxmain">
|
||||
{
|
||||
projectList && projectList.length > 0 ?
|
||||
<Slider {...settings}>
|
||||
{
|
||||
projectList.map((i,k)=>{
|
||||
return(
|
||||
<div className="container">
|
||||
<div className="zone_p_item" onClick={()=>window.open(i.projectURL)}>
|
||||
{i.projectProperties && i.projectProperties.authorImageUrl && <img className="info_img" src={i.projectProperties.authorImageUrl} alt="" /> }
|
||||
<p className="z_p_title task-hide">{i.projectProperties && i.projectProperties.name}</p>
|
||||
<p className="z_p_desc task-hide-2">{i.projectProperties && i.projectProperties.description ? i.projectProperties.description : "暂无~"}</p>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
})
|
||||
}
|
||||
</Slider>
|
||||
:""
|
||||
}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
export default Projects;
|
||||
|
|
@ -1,14 +1,9 @@
|
|||
import React , { useState , useEffect } from 'react';
|
||||
import { Menu } from 'antd';
|
||||
import Menu1 from '../img/menu1.png';
|
||||
import Menu2 from '../img/menu2.png';
|
||||
import Menu3 from '../img/menu3.png';
|
||||
import Menu4 from '../img/menu4.png';
|
||||
import Menu5 from '../img/menu5.png';
|
||||
import Menu6 from '../img/menu6.png';
|
||||
import Menu7 from '../img/menu7.png';
|
||||
import banner from '../img/mainbanner.png'
|
||||
import { Link } from 'react-router-dom';
|
||||
import { tempConfig } from '../tempInfo';
|
||||
|
||||
|
||||
|
||||
|
|
@ -17,16 +12,16 @@ function PublicBanner(props){
|
|||
const { deptId } = props.match.params;
|
||||
const { pathname } = props.history.location;
|
||||
const { data , adminUrl } = props;
|
||||
|
||||
const temp = props.pathName
|
||||
|
||||
|
||||
useEffect(()=>{
|
||||
if(pathname){
|
||||
const info = /\/zone\/[A-Za-z0-9]{0,}\/news/g;
|
||||
const infodetail = /\/zone\/[A-Za-z0-9]{0,}\/newdetail/g;
|
||||
const project = /\/zone\/[A-Za-z0-9]{0,}\/projects/g;
|
||||
const vip = /\/zone\/[A-Za-z0-9]{0,}\/VIP/g;
|
||||
if(pathname === `/zone/${deptId}`){
|
||||
const info = /[A-Za-z0-9]{0,}\/news/g;
|
||||
const infodetail = /[A-Za-z0-9]{0,}\/newdetail/g;
|
||||
const project = /[A-Za-z0-9]{0,}\/projects/g;
|
||||
const vip = /[A-Za-z0-9]{0,}\/VIP/g;
|
||||
if(pathname === `/${temp}/${deptId}`){
|
||||
setKey("1");
|
||||
}
|
||||
else if(project.test(pathname)){
|
||||
|
|
@ -52,12 +47,12 @@ function PublicBanner(props){
|
|||
}
|
||||
<div className="bannerMenus">
|
||||
<Menu mode={"horizontal"} selectedKeys={[key]}>
|
||||
<Menu.Item key={"1"}><Link to={`/zone/${deptId}`}><img src={Menu1} alt="" width="29px"/>首页</Link></Menu.Item>
|
||||
<Menu.Item key={"2"}><Link to={`/zone/${deptId}/projects`}><img src={Menu2} alt="" width="34px"/>开源项目</Link></Menu.Item>
|
||||
<Menu.Item key={"1"}><Link to={`/${temp}/${deptId}`}><img src={require(`../img/${temp}Menu1.png`)} alt="" width="29px"/>首页</Link></Menu.Item>
|
||||
<Menu.Item key={"2"}><Link to={`/${temp}/${deptId}/projects`}><img src={require(`../img/${temp}Menu2.png`)} alt="" width="34px"/>开源项目</Link></Menu.Item>
|
||||
{/* <Menu.Item key={"3"}><img src={Menu3} alt="" width="33px"/>资源发布</Menu.Item> */}
|
||||
<Menu.Item key={"4"}><Link to={`/zone/${deptId}/news`}><img src={Menu4} alt="" width="32px"/>领域资讯</Link></Menu.Item>
|
||||
<Menu.Item key={"4"}><Link to={`/${temp}/${deptId}/news`}><img src={require(`../img/${temp}Menu4.png`)} alt="" width="32px"/>{ tempConfig[temp].mainTitle }</Link></Menu.Item>
|
||||
{/* <Menu.Item key={"5"}><img src={Menu5} alt="" width="27px"/>Sig小组</Menu.Item> */}
|
||||
<Menu.Item key={"6"}><Link to={`/zone/${deptId}/VIP`}><img src={Menu6} alt="" width="36px"/>专区会员</Link></Menu.Item>
|
||||
<Menu.Item key={"6"}><Link to={`/${temp}/${deptId}/VIP`}><img src={require(`../img/${temp}Menu6.png`)} alt="" width="36px"/>{ tempConfig[temp].member }</Link></Menu.Item>
|
||||
{ adminUrl && <Menu.Item key={"7"}><a onClick={()=>{window.location.href=adminUrl}}><img src={Menu7} alt="" width="34px"/>后台管理</a></Menu.Item> }
|
||||
</Menu>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,16 +1,20 @@
|
|||
import React,{ useState, useEffect } from 'react';
|
||||
import img1 from '../img/img1.png';
|
||||
import img2 from '../img/img2.png';
|
||||
import { httpUrl } from '../fetch';
|
||||
import guideArrow from '../img/guideArrow.png';
|
||||
import { Link } from 'react-router-dom';
|
||||
import shijian from '../img/shijian.png';
|
||||
import { getHomePageList , gethomePageDocList , getAllList } from '../api';
|
||||
import axios from 'axios';
|
||||
import Nodata from '../../Nodata';
|
||||
|
||||
function HeaderPage(props){
|
||||
const [ projectList , setProjectList ] = useState(undefined);
|
||||
const [ personList , setPersonList ] = useState(undefined);
|
||||
const [ newsList, setNewsList ] = useState(undefined);
|
||||
const { deptId } = props.match.params;
|
||||
const { data , id } = props;
|
||||
const { data, id } = props;
|
||||
const temp = props.pathName
|
||||
|
||||
useEffect(()=>{
|
||||
if(id){
|
||||
|
|
@ -21,7 +25,8 @@ function HeaderPage(props){
|
|||
},[id])
|
||||
|
||||
function getPersonList(){
|
||||
getHomePageList(id).then(result=>{
|
||||
const url = `${httpUrl}/zone/open/${id}/member/homePageList`;
|
||||
axios.get(url).then(result=>{
|
||||
if(result){
|
||||
setPersonList(result.data.rows);
|
||||
}
|
||||
|
|
@ -29,7 +34,8 @@ function HeaderPage(props){
|
|||
}
|
||||
|
||||
function getNewsList(){
|
||||
gethomePageDocList(id).then(result=>{
|
||||
const url = `${httpUrl}/cms/doc/open/zone/${id}/homePageDocList`;
|
||||
axios.get(url).then(result=>{
|
||||
if(result){
|
||||
setNewsList(result.data.rows);
|
||||
}
|
||||
|
|
@ -37,7 +43,10 @@ function HeaderPage(props){
|
|||
}
|
||||
|
||||
function getProjectList(){
|
||||
getAllList(id,{isHomepage:1}).then(result=>{
|
||||
const url = `${httpUrl}/zone/open/${id}/project/list`;
|
||||
axios.get(url,{params:{
|
||||
isHomepage:1
|
||||
}}).then(result=>{
|
||||
if(result){
|
||||
setProjectList(result.data.rows);
|
||||
}
|
||||
|
|
@ -50,12 +59,12 @@ function HeaderPage(props){
|
|||
data && (data.introductionTitle || data.introductionContent || data.introductionImage) &&
|
||||
<div className="boxmain zone_infos">
|
||||
<div className="zone_infos_desc">
|
||||
{data.introductionTitle && <p className="z_name">{data.introductionTitle}</p>}
|
||||
<p className="z_desc task-hide-2" style={{WebkitLineClamp:data.introductionTitle?"4":"7"}}>{data.introductionContent}</p>
|
||||
<p className="z_name">{data.introductionTitle}</p>
|
||||
<p className="z_desc task-hide-2">{data.introductionContent}</p>
|
||||
</div>
|
||||
{
|
||||
data.introductionImage &&
|
||||
<img src={data.introductionImage} alt="" height="277px"/>
|
||||
<img src={data.introductionImage} alt="" width="474px" height="277px"/>
|
||||
}
|
||||
</div>
|
||||
}
|
||||
|
|
@ -66,14 +75,14 @@ function HeaderPage(props){
|
|||
<div className="boxmain" style={{display:"flex"}}>
|
||||
<div className="zone_new_first">
|
||||
<img src={newsList[0].headImg || img1} alt="" height="302px" style={{width:"100%",objectFit:"cover"}} className="mb30"/>
|
||||
<Link to={`/zone/${deptId}/newdetail/${newsList[0].id}`} className="zone_n_title task-hide">{newsList[0].name}</Link>
|
||||
<Link to={`/${temp}/${deptId}/newdetail/${newsList[0].id}`} className="zone_n_title task-hide">{newsList[0].name}</Link>
|
||||
<p className="zone_n_desc task-hide-2">{newsList[0].summary}</p>
|
||||
<p className="font-13 mt10 flexCenter" style={{color:"#8d95a3"}}>
|
||||
<img src={shijian} alt="" className="mr3" />
|
||||
{newsList[0].publishTime}
|
||||
</p>
|
||||
<p className="mt15">
|
||||
<Link to={`/zone/${deptId}/newdetail/${newsList[0].id}`} className="color-blue flexCenter zone_btn">查看详情<img src={guideArrow} alt="" width="14px" className="ml3"/></Link>
|
||||
<Link to={`/${temp}/${deptId}/newdetail/${newsList[0].id}`} className="color-blue flexCenter zone_btn">查看详情<img src={guideArrow} alt="" width="14px" className="ml3"/></Link>
|
||||
</p>
|
||||
</div>
|
||||
<ul className={`zone_new_three ${newsList.length <4 ? "flexStart" : "spaceeTween"}`}>
|
||||
|
|
@ -81,14 +90,14 @@ function HeaderPage(props){
|
|||
newsList.map((i,k)=>{
|
||||
return(
|
||||
k > 0 && <li>
|
||||
<Link className="zone_n_title task-hide" to={`/zone/${deptId}/newdetail/${i.id}`}>{i.name}</Link>
|
||||
<Link className="zone_n_title task-hide" to={`/${temp}/${deptId}/newdetail/${i.id}`}>{i.name}</Link>
|
||||
<p className="zone_n_desc task-hide-2 mt10">{i.summary}</p>
|
||||
<p className="zone_n_value">
|
||||
<span className="font-13" style={{color:"#8d95a3"}}>
|
||||
<img src={shijian} alt="" className="mr3" />
|
||||
{i.publishTime}
|
||||
</span>
|
||||
<Link to={`/zone/${deptId}/newdetail/${i.id}`} className="color-blue flexCenter zone_btn">查看详情<img src={guideArrow} alt="" width="14px"/></Link>
|
||||
<Link to={`/${temp}/${deptId}/newdetail/${i.id}`} className="color-blue flexCenter zone_btn">查看详情<img src={guideArrow} alt="" width="14px"/></Link>
|
||||
</p>
|
||||
</li>
|
||||
)
|
||||
|
|
|
|||
|
|
@ -0,0 +1,263 @@
|
|||
import React,{ useState, useEffect } from 'react';
|
||||
import { httpUrl } from '../fetch';
|
||||
|
||||
import img1 from '../img/img1.png';
|
||||
import img2 from '../img/img2.png';
|
||||
import vision0 from '../img/vision0.png';
|
||||
import vision1 from '../img/vision1.png';
|
||||
import vision2 from '../img/vision2.png';
|
||||
import vision3 from '../img/vision3.png';
|
||||
import intro1 from '../img/intro1.png';
|
||||
import intro2 from '../img/intro2.png';
|
||||
import intro3 from '../img/intro3.png';
|
||||
import intro4 from '../img/intro4.png';
|
||||
import guideArrow from '../img/guideArrow.png';
|
||||
import ra from '../img/ra.png'
|
||||
import { Link } from 'react-router-dom';
|
||||
import shijian from '../img/shijian.png';
|
||||
import axios from 'axios';
|
||||
import Nodata from '../../Nodata';
|
||||
import Projects from '../Component/projects';
|
||||
import Contributor from '../Component/contributor';
|
||||
import Partner from '../Component/partner';
|
||||
import '../indexZone1.scss'
|
||||
|
||||
function HeaderPage(props){
|
||||
const [ projectList , setProjectList ] = useState(undefined);
|
||||
const [ personList , setPersonList ] = useState(undefined);
|
||||
const [ newsList, setNewsList ] = useState(undefined);
|
||||
const { deptId } = props.match.params;
|
||||
const { data, id } = props;
|
||||
const temp = props.pathName
|
||||
|
||||
const vision = [
|
||||
{imageUrl: vision0, title: '促进技术创新和应用', content: '通过开源硬件社区的建设，可以让更多的人参与到硬件开发中来，激发大众的创造力和创新精神，从而推动硬件领域的技术创新和实际应用。'},
|
||||
{imageUrl: vision1, title: '降低硬件开发成本', content: '通过共享开源硬件设计和资源，可以帮助个人和小型企业降低硬件开发的成本，打破品牌垄断，促进市场竞争。'},
|
||||
{imageUrl: vision2, title: '推广教育和普及知识', content: '通过开源硬件社区的建设，可以提供更多的硬件开发教育和知识普及资源，为学生、教师和爱好者等不同群体提供更多的学习机会和平台。'},
|
||||
{imageUrl: vision3, title: '加强国际合作和交流', content: '开源硬件社区可以促进国内外的交流和合作，扩大中国在全球开源硬件领域的影响力，推动中外企业和机构之间的技术合作和交流。'}
|
||||
]
|
||||
|
||||
const communityInfo = [
|
||||
{ level: '普通用户', todo: '寻找项目或SIG组' },
|
||||
{ level: '项目贡献者', todo: '参与项目贡献' },
|
||||
{ level: '项目开发者', todo: '推动项目发展' },
|
||||
{ level: '项目管理者', todo: '成为项目领军人物' }
|
||||
]
|
||||
|
||||
const growPathInfo = [
|
||||
{ type: '计划一', plan: '保留chisel语言学习（学习）' },
|
||||
{ type: '计划二', plan: '小核、SoC快速开发（初级、中级、高级）' },
|
||||
{ type: '计划三', plan: '果壳项目（初级、中级、高级）' },
|
||||
{ type: '计划四', plan: '香山贡献参与' }
|
||||
]
|
||||
|
||||
const introDetail = [
|
||||
{ title: '能力阶梯', icon: intro1, desc: '成长体系按照开发者从⼊门到进阶再到⾹⼭顶级项⽬设⽴了⽤户能⼒提升的阶梯式真实项⽬' },
|
||||
{ title: '贡献分级', icon: intro2, desc: '所有开源项⽬全部为开芯院开源开放的真实项⽬，开发者参与开源项⽬的所有贡献将作为成长等级、知产授权、加⼊⾼级别项⽬（悬赏、获得offer等）、成为核⼼贡献者的参与 依据' },
|
||||
{ title: '成长认证', icon: intro3, desc: '开发者可以通过完成开源项⽬对应的任务，赢取对应能⼒成长认证，开源项⽬对应的⾼级任务将获得对应等级L2或⾼级别的知识产权授权，同时解锁下⼀级别成长任务' },
|
||||
{ title: '顶级认证', icon: intro4, desc: '参与顶级项⽬“⾹⼭”的贡献者，将获得中国科学院计算技术研究所副所长、研究员，北京开源芯⽚研究院⾸席科学家，RISC-V国际基⾦会理事会成员包云岗签名贡献者证书' }
|
||||
]
|
||||
|
||||
|
||||
useEffect(()=>{
|
||||
if(id){
|
||||
getProjectList();
|
||||
getNewsList();
|
||||
getPersonList();
|
||||
}
|
||||
},[id])
|
||||
|
||||
function getPersonList(){
|
||||
const url = `${httpUrl}/zone/open/${id}/member/homePageList`;
|
||||
axios.get(url).then(result=>{
|
||||
if(result){
|
||||
setPersonList(result.data.rows);
|
||||
}
|
||||
}).catch(error=>{})
|
||||
}
|
||||
|
||||
function getNewsList(){
|
||||
const url = `${httpUrl}/cms/doc/open/zone/${id}/homePageDocList`;
|
||||
axios.get(url).then(result=>{
|
||||
if(result){
|
||||
setNewsList(result.data.rows);
|
||||
}
|
||||
}).catch(error=>{})
|
||||
}
|
||||
|
||||
function getProjectList(){
|
||||
const url = `${httpUrl}/zone/open/${id}/project/list`;
|
||||
axios.get(url,{params:{
|
||||
isHomepage:1
|
||||
}}).then(result=>{
|
||||
if(result){
|
||||
setProjectList(result.data.rows);
|
||||
}
|
||||
}).catch(console.error())
|
||||
}
|
||||
return(
|
||||
<div className="zone1_box">
|
||||
{
|
||||
data && (data.introductionTitle || data.introductionContent || data.introductionImage) &&
|
||||
<div className="boxmain zone_infos mb30">
|
||||
<div className="zone_infos_desc">
|
||||
<p className="z_name">{data.introductionTitle}</p>
|
||||
<p className="z_desc task-hide-2">{data.introductionContent}</p>
|
||||
</div>
|
||||
{
|
||||
data.introductionImage &&
|
||||
<img src={data.introductionImage} alt="" width="600px" height="361px"/>
|
||||
}
|
||||
</div>
|
||||
}
|
||||
<div className="zone_vision pt40 pb60">
|
||||
<p className="in_title mb40">宗旨及愿景</p>
|
||||
<div className='boxmain'>
|
||||
{
|
||||
vision.map((i, k) => {
|
||||
return (
|
||||
<div className="vision_item">
|
||||
<div className="vision_icon">
|
||||
<img src={i.imageUrl} alt="" />
|
||||
</div>
|
||||
<p className="vision_title">{ i.title }</p>
|
||||
<p className="vision_content">{ i.content }</p>
|
||||
</div>
|
||||
)
|
||||
})
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
{
|
||||
newsList && newsList.length>0 &&
|
||||
<div className="zone_news">
|
||||
<div className="boxmain" style={{display:"flex"}}>
|
||||
<p className="news_title">新闻动态</p>
|
||||
<div className="zone_new_first">
|
||||
<p className="task-hide">
|
||||
<span className="item_index">1</span>
|
||||
<Link to={`/${temp}/${deptId}/newdetail/${newsList[0].id}`} className="new_first_title task-hide">{newsList[0].name}</Link>
|
||||
</p>
|
||||
<p className="new_first_desc mt20 task-hide-2">{newsList[0].summary}</p>
|
||||
<p className="font-13 zone_n_value mt20" style={{color:"#8d95a3"}}>
|
||||
<span>
|
||||
<img src={shijian} alt="" className="mr3" />
|
||||
{newsList[0].publishTime}
|
||||
</span>
|
||||
<Link to={`/${temp}/${deptId}/newdetail/${newsList[0].id}`} className="zone_btn">查看更多<img src={guideArrow} alt="" width="14px" className="ml3"/></Link>
|
||||
</p>
|
||||
</div>
|
||||
<ul className="zone_new_three">
|
||||
{
|
||||
newsList.map((i,k)=>{
|
||||
return(
|
||||
k > 0 &&
|
||||
<Link to={`/${temp}/${deptId}/newdetail/${i.id}`}>
|
||||
<li className="new_item">
|
||||
<p className="task-hide">
|
||||
<span className="item_index">{k + 1}</span>
|
||||
<Link className="zone_n_title" to={`/${temp}/${deptId}/newdetail/${i.id}`}>{i.name}</Link>
|
||||
</p>
|
||||
<p className="zone_n_desc task-hide-2">{i.summary}</p>
|
||||
<p className="zone_n_value">
|
||||
<span className="font-13" style={{color:"#8d95a3"}}>
|
||||
<img src={shijian} alt="" className="mr3" />
|
||||
{i.publishTime}
|
||||
</span>
|
||||
<span className="flexCenter zone_btn">查看详情<img src={guideArrow} alt="" width="14px"/></span>
|
||||
</p>
|
||||
</li>
|
||||
</Link>
|
||||
)
|
||||
})
|
||||
}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
<div className="zone_projects pt50 pb30">
|
||||
<p className="in_title mb40">精选项目</p>
|
||||
<Projects projectList={projectList}></Projects>
|
||||
</div>
|
||||
|
||||
<div className="zone_contributor">
|
||||
<p className="in_title">核心贡献者</p>
|
||||
<Contributor personList={personList}></Contributor>
|
||||
</div>
|
||||
|
||||
<div className="zone_community pt60 pb60">
|
||||
<p className="in_title mb20">参与社区</p>
|
||||
<p className="sub_title mb50"><img src={ra} alt="" className="mr5" />成为社区成员，尽情发挥您的创意</p>
|
||||
<div className="c_role boxmain">
|
||||
{
|
||||
communityInfo.map(i => {
|
||||
return (
|
||||
<div className="c_role_item">
|
||||
<p className="role_level">{ i.level }</p>
|
||||
<p className="role_todo">{ i.todo }</p>
|
||||
<div className="dot"></div>
|
||||
</div>
|
||||
)
|
||||
})
|
||||
}
|
||||
</div>
|
||||
<div className="dot_line"></div>
|
||||
</div>
|
||||
|
||||
<div className="zone_grow pt60 pb60">
|
||||
<p className="in_title mb20">开源芯⽚⽤户成长体系介绍</p>
|
||||
<p className="sub_title">参与开源芯⽚项⽬的开发者需要签署开源贡献者协议</p>
|
||||
<p className="sub_title mb50">建议开发者按照开源项⽬成长路径进⾏参与，稳步提升能⼒，降低跳级参与带来的挑战</p>
|
||||
<div className="grow_path boxmain">
|
||||
{
|
||||
growPathInfo.map((i, k) => {
|
||||
return (
|
||||
<div className="grow_path_item">
|
||||
{ k % 2 === 1 && <div className="dot"></div> }
|
||||
<div className="grow_path_type">
|
||||
<div></div>
|
||||
<div></div>
|
||||
<div></div>
|
||||
{ i.type }
|
||||
</div>
|
||||
<p className="grow_path_plan">{ i.plan }</p>
|
||||
{ k % 2 === 0 && <div className="dot"></div> }
|
||||
|
||||
</div>
|
||||
)
|
||||
})
|
||||
}
|
||||
</div>
|
||||
<div className="line"></div>
|
||||
<div className="grow_introduction boxmain pt40">
|
||||
{
|
||||
introDetail.map(i => {
|
||||
return (
|
||||
<div className="intro_item">
|
||||
<p className="intro_title">
|
||||
<img src={i.icon} alt="" className="mr3" />
|
||||
{ i.title }
|
||||
</p>
|
||||
<p className="intro_desc">{ i.desc }</p>
|
||||
</div>
|
||||
)
|
||||
})
|
||||
}
|
||||
</div>
|
||||
<div className="dot_line"></div>
|
||||
</div>
|
||||
|
||||
<div className="zone_communicate">
|
||||
<p className="in_title">集萃群智经验 交流心得体会</p>
|
||||
<button>立即加入</button>
|
||||
</div>
|
||||
|
||||
<div className="zone_parter">
|
||||
<p className="in_title">合作伙伴</p>
|
||||
<Partner id={ id }></Partner>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
export default HeaderPage;
|
||||
|
|
@ -10,7 +10,8 @@ import shijian from '../img/shijian.png';
|
|||
import liulan from '../img/liulan.png';
|
||||
import emptydata from '../../Images/nodata.png';
|
||||
import DefaultImg from '../Component/defaultImg';
|
||||
import { getNewsAllList , getNewsHotList } from '../api';
|
||||
import { httpUrl } from '../fetch';
|
||||
import { tempConfig } from '../tempInfo';
|
||||
|
||||
function Main(props){
|
||||
const [ key , setKey ] = useState("1");
|
||||
|
|
@ -19,8 +20,10 @@ function Main(props){
|
|||
const [ menuH , setMenuH ] = useState(true);
|
||||
const [ hotList , setHotList ] = useState(undefined);
|
||||
const [ isSpin , setIsSpin ] = useState(true);
|
||||
const [ newCateId , setNewCateId ] = useState(undefined);
|
||||
const { deptId , cateId } = props.match.params;
|
||||
const { id } = props;
|
||||
const temp = props.pathName
|
||||
|
||||
|
||||
useEffect(()=>{
|
||||
|
|
@ -32,10 +35,14 @@ function Main(props){
|
|||
},[id])
|
||||
|
||||
function getMainList(){
|
||||
getNewsAllList(id).then(result=>{
|
||||
const url = `${httpUrl}/cms/doc/open/zone/${id}/docOverviewList`;
|
||||
axios.get(url).then(result=>{
|
||||
if(result){
|
||||
let rows = result.data.rows;
|
||||
setMainList(rows);
|
||||
if (temp !== 'zone') {
|
||||
selectCate(rows[0].id)
|
||||
}
|
||||
setTimeout(() => {
|
||||
let ele = document.getElementById("menus");
|
||||
if(ele){
|
||||
|
|
@ -49,8 +56,9 @@ function Main(props){
|
|||
}
|
||||
|
||||
function getHotList(){
|
||||
getNewsHotList(id,{
|
||||
pageSize:15,pageNum:1
|
||||
const url = `${httpUrl}/cms/doc/open/zone/${id}/hotDocList`;
|
||||
axios.get(url,{
|
||||
params:{pageSize:15,pageNum:1}
|
||||
}).then(result=>{
|
||||
if(result){
|
||||
setHotList(result.data.rows);
|
||||
|
|
@ -58,23 +66,41 @@ function Main(props){
|
|||
}).catch(error=>{})
|
||||
}
|
||||
|
||||
function selectCate(id) {
|
||||
setNewCateId(id)
|
||||
props.history.push(`/${temp}/${deptId}/news/${id}`)
|
||||
}
|
||||
|
||||
return(
|
||||
<div>
|
||||
<div className="main_content">
|
||||
<div className="boxmain">
|
||||
<p className="in_title">领域资讯</p>
|
||||
<p className="in_title">{ tempConfig[temp].mainTitle }</p>
|
||||
{
|
||||
mainList && mainList.length>0 &&
|
||||
<Menu mode={"horizontal"} id="menus" selectedKeys={[cateId||"0"]} style={{justifyContent:menuH?"flex-start":"center"}}>
|
||||
<Menu.Item key={"0"}><Link to={`/zone/${deptId}/news`}>全部</Link></Menu.Item>
|
||||
{
|
||||
mainList.map((i,k)=>{
|
||||
return(
|
||||
<Menu.Item key={`${i.id}`}><Link to={`/zone/${deptId}/news/${i.id}`}>{i.name}</Link></Menu.Item>
|
||||
)
|
||||
})
|
||||
}
|
||||
</Menu>
|
||||
(
|
||||
temp === 'zone' ?
|
||||
<Menu mode={"horizontal"} id="menus" selectedKeys={[cateId||"0"]} style={{justifyContent:menuH?"flex-start":"center"}}>
|
||||
<Menu.Item key={"0"}><Link to={`/${temp}/${deptId}/news`}>全部</Link></Menu.Item>
|
||||
{
|
||||
mainList.map((i,k)=>{
|
||||
return(
|
||||
<Menu.Item key={`${i.id}`}><Link to={`/${temp}/${deptId}/news/${i.id}`}>{i.name}</Link></Menu.Item>
|
||||
)
|
||||
})
|
||||
}
|
||||
</Menu>
|
||||
:
|
||||
<div className="main_tag">
|
||||
{
|
||||
mainList.map((i,k)=>{
|
||||
return(
|
||||
<div className={`main_tag_item task-hide ${newCateId === i.id ? 'main_tag_selected' : ''}`} key={`${i.id}`} onClick={() => selectCate(i.id)} >{i.name}</div>
|
||||
)
|
||||
})
|
||||
}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
{
|
||||
!mainList && <div style={{height:105}}><Skeleton /></div>
|
||||
|
|
@ -143,7 +169,7 @@ function Main(props){
|
|||
{
|
||||
hotList && hotList.length>0 &&
|
||||
<div className="short_width radius4">
|
||||
<Hot title={"热门资讯"} list={hotList} deptId={deptId}/>
|
||||
<Hot temp={ temp } title={ tempConfig[temp].hotTitle } list={hotList} deptId={deptId}/>
|
||||
</div>
|
||||
}
|
||||
</Box>
|
||||
|
|
|
|||
|
|
@ -4,13 +4,15 @@ import liulan from '../img/liulan.png';
|
|||
import RenderHtml from '../../../components/render-html';
|
||||
import { Base64 } from 'js-base64';
|
||||
import axios from 'axios';
|
||||
import { getNewsDetail } from '../api';
|
||||
import { httpUrl } from '../fetch';
|
||||
import { tempConfig } from '../tempInfo';
|
||||
|
||||
function NewsDetail(props){
|
||||
const { deptId , id } = props.match.params;
|
||||
const [ detail , setDetail ] = useState(undefined);
|
||||
const [ cmsDir , setCmsDir ] = useState(undefined);
|
||||
const [ content , setContent]=useState(undefined);
|
||||
const temp = props.pathName
|
||||
|
||||
useEffect(()=>{
|
||||
if(id){
|
||||
|
|
@ -20,7 +22,8 @@ function NewsDetail(props){
|
|||
},[id])
|
||||
|
||||
function getDetails(){
|
||||
getNewsDetail(id).then(result=>{
|
||||
const url = `${httpUrl}/cms/doc/open/${id}`;
|
||||
axios.get(url).then(result=>{
|
||||
if(result){
|
||||
let data = result.data.data;
|
||||
setDetail(data);
|
||||
|
|
@ -35,8 +38,8 @@ function NewsDetail(props){
|
|||
detail &&
|
||||
<div style={{width:'1200px',margin:"0px auto",padding:"30px 0px"}}>
|
||||
<Breadcrumb separator=">">
|
||||
<Breadcrumb.Item href={`/zone/${deptId}/news`}>领域资讯</Breadcrumb.Item>
|
||||
{ cmsDir && <Breadcrumb.Item href={`/zone/${deptId}/news/${cmsDir.id}`}>{cmsDir.name}</Breadcrumb.Item> }
|
||||
<Breadcrumb.Item href={`/${temp}/${deptId}/news`}>{tempConfig[temp].mainTitle}</Breadcrumb.Item>
|
||||
{ cmsDir && <Breadcrumb.Item href={`/${temp}/${deptId}/news/${cmsDir.id}`}>{cmsDir.name}</Breadcrumb.Item> }
|
||||
<Breadcrumb.Item>正文</Breadcrumb.Item>
|
||||
</Breadcrumb>
|
||||
<div className="info_text">
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@ import { Input , Menu , Pagination , Spin } from 'antd';
|
|||
import { Link } from 'react-router-dom';
|
||||
import Nodata from '../../Nodata';
|
||||
import axios from 'axios';
|
||||
import { getProjectsLists , getProjectsTypeLists } from '../api';
|
||||
import { httpUrl } from '../fetch';
|
||||
const { Search } = Input;
|
||||
|
||||
function ProjectSource(props){
|
||||
|
|
@ -20,6 +20,7 @@ function ProjectSource(props){
|
|||
const [ value , setValue ] = useState(undefined);
|
||||
const [ loading , setLoading ] = useState(false);
|
||||
const { id } = props;
|
||||
const temp = props.pathName
|
||||
|
||||
useEffect(()=>{
|
||||
if(id){
|
||||
|
|
@ -35,11 +36,14 @@ function ProjectSource(props){
|
|||
},[id,typeId,page,searchName])
|
||||
|
||||
function getLists(){
|
||||
getProjectsLists(id,{
|
||||
pageNum:page,
|
||||
name:searchName,
|
||||
pageSize,
|
||||
projectTypeId:typeId===0?undefined:typeId
|
||||
const url = `${httpUrl}/zone/open/${id}/project/list`;
|
||||
axios.get(url,{
|
||||
params:{
|
||||
pageNum:page,
|
||||
name:searchName,
|
||||
pageSize,
|
||||
projectTypeId:typeId===0?undefined:typeId
|
||||
}
|
||||
}).then(result=>{
|
||||
if(result){
|
||||
setLists(result.data.rows);
|
||||
|
|
@ -49,14 +53,15 @@ function ProjectSource(props){
|
|||
}).catch(error=>{})
|
||||
}
|
||||
|
||||
|
||||
function getTypeList(){
|
||||
getProjectsTypeLists(id).then(result=>{
|
||||
const url = `${httpUrl}/zone/open/${id}/projectType/list`;
|
||||
axios.get(url).then(result=>{
|
||||
if(result){
|
||||
setTypeList(result.data.rows);
|
||||
}
|
||||
}).catch(error=>{})
|
||||
}
|
||||
|
||||
const menu = (
|
||||
<Menu>
|
||||
<Menu.Item>更新时间排序</Menu.Item>
|
||||
|
|
@ -146,7 +151,8 @@ function ProjectSource(props){
|
|||
</ul>
|
||||
}
|
||||
<ul className="in_b_infos">
|
||||
{ i.deptName && <li className="infos_cate">{i.deptName}</li> }
|
||||
{/* { i.deptName && <li className="infos_cate">{i.deptName}</li> } */}
|
||||
{ i.projectProperties && i.projectProperties.language && <li className="infos_cate">{i.projectProperties.language}</li> }
|
||||
{ i.projectType && <li className="infos_language">{i.projectType}</li> }
|
||||
{ i.projectProperties && i.projectProperties.timeAgo && <li><i className="iconfont icon-a-31shijian font-13 mr3"></i> 更新于{i.projectProperties.timeAgo}</li>}
|
||||
</ul>
|
||||
|
|
|
|||
|
|
@ -3,7 +3,9 @@ import Crown from '../img/crown.png';
|
|||
import Nodata from '../../Nodata';
|
||||
import { Link } from 'react-router-dom';
|
||||
import { Spin } from 'antd';
|
||||
import { getVIPLists } from '../api';
|
||||
import { httpUrl } from '../fetch';
|
||||
import axios from 'axios';
|
||||
import '../indexZone1.scss'
|
||||
|
||||
|
||||
function ZoneVIP(props){
|
||||
|
|
@ -11,6 +13,7 @@ function ZoneVIP(props){
|
|||
const [ vipLists , setVIPLists ] = useState(undefined);
|
||||
const [ isSpin , setIsSpin ] = useState(true);
|
||||
const { id } = props;
|
||||
const temp = props.pathName
|
||||
|
||||
useEffect(()=>{
|
||||
if(id){
|
||||
|
|
@ -20,7 +23,8 @@ function ZoneVIP(props){
|
|||
},[id])
|
||||
|
||||
function getLists(){
|
||||
getVIPLists(id).then(response=>{
|
||||
const url = `${httpUrl}/zone/open/${id}/member/overviewList`;
|
||||
axios.get(url).then(response=>{
|
||||
if(response){
|
||||
setVIPLists(response.data.rows);
|
||||
setIsSpin(false);
|
||||
|
|
@ -29,7 +33,7 @@ function ZoneVIP(props){
|
|||
}
|
||||
|
||||
return(
|
||||
<div className="boxmain zone_VIP_box">
|
||||
<div className={`boxmain ${temp}_VIP_box`}>
|
||||
<p className="in_title">专区会员</p>
|
||||
<p className="vip_sub_title">社区根据您的贡献与扮演角色将用户划分成为不同的人员团队，并构建会员成长体系。您有兴趣成为会员，尽情发挥创意与智慧，与专区共同成长吗？</p>
|
||||
<Spin spinning={isSpin}>
|
||||
|
|
@ -43,7 +47,12 @@ function ZoneVIP(props){
|
|||
<div className="vip_list_card">
|
||||
<div className="card_title">
|
||||
<img src={Crown} alt="" width="37px" style={{marginBottom:5,marginRight:5}}/>
|
||||
<span>{i.typeName}</span>
|
||||
<div>
|
||||
<div>
|
||||
{i.typeName}
|
||||
</div>
|
||||
{ temp === 'zone1' && <div className="linear_gradient">{i.typeName}</div> }
|
||||
</div>
|
||||
</div>
|
||||
<p className="card_desc">{i.typeIntroduction}</p>
|
||||
{
|
||||
|
|
@ -52,11 +61,14 @@ function ZoneVIP(props){
|
|||
{
|
||||
i.zoneMemberList.map((j,key)=>{
|
||||
return(
|
||||
|
||||
<li className="card_u_li">
|
||||
<Link to={`/${j.login}`} ><img src={j.imageUrl} alt="" /></Link>
|
||||
<div className="card_u_info">
|
||||
<div className="card_u_up"><span className="card_name task-hide">{j.name}</span>{j.memberLevel && <span className="card_tag">{j.memberLevel}</span> }</div>
|
||||
<p className="card_u_down task-hide-2">{j.introduction}</p>
|
||||
<div className="card_u_wrap">
|
||||
<Link to={`/${j.login}`} ><img src={j.imageUrl} alt="" /></Link>
|
||||
<div className="card_u_info">
|
||||
<div className="card_u_up"><span className="card_name task-hide">{j.name}</span>{j.memberLevel && <span className="card_tag">{j.memberLevel}</span> }</div>
|
||||
<p className="card_u_down task-hide-2">{j.introduction}</p>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
)
|
||||
|
|
|
|||
|
|
@ -1,44 +1,10 @@
|
|||
import axios from 'axios';
|
||||
import { message , notification } from 'antd';
|
||||
import javaFetch from '../javaFetch';
|
||||
|
||||
function beforeFetch(actionUrl){
|
||||
if (window.location.href.indexOf('localhost') < 0) {
|
||||
axios.defaults.withCredentials = true;
|
||||
}
|
||||
|
||||
const service = axios.create({
|
||||
baseURL: actionUrl,
|
||||
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;
|
||||
}
|
||||
},
|
||||
error => {
|
||||
console.log(error);
|
||||
// notification.open({
|
||||
// message: "提示",
|
||||
// description: error.message,
|
||||
// });
|
||||
// return Promise.reject(error);
|
||||
}
|
||||
)
|
||||
return service;
|
||||
}
|
||||
let settings = localStorage.chromesetting&&JSON.parse(localStorage.chromesetting);
|
||||
let actionUrl = settings && settings.common.zone +'/api';
|
||||
let actionUrl = settings && settings.common.zone +"/api";
|
||||
|
||||
const service = beforeFetch(actionUrl);
|
||||
|
||||
const service = javaFetch(actionUrl);
|
||||
export const httpUrl = actionUrl;
|
||||
// export const main_site_url = settings && settings.common.main_site_url
|
||||
export default service;
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 249 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 9.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 6.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 152 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 246 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 7.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 7.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 7.8 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 511 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 6.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 6.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 621 B |
Binary file not shown.
|
After Width: | Height: | Size: 21 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 19 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 21 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 21 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 20 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 26 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 20 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 7.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 9.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 6.8 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 6.0 KiB |
|
Before Width: | Height: | Size: 1.7 KiB After Width: | Height: | Size: 1.7 KiB |
|
Before Width: | Height: | Size: 1.8 KiB After Width: | Height: | Size: 1.8 KiB |
|
Before Width: | Height: | Size: 1.6 KiB After Width: | Height: | Size: 1.6 KiB |
|
Before Width: | Height: | Size: 5.4 KiB After Width: | Height: | Size: 5.4 KiB |
|
|
@ -1,15 +1,19 @@
|
|||
import React ,{ useEffect , useState } from "react";
|
||||
|
||||
import { Route, Switch } from "react-router-dom";
|
||||
import { Route, Switch, useLocation } from "react-router-dom";
|
||||
import { withRouter } from "react-router";
|
||||
import { httpUrl } from './fetch';
|
||||
|
||||
import { SnackbarHOC } from "educoder";
|
||||
import { CNotificationHOC } from "../../modules/courses/common/CNotificationHOC";
|
||||
import { TPMIndexHOC } from "../../modules/tpm/TPMIndexHOC";
|
||||
import Loadable from "react-loadable";
|
||||
import Loading from "../../Loading";
|
||||
import axios from 'axios';
|
||||
import PublicBanner from "./Component/publicBanner";
|
||||
import { getMainInfos , getCheckZoneRole } from './api';
|
||||
import './index.scss';
|
||||
import "slick-carousel/slick/slick.css";
|
||||
import "slick-carousel/slick/slick-theme.css";
|
||||
|
||||
const VIP = Loadable({
|
||||
loader: () => import("./Pages/zoneVIP"),
|
||||
|
|
@ -19,6 +23,12 @@ const HeaderPage = Loadable({
|
|||
loader: () => import("./Pages/headerPage"),
|
||||
loading: Loading,
|
||||
});
|
||||
|
||||
const HeaderPageZone1 = Loadable({
|
||||
loader: () => import("./Pages/headerPageZone1"),
|
||||
loading: Loading,
|
||||
});
|
||||
|
||||
const ProjectSource = Loadable({
|
||||
loader: () => import("./Pages/projectSource"),
|
||||
loading: Loading,
|
||||
|
|
@ -27,15 +37,22 @@ const NewsDetail = Loadable({
|
|||
loader: () => import("./Pages/newsDetail"),
|
||||
loading: Loading,
|
||||
});
|
||||
const NewsList = Loadable({
|
||||
loader: () => import("./Pages/newsList"),
|
||||
loading: Loading,
|
||||
});
|
||||
|
||||
const Main = Loadable({
|
||||
loader: () => import("./Pages/main"),
|
||||
loading: Loading,
|
||||
});
|
||||
|
||||
function Index(props){
|
||||
const [ data , setData ] = useState(undefined);
|
||||
const [ adminUrl , setAdminUrl ] = useState(undefined);
|
||||
const { deptId } = props.match.params;
|
||||
const [ id , setId ] = useState(undefined);
|
||||
const temp = props.pathName
|
||||
|
||||
useEffect(()=>{
|
||||
if(deptId){
|
||||
|
|
@ -43,8 +60,14 @@ function Index(props){
|
|||
}
|
||||
},[deptId])
|
||||
|
||||
function setTheme() {
|
||||
document.getElementsByTagName("html")[0].dataset.theme = temp;
|
||||
}
|
||||
setTheme()
|
||||
|
||||
function getDetail(){
|
||||
getMainInfos(deptId).then(result=>{
|
||||
const url = `${httpUrl}/zone/open/zoneName/${deptId}`;
|
||||
axios.get(url).then(result=>{
|
||||
if(result){
|
||||
let data = result.data.data;
|
||||
setData(data);
|
||||
|
|
@ -58,8 +81,12 @@ function Index(props){
|
|||
}
|
||||
|
||||
function getAdminUrl(id){
|
||||
getCheckZoneRole(id).then(response=>{
|
||||
if(response && response.data && response.data.data){
|
||||
const url = `${httpUrl}/zone/zoneDetail/${deptId}/checkZoneRole`;
|
||||
if (window.location.href.indexOf('localhost') < 0) {
|
||||
axios.defaults.withCredentials = true;
|
||||
}
|
||||
axios.get(url).then(response=>{
|
||||
if(response && response.data.code === 200){
|
||||
setAdminUrl(response.data.data);
|
||||
}else{
|
||||
setAdminUrl(undefined);
|
||||
|
|
@ -71,39 +98,39 @@ function Index(props){
|
|||
<PublicBanner {...props} data={data} adminUrl={adminUrl}/>
|
||||
<Switch>
|
||||
<Route
|
||||
path="/zone/:deptId/news/:cateId"
|
||||
path="/:temp/:deptId/news/:cateId"
|
||||
render={(p) => (
|
||||
<Main {...props} {...p} id={id}/>
|
||||
)}
|
||||
></Route>
|
||||
<Route
|
||||
path="/zone/:deptId/newdetail/:id"
|
||||
path="/:temp/:deptId/newdetail/:id"
|
||||
render={(p) => (
|
||||
<NewsDetail {...props} {...p} id={id}/>
|
||||
)}
|
||||
></Route>
|
||||
<Route
|
||||
path="/zone/:deptId/VIP"
|
||||
path="/:temp/:deptId/VIP"
|
||||
render={(p) => (
|
||||
<VIP {...props} {...p} id={id}/>
|
||||
)}
|
||||
></Route>
|
||||
<Route
|
||||
path="/zone/:deptId/projects"
|
||||
path="/:temp/:deptId/projects"
|
||||
render={(p) => (
|
||||
<ProjectSource {...props} {...p} id={id}/>
|
||||
)}
|
||||
></Route>
|
||||
<Route
|
||||
path="/zone/:deptId/news"
|
||||
path="/:temp/:deptId/news"
|
||||
render={(p) => (
|
||||
<Main {...props} {...p} id={id}/>
|
||||
)}
|
||||
></Route>
|
||||
<Route
|
||||
path="/zone/:deptId"
|
||||
path="/:temp/:deptId"
|
||||
render={(p) => (
|
||||
<HeaderPage {...props} {...p} data={data} id={id}/>
|
||||
temp === 'zone' ? <HeaderPage {...props} {...p} data={data} id={id}/> : <HeaderPageZone1 {...props} {...p} data={data} id={id}/>
|
||||
)}
|
||||
></Route>
|
||||
</Switch>
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
@import './theme.scss';
|
||||
|
||||
.information_main{
|
||||
background-color:#f3f5f8;
|
||||
min-height: 100vh;
|
||||
|
|
@ -5,7 +7,7 @@
|
|||
font-size: 15px;
|
||||
margin-bottom: 20px;
|
||||
.ant-breadcrumb-link{
|
||||
color: #466aff;
|
||||
color: var(--primary-color);
|
||||
}
|
||||
& > span:last-child .ant-breadcrumb-link{
|
||||
color: rgba(76, 88, 118, 1);
|
||||
|
|
@ -79,7 +81,7 @@
|
|||
left: 0px;
|
||||
height: 4px;
|
||||
bottom: 1px;
|
||||
background-color: #466aff;
|
||||
background-color: var(--primary-color);
|
||||
}
|
||||
&.ant-menu-item-active::after{
|
||||
background-color:rgba(255, 255, 255, 0.36);
|
||||
|
|
@ -147,7 +149,7 @@
|
|||
text-overflow: ellipsis;
|
||||
}
|
||||
&:hover{
|
||||
color: #466aff;
|
||||
color: var(--primary-color);
|
||||
}
|
||||
span{
|
||||
display: block;
|
||||
|
|
@ -156,7 +158,7 @@
|
|||
color: #fff;
|
||||
height:22px;
|
||||
line-height:22px;
|
||||
background-color:#466aff;
|
||||
background-color: var(--primary-color);
|
||||
opacity: 0.3;
|
||||
border-radius:2px;
|
||||
margin-right: 7px;
|
||||
|
|
@ -354,6 +356,53 @@
|
|||
.boxmain{
|
||||
width: 1200px;
|
||||
margin:0px auto;
|
||||
.main_tag {
|
||||
height: 50px;
|
||||
width: fit-content;
|
||||
border-radius: 4px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-top: 42px;
|
||||
margin-bottom: 48px;
|
||||
box-shadow:0px 0px 15px rgba(30, 47, 162, 0.09);
|
||||
overflow: hidden;
|
||||
.main_tag_item {
|
||||
background-color: #f6f7fa;
|
||||
text-align: center;
|
||||
line-height: 50px;
|
||||
border-top: solid white 2px;
|
||||
border-bottom: solid white 2px;
|
||||
width: 164px;
|
||||
position: relative;
|
||||
padding: 0 5px;
|
||||
cursor: pointer;
|
||||
a {
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
.main_tag_item:last-child {
|
||||
border-right: solid white 2px;
|
||||
}
|
||||
.main_tag_item:first-child {
|
||||
border-left: solid white 2px;
|
||||
}
|
||||
.main_tag_item:not(:last-child)::after {
|
||||
content: "";
|
||||
height: 100%;
|
||||
width: 1px;
|
||||
background-color: #8d95ac;
|
||||
opacity: 0.17;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
}
|
||||
.main_tag_selected {
|
||||
background-color: #089f7f;
|
||||
color: white;
|
||||
border: none !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
.flexCenter{
|
||||
display: flex;
|
||||
|
|
@ -420,6 +469,14 @@
|
|||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 5px;
|
||||
.ant-btn-primary{
|
||||
color: #fff;
|
||||
background-color: var(--primary-color);
|
||||
border:none;
|
||||
&:hover{
|
||||
background-color: var(--light-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
.in_list_box{
|
||||
min-height: 40vh;
|
||||
|
|
@ -481,10 +538,10 @@
|
|||
li{
|
||||
height:24px;
|
||||
line-height:24px;
|
||||
background-color:rgba(70, 106, 255, 0.12);
|
||||
background-color:var(--tag-back);
|
||||
border-radius:2px;
|
||||
margin-right: 12px;
|
||||
color:#466aff;
|
||||
color: var(--primary-color);
|
||||
font-size:13px;
|
||||
padding:0px 7px;
|
||||
}
|
||||
|
|
@ -506,7 +563,7 @@
|
|||
content: "";
|
||||
width:6px;
|
||||
height:6px;
|
||||
background-color:#466aff;
|
||||
background-color:var(--primary-color);
|
||||
border-radius: 50%;
|
||||
}
|
||||
&::after{
|
||||
|
|
@ -551,8 +608,8 @@
|
|||
align-items: center;
|
||||
}
|
||||
&.active{
|
||||
color:#466aff;
|
||||
background-image:linear-gradient(89.9deg,rgba(70, 106, 255, 0) 0%,rgba(70, 106, 255, 0.09) 100%);
|
||||
color: var(--primary-color);
|
||||
background-image: var(--linear-back-color);
|
||||
}
|
||||
&.active::after{
|
||||
position: absolute;
|
||||
|
|
@ -560,7 +617,7 @@
|
|||
height: 100%;
|
||||
content: "";
|
||||
width: 3px;
|
||||
background-color: #466aff;
|
||||
background-color: var(--primary-color);;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -577,6 +634,7 @@
|
|||
padding:27px 24px;
|
||||
&>img{
|
||||
border-radius: 4px;
|
||||
object-fit: cover;
|
||||
}
|
||||
.zone_infos_desc{
|
||||
padding:0px 34px 0px 10px;
|
||||
|
|
@ -702,15 +760,15 @@
|
|||
margin-right: 0px!important;
|
||||
}
|
||||
.imgBox{
|
||||
// background-color: #E3E7F3;
|
||||
border-radius: 50%;
|
||||
background-color: #E3E7F3;
|
||||
border-radius: 8px;
|
||||
width: 75px;
|
||||
height: 75px;
|
||||
margin-right: 14px;
|
||||
img{
|
||||
width: 75px;
|
||||
height: 75px;
|
||||
border-radius: 50%;
|
||||
border-radius: 8px;
|
||||
}
|
||||
}
|
||||
.infosBox{
|
||||
|
|
@ -882,51 +940,53 @@
|
|||
margin-top: 15px;
|
||||
padding-bottom: 10px;
|
||||
.card_u_li{
|
||||
display: flex;
|
||||
padding:25px 0px;
|
||||
border-bottom: 1px dashed rgba(141, 149, 172,0.27);
|
||||
align-items: center;
|
||||
object-fit: cover;
|
||||
&:last-child{
|
||||
&:last-child .card_u_wrap{
|
||||
border-bottom: none;
|
||||
}
|
||||
& > a >img{
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
border-radius: 50%;
|
||||
margin-right: 24px;
|
||||
}
|
||||
.card_u_info{
|
||||
.card_u_down{
|
||||
color:#4c5876;
|
||||
font-size:15px;
|
||||
line-height:26px;
|
||||
word-break: break-all;
|
||||
margin-top: 15px;
|
||||
.card_u_wrap {
|
||||
display: flex;
|
||||
padding:25px 0px;
|
||||
border-bottom: 1px dashed rgba(141, 149, 172,0.27);
|
||||
align-items: center;
|
||||
object-fit: cover;
|
||||
& > a >img{
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
border-radius: 50%;
|
||||
margin-right: 24px;
|
||||
}
|
||||
.card_u_up{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.card_name{
|
||||
font-weight:700;
|
||||
color:#1f2329;
|
||||
font-size:16px;
|
||||
display: block;
|
||||
max-width: 700px;
|
||||
height:26px;
|
||||
line-height: 26px;
|
||||
}
|
||||
.card_tag{
|
||||
display: inline-block;
|
||||
height:26px;
|
||||
background-color:rgba(70, 106, 255, 0.13);
|
||||
border-radius:2px;
|
||||
min-width: 76px;
|
||||
text-align: center;
|
||||
line-height: 26px;
|
||||
color:#466aff;
|
||||
.card_u_info{
|
||||
.card_u_down{
|
||||
color:#4c5876;
|
||||
font-size:15px;
|
||||
margin-left: 15px;
|
||||
line-height:26px;
|
||||
word-break: break-all;
|
||||
margin-top: 15px;
|
||||
}
|
||||
.card_u_up{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.card_name{
|
||||
font-weight:700;
|
||||
color:#1f2329;
|
||||
font-size:16px;
|
||||
display: block;
|
||||
max-width: 700px;
|
||||
height:26px;
|
||||
line-height: 26px;
|
||||
}
|
||||
.card_tag{
|
||||
display: inline-block;
|
||||
height:26px;
|
||||
background-color:rgba(70, 106, 255, 0.13);
|
||||
border-radius:2px;
|
||||
min-width: 76px;
|
||||
text-align: center;
|
||||
line-height: 26px;
|
||||
color:#466aff;
|
||||
font-size:15px;
|
||||
margin-left: 15px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -934,10 +994,4 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.informations_detail.markdown-body{
|
||||
&>p{
|
||||
line-height: 32px;
|
||||
margin-bottom: 8px!important;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,661 @@
|
|||
@import './theme.scss';
|
||||
|
||||
|
||||
.zone1_box{
|
||||
padding-top:70px;
|
||||
background-color:#f7f9fc;
|
||||
.zone_infos{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-top: 54px;
|
||||
padding:27px 24px;
|
||||
&>img{
|
||||
border-radius: 4px;
|
||||
object-fit: cover;
|
||||
}
|
||||
.zone_infos_desc{
|
||||
padding:0px 34px 0px 10px;
|
||||
flex: 1;
|
||||
.z_name{
|
||||
color:#1f2329;
|
||||
font-size:26px;
|
||||
height: 28px;
|
||||
line-height: 28px;
|
||||
margin-bottom: 28px!important;
|
||||
}
|
||||
.z_desc{
|
||||
color:#3d485d;
|
||||
font-size:14px;
|
||||
line-height:32px;
|
||||
word-break: break-all;
|
||||
-webkit-line-clamp: 4;
|
||||
}
|
||||
}
|
||||
}
|
||||
.zone_vision {
|
||||
background-color: #ffffff;
|
||||
.boxmain {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.vision_item {
|
||||
width: 244px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
.vision_icon {
|
||||
height: 162px;
|
||||
width: 162px;
|
||||
background-image: url(./img/visionBack.png);
|
||||
background-size: 100% 100%;
|
||||
position: relative;
|
||||
img {
|
||||
width: 30%;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
}
|
||||
.vision_icon:hover {
|
||||
background-image: url(./img/visionBackActive.png);
|
||||
}
|
||||
.vision_title {
|
||||
font-weight:700;
|
||||
color:#1f2329;
|
||||
font-size:17px;
|
||||
line-height:27px;
|
||||
text-align:center;
|
||||
margin-top: 39px;
|
||||
}
|
||||
.vision_content {
|
||||
margin-top: 21px;
|
||||
color:#4c5876;
|
||||
font-size:14px;
|
||||
line-height:27px;
|
||||
text-align:center;
|
||||
}
|
||||
}
|
||||
}
|
||||
.zone_news{
|
||||
height: 29vw;
|
||||
min-height: 475px;
|
||||
background-color: #273144;
|
||||
background-image: url(./img/newsBg.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
.boxmain {
|
||||
width: 1200px;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-evenly;
|
||||
}
|
||||
.news_title {
|
||||
height: 44px;
|
||||
font-weight: 500;
|
||||
color: #ffffff;
|
||||
font-size: 32px;
|
||||
transform: translate(40%, 0);
|
||||
}
|
||||
.new_first_title {
|
||||
height: 25px;
|
||||
color: #ffffff;
|
||||
font-size: 18px;
|
||||
}
|
||||
.new_first_desc {
|
||||
opacity: 80%;
|
||||
height: 20px;
|
||||
color: #ffffff;
|
||||
font-size: 14px;
|
||||
line-height: 27px;
|
||||
}
|
||||
.zone_n_title{
|
||||
color:#1f2329;
|
||||
font-size:17px;
|
||||
height: 24px;
|
||||
line-height: 24px;
|
||||
}
|
||||
.zone_n_desc{
|
||||
color:#4c5876;
|
||||
font-size:14px;
|
||||
line-height:27px;
|
||||
word-break: break-all;
|
||||
}
|
||||
.zone_n_value{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
}
|
||||
.zone_btn{
|
||||
padding-right: 20px;
|
||||
position: relative;
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
color: #07a583;
|
||||
transition: 0.1s;
|
||||
img{
|
||||
position: absolute;
|
||||
left: 62px;
|
||||
top:5px;
|
||||
transition: 0.1s;
|
||||
}
|
||||
}
|
||||
.item_index {
|
||||
display: inline-block;
|
||||
width:26px;
|
||||
height:26px;
|
||||
margin-right: 12px;
|
||||
border:1px solid;
|
||||
border-color:#07a583;
|
||||
border-radius:3px;
|
||||
text-align: center;
|
||||
line-height: 26px;
|
||||
color: #07a583;
|
||||
font-size: 14px;
|
||||
}
|
||||
.zone_new_first{
|
||||
margin-left: 40%;
|
||||
border-radius: 4px;
|
||||
width: 682px;
|
||||
padding-right: 30px;
|
||||
.item_index {
|
||||
font-weight:700;
|
||||
color:#ffffff;
|
||||
background-color:#07a583;
|
||||
}
|
||||
}
|
||||
.zone_new_three{
|
||||
width: 1200px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin: 0 auto;
|
||||
li{
|
||||
background-color: #fff;
|
||||
width: 354px;
|
||||
height: 196px;
|
||||
padding:28px 22px;
|
||||
border-radius: 4px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
transition: 0.1s;
|
||||
}
|
||||
.new_item {
|
||||
cursor: pointer;
|
||||
}
|
||||
.new_item:hover {
|
||||
transform: translate(0, -10px);
|
||||
img{
|
||||
left: 73px;
|
||||
}
|
||||
.zone_btn {
|
||||
transform: translate(-5px, 0);
|
||||
}
|
||||
.zone_n_title {
|
||||
color: #07a583;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.zone_projects{
|
||||
background-image:linear-gradient(180deg,#f1f4fa 0%,#ffffff 100%);
|
||||
.right_arraw {
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
right: 0;
|
||||
}
|
||||
.left_arraw {
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
left: 0;
|
||||
}
|
||||
.slick-track {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 435px;
|
||||
.slick-slide {
|
||||
height: auto;
|
||||
opacity: 0;
|
||||
}
|
||||
.slick-active {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
.container {
|
||||
|
||||
}
|
||||
.slick-current {
|
||||
z-index: 100;
|
||||
}
|
||||
.slick-current .zone_p_item {
|
||||
width:364px;
|
||||
height:395px;
|
||||
background:#fefefe;
|
||||
}
|
||||
.zone_p_item {
|
||||
cursor: pointer;
|
||||
width: 364px;
|
||||
height: 320px;
|
||||
border-radius:16px;
|
||||
padding: 42px;
|
||||
box-shadow:0px 0px 20px rgba(35, 54, 185, 0.06);
|
||||
background: url(./img/projectBg.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
border-color:#ffffff;
|
||||
transition: 0.3s;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
.info_img {
|
||||
width:74px;
|
||||
height: 74px;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.z_p_title {
|
||||
height: 22px;
|
||||
font-weight: 700;
|
||||
color: #1f2329;
|
||||
font-size: 16px;
|
||||
text-align: center;
|
||||
margin-top: 20px;
|
||||
}
|
||||
.z_p_desc{
|
||||
margin-top: 18px;
|
||||
color:#4c5876;
|
||||
font-size:14px;
|
||||
line-height:22px;
|
||||
word-break: break-all;
|
||||
-webkit-line-clamp: 5
|
||||
}
|
||||
}
|
||||
}
|
||||
.zone_contributor{
|
||||
min-height: 466px;
|
||||
background-color: #F7F9FC;
|
||||
padding:44px 0px 30px;
|
||||
.container {
|
||||
height: 220px;
|
||||
}
|
||||
.zone_c_lists{
|
||||
.slick-track {
|
||||
display: flex;
|
||||
}
|
||||
.c_item {
|
||||
margin-top: 40px;
|
||||
margin-left: 10px;
|
||||
width: 380px;
|
||||
height: 165px;
|
||||
background-image: url(./img/cbg.png);
|
||||
background-size: 100% 100%;
|
||||
position: relative;
|
||||
background-color:#f6f7fa;
|
||||
border:2px solid;
|
||||
border-color:#ffffff;
|
||||
border-radius:4px;
|
||||
box-shadow:0px 0px 10px rgba(7, 70, 165, 0.11);
|
||||
padding: 30px 35px;
|
||||
img {
|
||||
position: absolute;
|
||||
width:80px;
|
||||
height:80px;
|
||||
border-radius: 50%;
|
||||
border: solid 2px #ffffff;
|
||||
right: 27px;
|
||||
top: -40px;
|
||||
object-fit: cover;
|
||||
}
|
||||
.c_name {
|
||||
color: #000000;
|
||||
font-size: 16px;
|
||||
text-align: center;
|
||||
}
|
||||
.c_desc {
|
||||
color: #4c5876;
|
||||
font-size: 15px;
|
||||
line-height: 26px;
|
||||
}
|
||||
}
|
||||
.c_item:hover {
|
||||
box-shadow:0px 0px 35px rgba(7, 70, 165, 0.11);
|
||||
}
|
||||
}
|
||||
}
|
||||
.zone_community {
|
||||
background-color:#ebeff5;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
.sub_title {
|
||||
font-size: 17px;
|
||||
line-height: 27px;
|
||||
img {
|
||||
width:32.93px;
|
||||
height:9.15px;
|
||||
}
|
||||
}
|
||||
.c_role {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
z-index: 10;
|
||||
.c_role_item {
|
||||
width: 260px;
|
||||
height: 213px;
|
||||
background-image: url(./img/cbg2.png);
|
||||
background-size: 100% 100%;
|
||||
position: relative;
|
||||
padding: 30px 23px;
|
||||
.role_level {
|
||||
font-weight: 700;
|
||||
font-size: 18px;
|
||||
line-height: 27px;
|
||||
}
|
||||
.role_todo {
|
||||
color: #3d485d;
|
||||
font-size: 15px;
|
||||
line-height: 27px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
.dot {
|
||||
width:14px;
|
||||
height:14px;
|
||||
border-radius: 50%;
|
||||
background-color:#07a583;
|
||||
position: absolute;
|
||||
left: 6px;
|
||||
bottom: 7px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.dot_line {
|
||||
height: 0px;
|
||||
width: 1200px;
|
||||
border-bottom: dashed 1px #8d95ac;
|
||||
transform: translate(0, -14px);
|
||||
}
|
||||
}
|
||||
.zone_grow {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
background: url('./img/growBg.png') no-repeat;
|
||||
background-size: 100% 100%;
|
||||
.grow_path {
|
||||
height: 158px;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
.grow_path_item {
|
||||
z-index: 10;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
.grow_path_type {
|
||||
width: 82px;
|
||||
height: 28px;
|
||||
border: 1px solid;
|
||||
border-color: #07a583;
|
||||
border-radius: 2px;
|
||||
color: #07a583;
|
||||
font-size: 15px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-top: 10px;
|
||||
div {
|
||||
width: 3px;
|
||||
height: 13px;
|
||||
background-color: #07a583;
|
||||
margin-right: 3px;
|
||||
}
|
||||
}
|
||||
.grow_path_plan {
|
||||
color: #4c5876;
|
||||
font-size: 15px;
|
||||
text-align: center;
|
||||
margin: 5px 0;
|
||||
}
|
||||
}
|
||||
.grow_path_item:nth-child(even) {
|
||||
align-self: self-end;
|
||||
}
|
||||
.grow_path_item:nth-child(odd) {
|
||||
align-self: self-start;
|
||||
}
|
||||
.dot {
|
||||
width:12px;
|
||||
height:12px;
|
||||
background-color:#ffffff;
|
||||
border:1px solid;
|
||||
border-color:#07a583;
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
.line {
|
||||
height: 0px;
|
||||
width: 1200px;
|
||||
border-bottom: solid 1px #07a583;
|
||||
transform: translate(0, -80px);
|
||||
}
|
||||
.grow_introduction {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
.intro_item {
|
||||
width: 275px;
|
||||
height: 250px;
|
||||
background-color: #ffffff;
|
||||
border-radius: 6px;
|
||||
box-shadow: 0px 0px 12px rgba(29, 72, 129, 0.08);
|
||||
padding: 22px 17px;
|
||||
transition: 0.1s;
|
||||
.intro_title {
|
||||
font-weight: 700;
|
||||
color: #3d485d;
|
||||
font-size: 16px;
|
||||
img {
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
.intro_desc {
|
||||
color: #4c5876;
|
||||
font-size: 15px;
|
||||
margin-top: 6px;
|
||||
}
|
||||
}
|
||||
.intro_item:hover {
|
||||
transform: translate(0, -20px);
|
||||
}
|
||||
}
|
||||
}
|
||||
.zone_communicate {
|
||||
height: 160px;
|
||||
background: url('./img/communicateBg.png') no-repeat;
|
||||
background-size: 100% 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: space-evenly;
|
||||
p {
|
||||
font-weight: 500;
|
||||
font-size: 22px;
|
||||
color: #ffffff;
|
||||
}
|
||||
button {
|
||||
width: 140px;
|
||||
height: 40px;
|
||||
color: #ffffff;
|
||||
background-color: #07a583;
|
||||
border-radius: 2px;
|
||||
font-size: 16px;
|
||||
cursor: pointer;
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
.zone_parter{
|
||||
background-color: #fff;
|
||||
padding:70px 0px 90px;
|
||||
#scrollBox1{
|
||||
max-height: 332px;
|
||||
overflow: hidden;
|
||||
margin: 35px 0px 0px;
|
||||
width: 100%;
|
||||
.unitMainSlider{
|
||||
width: 1200px;
|
||||
margin:0px auto;
|
||||
.slick-list{
|
||||
height: 140px;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
.slickMainline{
|
||||
display: flex!important;
|
||||
padding:10px 2px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
a{
|
||||
background: #FFFFFF;
|
||||
box-shadow: 0px 1px 8px 1px rgba(0, 0, 0, 0.06);
|
||||
border-radius: 4px;
|
||||
border: 1px solid #FFFFFF;
|
||||
margin-right: 20px;
|
||||
padding:20px;
|
||||
height: 120px;
|
||||
width: 220px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
&:hover{
|
||||
border: 1px solid #8FCEFF;
|
||||
}
|
||||
img{
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
}
|
||||
&:last-child{
|
||||
margin-right: 0px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.zone1_VIP_box{
|
||||
padding:50px 0px;
|
||||
.vip_sub_title{
|
||||
color:#1f2329;
|
||||
font-size:15px;
|
||||
line-height:27px;
|
||||
text-align:center;
|
||||
max-width: 1000px;
|
||||
word-break: break-all;
|
||||
margin:16px auto 0px;
|
||||
}
|
||||
.vip_list{
|
||||
width: 1200px;
|
||||
background-image: url('./img/vipListBg.png'), linear-gradient(180deg,#009f7d 0%,#0f6754 100%);
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
border-radius: 10px;
|
||||
.vip_list_card{
|
||||
padding:0px 40px 10px;
|
||||
.card_title{
|
||||
width: 443px;
|
||||
height: 49px;
|
||||
background: url('./img/vipTitleBg.png') no-repeat;
|
||||
background-size: 100% 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin: 0 auto;
|
||||
margin-top: 38px;
|
||||
font-size: 20px;
|
||||
font-weight: 700;
|
||||
div {
|
||||
div:nth-child(1) {
|
||||
text-shadow: 0 1px 0 #fed5a6;
|
||||
color: #ffffff;
|
||||
}
|
||||
div:nth-child(2) {
|
||||
position: absolute;
|
||||
z-index: 10;
|
||||
background-image: -webkit-linear-gradient(0deg,#fffcf9 0%,#ffffff 51.47%,#fed5a6 100%);
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
text-shadow: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
.card_desc{
|
||||
color:#ffffff;
|
||||
font-size:15px;
|
||||
line-height:32px;
|
||||
word-break: break-all;
|
||||
margin-top: 32px;
|
||||
}
|
||||
.card_ul{
|
||||
margin: 25px 25px 25px 0;
|
||||
padding-bottom: 10px;
|
||||
background-image: linear-gradient(180deg,#f7f9fc 0%,#ffffff 100%);
|
||||
border-radius: 12px;
|
||||
.card_u_li{
|
||||
&:last-child .card_u_wrap{
|
||||
border-bottom: none;
|
||||
}
|
||||
.card_u_wrap {
|
||||
display: flex;
|
||||
padding:30px 40px;
|
||||
border-bottom: 1px dashed rgba(141, 149, 172,0.27);
|
||||
align-items: center;
|
||||
object-fit: cover;
|
||||
& > a >img{
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
border-radius: 50%;
|
||||
margin-right: 24px;
|
||||
}
|
||||
.card_u_info{
|
||||
.card_u_down{
|
||||
color:#4c5876;
|
||||
font-size:15px;
|
||||
line-height:26px;
|
||||
word-break: break-all;
|
||||
margin-top: 15px;
|
||||
}
|
||||
.card_u_up{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.card_name{
|
||||
font-weight:700;
|
||||
color:#1f2329;
|
||||
font-size:16px;
|
||||
display: block;
|
||||
max-width: 700px;
|
||||
height:26px;
|
||||
line-height: 26px;
|
||||
}
|
||||
.card_tag{
|
||||
color: #07a583;
|
||||
border: 1px solid;
|
||||
border-color: #07a583;
|
||||
border-radius: 2px;
|
||||
display: inline-block;
|
||||
min-width: 76px;
|
||||
text-align: center;
|
||||
line-height: 26px;
|
||||
font-size:15px;
|
||||
margin-left: 15px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
export const tempConfig = {
|
||||
zone: {
|
||||
mainTitle: '领域资讯',
|
||||
hotTitle: '热门资讯',
|
||||
member: '专区会员'
|
||||
},
|
||||
zone1: {
|
||||
mainTitle: '新闻资讯',
|
||||
hotTitle: '热门新闻资讯',
|
||||
member: '荣誉榜单'
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
html[data-theme="zone"] {
|
||||
--primary-color: #466aff;
|
||||
--light-color: rgba(70,106,255,0.85);
|
||||
--linear-back-color: linear-gradient(89.9deg,rgba(70, 106, 255, 0) 0%,rgba(70, 106, 255, 0.09) 100%);
|
||||
--tag-back: rgba(70, 106, 255, 0.12);
|
||||
}
|
||||
html[data-theme="zone1"] {
|
||||
--primary-color: #089f7f;
|
||||
--light-color: rgba(7, 165, 131, 0.85);
|
||||
--linear-back-color: linear-gradient(89.9deg,rgba(7, 165, 131, 0) 0%,rgba(7, 165, 131, 0.09) 100%);
|
||||
--tag-back: rgba(142, 147, 161, 0.1);
|
||||
}
|
||||
Loading…
Reference in New Issue