merge

2023-07-14 10:04:23 +08:00 · 2023-07-14 10:04:23 +08:00 · 1ecfb04386
parent 5f3dff0bf2 8032302eee
commit 1ecfb04386
39 changed files with 1061 additions and 254 deletions
--- a/public/css/editormd.min.css
+++ b/public/css/editormd.min.css
--- 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/public/index.html
+++ b/public/index.html
@ -55,6 +55,7 @@
  <script src="%PUBLIC_URL%js/codemirror/merge/merge.js"></script>
  <script src="%PUBLIC_URL%js/alex/moment.js"></script>
  <script src="https://gw.alipayobjects.com/os/lib/alipay/alex/2.0.19/bundle/alex.all.global.min.js"></script>
+  <!-- <meta name="viewport" content="width=device-width, user-scalable=no,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0"> -->
  <%= htmlWebpackPlugin.tags.bodyTags %>
  <script>
    var _hmt = _hmt || [];
--- 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/components/render-html.jsx
+++ b/src/components/render-html.jsx
@ -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
--- 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/defaultImg.jsx
+++ b/src/forge/Information/Component/defaultImg.jsx
@ -14,7 +14,7 @@ function DefaultImg({name,title}){
      <img src={require(`../img/color${randomNumberInRange(1,4)}.png`).default} alt="" className="color" />
      <span className="d_name">
        <span>{name}</span>
-        <span>{title}</span>
+        {/* <span>{title}</span> */}
      </span>
    </div>
  )
--- a/src/forge/Information/Component/partner.jsx
+++ b/src/forge/Information/Component/partner.jsx
@ -16,70 +16,51 @@ 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 > 1)
+
+    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(
-                      <a key={ k1 } href={j.link} target="_blank"><img src={j.logo} alt=""/></a>
-                    )
-                  })
-                }
-                </div>
-              )
-            })
-          }
-        </Slider>
-        :""
+        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>
+          )
+        })
+        :
+        ""
      }
-    </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
@ -1,8 +1,8 @@
 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'



