Merge pull request 'banner图轮播等需求' (#556) from Eeeros/forgeplus-react:cs_news into cs_news

2023-06-30 16:46:17 +08:00 · 2023-06-30 16:46:17 +08:00 · 044a9553ea
parent 57b6450795 a4b7233d4c
commit 044a9553ea
23 changed files with 446 additions and 203 deletions
--- a/public/css/edu-purge.css
+++ b/public/css/edu-purge.css
@ -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;
 }

--- a/public/css/gitlink.min.css
+++ b/public/css/gitlink.min.css
--- a/src/App.js
+++ b/src/App.js
@ -333,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预览 */}
--- a/src/forge/Head/Header.js
+++ b/src/forge/Head/Header.js
@ -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}/>}
            {
--- a/src/forge/Head/header.scss
+++ b/src/forge/Head/header.scss
@ -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;
+  }
+}
--- a/src/forge/Information/Component/TopEdition.jsx
+++ 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: <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;
--- 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(
-                  <div className="container">
+                  <div className="container" key={ k }>
                    { i.name &&
                      <div className="c_item">
                        <Link to={`/${i.login}`}><img src={i.imageUrl} alt="" /></Link>
--- a/src/forge/Information/Component/partner.jsx
+++ b/src/forge/Information/Component/partner.jsx
@ -16,70 +16,46 @@ const settings = {
 };
 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 = [];
-    for(let i = 0; i< array.length;) {
-      newArray.push(array.slice(i, i += 5));
+    const newArray = array
+    setMoreTypes(array.length > 0)
+
+    while(newArray[1] && newArray[1].length + newArray[0].length <= 5) {
+      newArray[0] = [...newArray[0], ...newArray.splice(1, 1)[0]]
    }
    setTopics(newArray)
  }

-  function Init() {
-    let box = document.getElementById('scrollBox1');
-    scrollUp();
-    var myTimer = setInterval(scrollUp, 10);
-    // 鼠标移入container 元素上 清除定时器 停止滚动
-    box.onmouseover = () => {
-      clearInterval(myTimer);
-    }
-    // 鼠标移出container 元素上 继续滚动
-    // 60表示每隔60毫秒向上滚动一次
-    box.onmouseout = () => {
-      myTimer = setInterval(scrollUp, 10);
-    }
-  }
-
-  function scrollUp() {
-    let box = document.getElementById('scrollBox1');
-    if(box){
-      let con1 = document.getElementById('box1');
-      if (box.scrollLeft >= con1.clientWidth) {
-        box.scrollLeft = 0;
-      } else {
-        box.scrollLeft++;
-      }
-    }
-  }
-
  return(
-    <div id={"scrollBox1"}>
+    <ul className="boxmain zone_part_lists">
      {
        topics && topics.length>0 ?
-        <Slider {...settings} className="unitMainSlider">
-          {
-            topics.map((i, k)=>{
-              return(
-                <div key={ k } className="slickMainline">
-                {
-                  i.map((j,k1)=>{
-                    return(
+        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>}
                      <a key={ k1 } href={j.link} target="_blank"><img src={j.logo} alt=""/></a>
-                    )
-                  })
-                }
-                </div>
-              )
-            })
-          }
-        </Slider>
-        :""
+                    </div>
+                  )
+                })
+              }
+            </li>
+          )
+        })
+        :
+        ""
      }
-    </div>
+    </ul>
  )
 }
 export default Partner;
--- 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(
-                <div className="container">
+                <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>
@ -63,7 +63,7 @@ function Projects(props) {
              {
                projectList.map((i,k)=>{
                  return(
-                    <div className="container">
+                    <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>
--- 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(
-    <div className="in_banner" style={{backgroundImage:`url(${(data && data.bannerList && data.bannerList.split(",")[0]) || banner})`}}>
+    <div className="in_banner">
+      <TopEdition bannerList={ data && data.bannerList && data.bannerList.split(",") }></TopEdition>
      {
        data && 
-        <div>
+        <div className="zone_content">
          <p className="main_t">{data.mainTitle}</p>
          <p className="sub_t">{data.subTitle}</p>
        </div>
--- a/src/forge/Information/Pages/headerPage.jsx
+++ b/src/forge/Information/Pages/headerPage.jsx
@ -53,7 +53,18 @@ function HeaderPage(props){
    const url = `${httpUrl}/zone/open/${id}/partners/list`;
    axios.get(url).then(result=>{
      if(result){
-        setParterList(result.data.rows);
+        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=>{})
  }
--- a/src/forge/Information/Pages/headerPageZone1.jsx
+++ b/src/forge/Information/Pages/headerPageZone1.jsx
@ -29,13 +29,13 @@ 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: '通过开源硬件社区的建设，可以让更多的人参与到硬件开发中来，激发大众的创造力和创新精神，从而推动硬件领域的技术创新和实际应用。'},
-    {imageUrl: vision1, title: '降低硬件开发成本', content: '通过共享开源硬件设计和资源，可以帮助个人和小型企业降低硬件开发的成本，打破品牌垄断，促进市场竞争。'},
-    {imageUrl: vision2, title: '推广教育和普及知识', content: '通过开源硬件社区的建设，可以提供更多的硬件开发教育和知识普及资源，为学生、教师和爱好者等不同群体提供更多的学习机会和平台。'},
-    {imageUrl: vision3, title: '加强国际合作和交流', content: '开源硬件社区可以促进国内外的交流和合作，扩大中国在全球开源硬件领域的影响力，推动中外企业和机构之间的技术合作和交流。'}
+    {imageUrl: vision0, title: '促进技术创新和应用', content: '通过开源芯片社区的建设，可以让更多的人参与到硬件开发中来，激发大众的创造力和创新精神，从而推动硬件领域的技术创新和实际应用。'},
+    {imageUrl: vision1, title: '降低硬件开发成本', content: '通过共享开源芯片设计和资源，可以帮助个人和小型企业降低硬件开发的成本，打破品牌垄断，促进市场竞争。'},
+    {imageUrl: vision2, title: '推广教育和普及知识', content: '通过开源芯片社区的建设，可以提供更多的硬件开发教育和知识普及资源，为学生、教师和爱好者等不同群体提供更多的学习机会和平台。'},
+    {imageUrl: vision3, title: '加强国际合作和交流', content: '开源芯片社区可以促进国内外的交流和合作，扩大中国在全球开源芯片领域的影响力，推动中外企业和机构之间的技术合作和交流。'}
  ]

  const communityInfo = [
@ -106,7 +106,18 @@ function HeaderPage(props){
    const url = `${httpUrl}/zone/open/${id}/partners/list`;
    axios.get(url).then(result=>{
      if(result){
-        setParterList(result.data.rows);
+        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=>{})
  }
@ -132,7 +143,7 @@ function HeaderPage(props){
          {
            vision.map((i, k) => {
              return (
-                <div className="vision_item">
+                <div className="vision_item" key={ k }>
                  <div className="vision_icon">
                    <img src={i.imageUrl} alt="" />
                  </div>
@ -169,8 +180,8 @@ function HeaderPage(props){
                newsList.map((i,k)=>{
                  return(
                    k > 0 && 
-                    <Link to={`/zone/${deptId}/newdetail/${i.id}`}>
-                      <li className="new_item">
+                    <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>
@ -184,7 +195,7 @@ function HeaderPage(props){
                          <span className="flexCenter zone_btn">查看详情<img src={guideArrow} alt="" width="14px"/></span>
                        </p>
                      </li>
-                    </Link>
+                    </div>
                  )
                })
              }
@ -214,9 +225,9 @@ function HeaderPage(props){
        <p className="sub_title mb50"><img src={ra} alt="" className="mr5" />成为社区成员，尽情发挥您的创意</p>
        <div className="c_role boxmain">
          {
-            communityInfo.map(i => {
+            communityInfo.map((i, k) => {
              return (
-                <div className="c_role_item">
+                <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>
@ -237,7 +248,7 @@ function HeaderPage(props){
          {
            growPathInfo.map((i, k) => {
              return (
-                <div className="grow_path_item">
+                <div className="grow_path_item" key={ k }>
                  { k % 2 === 1 && <div className="dot"></div> }
                  <div className="grow_path_type">
                    <div></div>
@ -256,9 +267,9 @@ function HeaderPage(props){
        <div className="line"></div>
        <div className="grow_introduction boxmain pt40">
          {
-            introDetail.map(i => {
+            introDetail.map((i, k) => {
              return (
-                <div className="intro_item">
+                <div className="intro_item" key={ k }>
                  <p className="intro_title">
                    <img src={i.icon} alt="" className="mr3" />
                    { i.title }
--- a/src/forge/Information/Pages/newsDetail.jsx
+++ b/src/forge/Information/Pages/newsDetail.jsx
@ -1,5 +1,5 @@
 import React,{ useState , useEffect } from 'react';
-import { Breadcrumb , Divider } from 'antd';
+import { Breadcrumb , Divider, Spin } from 'antd';
 import liulan from '../img/liulan.png';
 import RenderHtml from '../../../components/render-html';
 import { Base64 } from 'js-base64';
@ -12,6 +12,7 @@ function NewsDetail(props){
  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(()=>{
@ -22,44 +23,48 @@ function NewsDetail(props){
  },[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=>{})
  }
  return(
    <div className="detail_news_all">
-      {
-        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>{cmsDir.name}</li> }
-                { cmsDir && <li>发布于{detail.publishTime}</li> }
-                { detail.visits && <li><img src={liulan} alt="" className="mr5" />{detail.visits}</li> }
-              </ul>
+      <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.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>
-            <Divider dashed={true}	/>
-            {
-              content ?
-              <RenderHtml className="informations_detail imageLayerParent" value={content} url={props.history.location} />
-              :
-              <span>暂无详情~</span>
-            }
          </div>
-        </div>
-      }
+        }
+      </Spin>
    </div>
  )
 }
--- 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;
@ -414,6 +418,14 @@
  justify-content: center;
 }
 .detail_news_all{
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  min-height: 600px;
+  justify-content: unset;
+  .ant-spin-spinning {
+    margin: auto;
+  }
  .detail_banners{
    background-image: url(./img/subbanner.png);
    background-size: 100% 100%;
@ -458,6 +470,20 @@
          height: 20px;
          line-height: 20px;
          margin-right: 25px;
+          a {
+            display: flex;
+            align-items: center;
+            height: 20px;
+            overflow: visible;
+            color: #466aff;
+          }
+          .headimg {
+            width: 26px;
+            height: 26px;
+            margin-right: 4px;
+            border-radius: 50%;
+            vertical-align: middle;
+          }
        }
      }
    }
@ -867,37 +893,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;
@ -1053,45 +1048,51 @@
 .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;
+      flex-wrap: wrap;
+      .zone_part_item {
+        color:#1f2329;
+        font-size:20px;
+        line-height:28px;
+        display: flex;
+        flex-direction: column;
+        align-items: flex-start;
+        span {
+          display: inline-block;
+          width: 200px;
+        }
+        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);
+          }
+        }
+        &:nth-child(n + 6) {
+          a {
+            margin-top: 0px;
          }
        }
      }
@ -1113,6 +1114,108 @@
    }
  }
 }
+.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: "";
+          }
+        }
+      }
+    }
+  }
+}
 .informations_detail.markdown-body{
  &>p{
    line-height: 32px;
--- a/src/glcc/apply/index.jsx
+++ b/src/glcc/apply/index.jsx
@ -75,7 +75,7 @@ function Apply(props) {
        <div className={`explain`}>
          <p className='font-15 c000'>申请说明</p>
          <div>1、项目报名时间为<span className='c000'>4月29日—5月30日</span>，请在报名截止时间（北京时间<span className='c000'>2023年5月30日24点</span>）前提交报名信息。</div>
-          <div>2、本次GLCC夏令营建议使用GitLink为代码托管平台，学生基于GitLink上项目完成编程任务。同时也欢迎使用其他代码托管平台的项目参与活动。目前GLCC只对夏令营期间使用GitLink托管的项目提供部分资金支持。</div>
+          <div>2、本次GLCC夏令营建议使用GitLink为代码托管平台，学生基于GitLink上项目完成编程任务。同时也欢迎使用其他代码托管平台的项目参与活动。目前GLCC只对夏令营期间使用GitLink托管的项目提供部分奖金支持。</div>
          <div>3、如果您的项目还未迁移到GitLink上，迁移事项请查看<a href='https://forum.gitlink.org.cn/forums/7296/detail' target="_blank" className='link'>迁移说明文档</a>。如在迁移过程中遇到问题，请加qq群: 1071514693  联系qq群管理员。</div>
          <div>4、提交社区和题目信息后，欢迎与组委会联系沟通宣传推广和后续合作工作。联系人微信: _TigerWang（备注GitLink编程夏令营）</div>
          <div><span className='c000'>5、奖金默认由项目方支持，请根据课题难度设定金额。若您可能无法支撑本课题奖金，GLCC组委会将进行资助评审，择优资助。如未获得资助，将下线该课题</span></div>
--- a/src/glcc/freeProject/component/projectDetail.jsx
+++ b/src/glcc/freeProject/component/projectDetail.jsx
@ -30,17 +30,14 @@ export default ({ detail, projectId }) => {
      {info.registrationTaskList && info.registrationTaskList.length ? info.registrationTaskList.map((item, index)=>{
        return <div className='taskItem mt20' key={index}>
          <div className="left">
-            <div className="taskTitle" onClick={()=>{window.open(`/glcc/2023/subjects/detail/${item.id}`)}}><Tooltip title={item.taskName}>{item.taskName}</Tooltip></div>
+            <div className="taskTitle"><Tooltip title={item.taskName}>{item.taskName}</Tooltip></div>
            <div className='mt20 oneLine leftWidth'>导师姓名: &nbsp;&nbsp;{item.tutorName}</div>
            {item.tutorMail && <div className='mb20 email oneLine leftWidth'>邮箱地址: &nbsp;&nbsp;<span><Tooltip title={item.tutorMail}>{item.tutorMail}</Tooltip></span></div>}
          </div>
          <div className="center">
-            <div className="taskDesc">{item.taskDesc}</div>
+            <div className="taskDesc"><Tooltip title={item.taskDesc}>{item.taskDesc}</Tooltip></div>
            {item.taskUrl && <div className="taskUrl oneLine">课题链接: &nbsp;&nbsp;<a href={item.taskUrl} target={"_blank"}>{item.taskUrl}</a></div>}
-            {/* 查看课题详情按钮 */}
-            <div>
-              <Button onClick={()=>{window.open(`/glcc/2023/subjects/detail/${item.id}`)}} className='lookDetail'>课题详情</Button>
-            </div>
+            <div></div>
          </div>
          <div className="right oneLine taskUrl"><span className='taskReward'>￥{item.taskReward}</span></div>
        </div>
--- a/src/glcc/freeProject/index.jsx
+++ b/src/glcc/freeProject/index.jsx
@ -36,12 +36,12 @@ console.log('FreeProject');
      </div>
      <div className='gobackBox'>
        <a href={`/glcc`}>开源夏令营 / </a>
-        0元课题及项目列表
+        无奖金课题及项目列表
      </div>
      <div className="head_introduce mt30 mb30">
        <h4 className="head_tit">申请说明：</h4>
-        <div className="head_content">1、参与GitLink编程夏令营0资金项目的同学，请通过邮件或电话与课题导师直接沟通并根据导师课题要求完成课题，无需在GLCC平台报名课题。</div>
-        <div className="head_content">2、参与GitLink编程夏令营0资金项目的同学，如完成课题并经导师评定通过，将获得GLCC证书（1份），但无课题资金。</div>
+        <div className="head_content">1、参与GitLink编程夏令营无奖金项目的同学，请通过邮件或电话与课题导师直接沟通并根据导师课题要求完成课题，无需在GLCC平台报名课题。</div>
+        <div className="head_content">2、参与GitLink编程夏令营无奖金项目的同学，如完成课题并经导师评定通过，将获得证书或证明（1份），但无课题奖金。</div>
        <div className="head_content">3、活动最终解释权归GLCC所有。</div>
      </div>
      <Spin spinning={false}>
--- a/src/glcc/freeProject/index.scss
+++ b/src/glcc/freeProject/index.scss
@ -110,7 +110,6 @@
      padding: 22px 20px;
      color:#25304a;
      .taskTitle{
-        cursor: pointer;
        color:#1834a7;
        font-size:18px;
        display: -webkit-box;
--- a/src/glcc/freeProject/taskList/index.jsx
+++ b/src/glcc/freeProject/taskList/index.jsx
@ -17,7 +17,7 @@ function TaskList() {

  const columns = [
    { title: '序号', dataIndex: 'index', align: 'center', className:"taskTableColumns", width: '6%', render: (text, item, index) => <span>{(current-1)*pageSize+index + 1}</span> },
-    { title: '课题名称', dataIndex: 'taskName', className:"taskTableColumns taskName", width: '28%', ellipsis: true, render: (text, item) => <Tooltip title={text} placement="topLeft"><span onClick={()=>{window.open(`/glcc/2023/subjects/detail/${item.id}`)}}>{text}</span></Tooltip> },
+    { title: '课题名称', dataIndex: 'taskName', className:"taskTableColumns taskName", width: '28%', ellipsis: true, render: (text, item) => <Tooltip title={text} placement="topLeft"><span>{text}</span></Tooltip> },
    { title: '课题类型', dataIndex: 'projectType', className:"taskTableColumns", width: '12%', ellipsis: true,  },
    { title: '项目名称', dataIndex: 'projectName', className:"taskTableColumns", width: '24%', ellipsis: true, render: (text) => <Tooltip title={text} placement="topLeft">{text}</Tooltip> },
    { title: '课题奖金', dataIndex: 'taskReward', className:"taskTableColumns", ellipsis: true, width: '10%', render: (text) => <Tooltip title={text} placement="topLeft"><span>{text}</span></Tooltip> },
--- a/src/glcc/freeProject/taskList/index.scss
+++ b/src/glcc/freeProject/taskList/index.scss
@ -28,7 +28,6 @@
 }
 .ant-table-tbody .taskTableColumns.taskName span{
  color: #2545c9;
-  cursor: pointer;
 }
 .ant-table-thead > tr > .taskTableColumns, .ant-table-tbody > tr > .taskTableColumns{
  background-color:#F1F6FF;
--- a/src/glcc/home/index.jsx
+++ b/src/glcc/home/index.jsx
@ -82,7 +82,7 @@ export default (props) => {
        {repoPublic && <Link to={`/glcc/${id}/projects`} className="apply project" >
          <div>
            <img src={apply1} alt="" className="applyIcon" />
-            <span className="hover-none"><span className="til">查看项目</span> </span>
+            <span className="hover-none"><span className="til">有奖金项目</span> </span>
          </div>
          <div className="pt6">掌握项目课题详细信息</div>
        </Link>}
@ -91,7 +91,7 @@ export default (props) => {
        <Link to={`/glcc/freeproject`} className="apply project" >
          <div>
            <img src={apply1} alt="" className="applyIcon" />
-            <span className="hover-none"><span className="til">0元资金项目</span> </span>
+            <span className="hover-none"><span className="til">无奖金项目</span> </span>
          </div>
          <div className="pt6">欢迎广大学生踊跃参与</div>
        </Link>
--- a/src/glcc/img/studentProject2.png
+++ b/src/glcc/img/studentProject2.png
--- a/src/glcc/project/taskDetail/index.jsx
+++ b/src/glcc/project/taskDetail/index.jsx
@ -52,9 +52,9 @@ function TaskDetail(props) {

            {/* 课题申请时间范围内： 申请课题 */}
            {/* 第一次报名 */}
-            {round === currentRound && period==="stuApply" && !(applyTaskId && Object.keys(applyTaskId).includes(taskId.toString())) && <Button type='primary' className='applyBut detailBut' onClick={()=>{applyTask(taskId)}}>申请课题</Button>}
+            {detail.taskReward > 0 && round === currentRound && period==="stuApply" && !(applyTaskId && Object.keys(applyTaskId).includes(taskId.toString())) && <Button type='primary' className='applyBut detailBut' onClick={()=>{applyTask(taskId)}}>申请课题</Button>}
            {/* 第二次报名 锁定状态 */}
-            {round === currentRound && period === "stuApply1" && !(applyTaskId && Object.keys(applyTaskId).includes(taskId.toString())) && (detail.locked ? <Tooltip title={"该课题已有学生入选"}><Button type='primary' className='mr10 detailBut' disabled>申请课题</Button></Tooltip> : <Button type='primary' className='applyBut mr10 detailBut' onClick={()=>{applyTask(taskId)}}>申请课题</Button>)}
+            {detail.taskReward > 0 && round === currentRound && period === "stuApply1" && !(applyTaskId && Object.keys(applyTaskId).includes(taskId.toString())) && (detail.locked ? <Tooltip title={"该课题已有学生入选"}><Button type='primary' className='mr10 detailBut' disabled>申请课题</Button></Tooltip> : <Button type='primary' className='applyBut mr10 detailBut' onClick={()=>{applyTask(taskId)}}>申请课题</Button>)}
          </div>
          <img src={bgPng} alt='' className='bgPng1'/>
          <img src={bgPng} alt='' className='bgPng2'/>