详情+邀请码的显示

src/forge/Main/Detail.js

@@ -1,8 +1,9 @@
 import React, { Component } from 'react';
-import { Spin, Tooltip } from 'antd';
+import { Spin, Tooltip , message } from 'antd';
 import { Link, Route, Switch } from 'react-router-dom';
-import { Content } from '../Component/layout';
+import { Content , FlexAJ } from '../Component/layout';
 import DetailBanner from './sub/DetailBanner';
+import Invite from './sub/Invite';
 import '../css/index.scss'
 import './list.css';
 
@@ -389,6 +390,15 @@ class Detail extends Component {
     })
   }
 
+  textFunc = (forked_from_project_id,fork_info)=>{
+    return forked_from_project_id && fork_info ?
+      <div className="color-grey-9">
+        <span>forked from </span>
+        <Link to={`/users/${fork_info.fork_project_user_login}`} className="show-user-link color-grey-6">{fork_info.fork_project_user_name}</Link>
+        <span> / </span>
+        <Link to={`/projects/${fork_info.fork_project_user_login}/${fork_info.fork_project_identifier}`} className="color-grey-6">{fork_info.fork_form_name}</Link>
+      </div> : ""
+  }
   
 
   render() {
@@ -406,16 +416,6 @@ class Detail extends Component {
 
     const { state } = this.props.history.location;
     
-    const text = (
-      projectDetail && projectDetail.forked_from_project_id && projectDetail.fork_info ?
-        <React.Fragment>
-          <span>forked from </span>
-          <Link to={`/users/${projectDetail.fork_info.fork_project_user_login}`} className="show-user-link color-grey-ccc">{projectDetail.fork_info.fork_project_user_name}</Link>
-          <span> / </span>
-          <Link to={`/projects/${projectDetail.fork_info.fork_project_user_login}/${projectDetail.fork_info.fork_project_identifier}`} className="color-grey-ccc">{projectDetail.fork_info.fork_form_name}</Link>
-        </React.Fragment> : ""
-    );
-    
     const common = {
       getDetail: this.getDetail,
       changeOpenDevops:this.changeOpenDevops,
@@ -425,7 +425,7 @@ class Detail extends Component {
       <div>
         <div className="detailHeader-wrapper">
           <div className="normal">
-            <div className="f-wrap-between pb15" style={{ position: "relative" }}>
+            <div className="f-wrap-between" style={{ position: "relative" }}>
               <p className="font-22 df flex-1 lineH2 mt15" style={{ alignItems: "center" }}>
                 {project && project.author &&
                   <Link to={`${project.author.type ==="Organization" ? "/organize":'/users'}/${project.author.login}`} className="show-user-link">
@@ -435,15 +435,7 @@ class Detail extends Component {
                 <span className="ml5 mr5">/</span>
                 <span className="hide-1 flex-1 df">
                   <Link to={`/projects/${owner}/${projectsId}`} className="font-22">{project && project.name}</Link>
-                  {
-                    projectDetail && projectDetail.forked_from_project_id && projectDetail.fork_info ?
-                      <Tooltip placement={'right'} title={text}>
-                        <Link to={`/projects/${projectDetail.fork_info.fork_project_user_login}/${projectDetail.fork_info.fork_project_identifier}`}
-                          className="ml10" >
-                          <i className="iconfont icon-fork font-18 fl mt6" style={{ color: "#8D90E3" }}></i>
-                        </Link>
-                      </Tooltip> : ""
-                  }
+                  
                   {
                     projectDetail && projectDetail.type && projectDetail.type !== 0 ? 
                     projectDetail.type === 2 ?
@@ -516,6 +508,19 @@ class Detail extends Component {
                 </span>
               }
             </div>
+            <FlexAJ>
+              <div>
+                {
+                  projectDetail && projectDetail.forked_from_project_id && projectDetail.fork_info ?
+                  this.textFunc(projectDetail.forked_from_project_id,projectDetail.fork_info)
+                  :""
+                }
+              </div>
+              {
+                projectDetail && projectDetail.invite_code &&
+                <Invite code={projectDetail.invite_code} />
+              }
+            </FlexAJ>
             {
               firstSync ? "" :
               <DetailBanner 

src/forge/Main/sub/Invite.jsx

@@ -0,0 +1,24 @@
+import React from 'react';
+import { Tooltip , message } from 'antd';
+
+function Invite({code}) {
+
+  function jsCopy(id) {
+    const copyEle = document.querySelector(id); // 获取要复制的节点
+    const range = document.createRange(); // 创造range
+    window.getSelection().removeAllRanges(); //清除页面中已有的selection
+    range.selectNode(copyEle); // 选中需要复制的节点
+    window.getSelection().addRange(range); // 执行选中元素
+    document.execCommand("Copy"); // 执行copy操作
+    message.success('复制成功');
+  }
+  return(
+    <div>
+      <span>邀请码: <span id="devitecode">{code}</span></span>
+      <Tooltip title={<p className="edu-txt-center">可以通过邀请码邀请成员加入项目<br/>点击复制邀请码。</p>}  placement={"bottom"}>
+        <i className="iconfont icon-fuzhi2 font-16 color-blue ml8" onClick={()=>jsCopy("#devitecode")}></i>
+      </Tooltip>
+    </div>
+  )
+}
+export default Invite;

src/forge/users/Infos.js

@@ -191,9 +191,9 @@ class Infos extends Component {
   }
 
   render() {
-    const { current_user, mygetHelmetapi , resetUserInfo } = this.props;
+    const { current_user } = this.props;
     const { username } = this.props.match.params;
-    const { user, isSpin, project_type, route_type , undo_events , undo_messages , menuKey } = this.state;
+    const { user, isSpin, route_type , undo_events , menuKey } = this.state;
     return (
       <div className="newMain clearfix">
         <Spin spinning={isSpin}>