@ -17,6 +17,7 @@ function PublicBanner(props){
      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 source = /[A-Za-z0-9]{0,}\/source/g;
      const vip = /[A-Za-z0-9]{0,}\/VIP/g;
      if(pathname === `/zone/${deptId}`){
        setKey("1");
@ -24,6 +25,9 @@ function PublicBanner(props){
      else if(project.test(pathname)){
        setKey("2");
      }
+      else if(source.test(pathname)){
+        setKey("3");
+      }
      else if(info.test(pathname) || infodetail.test(pathname)){
        setKey("4");
      }
@ -34,19 +38,20 @@ 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>
+          <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={"3"}><Link to={`/zone/${deptId}/source`}><img src={require(`../img/${temp}Menu3.png`)} alt="" width="33px"/>资源发布</Link></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>
--- 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=>{})
  }
@ -66,7 +77,7 @@ function HeaderPage(props){
        <div className="boxmain zone_infos">
            <div className="zone_infos_desc">
              {data.introductionTitle && <p className="z_name">{data.introductionTitle}</p>}
-              <p className="z_desc task-hide-2" style={{WebkitLineClamp:data.introductionTitle?"4":"7"}}>{data.introductionContent}</p>
+              <p className="z_desc task-hide-2" style={{WebkitLineClamp:data.introductionTitle?"4":"7"}} dangerouslySetInnerHTML={{ __html: data.introductionContent }} ></p>
            </div>
          {
            data.introductionImage &&
--- 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=>{})
  }
@ -118,7 +129,7 @@ function HeaderPage(props){
        <div className="boxmain zone_infos mb30">
            <div className="zone_infos_desc">
              <p className="z_name">{data.introductionTitle}</p>
-              <p className="z_desc task-hide-2">{data.introductionContent}</p>
+              <p className="z_desc task-hide-2" dangerouslySetInnerHTML={{ __html: data.introductionContent }} ></p>
            </div>
          {
            data.introductionImage &&
@ -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>
@ -155,7 +166,7 @@ function HeaderPage(props){
                <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="new_first_desc mt20 task-hide">{newsList[0].summary}</p>
              <p className="font-13 zone_n_value mt20" style={{color:"#8d95a3"}}>
                <span className="flexCenter">
                  <img src={shijian} alt="" className="mr3" />
@ -164,13 +175,13 @@ function HeaderPage(props){
                <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">
+            <ul className={ `zone_new_three ${ newsList && (newsList.length < 4) ? 'zone_new_two' : '' }`}>
              {
                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,50 @@ 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=>{})
+    }).catch(error=>{
+      setIsSpin(false)
+    })
  }
  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.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>
-            <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/Pages/source.jsx
+++ b/src/forge/Information/Pages/source.jsx
@ -0,0 +1,168 @@
+import React , { useEffect , useState } from 'react';
+import { Input , Pagination, Spin } from 'antd';
+import SourceIcon from '../img/sourceIcon.png';
+import { Link } from 'react-router-dom';
+import axios from 'axios';
+import { getSourceTypeList , getSourceList , getSourceZoneList } from '../api';
+import Nodata from '../../Nodata';
+import ImgGreen from '../img/green_nodata.png';
+import '../indexZone1.scss';
+
+const { Search } = Input;
+
+function Source(props){
+  const { deptId } = props.match.params;
+  const [ sourceList , setSourceList ] = useState(undefined);
+  const [ zoneList , setZoneList ] = useState(undefined);
+  const [ typeList , setTypeList ] = useState(undefined);
+  const [ chooseZoneId , setChooseZoneId ] = useState(undefined);
+  const [ chooseTypeId , setChooseTypeId ] = useState(undefined);
+  const [ page , setPage ] = useState(1);
+  const [ total , setTotal ] = useState(0);
+  const [ search , setSearch ] = useState(undefined);
+  const [ isSpin , setIsSpin ] = useState(true);
+  const limit = 20;
+  const { id , temp } = props;
+
+
+  useEffect(()=>{
+    id && getLists();
+  },[id,chooseTypeId,chooseZoneId,page,search])
+
+  useEffect(()=>{
+    id && getZoneList();
+    id && getTypeList();
+  },[id])
+
+  function getZoneList(){
+    getSourceZoneList(id).then(response=>{
+      if(response && response.data){
+        setZoneList(response.data.rows);
+      }
+    }).catch(error=>{})
+  }
+
+  function getTypeList(){
+    getSourceTypeList(id).then(response=>{
+      if(response && response.data){
+        setTypeList(response.data.rows);
+      }
+    }).catch(error=>{})
+  }
+
+  function getLists(){
+    setIsSpin(true);
+    getSourceList({
+      id,pageSize:limit,pageNum:page,typeId:chooseTypeId,domainId:chooseZoneId,name:search
+    }).then(response=>{
+      if(response){
+        setSourceList(response.data.rows);
+        setTotal(response.data.total);
+        setIsSpin(false);
+      }
+    }).catch(error=>{})
+  }
+
+
+  function onSourceSearch(value){
+    setSearch(value);
+    setPage(1);
+  }
+
+  return(
+    <div className={`${temp}_source_box`}>
+      <div className="source_h">
+        <p className="in_title">资源发布</p>
+        <div style={{marginTop:"30px",textAlign:"center"}}>
+          <Search 
+            placeholder="请输入资源名称"
+            onSearch={onSourceSearch}
+            style={{width:'645px',borderColor:"#fff",boxShadow:"0px 0px 10px rgba(61, 85, 183, 0.1)"}}
+            size="large"
+            className="source_search_box"
+            allowClear
+            enterButton={temp === "zone" ? <span><i className="iconfont icon-sousuo5 font-15"/>搜索</span> :undefined}
+          />
+        </div>
+      </div>
+      <div className="sources" style={{alignItems:(sourceList && sourceList.length>0) ? "flex-start":"center"}}>
+        <div className="source_left_ul">
+          {
+            zoneList && zoneList.length>0&&
+            <ul className="source_l_u">
+              <p>资源领域</p>
+              <div>
+                <li onClick={()=>setChooseZoneId(undefined)} className={!chooseZoneId ?"active":""}>全部</li>
+                {
+                  zoneList.map((i,k)=>{
+                    return(
+                      <li key={k} onClick={()=>{setChooseZoneId(i.id)}} className={chooseZoneId && chooseZoneId === i.id ? "active":"" }>{i.name}</li>
+                    )
+                  })
+                }
+              </div>
+            </ul>
+          }
+          {
+            typeList && typeList.length>0 &&
+            <ul className="source_l_u">
+              <p className="borderRight">资源类别</p>
+              <div>
+                <li onClick={()=>setChooseTypeId(undefined)} className={!chooseTypeId ?"active":""}>全部</li>
+                {
+                  typeList.map((i,k)=>{
+                    return(
+                      <li key={k} onClick={()=>{setChooseTypeId(i.id)}} className={chooseTypeId && chooseTypeId === i.id ? "active":"" }>{i.name}</li>
+                    )
+                  })
+                }
+              </div>
+            </ul>
+          }
+        </div>
+        <Spin spinning={isSpin}>
+          <div className="s_m_list">
+          {
+            sourceList && sourceList.length > 0 &&
+            <div className="source_lists">
+              {sourceList.map((i,k)=>{
+                return(
+                    <div className="source_lists_card" key={k}>
+                      <Link to={`/zone/${deptId}/source/${i.id}`} onClick={()=>{window.scrollTo(0,450)}} className="task-hide">{i.name}</Link>
+                      <p className="task-hide-2 desc">
+                      {i.summary}
+                      </p>
+                      <div className="s_infos">
+                        <p className="load_count">
+                          <img src={SourceIcon} alt="" width="18px" className="mr5"/><span style={{color:"#5e6685"}}>{i.downloadCount}</span>
+                        </p>
+                        {temp === "zone1" && <p className="load_source">
+                          <span>{i.domainName}</span>
+                          <span>{i.typeName}</span>
+                        </p>
+                        }
+                      </div>
+                    </div>
+                  )
+                })
+            }
+            </div>
+          }
+          {sourceList && sourceList.length === 0 && 
+            <div style={{textAlign:'center'}}>
+              <Nodata _html="暂无数据" img={temp === "zone1" ? ImgGreen : undefined}/>
+            </div>
+          }
+          {
+            total > limit &&
+            <div style={{textAlign:'center',padding:"20px 0px"}}>
+              <Pagination pageSize={limit} total={total} current={page} onChange={(p)=>{setPage(p);window.scrollTo(0,450);}} showQuickJumper/>
+            </div>
+          }
+          </div>
+        </Spin>
+      </div>
+    </div>
+  )
+}
+export default Source;
--- a/src/forge/Information/Pages/sourceDetail.jsx
+++ b/src/forge/Information/Pages/sourceDetail.jsx
@ -0,0 +1,72 @@
+import React , { useEffect , useState } from 'react';
+import { Breadcrumb } from 'antd';
+import SourceFile from '../img/sourceFile.png';
+import RenderHtml from '../../../components/render-html';
+import { getSourceDetail } from '../api';
+import { Link } from 'react-router-dom';
+import axios from 'axios';
+import { Base64 } from 'js-base64';
+import { httpUrl } from '../fetch';
+
+
+function SourceDetail(props){
+  const { deptId , sourceid } = props.match.params;
+  const [ detail , setDetail ] = useState(undefined);
+
+  useEffect(()=>{
+    if(sourceid){
+      getDetails();
+    }
+  },[sourceid])
+
+  function getDetails(){
+    getSourceDetail(sourceid).then(response=>{
+      if(response){
+        setDetail(response.data.data);
+      }
+    }).catch(error=>{})
+  }
+
+  return(
+    <div className="boxmain"style={{paddingBottom:"40px"}}>
+      <Breadcrumb separator=">" style={{paddingTop:"20px"}}>
+        <Breadcrumb.Item><Link className="primaryColor" to={`/zone/${deptId}/source`}>资源列表</Link></Breadcrumb.Item>
+        <Breadcrumb.Item>详情页</Breadcrumb.Item>
+      </Breadcrumb>
+      {
+        detail &&
+        <div className="source_detail_box">
+          <div className="s_d_title">{detail.name}</div>
+          {
+            detail.fileList && detail.fileList.length > 0 &&
+            <ul className="files_box">
+              {
+                detail.fileList.map((i,k)=>{
+                  return(
+                    <li>
+                      <img src={SourceFile} alt="" width="20px" className="mr12"/>
+                      <span className="task-hide">{i.fileOriginName}</span>
+                      <span>{i.fileSizeInfo}</span>
+                      <a href={`${httpUrl}/file/open/download/${i.fileId}`} download className="f_b_load primaryColor">下载</a>
+                    </li>
+                  )
+                })
+              }
+            </ul>
+          }
+          
+          { detail.introduction && 
+            <div style={{padding:"20px 0px"}}>
+              <RenderHtml 
+                className="source_detail imageLayerParent" 
+                value={detail.introduction ? Base64.decode(detail.introduction):""} 
+                url={props.history.location} 
+              />
+            </div>
+          }
+        </div>
+      }
+    </div>
+  )
+}
+export default SourceDetail;
--- a/src/forge/Information/api.js
+++ b/src/forge/Information/api.js
@ -98,4 +98,31 @@ export function applyJoin(id,data) {
    method: 'post',
    data: data
  });
+}
+
+// 资源模块
+export function getSourceTypeList(id){
+  return fetch({
+    url:`/zone/open/${id}/resourceType/list`,
+    method: 'get',
+  })
+}
+export function getSourceZoneList(id){
+  return fetch({
+    url:`/zone/open/${id}/resourceDomain/list`,
+    method: 'get',
+  })
+}
+export function getSourceList(params){
+  return fetch({
+    url:`/zone/open/${params.id}/resource/list`,
+    method: 'get',
+    params
+  })
+}
+export function getSourceDetail(id){
+  return fetch({
+    url:`/zone/open/resource/detail/${id}`,
+    method: 'get'
+  })
 }
--- a/src/forge/Information/img/green_nodata.png
+++ b/src/forge/Information/img/green_nodata.png
--- a/src/forge/Information/img/sourceCardBack.png
+++ b/src/forge/Information/img/sourceCardBack.png
--- a/src/forge/Information/img/sourceFile.png
+++ b/src/forge/Information/img/sourceFile.png
--- a/src/forge/Information/img/sourceIcon.png
+++ b/src/forge/Information/img/sourceIcon.png
--- a/src/forge/Information/img/zone1Menu3.png
+++ b/src/forge/Information/img/zone1Menu3.png
--- a/src/forge/Information/img/zoneMenu3.png
+++ b/src/forge/Information/img/zoneMenu3.png
--- a/src/forge/Information/index.jsx
+++ b/src/forge/Information/index.jsx
@ -15,10 +15,18 @@ import "slick-carousel/slick/slick.css";
 import "slick-carousel/slick/slick-theme.css";
 import { tempEnum } from "./tempInfo";

+const SourceDetail = Loadable({
+  loader: () => import("./Pages/sourceDetail"),
+  loading: Loading,
+});
 const VIP = Loadable({
  loader: () => import("./Pages/zoneVIP"),
  loading: Loading,
 });
+const Source = Loadable({
+  loader: () => import("./Pages/source"),
+  loading: Loading,
+});
 const HeaderPage = Loadable({
  loader: () => import("./Pages/headerPage"),
  loading: Loading,
@ -101,7 +109,7 @@ function Index(props){
  }
  return(
    <div className="information_main">
-      { id && <PublicBanner {...props} data={data} temp={ temp } adminUrl={adminUrl}/> }
+      { id ? <PublicBanner {...props} data={data} temp={ temp } adminUrl={adminUrl}/> : <div style={{ width: '100%', height: '450px' }}></div>}
      <Switch>
        <Route
          path="/zone/:deptId/news/:cateId"
@ -115,6 +123,18 @@ function Index(props){
            <NewsDetail {...props} {...p} id={id} temp={ temp }/>
          )}
        ></Route>
+        <Route
+          path="/zone/:deptId/source/:sourceid"
+          render={(p) => (
+            <SourceDetail {...props} {...p} id={id} temp={ temp }/>
+          )}
+        ></Route>
+        <Route
+          path="/zone/:deptId/source"
+          render={(p) => (
+            <Source {...props} {...p} id={id} temp={ temp }/>
+          )}
+        ></Route>
        <Route
          path="/zone/:deptId/VIP"
          render={(p) => (
--- 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;
@ -46,6 +50,7 @@
        line-height:40px;
        color:rgba(225,225,225,0.9);
        font-size:16px;
+        white-space: pre-wrap;
      }
    }
    .bannerMenus{
@ -414,6 +419,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 +471,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;
+          }
        }
      }
    }
