关注、点赞

public/react/src/forge/Main/Detail.js

@@ -12,6 +12,10 @@ const FileNew = Loadable({
 	loader: () => import('../Newfile/Index'),
 	loading: Loading,
 })
+const OrderNew = Loadable({
+	loader: () => import('../Order/New'),
+	loading: Loading,
+})
 const OrderIndex = Loadable({
 	loader: () => import('../Order/order'),
 	loading: Loading,
@@ -30,7 +34,10 @@ class Detail extends Component{
       projectDetail:undefined,
       isManager:false,
       isReporter:false,
-      isDeveloper:false
+      isDeveloper:false,
+      watchers_count:undefined , 
+      praises_count:undefined , 
+      forked_count:undefined
     }
   }
 
@@ -48,16 +55,60 @@ class Detail extends Component{
           projectDetail:result.data,
           isManager:result.data.permission && result.data.permission === "Manager",
           isReporter:result.data.permission && result.data.permission === "Reporter",
-          isDeveloper:result.data.permission && result.data.permission === "Developer"
+          isDeveloper:result.data.permission && result.data.permission === "Developer",
+
+          watchers_count:result.data.watchers_count,
+          praises_count:result.data.praises_count,
+          forked_count:result.data.forked_count,
         })
       }
     }).catch((error)=>{})
   }
 
