From 290f76c67a849b28a65d7ff5477e90a36ca147c5 Mon Sep 17 00:00:00 2001
From: Alex ORLUC <alex.orluc@maarch.org>
Date: Wed, 29 May 2019 16:38:30 +0200
Subject: [PATCH] FEAT #10599 TIME 0:30 add loader img avatar
---
.../visa-workflow.component.html | 5 +-
.../visa-workflow.component.scss | 5 ++
.../app/sidebar/sidebar.component.html | 52 ++++++++++++-------
.../app/sidebar/sidebar.component.scss | 8 +++
4 files changed, 51 insertions(+), 19 deletions(-)
diff --git a/src/frontend/app/document/visa-workflow/visa-workflow.component.html b/src/frontend/app/document/visa-workflow/visa-workflow.component.html
index 51ed3123e4..a7cf7eecbe 100644
--- a/src/frontend/app/document/visa-workflow/visa-workflow.component.html
+++ b/src/frontend/app/document/visa-workflow/visa-workflow.component.html
@@ -11,8 +11,11 @@
{{'lang.noPerson' | translate}}
</div>
<mat-list-item *ngFor="let diffusion of visaWorkflow;let i=index" [class.current]="diffusion.current">
- <mat-icon class="avatar" mat-list-icon color="primary"
+ <mat-icon *ngIf="diffusion.userPicture !== undefined" class="avatar" mat-list-icon color="primary"
[style.background-image]="'url('+diffusion.userPicture+')'"></mat-icon>
+ <div *ngIf="diffusion.userPicture === undefined" mat-list-icon class="avatar">
+ <mat-spinner diameter="50"></mat-spinner>
+ </div>
<h4 mat-line class="userDisplay primary">
{{diffusion.userDisplay}}
</h4>
diff --git a/src/frontend/app/document/visa-workflow/visa-workflow.component.scss b/src/frontend/app/document/visa-workflow/visa-workflow.component.scss
index 0125d59d6d..16786914c6 100644
--- a/src/frontend/app/document/visa-workflow/visa-workflow.component.scss
+++ b/src/frontend/app/document/visa-workflow/visa-workflow.component.scss
@@ -91,4 +91,9 @@
position: absolute;
left: 0px;
font-size: 24px;
+}
+
+.mat-spinner {
+ left: 8px;
+ top: 8px;
}
\ No newline at end of file
diff --git a/src/frontend/app/sidebar/sidebar.component.html b/src/frontend/app/sidebar/sidebar.component.html
index d112d44597..39afae27f9 100755
--- a/src/frontend/app/sidebar/sidebar.component.html
+++ b/src/frontend/app/sidebar/sidebar.component.html
@@ -1,36 +1,48 @@
<nav class="sidebar" *ngIf="snavLeftComponent.opened">
<div class="main-header">
<header class="profile-header">
- <button class="logout-button" mat-icon-button (click)="logout()">
- <mat-icon fontSet="fas" fontIcon="fa-power-off"></mat-icon>
- </button>
- <button *ngIf="signaturesService.mainDocumentId > 0 && signaturesService.mobileMode" class="closePanel" mat-icon-button type="button" (tap)="snavLeftComponent.close();">
- <mat-icon fontSet="fas" fontIcon="fa-arrow-left fa-2x"></mat-icon>
- </button>
+ <button class="logout-button" mat-icon-button (click)="logout()">
+ <mat-icon fontSet="fas" fontIcon="fa-power-off"></mat-icon>
+ </button>
+ <button *ngIf="signaturesService.mainDocumentId > 0 && signaturesService.mobileMode" class="closePanel"
+ mat-icon-button type="button" (tap)="snavLeftComponent.close();">
+ <mat-icon fontSet="fas" fontIcon="fa-arrow-left fa-2x"></mat-icon>
+ </button>
<div class="user" style="color: #F99830">
{{signaturesService.userLogged.firstname}} {{signaturesService.userLogged.lastname}}
</div>
- <div *ngIf="signaturesService.userLogged.picture" class="avatar" [ngStyle]="{'background': 'url(' + signaturesService.userLogged.picture + ') no-repeat scroll center center / cover'}" (click)="openProfile()">
+ <div *ngIf="signaturesService.userLogged.picture" class="avatar"
+ [ngStyle]="{'background': 'url(' + signaturesService.userLogged.picture + ') no-repeat scroll center center / cover'}"
+ (click)="openProfile()">
</div>
</header>
<header class="sidebar-header">
- <div *ngIf="!searchMode"(click)="search();" style="cursor: pointer;">
- <span [class.primary]="signaturesService.mode != ''">{{signaturesService.documentsListCount}}</span> {{'lang.documents' | translate}} <span class="primary" *ngIf="signaturesService.mode != ''">{{'lang.'+signaturesService.mode+'Label' | translate}}</span>
+ <div *ngIf="!searchMode" (click)="search();" style="cursor: pointer;">
+ <span
+ [class.primary]="signaturesService.mode != ''">{{signaturesService.documentsListCount}}</span> {{'lang.documents' | translate}} <span
+ class="primary"
+ *ngIf="signaturesService.mode != ''">{{'lang.'+signaturesService.mode+'Label' | translate}}</span>
</div>
- <button *ngIf="!searchMode" color="primary" mat-icon-button type="button" (click)="search();" title="{{'lang.search' | translate}}">
+ <button *ngIf="!searchMode" color="primary" mat-icon-button type="button" (click)="search();"
+ title="{{'lang.search' | translate}}">
<mat-icon fontSet="fas" fontIcon="fa-search fa-2x"></mat-icon>
</button>
<mat-form-field *ngIf="searchMode" floatLabel="never">
- <input #searchInput matInput placeholder="Filtrer par objet / chrono" [formControl]="searchTerm" (keyup)="loadingList=true;">
- <button matSuffix color="primary" mat-icon-button type="button" (click)="searchMode = !searchMode;this.filter('');" title="{{'lang.cancel' | translate}}">
- <mat-icon fontSet="fas" fontIcon="fa-times fa-2x"></mat-icon>
- </button>
+ <input #searchInput matInput placeholder="Filtrer par objet / chrono" [formControl]="searchTerm"
+ (keyup)="loadingList=true;">
+ <button matSuffix color="primary" mat-icon-button type="button"
+ (click)="searchMode = !searchMode;this.filter('');" title="{{'lang.cancel' | translate}}">
+ <mat-icon fontSet="fas" fontIcon="fa-times fa-2x"></mat-icon>
+ </button>
</mat-form-field>
</header>
<section class="sidebar-btn">
- <button class="btn btn-xs blue filter" [ngClass]="[signaturesService.mode == 'sign' ? 'active' : '']" (click)="filter('sign')">{{'lang.signLabel' | translate | titlecase}}</button>
- <button class="btn btn-xs blue filter" [ngClass]="[signaturesService.mode == 'visa' ? 'active' : '']" (click)="filter('visa')">{{'lang.visaLabel' | translate | titlecase}}</button>
- <button class="btn btn-xs blue filter" [ngClass]="[signaturesService.mode == 'note' ? 'active' : '']" (click)="filter('note')">{{'lang.noteLabel' | translate | titlecase}}</button>
+ <button class="btn btn-xs blue filter" [ngClass]="[signaturesService.mode == 'sign' ? 'active' : '']"
+ (click)="filter('sign')">{{'lang.signLabel' | translate | titlecase}}</button>
+ <button class="btn btn-xs blue filter" [ngClass]="[signaturesService.mode == 'visa' ? 'active' : '']"
+ (click)="filter('visa')">{{'lang.visaLabel' | translate | titlecase}}</button>
+ <button class="btn btn-xs blue filter" [ngClass]="[signaturesService.mode == 'note' ? 'active' : '']"
+ (click)="filter('note')">{{'lang.noteLabel' | translate | titlecase}}</button>
</section>
</div>
<ul #listContent class="nav" detect-scroll (onScroll)="handleScroll($event)" [bottomOffset]="1" [topOffset]="1">
@@ -38,7 +50,8 @@
<mat-spinner></mat-spinner>
</div>
<ng-container *ngFor="let document of signaturesService.documentsList;let i=index">
- <li [class.active]="signaturesService.mainDocumentId === document.id" class="nav-item" matRipple (click)="gotTo(document.id, i)">
+ <li [class.active]="signaturesService.mainDocumentId === document.id" class="nav-item" matRipple
+ (click)="gotTo(document.id, i)">
<div class="nav-item-left">
<i class="fas" [ngClass]="{
'fa-file-signature':document.mode == 'sign',
@@ -55,5 +68,8 @@
</div>
</li>
</ng-container>
+ <span *ngIf="signaturesService.documentsList.length == 0" class="noResult">
+ Aucun résultat
+ </span>
</ul>
</nav>
\ No newline at end of file
diff --git a/src/frontend/app/sidebar/sidebar.component.scss b/src/frontend/app/sidebar/sidebar.component.scss
index 2983f38c8f..9c3976b2bd 100644
--- a/src/frontend/app/sidebar/sidebar.component.scss
+++ b/src/frontend/app/sidebar/sidebar.component.scss
@@ -184,4 +184,12 @@
background-color: #F99830;
border-radius: 10px;
margin-left: 5px;
+}
+
+.noResult {
+ position: absolute;
+ top: 50%;
+ text-align: center;
+ width: 100%;
+ opacity: 0.5;
}
\ No newline at end of file
--
GitLab