Add validate button on Dataset Wizard. Show in red invalid fieldsets in table of contents

This commit is contained in:
Kristian Ntavidi 2021-06-11 12:16:50 +03:00
parent be311f238b
commit a3c9df87df
13 changed files with 48 additions and 63 deletions

View File

@ -1,47 +1,20 @@

import { Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges } from '@angular/core';
import { AbstractControl, AbstractControlOptions, FormArray, FormControl, FormGroup, FormGroupDirective, NgForm, ValidationErrors, ValidatorFn } from '@angular/forms';
import { Component, EventEmitter, Input, OnInit, Output} from '@angular/core';
import {FormArray, FormControl, FormGroup, FormGroupDirective, NgForm,} from '@angular/forms';
import { DatasetProfileFieldViewStyle } from '@app/core/common/enum/dataset-profile-field-view-style';
import { ValidationType } from '@app/core/common/enum/validation-type';
import { DatasetProfileService } from '@app/core/services/dataset-profile/dataset-profile.service';
import { EnumUtils } from '@app/core/services/utilities/enum-utils.service';
import { BooleanDecisionFieldDataEditorModel } from '@app/ui/admin/dataset-profile/admin/field-data/boolean-decision-field-data-editor-model';
import { CheckBoxFieldDataEditorModel } from '@app/ui/admin/dataset-profile/admin/field-data/check-box-field-data-editor-model';
import { DatePickerDataEditorModel } from '@app/ui/admin/dataset-profile/admin/field-data/date-picker-data-editor-models';
import { FreeTextFieldDataEditorModel } from '@app/ui/admin/dataset-profile/admin/field-data/free-text-field-data-editor-model';
import { RadioBoxFieldDataEditorModel } from '@app/ui/admin/dataset-profile/admin/field-data/radio-box-field-data-editor-model';
import { ResearchersAutoCompleteFieldDataEditorModel } from '@app/ui/admin/dataset-profile/admin/field-data/researchers-auto-complete-field-data-editor-model';
import { TextAreaFieldDataEditorModel } from '@app/ui/admin/dataset-profile/admin/field-data/text-area-field-data-editor-model';
import { WordListFieldDataEditorModel } from '@app/ui/admin/dataset-profile/admin/field-data/word-list-field-data-editor-model';
import { RuleEditorModel } from '@app/ui/admin/dataset-profile/admin/rule-editor-model';
import { BaseComponent } from '@common/base/base.component';
import { debounce, debounceTime, takeUntil } from 'rxjs/operators';
import { ExternalDatasetEditorModel } from '@app/ui/dataset/dataset-wizard/dataset-wizard-editor.model';
import { DataRepositoriesDataEditorModel } from '../../../admin/field-data/data-repositories-data-editor-models';
import { RegistriesDataEditorModel } from '../../../admin/field-data/registries-data-editor-models';
import { ServicesDataEditorModel } from '../../../admin/field-data/services-data-editor-models';
import { TagsDataEditorModel } from '../../../admin/field-data/tags-data-editor-models';
import { ResearchersDataEditorModel } from '../../../admin/field-data/researchers-data-editor-models';
import { OrganizationsDataEditorModel } from '../../../admin/field-data/organizations-data-editor-models';
import { DatasetIdentifierDataEditorModel } from '../../../admin/field-data/dataset-identifier-data-editor-models';
import { ExternalDatasetsDataEditorModel } from '../../../admin/field-data/external-datasets-data-editor-models';
import { CurrencyDataEditorModel } from '../../../admin/field-data/currency-data-editor-models';
import { ValidationDataEditorModel } from '../../../admin/field-data/validation-data-editor-models';
import { DatasetDescriptionFieldEditorModel } from '@app/ui/misc/dataset-description-form/dataset-description-form.model';
import { Subject, Subscription } from 'rxjs';
import { Subscription } from 'rxjs';
import { ViewStyleType } from './view-style-enum';
import { AutoCompleteFieldDataEditorModel } from '../../../admin/field-data/auto-complete-field-data-editor-model';
import { DatasetsAutoCompleteFieldDataEditorModel } from '../../../admin/field-data/datasets-autocomplete-field-data-editor-mode';
import { DatasetProfileComboBoxType } from '@app/core/common/enum/dataset-profile-combo-box-type';
import { Guid } from '@common/types/guid';
import { ErrorStateMatcher, MatDialog, MatSlideToggleChange } from '@angular/material';
import { DefaultValueEditorModel } from '../../../admin/default-value-editor-model';
import { EditorCustomValidators } from '../../custom-validators/editor-custom-validators';
import { Field } from '@app/core/model/admin/dataset-profile/dataset-profile';
import { DatasetProfileInternalDmpEntitiesType } from '@app/core/common/enum/dataset-profile-internal-dmp-entities-type';
import { FieldEditorModel } from '../../../admin/field-editor-model';
import { AutoCompleteFieldData, BooleanDecisionFieldData, CheckBoxFieldData, CurrencyFieldData, DataRepositoriesFieldData, DatasetIdentifierFieldData, DatePickerFieldData, DmpsAutoCompleteFieldData, ExternalDatasetsFieldData, FieldDataOption, FreeTextFieldData, OrganizationsFieldData, RadioBoxFieldData, RegistriesFieldData, ResearchersAutoCompleteFieldData, ServicesFieldData, TagsFieldData, TextAreaFieldData, ValidationFieldData, WordListFieldData } from '@app/core/model/dataset-profile-definition/field-data/field-data';
import { ConfirmationDialogComponent } from '@common/modules/confirmation-dialog/confirmation-dialog.component';
@Component({
selector: 'app-dataset-profile-editor-field-component',

View File

@ -33,6 +33,7 @@
</button>
</div>
<div class="col-auto d-flex align-items-center">
<button *ngIf="!lockStatus" mat-raised-button class="dataset-save-btn mr-2" (click)="touchForm()" type="button">{{ 'DATASET-WIZARD.ACTIONS.VALIDATE' | translate }}</button>
<button *ngIf="!lockStatus" mat-raised-button class="dataset-save-btn mr-2" (click)="save()" type="button">{{ 'DATASET-WIZARD.ACTIONS.SAVE' | translate }}</button>
<button *ngIf="!lockStatus" mat-raised-button class="dataset-save-btn mr-2" (click)="save(saveAnd.close)" type="button">{{ 'DATASET-WIZARD.ACTIONS.SAVE-AND-CLOSE' | translate }}</button>
<button *ngIf="!lockStatus" mat-raised-button class="dataset-save-btn mr-2" (click)="save(saveAnd.addNew)">{{ 'DATASET-WIZARD.ACTIONS.SAVE-AND-ADD' | translate }}</button>

View File

@ -409,6 +409,7 @@ export class DatasetWizardComponent extends BaseComponent implements OnInit, IBr
.pipe(takeUntil(this._destroyed))
.subscribe(x => {
if (x) {
this.showtocentriesErrors = false;
this.datasetProfileValueChanged(x.id);
this.formChanged();
}
@ -1177,6 +1178,10 @@ export class DatasetWizardComponent extends BaseComponent implements OnInit, IBr
printFormValue(){
console.log(this.formGroup.value);
}
touchForm(){
this.formGroup.markAllAsTouched();
this.showtocentriesErrors = true;
}
// tocentries;
// this.tocentries = this.getTocEntries(this.formGroup.get('datasetProfileDefinition')); //TODO

View File

@ -26,9 +26,9 @@
<app-single-auto-complete placeholder="{{ form.get('data').value.label | translate }}" [formControl]="form.get('value')"
[configuration]="singleAutoCompleteConfiguration" [required]="form.get('validationRequired').value">
</app-single-auto-complete>
<mat-error *ngIf="form.get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error>
</div>
<mat-error *ngIf="form.get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error>
<mat-hint>{{ "TYPES.DATASET-PROFILE-COMBO-BOX-TYPE.EXTERNAL-SOURCE-HINT" | translate }}</mat-hint>
</mat-form-field>
<mat-form-field *ngIf="form.get('data').value.type === datasetProfileComboBoxTypeEnum.WordList" class="col-md-12">
@ -54,9 +54,9 @@
<app-single-auto-complete placeholder="{{ form.get('data').value.label | translate }}" [formControl]="form.get('value')"
[configuration]="singleAutoCompleteConfiguration" [required]="form.get('validationRequired').value">
</app-single-auto-complete>
<mat-error *ngIf="form.get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error>
</div>
<mat-error *ngIf="form.get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error>
<mat-hint>{{ "TYPES.DATASET-PROFILE-COMBO-BOX-TYPE.EXTERNAL-SOURCE-HINT" | translate }}</mat-hint>
</mat-form-field>
<mat-form-field class="col-md-12" *ngIf="form.get('data').value.type === this.datasetProfileInternalDmpEntitiesTypeEnum.Datasets">
@ -69,9 +69,9 @@
<app-single-auto-complete placeholder="{{ form.get('data').value.label | translate }}" [formControl]="form.get('value')"
[configuration]="singleAutoCompleteConfiguration" [required]="form.get('validationRequired').value">
</app-single-auto-complete>
<mat-error *ngIf="form.get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error>
</div>
<mat-error *ngIf="form.get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error>
<mat-hint>{{ "TYPES.DATASET-PROFILE-COMBO-BOX-TYPE.EXTERNAL-SOURCE-HINT" | translate }}</mat-hint>
</mat-form-field>
<mat-form-field class="col-md-12" *ngIf="form.get('data').value.type === this.datasetProfileInternalDmpEntitiesTypeEnum.Dmps">
@ -84,9 +84,9 @@
<app-single-auto-complete placeholder="{{ form.get('data').value.label | translate }}" [formControl]="form.get('value')"
[configuration]="singleAutoCompleteConfiguration" [required]="form.get('validationRequired').value">
</app-single-auto-complete>
<mat-error *ngIf="form.get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error>
</div>
<mat-error *ngIf="form.get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error>
<mat-hint>{{ "TYPES.DATASET-PROFILE-COMBO-BOX-TYPE.EXTERNAL-SOURCE-HINT" | translate }}</mat-hint>
</mat-form-field>
</div>
@ -113,16 +113,16 @@
<mat-radio-button class="radio-button-item" name="{{form.get('id').value}}" value="true">{{ "TYPES.DATASET-PROFILE-COMBO-BOX-TYPE.ACTIONS.YES" | translate }}</mat-radio-button>
<mat-radio-button class="radio-button-item" name="{{form.get('id').value}}" value="false">{{ "TYPES.DATASET-PROFILE-COMBO-BOX-TYPE.ACTIONS.NO" | translate }}</mat-radio-button>
</mat-radio-group>
<mat-error *ngIf="form.get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error>
<small class="text-danger d-block" *ngIf="form.get('value').hasError('required') && form.get('value').touched">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</small>
</div>
<div *ngSwitchCase="datasetProfileFieldViewStyleEnum.RadioBox" class="col-12">
<mat-radio-group [formControl]="form.get('value')" [required]="form.get('validationRequired').value">
<mat-radio-button *ngFor="let option of form.get('data').value.options let index = index" class="radio-button-item" [value]="option.value">{{option.label}}</mat-radio-button>
</mat-radio-group>
<mat-error *ngIf="form.get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error>
<small class="text-danger d-block" *ngIf="form.get('value').hasError('required') && form.get('value').touched">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</small>
</div>
<mat-form-field *ngSwitchCase="datasetProfileFieldViewStyleEnum.DatePicker" class="col-12">
@ -167,9 +167,9 @@
<app-single-auto-complete placeholder="{{ form.get('data').value.label | translate }}" [formControl]="form.get('value')"
[configuration]="dataRepositoriesAutoCompleteConfiguration" [required]="form.get('validationRequired').value">
</app-single-auto-complete>
<mat-error *ngIf="form.get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error>
</div>
<mat-error *ngIf="form.get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error>
<mat-hint>{{ "TYPES.DATASET-PROFILE-COMBO-BOX-TYPE.EXTERNAL-SOURCE-HINT" | translate }}</mat-hint>
</mat-form-field>
</div>
@ -187,9 +187,9 @@
<app-single-auto-complete placeholder="{{ form.get('data').value.label | translate }}" [formControl]="form.get('value')"
[configuration]="registriesAutoCompleteConfiguration" [required]="form.get('validationRequired').value">
</app-single-auto-complete>
<mat-error *ngIf="form.get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error>
</div>
<mat-error *ngIf="form.get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error>
<mat-hint>{{ "TYPES.DATASET-PROFILE-COMBO-BOX-TYPE.EXTERNAL-SOURCE-HINT" | translate }}</mat-hint>
</mat-form-field>
</div>
@ -207,9 +207,9 @@
<app-single-auto-complete placeholder="{{ form.get('data').value.label | translate }}" [formControl]="form.get('value')"
[configuration]="servicesAutoCompleteConfiguration" [required]="form.get('validationRequired').value">
</app-single-auto-complete>
<mat-error *ngIf="form.get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error>
</div>
<mat-error *ngIf="form.get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error>
<mat-hint>{{ "TYPES.DATASET-PROFILE-COMBO-BOX-TYPE.EXTERNAL-SOURCE-HINT" | translate }}</mat-hint>
</mat-form-field>
</div>
@ -239,11 +239,9 @@
<app-single-auto-complete placeholder="{{ form.get('data').value.label | translate }}" [formControl]="form.get('value')"
[configuration]="researchersAutoCompleteConfiguration" [required]="form.get('validationRequired').value">
</app-single-auto-complete>
<mat-error *ngIf="form.get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error>
</ng-container>
<mat-error *ngIf="form.get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error>
<mat-hint>{{ "TYPES.DATASET-PROFILE-COMBO-BOX-TYPE.EXTERNAL-SOURCE-HINT" | translate }}</mat-hint>
</mat-form-field>
</div>

View File

@ -10,13 +10,13 @@
[ngStyle]="calculateStyle(entry)"
[ngClass]="calculateClass(entry)"
>
<span [class.text-danger]="showErrors && entry.form.invalid && entry.type === tocEntryTypeEnum.FieldSet">
<span [class.text-danger]="showErrors && entry.form.invalid && ( (entry.type === tocEntryTypeEnum.FieldSet) || entry.type !== tocEntryTypeEnum.FieldSet && !expandChildren[idx]) ">
{{entry.numbering}}. {{entry.label}}
</span>
<mat-icon style="transform: translateY(3px);" class="text-danger"
<!-- <mat-icon style="transform: translateY(3px);" class="text-danger"
*ngIf="showErrors && entry.form.invalid && entry.type !== tocEntryTypeEnum.FieldSet && !expandChildren[idx]">
priority_high
</mat-icon>
</mat-icon> -->
<!-- <ng-container *ngIf="entry.subEntries && entry.subEntries.length && !expandChildren[idx]">
<small>
({{entry.subEntries.length}})

View File

@ -690,7 +690,8 @@
"DOWNLOAD-XML": "XML herunterladen",
"DOWNLOAD-DOCX": "DOCX herunterladen",
"COPY-DATASET": "Datensatzbeschreibung kopieren",
"UPDATE-DATASET-PROFILE": "Vorlage aktualisieren"
"UPDATE-DATASET-PROFILE": "Vorlage aktualisieren",
"VALIDATE":"Validate"
},
"MESSAGES": {
"DATASET-NOT-FOUND": "Datensatzbeschreibung ist nicht vorhanden",

View File

@ -690,7 +690,8 @@
"DOWNLOAD-XML": "Download XML",
"DOWNLOAD-DOCX": "Download DOCX",
"COPY-DATASET": "Copy Dataset",
"UPDATE-DATASET-PROFILE": "Update Template"
"UPDATE-DATASET-PROFILE": "Update Template",
"VALIDATE":"Validate"
},
"MESSAGES": {
"DATASET-NOT-FOUND": "Dataset does not exist",

View File

@ -690,7 +690,8 @@
"DOWNLOAD-XML": "Descargar XML",
"DOWNLOAD-DOCX": "Descargar DOCX",
"COPY-DATASET": "Copiar la descripción del dataset",
"UPDATE-DATASET-PROFILE": "Plantilla de modificación"
"UPDATE-DATASET-PROFILE": "Plantilla de modificación",
"VALIDATE":"Validate"
},
"MESSAGES": {
"DATASET-NOT-FOUND": "No existe la descripción del dataset",

View File

@ -690,7 +690,8 @@
"DOWNLOAD-XML": "Λήψη XML",
"DOWNLOAD-DOCX": "Ληψη DOCX",
"COPY-DATASET": "Αντιφραφή Περιγραφής Συνόλου Δεδομένων",
"UPDATE-DATASET-PROFILE": "Ενημέρωση Template"
"UPDATE-DATASET-PROFILE": "Ενημέρωση Template",
"VALIDATE":"Επικύρωση"
},
"MESSAGES": {
"DATASET-NOT-FOUND": "Η Περιγραφή Συνόλου Δεδομένων δεν υπάρχει",

View File

@ -690,7 +690,8 @@
"DOWNLOAD-XML": "Exportar para XML",
"DOWNLOAD-DOCX": "Exportar para DOCX",
"COPY-DATASET": "Copiar o Dataset",
"UPDATE-DATASET-PROFILE": "Atualizar o Modelo"
"UPDATE-DATASET-PROFILE": "Atualizar o Modelo",
"VALIDATE":"Validate"
},
"MESSAGES": {
"DATASET-NOT-FOUND": "O Dataset não existe",

View File

@ -690,7 +690,8 @@
"DOWNLOAD-XML": "Stiahnuť XML",
"DOWNLOAD-DOCX": "Stiahnuť DOCX",
"COPY-DATASET": "Kopírovať súbor dát",
"UPDATE-DATASET-PROFILE": "Aktualizovať šablónu"
"UPDATE-DATASET-PROFILE": "Aktualizovať šablónu",
"VALIDATE":"Validate"
},
"MESSAGES": {
"DATASET-NOT-FOUND": "Súbor dát neexistuje",

View File

@ -690,7 +690,8 @@
"DOWNLOAD-XML": "Preuzmite XML",
"DOWNLOAD-DOCX": "Preuzmite DOCX",
"COPY-DATASET": "Kopirajte skup podataka",
"UPDATE-DATASET-PROFILE": "Ažurirajte obrazac"
"UPDATE-DATASET-PROFILE": "Ažurirajte obrazac",
"VALIDATE":"Validate"
},
"MESSAGES": {
"DATASET-NOT-FOUND": "Skup podataka ne postoji",

View File

@ -690,7 +690,8 @@
"DOWNLOAD-XML": "XML İndir",
"DOWNLOAD-DOCX": "DOCX İndir",
"COPY-DATASET": "Veri Seti Tanımını Kopyala",
"UPDATE-DATASET-PROFILE": "Şablonu Güncelle"
"UPDATE-DATASET-PROFILE": "Şablonu Güncelle",
"VALIDATE":"Validate"
},
"MESSAGES": {
"DATASET-NOT-FOUND": "Veri Seti Tanımı mevcut değildir",