@ -666,6 +693,7 @@
        line-height:32px;
        word-break: break-all;
        -webkit-line-clamp: 4;
+        white-space: pre-wrap;
      }
    }
  }
@ -867,37 +895,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 +1050,52 @@
 .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, div {
+          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-width: 180px;
+            max-height: 66px;
+          }
+          &:hover {
+            transform: translate(0, -5px);
+          }
+        }
+        &:nth-child(n + 6) {
+          a {
+            margin-top: 0px;
          }
        }
      }
@ -1113,9 +1117,236 @@
    }
  }
 }
+.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;
    margin-bottom: 8px!important;
  }
+}
+.zone_source_box{
+  padding-bottom: 40px;
+  .source_h{
+    background-color: rgba(240, 244, 255, 0.94);
+    padding:56px 0px;
+    box-sizing: border-box;
+    min-height: 278px;
+  }
+  .source_search_box{
+    .ant-input-lg{
+      border-color: #fff;
+    }
+  }
+  .sources{
+    display: flex;
+    align-items: flex-start;
+    padding:40px 0px;
+    width: 1200px;
+    margin: 0px auto;
+    background-color: #f7f9fc;
+    border: 2px solid #ffffff;
+    border-radius: 4px;
+    margin-top: -70px;
+    box-sizing: border-box;
+    .ant-spin-nested-loading{
+      flex: 1;
+    }
+    .source_left_ul{
+      display: flex;
+      flex-direction: column;
+      align-items: flex-end;
+      padding:5px 0px;
+      p,li{
+        height: 60px;
+        line-height: 60px;
+        padding-left: 34px;
+        width: 215px;
+      }
+      p.borderRight{
+        border-right: 2px solid #fff;
+      }
+      p{
+        font-weight:700;
+        color:#1f2329;
+        font-size:18px;
+      }
+      li{
+        border-right: 3px solid #fff;
+        font-weight:500;
+        color:#3d485d;
+        cursor: pointer;
+        font-size:16px;
+        &.active{
+          border-color: var(--primary-color);
+          color: var(--primary-color);
+          background-image:linear-gradient(89.9deg,rgba(70, 106, 255, 0) 0%,rgba(70, 106, 255, 0.09) 100%);
+        }
+      }
+    }
+    .source_lists{
+      width: 100%;
+      display: flex;
+      flex-wrap: wrap;
+      .source_lists_card{
+        margin-left: 29px;
+        width: 286px;
+        min-height: 180px;
+        background-color: rgba(255, 255, 255, 0.986);
+        padding:20px;
+        margin-bottom: 29px;
+        position: relative;
+        background-image: url(./img/sourceCardBack.png); 
+        background-size: 100% 100%;
+        border-radius: 2px;
+        box-shadow: 0px 0px 11px rgba(197, 197,197, 0.1);
+        a.task-hide{
+          color:#1f2329;
+          font-size:16px;
+          height: 28px;
+          line-height: 28px;
+          display: block;
+          margin-bottom: 15px;
+        }
+        .desc{
+          color:#4c5876;
+          height: 54px;
+          line-height: 27px;
+          margin-bottom: 14px!important;
+        }
+      }
+    }
+  }
+}
+.source_detail_box{
+  background-color: #fff;
+  padding:10px 35px 30px;
+  .s_d_title{
+    padding:25px 0px;
+    border-bottom: 1px dashed rgba(141, 149, 172, 0.27);
+    color:#1f2329;
+    font-size:22px;
+    margin-bottom: 20px!important;
+  }
+  .files_box{
+    padding:11px 30px;
+    background-color:#f6f8fa;
+    li{
+      display: flex;
+      align-items: center;
+      height: 42px;
+      &>span{
+        color:#3d485d;
+        font-size:15px;
+        min-width: 190px;
+        &.task-hide{
+          width: 500px;
+          margin-right: 20px;
+        }
+      }
+    }
+  }
+}
+.primaryColor{
+  color: var(--primary-color)!important;
 }
--- a/src/forge/Information/indexZone1.scss
+++ b/src/forge/Information/indexZone1.scss
@ -29,6 +29,7 @@
        line-height:32px;
        word-break: break-all;
        -webkit-line-clamp: 4;
+        white-space: pre-wrap;
      }
    }
  }
