动态页的动态效果

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

@@ -74,7 +74,14 @@ class Activity extends Component{
     const { type,status,page } = this.state;
     this.getInfo(e.key,type,status,page);
   }
-
+   //筛选
+   changeTrends=(type,status)=>{
+    this.setState({
+      type,status
+    })
+    const {time,page}=this.state;
+    this.getInfo(time,type,status,page);
+   }
   // 分页
   ChangePage=(page)=>{
     this.setState({
@@ -127,19 +134,19 @@ class Activity extends Component{
           <ul className="percentBox">
             <li>
               <span className="purple">{data && data.pr_count}</span>
-              <Link to={``}>合并请求</Link>
+              <span className="change" onClick={()=>this.changeTrends("PullRequest",)}>合并请求</span>
             </li>
             <li>
               <span className="green">{data && data.new_pr_count}</span>
-              <Link to={``}>新合并请求</Link>
+              <span className="change" onClick={()=>this.changeTrends("PullRequest","create")}>新合并请求</span>
             </li>
             <li>
               <span className="red">{data && data.close_issues_count}</span>
-              <Link to={``}>已关闭的工单</Link>
+              <span className="change" onClick={()=>this.changeTrends("Issue","close")}>已关闭的工单</span>
             </li>
             <li>
               <span className="green">{data && data.open_issues_count}</span>
-              <Link to={``}>创建工单</Link>
+              <span className="change" onClick={()=>this.changeTrends("Issue","create")}>创建工单</span>
             </li>
           </ul>
         </div>
@@ -157,7 +164,7 @@ class Activity extends Component{
           {
             project_trends && project_trends.map((item,key)=>{
               return(
-                <ActivityItem item={item}></ActivityItem>
+                <ActivityItem item={item} {...this.props} ></ActivityItem>
               )
             })
           }

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

@@ -6,19 +6,36 @@ import { getImageUrl } from 'educoder';
 
 class ActivityItem extends Component{
   render(){
+    const { projectsId } = this.props.match.params;
     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>
-            { item.created_at && <span className="color-grey-9">创建于<span className="ml2 color-grey-6">{item.created_at}</span></span>}
-          </p>
+      <div className="activity_item">
+        <div className="flex1">
+          {/* 如果是版本发布 */}
+          { item.trend_type==="VersionRelease"? 
+          <p className="itemLine">
+            <Link to={`/projects/${projectsId}/version`} className="color-blue font-16">{item.name}</Link>
+            <span className="activity_type">{item.trend_type}</span>
+          </p >
+          :
+          // 如果是工单
+          item.trend_type==="Issue"?
+          <p className="itemLine">
+            <Link to={`/projects/${projectsId}/orders/${item.trend_id}/detail`} className="color-blue font-16">{item.name}</Link>
+            <span className="activity_type">{item.trend_type}</span>
+          </p >
+          :
+          // 如果是合并请求
+          <p className="itemLine">
+            <Link to={`/projects/${projectsId}/merge/${item.trend_id}/Messagecount`} 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>
+            { item.created_at && <span className="color-grey-9">创建于<span className="ml2 color-grey-6">{item.created_at}</span></span>}
+            </p >
             </div>
             </div>
     )

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

@@ -99,3 +99,10 @@
   line-height: 22px;
   border-radius: 50%;
 }
+.change{
+  color:  black;
+  cursor: pointer;
+}
+.change:hover{
+  color: #4183c4;
+}