fix validation error visibility

This commit is contained in:
mchouliara 2024-09-06 13:13:49 +03:00
parent 2d1ba944ee
commit d87c46445c
5 changed files with 10 additions and 8 deletions

View File

@ -2,7 +2,7 @@
<div class="col-12"> <div class="col-12">
<h5 style="font-weight: bold; display: inline-block; margin-right: 2em;">{{'DESCRIPTION-TEMPLATE-EDITOR.STEPS.FORM.FIELD.FIELDS.FIELD-RADIO-BOX-TITLE' <h5 style="font-weight: bold; display: inline-block; margin-right: 2em;">{{'DESCRIPTION-TEMPLATE-EDITOR.STEPS.FORM.FIELD.FIELDS.FIELD-RADIO-BOX-TITLE'
| translate}}</h5> | translate}}</h5>
<ng-container *ngIf="form.get('data').get('options').dirty && form.get('data').get('options').hasError('required')"> <ng-container *ngIf="form.get('data').get('options').touched && form.get('data').get('options').hasError('required')">
<mat-icon class="text-danger translateY-3">warning_amber</mat-icon> <mat-icon class="text-danger translateY-3">warning_amber</mat-icon>
<small class="text-danger">{{'DESCRIPTION-TEMPLATE-EDITOR.STEPS.FORM.FIELD.ERROR-MESSAGES.FIELD-RADIO-AT-LEAST-ONE-REQUIRED'| translate}}</small> <small class="text-danger">{{'DESCRIPTION-TEMPLATE-EDITOR.STEPS.FORM.FIELD.ERROR-MESSAGES.FIELD-RADIO-AT-LEAST-ONE-REQUIRED'| translate}}</small>
</ng-container> </ng-container>

View File

@ -3,7 +3,7 @@
<h5 style="font-weight: bold; display: inline-block; margin-right: 2em;">{{'DESCRIPTION-TEMPLATE-EDITOR.STEPS.FORM.FIELD.FIELDS.FIELD-SELECT-TITLE' | translate}}</h5> <h5 style="font-weight: bold; display: inline-block; margin-right: 2em;">{{'DESCRIPTION-TEMPLATE-EDITOR.STEPS.FORM.FIELD.FIELDS.FIELD-SELECT-TITLE' | translate}}</h5>
<ng-container *ngIf="form.get('data').get('options').dirty && form.get('data').get('options').hasError('required')"> <ng-container *ngIf="form.get('data').get('options').touched && form.get('data').get('options').hasError('required')">
<mat-icon class="text-danger translateY-3">warning_amber</mat-icon> <mat-icon class="text-danger translateY-3">warning_amber</mat-icon>
<small class="text-danger">{{'DESCRIPTION-TEMPLATE-EDITOR.STEPS.FORM.FIELD.ERROR-MESSAGES.FIELD-SELECT-AT-LEAST-ONE-REQUIRED' | translate}}</small> <small class="text-danger">{{'DESCRIPTION-TEMPLATE-EDITOR.STEPS.FORM.FIELD.ERROR-MESSAGES.FIELD-SELECT-AT-LEAST-ONE-REQUIRED' | translate}}</small>
</ng-container> </ng-container>

View File

@ -28,8 +28,8 @@
{{type.label}} {{type.label}}
</mat-option> </mat-option>
</mat-select> </mat-select>
<mat-error *ngIf="form.get('data').get('types').dirty && form.get('data').get('types').hasError('required')">{{'DESCRIPTION-TEMPLATE-EDITOR.STEPS.FORM.FIELD.FIELDS.TYPES-REQUIRED' | translate}}</mat-error>
<mat-error *ngIf="form.get('data').get('types').hasError('backendError')">{{form.get('data').get('types').getError('backendError').message}}</mat-error> <mat-error *ngIf="form.get('data').get('types').hasError('backendError')">{{form.get('data').get('types').getError('backendError').message}}</mat-error>
<mat-error *ngIf="form.get('data').get('types').touched && typesFormControl.hasError('required')">{{'COMMONS.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
<div class="col-12"> <div class="col-12">

View File

@ -1,5 +1,5 @@
import { Component, Input, OnInit } from '@angular/core'; import { Component, Input, OnInit } from '@angular/core';
import { UntypedFormArray, UntypedFormBuilder, UntypedFormControl, UntypedFormGroup } from '@angular/forms'; import { FormControl, UntypedFormArray, UntypedFormBuilder, UntypedFormControl, UntypedFormGroup, Validators } from '@angular/forms';
import { DescriptionTemplateUploadOption } from '@app/core/model/description-template/description-template'; import { DescriptionTemplateUploadOption } from '@app/core/model/description-template/description-template';
import { ConfigurationService } from "@app/core/services/configuration/configuration.service"; import { ConfigurationService } from "@app/core/services/configuration/configuration.service";
import { DescriptionTemplateUploadDataEditorModel, DescriptionTemplateUploadOptionEditorModel } from '../../../description-template-editor.model'; import { DescriptionTemplateUploadDataEditorModel, DescriptionTemplateUploadOptionEditorModel } from '../../../description-template-editor.model';
@ -43,7 +43,7 @@ export class DescriptionTemplateEditorUploadFieldComponent implements OnInit {
]; ];
selected: string[] = []; selected: string[] = [];
public typesFormControl = new UntypedFormControl(); public typesFormControl = new FormControl<string[]>([], Validators.required);
@Input() form: UntypedFormGroup; @Input() form: UntypedFormGroup;
@Input() validationErrorModel: ValidationErrorModel; @Input() validationErrorModel: ValidationErrorModel;

View File

@ -124,9 +124,6 @@ export class DescriptionTemplateEditorFieldComponent extends BaseComponent imple
const field: DescriptionTemplateFieldPersist = this.form.getRawValue(); const field: DescriptionTemplateFieldPersist = this.form.getRawValue();
field.data.fieldType = type; field.data.fieldType = type;
if (!this.canApplyVisibility) {
this.form.get('visibilityRules').reset();
}
// field.defaultValue = { // field.defaultValue = {
// booleanValue: null, // booleanValue: null,
// dateValue: null, // dateValue: null,
@ -237,6 +234,11 @@ export class DescriptionTemplateEditorFieldComponent extends BaseComponent imple
this.form.setControl('data', form.controls.data) this.form.setControl('data', form.controls.data)
if (!this.canApplyVisibility) {
(this.form.get('visibilityRules') as UntypedFormArray).clear();
}
this.reApplyValueChanges(); this.reApplyValueChanges();
this.clearVisibilityRulesValue(); this.clearVisibilityRulesValue();