@ -105,7 +106,6 @@
    }
    .new_first_desc {
      opacity: 0.8;
-      height: 20px;
      color: #ffffff;
      font-size: 14px;
      line-height: 27px;
@ -121,8 +121,11 @@
      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;
@ -168,10 +171,11 @@
      }
    }
    .zone_new_three{
-      width: 1200px;
      display: flex;
-      justify-content: space-between;
-      margin: 0 auto;
+      justify-content: space-evenly;
+      & > div:not(:first-child) {
+        margin-left: 50px;
+      }
      li{
        background-color: #fff;
        width: 354px;
@ -199,6 +203,10 @@
          }
      }
    }
+    .zone_new_two {
+      margin-left: 38%;
+      justify-content: flex-start;
+    }
  }
  .zone_projects{
    background-image:linear-gradient(180deg,#f1f4fa 0%,#ffffff 100%);
@ -638,4 +646,123 @@
      }
    }
  }
+}
+.zone1_source_box{
+  padding-bottom: 30px;
+  .source_h{
+    padding-top: 40px;
+    width: 100%;
+    height:280px;
+    background-image:linear-gradient(180deg,#f4f6fb 0%,#e8ebf1 100%);
+  }
+  .sources{
+    margin-top: -97px;
+    .source_left_ul{
+      width: 1200px;
+      margin:0px auto;
+      background-color:#fefefe;
+      border-radius:4px;
+      padding:30px 30px 6px;
+      .source_l_u{
+        display: flex;
+        margin-bottom: 12px!important;
+        align-items: flex-start;
+        &>p{
+          font-weight:400;
+          color:#1f2329;
+          font-size:16px;
+          line-height:22px;
+          height:22px;
+          margin-right: 20px;
+        }
+        &>div{
+          flex:1;
+          display: flex;
+          flex-wrap: wrap;
+          li{
+            cursor: pointer;
+            margin:0px 18px 12px!important;
+            font-weight:400;
+            color:#3d485d;
+            font-size:16px;
+            line-height:22px;
+            height:22px;
+            &.active{
+              color: var(--primary-color);
+            }
+          }
+        }
+      }
+    }
+    .s_m_list{
+      width: 1200px;
+      margin: 30px auto 0px;
+      background-color: #fff;
+      .source_lists{
+        padding:0px 30px;
+        .source_lists_card{
+          position: relative;
+          padding: 20px 0px 16px;
+          border-bottom: 1px dashed rgba(170, 175, 190,0.43);
+          &:last-child{
+            border-bottom: none;
+          }
+          a.task-hide{
+            display: block;
+            padding-right: 100px;
+            color:#1f2329;
+            font-size:16px;
+            height: 22px;
+            line-height: 22px;
+          }
+          .s_infos{
+            display: flex;
+            align-items: center;
+            margin-top: 10px;
+            .load_count{
+              margin-right: 10px;
+              min-width: 68px;
+            }
+          }
+          .desc{
+            margin-top: 15px;
+            color:#4c5876;
+            line-height:26px;
+          }
+          .load_source{
+            position: relative;
+            padding-left: 14px;
+            color:#8d95ac;
+            font-size:14px;
+            line-height:26px;
+            height:26px;
+            &::before{
+              position: absolute;
+              content: "";
+              background-color: var(--primary-color);
+              width: 8px;
+              height: 8px;
+              border-radius: 50%;
+              left: 0px;
+              top:50%;
+              margin-top: -4px;
+            }
+            &>span:last-child{
+              padding-left: 21px;
+              position: relative;
+              &::before{
+                position: absolute;
+                left: 10px;
+                height: 12px;
+                top: 1px;
+                content: "";
+                width: 1px;
+                background-color: #8d95ac;
+              }
+            }
+          }
+        }
+      }
+    }
+  }
 }
--- a/src/forge/Main/CoderDepot.jsx
+++ b/src/forge/Main/CoderDepot.jsx
@ -372,7 +372,7 @@ function CoderDepot(props){
  // 如果项目是fork的项目，pr自动指向源仓库，否则指向本仓库默认分支
  function compare() {
    if (projectDetail && projectDetail.fork_info) {
-      urlLink(`/${projectDetail.fork_info.fork_project_user_login}/${projectDetail.fork_info.fork_project_identifier}/compare/${turnbar(branchName || defaultBranch)}...${owner + ':' + turnbar(branchName || defaultBranch)}`)
+      urlLink(`/${projectDetail.fork_info.fork_project_user_login}/${projectDetail.fork_info.fork_project_identifier}/compare/${turnbar(branchName || defaultBranch)}...${owner +'/' + projectsId + ':' + turnbar(branchName || defaultBranch)}`)
    } else {
      urlLink(`/${owner}/${projectsId}/compare/${turnbar(defaultBranch)}...${turnbar(branchName || defaultBranch)}`);
    }
@ -382,8 +382,8 @@ function CoderDepot(props){
  const mdFlag = n && n.substring(n.length-3,n.length) === ".md";
  const { current_user , checkIfLogin , showLoginDialog } = props;
  const baseOper = current_user && current_user.login && issuesFlag;
-  const baseOperate = projectDetail && projectDetail.permission && projectDetail.permission !=="Reporter" && projectDetail.type ===0 && pullsFlag && props.platform;
-  const fileOperate = type === "dir" && projectDetail && projectDetail.type ===0 && ((projectDetail.permission && projectDetail.permission !=="Reporter") || (current_user && current_user.admin));
+  const baseOperate = projectDetail && projectDetail.permission && projectDetail.permission !=="Reporter" && projectDetail.type !==2 && pullsFlag && props.platform;
+  const fileOperate = type === "dir" && projectDetail && projectDetail.type !==2 && ((projectDetail.permission && projectDetail.permission !=="Reporter") || (current_user && current_user.admin));
  return(
    <WhiteBack>
      {mirror_status ===0 && <UpdateDescModal desc={desc} website={website} lesson_url={lesson_url} topicsInfo={topics} visible={openModal} onCancel={()=>setOpenModal(false)} onOk={okUpdate}/> }
--- a/src/forge/Merge/CreateMerge.js
+++ b/src/forge/Merge/CreateMerge.js
@ -51,7 +51,14 @@ function getBranchParams(pathname) {
      if (pullObj.indexOf(':') > -1) {
        // 存在源仓库
        const [pullOwner, pullBranch] = pullObj.split(':');
-        result.pullOwner = pullOwner;
+        if(pullOwner.indexOf("/")>-1){
+          const [ ownerO , onwerP ] = pullOwner.split('/');
+          result.pullOwner = ownerO;
+          result.pullIdentity = onwerP;
+        }else{
+          result.pullOwner = pullOwner;
+        }
+        
        result.pullBranch = pullBranch;
      } else {
        result.pullBranch = pullObj;
@ -129,8 +136,8 @@ class CreateMerge extends Component {
  //获取新建合并请求数据
  getMergeInfo = (branchParams,init) => {
    this.setState({ isSpin: true });
-    const { pullOwner, pullBranch, mergeOwner, mergeBranch, projectId } = branchParams;
-    const url = `/${pullOwner}/${projectId}/pulls/new.json`;
+    const { pullOwner, pullBranch, mergeOwner, mergeBranch, projectId , pullIdentity } = branchParams;
+    const url = `/${pullOwner}/${pullIdentity || projectId}/pulls/new.json`;
    axios.get(url).then((result) => {
      if (result) {
        if(init){
@ -161,9 +168,9 @@ class CreateMerge extends Component {
  };

  checkBranch=async(branchParams)=>{
-    const { mergeBranch , mergeOwner, projectId , pullBranch ,pullOwner} = branchParams;
+    const { mergeBranch , mergeOwner, projectId , pullBranch ,pullOwner,pullIdentity} = branchParams;
    let getbranch =await this.getBranchList(mergeOwner,projectId,pullBranch,mergeBranch,"merge");
-    let checkpull =await this.getBranchList(pullOwner,projectId,pullBranch,mergeBranch,"pull");
+    let checkpull =await this.getBranchList(pullOwner,pullIdentity || projectId,pullBranch,mergeBranch,"pull");
    if(getbranch && checkpull){
      this.compareProject(mergeOwner === pullOwner, branchParams,1);
    }else{
@ -175,12 +182,12 @@ class CreateMerge extends Component {

  // compare接口，获取分支对比信息
  compareProject = (sameProject, branchParams ,page) => {
-    const { pullOwner, pullBranch, mergeOwner, mergeBranch, projectId } = branchParams;
+    const { pullOwner, pullBranch, mergeOwner, mergeBranch, projectId , pullIdentity } = branchParams;
    let url = `/${mergeOwner}/${projectId}/compare`;
    if (sameProject) {
      url += `/${Base64.encode(returnbar(pullBranch))}...${Base64.encode(returnbar(mergeBranch))}.json`;
    } else {
-      url += `/${Base64.encode(returnbar(mergeBranch))}...${pullOwner}/${projectId}:${Base64.encode(returnbar(pullBranch))}.json`;
+      url += `/${Base64.encode(returnbar(mergeBranch))}...${pullOwner}/${pullIdentity || projectId}:${Base64.encode(returnbar(pullBranch))}.json`;
    }
    axios
      .get(url,{
@ -235,11 +242,11 @@ class CreateMerge extends Component {
        }
        if(type === "merge" && mfilter){
          const {projectDetail,location,history}=this.props;
-          const { pullOwner, pullBranch, mergeOwner, mergeBranch, projectId } =
+          const { pullOwner, pullBranch, mergeOwner, mergeBranch, projectId , pullIdentity } =
          getBranchParams(location.pathname);
          // 如果进来的第一次，查到目标分支不存在，自动切换到目标仓库默认分支
          if (pullOwner !== mergeOwner && pullBranch=== mergeBranch) {
-            let _url = `/${mergeOwner}/${projectId}/compare/${(projectDetail?projectDetail.default_branch:'master')}...${pullOwner}:${(pullBranch)}`;
+            let _url = `/${mergeOwner}/${projectId}/compare/${(projectDetail?projectDetail.default_branch:'master')}...${pullOwner}/${pullIdentity || projectId}:${(pullBranch)}`;
            history.push(_url);
            return false;
          }else{
@ -263,7 +270,7 @@ class CreateMerge extends Component {

  // 切换分支事件
  selectBrach = (type, value) => {
-    const { pullOwner, pullBranch, mergeOwner, mergeBranch, projectId } =
+    const { pullOwner, pullBranch, mergeOwner, mergeBranch, projectId , pullIdentity } =
      getBranchParams(this.props.location.pathname);
    let _url = `/${mergeOwner}/${projectId}/compare/`;
    // type为pull时，pullBranch取value，否则取原有值
@ -275,7 +282,7 @@ class CreateMerge extends Component {
      _url += `${turnbar(_mergeBranch)}...${turnbar(_pullBranch)}`;
    } else {
      // 如果仓库不同, compare/目标分支...源分支
-      _url += `${turnbar(_mergeBranch)}...${pullOwner}:${turnbar(_pullBranch)}`;
+      _url += `${turnbar(_mergeBranch)}...${pullOwner}/${pullIdentity || projectId}:${turnbar(_pullBranch)}`;
    }
    this.props.history.push(_url);
  };
@ -283,7 +290,7 @@ class CreateMerge extends Component {
  // 切换仓库响应事件，目前仅目标分支可切换仓库
  selectProjectName = (value, isChangeProject, initPro) => {
    const { projects_names, id } = isChangeProject ? this.state : initPro;
-    const { pullOwner, pullBranch } = getBranchParams(
+    const { pullOwner, pullBranch , pullIdentity , projectId } = getBranchParams(
      this.props.location.pathname
    );
    let arr =
@ -315,7 +322,7 @@ class CreateMerge extends Component {
        );
      } else {
        this.props.history.push(
-          `/${login}/${identifier}/compare/${branch}...${pullOwner}:${turnbar(pullBranch)}`
+          `/${login}/${identifier}/compare/${branch}...${pullOwner}/${pullIdentity || projectId}:${turnbar(pullBranch)}`
        );
      }
    }
--- a/src/forge/Merge/merge.js
+++ b/src/forge/Merge/merge.js
@ -233,7 +233,7 @@ class merge extends Component {
    const { projectsId,owner } = this.props.match.params;
    let branch = turnbar(defaultBranch) || "master";
    if (projectDetail && projectDetail.fork_info) {
-      this.props.history.push(`/${projectDetail.fork_info.fork_project_user_login}/${projectDetail.fork_info.fork_project_identifier}/compare/${branch}...${owner + ':' + branch}`)
+      this.props.history.push(`/${projectDetail.fork_info.fork_project_user_login}/${projectDetail.fork_info.fork_project_identifier}/compare/${branch}...${owner + '/' + projectsId +':' + branch}`)
    } else {
      this.props.history.push(`/${owner}/${projectsId}/compare/${branch}...${branch}`);
    }
--- a/src/forge/New/Index.js
+++ b/src/forge/New/Index.js
@ -97,7 +97,7 @@ class Index extends Component {
          owner = owner.filter(item=>item.id === user_id);
        }
        this.props.form.setFieldsValue({
-          user_id:owner && owner[0].name
+          user_id:owner && owner[0].id
        })
        owner && this.setState({
          owners_id:owner[0].id,
@ -223,7 +223,7 @@ class Index extends Component {
          project_category_id:categoreFlag ? project_category_id : undefined,
          license_id:licenseFlag ? license_id : undefined,
          ignore_id:ignoreFlag ? ignore_id : undefined,
-          user_id:owners_id,
+          // user_id:owners_id,
          blockchain: tokenConTri,
          blockchain_token_all: 10000,
          blockchain_init_token: parseInt(blockchain_init),
--- a/src/forge/Newfile/UserSubmitComponent.js
+++ b/src/forge/Newfile/UserSubmitComponent.js
@ -120,16 +120,16 @@ class UserSubmitComponent extends Component {

  // 确认修改文件
  UpdateFile = () => {
-    this.setState({ isSpin: true });
-    const { branch, detail, content , currentBranch ,checkName } = this.props;
+    const { branch, detail, content , currentBranch ,checkName , changeValueFlag } = this.props;
    const { projectsId , owner } = this.props.match.params;
+    this.setState({ isSpin: true });
    const { submitType } = this.state;
    const url = `/${owner}/${projectsId}/update_file.json`;
    let b = currentBranch || branch;
    this.props.form.validateFieldsAndScroll((err, values) => {
      if (!err && !checkName) {
-        axios
-          .put(url, {
+        if(changeValueFlag){
+          axios.put(url, {
            filepath: returnbar(detail.path),
            base64_filepath:Base64.encode(returnbar(detail.path)),
            branch: submitType === "1" ? undefined : returnbar(b),
@ -141,10 +141,10 @@ class UserSubmitComponent extends Component {
          .then((result) => {
            this.setState({ isSpin: false });
            if (result.data && result.data.status === 1) {
-              let b = currentBranch || branch;
              window.scrollTo(0,0);
-              let url = `/${owner}/${projectsId}${(values.branchname ? `/tree/${turnbar(values.branchname)}` : (b ? `/tree/${turnbar(b)}`:""))}${detail.path ? `/${returnbar(detail.path)}` : ""}`;
-              this.props.history.push(url);
+              let b = currentBranch || branch;
+              let src = `/${owner}/${projectsId}${(values.branchname ? `/tree/${turnbar(values.branchname)}` : (b ? `/tree/${turnbar(b)}`:""))}${detail.path ? `/${returnbar(detail.path)}` : ""}`;
+              this.props.history.push(src);
              this.props.showNotification("文件修改成功!");
            }
          })
@ -152,8 +152,14 @@ class UserSubmitComponent extends Component {
            this.setState({ isSpin: false });
            console.log(error);
          });
+        }else{
+          window.scrollTo(0,0);
+          let b = currentBranch || branch;
+          let src = `/${owner}/${projectsId}${(values.branchname ? `/tree/${turnbar(values.branchname)}` : (b ? `/tree/${turnbar(b)}`:""))}${detail.path ? `/${returnbar(detail.path)}` : ""}`;
+          this.props.history.push(src);
+        }
      } else {
-        this.setState({ isSpin: false });
+          this.setState({ isSpin: false });
      }
    });
  };
--- a/src/forge/Newfile/m_editor.js
+++ b/src/forge/Newfile/m_editor.js
@ -65,7 +65,7 @@ class m_editor extends Component {
          {!readOnly ?
            <CodeMirror
              placeholder="请输入内容"
-              value={md ? editorValue : Base64.decode(editorValue)}
+              value={editorValue}
              options={editor_options}
              onChange={this.changeEditor}
            /> :
@ -86,6 +86,7 @@ class m_editor extends Component {
              onEmpty={onEmpty}
              empty={empty}
              filename={filename}
+              changeValueFlag={this.props.content !== changeValue}
            ></UserSubmitComponent>
          </div>
        )}
--- a/src/forge/Order/MilepostDetail.jsx
+++ b/src/forge/Order/MilepostDetail.jsx
@ -17,8 +17,6 @@ function MilepostDetail(props){
  const [ closedCount , setClosedCount ] = useState(0);
  const [ openedCount , setOpenedCount ] = useState(0);

-  const[ aboutMe , setAboutMe ] = useState("aboutme");
-  const[ keyword , setKeyword ] = useState(undefined);

  const [ category , setCategory] = useState("opened");

@ -32,6 +30,8 @@ function MilepostDetail(props){
  const [ total , setTotal ] = useState(undefined);
  const [ issuesCount, setIssueCount] = useState(undefined);

+  const [ chooseValue, setChooseValue ] = useState(undefined);
+
  const menuRef = useRef(null);
  const { projectsId, mileId , owner } = props.match.params;
  const {current_user, projectDetail, showLoginDialog, history} = props;
@ -47,8 +47,8 @@ function MilepostDetail(props){
  }

  useEffect(()=>{
-    Init();
-  },[aboutMe, keyword, category, page, limit])
+    Init(chooseValue);
+  },[category, page, limit])

  useEffect(()=>{
    updateDocumentTitle()
@ -91,20 +91,6 @@ function MilepostDetail(props){
    }).then(error=>{console.log("error:",error)})
  }

-  // 第一个下拉搜索
-  const menu = (
-    <Menu selectedKeys={[`${aboutMe}`]} onClick={chooseAboutMe}>
-      <Menu.Item key={"all"}>全部</Menu.Item>
-      <Menu.Item key={"aboutme"}><Tooltip title="指我创建的、我负责的和@我的疑修">与我相关</Tooltip></Menu.Item>
-      <Menu.Item key={"assignedme"}>我负责的</Menu.Item>
-      <Menu.Item key={"authoredme"}>我创建的</Menu.Item>
-      <Menu.Item key={"atme"}>@我的</Menu.Item>
-    </Menu>
-  )
-  function chooseAboutMe(e){
-    setCategory("all");
-    setAboutMe(e.key);
-  }

  // 全选所有issue
  function chooseAll(e){
@ -156,16 +142,20 @@ function MilepostDetail(props){
  // 切换页码
  function changepage(page){
    setPage(page);
+    window.scrollTo(0,0);
  }

  function chooseFunc(ids){
    if(allValue && allValue.length>0){
      // 将ids保存下来以便修改
      setUpdateIds(ids);
+      setChooseValue(undefined);
    }else{
      const {sort_by} = ids;
      const params = {...ids, ...sortBy[sort_by]}
-      Init(params);
+      setChooseValue(params);
+      page===1 && Init(params);
+      setPage(1);
    }
  }

--- a/src/forge/Settings/Webhooks/Index.jsx
+++ b/src/forge/Settings/Webhooks/Index.jsx
@ -79,8 +79,8 @@ function Index(props) {
  }

  function addFunc() {
-    if(totalByUserCreate >= 20){
-      return props.showNotification("您创建的Webhook数量已达到上线！请删除部分Webhook以进行添加操作");
+    if(totalByUserCreate >= 50){
+      return props.showNotification("webhooks数量已到上限！请删除暂不使用的webhooks以进行添加操作");
    }
    props.history.push(`/${owner}/${projectsId}/settings/webhooks/new`)
  }
--- a/src/images/img-error.png
+++ b/src/images/img-error.png
--- a/src/modules/tpm/challengesnew/tpm-md-editor.js
+++ b/src/modules/tpm/challengesnew/tpm-md-editor.js
@ -766,7 +766,7 @@ export default ({ mdID, onChange, onCMBeforeChange, onCMBlur, error = false, cla
          {quoteVisible && QuoteDiv }
          {atWhoVisible && atWhoList}
          <textarea style={{ display: 'none' }} id={editorBodyId} name="content"></textarea>
-          <div className="CodeMirror cm-s-defualt"></div>
+          <div className="CodeMirror cm-s-defualt" style={{ display: 'none' }}></div>
        </div>
      </div>
      {showResizeBar ? <a ref={resizeBarEl} className='editor-resize'></a> : null}