Skip to content
Snippets Groups Projects
Commit 4df84aa6 authored by Alex ORLUC's avatar Alex ORLUC
Browse files

FEAT #15550 TIME 0:45 fix currentFilters + hide nb current filters

parent 4bfde894
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
src/frontend/app/search/search.component.html
+ 9
− 10
View file @ 4df84aa6
...@@ -11,28 +11,27 @@ ...@@ -11,28 +11,27 @@
</ion-menu-button> </ion-menu-button>
</ion-buttons> </ion-buttons>
</ion-toolbar> </ion-toolbar>
<ion-toolbar color="primary"> <ion-toolbar *ngIf="this.currentFilters.length > 0" color="primary" style="padding-left: 1px;padding-right: 1px;">
<ion-title slot="end" *ngIf="getNbFilters() >= 0">{{getNbFilters()}} {{'lang.currentFilters' | translate}}</ion-title> <div class="scrollfilters" slot="start">
<div class="scrollfilters" slot="start" *ngIf="this.currentFilters.length > 0"> <ion-button class="clearFilter"
<ion-button class="clearFilter" shape="round" size="small" fill="clear" slot="start" color="primary" (click)="clearFilters()" [title]="'lang.clearFilters' | translate">
shape="round" size="small" slot="start" color="primary" (click)="clearFilters()" [title]="'lang.clearFilters' | translate"> <ion-icon slot="icon-only" name="trash-bin-outline" color="light"></ion-icon>
<ion-icon slot="icon-only" name="backspace" color="light"></ion-icon>
</ion-button> </ion-button>
<div *ngFor="let currentFilter of currentFilters"> <div *ngFor="let currentFilter of currentFilters">
<ion-chip *ngIf="currentFilter.id === 'title' && currentFilter.val !== ''" color="light" <ion-chip outline *ngIf="currentFilter.id === 'title' && currentFilter.val !== ''" color="primary" style="background: white;"
[title]="'lang.titleSearch' | translate" (click)="removeFilter(currentFilter)"> [title]="'lang.titleSearch' | translate" (click)="removeFilter(currentFilter)">
<ion-icon name="document-text"></ion-icon> <ion-icon name="document-text"></ion-icon>
<ion-label >{{ currentFilter.val }}</ion-label> <ion-label >{{ currentFilter.val }}</ion-label>
<ion-icon name="close-circle"></ion-icon> <ion-icon name="close-circle"></ion-icon>
</ion-chip> </ion-chip>
<ion-chip *ngIf="currentFilter.id === 'reference' && currentFilter.val !== ''" color="light" <ion-chip outline *ngIf="currentFilter.id === 'reference' && currentFilter.val !== ''" color="primary" style="background: white;"
[title]="'lang.titleSearch' | translate" (click)="removeFilter(currentFilter)"> [title]="'lang.titleSearch' | translate" (click)="removeFilter(currentFilter)">
<ion-icon name="key"></ion-icon> <ion-icon name="key"></ion-icon>
<ion-label >{{ currentFilter.val }}</ion-label> <ion-label >{{ currentFilter.val }}</ion-label>
<ion-icon name="close-circle"></ion-icon> <ion-icon name="close-circle"></ion-icon>
</ion-chip> </ion-chip>
<div *ngIf="currentFilter.id === 'workflowStates' && currentFilter.val.length > 0"> <div *ngIf="currentFilter.id === 'workflowStates' && currentFilter.val.length > 0">
<ion-chip *ngFor="let item of currentFilter.val" color="light" <ion-chip outline *ngFor="let item of currentFilter.val" color="primary" style="background: white;"
[title]="'lang.workflowStatesSearch' | translate" (click)="removeFilter(currentFilter, item)"> [title]="'lang.workflowStatesSearch' | translate" (click)="removeFilter(currentFilter, item)">
<ion-icon name="options-outline"></ion-icon> <ion-icon name="options-outline"></ion-icon>
<ion-label>{{ getLabel(item) | translate}}</ion-label> <ion-label>{{ getLabel(item) | translate}}</ion-label>
...@@ -40,7 +39,7 @@ ...@@ -40,7 +39,7 @@
</ion-chip> </ion-chip>
</div> </div>
<div *ngIf="currentFilter.id === 'workflowUsers' && currentFilter.val.length > 0"> <div *ngIf="currentFilter.id === 'workflowUsers' && currentFilter.val.length > 0">
<ion-chip *ngFor="let item of currentFilter.val" color="light" <ion-chip outline *ngFor="let item of currentFilter.val" color="primary" style="background: white;"
[title]="'lang.workflowUsersSearch' | translate" (click)="removeFilter(currentFilter, item)"> [title]="'lang.workflowUsersSearch' | translate" (click)="removeFilter(currentFilter, item)">
<ion-icon name="person-circle"></ion-icon> <ion-icon name="person-circle"></ion-icon>
<ion-label >{{ item.firstname}} {{ item.lastname }}</ion-label> <ion-label >{{ item.firstname}} {{ item.lastname }}</ion-label>
......
src/frontend/app/search/search.component.scss
+ 5
− 1
View file @ 4df84aa6
...@@ -61,6 +61,7 @@ ...@@ -61,6 +61,7 @@
} }
.scrollfilters { .scrollfilters {
padding-left: 50px;
overflow: auto; overflow: auto;
white-space: nowrap; white-space: nowrap;
ion-chip, div { ion-chip, div {
...@@ -70,8 +71,11 @@ ...@@ -70,8 +71,11 @@
} }
ion-button.clearFilter { ion-button.clearFilter {
position: absolute;
background: var(--ion-color-primary);
position: -webkit-sticky; position: -webkit-sticky;
position: sticky;
left: 0; left: 0;
z-index: 1; z-index: 1;
left: -2px;
height: 31px;
} }
\ No newline at end of file
src/frontend/app/search/search.component.ts
+ 22
− 22
View file @ 4df84aa6
...@@ -115,7 +115,7 @@ export class SearchComponent implements OnInit { ...@@ -115,7 +115,7 @@ export class SearchComponent implements OnInit {
this.signaturesService.initTemplate(this.rightContent, this.viewContainerRef, 'rightContent'); this.signaturesService.initTemplate(this.rightContent, this.viewContainerRef, 'rightContent');
setTimeout(() => { setTimeout(() => {
this.menu.open('right-menu'); this.menu.open('right-menu');
}, 500); }, 500);
} }
ionViewWillLeave() { ionViewWillLeave() {
...@@ -160,14 +160,14 @@ export class SearchComponent implements OnInit { ...@@ -160,14 +160,14 @@ export class SearchComponent implements OnInit {
formatDatas() { formatDatas() {
const objToSend: any = {}; const objToSend: any = {};
const tmpArr = this.filters.filter((filter: any) => (filter.type === 'text' && filter.val !== '') || (filter.type !== 'text' && filter.val.length > 0)); const tmpArr = this.filters.filter((filter: any) => (filter.type === 'text' && filter.val !== '') || (filter.type !== 'text' && filter.val.length > 0));
tmpArr.forEach((filter: any) => { tmpArr.forEach((filter: any) => {
if (filter.id === 'workflowUsers') { if (filter.id === 'workflowUsers') {
objToSend[filter.id] = filter.val.map((item: any) => item.id); objToSend[filter.id] = filter.val.map((item: any) => item.id);
} else { } else {
objToSend[filter.id] = filter.val; objToSend[filter.id] = filter.val;
} }
}); });
return objToSend; return objToSend;
} }
...@@ -183,15 +183,15 @@ export class SearchComponent implements OnInit { ...@@ -183,15 +183,15 @@ export class SearchComponent implements OnInit {
getNbFilters() { getNbFilters() {
let nb_filters = 0; let nb_filters = 0;
for (let index = 0; index < this.filters.length; index++) { for (let index = 0; index < this.currentFilters.length; index++) {
if (!Array.isArray(this.filters[index].val) && this.filters[index].val !== '') { if (!Array.isArray(this.currentFilters[index].val) && this.currentFilters[index].val !== '') {
nb_filters ++; nb_filters++;
} }
if (Array.isArray(this.filters[index].val) && this.filters[index].val.length > 0) { if (Array.isArray(this.currentFilters[index].val) && this.currentFilters[index].val.length > 0) {
nb_filters += this.filters[index].val.length; nb_filters += this.currentFilters[index].val.length;
} }
} }
return nb_filters; return nb_filters;
} }
...@@ -209,7 +209,7 @@ export class SearchComponent implements OnInit { ...@@ -209,7 +209,7 @@ export class SearchComponent implements OnInit {
} }
}); });
const actionSheet = await this.actionSheetController.create({ const actionSheet = await this.actionSheetController.create({
header: this.translate.instant('lang.actions') + (item.reference !== null ? ' - ' + item.reference : '' ), header: this.translate.instant('lang.actions') + (item.reference !== null ? ' - ' + item.reference : ''),
buttons: buttons buttons: buttons
}); });
await actionSheet.present(); await actionSheet.present();
...@@ -237,13 +237,13 @@ export class SearchComponent implements OnInit { ...@@ -237,13 +237,13 @@ export class SearchComponent implements OnInit {
} }
launchSearch() { launchSearch() {
this.currentFilters = this.filters.filter((item: any)=> !this.functionsService.empty(item.val));
this.ressources = []; this.ressources = [];
this.offset = 0; this.offset = 0;
return new Promise((resolve) => { return new Promise((resolve) => {
this.http.post(`../rest/search/documents?limit=10&offset=0`, this.formatDatas()) this.http.post(`../rest/search/documents?limit=10&offset=0`, this.formatDatas())
.pipe( .pipe(
tap((data: any) => { tap((data: any) => {
this.currentFilters = JSON.parse(JSON.stringify(this.filters.filter((item: any) => !this.functionsService.empty(item.val))));
this.ressources = this.formatListDatas(data.documents); this.ressources = this.formatListDatas(data.documents);
this.count = data.count; this.count = data.count;
this.infiniteScroll.disabled = false; this.infiniteScroll.disabled = false;
...@@ -336,7 +336,7 @@ export class SearchComponent implements OnInit { ...@@ -336,7 +336,7 @@ export class SearchComponent implements OnInit {
async openPromptProof(item: any) { async openPromptProof(item: any) {
const alert = await this.alertController.create({ const alert = await this.alertController.create({
cssClass : 'promptProof', cssClass: 'promptProof',
header: this.translate.instant('lang.download'), header: this.translate.instant('lang.download'),
inputs: [ inputs: [
{ {
...@@ -377,7 +377,7 @@ export class SearchComponent implements OnInit { ...@@ -377,7 +377,7 @@ export class SearchComponent implements OnInit {
const onlyProof = mode === 'onlyProof' ? '&onlyProof=true' : ''; const onlyProof = mode === 'onlyProof' ? '&onlyProof=true' : '';
return new Promise((resolve) => { return new Promise((resolve) => {
this.http.get(`../rest/documents/${item.id}/proof?mode=stream${onlyProof}`, {responseType: 'blob' as 'json' }) this.http.get(`../rest/documents/${item.id}/proof?mode=stream${onlyProof}`, { responseType: 'blob' as 'json' })
.pipe( .pipe(
tap((data: any) => { tap((data: any) => {
const today = new Date(); const today = new Date();
...@@ -412,7 +412,7 @@ export class SearchComponent implements OnInit { ...@@ -412,7 +412,7 @@ export class SearchComponent implements OnInit {
} }
clearFilters() { clearFilters() {
$(".workflowStates").each(function(){ $(".workflowStates").each(function () {
$(this).prop("checked", false); $(this).prop("checked", false);
}); });
for (let index = 0; index < this.filters.length; index++) { for (let index = 0; index < this.filters.length; index++) {
...@@ -434,12 +434,12 @@ export class SearchComponent implements OnInit { ...@@ -434,12 +434,12 @@ export class SearchComponent implements OnInit {
this.filters.find((element: any) => element.id === filter.id).val = ''; this.filters.find((element: any) => element.id === filter.id).val = '';
} else { } else {
if (filter.id === 'workflowStates') { if (filter.id === 'workflowStates') {
$(".workflowStates").each(function() { $(".workflowStates").each(function () {
if ($(this).val() === item) { if ($(this).val() === item) {
$(this).prop("checked", false); $(this).prop("checked", false);
return false; return false;
} }
}); });
} else { } else {
const index = filter.val.indexOf(item); const index = filter.val.indexOf(item);
filter.val.splice(index, 1); filter.val.splice(index, 1);
...@@ -454,7 +454,7 @@ export class SearchComponent implements OnInit { ...@@ -454,7 +454,7 @@ export class SearchComponent implements OnInit {
} }
checkInput() { checkInput() {
if ((this.filters.find((el: any) => el.id === 'title').val === '') && (this.filters.find((el: any) => el.id === 'reference').val === '')) { if ((this.filters.find((el: any) => el.id === 'title').val === '') && (this.filters.find((el: any) => el.id === 'reference').val === '')) {
if ((this.filters.find((el: any) => el.id === 'workflowStates').val.length === 0) && (this.filters.find((el: any) => el.id === 'workflowUsers').val.length === 0)) { if ((this.filters.find((el: any) => el.id === 'workflowStates').val.length === 0) && (this.filters.find((el: any) => el.id === 'workflowUsers').val.length === 0)) {
this.clearFilters(); this.clearFilters();
this.currentFilters = []; this.currentFilters = [];
......
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