diff --git a/src/forge/Information/Pages/headerPagebyCCF.jsx b/src/forge/Information/Pages/headerPagebyCCF.jsx new file mode 100644 index 00000000..f1c52bb3 --- /dev/null +++ b/src/forge/Information/Pages/headerPagebyCCF.jsx @@ -0,0 +1,265 @@ +import React, { useState, useEffect } from 'react'; +import img1 from '../img/img1.png'; +import { httpUrl } from '../fetch'; +import { Link } from 'react-router-dom'; +import shijian from '../img/shijian.png'; +import { getHomePageList, gethomePageDocList, getAllList, getNewsAllList } from '../api'; +import axios from 'axios'; +import Partner from '../Component/partner'; +import '../indexZonebyCCF.scss'; +import "slick-carousel/slick/slick.css"; +import "slick-carousel/slick/slick-theme.css"; +import Slider from 'react-slick'; +import Left from '../../../home/Img/left.png'; +import Right from '../../../home/Img/right.png'; + +const setting = { + dots: true, + infinite: true, + speed: 2000, + slidesToShow: 1, + slidesToScroll: 1, + pauseOnDotsHover: true, + autoplaySpeed: 5000, + pauseOnFocus: true, + autoplay: true, + arrows: true, + prevArrow: , + nextArrow: +} + +function HeaderPageCCF(props) { + const [projectList, setProjectList] = useState(undefined); + const [personList, setPersonList] = useState(undefined); + const [newsList, setNewsList] = useState(undefined); + const [partnerList, setParterList] = useState(undefined); + const { deptId, cateId } = props.match.params; + const { data, id, temp } = props; + const [mainList, setMainList] = useState(undefined); + + useEffect(() => { + if (id) { + getProjectList(); + getNewsList(); + getPersonList(); + getPartnerList(); + getMainList(); + } + }, [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 => { }) + } + function getMainList() { + getNewsAllList(id).then(result => { + if (result) { + let rows = result.data.rows; + setMainList(rows); + } + }).catch(error => { }) + } + return ( +
+ { + // 新闻动态 + data && data.cmsShow === 1 && newsList && newsList.length >= 0 && +
+

{data.homepageCmsTitle}

+
+
+ + { + newsList && newsList.length > 0 ? + newsList.map((i, k) => { + return ( +
+ +
+ 点击图片了解更多 +
+
+ ) + }) + : + "" + } + +
+
    + { + newsList.map((i, k) => { + return ( +
  • + {i.name} +

    + + + {i.publishTime} + + +

    {i.visits}

    +

    +
    • + ) + }) + } +
+
+ {/* 图片下三个栏目 */} +
+ { + mainList && mainList.length > 0 ? + mainList.map((i, k) => { + if (i.name === "开源业内资讯" || i.name === "开源战略工作组" || i.name === "开源活动") + return ( +
    +

    {i.name}

    + { + i.cmsDocList && i.cmsDocList.length > 0 ? + i.cmsDocList.map((j, k) => { + return ( +
  • + {j.name} +
    • + ) + }) + : "" + } +
+ ) + }) + : + "" + } +
+
+ } + { + // 精选项目 + data && data.projectShow === 1 && projectList && projectList.length > 0 && +
+

{data.homepageProjectTitle}

+ { +
+ { + projectList.map((i, k) => { + return ( +
  • +
    {i.projectProperties && i.projectProperties.authorImageUrl && }
    +
    + window.open(i.projectURL)} className="z_p_title task-hide">{i.projectProperties && i.projectProperties.name} +

    {i.projectProperties && i.projectProperties.description ? i.projectProperties.description : "暂无~"}

    +
    + { + i.projectProperties.topics && +
      + { + i.projectProperties.topics.split(",").map(t => { + return ( +
    • {t}
      • + ) + }) + } +
    + } +
    +
    +
    • + ) + }) + } +
    + } +
    + } + {data &&

    {data.firstTitle}

    } + { + // 专区简介 + data && (data.introductionTitle || data.introductionContent || data.introductionImage) && +
    +
    + {data.introductionTitle &&

    {data.introductionTitle}

    } +

    +
    + { + data.introductionImage && + + } +
    + } + { + // 核心贡献者 + data && data.memberShow === 1 && personList && personList.length > 0 && +
    +

    {data.homepageMemberTitle}

    + { + + } +
    + } + + + { + // 合作伙伴 + data && data.partnersShow === 1 && partnerList && partnerList.length > 0 && +
    +

    {data.homepagePartnersTitle}

    + +
    + } +
    + ) +} +export default HeaderPageCCF; \ No newline at end of file diff --git a/src/forge/Information/index.jsx b/src/forge/Information/index.jsx index 6c689769..053b07ad 100644 --- a/src/forge/Information/index.jsx +++ b/src/forge/Information/index.jsx @@ -39,6 +39,11 @@ const HeaderPageZone1 = Loadable({ loading: Loading, }); +const HeaderPageCCF = Loadable({ + loader : () => import("./Pages/headerPagebyCCF"), + loading : Loading, +}); + const ProjectSource = Loadable({ loader: () => import("./Pages/projectSource"), loading: Loading, @@ -171,6 +176,7 @@ function Index(props){ ( + deptId==="CCF-ODC"?: temp === tempEnum.zone ? : )} > diff --git a/src/forge/Information/indexZonebyCCF.scss b/src/forge/Information/indexZonebyCCF.scss new file mode 100644 index 00000000..bb3ea37d --- /dev/null +++ b/src/forge/Information/indexZonebyCCF.scss @@ -0,0 +1,215 @@ +@import './theme.scss'; +.zone_news{ + margin-top: -10px !important; + .zone_new_first{ + background-color: #fff; + padding:0px !important; + flex:1; + border-radius: 4px; + width: 0; + .slick-track{ + margin-top: 20px; + display: flex; + height: 100%; + .slick-slide{ + position: relative; + height:100%; + div{ + height: 100%; + .regform{ + img{ + position: relative; + z-index: 1; + top: 30px; + } + .detail{ + overflow: hidden; + z-index: 1000; + position: relative; + top: -100px; + left: 300px; + width: 210px; + background:linear-gradient(to right,rgb(0, 234, 255),rgb(55, 255, 0)); + font-size: 18px; + font-weight: bold; + text-align: center; + padding: 10px; + text-indent: 20px; + } + } + } + } + } + .slick-slider{ + &:hover{ + .slick-arrow{ + display: block!important; + cursor: pointer; + z-index: 2; + } + } + .slick-arrow{ + width: 50px; + height: 50px; + position: absolute; + z-index: 1000; + display: none!important; + background: transparent; + &:hover{ + i{ + color: rgba(225,225,225,0.8); + } + } + i{ + font-size: 50px!important; + color: rgba(225,225,225,0.3); + transition: 0.3s; + } + &.slick-prev{ + left: 10px; + } + &.slick-next{ + right: 10px; + } + } + .slick-dots{ + width: 260px; + text-align: left; + left: 50%; + margin-left: -115px; + bottom: 15%; + position: absolute; + display: flex!important; + z-index: 2; + li{ + background-color: rgba(225,225,225,0.5); + position: relative; + height: 3px; + width: 46px; + margin-right: 15px; + &::after{ + position: absolute; + left: 0px; + width: 0px; + top:0px; + height: 100%; + content: ""; + transition: 5.2s; + transition-property: width; + } + &.slick-active::after{ + background-color: #fff; + width: 100%; + } + button{ + position: absolute; + width: 100%; + height: 10px; + left:0px; + background-color: transparent!important; + border:none; + cursor: pointer; + color: transparent; + &::before { + content: ""; + } + } + } + } + } + } + .zone_new_three{ + margin-left: 30px; + display: flex; + flex-direction: column; + .zone_n_value{ + margin-top: 50px; + .photo{ + margin-bottom: 3px; + } + } + &.spaceeTween{ + justify-content: space-between; + } + &.flexStart{ + justify-content: flex-start; + li{ + margin-bottom: 30px; + } + } + li{ + background-color: #fff; + width: 385px; + padding: 10px !important; + border-radius: 4px; + margin-bottom: 30px; + &:last-child{ + margin-bottom: 0px; + } + } + } + .List{ + margin-bottom: 20px; + .mainlist{ + display: inline-block; + width: 360px; + background-color: #fff; + overflow: hidden; + margin: 30px 40px 0px 10px; + word-break: break-all; + padding: 10px; + p{ + left: 10px !important; + .you{ + float: right; + } + left: 5px; + font-weight: bold; + } + li{ + margin-left: 10px; + list-style: inside; + } + } + } +} +.zone_projects{ + .zone_p_lists{ + li{ + padding: 25px 30px !important; + height: 170px; + .z_p_language{ + .tag{ + display: flex; + align-items: center; + margin-bottom: 15px!important; + } + .tag_li{ + position: relative; + margin-right: 10px !important; + top: 10px !important; + border: 0px solid; + width: auto; + height:24px; + text-align: center; + line-height:21px; + background-color:var(--tag-back); + border-radius:2px; + margin-right: 12px; + color: var(--primary-color); + font-size:13px; + padding:0px 7px !important; + } + } + } + } +} +.in_title_a{ + height:44px; + line-height:44px; + font-weight:500; + color:#1f2329; + font-size:32px; + text-align:center; + margin-top: 40px; +} \ No newline at end of file