Skip to content
Snippets Groups Projects
Commit e8bbf632 authored by Guillaume Heurtier's avatar Guillaume Heurtier
Browse files

Merge branch 'fix/20773/develop' into 'develop'

[20773] Affichage indisponible si la liste des utilisateurs dans l'administration des groupes est trop longue (develop)

See merge request maarch/MaarchParapheur!137
parents 268caac4 12088d70
No related branches found
No related tags found
No related merge requests found
...@@ -649,6 +649,8 @@ ...@@ -649,6 +649,8 @@
"licence": "GNU GPLv3 license", "licence": "GNU GPLv3 license",
"groupsToManage": "Choose the authorized assignment groups", "groupsToManage": "Choose the authorized assignment groups",
"unlinkGroup": "Unlink group", "unlinkGroup": "Unlink group",
"emptyGroups": "No groups available to associate" "emptyGroups": "No groups available to associate",
"emptyGroupUsers": "No users associated with this group",
"emptyUsers": "No users available to associate"
} }
} }
\ No newline at end of file
...@@ -648,6 +648,8 @@ ...@@ -648,6 +648,8 @@
"licence": "licence GNU GPLv3", "licence": "licence GNU GPLv3",
"groupsToManage": "Choisir les groupes d'affectations autorisés", "groupsToManage": "Choisir les groupes d'affectations autorisés",
"unlinkGroup": "Dissocier le groupe", "unlinkGroup": "Dissocier le groupe",
"emptyGroups": "Aucun groupe disponible à associer" "emptyGroups": "Aucun groupe disponible à associer",
"emptyGroupUsers": "Aucun utilisateur associé à ce groupe",
"emptyUsers": "Aucun utilisateur disponible à associer"
} }
} }
...@@ -29,52 +29,61 @@ ...@@ -29,52 +29,61 @@
</ion-button> </ion-button>
</ion-item> </ion-item>
</div> </div>
<ion-item lines="none" *ngIf="!creationMode"> <ng-container *ngIf="!creationMode">
<ion-label color="secondary">{{'lang.linkedUsers' | translate}} :</ion-label> <ion-item lines="none">
</ion-item> <ion-label color="secondary">{{'lang.linkedUsers' | translate}} :</ion-label>
<ion-searchbar [placeholder]="'lang.filter' | translate" style="margin-left: 4x; display: flex; width: 50%;" </ion-item>
(ionChange)="applyFilter($event.detail.value)"> <ion-searchbar [placeholder]="'lang.filter' | translate" style="margin-left: 4x; display: flex; width: 50%;"
</ion-searchbar> (ionChange)="applyFilter($event.detail.value)">
<ion-card *ngIf="!creationMode" style="height: 400px; overflow-y: auto;"> </ion-searchbar>
<ion-list> <ion-content style="height: 400px; overflow-y: auto;">
<ion-item style="position: sticky;top:0px;z-index:1;"> <ion-list>
<ng-container style="display: flex;align-items: center;justify-content: center;width: 100%;background: white;"> <ion-item style="position: sticky;top:0px;z-index:1;">
<ion-label color="primary" matSort [matSortActive]="displayedColumns[1]" matSortDirection='asc' <ng-container style="display: flex;align-items: center;justify-content: center;width: 100%;background: white;">
style="display: flex;font-size: 12px;align-items: center;" (matSortChange)="sortData($event)"> <ion-label color="primary" matSort [matSortActive]="displayedColumns[1]" matSortDirection='asc'
<ng-container *ngFor="let col of displayedColumns"> style="display: flex;font-size: 12px;align-items: center;" (matSortChange)="sortData($event)">
<div [mat-sort-header]="col" disableClear style="flex: 1" *ngIf="col!=='actions'"> <ng-container *ngFor="let col of displayedColumns">
{{'lang.' + col | translate}} <div [mat-sort-header]="col" disableClear style="flex: 1" *ngIf="col!=='actions'">
</div> {{'lang.' + col | translate}}
</ng-container> </div>
<div style="flex: 1;text-align: right;" *ngIf="displayedColumns.indexOf('actions') > -1"> </ng-container>
<ion-button slot="end" color="primary" fille="outline" shape="round" <div style="flex: 1;text-align: right;" *ngIf="displayedColumns.indexOf('actions') > -1">
(click)="openUserList()"> <ion-button slot="end" color="primary" fille="outline" shape="round"
{{'lang.add' | translate}} (click)="openUserList()">
</ion-button> {{'lang.add' | translate}}
</div> </ion-button>
</ion-label>
</ng-container>
<ion-button slot="end" fill="clear" shape="round" disabled>
<ion-icon></ion-icon>
</ion-button>
</ion-item>
<ion-virtual-scroll [items]="sortedData" approxItemHeight="50px">
<ion-item *virtualItem="let element" style="display: flex;">
<ion-label style="display: flex;cursor: pointer;"
routerLink="/administration/users/{{element.id}}">
<div style="flex: 1" *ngFor="let col of displayedColumns">
{{element[col]}}
</div> </div>
</ion-label> </ion-label>
<ion-button slot="end" fill="clear" shape="round" </ng-container>
(click)="$event.stopPropagation();unlinkUser(element)" <ion-button slot="end" fill="clear" shape="round" disabled>
title="{{'lang.unlinkUser' | translate}}"> <ion-icon></ion-icon>
<ion-icon color="danger" slot="icon-only" name="close-outline"></ion-icon>
</ion-button> </ion-button>
</ion-item> </ion-item>
</ion-virtual-scroll> <ion-virtual-scroll [items]="sortedData" approxItemHeight="50px">
</ion-list> <ion-item *virtualItem="let element" style="display: flex;">
</ion-card> <ion-label style="display: flex;cursor: pointer;"
routerLink="/administration/users/{{element.id}}">
<div style="flex: 1" *ngFor="let col of displayedColumns">
{{element[col]}}
</div>
</ion-label>
<ion-button slot="end" fill="clear" shape="round"
(click)="$event.stopPropagation();unlinkUser(element)"
title="{{'lang.unlinkUser' | translate}}">
<ion-icon color="danger" slot="icon-only" name="close-outline"></ion-icon>
</ion-button>
</ion-item>
</ion-virtual-scroll>
<ion-infinite-scroll threshold="100px" (ionInfinite)="loadData($event)" *ngIf="group.users.length > 7">
<ion-infinite-scroll-content loadingSpinner="bubbles" [loadingText]="'lang.loadingMoreData' | translate">
</ion-infinite-scroll-content>
</ion-infinite-scroll>
</ion-list>
<ion-item lines="none" *ngIf="group.users.length === 0" style="text-align: center; font-size: 20px; color: gray; margin-top: 5px;">
<ion-label>{{ 'lang.emptyGroupUsers' | translate }}</ion-label>
</ion-item>
</ion-content>
</ng-container>
<ion-item text-center lines="none" style="position: sticky;bottom:0px;z-index:1;"> <ion-item text-center lines="none" style="position: sticky;bottom:0px;z-index:1;">
<div style="display: flex;align-items: center;justify-content: center;width: 100%;background: white;"> <div style="display: flex;align-items: center;justify-content: center;width: 100%;background: white;">
<ion-button type="submit" shape="round" size="large" fill="outline" color="primary" <ion-button type="submit" shape="round" size="large" fill="outline" color="primary"
......
...@@ -84,7 +84,7 @@ export class GroupComponent implements OnInit { ...@@ -84,7 +84,7 @@ export class GroupComponent implements OnInit {
this.creationMode = false; this.creationMode = false;
this.usersList = []; this.usersList = [];
this.http.get('../rest/groups/' + params['id']) this.http.get(`../rest/groups/${params['id']}`)
.pipe( .pipe(
map((data: any) => data.group), map((data: any) => data.group),
finalize(() => { finalize(() => {
...@@ -462,6 +462,11 @@ export class GroupComponent implements OnInit { ...@@ -462,6 +462,11 @@ export class GroupComponent implements OnInit {
canManage(privilege: any) { canManage(privilege: any) {
return privilege.id === 'manage_users' && privilege.checked; return privilege.id === 'manage_users' && privilege.checked;
} }
loadData(event: any) {
event.target.complete();
event.target.disabled = true;
}
} }
......
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
</ion-toolbar> </ion-toolbar>
</ion-header> </ion-header>
<ion-content> <ion-content>
<ion-list> <ion-list *ngIf="usersList.length > 0">
<ion-virtual-scroll [items]="usersList" approxItemHeight="50px" style="height: 450px;"> <ion-virtual-scroll [items]="usersList" approxItemHeight="50px" style="height: 450px;">
<ion-item button *virtualItem="let element" (click)="selectUser(element)"> <ion-item button *virtualItem="let element" (click)="selectUser(element)">
<ion-label> <ion-label>
...@@ -13,4 +13,7 @@ ...@@ -13,4 +13,7 @@
</ion-item> </ion-item>
</ion-virtual-scroll> </ion-virtual-scroll>
</ion-list> </ion-list>
<ion-item lines="none" *ngIf="usersList.length === 0" style="text-align: center; font-size: 20px; color: gray; margin-top: 35%;">
<ion-label>{{'lang.emptyUsers' | translate}}</ion-label>
</ion-item>
</ion-content> </ion-content>
\ No newline at end of file
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment