From 4a7ac0aa85b34c74c645e1213ee915ba04fd9097 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=BB=84=E5=BF=83=E5=AE=87?= Date: Wed, 21 Jun 2023 14:18:09 +0800 Subject: [PATCH] =?UTF-8?q?=E4=B8=93=E5=8C=BA=E9=81=97=E7=95=99=E9=9C=80?= =?UTF-8?q?=E6=B1=82?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- public/css/edu-purge.css | 10 +- public/index.html | 6 +- src/forge/Head/Header.js | 16 +- src/forge/Head/header.scss | 35 ++- .../Information/Component/TopEdition.jsx | 46 ++++ .../Information/Component/contributor.jsx | 2 +- src/forge/Information/Component/partner.jsx | 78 +++---- src/forge/Information/Component/projects.jsx | 4 +- .../Information/Component/publicBanner.jsx | 6 +- .../Information/Pages/headerPageZone1.jsx | 20 +- src/forge/Information/index.scss | 217 ++++++++++++------ 11 files changed, 293 insertions(+), 147 deletions(-) create mode 100644 src/forge/Information/Component/TopEdition.jsx diff --git a/public/css/edu-purge.css b/public/css/edu-purge.css index 08e32a02d..f01f1cee9 100644 --- a/public/css/edu-purge.css +++ b/public/css/edu-purge.css @@ -3966,17 +3966,19 @@ html>body #ajax-indicator { 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; + /* overflow: hidden; */ white-space: nowrap; - overflow-x: auto; + overflow-y: auto; + /* overflow-y: auto; */ display: flex; + padding-bottom: 250px; + margin-bottom: -250px; } .head-nav ul#header-nav li{ @@ -3984,11 +3986,11 @@ html>body #ajax-indicator { line-height: 58px; cursor: pointer; font-size: 16px; - padding-right:40px; } .head-nav ul#header-nav a { color: #fff; + margin: 0 20px; } .head-nav ul#header-nav li a:hover,.head-nav ul#header-nav li.active a { diff --git a/public/index.html b/public/index.html index be8e12f0f..f7820cf02 100755 --- a/public/index.html +++ b/public/index.html @@ -33,10 +33,10 @@ - + - - + + <%= htmlWebpackPlugin.tags.headTags %> diff --git a/src/forge/Head/Header.js b/src/forge/Head/Header.js index ccd9ba00c..c2a71b5e8 100644 --- a/src/forge/Head/Header.js +++ b/src/forge/Head/Header.js @@ -45,6 +45,7 @@ class NewHeader extends Component { visiblemyss: false, openSearch:false, visible:false, //浮动消息框展示控制 + showSubMenu: -1 } } componentDidMount() { @@ -273,6 +274,7 @@ class NewHeader extends Component { user, isRender, visible, + showSubMenu } = this.state; let search_url = settings && settings.common && settings.common.search; return ( @@ -301,7 +303,7 @@ class NewHeader extends Component { { settings && settings.nav_logo_url ? - + 可控开源社区 : @@ -318,8 +320,18 @@ class NewHeader extends Component { var waiLian = (new_link && str.filter(item=>new_link.indexOf(item)>-1) ); var wl = waiLian && waiLian.length>0; return ( -
  • +
  • { this.setState( {showSubMenu: key }) } } + onMouseOut={ () => { this.setState( {showSubMenu: -1 }) } } + > {item.name} +
    • ) }) diff --git a/src/forge/Head/header.scss b/src/forge/Head/header.scss index 64d4fb4dc..97272f675 100644 --- a/src/forge/Head/header.scss +++ b/src/forge/Head/header.scss @@ -363,4 +363,37 @@ color: #FFFFFF!important; background-color: #355CFF; } -} \ No newline at end of file +} + +.head-nav { + .pr { + justify-content: center; + } + .drop-down { + position: absolute; + 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%; + } + &:hover { + background-color: #ebf0ff; + } + // &:not(:last-child) { + // border-bottom: solid 1px #cccccc42; + // } + } + } +} diff --git a/src/forge/Information/Component/TopEdition.jsx b/src/forge/Information/Component/TopEdition.jsx new file mode 100644 index 000000000..e5e8be285 --- /dev/null +++ b/src/forge/Information/Component/TopEdition.jsx @@ -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: , + nextArrow: +} +function TopEdition(props) { + const { bannerList } = props + + + return( + + { + bannerList && bannerList.length > 0 ? + bannerList.map((i,k)=>{ + return( +
    +
    +
    + ) + }) + : +
    +
    + } +     + ) +} +export default TopEdition; \ No newline at end of file diff --git a/src/forge/Information/Component/contributor.jsx b/src/forge/Information/Component/contributor.jsx index d20823401..102a9ba26 100644 --- a/src/forge/Information/Component/contributor.jsx +++ b/src/forge/Information/Component/contributor.jsx @@ -36,7 +36,7 @@ function Contributor(props) { { showList.map((i,k)=>{ return( -
    +
    { i.name &&
    diff --git a/src/forge/Information/Component/partner.jsx b/src/forge/Information/Component/partner.jsx index 103ffd740..699d9f187 100644 --- a/src/forge/Information/Component/partner.jsx +++ b/src/forge/Information/Component/partner.jsx @@ -22,64 +22,44 @@ function Partner(props) { },[id]) function getUnit(array){ - const newArray = []; - for(let i = 0; i< array.length;) { - newArray.push(array.slice(i, i += 5)); + const newArray = array.map(e => { + if (e.zonePartnersList && e.zonePartnersList.length > 0) { + e.zonePartnersList[0].typeName = e.typeName + } + return e.zonePartnersList + }) + + while(newArray[1] && newArray[1].length + newArray[0].length <= 5) { + newArray[0] = [...newArray[0], ...newArray.splice(1, 1)] } + console.log(newArray) setTopics(newArray) } - function Init() { - let box = document.getElementById('scrollBox1'); - scrollUp(); - var myTimer = setInterval(scrollUp, 10); - // 鼠标移入container 元素上 清除定时器 停止滚动 - box.onmouseover = () => { - clearInterval(myTimer); - } - // 鼠标移出container 元素上 继续滚动 - // 60表示每隔60毫秒向上滚动一次 - box.onmouseout = () => { - myTimer = setInterval(scrollUp, 10); - } - } - - function scrollUp() { - let box = document.getElementById('scrollBox1'); - if(box){ - let con1 = document.getElementById('box1'); - if (box.scrollLeft >= con1.clientWidth) { - box.scrollLeft = 0; - } else { - box.scrollLeft++; - } - } - } - return( -
    +
      { topics && topics.length>0 ? - - { - topics.map((i, k)=>{ - return( -
      - { - i.map((j,k1)=>{ - return( + topics.map((i, k)=>{ + return( +
    • + { + i.map((j,k1)=>{ + return( +
      + { j.typeName && {j.typeName}} - ) - }) - } -
      - ) - }) - } - - :"" +
      • + ) + }) + } + + ) + }) + : + "" } -
    + ) } export default Partner; \ No newline at end of file diff --git a/src/forge/Information/Component/projects.jsx b/src/forge/Information/Component/projects.jsx index fcf7d6375..69ce2abca 100644 --- a/src/forge/Information/Component/projects.jsx +++ b/src/forge/Information/Component/projects.jsx @@ -49,7 +49,7 @@ function Projects(props) { (projectList.length < 3 ? projectList.map((i,k)=>{ return( -
    +
    {i.projectProperties && i.projectProperties.authorImageUrl && }

    window.open(i.projectURL)}>{i.projectProperties && i.projectProperties.name}

    @@ -63,7 +63,7 @@ function Projects(props) { { projectList.map((i,k)=>{ return( -
    +
    {i.projectProperties && i.projectProperties.authorImageUrl && }

    window.open(i.projectURL)}>{i.projectProperties && i.projectProperties.name}

    diff --git a/src/forge/Information/Component/publicBanner.jsx b/src/forge/Information/Component/publicBanner.jsx index e77a19036..6bb64b595 100644 --- a/src/forge/Information/Component/publicBanner.jsx +++ b/src/forge/Information/Component/publicBanner.jsx @@ -3,6 +3,7 @@ import { Menu } from 'antd'; import banner from '../img/mainbanner.png' import { Link } from 'react-router-dom'; import { tempConfig } from '../tempInfo'; +import TopEdition from './TopEdition' @@ -34,10 +35,11 @@ function PublicBanner(props){ },[pathname]) return( -
    +
    + { data && -
    +

    {data.mainTitle}

    {data.subTitle}

    diff --git a/src/forge/Information/Pages/headerPageZone1.jsx b/src/forge/Information/Pages/headerPageZone1.jsx index dd7aef2a9..209c29e7f 100644 --- a/src/forge/Information/Pages/headerPageZone1.jsx +++ b/src/forge/Information/Pages/headerPageZone1.jsx @@ -29,7 +29,7 @@ function HeaderPage(props){ const [ newsList, setNewsList ] = useState(undefined); const [ partnerList, setParterList ] = useState(undefined); const { deptId } = props.match.params; - const { data, id, temp } = props; + const { data, id, temp, history } = props; const vision = [ {imageUrl: vision0, title: '促进技术创新和应用', content: '通过开源硬件社区的建设，可以让更多的人参与到硬件开发中来，激发大众的创造力和创新精神，从而推动硬件领域的技术创新和实际应用。'}, @@ -132,7 +132,7 @@ function HeaderPage(props){ { vision.map((i, k) => { return ( -
    +
    @@ -169,8 +169,8 @@ function HeaderPage(props){ newsList.map((i,k)=>{ return( k > 0 && - -
  • +
    { history.push(`/zone/${deptId}/newdetail/${i.id}`) }}> +

  • {k + 1} {i.name} @@ -184,7 +184,7 @@ function HeaderPage(props){ 查看详情

    • - +
    ) }) } @@ -214,9 +214,9 @@ function HeaderPage(props){

    成为社区成员，尽情发挥您的创意

    { - communityInfo.map(i => { + communityInfo.map((i, k) => { return ( -
    +

    { i.level }

    { i.todo }

    @@ -237,7 +237,7 @@ function HeaderPage(props){ { growPathInfo.map((i, k) => { return ( -
    +
    { k % 2 === 1 &&
    }
    @@ -256,9 +256,9 @@ function HeaderPage(props){
    { - introDetail.map(i => { + introDetail.map((i, k) => { return ( -
    +

    { i.title } diff --git a/src/forge/Information/index.scss b/src/forge/Information/index.scss index b3c7e6c49..bb4e31f64 100644 --- a/src/forge/Information/index.scss +++ b/src/forge/Information/index.scss @@ -28,13 +28,17 @@ height: 450px; position: relative; padding-bottom: 88px; - &>div{ + .zone_content { + position: absolute; display: flex; width: 1200px; - margin: 0px auto; flex-direction: column; justify-content: center; height: 100%; + top: 0; + left: 50%; + transform: translate(-50%, 0); + padding-bottom: 88px; .main_t{ color:#78d0f5; font-size:40px; @@ -867,37 +871,6 @@ } } } - .zone_parter{ - background-color: #fff; - padding:70px 0px 90px; - .zone_part_lists{ - display: flex; - flex-wrap: wrap; - margin-top: 70px; - li{ - width: 170px; - height: 70px; - line-height: 70px; - margin-left: 36px; - margin-bottom: 30px!important; - color:#1f2329; - font-size:20px; - text-align: center; - background-color:#ffffff; - border-radius:8px; - box-shadow:0px 0px 15px rgba(28, 48, 175, 0.08); - &:first-child,&:nth-child(12){ - margin-left: 0px; - } - &:nth-child(7){ - margin-left: 103px; - } - &:nth-child(11){ - margin-right: 103px; - } - } - } - } } .zone_VIP_box{ padding:50px 0px; @@ -1059,46 +1032,42 @@ .zone_parter{ background-color: #fff; padding:70px 0px 90px; - #scrollBox1{ - max-height: 332px; - overflow: hidden; - margin: 35px 0px 0px; - width: 100%; - .unitMainSlider{ - width: 1200px; - margin:0px auto; - .slick-list{ - height: 140px; - width: 100%; - overflow: hidden; - .slickMainline{ - display: flex!important; - padding:10px 2px; - align-items: center; - justify-content: center; - a{ - background: #FFFFFF; - box-shadow: 0px 1px 8px 1px rgba(0, 0, 0, 0.06); - border-radius: 4px; - border: 1px solid #FFFFFF; - margin-right: 20px; - padding:20px; - height: 120px; - width: 220px; - display: flex; - align-items: center; - justify-content: center; - &:hover{ - border: 1px solid #8FCEFF; - } - img{ - max-width: 100%; - max-height: 100%; - } - &:last-child{ - margin-right: 0px; - } - } + .zone_part_lists{ + display: flex; + flex-direction: column; + margin-top: 70px; + li { + display: flex; + justify-content: flex-start; + align-items: flex-end; + .zone_part_item { + color:#1f2329; + font-size:20px; + line-height:28px; + display: flex; + flex-direction: column; + align-items: flex-start; + } + a { + display: inline-block; + width: 220px; + height: 88px; + line-height: 88px; + margin-right: 20px; + margin-top: 20px; + margin-bottom: 30px!important; + color:#1f2329; + font-size:20px; + text-align: center; + background-color:#ffffff; + border-radius:8px; + box-shadow:0px 0px 15px rgba(28, 48, 175, 0.08); + transition: 0.1s linear; + img{ + max-height: 66px; + } + &:hover { + transform: translate(0, -5px); } } } @@ -1118,4 +1087,106 @@ border-color: var(--primary-color); } } +} +.in_banner{ + position: relative; + .slick-track{ + height: 450px; + display: flex; + .slick-slide{ + position: relative; + height:100%; + div{ + height: 100%; + .regform{ + &>div{ + overflow: hidden; + height: 100%; + width: 100vw; + position: relative; + background-repeat: no-repeat; + background-size: 100% 100%; + } + } + } + } + } + .slick-slider{ + min-width: 100vw; + position: relative; + &: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; + &: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: 50px; + } + &.slick-next{ + right: 50px; + } + } + .slick-dots{ + width: 1200px; + text-align: left; + left: 50%; + margin-left: -600px; + bottom: 25%; + 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: ""; + } + } + } + } + } } \ No newline at end of file