From 6d14b0280a9238b9886e7cabe0c016a42d29606e Mon Sep 17 00:00:00 2001
From: "sylor_huang@126.com" <sylor_huang@126.com>
Date: Tue, 28 Apr 2020 14:52:53 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E5=8D=8F=E4=BD=9C=E8=80=85?=
 =?UTF-8?q?=E9=A1=B5=E9=9D=A2=E7=9A=84=E9=93=BE=E6=8E=A5=E5=8F=8A=E6=90=9C?=
 =?UTF-8?q?=E7=B4=A2=E6=96=B9=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/forge/Settings/Collaborator.js | 38 +++++++++++++++++++++++-------
 1 file changed, 30 insertions(+), 8 deletions(-)

diff --git a/src/forge/Settings/Collaborator.js b/src/forge/Settings/Collaborator.js
index da0ae8b00..f3f4cb0a9 100644
--- a/src/forge/Settings/Collaborator.js
+++ b/src/forge/Settings/Collaborator.js
@@ -2,6 +2,7 @@ import React , { Component } from 'react';
 import { Link } from 'react-router-dom';
 import { Input , AutoComplete , Dropdown , Menu , Icon , Spin , Pagination } from 'antd';
 import axios from 'axios';
+import { getImageUrl } from 'educoder';
 
 const { Option } = AutoComplete;
 const MENU_LIST = [{
@@ -25,7 +26,8 @@ class Collaborator extends Component{
       userDataSource:undefined,
       page:1,
       total_count:undefined,
-      isSpin:true
+      isSpin:true,
+      searchKey: undefined
     }
   }
 
@@ -64,14 +66,18 @@ class Collaborator extends Component{
   }
   // 输入用户
   changeInputUser=(e)=>{
+    this.setState({
+      searchKey: e
+    })
     this.getUserList(e);
   }
   // 选择用户
   selectInputUser=(e,option)=>{
     this.setState({
-      user_id:e
+      user_id:e,
+      searchKey: option.props.searchValue
     })
-    this.getUserList(option.props.children);
+    this.getUserList(option.props.searchValue);
   }
   getUserList=(e)=>{
     const url = `/users/list.json`;
@@ -165,7 +171,7 @@ class Collaborator extends Component{
     this.getMember(project_id,page);
   }
   render(){
-    const { userDataSource , listData , isSpin , page , total_count } = this.state;
+    const { userDataSource , listData , isSpin , page , total_count,searchKey } = this.state;
     // 获取当前项目的拥有者
     const { author } = this.props;
     const menu =(id)=> (
@@ -182,7 +188,13 @@ class Collaborator extends Component{
 
     const source = userDataSource && userDataSource.map((item,key)=>{
       return(
-        <Option key={key} value={`${item.user_id}`}>{item.username}</Option>
+        <Option key={key} value={`${item.user_id}`} searchValue={`${item.username}`}>
+          <img className="user_img radius" width="28" height="28"  src={getImageUrl(`images/${item && item.image_url}`)} alt=""/>
+          <span className="ml10" style={{'vertical-align':'middle'}}>
+            {item.username}
+            <span className="color-grey ml10">({item.login})</span>
+          </span>
+        </Option>
       )
     })
     return(
@@ -194,10 +206,11 @@ class Collaborator extends Component{
           <div className="addPanel">
             <AutoComplete
               dataSource={source}
-              style={{ width: 200 }}
+              value={searchKey}
+              style={{ width: 300 }}
               onChange={this.changeInputUser}
               onSelect={this.selectInputUser}
-              placeholder="搜索用户"
+              placeholder="用户名或邮箱搜索..."
             />
             <a className="small_submitBtn ml20" onClick={this.addCollaborator}>增加协作者</a>
           </div>
@@ -208,7 +221,16 @@ class Collaborator extends Component{
                   const operation = MENU_LIST.filter(i=>i.id === item.role);
                   return(
                     <div className="collaboratorItem">
-                      <span><Link to={``} className="color-blue">{item.name}</Link></span>
+                      <span>
+                      <Link to={`/users/${item && item.login}/projects`} className="show-user-link">
+                        <img className="user_img radius" width="28" height="28"  src={getImageUrl(`images/${item && item.image_url}`)} alt=""/>
+                        <span className="ml10" style={{'vertical-align':'middle'}}>
+                          {item.name}
+                          <span className="color-grey ml10">({item.login})</span>
+                          </span>
+                        
+                      </Link>
+                        </span>
                       <span>
                         {
                           author && author.login === item.login ?