From 3b208ba751652cdda5836dacaaa1143cd72db926 Mon Sep 17 00:00:00 2001 From: caishi <1149225589@qq.com> Date: Wed, 3 Feb 2021 15:53:15 +0800 Subject: [PATCH] =?UTF-8?q?=E7=BB=84=E7=BB=87=20all=20over?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/forge/Component/AddMember.jsx | 93 +++++++ src/forge/Component/MemberCards.jsx | 28 +-- src/forge/Team/Component/LeaveTeam.jsx | 26 ++ src/forge/Team/Component/Modals.jsx | 21 ++ src/forge/Team/Group/GroupDetailMember.jsx | 3 +- src/forge/Team/Group/GroupDetailProject.jsx | 3 +- src/forge/Team/Group/GroupDetails.jsx | 2 +- .../Team/Group/Setting/GroupMemberSetting.jsx | 234 ++++-------------- .../Group/Setting/GroupProjectSetting.jsx | 148 ++++++----- src/forge/Team/RightBox.jsx | 4 +- src/forge/Team/Setting/TeamSettingCommon.jsx | 30 ++- src/forge/Team/Setting/TeamSettingGroup.jsx | 28 +-- src/forge/Team/Setting/TeamSettingMember.jsx | 75 ++---- src/forge/Team/Sub/Detail.jsx | 2 +- src/forge/Team/TeamGroup.jsx | 5 +- src/forge/Team/TeamMember.jsx | 25 +- src/forge/UsersList/focus_button.js | 86 ++----- 17 files changed, 379 insertions(+), 434 deletions(-) create mode 100644 src/forge/Component/AddMember.jsx create mode 100644 src/forge/Team/Component/LeaveTeam.jsx create mode 100644 src/forge/Team/Component/Modals.jsx diff --git a/src/forge/Component/AddMember.jsx b/src/forge/Component/AddMember.jsx new file mode 100644 index 00000000..41ccecdd --- /dev/null +++ b/src/forge/Component/AddMember.jsx @@ -0,0 +1,93 @@ +import React, { useEffect, useState } from 'react'; +import { AutoComplete , Button , Icon } from 'antd'; +import axios from 'axios'; +import { getImageUrl } from 'educoder'; + +const { Option } = AutoComplete; +function AddMember({getID}){ + const [ id , setID ] = useState(undefined); + const [ source , setSource ] = useState(undefined); + const [ searchKey , setSearchKey ] = useState(undefined); + + useEffect(()=>{ + getUserList(); + },[searchKey]) + + function getUserList(e){ + const url = `/users/list.json`; + axios.get(url, { + params: { + search: searchKey, + }, + }).then((result) => { + if (result) { + sourceOptions(result.data.users); + } + }) + .catch((error) => { + console.log(error); + }); + }; + + function sourceOptions(userDataSource){ + const s = userDataSource && userDataSource.map((item, key) => { + return ( + + ); + }); + setSource(s); + } + + function changeInputUser(e){ + setSearchKey(e); + }; + + // 选择用户 + function selectInputUser(e, option){ + setID(e); + setSearchKey(option.props.searchValue); + }; + + function addCollaborator(){ + getID && getID(id); + } + + return( +
+ + +
+ ) +} +export default AddMember; \ No newline at end of file diff --git a/src/forge/Component/MemberCards.jsx b/src/forge/Component/MemberCards.jsx index 06b1084c..8370a936 100644 --- a/src/forge/Component/MemberCards.jsx +++ b/src/forge/Component/MemberCards.jsx @@ -32,26 +32,6 @@ const I = styled.i`{ color:#60B25E; margin-right:2px; }` -const FocusBtn = styled.a`{ - display:inline-block; - height:30px; - line-height:26px; - padding:0px 12px; - background-color:#fafafa; - border:1px solid #eee; - border-radius:2px; - color:#888!important; -}` -const Ifocused = styled.i`{ - font-size:16px!important; - color:#FFA802; - margin-right:4px; -}` -const Ifocus = styled.i`{ - font-size:16px!important; - color:#BBBBBB; - margin-right:4px; -}` const Div = styled.div`{ margin-bottom: 18px; padding:20px 16px; @@ -59,7 +39,7 @@ const Div = styled.div`{ align-items: center; border:1px solid #eee; }` -export default (({ img, name, time, focusStatus, is_current_user, login }) => { +export default (({ img, name, time, focusStatus, is_current_user, login , successFunc }) => { return (
@@ -68,9 +48,9 @@ export default (({ img, name, time, focusStatus, is_current_user, login }) => { { is_current_user ? - - : - + + : + }
diff --git a/src/forge/Team/Component/LeaveTeam.jsx b/src/forge/Team/Component/LeaveTeam.jsx new file mode 100644 index 00000000..b1c172db --- /dev/null +++ b/src/forge/Team/Component/LeaveTeam.jsx @@ -0,0 +1,26 @@ +import React, { useState } from 'react'; +import styled from 'styled-components'; +import Modals from './Modals'; + + +const ALink = styled.a`{ + border:1px solid #F73030; + color:#F73030!important; + height:30px; + line-height:30px; + padding:0px 15px; + border-radius:5px; +}` +function LeaveTeam({teamID , onOk }){ + const [ visible , setVisible ] = useState(false); + + return( + + setVisible(true)}>离开团队 + setVisible(false)} onOk={()=>onOk(teamID)}> +

确定要离开当前团队吗？

+ + + ) +} +export default LeaveTeam; \ No newline at end of file diff --git a/src/forge/Team/Component/Modals.jsx b/src/forge/Team/Component/Modals.jsx new file mode 100644 index 00000000..6f84961f --- /dev/null +++ b/src/forge/Team/Component/Modals.jsx @@ -0,0 +1,21 @@ +import React from 'react'; +import { Modal } from 'antd'; + +function Modals({visible , okText , cancelText , onOk , onCancel , children}){ + + return( + + {children} + + ) +} +export default Modals; \ No newline at end of file diff --git a/src/forge/Team/Group/GroupDetailMember.jsx b/src/forge/Team/Group/GroupDetailMember.jsx index e926753a..6a871d75 100644 --- a/src/forge/Team/Group/GroupDetailMember.jsx +++ b/src/forge/Team/Group/GroupDetailMember.jsx @@ -2,7 +2,7 @@ import React from 'react'; import Cards from '../../Component/MemberCards'; import Nodata from '../../Nodata'; -export default (({ data , current_user }) => { +export default (({ data , current_user , successFunc }) => { return ( data && data.length > 0 ?
@@ -16,6 +16,7 @@ export default (({ data , current_user }) => { focusStatus={item.user.watched} is_current_user={current_user && item.user.login === current_user.login} login={item.user.login} + successFunc={successFunc} /> ) }) diff --git a/src/forge/Team/Group/GroupDetailProject.jsx b/src/forge/Team/Group/GroupDetailProject.jsx index f8c3d2db..808aef37 100644 --- a/src/forge/Team/Group/GroupDetailProject.jsx +++ b/src/forge/Team/Group/GroupDetailProject.jsx @@ -18,8 +18,7 @@ const Div = styled.div`{ } }` const Imgs = styled.img`{ - width:30px; - height:30px; + width:60px; margin-right:12px; border-radius:50%; }` diff --git a/src/forge/Team/Group/GroupDetails.jsx b/src/forge/Team/Group/GroupDetails.jsx index b50ebecc..9d27767d 100644 --- a/src/forge/Team/Group/GroupDetails.jsx +++ b/src/forge/Team/Group/GroupDetails.jsx @@ -130,7 +130,7 @@ export default ((props) => { { - nav === "0" ? : + nav === "0" ? getMember( OIdentifier, groupId, page )}/> : } { diff --git a/src/forge/Team/Group/Setting/GroupMemberSetting.jsx b/src/forge/Team/Group/Setting/GroupMemberSetting.jsx index f14b6575..d49406b5 100644 --- a/src/forge/Team/Group/Setting/GroupMemberSetting.jsx +++ b/src/forge/Team/Group/Setting/GroupMemberSetting.jsx @@ -1,10 +1,11 @@ import React, { useState, useEffect } from 'react'; -import { WhiteBack, Blueline, AlignCenter, FlexAJ } from '../../../Component/layout'; +import { WhiteBack , FlexAJ } from '../../../Component/layout'; import { Menu, Table, Pagination, Icon, Tooltip, Popconfirm, Dropdown, Spin } from 'antd'; import Sort from '../../../Component/Sort'; import Title from '../../../Component/Title'; import Search from '../../../Component/Search'; -import SearchUser from '../../../Component/SearchUser'; +import AddMember from '../../../Component/AddMember'; + import styled from 'styled-components'; import { getImageUrl } from 'educoder'; import axios from 'axios'; @@ -14,18 +15,15 @@ const Img = styled.img`{ height:30px; border-radius:50%; }` - +const limit = 15 export default ((props) => { - const [login, setAddUserLogin] = useState(undefined); const [page, setPage] = useState(1); - const [limit, setLimit] = useState(15); const [total, setTotal] = useState(0); const [data, setMembers] = useState(undefined); const [isSpin, setIsSpin] = useState(false); const [identify, setIdentify] = useState(undefined); const [search, setQuery] = useState(undefined); const { OIdentifier, groupId } = props.match.params; - const { current_user } = props; useEffect(() => { getMember() @@ -34,69 +32,26 @@ export default ((props) => { function getMember() { setIsSpin(true) const url = `/organizations/${OIdentifier}/teams/${groupId}/team_users.json`; - axios - .get(url, { - params: { - page, - search, - identify, - limit - }, - }) - .then((result) => { - if (result && result.data) { - setMembers(result.data.team_users) - setTotal(result.data.total_count) - } - }).catch((error) => { }); + axios.get(url, { + params: { + page, + search, + identify, + limit + }, + }) + .then((result) => { + if (result && result.data) { + setMembers(result.data.team_users) + setTotal(result.data.total_count) + } + }).catch((error) => { }); setIsSpin(false) }; - // 获取搜索用户框里面选择的用户Login字段，接口是这样定义的 - function getUser(login) { - setAddUserLogin(login) - } - - function addUser() { - setIsSpin(true) - const url = `/organizations/${OIdentifier}/teams/${groupId}/team_users.json`; - if (login) { - axios.post(url, { - username: login - }) - .then((result) => { - if (result && result.data) { - setPage(1) - setQuery(undefined) - setIdentify(undefined) - this.getMember(); - } - }) - .catch((error) => { }); - } - setIsSpin(false) - } - // 搜索 - function onSearch(value) { - setQuery(value) - } - - // 角色筛选 - function onSelectMenu(e) { - let select_role = e.key - setPage(1) - setQuery(undefined) - setIdentify(select_role === "all" ? undefined : select_role) - } - - // 切换分页 - function ChangePage(page) { - setPage(page); - } - // 移除成员 function removeUser(username) { - setIsSpin(true) + setIsSpin(true); const url = `/organizations/${OIdentifier}/teams/${groupId}/team_users/${username}.json`; if (username) { axios.delete(url) @@ -105,7 +60,7 @@ export default ((props) => { setPage(1) setQuery(undefined) setIdentify(undefined) - this.getMember(); + getMember(); } }) .catch((error) => { }); @@ -113,112 +68,6 @@ export default ((props) => { setIsSpin(false) } - const MENU_LIST = [ - { - id: "Manager", - name: "管理员", - desc: "拥有仓库设置功能、代码库读、写操作" - }, - { - id: "Developer", - name: "开发者", - desc: "只拥有代码库读、写操作" - }, - { - id: "Reporter", - name: "报告者", - desc: "只拥有代码库读操作" - }, - ]; - - const menu = ( - - 全部 - {MENU_LIST.map((item, key) => { - return ( - - {item.name} - - ); - })} - - ) - const roleTitle = ( -
角色 - - {MENU_LIST.map((item, key) => { - return ( -
{item.name}：{item.desc}
- ); - })} -
- } - > - - -
- ); - function get_color(role) { - if (role === "manager") { - return "text-green"; - } else if (role === "developer") { - return "text-primary"; - } else { - return "text-yellow"; - } - }; - - const setRoles = (id) => ( - - {MENU_LIST.map((item, key) => { - return ( - this.changeOperaiton(e, id)} - > - {item.name} - - ); - })} - - ); - - // 修改权限 - function changeOperaiton(e, id) { - console.log(e) - }; - - const member_roles = (item) => { - const operation = MENU_LIST.filter((i) => i.id === item.identify); - return ( - - {operation && operation[0] ? - - {current_user && current_user.login === item.login ? ( - - ) : ( - - - {operation && operation[0].name} - - - - )} - - : "" - } - - ); - }; - const columns = [ { title: '头像', @@ -251,12 +100,6 @@ export default ((props) => { ) } }, - { - title: roleTitle, - dataIndex: 'role', - width: "20%", - render: (value, item) => member_roles(item.user), - }, { title: '操作', dataIndex: 'operation', @@ -268,29 +111,46 @@ export default ((props) => { okText="确认" cancelText="取消" > - 移除成员 + 移除成员 } } ] + function getID(id){ + addUser(id); + } + + function addUser(l) { + setIsSpin(true); + const url = `/organizations/${OIdentifier}/teams/${groupId}/team_users.json`; + if (l) { + axios.post(url, { + username: l + }).then((result) => { + if (result && result.data) { + setPage(1) + setQuery(undefined) + setIdentify(undefined) + getMember(); + } + }) + .catch((error) => { }); + } + setIsSpin(false) + } + return ( <span>团队成员管理</span> - <AlignCenter> - <SearchUser getUser={getUser} /> - <Blueline className="ml30" onClick={addUser}>+ 添加用户</Blueline> - </AlignCenter> + <AddMember getID={getID}/>
- + setQuery(value)} />
- - 角色筛选 -
{ { total > limit ?
- + setPage(page)}>
: "" } diff --git a/src/forge/Team/Group/Setting/GroupProjectSetting.jsx b/src/forge/Team/Group/Setting/GroupProjectSetting.jsx index d2c1c539..b14c2f2d 100644 --- a/src/forge/Team/Group/Setting/GroupProjectSetting.jsx +++ b/src/forge/Team/Group/Setting/GroupProjectSetting.jsx @@ -3,58 +3,37 @@ import axios from 'axios'; import { AutoComplete, Pagination, List, Popconfirm, Dropdown, Spin } from 'antd'; import { WhiteBack, Blueline, FlexAJ, GroupProjectBackgroup, Greenline, Redline } from '../../../Component/layout'; import Title from '../../../Component/Title'; -const faker_projects = [ - { - id: 2, - project: { - owner_name: "ceshi_org_1", - name: "jajaj0", - identifier: "ssjsksjsk" - } - }, - { - id: 3, - project: { - owner_name: "sylor_test", - name: "sylor_test", - identifier: "sylor_test" - } - } -] +const { Option } = AutoComplete; +const limit = 15; // 使用了faker数据，后续需要修改 function GroupProjectSetting(props) { const [isSpin, setIsSpin] = useState(false); const [projects, setProjects] = useState(undefined); const [page, setPage] = useState(1); - const [limit, setLimit] = useState(15); const [total, setTotal] = useState(0); - const [search, setQuery] = useState(undefined); const [repo_name, setRepoName] = useState(undefined); + + const [ search , setSearch ] = useState(""); + const [ optionsSource , setOptionsSource ] = useState(undefined); + const { OIdentifier, groupId } = props.match.params; useEffect(() => { get_project() - }, [page, search]) + }, [page]) function get_project() { - setIsSpin(true) + setIsSpin(true); const url = `/organizations/${OIdentifier}/teams/${groupId}/team_projects.json`; - axios - .get(url, { - params: { - page, - search, - limit - }, - }) - .then((result) => { - if (result && result.data && result.data.team_projects.length > 0) { - setProjects(result.data.team_projects) - setTotal(result.data.total_count) - } else { - setProjects(faker_projects) - } - }).catch((error) => { }); + axios.get(url, { + params: {page,limit}, + }) + .then((result) => { + if (result && result.data) { + setProjects(result.data.team_projects) + setTotal(result.data.total_count) + } + }).catch((error) => { }); setIsSpin(false) } @@ -70,7 +49,6 @@ function GroupProjectSetting(props) { .then((result) => { if (result && result.data.status > -1) { setPage(1) - setQuery(undefined) get_project() } }).catch((error) => { }); @@ -87,35 +65,80 @@ function GroupProjectSetting(props) { // 添加单个项目 function addSingleProject(){ - setIsSpin(true) - const url = `/organizations/${OIdentifier}/teams/${groupId}/team_projects.json`; - axios.post(url, {repo_name: repo_name}) + if(repo_name){ + setIsSpin(true); + const url = `/organizations/${OIdentifier}/teams/${groupId}/team_projects.json`; + axios.post(url, {repo_name}) .then((result) => { if (result && result.data.id) { setPage(1) - setQuery(undefined) get_project() } - }).catch((error) => { }); - setIsSpin(false) + setIsSpin(false) + }).catch((error) => {setIsSpin(false)}); + }else{ + props.showNotification("请选择要添加的项目!"); + } + } + + // 搜索项目有关 + useEffect(()=>{ + const url = `/organizations/${OIdentifier}/projects/search.json`; + axios.get(url,{ + params:{ + search + } + }).then(result=>{ + if(result && result.data){ + setOptions(result.data.projects); + } + }).catch(error=>{}) + },[search]) + function setOptions(data){ + const s = data && data.map((item, key) => { + return ( + + ); + }); + setOptionsSource(s); + } + function changeInput(value){ + let s = value || ""; + setSearch(s); + } + function selectInput(value,e){ + setRepoName(value); } return ( - <span>团队项目管理</span> + <FlexAJ style={{width:"100%"}}> + <span>团队项目管理</span> + <div> + <AutoComplete + style={{ width: 300 }} + placeholder="搜索项目..." + onChange={changeInput} + onSelect={selectInput} + allowClear + > + {optionsSource} + </AutoComplete> + <Blueline className="ml30" onClick={()=>addSingleProject()}>+ 添加项目</Blueline> + </div> + </FlexAJ> - + {/* -
- - addSingleProject()}>+ 添加项目 -
移除所有 -
+ - -
+ */} +
- 移除 + 移除 } > @@ -162,13 +185,12 @@ function GroupProjectSetting(props) { )} />
- { total > limit ? -
- -
- : "" +
+ +
+ : "" } diff --git a/src/forge/Team/RightBox.jsx b/src/forge/Team/RightBox.jsx index 311de4a9..9d81ba34 100644 --- a/src/forge/Team/RightBox.jsx +++ b/src/forge/Team/RightBox.jsx @@ -49,7 +49,7 @@ function RightBox({ OIdentifier , history }) { function getMember(iden){ const url = `/organizations/${iden}/organization_users.json`; - axios.get(url).then(result=>{ + axios.get(url,{params:{limit:5}}).then(result=>{ if(result && result.data){ setMemberData(result.data); } @@ -57,7 +57,7 @@ function RightBox({ OIdentifier , history }) { } function getGroup(iden){ const url = `/organizations/${iden}/teams.json`; - axios.get(url).then(result=>{ + axios.get(url,{params:{limit:5}}).then(result=>{ if(result && result.data){ setGroupData(result.data); } diff --git a/src/forge/Team/Setting/TeamSettingCommon.jsx b/src/forge/Team/Setting/TeamSettingCommon.jsx index 294293a2..7f49f641 100644 --- a/src/forge/Team/Setting/TeamSettingCommon.jsx +++ b/src/forge/Team/Setting/TeamSettingCommon.jsx @@ -5,6 +5,8 @@ import Title from '../../Component/Title'; import styled from 'styled-components'; import UploadImage from '../Component/UploadImage'; import axios from 'axios'; +import Modals from '../Component/Modals'; + import { getImageUrl } from 'educoder'; const TextArea = Input.TextArea; @@ -22,6 +24,7 @@ export default Form.create()( const [ imageFlag , setImageFlag ] = useState(false); const [ password , setPassword ] = useState(undefined); const [ passwordFlag , setPasswordFlag ] = useState(false); + const [ visible , setVisible ] = useState(false); const { getFieldDecorator , validateFields , setFieldsValue } = form; useEffect(()=>{ @@ -74,20 +77,24 @@ export default Form.create()( function deleteOrganize(){ if(!password){ setPasswordFlag(true); - return }else{ setPasswordFlag(false); - const url = `/organizations/${organizeDetail.id}.json`; - axios.delete(url,{ - params:{ password } - }).then(result=>{ - if(result && result.data){ - // 删除后跳转到个人中心的组织页面 - history.push(`/users/${current_user && current_user.login}/organizes`); - } - }) + setVisible(true); } } + + function onOk(password){ + const url = `/organizations/${organizeDetail.id}.json`; + axios.delete(url,{ + params:{ password } + }).then(result=>{ + if(result && result.data){ + // 删除后跳转到个人中心的组织页面 + history.push(`/users/${current_user && current_user.login}/organizes`); + } + }) + setVisible(false); + } return(
@@ -159,6 +166,9 @@ export default Form.create()( { passwordFlag && 请输入密码}
删除组织 + setVisible(false)} onOk={()=>onOk(password)}> +

确定要删除当前组织吗？

+
diff --git a/src/forge/Team/Setting/TeamSettingGroup.jsx b/src/forge/Team/Setting/TeamSettingGroup.jsx index cd5ea338..0fed8019 100644 --- a/src/forge/Team/Setting/TeamSettingGroup.jsx +++ b/src/forge/Team/Setting/TeamSettingGroup.jsx @@ -1,9 +1,11 @@ import React , { useEffect , useState } from 'react'; import { WhiteBack , Banner , Blueline } from '../../Component/layout'; import styled from 'styled-components'; -import Axios from 'axios'; -import { Pagination , Popconfirm } from 'antd'; +import axios from 'axios'; +import { Pagination } from 'antd'; import { getImageUrl } from 'educoder'; +import LeaveTeam from '../Component/LeaveTeam'; +import { Link } from 'react-router-dom'; const SpanName = styled.span`{ font-size:16px; @@ -13,15 +15,6 @@ const SpanFoot = styled.span`{ margin-right:5px; color:#333 }` -const ALink = styled.a`{ - border:1px solid #F73030; - color:#F73030!important; - height:32px; - line-height:30px; - display:block; - padding:0px 15px; - border-radius:2px; -}` const ImgContent = styled.img`{ height:44px; width:44px; @@ -33,19 +26,18 @@ function TeamSettingGroup({organizeDetail,history}){ const [ list ,setList ] = useState(undefined); const [ page ,setPage ] = useState(1); const [ total ,setTotal ] = useState(0); - const [ search ,setSearch ] = useState(undefined); useEffect(()=>{ if(organizeDetail){ getData(); } - },[organizeDetail,page,search]); + },[organizeDetail,page]); function getData(){ const url = `/organizations/${organizeDetail.id}/teams.json`; - Axios.get(url,{ + axios.get(url,{ params:{ - page,limit,search + page,limit } }).then(result=>{ if(result && result.data){ @@ -58,7 +50,7 @@ function TeamSettingGroup({organizeDetail,history}){ // 当前用户离开团队 function removeMember(teamid){ const url = `/organizations/${organizeDetail.id}/teams/${teamid}/team_users/quit.json`; - Axios.delete(url).then(result=>{ + axios.delete(url).then(result=>{ if(result && result.data){ getData(); } @@ -81,10 +73,10 @@ function TeamSettingGroup({organizeDetail,history}){ return(

- {item.name} + {item.name} { item.is_member && - removeMember(item.id)}>离开团队 + } { item.is_admin && toGroupSetting(item.id)}>团队设置 } diff --git a/src/forge/Team/Setting/TeamSettingMember.jsx b/src/forge/Team/Setting/TeamSettingMember.jsx index 4d1d332c..3a1f08df 100644 --- a/src/forge/Team/Setting/TeamSettingMember.jsx +++ b/src/forge/Team/Setting/TeamSettingMember.jsx @@ -51,95 +51,60 @@ export default (({organizeDetail})=>{ }).catch(error=>{}) } - // 获取搜索用户框里面选择的用户ID，方便添加组织成员 - function getUser(login){ - serChoiceId(login); - } // 切换分页 function ChangePage(page){ setPage(page); } - const menu=( -

- 全部 - 管理员 - 开发者 - 报告者 - - ) - const roleTitle = ( -
角色 - -
管理员：拥有仓库设置功能、代码库读、写操作
-
开发人员：只拥有代码库读、写操作
-
报告者：只拥有代码库读操作
-
- } - > - - -
- ); const columns = [ { title: '头像', - dataIndex: 'image_url', + dataIndex: 'user', width:"5%", - render:(value,item)=>{ + render:(value)=>{ return( - item.user && + value && ) } }, { title: '用户名', - dataIndex: 'name', + dataIndex: 'user', width:"15%", render:(value,item)=>{ - return( - item.user && item.user.name - ) + return value && value.name } }, { title: '邮箱', - dataIndex: 'mail', + dataIndex: 'user', width:"25%", align:"left", - render:(value,item)=>{ - return( - item.user && item.user.mail - ) + render:(value)=>{ + return value && value.mail } }, { title: '所属团队', - dataIndex: 'team', + dataIndex: 'team_names', width:"20%", - render:(value,item)=>{ - return item.team_names && item.team_names.length > 0 && item.team_names[0] + render:(value)=>{ + let array = value && value.length > 0 && value.map((i,k)=>{ + return (i+",") + }) + console.log(array && array[0]); + return array && array[0].substring(0,array[0].length-1); } }, - // { - // title: roleTitle, - // dataIndex: 'role', - // width:"20%", - // render:(value,item)=>{ - // return( - // item.role - // ) - // } - // }, { title: '操作', dataIndex: 'operation', width:"15%", render:(value,item)=>{ - return (organizeDetail && organizeDetail.is_admin ? "" : - deleteMember(item.login)}>移除成员 + let c_isAdmin = organizeDetail && organizeDetail.is_admin; + let last = (data && data.length === 1) && (item.team_names && item.team_names.length === 1 && item.team_names[0]==="Owners"); + return ( + c_isAdmin && !last && deleteMember(item.user && item.user.login)}>移除成员 ) } } @@ -149,7 +114,7 @@ export default (({organizeDetail})=>{ const url = `/organizations/${organizeDetail && organizeDetail.id}/organization_users/${login}.json`; axios.delete(url).then(result=>{ if(result && result.data){ - + getData(); } }).catch(error=>{}) } diff --git a/src/forge/Team/Sub/Detail.jsx b/src/forge/Team/Sub/Detail.jsx index 920df767..79970e14 100644 --- a/src/forge/Team/Sub/Detail.jsx +++ b/src/forge/Team/Sub/Detail.jsx @@ -79,7 +79,7 @@ function Detail(props){ diff --git a/src/forge/Team/TeamGroup.jsx b/src/forge/Team/TeamGroup.jsx index de2b3a0a..59edf426 100644 --- a/src/forge/Team/TeamGroup.jsx +++ b/src/forge/Team/TeamGroup.jsx @@ -6,6 +6,7 @@ import { getImageUrl } from 'educoder'; import Nodata from '../Nodata'; import { Pagination } from 'antd'; import { Link } from 'react-router-dom'; +import LeaveTeam from './Component/LeaveTeam'; const SpanFoot = styled.span`{ margin-right:5px; @@ -66,10 +67,10 @@ function TeamGroup({organizeDetail,current_user}){ { list.map((item,key)=>{ return( -
+

{item.name} - {item.is_member && outTeam(item.id)}>离开团队} + {item.is_member && }

{ diff --git a/src/forge/Team/TeamMember.jsx b/src/forge/Team/TeamMember.jsx index fbb1dde1..dcc4a206 100644 --- a/src/forge/Team/TeamMember.jsx +++ b/src/forge/Team/TeamMember.jsx @@ -1,23 +1,27 @@ import React ,{ useEffect , useState } from 'react'; -import { Banner } from '../Component/layout'; +import { Banner , WhiteBack } from '../Component/layout'; import Cards from '../Component/MemberCards'; import axios from 'axios'; import Nodata from '../Nodata'; +import { Pagination } from 'antd'; const limit = 15; function TeamMember({organizeDetail,current_user}){ const [ page , setPage ] = useState(1); const [ total , setTotal ] = useState(0); const [ list , setList ] = useState(undefined); + useEffect(()=>{ if(organizeDetail){ getData(); } - },[organizeDetail]); + },[organizeDetail,page]); function getData(){ const url = `/organizations/${organizeDetail.id}/organization_users.json`; - axios.get(url).then(result=>{ + axios.get(url,{ + page,limit + }).then(result=>{ if(result && result.data){ setList(result.data.organization_users); setTotal(result.data.total_count); @@ -26,14 +30,13 @@ function TeamMember({organizeDetail,current_user}){ } return( -
+ 组织成员 { list && list.length > 0 ?
{ list.map((item,key)=>{ - console.log(current_user); return( item.user && ) }) @@ -48,6 +53,12 @@ function TeamMember({organizeDetail,current_user}){
: } -
+ { + total >limit && +
+ setPage(page)}/> +
+ } + ) -}export default TeamMember \ No newline at end of file +}export default TeamMember; \ No newline at end of file diff --git a/src/forge/UsersList/focus_button.js b/src/forge/UsersList/focus_button.js index 82c7fd24..192d4008 100644 --- a/src/forge/UsersList/focus_button.js +++ b/src/forge/UsersList/focus_button.js @@ -1,80 +1,44 @@ -import React, { Component } from "react"; +import React , {useState} from "react"; import axios from "axios"; import { Button } from "antd"; import "./list.css"; -class FocusButton extends Component { - constructor(props) { - super(props); - this.state = { - is_watch: false, - id: "", - isSpin: false, - fontClass: "font-12", - starText: "关注", - is_block: false - }; - } - - componentDidMount = () => { - this.set_watch(); - }; - - set_watch = () => { - this.setState({ - is_watch: this.props.is_watch, - id: this.props.id, - isSpin: false, - fontClass: this.props.fontClass ? this.props.fontClass : "font-12", - starText: this.props.starText ? this.props.starText : "关注", - is_block: this.props.is_block === undefined ? false : this.props.is_block - }); - }; - +function FocusButton({is_watch , fontClass, starText, is_block , id , successFunc}){ + const [ isSpin , setIsSpin ] = useState(false); // 关注和取消关注 - focusFunc = (flag) => { - const { id } = this.state; - this.setState({ isSpin: true }); + function focusFunc(flag){ + setIsSpin(true); axios({ method: flag ? "delete" : "post", url: `/watchers/${flag ? "unfollow" : "follow"}.json`, params: { target_type: "user", - id: id, + id, }, + }).then((result) => { + if (result && result.data.status === 0) { + successFunc && successFunc(); + } + setIsSpin(false); }) - .then((result) => { - if (result && result.data.status === 0) { - this.setState({ - is_watch: result.data.watched, - isSpin: false, - }); - } - }) - .catch((error) => { - this.setState({ isSpin: false }) - }); + .catch((error) => {setIsSpin(false);}); }; - render() { - const { is_watch, isSpin, fontClass, starText, is_block } = this.state; - - return ( - - ); - } + )} + + ); } export default FocusButton;