Skip to content
Snippets Groups Projects
Commit ee4ca64f authored by NOUMANE's avatar NOUMANE Committed by pybelecalo
Browse files

[US TRTL-340] add new home user

parent dd041976
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
Showing
with 216 additions and 219 deletions
ui/ui-frontend-common/src/app/modules/pipes/empty.pipe.ts 0 → 100644
+ 12
− 0
View file @ ee4ca64f
import { Pipe, PipeTransform } from '@angular/core';
@Pipe({
name: 'empty'
})
export class EmptyPipe implements PipeTransform {
transform(value: any): any {
return value ? value : '— —';
}
}
ui/ui-frontend-common/src/app/modules/pipes/pipes.module.ts
+ 3
− 0
View file @ ee4ca64f
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { BytesPipe } from './bytes.pipe';
import { EmptyPipe } from './empty.pipe';
import { HighlightPipe } from './highlight.pipe';
import { SafeStylePipe } from './safe-style.pipe';
import { StrongifyPipe } from './strongify.pipe';
......@@ -13,6 +14,7 @@ import { TruncatePipe } from './truncate.pipe';
StrongifyPipe,
TruncatePipe,
SafeStylePipe,
EmptyPipe,
],
imports: [
CommonModule
......@@ -23,6 +25,7 @@ import { TruncatePipe } from './truncate.pipe';
StrongifyPipe,
TruncatePipe,
SafeStylePipe,
EmptyPipe,
]
})
export class PipesModule { }
ui/ui-frontend/projects/identity/src/app/user/user-list/user-list.component.html
+ 130
− 152
View file @ ee4ca64f
<table
class="vitamui-table"
vitamuiCommonInfiniteScroll
(vitamuiScroll)="onScroll()"
>
<thead>
<tr>
<th>
<div class="vitamui-table-header">
<button
class="vitamui-filter-button"
[vitamuiCommonTableFilter]="statusFilterTemplate"
[class.active]="filterMap['status'] && filterMap['status'].length > 0"
>
<i class="material-icons vitamui-row-icon">filter_list</i>
</button>
<div vitamuiCommonInfiniteScroll (vitamuiScroll)="onScroll()">
<div class="vitamui-table">
<div class="vitamui-table-head">
<div class="row col-2">
<button class="vitamui-filter-button" [vitamuiCommonTableFilter]="statusFilterTemplate"
[class.active]="filterMap['status'] && filterMap['status'].length > 0">
<i class="material-icons vitamui-row-icon">filter_list</i>
</button>
<ng-template #statusFilterTemplate>
<vitamui-common-table-filter [(filter)]="filterMap['status']" (filterChange)="onFilterChange('status', $event)">
<vitamui-common-table-filter-option value="ENABLED">
<div class="table-filter-icon" i18n="@@userStatusEnabled">
<i class="vitamui-icon vitamui-icon-user status-badge status-badge-green close"></i>
<span class="badge-state">Actif</span>
</div>
</vitamui-common-table-filter-option>
<vitamui-common-table-filter-option value="BLOCKED">
<div class="table-filter-icon" i18n="@@userStatusBlocked">
<i class="vitamui-icon vitamui-icon-user status-badge status-badge-orange close"></i>
<span class="badge-state">Bloqué</span>
</div>
</vitamui-common-table-filter-option>
<vitamui-common-table-filter-option value="DISABLED">
<div class="table-filter-icon" i18n="@@userStatusDisabled">
<i class="vitamui-icon vitamui-icon-user status-badge status-badge-grey close"></i>
<span class="badge-state">Désactivé</span>
</div>
</vitamui-common-table-filter-option>
<vitamui-common-table-filter-option value="REMOVED">
<div class="table-filter-icon" i18n="@@userStatusRemoved">
<i class="vitamui-icon vitamui-icon-user parent"><span class="status-badge-anonym">x</span></i>
<span class="badge-state">Effacé</span>
</div>
</vitamui-common-table-filter-option>
<vitamui-common-table-filter-option *vitamuiCommonHasAnyRole="genericUserRole" value="GENERIC" [separator]="true">
<div class="table-filter-icon" i18n="@@userTypeGeneric">
<i class="vitamui-icon vitamui-icon-user parent"></i>
<span class="badge-state">Générique</span>
</div>
</vitamui-common-table-filter-option>
</vitamui-common-table-filter>
</ng-template>
<ng-template #statusFilterTemplate>
<vitamui-common-table-filter [(filter)]="filterMap['status']"
(filterChange)="onFilterChange('status', $event)">
<vitamui-common-table-filter-option value="ENABLED" [separator]="true">
<div class="table-filter-icon" i18n="@@userStatusEnabled">
<span class="badge-state">Actif</span>
</div>
</vitamui-common-table-filter-option>
<vitamui-common-table-filter-option value="BLOCKED" [separator]="true">
<div class="table-filter-icon" i18n="@@userStatusBlocked">
<span class="badge-state">Bloqué</span>
</div>
</vitamui-common-table-filter-option>
<vitamui-common-table-filter-option value="DISABLED" [separator]="true">
<div class="table-filter-icon" i18n="@@userStatusDisabled">
<span class="badge-state">Désactivé</span>
</div>
</vitamui-common-table-filter-option>
<vitamui-common-table-filter-option value="REMOVED" [separator]="true">
<div class="table-filter-icon" i18n="@@userStatusRemoved">
<span class="badge-state">Effacé</span>
</div>
</vitamui-common-table-filter-option>
<vitamui-common-table-filter-option *vitamuiCommonHasAnyRole="genericUserRole" value="GENERIC"
[separator]="true">
<div class="table-filter-icon" i18n="@@userTypeGeneric">
<span class="badge-state">Générique</span>
</div>
</vitamui-common-table-filter-option>
</vitamui-common-table-filter>
</ng-template>
<i class="vitamui-icon vitamui-icon-user vitamui-row-icon"></i>
<vitamui-common-order-by-button orderByKey="status" [(orderBy)]="orderBy" [(direction)]="direction"
(orderChange)="emitOrderChange()"></vitamui-common-order-by-button>
</div>
</th>
<th>
<div class="vitamui-table-header">
<span i18n="User name column header@@userListUserNameHeader">Nom / Prénom</span>
<vitamui-common-order-by-button orderByKey="lastname" [(orderBy)]="orderBy" [(direction)]="direction"
(orderChange)="emitOrderChange()"></vitamui-common-order-by-button>
</div>
</th>
<th>
<div class="vitamui-table-header">
<span i18n="User id column header@@userListIDHeader">Identifiant</span>
<vitamui-common-order-by-button orderByKey="identifier" [(orderBy)]="orderBy" [(direction)]="direction"
(orderChange)="emitOrderChange()">
</vitamui-common-order-by-button>
</div>
</th>
<th>
<div class="vitamui-table-header">
<span i18n="User lastConnexion name column header@@userListLastConnexionHeader">Dernière <br>connexion</span>
<vitamui-common-order-by-button orderByKey="lastConnection" [(orderBy)]="orderBy" [(direction)]="direction"
(orderChange)="emitOrderChange()">
</vitamui-common-order-by-button>
</div>
</th>
<th>
<div class="vitamui-table-header">
<button class="vitamui-filter-button" [vitamuiCommonTableFilter]="levelFilterTemplate"
[class.active]="filterMap['level'] && filterMap['level'].length > 0" #levelFilterTrigger="vitamuiCommonTableFilter">
<i class="material-icons vitamui-row-icon">filter_list</i>
</button>
<i class="vitamui-icon vitamui-icon-user vitamui-row-icon " [style.fontSize.px]="30"></i>
<vitamui-common-order-by-button orderByKey="status" [(orderBy)]="orderBy" [(direction)]="direction"
(orderChange)="emitOrderChange()"></vitamui-common-order-by-button>
<ng-template #levelFilterTemplate>
<vitamui-common-table-filter-search
[(filter)]="filterMap['level']"
[options]="levelFilterOptions"
(filterChange)="onFilterChange('level', $event)"
(filterClose)="levelFilterTrigger?.close()"
emptyValueOption="-Niveau vide-"
i18n-emptyValueOption="@@userListLevelFilterEmpty"
></vitamui-common-table-filter-search>
</ng-template>
</div>
<div class="col-2" i18n="User name column header@@userListUserNameHeader"><span>Nom / Prénom&nbsp;</span>
<vitamui-common-order-by-button orderByKey="lastname" [(orderBy)]="orderBy" [(direction)]="direction"
(orderChange)="emitOrderChange()"></vitamui-common-order-by-button>
</div>
<div class="col-2" i18n="User id column header@@userListIDHeader"><span>Identifiant&nbsp;</span>
<vitamui-common-order-by-button orderByKey="identifier" [(orderBy)]="orderBy" [(direction)]="direction"
(orderChange)="emitOrderChange()">
</vitamui-common-order-by-button>
</div>
<div class="col-2" i18n="User lastConnexion name column header@@userListLastConnexionHeader"><span>Dernière
connexion&nbsp;</span>
<vitamui-common-order-by-button orderByKey="lastConnection" [(orderBy)]="orderBy" [(direction)]="direction"
(orderChange)="emitOrderChange()">
</vitamui-common-order-by-button>
</div>
<div class="row col-2">
<button class="vitamui-filter-button" [vitamuiCommonTableFilter]="levelFilterTemplate"
[class.active]="filterMap['level'] && filterMap['level'].length > 0"
#levelFilterTrigger="vitamuiCommonTableFilter">
<i class="material-icons vitamui-row-icon">filter_list</i>
</button>
<span i18n="Strong userGroup column header@@userListStrongAuthenticationHeader">Niveau</span>
<vitamui-common-order-by-button orderByKey="level" [(orderBy)]="orderBy" [(direction)]="direction"
(orderChange)="emitOrderChange()">
</vitamui-common-order-by-button>
</div>
</th>
<th>
<div class="vitamui-table-header">
<button
class="vitamui-filter-button"
[vitamuiCommonTableFilter]="groupFilterTemplate"
[class.active]="filterMap['group'] && filterMap['group'].length > 0"
#groupFilterTrigger="vitamuiCommonTableFilter"
>
<i class="material-icons vitamui-row-icon">filter_list</i>
</button>
<ng-template #levelFilterTemplate>
<vitamui-common-table-filter-search [(filter)]="filterMap['level']" [options]="levelFilterOptions"
(filterChange)="onFilterChange('level', $event)" (filterClose)="levelFilterTrigger?.close()"
emptyValueOption="-Niveau vide-" i18n-emptyValueOption="@@userListLevelFilterEmpty">
</vitamui-common-table-filter-search>
</ng-template>
<ng-template #groupFilterTemplate>
<vitamui-common-table-filter-search
[(filter)]="filterMap['group']"
[options]="groupFilterOptions"
(filterChange)="onFilterChange('group', $event)"
(filterClose)="groupFilterTrigger?.close()"
></vitamui-common-table-filter-search>
</ng-template>
<span i18n="Strong userGroup column header@@userListStrongAuthenticationHeader">Niveau du goupe&nbsp;</span>
<vitamui-common-order-by-button orderByKey="level" [(orderBy)]="orderBy" [(direction)]="direction"
(orderChange)="emitOrderChange()">
</vitamui-common-order-by-button>
</div>
<div class="row col-2">
<button class="vitamui-filter-button" [vitamuiCommonTableFilter]="groupFilterTemplate"
[class.active]="filterMap['group'] && filterMap['group'].length > 0"
#groupFilterTrigger="vitamuiCommonTableFilter">
<i class="material-icons vitamui-row-icon">filter_list</i>
</button>
<span i18n="Strong userProfileGroup column header@@userListStrongAuthenticationHeader">Groupe</span>
</div>
</th>
</tr>
</thead>
<tbody *ngIf="loaded">
<tr class="user-row" *ngFor="let user of dataSource; let index = index">
<td>
<ng-container *ngIf="user?.type !== 'GENERIC'; else genericUserIcon">
<i class="vitamui-icon vitamui-icon-user vitamui-row-icon status-badge status-badge-green close" *ngIf="user?.status === 'ENABLED'"></i>
<i class="vitamui-icon vitamui-icon-user vitamui-row-icon status-badge status-badge-orange" *ngIf="user?.status === 'BLOCKED'"></i>
<i class="vitamui-icon vitamui-icon-user vitamui-row-icon status-badge status-badge-grey" *ngIf="user?.status === 'DISABLED'"></i>
<div *ngIf="user?.status === 'REMOVED'"><i class="vitamui-icon vitamui-icon-user vitamui-row-icon parent"></i><span class="status-badge-anonym">x</span></div>
</ng-container>
<ng-template #genericUserIcon>
<i class="vitamui-icon vitamui-icon-user vitamui-row-icon"></i>
<ng-template #groupFilterTemplate>
<vitamui-common-table-filter-search [(filter)]="filterMap['group']" [options]="groupFilterOptions"
(filterChange)="onFilterChange('group', $event)" (filterClose)="groupFilterTrigger?.close()">
</vitamui-common-table-filter-search>
</ng-template>
</td>
<td class="clickable" (click)="userClick.emit(user)">
{{ user?.lastname | uppercase }} {{ user?.firstname }} <br> <span class="email"> {{ user?.email }} </span>
</td>
<td class="clickable" (click)="userClick.emit(user)">{{ user?.identifier }}</td>
<td class="clickable" (click)="userClick.emit(user)">{{ user?.lastConnection|date:'dd/MM/yyyy'}}</td>
<td class="clickable" (click)="userClick.emit(user)">{{ user?.level }}</td>
<td class="clickable" (click)="userClick.emit(user)">{{ getGroup(user)?.name }}</td>
</tr>
</tbody>
</table>
<div class="vitamui-table-footer">
<mat-spinner *ngIf="pending" class="vitamui-spinner medium"></mat-spinner>
<button *ngIf="!pending && infiniteScrollDisabled && userService.canLoadMore" (click)="loadMore()" class="btn" i18n="Show more results@@tableMoreResultButton">
Afficher plus de résultats...
</button>
<!-- <span *ngIf="!pending && !userService.canLoadMore">Fin des résultats</span> -->
</div>
<span i18n="Strong userProfileGroup column header@@userListStrongAuthenticationHeader">Groupe de
profils&nbsp;</span>
</div>
</div>
<div class="vitamui-table-body">
<div class="vitamui-table-rows" *ngFor="let user of dataSource; let index = index" (click)="userClick.emit(user)">
<div class="vitamui-row d-flex align-items-center clickable">
<div class="row col-2 padding-user">
<ng-container *ngIf="user?.type !== 'GENERIC'; else genericUserIcon">
<ng-container [ngSwitch]="user?.status">
<div *ngSwitchCase="'ENABLED'">
<i class="vitamui-icon vitamui-icon-user vitamui-row-icon status-badge status-badge-green close"
[style.fontSize.px]="30"></i>
</div>
<div *ngSwitchCase="'BLOCKED'">
<i class="vitamui-icon vitamui-icon-user vitamui-row-icon status-badge status-badge-orange"
[style.fontSize.px]="30"></i>
</div>
<div *ngSwitchCase="'DISABLED'">
<i class="vitamui-icon vitamui-icon-user vitamui-row-icon status-badge status-badge-grey"
[style.fontSize.px]="30"></i>
</div>
</ng-container>
<div *ngIf="user?.status === 'REMOVED'"><i class="vitamui-icon vitamui-icon-user vitamui-row-icon parent"
[style.fontSize.px]="30"></i><span class="status-badge-anonym">x</span></div>
</ng-container>
<ng-template #genericUserIcon>
<i [style.fontSize.px]="30" class="vitamui-icon vitamui-icon-user vitamui-row-icon"></i>
</ng-template>
</div>
<div class="col-3">
<div> {{ user?.lastname | uppercase }} {{ user?.firstname }} </div> <span class="email"> {{ user?.email }}
</span>
</div>
<div class="col-1 text-right">{{ user?.identifier }}</div>
<div class="col-2 text-right">{{ user?.lastConnection|date:'dd/MM/yyyy'|empty}}</div>
<div class="row col-2">{{ user?.level }}{{ user?.level }}</div>
<div class="row col-2">{{ getGroup(user)?.name }}</div>
</div>
</div>
</div>
ui/ui-frontend/projects/identity/src/app/user/user-list/user-list.component.scss
+ 44
− 30
View file @ ee4ca64f
@import '~ui-frontend-common/sass/variables/colors';
@import '~ui-frontend-common/sass/mixins/elevation';
@import "~ui-frontend-common/sass/variables/colors";
@import "~ui-frontend-common/sass/mixins/elevation";
.parent {
position: relative;
position: relative;
}
.status-badge-anonym {
@include elevation-1;
font-family: Helvetica, sans-serif;
font-size: 10px;
font-weight: 200;
color: $white;
width: 16px;
height: 16px;
display: block;
position: absolute;
left: 100%;
top: 100%;
margin-left: -8px;
margin-top: -8px;
padding: 2px 3px 3px 4px;
border-radius: 50%;
background-color: #696969;
border: solid 2px $white;
@include elevation-1;
font-family: Helvetica, sans-serif;
font-size: 10px;
font-weight: 200;
color: $white;
width: 16px;
height: 16px;
display: block;
position: absolute;
left: 100%;
top: 100%;
margin-left: -8px;
margin-top: -8px;
padding: 2px 3px 3px 4px;
border-radius: 50%;
background-color: var(--vitamui-grey-600);
border: solid 2px $white;
}
span.email {
font-size: 13px;
text-align: left;
color: $greyish-two;
font-size: 13px;
text-align: left;
color: var(--vitamui-grey-600);
}
vitamui-common-table-filter-option .vitamui-icon {
font-size: 24px;
color: #B7B7B7;
margin-right: 15px;
font-size: 24px;
color: var(--vitamui-grey);
margin-right: 15px;
}
.table-filter-icon {
display: flex;
align-items: center;
span.badge-state {
margin-left: 18px;
}
}
.vitamui-table-head{
> div {
display: flex;
align-items: center;
span.badge-state {
margin-left: 18px;
}
flex-wrap: nowrap;
}
}
.padding-user {
padding-left: 2.5rem;
}
.text-right {
text-align: right;
}
ui/ui-frontend/projects/identity/src/app/user/user.component.html
+ 13
− 32
View file @ ee4ca64f
......@@ -4,39 +4,20 @@
<app-user-preview *ngIf="openedItem" (previewClose)="closePanel()" [user]="openedItem" [customer]="customer"></app-user-preview>
</mat-sidenav>
<mat-sidenav-content class="overflow-none vitamui-body">
<div class="vitamui-header">
<div class="vitamui-container">
<h2 i18n="Search a user@@UserSearchHeader">
<img src="assets/mini-logo-vitam.png">Rechercher <strong>un utilisateur</strong>
</h2>
<div class="controls">
<vitamui-common-search-bar
name="user-search"
(search)="onSearchSubmit($event)"
placeholder="Nom, Prénom, ..." i18n-placeholder="@@userSearchPlaceholder"
></vitamui-common-search-bar>
<div class="actions">
<button class="btn secondary" (click)="openCreateUserDialog()" [disabled]="!connectedUserInfo.createUser">
<i class="vitamui-icon vitamui-icon-user-plus"></i> <span>Créer un utilisateur</span>
</button>
<button class="btn more-actions" [matMenuTriggerFor]="moreMenu">
<i class="material-icons">more_horiz</i> <span i18n="More actions button label@@userListMoreActionsButton">Autres actions</span>
</button>
<mat-menu #moreMenu="matMenu" [overlapTrigger]="false" class="more-actions-menu" xPosition="before">
<button mat-menu-item i18n="Coming soon@@userComingSoon">Bientôt</button>
</mat-menu>
</div>
</div>
</div>
</div>
<mat-sidenav-content class="overflow-none vitamui-body">
<vitamui-common-title-breadcrumb [data]="breadCrumbData">
<span i18n="Search a user@@administrateUsers">
Administrer mes utilisateurs
</span>
</vitamui-common-title-breadcrumb>
<vitamui-common-banner [searchbarPlaceholder]="'Nom, Prénom, N° d \'identifiant, groupe'"
i18n-placeholder="@@userSearchPlaceholder" (search)="onSearchSubmit($event)">
<button class="btn primary" (click)="openCreateUserDialog()" [disabled]="!connectedUserInfo.createUser">
<span>Créer un Utilisateur</span>
</button>
</vitamui-common-banner>
<app-user-list [search]="search" [connectedUserInfo]="connectedUserInfo" (userClick)="openPanel($event)"></app-user-list>
</mat-sidenav-content>
</mat-sidenav-container>
ui/ui-frontend/projects/identity/src/app/user/user.component.scss
+ 0
− 4
View file @ ee4ca64f
.vitamui-header {
background-image: url('/assets/user-header-bg.jpg');
}
ui/ui-frontend/projects/identity/src/app/user/user.component.ts
+ 14
− 1
View file @ ee4ca64f
......@@ -37,9 +37,11 @@
import { Component, OnInit, ViewChild } from '@angular/core';
import { MatDialog } from '@angular/material/dialog';
import { ActivatedRoute } from '@angular/router';
import { BreadCrumbData } from 'ui-frontend-common';
import { AdminUserProfile, AuthService, Customer, DEFAULT_PAGE_SIZE, Direction, GlobalEventService,
PageRequest, SidenavPage, User } from 'ui-frontend-common';
import { ApplicationService } from 'ui-frontend-common';
import { CustomerService } from '../core/customer.service';
import { UserCreateComponent } from './user-create/user-create.component';
import { UserListComponent } from './user-list/user-list.component';
......@@ -56,6 +58,8 @@ export class UserComponent extends SidenavPage<User> implements OnInit {
connectedUserInfo: AdminUserProfile;
customer: Customer;
search: string;
public breadCrumbData: BreadCrumbData[];
@ViewChild(UserListComponent, { static: true }) userListComponent: UserListComponent;
......@@ -65,7 +69,9 @@ export class UserComponent extends SidenavPage<User> implements OnInit {
public customerService: CustomerService,
public globalEventService: GlobalEventService,
private authService: AuthService,
route: ActivatedRoute,
private route: ActivatedRoute,
private applicationService: ApplicationService,
) {
super(route, globalEventService);
}
......@@ -73,6 +79,13 @@ export class UserComponent extends SidenavPage<User> implements OnInit {
ngOnInit() {
this.customerService.getMyCustomer().subscribe((customer) => this.customer = customer);
this.connectedUserInfo = this.userService.getUserProfileInfo(this.authService.user);
const appId = this.route.snapshot.data.appId;
this.breadCrumbData = [{ label: 'Portail' },
{
label: this.applicationService.getAppById(appId).name,
identifier: appId
}];
}
openCreateUserDialog() {
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment