From 123b8fd7af16e7c2e97f79c50a8577ae0b0fa29a Mon Sep 17 00:00:00 2001
From: Alex ORLUC <alex.orluc@maarch.org>
Date: Fri, 20 Sep 2019 20:50:18 +0200
Subject: [PATCH] FEAT #11771 TIME 1 fix select filter css + fix current date
css input + fix load indexing model
---
.../indexing-form.component.html | 31 +++++--------
.../indexing-form.component.scss | 4 ++
.../indexing-form/indexing-form.component.ts | 35 ++++++++++-----
.../select-search.component.html | 2 +-
.../select-search.component.scss | 3 +-
.../select-search/select-search.component.ts | 45 +++++--------------
6 files changed, 52 insertions(+), 68 deletions(-)
diff --git a/src/frontend/app/indexation/indexing-form/indexing-form.component.html b/src/frontend/app/indexation/indexing-form/indexing-form.component.html
index aba396bc910..d34bfe03ebf 100644
--- a/src/frontend/app/indexation/indexing-form/indexing-form.component.html
+++ b/src/frontend/app/indexation/indexing-form/indexing-form.component.html
@@ -55,29 +55,20 @@
</mat-form-field>
</ng-container>
<ng-container *ngIf="field.type === 'select'">
- <plugin-select-search [placeholderLabel]="field.system ? lang[field.type + 'Input'] : lang.defaultValue" [formControlSelect]="arrFormControl[field.identifier]" [datas]="field.values" style="width:100%;"></plugin-select-search>
- <!--<mat-form-field class="input-form" floatLabel="never">
- <mat-select [formControl]="arrFormControl[field.identifier]"
- [placeholder]="field.system ? lang[field.type + 'Input'] : lang.defaultValue">
- <plugin-select-search></plugin-select-search>
- <mat-option *ngIf="adminMode"></mat-option>
- <mat-option *ngFor="let value of field.values" [value]="value.id"
- [title]="value.title !== undefined ? value.title : value.label"
- [disabled]="value.disabled" [class.opt-group]="value.isTitle"
- [style.color]="value.color" [innerHTML]="value.label">
- </mat-option>
- </mat-select>
- </mat-form-field>-->
+ <plugin-select-search [showResetOption]="adminMode"
+ [placeholderLabel]="field.system ? lang[field.type + 'Input'] : lang.defaultValue"
+ [formControlSelect]="arrFormControl[field.identifier]" [datas]="field.values"
+ style="width:100%;"></plugin-select-search>
</ng-container>
<ng-container *ngIf="field.type === 'date'">
+ <button mat-button color="primary" *ngIf="adminMode" matPrefix mat-icon-button
+ (click)="$event.stopPropagation();toggleTodayDate(field);"
+ matTooltip="Jour d'aujourd'hui" style="position: absolute;left: -40px;">
+ <mat-icon color="primary"
+ class="{{field.today ? 'far fa-bell-slash' : 'far fa-bell'}}">
+ </mat-icon>
+ </button>
<mat-form-field class="input-form" floatLabel="never" (click)="picker.open()">
- <button mat-button color="primary" *ngIf="adminMode" matPrefix mat-icon-button
- (click)="$event.stopPropagation();toggleTodayDate(field);"
- matTooltip="Jour d'aujourd'hui">
- <mat-icon color="primary"
- class="{{field.today ? 'fas fa-circle' : 'far fa-circle'}}">
- </mat-icon>
- </button>
<input [formControl]="arrFormControl[field.identifier]" matInput
[matDatepicker]="picker"
[placeholder]="field.system ? lang[field.type + 'Input'] : lang.defaultValue"
diff --git a/src/frontend/app/indexation/indexing-form/indexing-form.component.scss b/src/frontend/app/indexation/indexing-form/indexing-form.component.scss
index 8ad9ec0ed0b..2a5d8652106 100644
--- a/src/frontend/app/indexation/indexing-form/indexing-form.component.scss
+++ b/src/frontend/app/indexation/indexing-form/indexing-form.component.scss
@@ -67,6 +67,10 @@
}
}
+.fieldInput {
+ position: relative;
+}
+
.fieldLabel,
.fieldInput {
font-size: 13px;
diff --git a/src/frontend/app/indexation/indexing-form/indexing-form.component.ts b/src/frontend/app/indexation/indexing-form/indexing-form.component.ts
index 9359fb5e185..62854f2965a 100644
--- a/src/frontend/app/indexation/indexing-form/indexing-form.component.ts
+++ b/src/frontend/app/indexation/indexing-form/indexing-form.component.ts
@@ -149,8 +149,10 @@ export class IndexingFormComponent implements OnInit {
values: []
}
];
+ availableFieldsClone: any[] = [];
- availableCustomFields: any[] = []
+ availableCustomFields: any[] = [];
+ availableCustomFieldsClone: any[] = []
indexingFormGroup: FormGroup;
@@ -169,6 +171,8 @@ export class IndexingFormComponent implements OnInit {
ngOnInit(): void {
this.adminMode === undefined ? this.adminMode = false : this.adminMode = true;
+ this.availableFieldsClone = JSON.parse(JSON.stringify(this.availableFields));
+
this.fieldCategories.forEach(category => {
this['indexingModels_' + category] = [];
});
@@ -188,7 +192,7 @@ export class IndexingFormComponent implements OnInit {
});
});
}),
- finalize(() => this.loading = false),
+ //finalize(() => this.loading = false),
catchError((err: any) => {
this.notify.handleErrors(err);
return of(false);
@@ -284,6 +288,13 @@ export class IndexingFormComponent implements OnInit {
}
initElemForm() {
+ this.loading = true;
+
+ // FAKE LOADER : MERGE ROUTES FOR REAL LOADER
+ setTimeout(() => {
+ this.loading = false;
+ }, 800);
+
this.fieldCategories.forEach(element => {
this['indexingModels_' + element].forEach((elem: any) => {
@@ -310,7 +321,7 @@ export class IndexingFormComponent implements OnInit {
}
});
}),
- finalize(() => this.loading = false),
+ //finalize(() => this.loading = false),
catchError((err: any) => {
this.notify.handleErrors(err);
return of(false);
@@ -339,7 +350,7 @@ export class IndexingFormComponent implements OnInit {
}
});
}),
- finalize(() => this.loading = false),
+ //finalize(() => this.loading = false),
catchError((err: any) => {
this.notify.handleErrors(err);
return of(false);
@@ -356,7 +367,7 @@ export class IndexingFormComponent implements OnInit {
tap((data: any) => {
elem.values = data.categories;
}),
- finalize(() => this.loading = false),
+ //finalize(() => this.loading = false),
catchError((err: any) => {
this.notify.handleErrors(err);
return of(false);
@@ -368,7 +379,7 @@ export class IndexingFormComponent implements OnInit {
tap((data: any) => {
elem.values = data.priorities;
}),
- finalize(() => this.loading = false),
+ //finalize(() => this.loading = false),
catchError((err: any) => {
this.notify.handleErrors(err);
return of(false);
@@ -380,7 +391,7 @@ export class IndexingFormComponent implements OnInit {
tap((data: any) => {
elem.values = data.categories;
}),
- finalize(() => this.loading = false),
+ //finalize(() => this.loading = false),
catchError((err: any) => {
this.notify.handleErrors(err);
return of(false);
@@ -403,7 +414,7 @@ export class IndexingFormComponent implements OnInit {
} else if (doctype['description'] === undefined) {
arrValues.push({
id: doctype.doctypes_second_level_id,
- label: doctype.doctypes_second_level_label,
+ label: ' ' + doctype.doctypes_second_level_label,
disabled: true,
isTitle: true,
color: doctype.css_style
@@ -412,7 +423,7 @@ export class IndexingFormComponent implements OnInit {
arrValues = arrValues.concat(data.structure.filter((info: any) => info.doctypes_second_level_id === doctype.doctypes_second_level_id && info.description !== undefined).map((info: any) => {
return {
id: info.type_id,
- label: info.description,
+ label: ' ' + info.description,
disabled: false,
isTitle: false,
}
@@ -421,7 +432,7 @@ export class IndexingFormComponent implements OnInit {
});
elem.values = arrValues;
}),
- finalize(() => this.loading = false),
+ //finalize(() => this.loading = false),
catchError((err: any) => {
this.notify.handleErrors(err);
return of(false);
@@ -439,6 +450,8 @@ export class IndexingFormComponent implements OnInit {
loadForm(indexModelId: number) {
this.loading = true;
+ this.availableFields = JSON.parse(JSON.stringify(this.availableFieldsClone));
+
this.fieldCategories.forEach(category => {
this['indexingModels_' + category] = [];
});
@@ -508,7 +521,7 @@ export class IndexingFormComponent implements OnInit {
this.initElemForm();
this.createForm();
}),
- finalize(() => this.loading = false),
+ //finalize(() => this.loading = false),
catchError((err: any) => {
this.notify.handleErrors(err);
return of(false);
diff --git a/src/frontend/plugins/select-search/select-search.component.html b/src/frontend/plugins/select-search/select-search.component.html
index d3336b32410..272558b309c 100644
--- a/src/frontend/plugins/select-search/select-search.component.html
+++ b/src/frontend/plugins/select-search/select-search.component.html
@@ -15,7 +15,7 @@
<div *ngIf="noEntriesFoundLabel && value && _options?.length === 0 && datas.length > 5" class="mat-select-search-no-entries-found">
{{lang.noResult}}
</div>
- <mat-option *ngIf="adminMode"></mat-option>
+ <mat-option *ngIf="showResetOption"></mat-option>
<mat-option *ngFor="let value of filteredDatas | async" [value]="value.id"
[title]="value.title !== undefined ? value.title : value.label" [disabled]="value.disabled"
[class.opt-group]="value.isTitle" [style.color]="value.color" [innerHTML]="value.label">
diff --git a/src/frontend/plugins/select-search/select-search.component.scss b/src/frontend/plugins/select-search/select-search.component.scss
index 7fdc6f47a75..70bf2a2d8c7 100644
--- a/src/frontend/plugins/select-search/select-search.component.scss
+++ b/src/frontend/plugins/select-search/select-search.component.scss
@@ -25,7 +25,8 @@ $multiple-check-width: 33px;
::ng-deep.mat-select-search-panel {
/* allow absolute positioning relative to outer options container */
transform: none !important;
- max-height: 350px;
+ max-height: 350px !important;
+ max-width: inherit !important;
}
.mat-select-search-input {
diff --git a/src/frontend/plugins/select-search/select-search.component.ts b/src/frontend/plugins/select-search/select-search.component.ts
index 81c3ba7aff2..376e0c801d6 100644
--- a/src/frontend/plugins/select-search/select-search.component.ts
+++ b/src/frontend/plugins/select-search/select-search.component.ts
@@ -4,7 +4,7 @@ import {
ViewChild,
Renderer2
} from '@angular/core';
-import { ControlValueAccessor, NG_VALUE_ACCESSOR, FormControl } from '@angular/forms';
+import { ControlValueAccessor, FormControl } from '@angular/forms';
import { MatOption, MatSelect } from '@angular/material';
import { take, takeUntil, startWith, map } from 'rxjs/operators';
import { Subject, ReplaySubject, Observable } from 'rxjs';
@@ -21,13 +21,11 @@ export class PluginSelectSearchComponent implements OnInit, OnDestroy, AfterView
/** Label of the search placeholder */
@Input() placeholderLabel = this.lang.chooseValue;
- /** Label to be shown when no entries are found. Set to null if no message should be shown. */
- @Input() noEntriesFoundLabel = 'Aucun résultat';
-
@Input('formControlSelect') formControlSelect: FormControl;
@Input('datas') datas: any;
+ @Input('showResetOption') showResetOption: boolean;
/** Reference to the search input field */
@ViewChild('searchSelectInput', { read: ElementRef, static: true }) searchSelectInput: ElementRef;
@@ -118,42 +116,19 @@ export class PluginSelectSearchComponent implements OnInit, OnDestroy, AfterView
});
});
- // detect changes when the input changes
- /*this.change
- .pipe(takeUntil(this._onDestroy))
- .subscribe(() => {
- this.changeDetectorRef.detectChanges();
- });*/
-
- setTimeout(() => {
- this.filteredDatas = this.formControlSearch.valueChanges
- .pipe(
- startWith(''),
- map(value => this._filter(value))
- );
- }, 800);
+ /*setTimeout(() => {
+
+ }, 800);*/
+ this.filteredDatas = this.formControlSearch.valueChanges
+ .pipe(
+ startWith(''),
+ map(value => this._filter(value))
+ );
// this.initMultipleHandling();
- // load the initial bank list
-
- //this.filteredDatas.next(this.datas.slice());
-
- //this.filteredDatasMulti.next(this.datas.slice());
-
- // listen for search field value changes
- /*this.formControlSelect.valueChanges
- .pipe(takeUntil(this._onDestroy))
- .subscribe(() => {
- this.filterDatas();
- });*/
- /*this.formControlSelect.valueChanges
- .pipe(takeUntil(this._onDestroy))
- .subscribe(() => {
- this.filterDatasMulti();
- });*/
}
ngOnDestroy() {
--
GitLab