代码库页面设计规范调整 #2532

src/forge/About/Index.jsx

@@ -68,13 +68,14 @@ function Index(props){
   return(
     <div className="aboutPanels">
       <div className="aboutContent">
-        <AlignCenterBetween style={{padding:"14px 20px"}}>
-          <span className="font-16"><i className="iconfont icon-xiangmujianjie mr5 font-16 color-blue"></i>项目概览</span>
-          { editOpration && !edit && <a onClick={editContent} className="color-blue">编辑</a> }
-        </AlignCenterBetween>
+        <div className="aboutTitle">
+          <span className="font-16">项目概览</span>
+          { editOpration && !edit && <a onClick={editContent} className="color-blue">
+            <i className="iconfont icon-a-bianji12 mr5 font-13 color-blue"></i>编辑</a> }
+        </div>
         {
           edit ? 
-          <div className="padding20">
+          <div className="padding20 boies">
             <MDEditor
               placeholder={"请输入描述信息"}
               height={500}
@@ -113,7 +114,7 @@ function Index(props){
             </div>
           </div>
           :
-          <div className="padding20">
+          <div className="padding20 boies">
             {content ? 
               <RenderHtml className="break_word_comments imageLayerParent" value={content} url={props.history.location}/>
               :

src/forge/About/index.scss

@@ -3,10 +3,25 @@
   margin:0px auto;
   .aboutContent{
     border-radius: 2px;
-    border: 1px solid #EEEEEE;
+    // border: 1px solid #EEEEEE;
     width:100%;
     background-color: #fff;
     margin-top:20px;
     margin-bottom: 30px;
+    .aboutTitle{
+      height: 50px;
+      background-color: #fafcff;
+      border: 1px solid;
+      border-color: rgba(42, 97, 255, 0.23);
+      border-radius: 4px 4px 0px 0px;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      padding:0px 20px;
+    }
+    .boies{
+      border: 1px solid #d0d0d0;
+      border-top: none;
+    }
   }
 }

src/forge/Activity/Activity.js

@@ -186,75 +186,76 @@ class Activity extends Component{
       <div className="contentBox mt20">
         <div className="normalBox">
           <div class="normalBox-title">概览</div>
-
-          <div className="orderInfo">
-            <div>
-              <div className="percentLine prPercent">
-                <p className="percent_purple" style={{width:first_per}}></p>
-                <p className="percent_green resetStyle" style={{width:`${second_per}`}}></p>
+          <div className="boxpart">
+            <div className="orderInfo">
+              <div>
+                <div className="percentLine prPercent">
+                  <p className="percent_purple" style={{width:first_per}}></p>
+                  <p className="percent_green resetStyle" style={{width:`${second_per}`}}></p>
+                </div>
+                <span>{data && data.pr_all_count}合并请求</span>
               </div>
-              <span>{data && data.pr_all_count}合并请求</span>
-            </div>
-            <div>
-              <div className="percentLine">
-                <p className="percent_red" style={{width:`${third_per}`}}></p>
-                <p className="percent_green" style={{width:`${fourth_per}`}}></p>
+              <div>
+                <div className="percentLine">
+                  <p className="percent_red" style={{width:`${third_per}`}}></p>
+                  <p className="percent_green" style={{width:`${fourth_per}`}}></p>
+                </div>
+                <span>{data && data.issues_count}疑修</span>
               </div>
-              <span>{data && data.issues_count}疑修</span>
             </div>
+            <ul className="percentBox">
+              <li>
+                <span className="purple">{data && data.pr_count}</span>
+                <span className={type==="PullRequest" && status==="delay" ?`change active`:"change"} onClick={()=>this.changeTrends("PullRequest","delay")}>已处理的合并请求</span>
+              </li>
+              <li>
+                <span className="green">{data && data.new_pr_count}</span>
+                <span className={type==="PullRequest"&& status==="not_delay" ?`change active`:"change"} onClick={()=>this.changeTrends("PullRequest","not_delay")}>未处理的合并请求</span>
+              </li>
+              <li>
+                <span className="red">{data && data.close_issues_count}</span>
+                <span className={type==="Issue"&& status==="delay" ?`change active`:"change"} onClick={()=>this.changeTrends("Issue","delay")}>已关闭的疑修</span>
+              </li>
+              <li>
+                <span className="green">{data && data.open_issues_count}</span>
+                <span className={type==="Issue"&& status==="not_delay" ?`change active`:"change"} onClick={()=>this.changeTrends("Issue","not_delay")}>未处理的疑修</span>
+              </li>
+            </ul>
+            {
+              codeStatus && 
+              <div className="prMsg">
+                <div><span className="fontbold">{codeStatus.author_count}位作者</span> 已经推送 <span className="fontbold">{codeStatus.commit_count}次提交</span> 到 
+                {codeStatus.commit_count_in_all_branches && codeStatus.commit_count_in_all_branches>0?<span> {projectDetail && projectDetail.default_branch}分支 和 <span>{codeStatus.commit_count_in_all_branches}次提交</span> 到所有分支</span>:""}。 在 {projectDetail && projectDetail.default_branch}分支上， 
+                {codeStatus.change_files && codeStatus.change_files >0 ? <span><span className="fontbold">{codeStatus.change_files} 个文件</span> 已经改变 而且</span>:""} 
+                {codeStatus.additions && codeStatus.additions >0 ?<span><span className="fontbold greencount">新增 {codeStatus.additions} 行代码</span></span>:""} 
+                {(codeStatus.additions && codeStatus.additions >0) &&(codeStatus.deletions && codeStatus.deletions >0) ?<span> 和</span>:""}
+                {codeStatus.deletions && codeStatus.deletions >0 ?<span><span className="fontbold redcount"> 删除 {codeStatus.deletions} 行代码</span></span>:""}.</div>
+                {/* {
+                  codeStatus.authors && codeStatus.authors.length > 0 &&
+                  <ul className="prAuthor">
+                    {
+                      codeStatus.authors.map((i,v)=>{
+                        return(
+                          i.author ?
+                            !i.author.id ?
+                            <span>
+                              <img src={getImageUrl(i.author && i.author.image_url)} width="38px" height="38px" alt=""/>
+                              <Tooltip title={i.author && i.author.name} placement="bottom"><span>{i.author && i.author.name}</span></Tooltip>
+                            </span>
+                            :
+                            <a href={i.author.login ? `/${i.author.login}` : `mailto:${i.author.email}`}>
+                              <img src={getImageUrl(i.author && i.author.image_url)} width="38px" height="38px" alt=""/>
+                              <Tooltip title={i.author && i.author.name} placement="bottom"><span>{i.author && i.author.name}</span></Tooltip>
+                            </a>
+                          :""
+                        )
+                      })
+                    }
+                  </ul>
+                } */}
+              </div>
+            }
           </div>
-          <ul className="percentBox">
-            <li>
-              <span className="purple">{data && data.pr_count}</span>
-              <span className={type==="PullRequest" && status==="delay" ?`change active`:"change"} onClick={()=>this.changeTrends("PullRequest","delay")}>已处理的合并请求</span>
-            </li>
-            <li>
-              <span className="green">{data && data.new_pr_count}</span>
-              <span className={type==="PullRequest"&& status==="not_delay" ?`change active`:"change"} onClick={()=>this.changeTrends("PullRequest","not_delay")}>未处理的合并请求</span>
-            </li>
-            <li>
-              <span className="red">{data && data.close_issues_count}</span>
-              <span className={type==="Issue"&& status==="delay" ?`change active`:"change"} onClick={()=>this.changeTrends("Issue","delay")}>已关闭的疑修</span>
-            </li>
-            <li>
-              <span className="green">{data && data.open_issues_count}</span>
-              <span className={type==="Issue"&& status==="not_delay" ?`change active`:"change"} onClick={()=>this.changeTrends("Issue","not_delay")}>未处理的疑修</span>
-            </li>
-          </ul>
-          {
-            codeStatus && 
-            <div className="prMsg">
-              <div><span className="fontbold">{codeStatus.author_count}位作者</span> 已经推送 <span className="fontbold">{codeStatus.commit_count}次提交</span> 到 
-              {codeStatus.commit_count_in_all_branches && codeStatus.commit_count_in_all_branches>0?<span> {projectDetail && projectDetail.default_branch}分支 和 <span>{codeStatus.commit_count_in_all_branches}次提交</span> 到所有分支</span>:""}。 在 {projectDetail && projectDetail.default_branch}分支上， 
-              {codeStatus.change_files && codeStatus.change_files >0 ? <span><span className="fontbold">{codeStatus.change_files} 个文件</span> 已经改变 而且</span>:""} 
-              {codeStatus.additions && codeStatus.additions >0 ?<span><span className="fontbold greencount">新增 {codeStatus.additions} 行代码</span></span>:""} 
-              {(codeStatus.additions && codeStatus.additions >0) &&(codeStatus.deletions && codeStatus.deletions >0) ?<span> 和</span>:""}
-              {codeStatus.deletions && codeStatus.deletions >0 ?<span><span className="fontbold redcount"> 删除 {codeStatus.deletions} 行代码</span></span>:""}.</div>
-              {/* {
-                codeStatus.authors && codeStatus.authors.length > 0 &&
-                <ul className="prAuthor">
-                  {
-                    codeStatus.authors.map((i,v)=>{
-                      return(
-                        i.author ?
-                          !i.author.id ?
-                          <span>
-                            <img src={getImageUrl(i.author && i.author.image_url)} width="38px" height="38px" alt=""/>
-                            <Tooltip title={i.author && i.author.name} placement="bottom"><span>{i.author && i.author.name}</span></Tooltip>
-                          </span>
-                          :
-                          <a href={i.author.login ? `/${i.author.login}` : `mailto:${i.author.email}`}>
-                            <img src={getImageUrl(i.author && i.author.image_url)} width="38px" height="38px" alt=""/>
-                            <Tooltip title={i.author && i.author.name} placement="bottom"><span>{i.author && i.author.name}</span></Tooltip>
-                          </a>
-                        :""
-                      )
-                    })
-                  }
-                </ul>
-              } */}
-            </div>
-          }
         </div>
         {
           ai_shang_v1_url &&
@@ -280,7 +281,7 @@ class Activity extends Component{
         }
         <div className="commentsBox">
           <div className="trendsTop">
-            <span>疑修/合并请求记录</span>
+            <span className="font-16">疑修/合并请求记录</span>
             <div className="branchDropdown f-wrap-alignCenter">
               <Dropdown overlay={this.menu()} trigger={['click']} placement="bottomLeft">
                 <a className="ant-dropdown-link">

src/forge/Activity/activity.css

@@ -1,7 +1,9 @@
 .trendsTop{
-  padding:15px;
-  border-bottom:1px solid #ddd;
-  background-color: #f4f4f4;
+  background-color: #fafcff;
+  border: 1px solid;
+  border-color: rgba(42, 97, 255, 0.23);
+  border-radius: 4px 4px 0px 0px;
+  padding: 10px 20px;
   display: flex;
   align-items: center;
   justify-content: space-between;
@@ -29,6 +31,10 @@
   display: flex;
   justify-content: space-between;
 }
+.boxpart{
+  border: 1px solid #d0d0d0;
+  border-top: none;
+}
 .orderInfo > div{
   width: 45%;
 }
@@ -95,7 +101,7 @@
 }
 .commentsBox{
   border-radius: 4px;
-  border: 1px solid #ddd;
+  /* border: 1px solid #ddd; */
   margin: 20px 0px 20px 0px;
 }
 .prMsg{
@@ -140,6 +146,10 @@
   white-space: nowrap;
   text-overflow: ellipsis;
 }
+.activity_list{
+  border:1px solid #d0d0d0;
+  border-top: none;
+}
 .activity_list .activity_item{
   border-bottom: 1px solid #f4f4f4;
   padding:15px;

src/forge/Issues/index.scss

@@ -47,22 +47,6 @@
     background-color: #f3f4f6;
   }
 }
-// 操作按钮-蓝色
-.operateButton{
-  padding:0px 15px;
-  height:32px;
-  color: #fff!important;
-  cursor: pointer;
-  line-height: 30px;
-  background-color:rgba(70, 106, 255, 1);
-  border:1px solid rgba(70, 106, 255, 1);
-  border-radius: 4px;
-  display: block;
-  &:hover{
-    background-color:#708cff;
-    border-color:#708cff;
-  }
-}
 // flex-左右，上下居中
 .between{
   display: flex;
@@ -808,7 +792,7 @@
       }
     }
     li{
-      width: 100px;
+      width: 98px;
       height:32px;
       line-height:30px;
       text-align: center;

src/forge/Main/CoderDepot.jsx

@@ -63,7 +63,7 @@ function CoderDepot(props){
   const details = props.projectDetail;
   let pathname = props.history.location.pathname;
   //distribution：判断此用户是否可以创建发行版
-  const distribution = details && details.type != 2 && (details.permission === "Admin" || details.permission === "Owner" || details.permission === "Manager");
+  const distribution = details && details.type !== 2 && ( details.permission && details.permission !== "Reporter");
   const { bannerList } = props;
   useEffect(()=>{
     if(bannerList && bannerList.length>0){

src/forge/Merge/Index.scss

@@ -100,4 +100,12 @@
       }
     }
   }
+}
+.empBtn{
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-top: 60px;
+  padding-top: 20px;
+  border-top: 1px solid #F3F4F6;
 }

src/forge/Merge/merge.js

@@ -11,7 +11,7 @@ import { turnbar } from "educoder";
 import axios from "axios";
 import CheckProfile from '../Component/ProfileModal/Profile';
 
-const Search = Input.Search;
+const { Search } = Input;
 /**
  * issue_chosen:下拉的筛选列表,
  * data:列表接口返回的所有数据,
@@ -268,17 +268,14 @@ class merge extends Component {
     return (
       <div className="main mt20" style={{padding:"0px"}}>
         <div className="topWrapper" style={{borderBottom:"none",padding:"20px"}}>
-          <div className="target-detail-search">
-            <Search
-              placeholder="输入关键字搜索合并请求"
-              enterButton
-              onSearch={this.searchFunc}
-              style={{ width: 300 }}
-            />
-          </div>
+          <Search
+            placeholder="输入关键字搜索合并请求"
+            style={{ width: 354 , height : 32 }}
+            onSearch={this.searchFunc}
+          />
           {
             data && data.user_admin_or_developer &&
-            <CheckProfile {...this.props} className="topWrapper_btn ml10" sureFunc={() => this.checkOperation()}>
+            <CheckProfile {...this.props} className="operateButton ml10" sureFunc={() => this.checkOperation()}>
               +&nbsp;新建合并请求
             </CheckProfile>
           }

src/forge/Merge/no_data.js

@@ -1,5 +1,6 @@
 import React , { Component } from 'react';
 import { Link } from "react-router-dom";
+import None from '../Images/emp.png'
 class Nodata extends Component{
   render(){
     const { _html, projectsId , owner , user_admin_or_developer , defaultBranch} = this.props;
@@ -7,13 +8,19 @@ class Nodata extends Component{
       <div className="none_panels">
         <div>
           <div className="mb15">
-          <i className="iconfont icon-hebingqingqiu font-80 ver-middle color-grey-b"></i>
+          {/* <i className="iconfont icon-hebingqingqiu font-80 ver-middle color-grey-b"></i> */}
+          <img src={None} alt=""/>
           </div>
-          <h3>欢迎使用合并请求！</h3>
+          <p className="font-20">欢迎使用合并请求！</p>
         
-          <div className="color-grey-8">
-          合并请求可以帮助您与他人协作编写代码。{ user_admin_or_developer && <span>在使用之前，请先创建一个 <Link className="color-blue" to={`/${owner}/${projectsId}/compare/${defaultBranch}...${defaultBranch}`}>合并请求</Link></span> }
+          <div className="color-grey-8 mt10">
+          合并请求可以帮助您与他人协作编写代码。请先创建一个合并请求
           </div>
+          { user_admin_or_developer &&
+            <div className="empBtn">
+              <span><Link className="operateButton" to={`/${owner}/${projectsId}/compare/${defaultBranch}...${defaultBranch}`}>合并请求</Link></span>
+            </div>
+          }
         </div>
       </div>
     )

src/forge/Order/index.scss

@@ -1,5 +1,5 @@
 .screenWrap{
-  background:rgba(250,250,250,1);
+  background:#fafcff;
   border-top:1px solid rgba(221,221,221,1);
   border-bottom:1px solid rgba(221,221,221,1);
   padding-left: 20px;

src/forge/css/index.scss

@@ -146,16 +146,23 @@ ul,ol,dl{
 
 .normalBox{
   border-radius: 4px;
-  border:1px solid #ddd;
+  // border:1px solid #ddd;
 }
 .normalBox-title{
-  padding:10px;
-  background-color: #f4f4f4;
-  line-height: 18px;
+  background-color: #fafcff;
+  border: 1px solid;
+  border-color: rgba(42, 97, 255, 0.23);
+  border-radius: 4px 4px 0px 0px;
+  padding:0px 20px;
+  height: 48px;
+  display: flex;
+  align-items: center;
+  font-size: 16px;
 }
 .none_panels{
   text-align: center;
-  height: 400px;
+  min-height: 320px;
+  padding:40px 0px;
   display: flex;
   justify-content: center;
   align-items: center;
@@ -409,4 +416,22 @@ button.btngrey{
   .newTab .newBtnImg {
     right: -19px;
   }
+}
+
+
+// 操作按钮-蓝色
+.operateButton{
+  padding:0px 15px;
+  height:32px;
+  color: #fff!important;
+  cursor: pointer;
+  line-height: 30px;
+  background-color:rgba(70, 106, 255, 1);
+  border:1px solid rgba(70, 106, 255, 1);
+  border-radius: 4px;
+  display: block;
+  &:hover{
+    background-color:#708cff;
+    border-color:#708cff;
+  }
 }