diff --git a/src/forge/Information/Pages/headerPage.jsx b/src/forge/Information/Pages/headerPage.jsx
index 7cfcb38c8..34d9b1d11 100644
--- a/src/forge/Information/Pages/headerPage.jsx
+++ b/src/forge/Information/Pages/headerPage.jsx
@@ -113,7 +113,7 @@ function HeaderPage(props){
                   <li>
                     {i.projectProperties && i.projectProperties.authorImageUrl && <img src={i.projectProperties.authorImageUrl} alt="" /> }
                     <div>
-                      <a  onClick={()=>window.open(i.projectURL)} className="z_p_title">{i.fullName}</a>
+                      <a  onClick={()=>window.open(i.projectURL)} className="z_p_title">{i.projectProperties && i.projectProperties.fullName}</a>
                        <p className="z_p_desc task-hide-2">{i.projectProperties && i.projectProperties.description ? i.projectProperties.description : "暂无~"}</p>
                     </div>
                   </li>
diff --git a/src/forge/Information/Pages/main.jsx b/src/forge/Information/Pages/main.jsx
index 073e1bfe4..dcab30b54 100644
--- a/src/forge/Information/Pages/main.jsx
+++ b/src/forge/Information/Pages/main.jsx
@@ -1,8 +1,8 @@
 import React , { useState , useEffect } from 'react';
 import Banner from '../Component/publicBanner';
-import { Menu } from 'antd';
+import { Menu , Spin , Skeleton } from 'antd';
 import Hot from '../Component/hot';
-import { Box , LongWidth  } from '../../Component/layout';
+import { Box , LongWidth } from '../../Component/layout';
 import { Link } from 'react-router-dom';
 import guideArrow from '../img/guideArrow.png';
 import axios from 'axios';
@@ -16,11 +16,13 @@ function Main(props){
   const [ key , setKey ] = useState("1");
   const [ mainList , setMainList ] = useState(undefined);
   const [ hotList , setHotList ] = useState(undefined);
+  const [ isSpin , setIsSpin ] = useState(true);
   const { deptId } = props.match.params;
 
 
   useEffect(()=>{
     if(deptId) {
+      setIsSpin(true);
       getMainList();
       getHotList();
     }
@@ -31,6 +33,7 @@ function Main(props){
     axios.get(url).then(result=>{
       if(result){
         setMainList(result.data.rows);
+        setIsSpin(false);
       }
     }).catch(error=>{})
   }
@@ -67,57 +70,65 @@ function Main(props){
             }
           </Menu>
         }
+        {
+          !mainList && <div className="boxmain" style={{height:105}}><Skeleton /></div>
+        }
         <div style={{width:'1200px',margin:"0px auto"}}>
           <Box>
             <LongWidth>
-              {
-                mainList && mainList.length>0 &&
-                mainList.map((i,k)=>{
-                  return(
-                    <div className="main_card radius4" id={`main_card_item_${k+1}`}>
-                      <div className="guide">
-                        <span>{i.name}</span>
-                        <Link to={`/information/${deptId}/news/${i.id}`}>更多<img src={guideArrow} alt="" width="14px"/></Link>
-                      </div>
-                      <div>
-                        {
-                          i.cmsDocList && i.cmsDocList.length>0 ? 
-                          i.cmsDocList.map((j,e)=>{
-                            return(
-                              <div className="main_card_item">
-                                {e===0 && 
-                                  (
-                                    i.headImg ?
-                                    <img src={i.headImg} alt=""/>
-                                    :
-                                    <DefaultImg name="GitLink" title="栏目一" />
-                                  )
-                                }
-                                <div style={{flex:1,width:0}}>
-                                  <Link to={`/information/${deptId}/newdetail/${j.id}`} className={`sub_name ${e===0? "":"sub_i"}`}>{j.name}</Link>
-                                  <p className={`sub_desc ${e===0? "task-hide-2":"task-hide"}`}>
-                                  {j.summary}
-                                  </p>
-                                  <div className="sub_info">
-                                    <span><img src={shijian} alt="" />{j.publishTime}</span>
-                                    <span><img src={liulan} alt="" />{j.visits}</span>
+              <Spin spinning={isSpin}>
+                <div style={{minHeight:"400px"}}>
+                {
+                  mainList && mainList.length>0 &&
+                  mainList.map((i,k)=>{
+                    return(
+                      <div className="main_card radius4" id={`main_card_item_${k+1}`}>
+                        <div className="guide">
+                          <span>{i.name}</span>
+                          <Link to={`/information/${deptId}/news/${i.id}`}>更多<img src={guideArrow} alt="" width="14px"/></Link>
+                        </div>
+                        <div>
+                          {
+                            i.cmsDocList && i.cmsDocList.length>0 ? 
+                            i.cmsDocList.map((j,e)=>{
+                              return(
+                                <div className="main_card_item">
+                                  {e===0 && 
+                                    (
+                                      i.headImg ?
+                                      <img src={i.headImg} alt=""/>
+                                      :
+                                      <DefaultImg name="GitLink" title="栏目一" />
+                                    )
+                                  }
+                                  <div style={{flex:1,width:0}}>
+                                    <Link to={`/information/${deptId}/newdetail/${j.id}`} className={`sub_name ${e===0? "":"sub_i"}`}>{j.name}</Link>
+                                    <p className={`sub_desc ${e===0? "task-hide-2":"task-hide"}`}>
+                                    {j.summary}
+                                    </p>
+                                    <div className="sub_info">
+                                      <span><img src={shijian} alt="" />{j.publishTime}</span>
+                                      <span><img src={liulan} alt="" />{j.visits}</span>
+                                    </div>
                                   </div>
                                 </div>
-                              </div>
-                            )
-                          })
-                          :
-                          <div style={{display:"flex",justifyContent:"center",alignItems:"center",flexDirection:"column",height:300}}>
-                            <img src={emptydata} alt="" width="230"/>
-                            <p className="font-15 color-grey-6 mt20">暂无数据~</p>
-                          </div>
-                        }
+                              )
+                            })
+                            :
+                            <div style={{display:"flex",justifyContent:"center",alignItems:"center",flexDirection:"column",height:300}}>
+                              <img src={emptydata} alt="" width="230"/>
+                              <p className="font-15 color-grey-6 mt20">暂无数据~</p>
+                            </div>
+                          }
+                        </div>
                       </div>
-                    </div>
-                  )
-                })
-              }
+                    )
+                  })
+                }
+                </div>
+              </Spin>
             </LongWidth>
+
             <div className="short_width radius4">
               <Hot title={"热门领域资讯"} list={hotList}/>
             </div>
diff --git a/src/forge/Information/Pages/projectSource.jsx b/src/forge/Information/Pages/projectSource.jsx
index 97bf2a301..8bd1edd63 100644
--- a/src/forge/Information/Pages/projectSource.jsx
+++ b/src/forge/Information/Pages/projectSource.jsx
@@ -112,7 +112,7 @@ function ProjectSource(props){
                             {i.projectProperties && <img src={i.projectProperties.authorImageUrl} alt="" className="author_img"/> }
                             <div style={{flex:"1"}}>
                               <p className="in_b_main">
-                                <a onClick={()=>window.open(i.projectURL)}>{i.fullName}</a>
+                                <a onClick={()=>window.open(i.projectURL)}>{i.projectProperties && i.projectProperties.fullName}</a>
                                 {
                                   i.projectProperties && 
                                   <ul>
diff --git a/src/forge/Information/Pages/zoneVIP.jsx b/src/forge/Information/Pages/zoneVIP.jsx
index d5edbedfd..76aafeed3 100644
--- a/src/forge/Information/Pages/zoneVIP.jsx
+++ b/src/forge/Information/Pages/zoneVIP.jsx
@@ -1,13 +1,67 @@
-import React from 'react';
+import React , { useState , useEffect } from 'react';
+import Crown from '../img/crown.png';
+import axios from 'axios';
 
 
 function ZoneVIP(props){
   const { deptId } = props.match.params;
+  const [ vipLists , setVIPLists ] = useState(undefined);
+
+  useEffect(()=>{
+    if(deptId){
+      getLists();
+    }
+  },[deptId])
+
+  function getLists(){
+    const url = `/zone/open/${deptId}/member/overviewList`;
+    axios.get(url).then(response=>{
+      if(response){
+        setVIPLists(response.data.rows);
+      }
+    }).catch(error=>{})
+  }
 
   return(
     <div className="boxmain zone_VIP_box">
       <p className="in_title">专区会员</p>
       <p className="vip_sub_title">社区根据您的贡献与扮演角色将用户划分成为不同的人员团队，并构建会员成长体系。您有兴趣成为会员，尽情发挥创意与智慧，与专区共同成长吗？</p>
+      {
+        vipLists && vipLists.length> 0 &&
+        <div className="vip_list">
+          {
+            vipLists.map((i,k)=>{
+              return(
+                <div className="vip_list_card">
+                  <div className="card_title">
+                    <img src={Crown} alt="" width="37px" style={{marginBottom:5,marginRight:5}}/>
+                    <span>{i.typeName}</span>
+                  </div>
+                  <p className="card_desc">{i.typeIntroduction}</p>
+                  {
+                    i.zoneMemberList && i.zoneMemberList.length > 0 &&
+                    <ul className="card_ul">
+                      {
+                        i.zoneMemberList.map((j,key)=>{
+                          return(
+                            <li className="card_u_li">
+                              <img src={j.imageUrl} alt="" />
+                              <div className="card_u_info">
+                                <div className="card_u_up"><span className="card_name task-hide">{j.name}</span>{j.memberLevel && <span className="card_tag">{j.memberLevel}</span> }</div>
+                                <p className="card_u_down task-hide-2">{j.introduction}</p>
+                              </div>
+                            </li>
+                          )
+                        })
+                      }
+                    </ul>
+                  }
+                </div>
+              )
+            })
+          }
+        </div>
+      }
     </div>
   )
 }
diff --git a/src/forge/Information/img/color1.png b/src/forge/Information/img/color1.png
index 41736614b..6826947a7 100644
Binary files a/src/forge/Information/img/color1.png and b/src/forge/Information/img/color1.png differ
diff --git a/src/forge/Information/img/crown.png b/src/forge/Information/img/crown.png
new file mode 100644
index 000000000..06f692d80
Binary files /dev/null and b/src/forge/Information/img/crown.png differ
diff --git a/src/forge/Information/index.scss b/src/forge/Information/index.scss
index 4fc305386..5551a0c2e 100644
--- a/src/forge/Information/index.scss
+++ b/src/forge/Information/index.scss
@@ -759,7 +759,103 @@
     font-size:15px;
     line-height:27px;
     text-align:center;
-    margin-top: 16px;
     max-width: 1000px;
+    word-break: break-all;
+    margin:16px auto 0px;
+  }
+  .vip_list{
+    
+    .vip_list_card{
+      background-color:#fefefe;
+      border-radius:4px;
+      box-shadow:0px 0px 15px rgba(35, 54, 185, 0.09);
+      padding:0px 40px 10px;
+      margin:35px 0px 15px;
+      &:nth-child(4n+1) .card_title{
+        background-color: #466aff;
+      }
+      &:nth-child(4n+2) .card_title{
+        background-color: #07a583;
+      }
+      &:nth-child(4n+3) .card_title{
+        background-color: #8257e8;
+      }
+      &:nth-child(4n+4) .card_title{
+        background-color: #cb7e4b;
+      }
+      .card_title{
+        height: 49px;
+        display: flex;
+        align-items: center;
+        width: 450px;
+        justify-content: center;
+        color: #fff;
+        border-radius: 0px 0px 20px 20px;
+        margin:0px auto;
+        font-weight:500;
+        font-size:17px;
+        background-color: #466aff;
+      }
+      .card_desc{
+        color:#1f2329;
+        font-size:15px;
+        line-height:32px;
+        word-break: break-all;
+        margin-top: 32px;
+      }
+      .card_ul{
+        margin-top: 15px;
+        padding-bottom: 10px;
+        .card_u_li{
+          display: flex;
+          padding:25px 0px;
+          border-bottom: 1px dashed rgba(141, 149, 172,0.27);
+          align-items: center;
+          &:last-child{
+            border-bottom: none;
+          }
+          &>img{
+            width: 100px;
+            height: 100px;
+            border-radius: 10px;
+            margin-right: 24px;
+          }
+          .card_u_info{
+            .card_u_down{
+              color:#4c5876;
+              font-size:15px;
+              line-height:26px;
+              word-break: break-all;
+              margin-top: 15px;
+            }
+            .card_u_up{
+              display: flex;
+              align-items: center;
+              .card_name{
+                font-weight:700;
+                color:#1f2329;
+                font-size:16px;
+                display: block;
+                max-width: 700px;
+                height:26px;
+                line-height: 26px;
+              }
+              .card_tag{
+                display: inline-block;
+                height:26px;
+                background-color:rgba(70, 106, 255, 0.13);
+                border-radius:2px;
+                min-width: 76px;
+                text-align: center;
+                line-height: 26px;
+                color:#466aff;
+                font-size:15px;
+                margin-left: 15px;
+              }
+            }
+          }
+        }
+      }
+    }
   }
 }
\ No newline at end of file