activityItem

public/react/src/AppConfig.js

@@ -45,16 +45,7 @@ export function initAxiosInterceptors(props) {
     //      https://github.com/axios/axios/issues/1497
 
     // TODO 读取到package.json中的配置？
-			var //proxy = "http://localhost:3000"
-			 //proxy = "http://testbdweb.trustie.net"
-			 //proxy = "http://testbdweb.educoder.net"
-			// proxy = "https://testeduplus2.educoder.net"
-			//proxy="http://47.96.87.25:48080"
-			// proxy="https://pre-newweb.educoder.net"
-    //   proxy="https://test-newweb.educoder.net"
-      //proxy="https://test-jupyterweb.educoder.net"
-         //proxy="http://192.168.2.63:3001"
-          proxy="http://123.59.135.93:56666"
+			var proxy="http://localhost:3000";
 
     // 在这里使用requestMap控制，避免用户通过双击等操作发出重复的请求；
     // 如果需要支持重复的请求，考虑config里面自定义一个allowRepeat参考来控制

public/react/src/forge/Activity/Activity.js

@@ -6,6 +6,7 @@ import '../css/index.css';
 import '../Branch/branch.css';
 import './activity.css';
 
+import ActivityItem from './ActivityItem';
 import axios from 'axios';
 const LIMIT = 15;
 const ARRAY = [
@@ -26,6 +27,8 @@ const ARRAY = [
     name:'1个月'
   }
 ]
+const dataformat="YYYY-MM-DD HH:mm";
+
 class Activity extends Component{
   constructor(props){
     super(props);
@@ -35,7 +38,8 @@ class Activity extends Component{
       state:undefined,
       page:1,
 
-      data:undefined
+      data:undefined,
+      project_trends:undefined
     }
   }
   componentDidMount=()=>{
@@ -53,7 +57,8 @@ class Activity extends Component{
     }).then(result=>{
       if(result){
         this.setState({
-          data:result.data
+          data:result.data,
+          project_trends:result.data.project_trends
         })
       }
     }).catch(error=>{
@@ -62,13 +67,13 @@ class Activity extends Component{
   }
 
   // 切换周期
-  // changeTime=(e)=>{
-  //   this.setState({
-  //     time:e.key
-  //   })
-  //   const { type,status,page } = this.state;
-  //   this.getInfo(e.key,type,status,page);
-  // }
+  changeTime=(e)=>{
+    this.setState({
+      time:e.key
+    })
+    const { type,status,page } = this.state;
+    this.getInfo(e.key,type,status,page);
+  }
 
   // 分页
   ChangePage=(page)=>{
@@ -79,7 +84,7 @@ class Activity extends Component{
     this.getInfo(time,type,status,page);
   }
   render(){
-    const { time , data , page } = this.state;
+    const { time , data , page , project_trends } = this.state;
 
     const menu = (
       <Menu>
@@ -94,6 +99,7 @@ class Activity extends Component{
     );
 
     
+    const second_per = (parseInt(data && data.close_issues_count)/parseInt(data && data.issues_count)*100)+'%';
 
     const third_per = (parseInt(data && data.close_issues_count)/parseInt(data && data.issues_count)*100)+'%';
     const fourth_per = (parseInt(data && data.open_issues_count)/parseInt(data && data.issues_count)*100)+'%';
@@ -104,9 +110,9 @@ class Activity extends Component{
           <div class="normalBox-title">概览</div>
           <div className="orderInfo">
             <div>
-              <div className="percentLine">
-                <p className="percent_purple" style={{width:'20%'}}></p>
-                <p className="percent_green" style={{width:'80%'}}></p>
+              <div className="percentLine prPercent">
+                <p className="percent_purple" style={{width:'100%'}}></p>
+                <p className="percent_green resetStyle" style={{width:`${second_per}`}}></p>
               </div>
               <span>{data && data.pr_count}合并请求</span>
             </div>
@@ -148,17 +154,13 @@ class Activity extends Component{
           </div>
         </div>
         <div className="activity_list">
-          <div className="activity_item">
-            <p>
-              <span className="activity_type">ISSUE</span>
-              <span className="color-blue">title</span>
-            </p>
-            <p>
-              <img alt="" src=""/>
-              <span>caicai</span>
-              <span className="color-grey-9">创建于<span className="ml2 color-grey-6">{moment('2019-01-18 18:00','')}</span></span>
-            </p>
-          </div>
+          {
+            project_trends && project_trends.map((item,key)=>{
+              return(
+                <ActivityItem item={item}></ActivityItem>
+              )
+            })
+          }
         </div>
         {
           data && data.project_trends_size > 0 && data.project_trends_size > LIMIT &&

public/react/src/forge/Activity/ActivityItem.js

@@ -0,0 +1,27 @@
+import React , { Component } from 'react';
+import {Link} from 'react-router-dom';
+import './activity.css';
+import { getImageUrl } from 'educoder';
+
+
+class ActivityItem extends Component{
+  render(){
+    const { item } = this.props;
+    return(
+      <div className="activity_item">
+        <div className="flex1">
+          <p className="itemLine">
+            <Link to={``} className="color-blue font-16">{item.name}</Link>
+            <span className="activity_type">{item.trend_type}</span>
+          </p>
+          <p className="itemLine mt15">
+            <img alt="" src={getImageUrl(`images/${item.user_avatar}`)} className="createImage"/>
+            <span className="mr20">{item.user_name}</span>
+            <span className="color-grey-9">创建于<span className="ml2 color-grey-6">{item.created_at}</span></span>
+          </p>
+        </div>
+      </div>
+    )
+  }
+}
+export default ActivityItem;

public/react/src/forge/Activity/activity.css

@@ -1,7 +1,6 @@
 .trendsTop{
   padding-bottom: 15px;
   border-bottom:1px solid #ddd;
-  margin-bottom: 15px; 
 }
 .normalBox{
   border-radius: 4px;
@@ -31,6 +30,7 @@
   height: 8px;
   border-radius: 2px;
   background: #888;
+  position: relative;
 }
 .percent_green{
   background-color: #6cc644;
@@ -67,4 +67,43 @@
 }
 .percentBox > li:last-child{
   border-right: none;
+}
+.activity_list .activity_item{
+  border-bottom: 1px solid #f4f4f4;
+  padding:15px 0px;
+  display: flex;
+  align-items: flex-start;
+}
+.prPercent > p{
+  position: absolute;
+  height: 100%;
+  top:0px;
+  left: 0px;
+  z-index: 0;
+}
+.prPercent > p.resetStyle{
+  left: unset;
+  right: 0px;
+  z-index: 1;
+}
+.itemLine{
+  display: flex;
+  align-items: center;
+}
+.activity_type{
+  display: block;
+  padding:0px 5px;
+  height: 20px;
+  line-height: 20px;
+  background: #6cc644;
+  margin-left: 10px;
+  color: #fff;
+  border-radius: 3px;
+  font-size: 12px;
+}
+.createImage{
+  margin-right: 5px;
+  height: 22px;
+  line-height: 22px;
+  border-radius: 50%;
 }