Merge pull request '合并代码' (#561) from durian/forgeplus-react:feature_news into pre_gitlink_server
|
@ -3962,36 +3962,37 @@ html>body #ajax-indicator {
|
|||
color: #FF6832;
|
||||
border:1px solid #FF6832;
|
||||
}
|
||||
|
||||
.head-nav::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.head-nav {
|
||||
text-align: center;
|
||||
height: 58px;
|
||||
box-sizing: border-box;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.head-nav ul#header-nav{
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
overflow-x: auto;
|
||||
overflow-y: auto;
|
||||
display: flex;
|
||||
align-self: flex-start;
|
||||
}
|
||||
|
||||
.head-nav ul#header-nav li{
|
||||
.head-nav li{
|
||||
height: 58px;
|
||||
line-height: 58px;
|
||||
cursor: pointer;
|
||||
font-size: 16px;
|
||||
padding-right:40px;
|
||||
}
|
||||
|
||||
.head-nav ul#header-nav a {
|
||||
.head-nav a {
|
||||
color: #fff;
|
||||
margin: 0 20px;
|
||||
}
|
||||
|
||||
.head-nav ul#header-nav li a:hover,.head-nav ul#header-nav li.active a {
|
||||
.head-nav li a:hover,.head-nav li.active a {
|
||||
color: #5091FF;
|
||||
}
|
||||
|
||||
|
|
|
@ -1,8 +1,8 @@
|
|||
@font-face {
|
||||
font-family: "iconfont"; /* Project id 2340181 */
|
||||
src: url('iconfont.woff2?t=1682403222759') format('woff2'),
|
||||
url('iconfont.woff?t=1682403222759') format('woff'),
|
||||
url('iconfont.ttf?t=1682403222759') format('truetype');
|
||||
src: url('iconfont.woff2?t=1686823554834') format('woff2'),
|
||||
url('iconfont.woff?t=1686823554834') format('woff'),
|
||||
url('iconfont.ttf?t=1686823554834') format('truetype');
|
||||
}
|
||||
|
||||
.iconfont {
|
||||
|
@ -13,6 +13,22 @@
|
|||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
.icon-a-zu2044:before {
|
||||
content: "\e96d";
|
||||
}
|
||||
|
||||
.icon-cuo:before {
|
||||
content: "\e96c";
|
||||
}
|
||||
|
||||
.icon-dui:before {
|
||||
content: "\e96b";
|
||||
}
|
||||
|
||||
.icon-zanting:before {
|
||||
content: "\e96a";
|
||||
}
|
||||
|
||||
.icon-cangkuyuyanicon:before {
|
||||
content: "\e962";
|
||||
}
|
||||
|
|
|
@ -5,6 +5,34 @@
|
|||
"css_prefix_text": "icon-",
|
||||
"description": "",
|
||||
"glyphs": [
|
||||
{
|
||||
"icon_id": "36020261",
|
||||
"name": "组 2044",
|
||||
"font_class": "a-zu2044",
|
||||
"unicode": "e96d",
|
||||
"unicode_decimal": 59757
|
||||
},
|
||||
{
|
||||
"icon_id": "5287658",
|
||||
"name": "错",
|
||||
"font_class": "cuo",
|
||||
"unicode": "e96c",
|
||||
"unicode_decimal": 59756
|
||||
},
|
||||
{
|
||||
"icon_id": "8802648",
|
||||
"name": "对",
|
||||
"font_class": "dui",
|
||||
"unicode": "e96b",
|
||||
"unicode_decimal": 59755
|
||||
},
|
||||
{
|
||||
"icon_id": "887857",
|
||||
"name": "暂停",
|
||||
"font_class": "zanting",
|
||||
"unicode": "e96a",
|
||||
"unicode_decimal": 59754
|
||||
},
|
||||
{
|
||||
"icon_id": "34965902",
|
||||
"name": "仓库语言icon",
|
||||
|
|
|
@ -72,9 +72,11 @@
|
|||
window.location.hash = $(this).attr("name");
|
||||
return false;
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
// window.addEventListener("popstate", function(e) {
|
||||
// console.log("popstate",e);
|
||||
// history.go(-2);
|
||||
// }, false);
|
||||
</script>
|
||||
</body>
|
||||
|
||||
|
|
16
src/App.js
|
@ -47,6 +47,10 @@ const ProjectDetail = Loadable({
|
|||
loader: () => import("./forge/Main/DetailAdaptor"),
|
||||
loading: Loading,
|
||||
});
|
||||
const Information = Loadable({
|
||||
loader: () => import('./forge/Information/index'),
|
||||
loading: Loading,
|
||||
})
|
||||
//forge安全设置
|
||||
const Security = Loadable({
|
||||
loader: () => import('./forge/SecuritySetting/Index'),
|
||||
|
@ -156,7 +160,7 @@ const Topic = Loadable({
|
|||
})
|
||||
|
||||
// 此处仅维护前端可能的一级路由,不用进行项目或者组织判断的字段。
|
||||
const keyWord = ["explore", "settings", "setting", "mulan", "wiki", "issues", "setting", "trending", "code", "projects", "pulls", "mine", "login", "register", "email", "export", "nopage", "404", "403", "500", "501", "search", "organize", "login", "register", "resetPassword", "aboutus","educoder", "glcc","bindlogin", "softbot"];
|
||||
const keyWord = ["explore", "settings", "setting", "mulan", "wiki", "issues", "setting", "trending", "code", "projects", "pulls", "mine", "login", "register", "email", "export", "nopage", "404", "403", "500", "501", "search", "organize", "login", "register", "resetPassword", "aboutus","educoder", "glcc","bindlogin", "softbot","zone"];
|
||||
|
||||
class App extends Component {
|
||||
constructor(props) {
|
||||
|
@ -329,7 +333,7 @@ class App extends Component {
|
|||
<MuiThemeProvider theme={theme}>
|
||||
<LoginDialog {...this.props} {...this.state} Modifyloginvalue={() => this.Modifyloginvalue()}></LoginDialog>
|
||||
{/* <GlccModal /> */}
|
||||
{!pathName || (pathName && pathName.toLowerCase().indexOf("glcc") === -1) ? <SiderBar {...this.props}/> : <SiderBarHelp/>}
|
||||
{!pathName || (pathName && pathName.toLowerCase() !== 'glcc') ? <SiderBar {...this.props}/> : <SiderBarHelp/>}
|
||||
{/* <Router> */}
|
||||
<Switch>
|
||||
{/* wiki预览 */}
|
||||
|
@ -376,6 +380,14 @@ class App extends Component {
|
|||
<ConfigurateBot {...this.props} {...p}/>
|
||||
)}
|
||||
></Route>
|
||||
<Route
|
||||
path={"/zone/:deptId"}
|
||||
render={
|
||||
(props) => {
|
||||
return (<Information {...this.props} {...props} {...this.state} />)
|
||||
}
|
||||
}>
|
||||
</Route>
|
||||
<Route
|
||||
path={"/settings"}
|
||||
render={
|
||||
|
|
|
@ -132,6 +132,14 @@ export function getUrl(path, goTest) {
|
|||
return `${path ? path: ''}`;
|
||||
}
|
||||
|
||||
export function getZoneUrl(path) {
|
||||
|
||||
let settings = localStorage.chromesetting&&JSON.parse(localStorage.chromesetting);
|
||||
let actionUrl = settings && settings.common.zone;
|
||||
|
||||
return `${actionUrl}${path?path:''}`
|
||||
}
|
||||
|
||||
export function getUrlmys(path, goTest) {
|
||||
// https://www.educoder.net
|
||||
// https://testbdweb.trustie.net
|
||||
|
|
|
@ -4,7 +4,7 @@
|
|||
|
||||
export {
|
||||
getUploadLogoActionUrl as getUploadLogoActionUrl,numFormat as numFormat,
|
||||
getImageUrl as getImageUrl,getImageUrlAbsolute as getImageUrlAbsolute,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
|
||||
getImageUrl as getImageUrl,getImageUrlAbsolute as getImageUrlAbsolute,getImage as getImage, getmyUrl as getmyUrl, getRandomNumber as getRandomNumber, getUrl as getUrl, getZoneUrl as getZoneUrl, 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,
|
||||
turnbar,returnbar,setSeoMeta as setSeoMeta
|
||||
|
|
|
@ -5,6 +5,7 @@ import 'code-prettify';
|
|||
import dompurify from 'dompurify';
|
||||
import { getEmoji } from '../forge/Main/emoji';
|
||||
import axios from 'axios';
|
||||
import imgError from '../images/img-error.png'
|
||||
|
||||
import { renderToString } from 'katex'
|
||||
|
||||
|
@ -80,9 +81,10 @@ export default ({
|
|||
const { type, expression } = math_expressions[capture];
|
||||
return renderToString(_unescape(expression) || '', { displayMode: type === 'block', throwOnError: false, output: 'html' })
|
||||
})
|
||||
rs = rs.replace(/▁/g, "▁▁▁")
|
||||
rs = dompurify.sanitize(rs.replace(/▁/g, "▁▁▁"))
|
||||
rs = rs.replaceAll('<img ', `<img onerror="javascript:this.src='${ imgError }';"`)
|
||||
resetMathExpressions()
|
||||
return dompurify.sanitize(rs)
|
||||
return rs
|
||||
}, [str,issues]);
|
||||
|
||||
// 锚点跳转,链接地址里含#对应的id
|
||||
|
|
|
@ -11,10 +11,12 @@ export default(({ header , nav })=>{
|
|||
nav && nav.list && nav.list.length>0 ?
|
||||
nav.list.map((item,key)=>{
|
||||
return(
|
||||
<li key={key} className={nav.active === key?"active":''}>
|
||||
!item.hide &&<li key={key} className={nav.active === key?"active":''}>
|
||||
<p>
|
||||
<Link to={item.href}>
|
||||
<i className={`iconfont ${item.icon || 'icon-huabanfuben'} font-18 mr10`}></i>{item.name}
|
||||
{item.icon && <i className={`iconfont ${item.icon || 'icon-huabanfuben'} font-18 mr10`}></i>}
|
||||
{item.img && <img src={item.img} alt="" width="20px" className="mr10"/>}
|
||||
{item.name}
|
||||
</Link>
|
||||
</p>
|
||||
</li>
|
||||
|
|
|
@ -45,6 +45,8 @@ class NewHeader extends Component {
|
|||
visiblemyss: false,
|
||||
openSearch:false,
|
||||
visible:false, //浮动消息框展示控制
|
||||
showSubMenu: false,
|
||||
zoneList: [], // 专区列表
|
||||
}
|
||||
}
|
||||
componentDidMount() {
|
||||
|
@ -57,6 +59,8 @@ class NewHeader extends Component {
|
|||
}
|
||||
window._header_componentHandler = this;
|
||||
|
||||
this.getZoneList(settings && settings.common.zone +'/api')
|
||||
|
||||
try {
|
||||
window.sessionStorage.setItem("yslgeturls", JSON.stringify(window.location.href))
|
||||
} catch (e) {}
|
||||
|
@ -191,6 +195,24 @@ class NewHeader extends Component {
|
|||
});
|
||||
}
|
||||
|
||||
getZoneList = (httpUrl) =>{
|
||||
const url = `${httpUrl}/zone/open/list`
|
||||
axios.get(url).then((response) => {
|
||||
if (response && response.data && response.data.data && response.data.data.length > 0) {
|
||||
let newArray = [];
|
||||
response.data.data.forEach((e, i) => {
|
||||
newArray[i] = {
|
||||
name: e.name,
|
||||
link: `/zone/${e.key}`
|
||||
}
|
||||
});
|
||||
this.setState({ zoneList: newArray })
|
||||
} else {
|
||||
}
|
||||
}).catch((error) => {
|
||||
});
|
||||
}
|
||||
|
||||
matchpaths = (url) => {
|
||||
const { match } = this.props;
|
||||
const isDev = window.location.port == 3007;
|
||||
|
@ -207,6 +229,10 @@ class NewHeader extends Component {
|
|||
return false
|
||||
}
|
||||
}
|
||||
|
||||
matchZone = () => {
|
||||
return window.location.href.includes('/zone/')
|
||||
}
|
||||
|
||||
checkProfile=(url)=>{
|
||||
const { showCompeleteDialog , completeProfile } = this.props;
|
||||
|
@ -273,6 +299,8 @@ class NewHeader extends Component {
|
|||
user,
|
||||
isRender,
|
||||
visible,
|
||||
showSubMenu,
|
||||
zoneList
|
||||
} = this.state;
|
||||
let search_url = settings && settings.common && settings.common.search;
|
||||
return (
|
||||
|
@ -301,16 +329,16 @@ class NewHeader extends Component {
|
|||
</div>
|
||||
{
|
||||
settings && settings.nav_logo_url ?
|
||||
<a href={settings && settings.new_course.default_url} className={"fl mr50"}>
|
||||
<a href={settings && settings.new_course.default_url} className={"fl mr30"}>
|
||||
<img alt="可控开源社区" className="logoimg" src={getImageUrl(`/${settings.nav_logo_url}`)}></img>
|
||||
</a>
|
||||
:
|
||||
""
|
||||
}
|
||||
<div className="head-nav pr" id={"head-navpre1"}>
|
||||
{/* <div className="head-nav pr"> */}
|
||||
{
|
||||
settings && settings.navbar && settings.navbar.length > 0 ?
|
||||
<ul id="header-nav">
|
||||
<ul id="header-nav" className="head-nav pr">
|
||||
{
|
||||
settings.navbar && settings.navbar.map((item, key) => {
|
||||
var new_link = item.link;
|
||||
|
@ -318,16 +346,37 @@ class NewHeader extends Component {
|
|||
var waiLian = (new_link && str.filter(item=>new_link.indexOf(item)>-1) );
|
||||
var wl = waiLian && waiLian.length>0;
|
||||
return (
|
||||
<li key={key} className={`${this.matchpaths(new_link) === true ? 'pr active' : 'pr'}`} style={{display:!is_hidden ? 'flex' : 'none'} }>
|
||||
<li key={key}
|
||||
className={`${this.matchpaths(new_link) === true ? 'pr active' : 'pr'}`}
|
||||
style={{display:!is_hidden ? 'flex' : 'none'} }
|
||||
>
|
||||
<a href={new_link} target={wl ? "_self":"_blank"}>{item.name}</a>
|
||||
</li>
|
||||
)
|
||||
})
|
||||
}
|
||||
{
|
||||
// 特色专区下拉菜单
|
||||
zoneList && zoneList.length > 0 &&
|
||||
<li
|
||||
className={`${this.matchZone() === true ? 'active drop-li' : 'drop-li'}`}
|
||||
onMouseOver={ () => { this.setState( {showSubMenu: true }) } }
|
||||
onMouseOut={ () => { this.setState( {showSubMenu: false }) } }
|
||||
>
|
||||
<a onClick={ () => { this.setState( {showSubMenu: true }) } }>特色专区</a>
|
||||
<ul className={ `drop-down ${ showSubMenu ? 'drop-down-show' : '' }` } style={{ height : showSubMenu ? `${ zoneList.length * 46}px` : 0 }}>
|
||||
{
|
||||
zoneList.map((e, k) => {
|
||||
return <li className="drop-down-item" key={ k }><a href={ e.link } className="task-hide" title={ e.name } target="_blank">{ e.name }</a></li>
|
||||
})
|
||||
}
|
||||
</ul>
|
||||
</li>
|
||||
}
|
||||
</ul>
|
||||
: ""
|
||||
}
|
||||
</div>
|
||||
{/* </div> */}
|
||||
<div className="head-right">
|
||||
{ search_url && <HeadSearch {...this.props}/>}
|
||||
{
|
||||
|
|
|
@ -363,4 +363,48 @@
|
|||
color: #FFFFFF!important;
|
||||
background-color: #355CFF;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.head-nav {
|
||||
.pr {
|
||||
justify-content: center;
|
||||
}
|
||||
.drop-li {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
.drop-down {
|
||||
position: fixed;
|
||||
top: 58px;
|
||||
background-color: #ffffff;
|
||||
border-bottom-left-radius: 10px;
|
||||
border-bottom-right-radius: 10px;
|
||||
transition: height 0.2s ease-in-out;
|
||||
overflow: hidden;
|
||||
box-shadow:0px 0px 6px rgba(6, 44, 107, 0.15);
|
||||
.drop-down-item {
|
||||
height: 46px !important;
|
||||
line-height: 46px !important;
|
||||
padding-right:unset;
|
||||
position: relative;
|
||||
a {
|
||||
color: #252b3a !important;
|
||||
display: inline-block;
|
||||
height: 100%;
|
||||
max-width: 160px;
|
||||
}
|
||||
&:hover {
|
||||
background-color: #ebf0ff;
|
||||
}
|
||||
// &:not(:last-child) {
|
||||
// border-bottom: solid 1px #cccccc42;
|
||||
// }
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 1200px){
|
||||
.drop-down{
|
||||
right: 200px;
|
||||
}
|
||||
}
|
||||
|
|
Before Width: | Height: | Size: 115 KiB After Width: | Height: | Size: 28 KiB |
After Width: | Height: | Size: 115 KiB |
|
@ -0,0 +1,46 @@
|
|||
import React from 'react';
|
||||
import Slider from 'react-slick';
|
||||
import { getImageUrl } from 'educoder';
|
||||
import Left from '../../../home/Img/left.png';
|
||||
import Right from '../../../home/Img/right.png';
|
||||
import banner from '../img/mainbanner.png'
|
||||
|
||||
|
||||
|
||||
let setting={
|
||||
dots:true,
|
||||
infinite: true,
|
||||
speed: 2000,
|
||||
slidesToShow: 1,
|
||||
slidesToScroll: 1,
|
||||
pauseOnDotsHover:true,
|
||||
autoplaySpeed:5000,
|
||||
pauseOnFocus:true,
|
||||
autoplay:true,
|
||||
arrows:true,
|
||||
prevArrow: <img className='slick-prev slick-arrow' src={Left} width="70px" alt=""/>,
|
||||
nextArrow: <img className='slick-prev slick-arrow' src={Right} width="70px" alt=""/>
|
||||
}
|
||||
function TopEdition(props) {
|
||||
const { bannerList } = props
|
||||
|
||||
|
||||
return(
|
||||
<Slider {...setting}>
|
||||
{
|
||||
bannerList && bannerList.length > 0 ?
|
||||
bannerList.map((i,k)=>{
|
||||
return(
|
||||
<div className={`regform`} key={ k }>
|
||||
<div style={{backgroundImage:`url(${i})`}}></div>
|
||||
</div>
|
||||
)
|
||||
})
|
||||
:
|
||||
<div className={`regform`} style={{backgroundImage:`url(${banner})`}}>
|
||||
</div>
|
||||
}
|
||||
</Slider>
|
||||
)
|
||||
}
|
||||
export default TopEdition;
|
|
@ -0,0 +1,58 @@
|
|||
import React , { useEffect, useState } from 'react';
|
||||
import Slider from 'react-slick';
|
||||
import { Link } from 'react-router-dom';
|
||||
|
||||
const settings = {
|
||||
dots: true,
|
||||
infinite: false,
|
||||
speed: 500,
|
||||
slidesToShow: 3,
|
||||
slidesToScroll: 3,
|
||||
arrows: false,
|
||||
adaptiveHeight: true,
|
||||
};
|
||||
|
||||
function Contributor(props) {
|
||||
const { personList } = props
|
||||
const [ showList, setShowList] = useState([]);
|
||||
|
||||
function initList() {
|
||||
if (personList.length % 3 !== 0) {
|
||||
setShowList([].concat(personList, new Array(personList.length % 3 - 1).fill({})))
|
||||
} else {
|
||||
setShowList( personList )
|
||||
}
|
||||
}
|
||||
|
||||
useEffect(()=>{
|
||||
initList();
|
||||
},[personList])
|
||||
|
||||
return(
|
||||
<div className="boxmain zone_c_lists pt40">
|
||||
{
|
||||
showList && showList.length > 0 ?
|
||||
<Slider {...settings}>
|
||||
{
|
||||
showList.map((i,k)=>{
|
||||
return(
|
||||
<div className="container" key={ k }>
|
||||
{ i.name &&
|
||||
<div className="c_item">
|
||||
<Link to={`/${i.login}`}><img src={i.imageUrl} alt="" /></Link>
|
||||
<div className="c_name task-hide">{i.name}</div>
|
||||
<p className="c_desc task-hide-2" style={{display:i.introduction?"":"flex"}}>{i.introduction || "暂无~"}</p>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
)
|
||||
})
|
||||
}
|
||||
</Slider>
|
||||
:""
|
||||
}
|
||||
</div>
|
||||
|
||||
)
|
||||
}
|
||||
export default Contributor;
|
|
@ -0,0 +1,22 @@
|
|||
import React from 'react';
|
||||
|
||||
|
||||
function DefaultImg({name,title}){
|
||||
|
||||
function randomNumberInRange(min, max) {
|
||||
// ?️ 获取 min(含)和 max(含)之间的数字
|
||||
return Math.floor(Math.random() * (max - min + 1)) + min;
|
||||
}
|
||||
|
||||
return(
|
||||
<div className="defaultBox">
|
||||
<img src={require(`../img/back${randomNumberInRange(1,3)}.png`).default} alt="" className="back" />
|
||||
<img src={require(`../img/color${randomNumberInRange(1,4)}.png`).default} alt="" className="color" />
|
||||
<span className="d_name">
|
||||
<span>{name}</span>
|
||||
{/* <span>{title}</span> */}
|
||||
</span>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
export default DefaultImg;
|
|
@ -0,0 +1,26 @@
|
|||
import React from 'react';
|
||||
import { Link } from 'react-router-dom';
|
||||
|
||||
function Hot({list , title, deptId, temp}){
|
||||
return(
|
||||
<div>
|
||||
<p className="hot_title">{title}</p>
|
||||
{
|
||||
list && list.length>0 &&
|
||||
<ul>
|
||||
{
|
||||
list.map((i,k)=>{
|
||||
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>
|
||||
</li>
|
||||
)
|
||||
})
|
||||
}
|
||||
</ul>
|
||||
}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
export default Hot;
|
|
@ -0,0 +1,80 @@
|
|||
import React , {forwardRef, useEffect, useState} from 'react';
|
||||
import { Modal , Form , Input , Button, Icon } from 'antd';
|
||||
import UploadImage from '../../Team/Component/UploadImage';
|
||||
import { getImageUrlAbsolute, getZoneUrl } from 'educoder';
|
||||
|
||||
const { TextArea } = Input;
|
||||
|
||||
function MemberApply(props){
|
||||
const { getFieldDecorator, validateFields , setFieldsValue } = props.form;
|
||||
const { current_user, onOk, visible, onCancel } = props
|
||||
const [imageUrl, setImageUrl] = useState(undefined)
|
||||
|
||||
useEffect(()=>{
|
||||
if (current_user) {
|
||||
setImageUrl(getImageUrlAbsolute(`/${current_user.image_url}`));
|
||||
}
|
||||
},[current_user])
|
||||
|
||||
function onSure(){
|
||||
validateFields((error,values)=>{
|
||||
if(!error){
|
||||
values.imageUrl = imageUrl
|
||||
onOk(values)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
const layout = {
|
||||
labelCol: { span: 5 },
|
||||
wrapperCol: { span: 18 },
|
||||
};
|
||||
return(
|
||||
<Modal
|
||||
visible={visible}
|
||||
title="加入专区会员"
|
||||
width="650px"
|
||||
closable={false}
|
||||
destroyOnClose
|
||||
className="apply-modal"
|
||||
footer={
|
||||
<div className="flexCenterJustify">
|
||||
<Button className="mr20 cancel-button" type="default" onClick={onCancel}>取消</Button>
|
||||
<Button type="primary" className="sure-button" onClick={onSure}>确定</Button>
|
||||
</div>
|
||||
}
|
||||
centered
|
||||
>
|
||||
<div>
|
||||
<Form {...layout }>
|
||||
<Form.Item label="会员名称" name="name">
|
||||
{getFieldDecorator("name", {
|
||||
initialValue: current_user.nickname,
|
||||
rules:[{ required:true,message:"请输入申请原因" }]
|
||||
})(
|
||||
<Input placeholder="请输入会员名称" maxLength={ 10 } width="220px"/>
|
||||
)}
|
||||
</Form.Item>
|
||||
<Form.Item label="会员头像" name="imageUrl" required>
|
||||
<UploadImage maxSize={ 5 } getImageUrl={ (url) => setImageUrl(url) } url={ getImageUrlAbsolute(`/${current_user.image_url}`)} action={ getZoneUrl(`/api/cms/common/upload`) } />
|
||||
</Form.Item>
|
||||
<Form.Item label="会员简介" name="introduction">
|
||||
{getFieldDecorator("introduction",{
|
||||
rules:[{ required:true,message:"请输入会员简介" }]
|
||||
})(
|
||||
<TextArea autoSize={{ minRows: 2, maxRows: 6 }} maxLength={ 130 } placeholder="请输入会员简介" width="220px"/>
|
||||
)}
|
||||
</Form.Item>
|
||||
<Form.Item label="申请原因" name="remark">
|
||||
{getFieldDecorator("remark",{
|
||||
rules:[{ required:true,message:"请输入申请原因" }]
|
||||
})(
|
||||
<TextArea autoSize={{ minRows: 2, maxRows: 6 }} maxLength={ 300 } placeholder="请输入申请原因" width="220px"/>
|
||||
)}
|
||||
</Form.Item>
|
||||
</Form>
|
||||
</div>
|
||||
</Modal>
|
||||
)
|
||||
}
|
||||
export default Form.create()(forwardRef(MemberApply));
|
|
@ -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={`/zone/${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>
|
||||
</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={`/zone/${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>
|
||||
</p>
|
||||
</li>
|
||||
)
|
||||
})
|
||||
}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
export default newBox;
|
|
@ -0,0 +1,66 @@
|
|||
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 [ moreTypes ,setMoreTypes ] = useState(false);
|
||||
const { id, partnerList } = props;
|
||||
useEffect(()=>{
|
||||
getUnit(partnerList);
|
||||
},[id])
|
||||
|
||||
function getUnit(array){
|
||||
const newArray = array
|
||||
setMoreTypes(array.length > 1)
|
||||
|
||||
while(newArray[1] && newArray[1].length + newArray[0].length <= 5) {
|
||||
newArray[0] = [...newArray[0], ...newArray.splice(1, 1)[0]]
|
||||
}
|
||||
setTopics(newArray)
|
||||
}
|
||||
|
||||
return(
|
||||
<ul className="boxmain zone_part_lists">
|
||||
{
|
||||
topics && topics.length>0 ?
|
||||
topics.map((i, k)=>{
|
||||
return(
|
||||
<li key={ k }>
|
||||
{
|
||||
i.map((j,k1)=>{
|
||||
return(
|
||||
<div className="zone_part_item" key={ k1 }>
|
||||
{ j.typeName && moreTypes && <span className="task-hide">{j.typeName}</span>}
|
||||
{
|
||||
j.link ? <a key={ k1 } href={ j.link } target="_blank" ><img src={j.logo} alt=""/></a>
|
||||
:
|
||||
<div><img src={j.logo} alt=""/></div>
|
||||
}
|
||||
|
||||
</div>
|
||||
)
|
||||
})
|
||||
}
|
||||
</li>
|
||||
)
|
||||
})
|
||||
:
|
||||
""
|
||||
}
|
||||
</ul>
|
||||
)
|
||||
}
|
||||
export default Partner;
|
|
@ -0,0 +1,83 @@
|
|||
import React , { useEffect, useRef, useState } from 'react';
|
||||
import Slider from 'react-slick';
|
||||
import projectRight from '../img/projectRight.png';
|
||||
import projectLeft from '../img/projectLeft.png';
|
||||
|
||||
function SampleNextArrow(props) {
|
||||
const { className, activeSlide, total , onClick } = props;
|
||||
return (
|
||||
activeSlide !== (total - 3) && <img src={projectRight} className={`right_arraw ${className}`} onClick={onClick}></img>
|
||||
);
|
||||
}
|
||||
|
||||
function SamplePrevArrow(props) {
|
||||
const { className, activeSlide, total , onClick } = props;
|
||||
return (
|
||||
activeSlide !== 0 && <img src={projectLeft} className={`left_arraw ${className}`} onClick={onClick}></img>
|
||||
);
|
||||
}
|
||||
|
||||
function Projects(props) {
|
||||
const { projectList } = props;
|
||||
const sliderRef = useRef(null)
|
||||
const [ activeSlide , setActiveSlide ] = useState(undefined);
|
||||
|
||||
const settings = {
|
||||
className: "center",
|
||||
centerMode: true,
|
||||
infinite: false,
|
||||
centerPadding: "100px",
|
||||
slidesToShow: 3,
|
||||
speed: 500,
|
||||
nextArrow: <SampleNextArrow className="right_arraw" activeSlide={ activeSlide } total={ projectList.length }/>,
|
||||
prevArrow: <SamplePrevArrow className="left_arraw" activeSlide={ activeSlide } total={ projectList.length }/>,
|
||||
afterChange: current => { setActiveSlide(current) }
|
||||
};
|
||||
|
||||
|
||||
useEffect(()=>{
|
||||
if(sliderRef && projectList && projectList.length > 2){
|
||||
sliderRef.current.slickNext()
|
||||
}
|
||||
},[sliderRef])
|
||||
|
||||
|
||||
return(
|
||||
<div className={`boxmain ${ projectList.length !== 3 && 'not_three_project' } ${ projectList.length < 3 && 'less_three_project' }`}>
|
||||
{
|
||||
projectList && projectList.length > 0 ?
|
||||
(projectList.length < 3 ?
|
||||
projectList.map((i,k)=>{
|
||||
return(
|
||||
<div className="container" key={ k }>
|
||||
<div className="zone_p_item">
|
||||
{i.projectProperties && i.projectProperties.authorImageUrl && <img className="info_img" src={i.projectProperties.authorImageUrl} alt="" /> }
|
||||
<p className="z_p_title task-hide" onClick={()=>window.open(i.projectURL)}>{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 ref={sliderRef} {...settings}>
|
||||
{
|
||||
projectList.map((i,k)=>{
|
||||
return(
|
||||
<div className="container" key={ k }>
|
||||
<div className="zone_p_item">
|
||||
{i.projectProperties && i.projectProperties.authorImageUrl && <img className="info_img" src={i.projectProperties.authorImageUrl} alt="" /> }
|
||||
<p className="z_p_title task-hide" onClick={()=>window.open(i.projectURL)}>{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;
|
|
@ -0,0 +1,61 @@
|
|||
import React , { useState , useEffect } from 'react';
|
||||
import { Menu } from 'antd';
|
||||
import banner from '../img/mainbanner.png'
|
||||
import { Link } from 'react-router-dom';
|
||||
import { tempConfig } from '../tempInfo';
|
||||
import TopEdition from './TopEdition'
|
||||
|
||||
|
||||
|
||||
function PublicBanner(props){
|
||||
const [ key , setKey ] = useState("1");
|
||||
const { deptId } = props.match.params;
|
||||
const { pathname } = props.history.location;
|
||||
const { data , adminUrl, temp } = props;
|
||||
|
||||
useEffect(()=>{
|
||||
if(pathname){
|
||||
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 === `/zone/${deptId}`){
|
||||
setKey("1");
|
||||
}
|
||||
else if(project.test(pathname)){
|
||||
setKey("2");
|
||||
}
|
||||
else if(info.test(pathname) || infodetail.test(pathname)){
|
||||
setKey("4");
|
||||
}
|
||||
else if(vip.test(pathname)){
|
||||
setKey("6");
|
||||
}
|
||||
}
|
||||
},[pathname])
|
||||
|
||||
return(
|
||||
<div className="in_banner">
|
||||
<TopEdition bannerList={ data && data.bannerList && data.bannerList.split(",") }></TopEdition>
|
||||
{
|
||||
data &&
|
||||
<div className="zone_content">
|
||||
<p className="main_t">{data.mainTitle}</p>
|
||||
<p className="sub_t" dangerouslySetInnerHTML={{ __html: data.subTitle }}></p>
|
||||
</div>
|
||||
}
|
||||
<div className="bannerMenus">
|
||||
<Menu mode={"horizontal"} selectedKeys={[key]}>
|
||||
<Menu.Item key={"1"}><Link to={`/zone/${deptId}`}><img src={require(`../img/${temp}Menu1.png`)} alt="" width="29px"/>首页</Link></Menu.Item>
|
||||
<Menu.Item key={"2"}><Link to={`/zone/${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={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={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={require(`../img/${temp}Menu7.png`)} alt="" width="34px"/>后台管理</a></Menu.Item> }
|
||||
</Menu>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
export default PublicBanner;
|
|
@ -0,0 +1,187 @@
|
|||
import React,{ useState, useEffect } from 'react';
|
||||
import img1 from '../img/img1.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 Partner from '../Component/partner';
|
||||
|
||||
function HeaderPage(props){
|
||||
const [ projectList , setProjectList ] = useState(undefined);
|
||||
const [ personList , setPersonList ] = useState(undefined);
|
||||
const [ newsList, setNewsList ] = useState(undefined);
|
||||
const [ partnerList, setParterList ] = useState(undefined);
|
||||
const { deptId } = props.match.params;
|
||||
const { data, id, temp } = props;
|
||||
|
||||
useEffect(()=>{
|
||||
if(id){
|
||||
getProjectList();
|
||||
getNewsList();
|
||||
getPersonList();
|
||||
getPartnerList();
|
||||
}
|
||||
},[id])
|
||||
|
||||
function getPersonList(){
|
||||
getHomePageList(id).then(result=>{
|
||||
if(result){
|
||||
setPersonList(result.data.rows);
|
||||
}
|
||||
}).catch(error=>{})
|
||||
}
|
||||
|
||||
function getNewsList(){
|
||||
gethomePageDocList(id).then(result=>{
|
||||
if(result){
|
||||
setNewsList(result.data.rows);
|
||||
}
|
||||
}).catch(error=>{})
|
||||
}
|
||||
|
||||
function getProjectList(){
|
||||
getAllList(id,{isHomepage:1}).then(result=>{
|
||||
if(result){
|
||||
setProjectList(result.data.rows);
|
||||
}
|
||||
}).catch(console.error())
|
||||
}
|
||||
|
||||
function getPartnerList(){
|
||||
const url = `${httpUrl}/zone/open/${id}/partners/list`;
|
||||
axios.get(url).then(result=>{
|
||||
if(result){
|
||||
const array = result.data.rows;
|
||||
const newArray = [];
|
||||
for(let i in array) {
|
||||
let e = array[i]
|
||||
if (e.zonePartnersList && e.zonePartnersList.length > 0) {
|
||||
e.zonePartnersList[0].typeName = e.typeName;
|
||||
}
|
||||
if ( e.zonePartnersList.length > 0 ) {
|
||||
newArray.push(e.zonePartnersList);
|
||||
}
|
||||
}
|
||||
setParterList(newArray);
|
||||
}
|
||||
}).catch(error=>{})
|
||||
}
|
||||
return(
|
||||
<div className="zone_box">
|
||||
{data && <p className="in_title">{data.firstTitle}</p> }
|
||||
{
|
||||
// 专区简介
|
||||
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"}} dangerouslySetInnerHTML={{ __html: data.introductionContent }} ></p>
|
||||
</div>
|
||||
{
|
||||
data.introductionImage &&
|
||||
<img src={data.introductionImage} alt="" height="277px"/>
|
||||
}
|
||||
</div>
|
||||
}
|
||||
{
|
||||
// 新闻动态
|
||||
data && data.cmsShow === 1 && newsList && newsList.length>0 &&
|
||||
<div className="zone_news">
|
||||
<p className="in_title mb40">{ data.homepageCmsTitle }</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={`/zone/${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>
|
||||
</p>
|
||||
</div>
|
||||
<ul className={`zone_new_three ${newsList.length <4 ? "flexStart" : "spaceeTween"}`}>
|
||||
{
|
||||
newsList.map((i,k)=>{
|
||||
return(
|
||||
k > 0 && <li key={ k }>
|
||||
<Link className="zone_n_title task-hide" to={`/zone/${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>
|
||||
</p>
|
||||
</li>
|
||||
)
|
||||
})
|
||||
}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
{
|
||||
// 精选项目
|
||||
data && data.projectShow === 1 && projectList && projectList.length>0 &&
|
||||
<div className="zone_projects">
|
||||
<p className="in_title mb40">{ data.homepageProjectTitle }</p>
|
||||
{
|
||||
<div className="boxmain zone_p_lists">
|
||||
{
|
||||
projectList.map((i,k)=>{
|
||||
return(
|
||||
<li key={ k }>
|
||||
<div className="imgBox">{i.projectProperties && i.projectProperties.authorImageUrl && <img src={i.projectProperties.authorImageUrl} alt="" /> }</div>
|
||||
<div className="infosBox">
|
||||
<a onClick={()=>window.open(i.projectURL)} className="z_p_title task-hide">{i.projectProperties && i.projectProperties.name}</a>
|
||||
<p className="z_p_desc task-hide-2">{i.projectProperties && i.projectProperties.description ? i.projectProperties.description : "暂无~"}</p>
|
||||
</div>
|
||||
</li>
|
||||
)
|
||||
})
|
||||
}
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
}
|
||||
{
|
||||
// 核心贡献者
|
||||
data && data.memberShow === 1 && personList && personList.length > 0 &&
|
||||
<div className="zone_contributor">
|
||||
<p className="in_title">{ data.homepageMemberTitle }</p>
|
||||
{
|
||||
<ul className="boxmain zone_c_lists">
|
||||
{
|
||||
personList.map((i,k)=>{
|
||||
return(
|
||||
<li key={ k }>
|
||||
<Link to={`/${i.login}`}><img src={i.imageUrl} alt="" /></Link>
|
||||
<span>{i.name}</span>
|
||||
<p className="task-hide-2" style={{display:i.introduction?"":"flex"}}>{i.introduction || "暂无~"}</p>
|
||||
</li>
|
||||
)
|
||||
})
|
||||
}
|
||||
</ul>
|
||||
}
|
||||
</div>
|
||||
}
|
||||
|
||||
|
||||
{
|
||||
// 合作伙伴
|
||||
data && data.partnersShow === 1 && partnerList && partnerList.length > 0 &&
|
||||
<div className="zone_parter">
|
||||
<p className="in_title">{ data.homepagePartnersTitle }</p>
|
||||
<Partner id={ id } partnerList={ partnerList }></Partner>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
export default HeaderPage;
|
|
@ -0,0 +1,302 @@
|
|||
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/guideArrow1.png';
|
||||
import ra from '../img/ra.png'
|
||||
import title from '../img/title.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 [ partnerList, setParterList ] = useState(undefined);
|
||||
const { deptId } = props.match.params;
|
||||
const { data, id, temp, history } = props;
|
||||
|
||||
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();
|
||||
getPartnerList();
|
||||
}
|
||||
},[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){
|
||||
if (result.data.rows.length < 3) {
|
||||
setProjectList(result.data.rows)
|
||||
} else {
|
||||
setProjectList([...result.data.rows, {}]);
|
||||
}
|
||||
}
|
||||
}).catch(console.error())
|
||||
}
|
||||
|
||||
function getPartnerList(){
|
||||
const url = `${httpUrl}/zone/open/${id}/partners/list`;
|
||||
axios.get(url).then(result=>{
|
||||
if(result){
|
||||
const array = result.data.rows;
|
||||
const newArray = [];
|
||||
for(let i in array) {
|
||||
let e = array[i]
|
||||
if (e.zonePartnersList && e.zonePartnersList.length > 0) {
|
||||
e.zonePartnersList[0].typeName = e.typeName;
|
||||
}
|
||||
if ( e.zonePartnersList.length > 0 ) {
|
||||
newArray.push(e.zonePartnersList);
|
||||
}
|
||||
}
|
||||
setParterList(newArray);
|
||||
}
|
||||
}).catch(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" dangerouslySetInnerHTML={{ __html: 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" key={ k }>
|
||||
<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>
|
||||
{
|
||||
// 新闻动态
|
||||
data && data.cmsShow === 1 && newsList && newsList.length>0 &&
|
||||
<div className="zone_news">
|
||||
<div className="boxmain" style={{display:"flex"}}>
|
||||
<p className="news_title">{ data.homepageCmsTitle }</p>
|
||||
<div className="zone_new_first">
|
||||
<p className="task-hide">
|
||||
<span className="item_index">1</span>
|
||||
<Link to={`/zone/${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 className="flexCenter">
|
||||
<img src={shijian} alt="" className="mr3" />
|
||||
{newsList[0].publishTime}
|
||||
</span>
|
||||
<Link to={`/zone/${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 &&
|
||||
<div onClick={() => { history.push(`/zone/${deptId}/newdetail/${i.id}`) }}>
|
||||
<li className="new_item" style={{ display: 'inline-block' }}>
|
||||
<p className="task-hide">
|
||||
<span className="item_index">{k + 1}</span>
|
||||
<Link className="zone_n_title" to={`/zone/${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 flexCenter" 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>
|
||||
</div>
|
||||
)
|
||||
})
|
||||
}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
{
|
||||
// 精选项目
|
||||
data && data.projectShow === 1 && projectList && projectList.length > 0 &&
|
||||
<div className="zone_projects pt50 pb30">
|
||||
<p className="in_title mb40">{ data.homepageProjectTitle }</p>
|
||||
<Projects projectList={projectList}></Projects>
|
||||
</div>
|
||||
}
|
||||
{
|
||||
// 核心贡献者
|
||||
data && data.memberShow === 1 && personList && personList.length > 0 &&
|
||||
<div className="zone_contributor">
|
||||
<p className="in_title">{ data.homepageMemberTitle }</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, k) => {
|
||||
return (
|
||||
<div className="c_role_item" key={ k }>
|
||||
<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">开源芯<b>⽚⽤</b>户成长体系介绍</p> */}
|
||||
<p className="in_title mb20"><img src={ title } alt="" /></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" key={ k }>
|
||||
{ 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, k) => {
|
||||
return (
|
||||
<div className="intro_item" key={ k }>
|
||||
<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 onClick={() => { window.location.href = 'https://forum.gitlink.org.cn/forums/theme/135' }}>立即加入</button>
|
||||
</div>
|
||||
{
|
||||
// 合作伙伴
|
||||
data && data.partnersShow === 1 && partnerList && partnerList.length > 0 &&
|
||||
<div className="zone_parter">
|
||||
<p className="in_title">{ data.homepagePartnersTitle }</p>
|
||||
<Partner id={ id } partnerList={ partnerList }></Partner>
|
||||
</div>
|
||||
}
|
||||
|
||||
</div>
|
||||
)
|
||||
}
|
||||
export default HeaderPage;
|
|
@ -0,0 +1,217 @@
|
|||
import React , { useState , useEffect } from 'react';
|
||||
import { Menu , Spin , Skeleton } from 'antd';
|
||||
import Hot from '../Component/hot';
|
||||
import { Box , LongWidth } from '../../Component/layout';
|
||||
import { Link } from 'react-router-dom';
|
||||
import Lists from './newsList';
|
||||
import guideArrow from '../img/guideArrow.png';
|
||||
import axios from 'axios';
|
||||
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 { tempConfig, tempEnum } from '../tempInfo';
|
||||
import { httpUrl } from '../fetch';
|
||||
|
||||
|
||||
function Main(props){
|
||||
const [ key , setKey ] = useState("1");
|
||||
const [ mainList , setMainList ] = useState(undefined);
|
||||
const [ name , setName] = useState(undefined);
|
||||
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, temp } = props;
|
||||
|
||||
|
||||
useEffect(()=>{
|
||||
if(id) {
|
||||
setIsSpin(true);
|
||||
if (temp === tempEnum.zone) {
|
||||
getMainList();
|
||||
} else {
|
||||
getCateList();
|
||||
}
|
||||
getHotList();
|
||||
}
|
||||
},[id])
|
||||
|
||||
useEffect(() => {
|
||||
if (newCateId) {
|
||||
getSubHotList()
|
||||
}
|
||||
}, [newCateId])
|
||||
|
||||
function getMainList(){
|
||||
getNewsAllList(id).then(result=>{
|
||||
if(result){
|
||||
let rows = result.data.rows;
|
||||
setMainList(rows);
|
||||
if (temp !== tempEnum.zone) {
|
||||
selectCate(rows[0].id)
|
||||
}
|
||||
setTimeout(() => {
|
||||
let ele = document.getElementById("menus");
|
||||
if(ele){
|
||||
let h = ele.clientHeight;
|
||||
setMenuH(h>56);
|
||||
}
|
||||
setIsSpin(false);
|
||||
}, 100);
|
||||
}
|
||||
}).catch(error=>{})
|
||||
}
|
||||
|
||||
function getCateList() {
|
||||
const url = `${httpUrl}/cms/doc/open/zone/${id}/dirList`;
|
||||
axios.get(url).then(result=>{
|
||||
if(result){
|
||||
let rows = result.data.rows;
|
||||
setMainList(rows);
|
||||
if (temp !== tempEnum.zone) {
|
||||
selectCate(rows[0].id)
|
||||
}
|
||||
setIsSpin(false);
|
||||
}
|
||||
}).catch(error=>{})
|
||||
}
|
||||
|
||||
function getHotList(){
|
||||
getNewsHotList(id,{
|
||||
pageSize:15,pageNum:1
|
||||
}).then(result=>{
|
||||
if(result){
|
||||
setHotList(result.data.rows);
|
||||
}
|
||||
}).catch(error=>{})
|
||||
}
|
||||
|
||||
function getSubHotList() {
|
||||
const url = `${httpUrl}/cms/doc/open/dir/${newCateId}/hotDocList`;
|
||||
axios.get(url,{
|
||||
params:{pageSize:15,pageNum:1}
|
||||
}).then(result=>{
|
||||
if(result){
|
||||
setHotList(result.data.rows);
|
||||
}
|
||||
}).catch(error=>{})
|
||||
}
|
||||
|
||||
function selectCate(id) {
|
||||
setNewCateId(id)
|
||||
props.history.push(`/zone/${deptId}/news/${id}`)
|
||||
}
|
||||
|
||||
return(
|
||||
<div>
|
||||
<div className="main_content">
|
||||
<div className="boxmain">
|
||||
<p className="in_title">{ tempConfig[temp].mainTitle }</p>
|
||||
{
|
||||
mainList && mainList.length>0 &&
|
||||
(
|
||||
temp === tempEnum.zone ?
|
||||
<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>
|
||||
:
|
||||
<div className="main_tag">
|
||||
{
|
||||
mainList.map((i,k)=>{
|
||||
if (k <= 4) {
|
||||
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>
|
||||
}
|
||||
</div>
|
||||
<div style={{width:'1200px',margin:"0px auto"}}>
|
||||
<Box>
|
||||
<LongWidth>
|
||||
<Spin spinning={isSpin}>
|
||||
{
|
||||
cateId ?
|
||||
<Lists {...props}/>
|
||||
:
|
||||
<div style={{minHeight:"400px"}}>
|
||||
{
|
||||
mainList && mainList.length>0 &&
|
||||
mainList.map((i,k)=>{
|
||||
return(
|
||||
<div className="main_card radius4" style={{paddingTop:"25px"}}>
|
||||
<div className="guide">
|
||||
<span className="task-hide">{i.name}</span>
|
||||
{ i.cmsDocList && i.cmsDocList.length> 0 && <Link className="flexCenter" to={`/zone/${deptId}/news/${i.id}`} onClick={()=>{window.scrollTo(0,400)}}>更多<img src={guideArrow} alt="" width="14px"/></Link> }
|
||||
</div>
|
||||
<div>
|
||||
{
|
||||
i.cmsDocList && i.cmsDocList.length>0 ?
|
||||
i.cmsDocList.map((j,e)=>{
|
||||
return(
|
||||
<div className="main_card_item" onClick={()=>{props.history.push(`/zone/${deptId}/newdetail/${j.id}`)}}>
|
||||
{e===0 &&
|
||||
(
|
||||
j.headImg ?
|
||||
<img src={j.headImg} alt=""/>
|
||||
:
|
||||
<DefaultImg name="GitLink" title={i.name} />
|
||||
)
|
||||
}
|
||||
<div style={{flex:1,width:0}}>
|
||||
<Link to={`/zone/${deptId}/newdetail/${j.id}`} className={`sub_name task-hide ${e===0? "":"sub_i"}`}>{j.name}</Link>
|
||||
<p className={`sub_desc ${e===0? "task-hide-2":"task-hide"}`}>
|
||||
{j.summary}
|
||||
</p>
|
||||
<div className="sub_info">
|
||||
<span><img src={shijian} alt="" />{j.publishTime}</span>
|
||||
<span><img src={liulan} alt="" />{j.visits}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
})
|
||||
:
|
||||
<div style={{display:"flex",justifyContent:"center",alignItems:"center",flexDirection:"column",height:300}}>
|
||||
<img src={emptydata} alt="" width="230"/>
|
||||
<p className="font-15 color-grey-6 mt20">暂无数据~</p>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
})
|
||||
}
|
||||
</div>
|
||||
}
|
||||
</Spin>
|
||||
</LongWidth>
|
||||
{
|
||||
hotList && hotList.length>0 &&
|
||||
<div className="short_width radius4">
|
||||
<Hot temp={ temp } title={ tempConfig[temp].hotTitle } list={hotList} deptId={deptId}/>
|
||||
</div>
|
||||
}
|
||||
</Box>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
export default Main;
|
|
@ -0,0 +1,73 @@
|
|||
import React,{ useState , useEffect } from 'react';
|
||||
import { Breadcrumb , Divider, Spin } from 'antd';
|
||||
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 { 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 [ isSpin , setIsSpin]=useState(false);
|
||||
const temp = props.temp
|
||||
|
||||
useEffect(()=>{
|
||||
if(id){
|
||||
window.scrollTo(0,450);
|
||||
getDetails();
|
||||
}
|
||||
},[id])
|
||||
|
||||
function getDetails(){
|
||||
setIsSpin(true)
|
||||
getNewsDetail(id).then(result=>{
|
||||
if(result){
|
||||
let data = result.data.data;
|
||||
setDetail(data);
|
||||
setCmsDir(data.cmsDir);
|
||||
setContent(Base64.decode(data.content));
|
||||
setIsSpin(false)
|
||||
}
|
||||
}).catch(error=>{
|
||||
setIsSpin(false)
|
||||
})
|
||||
}
|
||||
return(
|
||||
<div className="detail_news_all">
|
||||
<Spin spinning={isSpin} size="large">
|
||||
{
|
||||
detail &&
|
||||
<div style={{width:'1200px',margin:"0px auto",padding:"30px 0px"}}>
|
||||
<Breadcrumb separator=">">
|
||||
<Breadcrumb.Item href={`/zone/${deptId}/news`}>{tempConfig[temp].mainTitle}</Breadcrumb.Item>
|
||||
{ cmsDir && <Breadcrumb.Item href={`/zone/${deptId}/news/${cmsDir.id}`}>{cmsDir.name}</Breadcrumb.Item> }
|
||||
<Breadcrumb.Item>正文</Breadcrumb.Item>
|
||||
</Breadcrumb>
|
||||
<div className="info_text">
|
||||
<div className="info_text_main">
|
||||
<p className="i_name">{detail.name}</p>
|
||||
<ul className="i_ul_value">
|
||||
{ cmsDir && <li><a href={ detail.publishUserUrl } ><img src={ detail.publishUserImage } alt="" className="headimg" /> { detail.publishUserNickname }</a></li> }
|
||||
{ cmsDir && <li>{ detail.isFirstPublish ? '创建于' : '更新于' }{detail.publishTime}</li> }
|
||||
{ detail.visits && <li><img src={liulan} alt="" className="mr5" />{detail.visits}</li> }
|
||||
</ul>
|
||||
</div>
|
||||
<Divider dashed={true} />
|
||||
{
|
||||
content ?
|
||||
<RenderHtml className="informations_detail imageLayerParent" value={content} url={props.history.location} />
|
||||
:
|
||||
<span>暂无详情~</span>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
</Spin>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
export default NewsDetail;
|
|
@ -0,0 +1,173 @@
|
|||
import React , { useEffect , useState } from 'react';
|
||||
import PublicBanner from '../Component/publicBanner';
|
||||
import { Box , LongWidth } from '../../Component/layout';
|
||||
import { Menu , Breadcrumb , Pagination , Spin , Tooltip } from 'antd';
|
||||
import Hot from '../Component/hot';
|
||||
import axios from 'axios';
|
||||
import shijian from '../img/shijian.png';
|
||||
import liulan from '../img/liulan.png';
|
||||
import DefaultImg from '../Component/defaultImg';
|
||||
import emptydata from '../../Images/nodata.png';
|
||||
import nodata from '../img/nodata.png';
|
||||
import { Link } from 'react-router-dom';
|
||||
import { httpUrl } from '../fetch';
|
||||
import { tempEnum } from '../tempInfo';
|
||||
|
||||
function NewsList(props){
|
||||
const { deptId , cateId } = props.match.params;
|
||||
const [ pageNum , setPageNum ] = useState(1);
|
||||
const [ total , setTotal ] = useState(0);
|
||||
const pageSize = 15;
|
||||
const [ columnList , setColumnList ] = useState(undefined);
|
||||
const [ hostList , setHotList ] = useState(undefined);
|
||||
const [ mainList , setMainList ] = useState(undefined);
|
||||
const [ details , setDetails ] = useState(undefined);
|
||||
const [ menuSpin , setMenuSpin ] = useState(true);
|
||||
const { id, temp } = props;
|
||||
|
||||
|
||||
useEffect(()=>{
|
||||
if(id && cateId ){
|
||||
setMenuSpin(true);
|
||||
getMainList();
|
||||
}
|
||||
},[id,cateId,pageNum])
|
||||
|
||||
// useEffect(()=>{
|
||||
// if(pageNum){
|
||||
// window.scrollTo(0,400);
|
||||
// }
|
||||
// },[pageNum])
|
||||
|
||||
|
||||
function getColumnDetail(){
|
||||
const url = `${httpUrl}/cms/doc/open/dir/${cateId}`;
|
||||
axios.get(url).then(result=>{
|
||||
if(result){
|
||||
setDetails(result.data.data);
|
||||
}
|
||||
}).catch(error=>{})
|
||||
}
|
||||
|
||||
function getColumnList(){
|
||||
const url = `${httpUrl}/cms/doc/open/zone/${id}/dirList`;
|
||||
axios.get(url).then(result=>{
|
||||
if(result){
|
||||
setColumnList(result.data.rows);
|
||||
setTotal(result.data.total);
|
||||
setMenuSpin(false);
|
||||
}
|
||||
}).catch(error=>{})
|
||||
}
|
||||
|
||||
function getMainList(){
|
||||
const url = `${httpUrl}/cms/doc/open/dir/${cateId}/docList`;
|
||||
axios.get(url,{
|
||||
params:{
|
||||
pageNum,pageSize
|
||||
}
|
||||
}).then(result=>{
|
||||
if(result){
|
||||
setMainList(result.data.rows);
|
||||
setTotal(result.data.total);
|
||||
setMenuSpin(false);
|
||||
}
|
||||
}).catch(error=>{})
|
||||
}
|
||||
|
||||
function getHotList(){
|
||||
const url = `${httpUrl}/cms/doc/open/dir/${cateId}/hotDocList`;
|
||||
axios.get(url,{
|
||||
params:{
|
||||
pageNum:1,pageSize:15
|
||||
}
|
||||
}).then(result=>{
|
||||
if(result){
|
||||
setHotList(result.data.rows);
|
||||
}
|
||||
}).catch(errror=>{})
|
||||
}
|
||||
|
||||
return(
|
||||
// <div className="info_news_list">
|
||||
// <div style={{width:'1200px',margin:"0px auto",padding:"30px 0px"}}>
|
||||
// <Breadcrumb separator=">">
|
||||
// <Breadcrumb.Item href={`/zone/${deptId}/news`}>领域资讯</Breadcrumb.Item>
|
||||
// <Breadcrumb.Item>{details && details.name}</Breadcrumb.Item>
|
||||
// </Breadcrumb>
|
||||
// <p className="in_title mb30">{details && details.name}</p>
|
||||
// <Box>
|
||||
// <Spin spinning={menuSpin}>
|
||||
// <div className="column_menu">
|
||||
// {
|
||||
// columnList && columnList.length>0 &&
|
||||
// <Menu selectedKeys={[cateId]}>
|
||||
// {
|
||||
// columnList.map((i,k)=>{
|
||||
// return(
|
||||
// <Menu.Item key={i.id} value={i.id} ><Tooltip placement={'left'} title={i.name}><Link className="task-hide" onClick={()=>{if(document.documentElement.scrollTop > 600)window.scrollTo(0,480);}} to={`/zone/${deptId}/news/${i.id}`} title={i.name}>{i.name}</Link></Tooltip></Menu.Item>
|
||||
// )
|
||||
// })
|
||||
// }
|
||||
// </Menu>
|
||||
// }
|
||||
// </div>
|
||||
// </Spin>
|
||||
// <div className="column_content">
|
||||
// <LongWidth>
|
||||
<Spin spinning={menuSpin}>
|
||||
<div className="main_card">
|
||||
{
|
||||
mainList && mainList.length>0 &&
|
||||
mainList.map((i,k)=>{
|
||||
return(
|
||||
<div className="main_card_item" onClick={()=>{props.history.push(`/zone/${deptId}/newdetail/${i.id}`)}} key={k}>
|
||||
{
|
||||
i.headImg ?
|
||||
<img src={i.headImg} alt=""/>
|
||||
:
|
||||
<DefaultImg name="GitLink" title={details && details.name} />
|
||||
}
|
||||
<div style={{flex:1,width:0}}>
|
||||
<Link to={`/zone/${deptId}/newdetail/${i.id}`} className={`sub_name task-hide`}>{i.name}</Link>
|
||||
<p className={`sub_desc task-hide-2`}>
|
||||
{i.summary}
|
||||
</p>
|
||||
<div className="sub_info">
|
||||
<span><img src={shijian} alt="" />{i.publishTime}</span>
|
||||
<span><img src={liulan} alt="" />{i.visits}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
})
|
||||
}
|
||||
{
|
||||
mainList && mainList.length === 0 &&
|
||||
<div style={{display:"flex",justifyContent:"center",alignItems:"center",flexDirection:"column",height:500}}>
|
||||
<img src={ temp === tempEnum.zone1 ? nodata : emptydata } alt="" width="300"/>
|
||||
<p className="font-15 color-grey-6 mt20">暂无数据~</p>
|
||||
</div>
|
||||
}
|
||||
{
|
||||
total > pageSize &&
|
||||
<div style={{padding:"25px 0px"}}>
|
||||
<Pagination current={pageNum} pageSize={pageSize} total={total} showQuickJumper onChange={p=>{setPageNum(p)}}/>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</Spin>
|
||||
// </LongWidth>
|
||||
/* {
|
||||
hostList && hostList.length>0 &&
|
||||
<div className="short_width">
|
||||
<Hot title="热门领域资讯" list={hostList} />
|
||||
</div>
|
||||
} */
|
||||
/* </div>
|
||||
</Box>
|
||||
</div> */
|
||||
// </div>
|
||||
)
|
||||
}
|
||||
export default NewsList;
|
|
@ -0,0 +1,182 @@
|
|||
import React , { useEffect , useState } from 'react';
|
||||
import Banner from '../Component/publicBanner';
|
||||
import { Box , LongWidth } from '../../Component/layout';
|
||||
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 nodata from '../img/nodata.png';
|
||||
import { tempEnum } from '../tempInfo';
|
||||
|
||||
const { Search } = Input;
|
||||
|
||||
function ProjectSource(props){
|
||||
const { deptId } = props.match.params;
|
||||
const [ typeId , setTypeId ] = useState(0);
|
||||
const [ typeList , setTypeList ] = useState(undefined);
|
||||
const [ lists , setLists ] = useState(undefined);
|
||||
const [ page, setPage ] = useState(1);
|
||||
const [ total , setTotal ] = useState(0);
|
||||
const pageSize = 20;
|
||||
const [ searchName , setSearchName ] = useState(undefined);
|
||||
const [ value , setValue ] = useState(undefined);
|
||||
const [ loading , setLoading ] = useState(false);
|
||||
const { id, temp } = props;
|
||||
|
||||
useEffect(()=>{
|
||||
if(id){
|
||||
getTypeList();
|
||||
}
|
||||
},[id])
|
||||
|
||||
useEffect(()=>{
|
||||
if(id){
|
||||
setLoading(true);
|
||||
getLists();
|
||||
}
|
||||
},[id,typeId,page,searchName])
|
||||
|
||||
function getLists(){
|
||||
getProjectsLists(id,{
|
||||
pageNum:page,
|
||||
name:searchName,
|
||||
pageSize,
|
||||
projectTypeId:typeId===0?undefined:typeId
|
||||
}).then(result=>{
|
||||
if(result){
|
||||
setLists(result.data.rows);
|
||||
setTotal(result.data.total);
|
||||
setLoading(false);
|
||||
}
|
||||
}).catch(error=>{})
|
||||
}
|
||||
|
||||
|
||||
function getTypeList(){
|
||||
getProjectsTypeLists(id).then(result=>{
|
||||
if(result){
|
||||
setTypeList(result.data.rows);
|
||||
}
|
||||
}).catch(error=>{})
|
||||
}
|
||||
const menu = (
|
||||
<Menu>
|
||||
<Menu.Item>更新时间排序</Menu.Item>
|
||||
<Menu.Item>创建时间排序</Menu.Item>
|
||||
<Menu.Item>fork数量排序</Menu.Item>
|
||||
<Menu.Item>点赞数量排序</Menu.Item>
|
||||
</Menu>
|
||||
)
|
||||
|
||||
function changeValue(e){
|
||||
if(!e.target.value && e.target.value !==value){
|
||||
setSearchName(e.target.value);
|
||||
}
|
||||
setValue(e.target.value);
|
||||
}
|
||||
return(
|
||||
<div className="in_pro">
|
||||
{/* <Banner {...props}/> */}
|
||||
<div className="boxmain" style={{paddingTop:"56px"}}>
|
||||
<p className="in_title">开源项目</p>
|
||||
{ temp === tempEnum.zone1 && <p className="project_sub_title">聚合开源特色项目,搭建硬件开源服务桥梁</p> }
|
||||
<Box>
|
||||
<ul className="in_pro_menu">
|
||||
<li className="u_t"><i className="iconfont icon-muluicon font-15 mr10 mt2" style={{color:"#1f2329"}} />项目分类</li>
|
||||
<li className={0 === typeId ? "active":""} onClick={()=>{setTypeId(0)}}>全部分类</li>
|
||||
{
|
||||
typeList && typeList.length>0 &&
|
||||
typeList.map((i,k)=>{
|
||||
return(
|
||||
<li className={i.id === typeId ? "active":""} onClick={()=>{setTypeId(i.id);window.scrollTo(0,400)}}>{i.name}</li>
|
||||
)
|
||||
})
|
||||
}
|
||||
</ul>
|
||||
<LongWidth>
|
||||
<div className="in_list">
|
||||
<div className="in_list_menu">
|
||||
<Search
|
||||
value={value}
|
||||
onChange={changeValue}
|
||||
onSearch={()=>{setSearchName(value)}}
|
||||
allowClear={true}
|
||||
size={'large'}
|
||||
placeholder="请输入项目名称"
|
||||
style={{width:645}}
|
||||
enterButton={<span><i className="iconfont icon-sousuo5 font-15"/>搜索</span>}
|
||||
/>
|
||||
{/* <Dropdown overlay={menu} placement={"bottomRight"}>
|
||||
<a className="color-blue" style={{display:'flex',alignItems:'center'}}>排序<i className="iconfont icon-sanjiaoxing-down ml5"></i></a>
|
||||
</Dropdown> */}
|
||||
</div>
|
||||
<Spin spinning={loading}>
|
||||
<div className={`in_list_box ${total>pageSize ?"in_box_line":""}`}>
|
||||
{
|
||||
lists && lists.length>0 ?
|
||||
lists.map((i,k)=>{
|
||||
return(
|
||||
<div>
|
||||
{i.projectProperties && <img src={i.projectProperties.authorImageUrl} alt="" className="author_img"/> }
|
||||
<div style={{flex:"1"}}>
|
||||
<p className="in_b_main">
|
||||
<a onClick={()=>window.open(i.projectURL)}>{i.projectProperties && i.projectProperties.name}</a>
|
||||
{
|
||||
i.projectProperties &&
|
||||
<ul>
|
||||
{/* <li><i className="iconfont icon-guanzhuicon mr4"></i>333</li> */}
|
||||
{ i.projectProperties.praisesCount > 0 && <li><i className="iconfont icon-xingzhuang font-15 mr4"></i>{i.projectProperties.praisesCount}</li> }
|
||||
{ i.projectProperties.forkedCount > 0 && <li><i className="iconfont icon-morenfuke_icon1 font-16 mr4"></i>{i.projectProperties.forkedCount}</li> }
|
||||
</ul>
|
||||
}
|
||||
</p>
|
||||
{
|
||||
i.projectProperties && i.projectProperties.description &&
|
||||
<div className="in_b_desc task-hide-2">
|
||||
{i.projectProperties.description}
|
||||
</div>
|
||||
}
|
||||
{
|
||||
i.projectProperties && i.projectProperties.topics &&
|
||||
<ul className="in_b_tag">
|
||||
{
|
||||
i.projectProperties.topics.split(",").map(t=>{
|
||||
return(
|
||||
<li>{t}</li>
|
||||
)
|
||||
})
|
||||
}
|
||||
</ul>
|
||||
}
|
||||
<ul className="in_b_infos">
|
||||
{/* { i.deptName && <li className="infos_cate">{i.deptName}</li> } */}
|
||||
{ i.projectType && <li className={`infos_cate ${ i.projectProperties && i.projectProperties.language && 'show_after' }`}>{i.projectType}</li> }
|
||||
{ i.projectProperties && i.projectProperties.language && <li className=" infos_language">{i.projectProperties.language}</li> }
|
||||
{ i.projectProperties && i.projectProperties.timeAgo && <li><i className="iconfont icon-a-31shijian font-13 mr3"></i> 更新于{i.projectProperties.timeAgo}</li>}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
})
|
||||
:""
|
||||
}
|
||||
{
|
||||
lists && lists.length === 0 && (temp === tempEnum.zone1 ? <Nodata _html="暂无数据" img={ nodata }/> : <Nodata _html="暂无数据" />)
|
||||
}
|
||||
</div>
|
||||
</Spin>
|
||||
{
|
||||
total > pageSize &&
|
||||
<div style={{padding:"30px 0px",textAlign:"right"}}>
|
||||
<Pagination pageSize={pageSize} current={page} onChange={(page)=>{setPage(page);window.scrollTo(0,0)}} total={total} showQuickJumper/>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</LongWidth>
|
||||
</Box>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
export default ProjectSource;
|
|
@ -0,0 +1,144 @@
|
|||
import React , { useState , useEffect } from 'react';
|
||||
import Crown from '../img/crown.png';
|
||||
import Nodata from '../../Nodata';
|
||||
import { Link } from 'react-router-dom';
|
||||
import { Spin, Button, Icon } from 'antd';
|
||||
import { tempConfig, tempEnum } from '../tempInfo'
|
||||
import MemberApply from '../Component/memberApply';
|
||||
import { getVIPLists, getAuditStatus, applyJoin } from '../api';
|
||||
import nodata from '../img/nodata.png';
|
||||
|
||||
import '../indexZone1.scss';
|
||||
|
||||
const memberStatusEnum = {
|
||||
applying: '0',
|
||||
isMember: '1',
|
||||
notMember: '2'
|
||||
}
|
||||
|
||||
function ZoneVIP(props){
|
||||
const { deptId } = props.match.params;
|
||||
const [ vipLists , setVIPLists ] = useState(undefined);
|
||||
const [ isSpin , setIsSpin ] = useState(true);
|
||||
const [ applyVisible , setApplyVisible ] = useState(false);
|
||||
const [ memberStatus , setMemberStatus] = useState(memberStatusEnum.notMember);
|
||||
const { id, showNotification, checkIfLogin, showLoginDialog, temp } = props;
|
||||
|
||||
useEffect(()=>{
|
||||
if(id){
|
||||
setIsSpin(true);
|
||||
getLists();
|
||||
getMemberStatus();
|
||||
}
|
||||
},[id])
|
||||
|
||||
function getLists(){
|
||||
getVIPLists(id).then(response=>{
|
||||
if(response){
|
||||
setVIPLists(response.data.rows);
|
||||
setIsSpin(false);
|
||||
}
|
||||
}).catch(error=>{setIsSpin(false);})
|
||||
}
|
||||
|
||||
function getMemberStatus() {
|
||||
getAuditStatus(id).then(res => {
|
||||
console.log(res)
|
||||
if (res && res.data && res.data.code === 200) {
|
||||
setMemberStatus(res.data.data)
|
||||
} else {
|
||||
setMemberStatus(memberStatusEnum.notMember)
|
||||
}
|
||||
}).catch(() => { setMemberStatus(memberStatusEnum.notMember) })
|
||||
}
|
||||
|
||||
function onOk(e) {
|
||||
applyJoin(id, e).then(res => {
|
||||
if (res && res.data) {
|
||||
showNotification(res.data.msg)
|
||||
setApplyVisible(!applyVisible)
|
||||
if (res.data.code === 200) {
|
||||
setMemberStatus(memberStatusEnum.applying)
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
function apply() {
|
||||
if(checkIfLogin()===false){
|
||||
showLoginDialog()
|
||||
return false;
|
||||
}
|
||||
setApplyVisible(!applyVisible)
|
||||
}
|
||||
|
||||
return(
|
||||
<div className={`boxmain ${temp}_VIP_box`}>
|
||||
<p className="in_title">{ tempConfig[temp].member }</p>
|
||||
<p className="vip_sub_title">{ tempConfig[temp].vipDesc }</p>
|
||||
{ memberStatus === memberStatusEnum.notMember && <Button className="apply_button" onClick={ apply }>申请加入</Button> }
|
||||
{ memberStatus === memberStatusEnum.applying && <div className="mt20 tips" ><Icon type="check-circle" theme="filled" />您的申请已提交,请耐心等待管理员审核!</div> }
|
||||
<MemberApply visible={applyVisible} onOk={ onOk } onCancel={() => setApplyVisible(!applyVisible)} current_user={props.current_user}/>
|
||||
|
||||
<Spin spinning={isSpin}>
|
||||
<div style={{minHeight:400}}>
|
||||
{
|
||||
vipLists && vipLists.length> 0 &&
|
||||
<div className="vip_list">
|
||||
{
|
||||
vipLists.map((i,k)=>{
|
||||
return(
|
||||
<div className="vip_list_card">
|
||||
<div className="card_title">
|
||||
<img src={Crown} alt="" width="37px" style={{marginBottom:5,marginRight:5}}/>
|
||||
<div>
|
||||
<div>
|
||||
{i.typeName}
|
||||
</div>
|
||||
{ temp === tempEnum.zone1 && <div className="linear_gradient">{i.typeName}</div> }
|
||||
</div>
|
||||
</div>
|
||||
<p className="card_desc">{i.typeIntroduction}</p>
|
||||
{
|
||||
i.zoneMemberList && i.zoneMemberList.length > 0 ?
|
||||
<ul className="card_ul">
|
||||
{
|
||||
i.zoneMemberList.map((j,key)=>{
|
||||
return(
|
||||
|
||||
<li className="card_u_li">
|
||||
<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>
|
||||
)
|
||||
})
|
||||
}
|
||||
</ul>
|
||||
:
|
||||
(
|
||||
temp === tempEnum.zone1 ? <Nodata _html="暂无数据" img={ nodata }/> : <Nodata _html="暂无数据" />
|
||||
)
|
||||
}
|
||||
</div>
|
||||
)
|
||||
})
|
||||
}
|
||||
</div>
|
||||
}
|
||||
{
|
||||
vipLists && vipLists.length === 0 &&
|
||||
<div style={{marginTop:30,backgroundColor:"#fff",padding:"20px"}}>
|
||||
<Nodata _html={"暂无数据"}/>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</Spin>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
export default ZoneVIP;
|
|
@ -0,0 +1,101 @@
|
|||
|
||||
import fetch from './fetch';
|
||||
|
||||
/**入口页接口***/
|
||||
export function getMainInfos(deptId, params) {
|
||||
return fetch({
|
||||
url: `/zone/open/zoneKey/${deptId}`,
|
||||
method: 'get',
|
||||
params
|
||||
});
|
||||
}
|
||||
|
||||
export function getCheckZoneRole(id) {
|
||||
return fetch({
|
||||
url: `/zone/open/zone/${id}/checkZoneRole`,
|
||||
method: 'get',
|
||||
});
|
||||
}
|
||||
|
||||
/********首页接口******/
|
||||
export function getHomePageList(id) {
|
||||
return fetch({
|
||||
url: `/zone/open/${id}/member/homePageList`,
|
||||
method: 'get',
|
||||
});
|
||||
}
|
||||
|
||||
export function gethomePageDocList(id) {
|
||||
return fetch({
|
||||
url: `/cms/doc/open/zone/${id}/homePageDocList`,
|
||||
method: 'get',
|
||||
});
|
||||
}
|
||||
export function getAllList(id,params){
|
||||
return fetch({
|
||||
url:`/zone/open/${id}/project/list`,
|
||||
method: 'get',
|
||||
params
|
||||
})
|
||||
}
|
||||
|
||||
/**领域资讯 */
|
||||
export function getNewsAllList(id,params){
|
||||
return fetch({
|
||||
url:`/cms/doc/open/zone/${id}/docOverviewList`,
|
||||
method: 'get',
|
||||
params
|
||||
})
|
||||
}
|
||||
export function getNewsHotList(id,params){
|
||||
return fetch({
|
||||
url:`/cms/doc/open/zone/${id}/hotDocList`,
|
||||
method: 'get',
|
||||
params
|
||||
})
|
||||
}
|
||||
export function getNewsDetail(id){
|
||||
return fetch({
|
||||
url:`/cms/doc/open/${id}`,
|
||||
method: 'get',
|
||||
})
|
||||
}
|
||||
|
||||
/**开源项目 */
|
||||
export function getProjectsLists(id,params){
|
||||
return fetch({
|
||||
url:`/zone/open/${id}/project/list`,
|
||||
method: 'get',
|
||||
params
|
||||
})
|
||||
}
|
||||
export function getProjectsTypeLists(id){
|
||||
return fetch({
|
||||
url:`/zone/open/${id}/projectType/list`,
|
||||
method: 'get',
|
||||
})
|
||||
}
|
||||
/**专区会员 */
|
||||
export function getVIPLists(id){
|
||||
return fetch({
|
||||
url:`/zone/open/${id}/member/overviewList`,
|
||||
method: 'get',
|
||||
})
|
||||
}
|
||||
|
||||
/**会员申请状态 */
|
||||
export function getAuditStatus(id){
|
||||
return fetch({
|
||||
url:`/zone/member/zone/${id}/auditStatus`,
|
||||
method: 'get',
|
||||
})
|
||||
}
|
||||
|
||||
/**会员申请状态 */
|
||||
export function applyJoin(id,data) {
|
||||
return fetch({
|
||||
url: `/zone/member/applyToJoin/zone/${id}`,
|
||||
method: 'post',
|
||||
data: data
|
||||
});
|
||||
}
|
|
@ -0,0 +1,44 @@
|
|||
import axios from 'axios';
|
||||
import { message , notification } from 'antd';
|
||||
|
||||
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';
|
||||
|
||||
const service = beforeFetch(actionUrl);
|
||||
export const httpUrl = actionUrl;
|
||||
export default service;
|
After Width: | Height: | Size: 249 KiB |
After Width: | Height: | Size: 145 KiB |
After Width: | Height: | Size: 177 KiB |
After Width: | Height: | Size: 146 KiB |
After Width: | Height: | Size: 172 KiB |
After Width: | Height: | Size: 9.2 KiB |
After Width: | Height: | Size: 6.4 KiB |
After Width: | Height: | Size: 26 KiB |
After Width: | Height: | Size: 26 KiB |
After Width: | Height: | Size: 25 KiB |
After Width: | Height: | Size: 31 KiB |
After Width: | Height: | Size: 152 KiB |
After Width: | Height: | Size: 6.7 KiB |
After Width: | Height: | Size: 6.1 KiB |
After Width: | Height: | Size: 94 KiB |
After Width: | Height: | Size: 246 KiB |
After Width: | Height: | Size: 777 B |
After Width: | Height: | Size: 202 B |
After Width: | Height: | Size: 370 B |
After Width: | Height: | Size: 1.3 MiB |
After Width: | Height: | Size: 538 KiB |
After Width: | Height: | Size: 5.9 KiB |
After Width: | Height: | Size: 7.9 KiB |
After Width: | Height: | Size: 7.3 KiB |
After Width: | Height: | Size: 7.8 KiB |
After Width: | Height: | Size: 398 B |
After Width: | Height: | Size: 5.4 MiB |
After Width: | Height: | Size: 1.8 KiB |
After Width: | Height: | Size: 1.6 KiB |
After Width: | Height: | Size: 511 KiB |
After Width: | Height: | Size: 47 KiB |
After Width: | Height: | Size: 747 KiB |
After Width: | Height: | Size: 64 KiB |
After Width: | Height: | Size: 16 KiB |
After Width: | Height: | Size: 6.1 KiB |
After Width: | Height: | Size: 6.1 KiB |
After Width: | Height: | Size: 621 B |
After Width: | Height: | Size: 347 B |
After Width: | Height: | Size: 542 KiB |
After Width: | Height: | Size: 12 KiB |
After Width: | Height: | Size: 21 KiB |
After Width: | Height: | Size: 19 KiB |
After Width: | Height: | Size: 21 KiB |
After Width: | Height: | Size: 21 KiB |
After Width: | Height: | Size: 20 KiB |
After Width: | Height: | Size: 18 KiB |
After Width: | Height: | Size: 26 KiB |
After Width: | Height: | Size: 20 KiB |
After Width: | Height: | Size: 7.3 KiB |
After Width: | Height: | Size: 9.1 KiB |
After Width: | Height: | Size: 6.8 KiB |
After Width: | Height: | Size: 6.0 KiB |
After Width: | Height: | Size: 3.4 KiB |
After Width: | Height: | Size: 1.7 KiB |
After Width: | Height: | Size: 1.8 KiB |
After Width: | Height: | Size: 1.6 KiB |
After Width: | Height: | Size: 5.4 KiB |
After Width: | Height: | Size: 3.1 KiB |
|
@ -0,0 +1,147 @@
|
|||
import React ,{ useEffect , useState } from "react";
|
||||
|
||||
import { Route, Switch } from "react-router-dom";
|
||||
import { withRouter } from "react-router";
|
||||
|
||||
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 { getMainInfos , getCheckZoneRole } from './api';
|
||||
import PublicBanner from "./Component/publicBanner";
|
||||
import './index.scss';
|
||||
import "slick-carousel/slick/slick.css";
|
||||
import "slick-carousel/slick/slick-theme.css";
|
||||
import { tempEnum } from "./tempInfo";
|
||||
|
||||
const VIP = Loadable({
|
||||
loader: () => import("./Pages/zoneVIP"),
|
||||
loading: Loading,
|
||||
});
|
||||
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,
|
||||
});
|
||||
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 , setTemp ] = useState(tempEnum.zone);
|
||||
|
||||
useEffect(()=>{
|
||||
if(deptId){
|
||||
getDetail();
|
||||
}
|
||||
},[deptId])
|
||||
|
||||
useEffect(() => {
|
||||
setTheme()
|
||||
}, [temp])
|
||||
|
||||
function setTheme() {
|
||||
document.getElementsByTagName("html")[0].dataset.theme = temp;
|
||||
}
|
||||
setTheme()
|
||||
|
||||
function getDetail(){
|
||||
getMainInfos(deptId).then(result=>{
|
||||
if(result){
|
||||
if (result.data.code === 404) {
|
||||
props.history.push('/nopage');
|
||||
return
|
||||
}
|
||||
let data = result.data.data;
|
||||
if (data.template) {
|
||||
setTemp( data.template )
|
||||
}
|
||||
setData(data);
|
||||
document.title= data && data.name;
|
||||
setId(data.id);
|
||||
if(data.id){
|
||||
getAdminUrl(data.id);
|
||||
}
|
||||
}
|
||||
}).catch(console.error())
|
||||
}
|
||||
|
||||
function getAdminUrl(id){
|
||||
getCheckZoneRole(id).then(response=>{
|
||||
if(response && response.data.data){
|
||||
setAdminUrl(response.data.data);
|
||||
}else{
|
||||
setAdminUrl(undefined);
|
||||
}
|
||||
}).catch(error=>{})
|
||||
}
|
||||
return(
|
||||
<div className="information_main">
|
||||
{ id ? <PublicBanner {...props} data={data} temp={ temp } adminUrl={adminUrl}/> : <div style={{ width: '100%', height: '450px' }}></div>}
|
||||
<Switch>
|
||||
<Route
|
||||
path="/zone/:deptId/news/:cateId"
|
||||
render={(p) => (
|
||||
<Main {...props} {...p} id={id} temp={ temp }/>
|
||||
)}
|
||||
></Route>
|
||||
<Route
|
||||
path="/zone/:deptId/newdetail/:id"
|
||||
render={(p) => (
|
||||
<NewsDetail {...props} {...p} id={id} temp={ temp }/>
|
||||
)}
|
||||
></Route>
|
||||
<Route
|
||||
path="/zone/:deptId/VIP"
|
||||
render={(p) => (
|
||||
<VIP {...props} {...p} id={id} temp={ temp }/>
|
||||
)}
|
||||
></Route>
|
||||
<Route
|
||||
path="/zone/:deptId/projects"
|
||||
render={(p) => (
|
||||
<ProjectSource {...props} {...p} id={id} temp={ temp }/>
|
||||
)}
|
||||
></Route>
|
||||
<Route
|
||||
path="/zone/:deptId/news"
|
||||
render={(p) => (
|
||||
<Main {...props} {...p} id={id} temp={ temp }/>
|
||||
)}
|
||||
></Route>
|
||||
<Route
|
||||
path="/zone/:deptId"
|
||||
render={(p) => (
|
||||
temp === tempEnum.zone ? <HeaderPage {...props} {...p} data={data} id={id} temp={ temp }/> : <HeaderPageZone1 {...props} {...p} data={data} id={id} temp={ temp }/>
|
||||
)}
|
||||
></Route>
|
||||
</Switch>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
export default withRouter((CNotificationHOC()(SnackbarHOC()(TPMIndexHOC(Index))))
|
||||
);
|
|
@ -0,0 +1,648 @@
|
|||
@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: contain;
|
||||
}
|
||||
.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;
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
}
|
||||
}
|
||||
.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: 0.8;
|
||||
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;
|
||||
margin-top: 18px;
|
||||
min-height: 56px;
|
||||
}
|
||||
.zone_n_value{
|
||||
margin-top: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
height: 20px;
|
||||
line-height: 13px;
|
||||
}
|
||||
.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: flex-end;
|
||||
margin: 0 auto;
|
||||
& > div:not(:first-child) {
|
||||
margin-left: 70px;
|
||||
}
|
||||
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;
|
||||
z-index: 100;
|
||||
}
|
||||
.slick-track {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 435px;
|
||||
.slick-slide {
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
.less_three_project {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
.container {
|
||||
.zone_p_item {
|
||||
background: #fefefe;
|
||||
}
|
||||
margin: 10px;
|
||||
}
|
||||
}
|
||||
.not_three_project {
|
||||
.slick-track {
|
||||
.slick-slide[aria-hidden="true"] {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
.slick-current {
|
||||
z-index: 100;
|
||||
}
|
||||
.slick-current .zone_p_item {
|
||||
width:364px;
|
||||
height:395px;
|
||||
background:#fefefe;
|
||||
}
|
||||
.zone_p_item {
|
||||
width: 364px;
|
||||
height: 320px;
|
||||
border-radius:16px;
|
||||
padding: 42px 42px 35px 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 {
|
||||
font-weight: 700;
|
||||
color: #1f2329;
|
||||
font-size: 16px;
|
||||
text-align: center;
|
||||
margin-top: 20px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.z_p_desc{
|
||||
margin-top: 18px;
|
||||
color:#4c5876;
|
||||
font-size:14px;
|
||||
line-height:22px;
|
||||
word-break: break-all;
|
||||
-webkit-line-clamp: 5
|
||||
}
|
||||
}
|
||||
.zone_p_item:hover {
|
||||
.z_p_title {
|
||||
color: #07a583;
|
||||
}
|
||||
}
|
||||
}
|
||||
.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;
|
||||
max-width: 240px;
|
||||
}
|
||||
.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%;
|
||||
.in_title {
|
||||
img {
|
||||
width: 378px;
|
||||
}
|
||||
}
|
||||
.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;
|
||||
}
|
||||
}
|
||||
}
|
||||
.zone1_VIP_box{
|
||||
padding:50px 0px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
.in_title{
|
||||
font-size: 38px;
|
||||
}
|
||||
.vip_sub_title{
|
||||
margin-top: 25px;
|
||||
color: #1f2329;
|
||||
font-size: 17px;
|
||||
line-height: 27px;
|
||||
text-align: center;
|
||||
}
|
||||
.vip_list{
|
||||
margin-top: 50px;
|
||||
padding-top: 1px;
|
||||
padding-bottom: 35px;
|
||||
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: 500;
|
||||
div {
|
||||
div:nth-child(1) {
|
||||
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;
|
||||
}
|
||||
div:not(:nth-child(1)) {
|
||||
text-shadow: 0 1px 0 #fed5a6;
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
}
|
||||
.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,19 @@
|
|||
export const tempEnum = {
|
||||
zone: 'zone',
|
||||
zone1: 'zone1'
|
||||
}
|
||||
export const tempConfig = {
|
||||
zone: {
|
||||
mainTitle: '领域资讯',
|
||||
hotTitle: '热门资讯',
|
||||
member: '专区会员',
|
||||
vipDesc: '社区根据您的贡献与扮演角色将用户划分成为不同的人员团队,并构建会员成长体系。您有兴趣成为会员,尽情发挥创意与智慧,与专区共同成长吗?',
|
||||
},
|
||||
zone1: {
|
||||
mainTitle: '新闻资讯',
|
||||
hotTitle: '热门新闻资讯',
|
||||
member: '荣誉榜单',
|
||||
vipDesc: '荣誉榜单记录用户在开源芯片社区的社区角与成长进度,欢迎广大用户参与到开源芯片项目,与社区共同成长!',
|
||||
}
|
||||
}
|
||||
|