added json-validated textfield for complexType
This commit is contained in:
parent
05a1d916bf
commit
8518810d34
|
@ -19,7 +19,7 @@
|
|||
<div formArrayName="{{facetTemplate.key}}" *ngFor="let facetTemplate of fieldsMap|keyvalue;" >
|
||||
<div [formGroupName] ="ind" *ngFor="let fct of (getSingleFacetArray(facetTemplate.key)).controls; let ind=index;" style="border: 3px solid rgb(72, 157, 202); padding: 10px; margin: 5px;">
|
||||
<mat-form-field appearance="outline" >
|
||||
<input matInput formControlName="facetName" [style.width.px]="350" type="text" [readonly]="true" style="font-size: large; font-weight: 700;" />
|
||||
<input matInput formControlName="facetName" style="width: 350px" type="text" [readonly]="true" style="font-size: large; font-weight: 700;" />
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<mat-label for="min" >occurr. min</mat-label>
|
||||
|
@ -105,6 +105,11 @@
|
|||
<input matInput formControlName="val" type="number"/>
|
||||
<mat-error>{{checkForErrorsIn(facetTemplate.key,ind,i,'number')}}</mat-error>
|
||||
</mat-form-field>
|
||||
<mat-form-field *ngIf="x.get('tipo')?.value === 'complexType'">
|
||||
<mat-label for="val">value</mat-label>
|
||||
<textarea matInput style="width: 400px" formControlName="val"></textarea>
|
||||
<mat-error>{{checkForErrorsIn(facetTemplate.key,ind,i,'complexType')}}</mat-error>
|
||||
</mat-form-field >
|
||||
<mat-form-field *ngIf="x.get('tipo')?.value === 'boolean'">
|
||||
<mat-label for="val">value</mat-label>
|
||||
<input matInput formControlName="val" type="boolean"/>
|
||||
|
|
|
@ -1,3 +1,4 @@
|
|||
/* eslint-disable @typescript-eslint/no-unnecessary-condition */
|
||||
/* eslint-disable @typescript-eslint/no-unused-vars */
|
||||
/* eslint-disable no-labels */
|
||||
/* eslint-disable no-useless-escape */
|
||||
|
@ -20,7 +21,6 @@ import { MatExpansionModule } from '@angular/material/expansion';
|
|||
import { IFacetComposer, IFacetProps } from './i-facet-composer';
|
||||
import { SharedModule } from 'app/shared/shared.module';
|
||||
import { MatSelectFilterModule } from 'mat-select-filter';
|
||||
import { isEmpty } from 'rxjs';
|
||||
|
||||
@Component({
|
||||
standalone: true,
|
||||
|
@ -79,6 +79,7 @@ export class FacetComposerComponent implements OnInit {
|
|||
|
||||
optionTypes = [
|
||||
{ value: 'boolean'},
|
||||
{ value: 'complexType'},
|
||||
{ value: 'date'},//text
|
||||
{ value: 'datetime'},//text
|
||||
{ value: 'password'},
|
||||
|
@ -174,6 +175,11 @@ defaultValue={new Date().toISOString().substring(0, (new Date().toISOString().in
|
|||
// eslint-disable-next-line no-useless-escape
|
||||
valFc.setValidators([Validators.required,Validators.pattern('^\s*(true|false)\s*$')]);
|
||||
}
|
||||
if(newValue==='complexType'){
|
||||
valFc.setValue('{}');
|
||||
// eslint-disable-next-line no-useless-escape
|
||||
valFc.setValidators([Validators.required, this.validateJsonString()]);
|
||||
}
|
||||
if(newValue==='datetime'){
|
||||
valFc.setValue('');
|
||||
valFc.setValue(new Date().toISOString());
|
||||
|
@ -206,10 +212,19 @@ defaultValue={new Date().toISOString().substring(0, (new Date().toISOString().in
|
|||
const value = control.value;
|
||||
const isFormallyCorrect = /^(19|20)\d{2}-(0[1-9]|1[0,1,2])-(0[1-9]|[12][0-9]|3[01])T(0[0-9]|1[0-9]|2[0-4]):(0[0-9]|[1-5][0-9]):(0[0-9]|[1-5][0-9])\.[0-9]{3}Z$/.test(value);
|
||||
const datetimeValid = isFormallyCorrect && this.isIsoDate(control.value);
|
||||
alert('datetimeValid?...'+datetimeValid);
|
||||
//alert('datetimeValid?...'+datetimeValid);
|
||||
return !datetimeValid ? {datetimeIso:true}: null;
|
||||
}
|
||||
}
|
||||
private validateJsonString():ValidatorFn {
|
||||
// alert('prova!');
|
||||
return (control: AbstractControl): ValidationErrors |null => {
|
||||
const jsonValid = this.isJsonString(control.value);
|
||||
//alert('datetimeValid?...'+datetimeValid);
|
||||
return !jsonValid ? {validJson:true}: null;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
checkForErrors(valFc:AbstractControl, inputType:string): string{
|
||||
let errorMsg: string;
|
||||
|
@ -222,24 +237,41 @@ defaultValue={new Date().toISOString().substring(0, (new Date().toISOString().in
|
|||
if(!this.isIsoDate(valFc.value)){
|
||||
errorMsg = 'Date is not in correct ISO format';
|
||||
}
|
||||
}else{
|
||||
if(valFc.hasError('pattern')){
|
||||
errorMsg = ''+ valFc.value+'is not a correct value';
|
||||
if(!this.checkIfEmpty(valFc.value)&& inputType==='float'){
|
||||
errorMsg = 'input is not a decimal number (use . as a separator)';
|
||||
}
|
||||
if(!this.checkIfEmpty(valFc.value)&& inputType==='boolean'){
|
||||
errorMsg = 'please enter true or false';
|
||||
}
|
||||
if(!this.checkIfEmpty(valFc.value)&& inputType==='date'){
|
||||
errorMsg = 'date or date format is not correct';
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}else if(!this.checkIfEmpty(valFc.value)&& inputType==='complexType'){
|
||||
if(!this.isJsonString(valFc.value)){
|
||||
errorMsg = 'Please insert a valid JSON string';
|
||||
}
|
||||
}else
|
||||
{
|
||||
if(valFc.hasError('pattern')){
|
||||
errorMsg = ''+ valFc.value+'is not a correct value';
|
||||
if(!this.checkIfEmpty(valFc.value)&& inputType==='float'){
|
||||
errorMsg = 'input is not a decimal number (use . as a separator)';
|
||||
}
|
||||
if(!this.checkIfEmpty(valFc.value)&& inputType==='boolean'){
|
||||
errorMsg = 'please enter true or false';
|
||||
}
|
||||
if(!this.checkIfEmpty(valFc.value)&& inputType==='date'){
|
||||
errorMsg = 'date or date format is not correct';
|
||||
}
|
||||
}
|
||||
}
|
||||
return errorMsg;
|
||||
}
|
||||
|
||||
|
||||
isJsonString(newValue:string):boolean {
|
||||
let isOk = true;
|
||||
try {
|
||||
JSON.parse(newValue);
|
||||
isOk = true;
|
||||
} catch (ex) {
|
||||
// set parse error if it fails
|
||||
isOk = false;
|
||||
}
|
||||
console.debug('>>>>>>>>JSON OK?.........'+isOk);
|
||||
return isOk;
|
||||
}
|
||||
|
||||
checkDatetime(denoFacet:string, indexFct:number, prop:IFacetProps):string{
|
||||
let errorMsg: string;
|
||||
|
@ -263,14 +295,21 @@ defaultValue={new Date().toISOString().substring(0, (new Date().toISOString().in
|
|||
let errorMsg: string;
|
||||
// eslint-disable-next-line prefer-const
|
||||
errorMsg='';
|
||||
console.debug('************');
|
||||
const valFc = this.getPropsGroup(denoFacet,indexFct).get(prop.name)!;
|
||||
/*
|
||||
if(prop.validations.length>1){
|
||||
console.debug('------>>>Validator deno 1...'+prop.validations[0].validator)
|
||||
console.debug('------>>>Validator deno 2...'+prop.validations[1].validator)
|
||||
}*/
|
||||
for(let i=0; i<prop.validations.length; i++){
|
||||
const valObj = prop.validations[i];
|
||||
//console.debug('Validator index...'+i)
|
||||
if(valFc.hasError(valObj.validator)){
|
||||
console.debug()
|
||||
errorMsg = valObj.message;
|
||||
}
|
||||
}
|
||||
//console.debug('************');
|
||||
return errorMsg;
|
||||
}
|
||||
|
||||
|
@ -383,7 +422,7 @@ defaultValue={new Date().toISOString().substring(0, (new Date().toISOString().in
|
|||
this.dialogRef.close('error');
|
||||
});
|
||||
}else{
|
||||
alert("Data provided is not valid!");
|
||||
// alert("Data provided is not valid!");
|
||||
}
|
||||
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue