Merge pull request #4784 from tsiegleauq/user-list-toggle

Add more user list options
This commit is contained in:
Emanuel Schütze 2019-06-17 17:26:29 +02:00 committed by GitHub
commit 7cf604918f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 53 additions and 7 deletions

View File

@ -1,4 +1,5 @@
<mat-icon>{{ icon }}</mat-icon>
<mat-icon *ngIf="!swap">{{ icon }}</mat-icon>
<span class="content-node">
<ng-content></ng-content>
</span>
<mat-icon *ngIf="swap">{{ icon }}</mat-icon>

View File

@ -30,4 +30,11 @@ export class IconContainerComponent {
*/
@Input()
public size: 'medium' | 'large' = 'medium';
/**
* Reverse text and icon.
* Show the icon behind the text
*/
@Input()
public swap = false;
}

View File

@ -8,6 +8,7 @@ import { PblDataSource, PblColumnDefinition } from '@pebula/ngrid';
import { BaseViewComponent } from './base-view';
import { BaseViewModel } from './base-view-model';
import { StorageService } from 'app/core/core-services/storage.service';
import { ViewUser } from '../users/models/view-user';
export abstract class ListViewBaseComponent<V extends BaseViewModel> extends BaseViewComponent implements OnDestroy {
/**
@ -111,4 +112,14 @@ export abstract class ListViewBaseComponent<V extends BaseViewModel> extends Bas
public saveScrollIndex(key: string, index: number): void {
this.storage.set(`scroll_${key}`, index);
}
/**
* If the user is not active, formulate a tooltip accordingly
*
* @param user
* @returns "Inactive" as (untranslated) string if the given user is not active
*/
public getUserTooltip(user: ViewUser): string {
return user.is_active ? '' : 'Inactive';
}
}

View File

@ -32,9 +32,18 @@
(click)="saveScrollIndex('user', rowContext.identity)"
[routerLink]="user.id"
*ngIf="!isMultiSelect"
matTooltip="{{ getUserTooltip(user) | translate }}"
></a>
<div>
{{ name }}
<span *ngIf="user.is_active">
{{ name }}
</span>
<span *ngIf="!user.is_active">
<os-icon-container icon="block" swap="true">
{{ name }}
</os-icon-container>
</span>
</div>
</div>
@ -65,6 +74,7 @@
<!-- Info column -->
<div *pblNgridCellDef="'infos'; row as user" class="cell-slot fill">
<div class="infoCell">
<!-- Email-sent indicator -->
<mat-icon
inline
*ngIf="user.is_last_email_send"
@ -72,16 +82,24 @@
>
mail
</mat-icon>
<!-- Has comment indicator -->
<mat-icon inline *ngIf="!!user.comment" matTooltip="{{ user.comment }}">
comment
</mat-icon>
</div>
</div>
<!-- Presence column -->
<div *pblNgridCellDef="'presence'; row as user" class="cell-slot fill">
<div *ngIf="user.is_active">
<mat-checkbox (change)="setPresent(user)" [checked]="user.is_present" [disabled]="isMultiSelect">
<span translate>Present</span>
</mat-checkbox>
</div>
<mat-checkbox
class="checkbox-ripple-padding"
(change)="setPresent(user)"
[checked]="user.is_present"
[disabled]="isMultiSelect"
>
<span translate>Present</span>
</mat-checkbox>
</div>
</os-list-view-table>

View File

@ -9,3 +9,7 @@
font-size: 80%;
}
}
.infoCell {
display: grid;
}

View File

@ -170,6 +170,10 @@
}
}
.checkbox-ripple-padding {
padding-left: 12px;
}
.clickable {
cursor: pointer;
}
@ -342,6 +346,7 @@ mat-card {
}
// Shared table definitions
// TODO: Might be deprecated since we now have Virtual Scrolling Tables
%os-table {
width: 100%;