devol
/
bitwarden-estensione-browser
mirror of https://github.com/bitwarden/browser
1
0
Fork 0
Code Issues 1 Releases Wiki Activity

status filters for user list

This commit is contained in:
Kyle Spearrin 2018-07-11 16:40:32 -04:00
parent 6dd21fe9e9
commit 2dc04fa041
3 changed files with 49 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
jslib

@ -1 +1 @@
Subproject commit d7f3f9425ececd041bc1a3e0be3f9da157ac55c3
Subproject commit ef75dc735e343f407f43a010ba97f8d3fb7fa583

28
src/app/organizations/manage/people.component.html
View File

@ -1,18 +1,20 @@
<div class="page-header d-flex">
<h1>{{'people' | i18n}}</h1>
<div class="ml-auto d-flex">
<div class="btn-group btn-group-toggle btn-group-sm" data-toggle="buttons">
<label class="btn btn-outline-secondary active">
<input type="radio" name="options" id="option1" autocomplete="off" checked> {{'all' | i18n}}
</label>
<label class="btn btn-outline-secondary">
<input type="radio" name="options" id="option3" autocomplete="off"> {{'invited' | i18n}}
<span class="badge badge-pill badge-info">4</span>
</label>
<label class="btn btn-outline-secondary">
<input type="radio" name="options" id="option2" autocomplete="off"> {{'accepted' | i18n}}
<span class="badge badge-pill badge-warning">4</span>
</label>
<div class="btn-group btn-group-sm" role="group">
<button type="button" class="btn btn-outline-secondary" [ngClass]="{active: status == null}" (click)="filter(null)">
{{'all' | i18n}}
</button>
<button type="button" class="btn btn-outline-secondary" [ngClass]="{active: status == organizationUserStatusType.Invited}"
(click)="filter(organizationUserStatusType.Invited)">
{{'invited' | i18n}}
<span class="badge badge-pill badge-info" *ngIf="invitedCount">{{invitedCount}}</span>
</button>
<button type="button" class="btn btn-outline-secondary" [ngClass]="{active: status == organizationUserStatusType.Accepted}"
(click)="filter(organizationUserStatusType.Accepted)">
{{'accepted' | i18n}}
<span class="badge badge-pill badge-warning" *ngIf="acceptedCount">{{acceptedCount}}</span>
</button>
</div>
<div class="ml-3">
<label class="sr-only" for="search">{{'search' | i18n}}</label>
@ -26,7 +28,7 @@
</div>
<i class="fa fa-spinner fa-spin text-muted" *ngIf="loading"></i>
<ng-container *ngIf="!loading && (users | search:searchText:'name':'email':'id') as searchedUsers">
<p *ngIf="!searchedUsers.length">{{'noItemsInList' | i18n}}</p>
<p *ngIf="!searchedUsers.length">{{'noUsersInList' | i18n}}</p>
<table class="table table-hover table-list" *ngIf="searchedUsers.length">
<tbody>
<tr *ngFor="let u of searchedUsers">

36
src/app/organizations/manage/people.component.ts
View File

@ -43,6 +43,8 @@ export class PeopleComponent implements OnInit {
organizationId: string;
users: OrganizationUserUserDetailsResponse[];
searchText: string;
status: OrganizationUserStatusType = null;
statusMap = new Map<OrganizationUserStatusType, OrganizationUserUserDetailsResponse[]>();
organizationUserType = OrganizationUserType;
organizationUserStatusType = OrganizationUserStatusType;
actionPromise: Promise<any>;
@ -50,6 +52,7 @@ export class PeopleComponent implements OnInit {
accessGroups = false;
private modal: ModalComponent = null;
private allUsers: OrganizationUserUserDetailsResponse[];
constructor(private apiService: ApiService, private route: ActivatedRoute,
private i18nService: I18nService, private componentFactoryResolver: ComponentFactoryResolver,
@ -79,12 +82,39 @@ export class PeopleComponent implements OnInit {
async load() {
const response = await this.apiService.getOrganizationUsers(this.organizationId);
const users = response.data != null && response.data.length > 0 ? response.data : [];
users.sort(Utils.getSortFunction(this.i18nService, 'email'));
this.users = users;
this.statusMap.clear();
this.allUsers = response.data != null && response.data.length > 0 ? response.data : [];
this.allUsers.sort(Utils.getSortFunction(this.i18nService, 'email'));
this.allUsers.forEach((u) => {
if (!this.statusMap.has(u.status)) {
this.statusMap.set(u.status, [u]);
} else {
this.statusMap.get(u.status).push(u);
}
});
this.filter(this.status);
this.loading = false;
}
filter(status: OrganizationUserStatusType) {
this.status = status;
if (this.status != null) {
this.users = this.statusMap.get(this.status);
} else {
this.users = this.allUsers;
}
}
get invitedCount() {
return this.statusMap.has(OrganizationUserStatusType.Invited) ?
this.statusMap.get(OrganizationUserStatusType.Invited).length : 0;
}
get acceptedCount() {
return this.statusMap.has(OrganizationUserStatusType.Accepted) ?
this.statusMap.get(OrganizationUserStatusType.Accepted).length : 0;
}
edit(user: OrganizationUserUserDetailsResponse) {
if (this.modal != null) {
this.modal.close();