+  // 关注和取消关注
+  focusFunc =(flag)=>{
+    const { projectsId } = this.props.match.params;
+    if(flag){
+      const url = `/projects/${projectsId}/watchers/follow.json`;
+      axios.post(url).then(result=>{
+        if(result){
+          this.props.showNotification('关注成功');
+        }
+      })
+    }else{
+      const url = `/projects/${projectsId}/watchers/unfollow.json`;
+      axios.delete(url).then(result=>{
+        if(result){
+          this.props.showNotification('取消关注成功');
+        }
+      })
+    }
+  }
+  
+  // 点赞和取消点赞
+  pariseFunc=(flag)=>{
+    const { projectsId } = this.props.match.params;
+    if(flag){
+      const url = `/projects/${projectsId}/praise_tread/like.json`;
+      axios.post(url).then(result=>{
+        if(result){
+          this.props.showNotification('点赞成功');
+        }
+      })
+    }else{
+      const url = `/projects/${projectsId}/praise_tread/unlike.json`;
+      axios.delete(url).then(result=>{
+        if(result){
+          this.props.showNotification('取消点赞成功');
+        }
+      })
+    }
+  }
+
   render(){
     const { projectsId } = this.props.match.params;
     
-    const { projectDetail } = this.state;
+    const { projectDetail , watchers_count , praises_count , forked_count } = this.state;
     const url = this.props.history.location.pathname;
     return(
       <div>
@@ -65,10 +116,19 @@ class Detail extends Component{
           <div className="normal f-wrap-between mb20">
             <p className="font-18 color-blue df flex-1" style={{alignItems:"center"}}>{projectDetail && projectDetail.author && projectDetail.author.name} / <span className="hide-1 flex-1">{ projectDetail && projectDetail.identifier }</span></p>
 
-            <span className="p-r-tags large">
-              <span><label>关注</label><span>{projectDetail && projectDetail.watchers_count}</span></span>
-              <span><label>点赞</label><span>{projectDetail && projectDetail.praises_count}</span></span>
-              <span><label>Fork</label><span>{projectDetail && projectDetail.forked_count}</span></span>
+            <span className="p-r-btn large">
+              <span>
+                <a onClick={()=>this.focusFunc(true)}><i className="iconfont icon-xianshi font-18 mr5 color-grey-6"></i>关注</a>
+                <span>{watchers_count}</span>
+              </span>
+              <span>
+                <a onClick={()=>this.pariseFunc(true)}><i className="iconfont icon-dianzan-xian font-18 mr5 color-grey-6"></i>点赞</a>
+                <span>{praises_count}</span>
+                </span>
+              <span>
+                <a><i className="iconfont icon-fork font-18 mr5 color-grey-6"></i>Fork</a>
+                <span>{forked_count}</span>
+              </span>
             </span>
           </div>
           <div className="normal f-wrap-between">
@@ -83,6 +143,7 @@ class Detail extends Component{
         </div>
 
         <Switch {...this.props}>
+          {/* 新建文件 */}
           <Route path="/projects/:projectsId/coder/:branch/newfile/:path"
             render={
               (props) => (<FileNew {...this.props} {...props} {...this.state}/>)
@@ -93,6 +154,16 @@ class Detail extends Component{
               (props) => (<FileNew {...this.props} {...props} {...this.state}/>)
             }
           ></Route>
+
+          {/* 新建工单 */}
+          
+          <Route path="/projects/:projectsId/orders/new"
+            render={
+              (props) => (<OrderNew {...this.props} {...props} {...this.state}/>)
+            }
+          ></Route>
+
+          {/* 代码Index */}
           <Route path="/projects/:projectsId/orders"
             render={
               (props) => (<OrderIndex {...this.props} {...props} {...this.state}/>)

public/react/src/forge/Main/list.css

@@ -111,6 +111,32 @@ body,#root{
   flex: 1;
   width: 0;
 }
+.p-r-btn{
+  display: flex;
+  align-items: center;
+}
+.p-r-btn > span{
+  height: 35px;
+  line-height: 35px;
+  border:1px solid #f4f4f4;
+  border-radius: 5px;
+  display: block;
+  margin-left: 20px;
+  background-color: #fff;
+  display: flex;
+}
+.p-r-btn > span > a{
+  display: flex;
+  align-items: center;
+  padding:0px 12px;
+  background:#ececec;
+}
+.p-r-btn > span > a:active{
+  background: #f4f4f4;
+}
+.p-r-btn > span > span{
+  padding:0px 8px;
+}
 .p-r-tags{
   display: flex;
   opacity: 1;

public/react/src/forge/New/Index.js

@@ -1,5 +1,5 @@
 import React , { Component } from 'react';
-
+import { Link } from 'react-router-dom';
 import { Input , Form , Select , Checkbox , Button , Divider } from 'antd';
 
 import '../css/index.css';
@@ -285,7 +285,7 @@ class Index extends Component{
               <p className="formTip">只有企业所有人或拥有权限的企业成员才能看到</p>
               <Form.Item className="formTip">
                   <Button type="primary" onClick={this.subMitFrom} className="mr20">创建项目</Button>
-                  <a className="btn_32" onClick={() => this.props.onCancel()}>取消</ a>
+                  <Link to={'/projects'} className="btn_32">取消</Link>
               </Form.Item>
             </div>
             

public/react/src/forge/Order/Nav.js

@@ -0,0 +1,14 @@
+import React , { Component } from "react";
+import { Link } from 'react-router-dom';
+import './order.css'
+class Nav extends Component{
+  render(){
+    return(
+      <p className="topWrapper_nav">
+        <Link to={``} >标签</Link>
+        <Link to={``}>里程</Link>
+      </p>
+    )
+  }
+}
+export default Nav;

public/react/src/forge/Order/New.js

@@ -0,0 +1,16 @@
+import React , { Component } from "react";
+
+import Nav from './Nav';
+
+class New extends Component{
+  render(){
+    return(
+      <div className="main">
+        <div className="topWrapper">
+          <Nav />
+        </div>
+      </div>
+    )
+  }
+}
+export default New;

public/react/src/forge/Order/order.css

@@ -28,7 +28,7 @@
 }
 .topWrapper_btn {
   background: #21ba45;
-  color: #FFFFFF;
+  color: #FFFFFF!important;
   padding:0px 12px;
   text-align: center;
   height: 32px;

public/react/src/forge/Order/order.js

@@ -3,15 +3,12 @@ import {Link} from 'react-router-dom';
 import { Input ,Dropdown , Menu , Icon } from 'antd';
 import './order.css';
 
+import Nav from './Nav';
+
 import axios from 'axios';
 
 const Search = Input.Search;
 
-const tagList= ['release','test'];
-const typeList= ['普通','悬赏'];
-const categoryList=['缺陷','支持','任务','功能','周报'];
-const levelList=['低','正常','高','紧急','立刻'];
-const percentList=['0%','10%','20%','30%','40%','50%','60%','70%','80%','90%','100%'];
 class order extends Component{
   constructor(props){
     super(props);
@@ -79,10 +76,7 @@ class order extends Component{
     return(
       <div className="main">
         <div className="topWrapper">
-          <p className="topWrapper_nav">
-            <Link to={``} >标签</Link>
-            <Link to={``}>里程</Link>
-          </p>
+          <Nav />
           <Link to={``} className="topWrapper_btn">创建工单</Link>
         </div>
         <div className="topWrapper" style={{borderBottom:"none"}}>