haiwen/seahub
1
0
Fork 0
mirror of https://github.com/haiwen/seahub.git synced 2025-09-02 07:27:04 +00:00
Code Issues Releases Wiki Activity

send search user request after one second (#5411)

Browse Source 
* send search user request after one second

* [user select] cleaned up code & improvement

---------

Co-authored-by: llj <lingjun.li1@gmail.com>
This commit is contained in:
lian
2023-03-22 15:21:51 +08:00
committed by GitHub
parent f6010022cb
commit 3fdec9f09f
1 changed files with 34 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

64
frontend/src/components/user-select.js
View File

@@ -21,8 +21,9 @@ class UserSelect extends React.Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.options = []; this.options = [];
this.finalValue = '';
this.state = { this.state = {
searchValue: '', searchValue: ''
}; };
} }
@@ -37,36 +38,39 @@ class UserSelect extends React.Component {
loadOptions = (input, callback) => { loadOptions = (input, callback) => {
const value = input.trim(); const value = input.trim();
if (value.length > 0) { this.finalValue = value;
seafileAPI.searchUsers(value).then((res) => { setTimeout(() => {
this.options = []; if (this.finalValue === value && value.length > 0) {
for (let i = 0 ; i < res.data.users.length; i++) { seafileAPI.searchUsers(value).then((res) => {
const item = res.data.users[i]; this.options = [];
let obj = {}; for (let i = 0 ; i < res.data.users.length; i++) {
obj.value = item.name; const item = res.data.users[i];
obj.email = item.email; let obj = {};
obj.label = obj.value = item.name;
enableShowContactEmailWhenSearchUser ? ( obj.email = item.email;
<div className="d-flex"> obj.label = enableShowContactEmailWhenSearchUser ? (
<img src={item.avatar_url} className="avatar" width="24" alt="" /> <div className="d-flex">
<div className="ml-2"> <img src={item.avatar_url} className="avatar" width="24" alt="" />
<span className="user-option-name">{item.name}</span><br /> <div className="ml-2">
<span className="user-option-email">{item.contact_email}</span> <span className="user-option-name">{item.name}</span><br />
</div> <span className="user-option-email">{item.contact_email}</span>
</div> </div>
) : ( </div>
<React.Fragment> ) : (
<img src={item.avatar_url} className="select-module select-module-icon avatar" alt=""/> <React.Fragment>
<span className='select-module select-module-name'>{item.name}</span> <img src={item.avatar_url} className="select-module select-module-icon avatar" alt=""/>
</React.Fragment>); <span className='select-module select-module-name'>{item.name}</span>
this.options.push(obj); </React.Fragment>
} );
callback(this.options); this.options.push(obj);
}).catch(error => { }
let errMessage = Utils.getErrorMsg(error); callback(this.options);
toaster.danger(errMessage); }).catch(error => {
}); let errMessage = Utils.getErrorMsg(error);
} toaster.danger(errMessage);
});
}
}, 1000);
} }
clearSelect = () => { clearSelect = () => {