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

FEAT #13271 TIME 0:15 move add criteria button

parent ff6253b4
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
src/frontend/app/adv-search/criteria-tool/criteria-tool.component.html
+ 25
− 55
View file @ f7ff9f3c
<form (ngSubmit)="getCurrentCriteriaValues()" #criteriaFormUp="ngForm">
<mat-form-field floatLabel="never" class="basket-search">
<input class="metaSearch" type="text" matInput [matAutocomplete]="autoCriteria"
[placeholder]="'lang.quickSearch' | translate" [formControl]="searchTermControl">
<button mat-icon-button matPrefix type="button" (click)="focusFilter()"
[title]="'lang.displayCriteria' | translate">
<mat-icon class="fas fa-clipboard-list"></mat-icon>
<input class="metaSearch" type="text" matInput
[placeholder]="'lang.quickSearch' | translate">
<button mat-icon-button matPrefix>
<mat-icon class="fas fa-search"></mat-icon>
</button>
<mat-autocomplete [class]="hideCriteriaList ? 'hide' : ''" #autoCriteria="matAutocomplete"
(closed)="hideCriteriaList = true;" (optionSelected)="addCriteria($event.option.value)">
<mat-optgroup [label]="'lang.addCriteria' | translate" class="criteria-list">
<input type="text" #searchCriteriaInput [formControl]="getFilterControl()"
style="margin-left:5px;width:150px !important;height: 20px;border: 1px solid #6666663d;padding: 10px;border-radius: 5px;"
placeholder="{{'lang.filterBy' | translate}}">
<mat-option *ngIf="(getFilteredCriterias() | async)?.length===0" disabled>{{'lang.noResult' | translate}}</mat-option>
<mat-option *ngFor="let item of getFilteredCriterias() | async | sortBy : 'label'" [value]="item"
[disabled]="isCurrentCriteriaById(item.identifier)" style="padding-left: 0px;;">
<i class="fa {{item.icon}}" color="primary"
style="font-size:14px;width:50px;text-align:center;"></i> {{item.label}}
</mat-option>
</mat-optgroup>
</mat-autocomplete>
</mat-form-field>
<mat-accordion class="criteria-container">
<mat-expansion-panel expanded #criteriaTool [expanded]="false" togglePosition="before">
<mat-expansion-panel-header>
<mat-panel-title>
{{'lang.criteriaSearch' | translate}}
<span style="background: white;height: 1px;flex: 1;margin-top: 10px;margin-left: 10px;"></span>
<span>
{{'lang.criteriaSearch' | translate}}
<button type="button" mat-icon-button [matMenuTriggerFor]="menu" (menuOpened)="focusFilter()" (click)="$event.stopPropagation()" [title]="'lang.displayCriteria' | translate">
<mat-icon class="fa fa-plus"></mat-icon>
</button>
<mat-menu #menu="matMenu">
<div class="menuTitle" style="position: sticky;top: 0px;background: white;z-index: 1;">
<mat-form-field floatLabel="never" appearance="outline" class="smallInput" (click)="$event.stopPropagation();" style="width: 220px !important; padding-top: 10px;">
<input matInput id="searchTerm" #searchCriteriaInput [formControl]="getFilterControl()" placeholder="{{'lang.filterBy' | translate}}"
#listFilter autocomplete="off" (click)="$event.stopPropagation();"
(keydown)="$event.stopPropagation()">
</mat-form-field>
</div>
<button mat-menu-item *ngIf="(getFilteredCriterias() | async)?.length===0" disabled>{{'lang.noResult' | translate}}</button>
<button mat-menu-item *ngFor="let item of getFilteredCriterias() | async | sortBy : 'label'" (click)="addCriteria(item)" [disabled]="isCurrentCriteriaById(item.identifier)">
<i class="fa {{item.icon}}" color="primary"
style="font-size:14px;width:50px;text-align:center;"></i> {{item.label}}
</button>
</mat-menu>
</span>
<span style="background: white;height: 1px;flex: 1;margin-left: 10px;"></span>
</mat-panel-title>
<mat-panel-description class="myCriterias" (click)="$event.stopPropagation()">
<button type="button" mat-button class="button-form-primary"
......@@ -71,18 +75,6 @@
</mat-panel-description>
</mat-expansion-panel-header>
<ng-container *ngIf="!loading; else loadingTemplate">
<!--<div class="col-md-12">
<mat-form-field appearance="outline" class="addCriteriaField">
<input type="text" #searchCriteriaInput matInput placeholder="Ajouter un critère"
[formControl]="searchCriteria" [matAutocomplete]="autoGroup">
<mat-autocomplete #autoGroup="matAutocomplete" (optionSelected)="addCriteria($event.option.value)">
<mat-option *ngFor="let crit of filteredCriteria | async | sortBy : 'label'"
[value]="crit" [disabled]="isCurrentCriteriaById(crit.id)">
{{crit.label}}
</mat-option>
</mat-autocomplete>
</mat-form-field>
</div>-->
<div
style="display: grid;align-items: start;grid-template-columns: repeat(2, 1fr);max-height: 300px;overflow: hidden;overflow-y: auto;">
<div style="display: grid;align-items: baseline;grid-template-columns: 35% 60% 5%;padding:5px;"
......@@ -203,28 +195,6 @@
<app-address-ban-input [control]="field.control" style="width:100%;">
</app-address-ban-input>
</ng-container>
<!--<ng-container *ngIf="field.identifier === 'registeredMail_issuingSite'">
<span class="criteria-label">
<i class="fa {{field.icon}}"></i> {{field.label}}
<ng-container *ngFor="let num of getBadgesInfoField(field)">
<sup color="primary" class="searchInAttachments">({{num}})</sup>
</ng-container>&nbsp;:&nbsp;
</span>
<app-issuing-site-input #appIssuingSiteInput [control]="field.control" style="width:100%;">
</app-issuing-site-input>
</ng-container>
<ng-container *ngIf="field.identifier === 'registeredMail_recipient'">
<span class="criteria-label">
<i class="fa {{field.icon}}"></i> {{field.label}}
<ng-container *ngFor="let num of getBadgesInfoField(field)">
<sup color="primary" class="searchInAttachments">({{num}})</sup>
</ng-container>&nbsp;:&nbsp;
</span>
<app-contact-autocomplete #appContactAutocomplete [id]="field.identifier"
[control]="field.control"
[exclusion]="'?noUsers=true&noEntities=true&noContactsGroups=true'" style="width:100%;">
</app-contact-autocomplete>
</ng-container>-->
<button mat-icon-button type="button" matSuffix color="warn"
(click)="$event.stopPropagation();removeCriteria(i)">
<mat-icon class="fa fa-trash"></mat-icon>
......
src/frontend/app/adv-search/criteria-tool/criteria-tool.component.scss
+ 1
− 0
View file @ f7ff9f3c
......@@ -59,6 +59,7 @@
.mat-expansion-panel-header-title {
color: white;
align-items: center;
}
::ng-deep .mat-expansion-panel-content {
......
src/frontend/app/adv-search/criteria-tool/criteria-tool.component.ts
+ 4
− 1
View file @ f7ff9f3c
......@@ -59,6 +59,7 @@ export class CriteriaToolComponent implements OnInit {
@Input() searchTerm: string = 'Foo';
@Input() defaultCriteria: any = [];
@Input() adminMode: boolean = false;
@Output() searchUrlGenerated = new EventEmitter<any>();
@Output() loaded = new EventEmitter<any>();
......@@ -150,6 +151,9 @@ export class CriteriaToolComponent implements OnInit {
this.initField(criteria);
this.currentCriteria.push(criteria);
this.searchTermControl.setValue(this.searchTerm);
if (this.adminMode) {
criteria.control.disable();
}
this.searchCriteria.reset();
// this.searchCriteriaInput.nativeElement.blur();
if (openPanel) {
......@@ -193,7 +197,6 @@ export class CriteriaToolComponent implements OnInit {
}
focusFilter() {
this.hideCriteriaList = false;
setTimeout(() => {
this.searchCriteriaInput.nativeElement.focus();
}, 100);
......
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