1
0
mirror of https://github.com/haiwen/seahub.git synced 2025-09-01 07:01:12 +00:00

update dir shared item api (#4648)

* update dir shared item api

return contact_email and avatar_url field

* [share dialog] share to user: show avatar & user details popover for shared user

Co-authored-by: lian <lian@seafile.com>
Co-authored-by: llj <lingjun.li1@gmail.com>
This commit is contained in:
lian
2020-08-14 14:47:42 +08:00
committed by GitHub
parent 12b200f3e1
commit dcff1ff5e1
3 changed files with 62 additions and 4 deletions

View File

@@ -9,12 +9,15 @@ import UserSelect from '../user-select';
import SharePermissionEditor from '../select-editor/share-permission-editor';
import '../../css/invitations.css';
import '../../css/share-to-user.css';
class UserItem extends React.Component {
constructor(props) {
super(props);
this.state = {
isOperationShow: false
isOperationShow: false,
isUserDetailsPopoverOpen: false
};
}
@@ -26,11 +29,19 @@ class UserItem extends React.Component {
this.setState({isOperationShow: false});
}
userAvatarOnMouseEnter = () => {
this.setState({isUserDetailsPopoverOpen: true});
}
userAvatarOnMouseLeave = () => {
this.setState({isUserDetailsPopoverOpen: false});
}
deleteShareItem = () => {
let item = this.props.item;
this.props.deleteShareItem(item.user_info.name);
}
onChangeUserPermission = (permission) => {
let item = this.props.item;
this.props.onChangeUserPermission(item, permission);
@@ -39,9 +50,33 @@ class UserItem extends React.Component {
render() {
let item = this.props.item;
let currentPermission = item.is_admin ? 'admin' : item.permission;
const { isUserDetailsPopoverOpen } = this.state;
return (
<tr onMouseEnter={this.onMouseEnter} onMouseLeave={this.onMouseLeave}>
<td className="name">{item.user_info.nickname}</td>
<td className="name">
<div className="position-relative">
<img src={item.user_info.avatar_url}
width="24" alt={item.user_info.nickname}
className="rounded-circle mr-2 cursor-pointer"
onMouseEnter={this.userAvatarOnMouseEnter}
onMouseLeave={this.userAvatarOnMouseLeave} />
<span>{item.user_info.nickname}</span>
{isUserDetailsPopoverOpen && (
<div className="user-details-popover p-4 position-absolute w-100 mt-1">
<div className="user-details-main pb-3">
<img src={item.user_info.avatar_url} width="40"
alt={item.user_info.nickname}
className="rounded-circle mr-2" />
<span className="user-details-name">{item.user_info.nickname}</span>
</div>
<dl className="m-0 mt-3 d-flex">
<dt className="m-0 mr-3">{gettext('Email')}</dt>
<dd className="m-0">{item.user_info.contact_email}</dd>
</dl>
</div>
)}
</div>
</td>
<td>
<SharePermissionEditor
isTextMode={true}