Merge pull request #4784 from tsiegleauq/user-list-toggle
Add more user list options
This commit is contained in:
commit
7cf604918f
@ -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>
|
||||
|
@ -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;
|
||||
}
|
||||
|
@ -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';
|
||||
}
|
||||
}
|
||||
|
@ -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>
|
||||
|
||||
|
@ -9,3 +9,7 @@
|
||||
font-size: 80%;
|
||||
}
|
||||
}
|
||||
|
||||
.infoCell {
|
||||
display: grid;
|
||||
}
|
||||
|
@ -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%;
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user