various ui changes

This commit is contained in:
Diamantis Tziotzios 2024-03-27 18:48:58 +02:00
parent 49e6e9ac9f
commit 7fcada8839
12 changed files with 281 additions and 344 deletions

View File

@ -3,9 +3,9 @@ import { BaseEntity, BaseEntityPersist } from "@common/base/base-entity.model";
import { ExternalFetcherBaseSourceConfiguration, ExternalFetcherBaseSourceConfigurationPersist } from "../external-fetcher/external-fetcher"; import { ExternalFetcherBaseSourceConfiguration, ExternalFetcherBaseSourceConfigurationPersist } from "../external-fetcher/external-fetcher";
export interface ReferenceType extends BaseEntity{ export interface ReferenceType extends BaseEntity{
name: string; name?: string;
code: string; code?: string;
definition: ReferenceTypeDefinition; definition?: ReferenceTypeDefinition;
} }
export interface ReferenceTypeDefinition{ export interface ReferenceTypeDefinition{

View File

@ -30,7 +30,7 @@ import { debounceTime, delay, map, takeUntil, tap } from 'rxjs/operators';
import { GENERAL_ANIMATIONS } from '../../animations/animations'; import { GENERAL_ANIMATIONS } from '../../animations/animations';
import { EditorCustomValidators } from '../../custom-validators/editor-custom-validators'; import { EditorCustomValidators } from '../../custom-validators/editor-custom-validators';
import { DescriptionTemplateFieldEditorModel, DescriptionTemplateRuleEditorModel, DescriptionTemplateSectionEditorModel } from '../../description-template-editor.model'; import { DescriptionTemplateFieldEditorModel, DescriptionTemplateRuleEditorModel, DescriptionTemplateSectionEditorModel } from '../../description-template-editor.model';
import { DescriptionTemplateFieldSetPersist } from '@app/core/model/description-template/description-template-persist'; import { DescriptionTemplateFieldSetPersist, DescriptionTemplateReferenceTypeFieldPersist } from '@app/core/model/description-template/description-template-persist';
import { DescriptionEditorModel, DescriptionPropertyDefinitionEditorModel } from '@app/ui/description/editor/description-editor.model'; import { DescriptionEditorModel, DescriptionPropertyDefinitionEditorModel } from '@app/ui/description/editor/description-editor.model';
import { Description } from '@app/core/model/description/description'; import { Description } from '@app/core/model/description/description';
import { VisibilityRulesService } from '@app/ui/description/editor/description-form/visibility-rules/visibility-rules.service'; import { VisibilityRulesService } from '@app/ui/description/editor/description-form/visibility-rules/visibility-rules.service';
@ -232,7 +232,7 @@ export class DescriptionTemplateEditorCompositeFieldComponent extends BaseCompon
const formValue: DescriptionTemplateFieldSetPersist = this.form.getRawValue(); const formValue: DescriptionTemplateFieldSetPersist = this.form.getRawValue();
const fields: DescriptionTemplateField[] = formValue.fields.map(editorField => { const fields: DescriptionTemplateField[] = formValue.fields.map(editorField => {
return { const convertedField = {
id: editorField.id, id: editorField.id,
ordinal: editorField.ordinal, ordinal: editorField.ordinal,
numbering: '', numbering: '',
@ -242,7 +242,17 @@ export class DescriptionTemplateEditorCompositeFieldComponent extends BaseCompon
validations: editorField.validations, validations: editorField.validations,
includeInExport: editorField.includeInExport, includeInExport: editorField.includeInExport,
data: editorField.data data: editorField.data
} as DescriptionTemplateField;
if (editorField.data.fieldType === DescriptionTemplateFieldType.REFERENCE_TYPES) {
convertedField.data = editorField.data;
(convertedField.data as DescriptionTemplateReferenceTypeData).referenceType = {
id: (editorField.data as DescriptionTemplateReferenceTypeFieldPersist).referenceTypeId
};
} else {
convertedField.data = editorField.data;
} }
return convertedField;
}); });
const fieldSet: DescriptionTemplateFieldSet = { const fieldSet: DescriptionTemplateFieldSet = {

View File

@ -213,9 +213,7 @@ export class DescriptionTemplateDefinitionEditorModel implements DescriptionTemp
return this.formBuilder.group({ return this.formBuilder.group({
pages: this.formBuilder.array( pages: this.formBuilder.array(
(this.pages ?? []).map( (this.pages ?? []).map(
(item, index) => new DescriptionTemplatePageEditorModel( (item, index) => item.buildForm({
this.validationErrorModel
).fromModel(item).buildForm({
rootPath: `${rootPath}pages[${index}].` rootPath: `${rootPath}pages[${index}].`
}) })
), context.getValidation('pages').validators ), context.getValidation('pages').validators
@ -295,9 +293,7 @@ export class DescriptionTemplatePageEditorModel implements DescriptionTemplatePa
title: [{ value: this.title, disabled: disabled }, context.getValidation('title').validators], title: [{ value: this.title, disabled: disabled }, context.getValidation('title').validators],
sections: this.formBuilder.array( sections: this.formBuilder.array(
(this.sections ?? []).map( (this.sections ?? []).map(
(item, index) => new DescriptionTemplateSectionEditorModel( (item, index) => item.buildForm({
this.validationErrorModel
).fromModel(item).buildForm({
rootPath: `${rootPath}sections[${index}].` rootPath: `${rootPath}sections[${index}].`
}) })
), context.getValidation('sections').validators ), context.getValidation('sections').validators
@ -412,18 +408,14 @@ export class DescriptionTemplateSectionEditorModel implements DescriptionTemplat
description: [{ value: this.description, disabled: disabled }, context.getValidation('description').validators], description: [{ value: this.description, disabled: disabled }, context.getValidation('description').validators],
sections: this.formBuilder.array( sections: this.formBuilder.array(
(this.sections ?? []).map( (this.sections ?? []).map(
(item, index) => new DescriptionTemplateSectionEditorModel( (item, index) => item.buildForm({
this.validationErrorModel
).fromModel(item).buildForm({
rootPath: `${rootPath}sections[${index}].` rootPath: `${rootPath}sections[${index}].`
}) })
), context.getValidation('sections').validators ), context.getValidation('sections').validators
), ),
fieldSets: this.formBuilder.array( fieldSets: this.formBuilder.array(
(this.fieldSets ?? []).map( (this.fieldSets ?? []).map(
(item, index) => new DescriptionTemplateFieldSetEditorModel( (item, index) => item.buildForm({
this.validationErrorModel
).fromModel(item).buildForm({
rootPath: `${rootPath}fieldSets[${index}].` rootPath: `${rootPath}fieldSets[${index}].`
}) })
), context.getValidation('fieldSets').validators ), context.getValidation('fieldSets').validators
@ -551,9 +543,7 @@ export class DescriptionTemplateFieldSetEditorModel implements DescriptionTempla
}), }),
fields: this.formBuilder.array( fields: this.formBuilder.array(
(this.fields ?? []).map( (this.fields ?? []).map(
(item, index) => new DescriptionTemplateFieldEditorModel( (item, index) => item.buildForm({
this.validationErrorModel
).fromModel(item).buildForm({
rootPath: `${rootPath}fields[${index}].` rootPath: `${rootPath}fields[${index}].`
}) })
), context.getValidation('fields').validators ), context.getValidation('fields').validators
@ -758,9 +748,7 @@ export class DescriptionTemplateFieldEditorModel implements DescriptionTemplateF
}), }),
visibilityRules: this.formBuilder.array( visibilityRules: this.formBuilder.array(
(this.visibilityRules ?? []).map( (this.visibilityRules ?? []).map(
(item, index) => new DescriptionTemplateRuleEditorModel( (item, index) => item.buildForm({
this.validationErrorModel
).fromModel(item).buildForm({
rootPath: `${rootPath}visibilityRules[${index}].` rootPath: `${rootPath}visibilityRules[${index}].`
}) })
), context.getValidation('visibilityRules').validators ), context.getValidation('visibilityRules').validators
@ -1273,9 +1261,7 @@ export class DescriptionTemplateRadioBoxDataEditorModel extends DescriptionTempl
const formGroup = super.buildForm({ context, disabled, rootPath }); const formGroup = super.buildForm({ context, disabled, rootPath });
formGroup.setControl('options', this.formBuilder.array( formGroup.setControl('options', this.formBuilder.array(
(this.options ?? []).map( (this.options ?? []).map(
(item, index) => new DescriptionTemplateRadioBoxOptionEditorModel( (item, index) => item.buildForm({
this.validationErrorModel
).fromModel(item).buildForm({
rootPath: `${rootPath}options[${index}].` rootPath: `${rootPath}options[${index}].`
}) })
), context.getValidation('options').validators ), context.getValidation('options').validators
@ -1420,9 +1406,7 @@ export class DescriptionTemplateSelectDataEditorModel extends DescriptionTemplat
formGroup.setControl('multipleSelect', new FormControl({ value: this.multipleSelect, disabled: disabled }, context.getValidation('multipleSelect').validators)); formGroup.setControl('multipleSelect', new FormControl({ value: this.multipleSelect, disabled: disabled }, context.getValidation('multipleSelect').validators));
formGroup.setControl('options', this.formBuilder.array( formGroup.setControl('options', this.formBuilder.array(
(this.options ?? []).map( (this.options ?? []).map(
(item, index) => new DescriptionTemplateSelectOptionEditorModel( (item, index) => item.buildForm({
this.validationErrorModel
).fromModel(item).buildForm({
rootPath: `${rootPath}options[${index}].` rootPath: `${rootPath}options[${index}].`
}) })
), context.getValidation('options').validators ), context.getValidation('options').validators
@ -1581,9 +1565,7 @@ export class DescriptionTemplateUploadDataEditorModel extends DescriptionTemplat
formGroup.setControl('maxFileSizeInMB', new FormControl({ value: this.maxFileSizeInMB, disabled: disabled }, context.getValidation('maxFileSizeInMB').validators)); formGroup.setControl('maxFileSizeInMB', new FormControl({ value: this.maxFileSizeInMB, disabled: disabled }, context.getValidation('maxFileSizeInMB').validators));
formGroup.setControl('types', this.formBuilder.array( formGroup.setControl('types', this.formBuilder.array(
(this.types ?? []).map( (this.types ?? []).map(
(item, index) => new DescriptionTemplateUploadOptionEditorModel( (item, index) => item.buildForm({
this.validationErrorModel
).fromModel(item).buildForm({
rootPath: `${rootPath}types[${index}].` rootPath: `${rootPath}types[${index}].`
}) })
), context.getValidation('types').validators ), context.getValidation('types').validators

View File

@ -250,9 +250,7 @@ export class NotificationFieldOptionsEditorModel implements NotificationFieldOpt
formatting: [{ value: this.formatting, disabled: disabled }, context.getValidation('formatting').validators], formatting: [{ value: this.formatting, disabled: disabled }, context.getValidation('formatting').validators],
optional: this.formBuilder.array( optional: this.formBuilder.array(
(this.optional ?? []).map( (this.optional ?? []).map(
(item, index) => new NotificationFieldInfoEditorModel( (item, index) => item.buildForm({
this.validationErrorModel
).fromModel(item).buildForm({
rootPath: `${rootPath}optional[${index}].` rootPath: `${rootPath}optional[${index}].`
}) })
), context.getValidation('optional').validators ), context.getValidation('optional').validators

View File

@ -30,17 +30,17 @@
</mat-card-header> </mat-card-header>
<mat-card-content> <mat-card-content>
<form (ngSubmit)="formSubmit()" [formGroup]="formGroup" *ngIf="formGroup"> <form (ngSubmit)="formSubmit()" [formGroup]="formGroup" *ngIf="formGroup">
<div class="info-grid"> <div class="row">
<div class="info-grid-value"> <div class="col-6">
<mat-form-field class="col-lg-6"> <mat-form-field class="w-100">
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.NAME' | translate}}</mat-label> <mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.NAME' | translate}}</mat-label>
<input matInput type="text" name="name" [formControl]="formGroup.get('name')" required> <input matInput type="text" name="name" [formControl]="formGroup.get('name')" required>
<mat-error *ngIf="formGroup.get('name').hasError('backendError')">{{formGroup.get('name').getError('backendError').message}}</mat-error> <mat-error *ngIf="formGroup.get('name').hasError('backendError')">{{formGroup.get('name').getError('backendError').message}}</mat-error>
<mat-error *ngIf="formGroup.get('name').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="formGroup.get('name').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
</div> </div>
<div class="info-grid-value"> <div class="col-6">
<mat-form-field class="col-lg-6"> <mat-form-field class="w-100">
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.CODE' | translate}}</mat-label> <mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.CODE' | translate}}</mat-label>
<input matInput type="text" name="name" [formControl]="formGroup.get('code')" required> <input matInput type="text" name="name" [formControl]="formGroup.get('code')" required>
<mat-error *ngIf="formGroup.get('code').hasError('backendError')">{{formGroup.get('code').getError('backendError').message}}</mat-error> <mat-error *ngIf="formGroup.get('code').hasError('backendError')">{{formGroup.get('code').getError('backendError').message}}</mat-error>
@ -48,40 +48,25 @@
</mat-form-field> </mat-form-field>
</div> </div>
<div class="col-12 mt-3 mb-3">
<div class="row d-flex align-items-center">
<div class="col-auto">
<h3 class="m-0">{{'REFERENCE-TYPE-EDITOR.FIELDS.FIELDS' | translate}}</h3>
</div> </div>
</form> <div class="col-auto">
</mat-card-content>
</mat-card>
<mat-card appearance="outlined">
<mat-card-header>
<!-- <mat-card-title >{{'REFERENCE-TYPE-EDITOR.FIELDS.LABEL' | translate}}</mat-card-title> -->
<button mat-button class="action-btn" type="button" (click)="addField()" [disabled]="formGroup.disabled">{{'REFERENCE-TYPE-EDITOR.ACTIONS.ADD-FIELD' | translate}}</button> <button mat-button class="action-btn" type="button" (click)="addField()" [disabled]="formGroup.disabled">{{'REFERENCE-TYPE-EDITOR.ACTIONS.ADD-FIELD' | translate}}</button>
</mat-card-header> </div>
<mat-card-content> </div>
<form (ngSubmit)="formSubmit()" [formGroup]="formGroup" *ngIf="formGroup"> </div>
<!-- FIELDS --> <!-- FIELDS -->
<div class="col-12"> <div class="col-12">
<div *ngFor="let field of formGroup.get('definition').get('fields').controls; let fieldIndex=index;" class="row mb-3"> <div *ngFor="let field of formGroup.get('definition').get('fields').controls; let fieldIndex=index;" class="row mb-3">
<div class="col-12"> <div class="col-12">
<mat-card-header> <div class="row d-flex align-items-center">
<div class="row mb-3 d-flex align-items-center"> <div class="col-auto pb-3 d-flex">
<div class="col-auto d-flex"> <span>{{fieldIndex + 1}}</span>
<mat-card-title>{{'REFERENCE-TYPE-EDITOR.FIELDS.FIELD' | translate}} {{fieldIndex + 1}}</mat-card-title>
</div> </div>
<div class="col">
<div class="col-auto d-flex">
<button mat-icon-button class="action-list-icon" matTooltip="{{'REFERENCE-TYPE-EDITOR.ACTIONS.REMOVE-FIELD' | translate}}" (click)="removeField(fieldIndex)" [disabled]="formGroup.disabled">
<mat-icon>delete</mat-icon>
</button>
</div>
</div>
</mat-card-header>
<mat-card-content>
<div class="row">
<div class="col-6">
<mat-form-field class="w-100"> <mat-form-field class="w-100">
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.LABEL' | translate}}</mat-label> <mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.LABEL' | translate}}</mat-label>
<input matInput type="text" name="label" [formControl]="field.get('label')" required> <input matInput type="text" name="label" [formControl]="field.get('label')" required>
@ -89,7 +74,7 @@
<mat-error *ngIf="field.get('label').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="field.get('label').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
</div> </div>
<div class="col-6"> <div class="col">
<mat-form-field class="w-100"> <mat-form-field class="w-100">
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.DESCRIPTION' | translate}}</mat-label> <mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.DESCRIPTION' | translate}}</mat-label>
<input matInput type="text" name="description" [formControl]="field.get('description')"> <input matInput type="text" name="description" [formControl]="field.get('description')">
@ -97,7 +82,7 @@
<mat-error *ngIf="field.get('description').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="field.get('description').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
</div> </div>
<div class="col-6"> <div class="col">
<mat-form-field class="w-100"> <mat-form-field class="w-100">
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.CODE' | translate}}</mat-label> <mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.CODE' | translate}}</mat-label>
<input matInput type="text" name="code" [formControl]="field.get('code')" required> <input matInput type="text" name="code" [formControl]="field.get('code')" required>
@ -105,7 +90,7 @@
<mat-error *ngIf="field.get('code').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="field.get('code').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
</div> </div>
<div class="col-6"> <div class="col">
<mat-form-field class="w-100"> <mat-form-field class="w-100">
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.DATA-TYPE' | translate}}</mat-label> <mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.DATA-TYPE' | translate}}</mat-label>
<mat-select name="dataType" [formControl]="field.get('dataType')"> <mat-select name="dataType" [formControl]="field.get('dataType')">
@ -117,32 +102,29 @@
<mat-error *ngIf="field.get('dataType').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="field.get('dataType').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
</div> </div>
<div class="col-auto pb-3 d-flex">
</div> <button mat-icon-button class="action-list-icon" matTooltip="{{'REFERENCE-TYPE-EDITOR.ACTIONS.REMOVE-FIELD' | translate}}" (click)="removeField(fieldIndex)" [disabled]="formGroup.disabled">
</mat-card-content> <mat-icon>delete</mat-icon>
</button>
</div> </div>
</div> </div>
<button mat-button class="action-btn" *ngIf="formGroup.get('definition').get('fields').value != ''"
type="button" (click)="submitFields()" [disabled]="!formGroup.get('definition').get('fields').valid">{{'REFERENCE-TYPE-EDITOR.ACTIONS.SUBMIT-FIELDS' | translate}}</button>
</div> </div>
</form> </div>
</mat-card-content> <button mat-button class="action-btn" *ngIf="formGroup.get('definition').get('fields').value != ''" type="button" (click)="submitFields()" [disabled]="!formGroup.get('definition').get('fields').valid">{{'REFERENCE-TYPE-EDITOR.ACTIONS.SUBMIT-FIELDS' | translate}}</button>
</mat-card> </div>
<div class="col-12 mt-3 mb-3">
<mat-card appearance="outlined"> <div class="row d-flex align-items-center">
<mat-card-header> <div class="col-auto">
<!-- <mat-card-title>{{'REFERENCE-TYPE-EDITOR.FIELDS.LABEL' | translate}}</mat-card-title> --> <h3 class="m-0">{{'REFERENCE-TYPE-EDITOR.FIELDS.SOURCES' | translate}}</h3>
<mat-card-header> </div>
<div class="col-auto">
<button mat-button class="action-btn" type="button" (click)="addSource()" [disabled]="formGroup.disabled">{{'REFERENCE-TYPE-EDITOR.ACTIONS.ADD-SOURCE' | translate}}</button> <button mat-button class="action-btn" type="button" (click)="addSource()" [disabled]="formGroup.disabled">{{'REFERENCE-TYPE-EDITOR.ACTIONS.ADD-SOURCE' | translate}}</button>
</mat-card-header> </div>
</mat-card-header> </div>
<mat-card-content> </div>
<form (ngSubmit)="formSubmit()" [formGroup]="formGroup" *ngIf="formGroup">
<!-- Source Config Info -->
<div class="col-12"> <div class="col-12">
<div *ngFor="let source of formGroup.get('definition').get('sources').controls; let sourceIndex=index;" class="row mb-3"> <div *ngFor="let source of formGroup.get('definition').get('sources').controls; let sourceIndex=index;" class="row">
<div class="col-12"> <div class="col-12">
<mat-card-content>
<div class="row mb-3 d-flex align-items-center"> <div class="row mb-3 d-flex align-items-center">
<div class="col-auto d-flex"> <div class="col-auto d-flex">
<mat-card-title>{{'REFERENCE-TYPE-EDITOR.FIELDS.SOURCE-CONFIGURATION' | translate}} {{sourceIndex + 1}}</mat-card-title> <mat-card-title>{{'REFERENCE-TYPE-EDITOR.FIELDS.SOURCE-CONFIGURATION' | translate}} {{sourceIndex + 1}}</mat-card-title>
@ -153,24 +135,16 @@
</button> </button>
</div> </div>
</div> </div>
<app-external-fetcher-source-component <app-external-fetcher-source-component [formGroup]="source" [validationErrorModel]="editorModel.validationErrorModel" [validationRootPath]="'definition.sources[' + sourceIndex + '].'" [referenceTypeSourceIndex]="sourceIndex" [referenceTypes]="referenceTypes" [sourceKeysMap]="sourceKeysMap">
[formGroup]="source"
[validationErrorModel]="editorModel.validationErrorModel"
[validationRootPath]="'definition.sources[' + sourceIndex + '].'"
[referenceTypeSourceIndex]="sourceIndex"
[referenceTypes]="referenceTypes"
[sourceKeysMap]="sourceKeysMap">
</app-external-fetcher-source-component> </app-external-fetcher-source-component>
</mat-card-content>
</div> </div>
</div> </div>
<mat-error *ngIf="formGroup.get('definition').get('sources').dirty && formGroup.get('definition').get('sources').hasError('required')">{{'REFERENCE-TYPE-EDITOR.SOURCES-REQUIRED' | translate}}</mat-error> <mat-error *ngIf="formGroup.get('definition').get('sources').dirty && formGroup.get('definition').get('sources').hasError('required')">{{'REFERENCE-TYPE-EDITOR.SOURCES-REQUIRED' | translate}}</mat-error>
<mat-error *ngIf="formGroup.get('definition').get('sources').hasError('backendError')">{{formGroup.get('definition').get('sources').getError('backendError').message}}</mat-error> <mat-error *ngIf="formGroup.get('definition').get('sources').hasError('backendError')">{{formGroup.get('definition').get('sources').getError('backendError').message}}</mat-error>
</div> </div>
</div>
</form> </form>
</mat-card-content> </mat-card-content>
</mat-card> </mat-card>
</div> </div>
</div> </div>

View File

@ -151,9 +151,7 @@ export class ReferenceTypeDefinitionEditorModel implements ReferenceTypeDefiniti
return this.formBuilder.group({ return this.formBuilder.group({
fields: this.formBuilder.array( fields: this.formBuilder.array(
(this.fields ?? []).map( (this.fields ?? []).map(
(item, index) => new ReferenceTypeFieldEditorModel( (item, index) => item.buildForm({
this.validationErrorModel
).fromModel(item).buildForm({
rootPath: `${rootPath}fields[${index}].` rootPath: `${rootPath}fields[${index}].`
}) })
), context.getValidation('fields').validators ), context.getValidation('fields').validators

View File

@ -27,7 +27,7 @@
<mat-card-header> <mat-card-header>
<mat-card-title *ngIf="isNew">{{'REFERENCE-EDITOR.NEW' | translate}}</mat-card-title> <mat-card-title *ngIf="isNew">{{'REFERENCE-EDITOR.NEW' | translate}}</mat-card-title>
</mat-card-header> </mat-card-header>
<mat-card-content> <mat-card-content class="pt-2">
<div class="row"> <div class="row">
<div class="col-4"> <div class="col-4">
<mat-form-field class="w-100"> <mat-form-field class="w-100">
@ -37,6 +37,14 @@
<mat-error *ngIf="formGroup.get('label').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="formGroup.get('label').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
</div> </div>
<div class="col-4">
<mat-form-field class="w-100">
<mat-label>{{'REFERENCE-EDITOR.FIELDS.REFERENCE' | translate}}</mat-label>
<input matInput type="text" name="reference" [formControl]="formGroup.get('reference')" required>
<mat-error *ngIf="formGroup.get('reference').hasError('backendError')">{{formGroup.get('reference').getError('backendError').message}}</mat-error>
<mat-error *ngIf="formGroup.get('reference').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field>
</div>
<div class="col-4"> <div class="col-4">
<mat-form-field class="w-100"> <mat-form-field class="w-100">
<mat-label>{{'REFERENCE-EDITOR.FIELDS.TYPE' | translate}}</mat-label> <mat-label>{{'REFERENCE-EDITOR.FIELDS.TYPE' | translate}}</mat-label>
@ -46,17 +54,6 @@
<mat-error *ngIf="formGroup.get('typeId').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="formGroup.get('typeId').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
</div> </div>
<div class="col-12">
<h3>{{'REFERENCE-EDITOR.FIELDS.DESCRIPTION' | translate}}</h3>
<div class="col-12">
<rich-text-editor-component [form]="formGroup.get('description')" [placeholder]="'REFERENCE-EDITOR.FIELDS.DESCRIPTION-PLACEHOLDER'" [wrapperClasses]="(formGroup.get('description').touched && formGroup.get('description').hasError('required')) ? 'required' : ''" [editable]="formGroup.controls['description'].status !== 'DISABLED'">
</rich-text-editor-component>
<div [class]="(formGroup.get('description').touched && formGroup.get('description').hasError('required')) ? 'visible' : 'invisible'" class="mat-form-field formGroup-field-subscript-wrapper">
<mat-error *ngIf="formGroup.get('description').hasError('backendError')">{{formGroup.get('description').getError('backendError').message}}</mat-error>
<mat-error>{{'GENERAL.VALIDATION.REQUIRED'| translate}}</mat-error>
</div>
</div>
</div>
<div class="col-4"> <div class="col-4">
<mat-form-field class="w-100"> <mat-form-field class="w-100">
<mat-label>{{'REFERENCE-EDITOR.FIELDS.SOURCE' | translate}}</mat-label> <mat-label>{{'REFERENCE-EDITOR.FIELDS.SOURCE' | translate}}</mat-label>
@ -77,14 +74,6 @@
<mat-error *ngIf="formGroup.get('sourceType').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="formGroup.get('sourceType').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
</div> </div>
<div class="col-6">
<mat-form-field class="w-100">
<mat-label>{{'REFERENCE-EDITOR.FIELDS.REFERENCE' | translate}}</mat-label>
<input matInput type="text" name="reference" [formControl]="formGroup.get('reference')" required>
<mat-error *ngIf="formGroup.get('reference').hasError('backendError')">{{formGroup.get('reference').getError('backendError').message}}</mat-error>
<mat-error *ngIf="formGroup.get('reference').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field>
</div>
<div class="col-4"> <div class="col-4">
<mat-form-field class="w-100"> <mat-form-field class="w-100">
<mat-label>{{'REFERENCE-EDITOR.FIELDS.ABBREVIATION' | translate}}</mat-label> <mat-label>{{'REFERENCE-EDITOR.FIELDS.ABBREVIATION' | translate}}</mat-label>
@ -93,27 +82,28 @@
<mat-error *ngIf="formGroup.get('abbreviation').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="formGroup.get('abbreviation').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
</div> </div>
<div class="col-12">
<rich-text-editor-component [form]="formGroup.get('description')" [placeholder]="'REFERENCE-EDITOR.FIELDS.DESCRIPTION-PLACEHOLDER'" [wrapperClasses]="(formGroup.get('description').touched && formGroup.get('description').hasError('required')) ? 'required' : ''" [editable]="formGroup.controls['description'].status !== 'DISABLED'">
</rich-text-editor-component>
<div [class]="(formGroup.get('description').touched && formGroup.get('description').hasError('required')) ? 'visible' : 'invisible'" class="mat-form-field formGroup-field-subscript-wrapper">
<mat-error *ngIf="formGroup.get('description').hasError('backendError')">{{formGroup.get('description').getError('backendError').message}}</mat-error>
<mat-error>{{'GENERAL.VALIDATION.REQUIRED'| translate}}</mat-error>
</div>
</div>
<!-- Fields --> <!-- Fields -->
<div class="col-12"> <div class="col-12">
<h3> <h3 class="mb-4">
{{'REFERENCE-EDITOR.FIELDS.FIELDS' | translate}} {{'REFERENCE-EDITOR.FIELDS.FIELDS' | translate}}
<button mat-button class="action-btn" type="button" (click)="addField()" [disabled]="formGroup.disabled">{{'REFERENCE-EDITOR.ACTIONS.ADD-FIELD' | translate}}</button> <button mat-button class="action-btn" type="button" (click)="addField()" [disabled]="formGroup.disabled">{{'REFERENCE-EDITOR.ACTIONS.ADD-FIELD' | translate}}</button>
</h3> </h3>
<div *ngFor="let field of formGroup.get('definition').get('fields').controls; let fieldIndex=index;" class="row mb-3"> <div *ngFor="let field of formGroup.get('definition').get('fields').controls; let fieldIndex=index;" class="row mb-3">
<div class="col-12"> <div class="col-12">
<div class="row mb-3 d-flex align-items-center"> <div class="row d-flex align-items-center">
<div class="col-auto d-flex"> <div class="col-auto pb-3 d-flex">
<mat-card-title>{{'REFERENCE-EDITOR.FIELDS.FIELD' | translate}} {{fieldIndex + 1}}</mat-card-title> <mat-card-title>{{fieldIndex + 1}}</mat-card-title>
</div> </div>
<div class="col-auto d-flex"> <div class="col">
<button mat-icon-button class="action-list-icon" matTooltip="{{'REFERENCE-EDITOR.ACTIONS.REMOVE-FIELD' | translate}}" (click)="removeField(fieldIndex)" [disabled]="formGroup.disabled">
<mat-icon>delete</mat-icon>
</button>
</div>
</div>
<div class="row">
<div class="col-6">
<mat-form-field class="w-100"> <mat-form-field class="w-100">
<mat-label>{{'REFERENCE-EDITOR.FIELDS.CODE' | translate}}</mat-label> <mat-label>{{'REFERENCE-EDITOR.FIELDS.CODE' | translate}}</mat-label>
<input matInput type="text" name="code" [formControl]="field.get('code')" required> <input matInput type="text" name="code" [formControl]="field.get('code')" required>
@ -121,7 +111,7 @@
<mat-error *ngIf="field.get('code').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="field.get('code').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
</div> </div>
<div class="col-6"> <div class="col">
<mat-form-field class="w-100"> <mat-form-field class="w-100">
<mat-label>{{'REFERENCE-EDITOR.FIELDS.DATA-TYPE' | translate}}</mat-label> <mat-label>{{'REFERENCE-EDITOR.FIELDS.DATA-TYPE' | translate}}</mat-label>
<mat-select name="type" [formControl]="field.get('dataType')" required> <mat-select name="type" [formControl]="field.get('dataType')" required>
@ -133,7 +123,7 @@
<mat-error *ngIf="field.get('dataType').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="field.get('dataType').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
</div> </div>
<div class="col-6"> <div class="col">
<mat-form-field class="w-100"> <mat-form-field class="w-100">
<mat-label>{{'REFERENCE-EDITOR.FIELDS.VALUE' | translate}}</mat-label> <mat-label>{{'REFERENCE-EDITOR.FIELDS.VALUE' | translate}}</mat-label>
<input matInput type="text" name="value" [formControl]="field.get('value')"> <input matInput type="text" name="value" [formControl]="field.get('value')">
@ -141,6 +131,11 @@
<mat-error *ngIf="field.get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="field.get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
</div> </div>
<div class="col-auto pb-3 d-flex">
<button mat-icon-button class="action-list-icon" matTooltip="{{'REFERENCE-EDITOR.ACTIONS.REMOVE-FIELD' | translate}}" (click)="removeField(fieldIndex)" [disabled]="formGroup.disabled">
<mat-icon>delete</mat-icon>
</button>
</div>
</div> </div>
</div> </div>
</div> </div>

View File

@ -129,9 +129,7 @@ export class DefinitionEditorModel implements DefinitionPersist {
return this.formBuilder.group({ return this.formBuilder.group({
fields: this.formBuilder.array( fields: this.formBuilder.array(
(this.fields ?? []).map( (this.fields ?? []).map(
(item, index) => new FieldEditorModel( (item, index) => item.buildForm({
this.validationErrorModel
).fromModel(item).buildForm({
rootPath: `${rootPath}fields[${index}].` rootPath: `${rootPath}fields[${index}].`
}) })
), context.getValidation('fields').validators ), context.getValidation('fields').validators

View File

@ -172,9 +172,7 @@ export class TenantDepositConfigEditorModel implements TenantDepositConfigPersis
return this.formBuilder.group({ return this.formBuilder.group({
sources: this.formBuilder.array( sources: this.formBuilder.array(
(this.sources ?? []).map( (this.sources ?? []).map(
(item, index) => new TenantSourceEditorModel( (item, index) => item.buildForm({
this.validationErrorModel
).fromModel(item).buildForm({
rootPath: `${rootPath}sources[${index}].` rootPath: `${rootPath}sources[${index}].`
}) })
), context.getValidation('sources') ), context.getValidation('sources')
@ -244,9 +242,7 @@ export class TenantFileTransformersConfigEditorModel implements TenantFileTransf
return this.formBuilder.group({ return this.formBuilder.group({
sources: this.formBuilder.array( sources: this.formBuilder.array(
(this.sources ?? []).map( (this.sources ?? []).map(
(item, index) => new TenantSourceEditorModel( (item, index) => item.buildForm({
this.validationErrorModel
).fromModel(item).buildForm({
rootPath: `${rootPath}sources[${index}].` rootPath: `${rootPath}sources[${index}].`
}) })
), context.getValidation('sources') ), context.getValidation('sources')

View File

@ -106,9 +106,7 @@ export class ExternalFetcherBaseSourceConfigurationEditorModel implements Extern
), ),
options: this.formBuilder.array( options: this.formBuilder.array(
(this.options ?? []).map( (this.options ?? []).map(
(item, index) => new StaticOptionEditorModel( (item, index) => item.buildForm({
this.validationErrorModel
).fromModel(item).buildForm({
rootPath: `${rootPath}options[${index}].` rootPath: `${rootPath}options[${index}].`
}) })
), context.getValidation('options').validators ), context.getValidation('options').validators
@ -237,9 +235,7 @@ export class ResultsConfigurationEditorModel implements ResultsConfigurationPers
resultsArrayPath: [{ value: this.resultsArrayPath, disabled: disabled }, context.getValidation('resultsArrayPath').validators], resultsArrayPath: [{ value: this.resultsArrayPath, disabled: disabled }, context.getValidation('resultsArrayPath').validators],
fieldsMapping: this.formBuilder.array( fieldsMapping: this.formBuilder.array(
(this.fieldsMapping ?? []).map( (this.fieldsMapping ?? []).map(
(item, index) => new ResultFieldsMappingConfigurationEditorModel( (item, index) => item.buildForm({
this.validationErrorModel
).fromModel(item).buildForm({
rootPath: `${rootPath}fieldsMapping[${index}].` rootPath: `${rootPath}fieldsMapping[${index}].`
}) })
), context.getValidation('fieldsMapping').validators ), context.getValidation('fieldsMapping').validators

View File

@ -1,5 +1,5 @@
<div class="row"> <div class="row">
<div class="col-6"> <div class="col-3">
<mat-form-field class="w-100"> <mat-form-field class="w-100">
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.KEY' | translate}}</mat-label> <mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.KEY' | translate}}</mat-label>
<input matInput type="text" name="key" [formControl]="formGroup.get('key')" required> <input matInput type="text" name="key" [formControl]="formGroup.get('key')" required>
@ -7,7 +7,7 @@
<mat-error *ngIf="formGroup.get('key').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="formGroup.get('key').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
</div> </div>
<div class="col-6"> <div class="col-3">
<mat-form-field class="w-100"> <mat-form-field class="w-100">
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.LABEL' | translate}}</mat-label> <mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.LABEL' | translate}}</mat-label>
<input matInput type="text" name="label" [formControl]="formGroup.get('label')" required> <input matInput type="text" name="label" [formControl]="formGroup.get('label')" required>
@ -15,7 +15,7 @@
<mat-error *ngIf="formGroup.get('label').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="formGroup.get('label').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
</div> </div>
<div class="col-6"> <div class="col-3">
<mat-form-field class="w-100"> <mat-form-field class="w-100">
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.ORDINAL' | translate}}</mat-label> <mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.ORDINAL' | translate}}</mat-label>
<input matInput type="number" name="ordinal" [formControl]="formGroup.get('ordinal')" required> <input matInput type="number" name="ordinal" [formControl]="formGroup.get('ordinal')" required>
@ -23,7 +23,7 @@
<mat-error *ngIf="formGroup.get('ordinal').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="formGroup.get('ordinal').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
</div> </div>
<div class="col-6" *ngIf="referenceTypeSourceIndex != null"> <div class="col-3" *ngIf="referenceTypeSourceIndex != null">
<mat-form-field class="w-100"> <mat-form-field class="w-100">
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.DEPENDENCIES' | translate}}</mat-label> <mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.DEPENDENCIES' | translate}}</mat-label>
<mat-select multiple (selectionChange)="setReferenceTypeDependenciesMap($event.value, referenceTypeSourceIndex)" [formControl]="formGroup.get('referenceTypeDependencyIds')"> <mat-select multiple (selectionChange)="setReferenceTypeDependenciesMap($event.value, referenceTypeSourceIndex)" [formControl]="formGroup.get('referenceTypeDependencyIds')">
@ -33,7 +33,7 @@
<mat-error *ngIf="formGroup.get('referenceTypeDependencyIds').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="formGroup.get('referenceTypeDependencyIds').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
</div> </div>
<div class="col-6" *ngIf="referenceTypeSourceIndex != null"> <div class="col-12" *ngIf="referenceTypeSourceIndex != null">
<mat-form-field class="w-100"> <mat-form-field class="w-100">
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.SOURCE-TYPE' | translate}}</mat-label> <mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.SOURCE-TYPE' | translate}}</mat-label>
<mat-select name="type" [formControl]="formGroup.get('type')" required> <mat-select name="type" [formControl]="formGroup.get('type')" required>
@ -64,7 +64,7 @@
<mat-error *ngIf="formGroup.get('paginationPath').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="formGroup.get('paginationPath').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
</div> </div>
<div class="col-6"> <div class="col-3">
<mat-form-field class="w-100"> <mat-form-field class="w-100">
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.CONTENT-TYPE' | translate}}</mat-label> <mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.CONTENT-TYPE' | translate}}</mat-label>
<input matInput type="text" name="contentType" [formControl]="formGroup.get('contentType')"> <input matInput type="text" name="contentType" [formControl]="formGroup.get('contentType')">
@ -72,7 +72,7 @@
<mat-error *ngIf="formGroup.get('contentType').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="formGroup.get('contentType').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
</div> </div>
<div class="col-6"> <div class="col-3">
<mat-form-field class="w-100"> <mat-form-field class="w-100">
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.FIRST-PAGE' | translate}}</mat-label> <mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.FIRST-PAGE' | translate}}</mat-label>
<input matInput type="text" name="firstPage" [formControl]="formGroup.get('firstPage')"> <input matInput type="text" name="firstPage" [formControl]="formGroup.get('firstPage')">
@ -80,7 +80,7 @@
<mat-error *ngIf="formGroup.get('firstPage').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="formGroup.get('firstPage').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
</div> </div>
<div class="col-6"> <div class="col-3">
<mat-form-field class="w-100"> <mat-form-field class="w-100">
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.HTTP-METHOD' | translate}}</mat-label> <mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.HTTP-METHOD' | translate}}</mat-label>
<mat-select name="httpMethod" [formControl]="formGroup.get('httpMethod')"> <mat-select name="httpMethod" [formControl]="formGroup.get('httpMethod')">
@ -92,7 +92,7 @@
<mat-error *ngIf="formGroup.get('httpMethod').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="formGroup.get('httpMethod').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
</div> </div>
<div class="col-6" *ngIf="formGroup.get('httpMethod').value == externalFetcherApiHTTPMethodType.POST"> <div class="col-3" *ngIf="formGroup.get('httpMethod').value == externalFetcherApiHTTPMethodType.POST">
<mat-form-field class="w-100"> <mat-form-field class="w-100">
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.REQUEST-BODY' | translate}}</mat-label> <mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.REQUEST-BODY' | translate}}</mat-label>
<input matInput type="text" name="requestBody" [formControl]="formGroup.get('requestBody')"> <input matInput type="text" name="requestBody" [formControl]="formGroup.get('requestBody')">
@ -100,7 +100,7 @@
<mat-error *ngIf="formGroup.get('requestBody').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="formGroup.get('requestBody').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
</div> </div>
<div class="col-6"> <div class="col-3">
<mat-form-field class="w-100"> <mat-form-field class="w-100">
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.FILTER-TYPE' | translate}}</mat-label> <mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.FILTER-TYPE' | translate}}</mat-label>
<input matInput type="text" name="filterType" [formControl]="formGroup.get('filterType')"> <input matInput type="text" name="filterType" [formControl]="formGroup.get('filterType')">
@ -110,7 +110,7 @@
</div> </div>
<!-- Results info --> <!-- Results info -->
<h3 class="col-12">{{'REFERENCE-TYPE-EDITOR.FIELDS.RESULTS' | translate}}</h3> <h3 class="col-12">{{'REFERENCE-TYPE-EDITOR.FIELDS.RESULTS' | translate}}</h3>
<div class="col-6"> <div class="col-12">
<mat-form-field class="w-100"> <mat-form-field class="w-100">
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.RESULTS-PATH' | translate}}</mat-label> <mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.RESULTS-PATH' | translate}}</mat-label>
<input matInput type="text" name="resultsArrayPath" [formControl]="formGroup.get('results').get('resultsArrayPath')"> <input matInput type="text" name="resultsArrayPath" [formControl]="formGroup.get('results').get('resultsArrayPath')">
@ -119,19 +119,15 @@
</mat-form-field> </mat-form-field>
</div> </div>
<!-- fields mapping --> <!-- fields mapping -->
<h3 class="col-12">{{'REFERENCE-TYPE-EDITOR.FIELDS.FIELD-MAPPINGS' | translate}}</h3>
<div class="col-12"> <div class="col-12">
<div *ngFor="let field of formGroup.get('results').get('fieldsMapping').controls; let fieldMappingIndex=index;" class="row mb-3"> <div *ngFor="let field of formGroup.get('results').get('fieldsMapping').controls; let fieldMappingIndex=index;" class="row mb-3">
<div class="col-12"> <div class="col-12">
<mat-card-header> <div class="row d-flex align-items-center">
<div class="row mb-3 d-flex align-items-center"> <div class="col-auto pb-3 d-flex">
<div class="col-auto d-flex"> <span>{{fieldMappingIndex + 1}}</span>
<h4 class="col-12">{{'REFERENCE-TYPE-EDITOR.FIELDS.FIELD-MAPPING' | translate}} {{fieldMappingIndex + 1}}</h4>
</div> </div>
</div> <div class="col">
</mat-card-header>
<mat-card-content>
<div class="row">
<div class="col-6">
<mat-form-field class="w-100"> <mat-form-field class="w-100">
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.CODE' | translate}}</mat-label> <mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.CODE' | translate}}</mat-label>
<input matInput type="text" [readonly]="field.get('code').disabled" name="code" [formControl]="field.get('code')" [readOnly]="true"> <input matInput type="text" [readonly]="field.get('code').disabled" name="code" [formControl]="field.get('code')" [readOnly]="true">
@ -139,7 +135,7 @@
<mat-error *ngIf="field.get('code').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="field.get('code').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
</div> </div>
<div class="col-6"> <div class="col">
<mat-form-field class="w-100"> <mat-form-field class="w-100">
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.RESPONSE-PATH' | translate}}</mat-label> <mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.RESPONSE-PATH' | translate}}</mat-label>
<input matInput type="text" name="responsePath" [formControl]="field.get('responsePath')"> <input matInput type="text" name="responsePath" [formControl]="field.get('responsePath')">
@ -148,7 +144,6 @@
</mat-form-field> </mat-form-field>
</div> </div>
</div> </div>
</mat-card-content>
</div> </div>
</div> </div>
</div> </div>
@ -158,7 +153,7 @@
</h3> </h3>
<div class="col-12" *ngIf="formGroup.get('auth').get('enabled').value == true"> <div class="col-12" *ngIf="formGroup.get('auth').get('enabled').value == true">
<div class="row"> <div class="row">
<div class="col-6"> <div class="col-12">
<mat-form-field class="w-100"> <mat-form-field class="w-100">
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.URL' | translate}}</mat-label> <mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.URL' | translate}}</mat-label>
<input matInput type="text" name="authUrl" [formControl]="formGroup.get('auth').get('authUrl')"> <input matInput type="text" name="authUrl" [formControl]="formGroup.get('auth').get('authUrl')">
@ -166,7 +161,7 @@
<mat-error *ngIf="formGroup.get('auth').get('authUrl').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="formGroup.get('auth').get('authUrl').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
</div> </div>
<div class="col-6"> <div class="col-4">
<mat-form-field class="w-100"> <mat-form-field class="w-100">
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.HTTP-METHOD' | translate}}</mat-label> <mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.HTTP-METHOD' | translate}}</mat-label>
<mat-select name="httpMethod" [formControl]="formGroup.get('auth').get('authMethod')"> <mat-select name="httpMethod" [formControl]="formGroup.get('auth').get('authMethod')">
@ -178,7 +173,7 @@
<mat-error *ngIf="formGroup.get('auth').get('authMethod').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="formGroup.get('auth').get('authMethod').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
</div> </div>
<div class="col-6"> <div class="col-4">
<mat-form-field class="w-100"> <mat-form-field class="w-100">
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.TOKEN-PATH' | translate}}</mat-label> <mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.TOKEN-PATH' | translate}}</mat-label>
<input matInput type="text" name="authTokenPath" [formControl]="formGroup.get('auth').get('authTokenPath')"> <input matInput type="text" name="authTokenPath" [formControl]="formGroup.get('auth').get('authTokenPath')">
@ -186,15 +181,7 @@
<mat-error *ngIf="formGroup.get('auth').get('authTokenPath').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="formGroup.get('auth').get('authTokenPath').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
</div> </div>
<div class="col-6"> <div class="col-4">
<mat-form-field class="w-100">
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.REQUEST-BODY' | translate}}</mat-label>
<input matInput type="text" name="authRequestBody" [formControl]="formGroup.get('auth').get('authRequestBody')">
<mat-error *ngIf="formGroup.get('auth').get('authRequestBody').hasError('backendError')">{{formGroup.get('auth').get('authRequestBody').getError('backendError').message}}</mat-error>
<mat-error *ngIf="formGroup.get('auth').get('authRequestBody').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field>
</div>
<div class="col-6">
<mat-form-field class="w-100"> <mat-form-field class="w-100">
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.TYPE' | translate}}</mat-label> <mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.TYPE' | translate}}</mat-label>
<input matInput type="text" name="type" [formControl]="formGroup.get('auth').get('type')"> <input matInput type="text" name="type" [formControl]="formGroup.get('auth').get('type')">
@ -202,6 +189,14 @@
<mat-error *ngIf="formGroup.get('auth').get('type').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="formGroup.get('auth').get('type').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
</div> </div>
<div class="col-12">
<mat-form-field class="w-100">
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.REQUEST-BODY' | translate}}</mat-label>
<input matInput type="text" name="authRequestBody" [formControl]="formGroup.get('auth').get('authRequestBody')">
<mat-error *ngIf="formGroup.get('auth').get('authRequestBody').hasError('backendError')">{{formGroup.get('auth').get('authRequestBody').getError('backendError').message}}</mat-error>
<mat-error *ngIf="formGroup.get('auth').get('authRequestBody').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field>
</div>
</div> </div>
</div> </div>
<!-- Queries info --> <!-- Queries info -->
@ -211,7 +206,6 @@
<div class="col-12"> <div class="col-12">
<div *ngFor="let query of formGroup.get('queries').controls; let queryIndex=index;" class="row mb-3"> <div *ngFor="let query of formGroup.get('queries').controls; let queryIndex=index;" class="row mb-3">
<div class="col-12"> <div class="col-12">
<mat-card-header>
<div class="row mb-3 d-flex align-items-center"> <div class="row mb-3 d-flex align-items-center">
<div class="col-auto d-flex"> <div class="col-auto d-flex">
<h4 class="col-12">{{'REFERENCE-TYPE-EDITOR.FIELDS.QUERY' | translate}} {{queryIndex + 1}}</h4> <h4 class="col-12">{{'REFERENCE-TYPE-EDITOR.FIELDS.QUERY' | translate}} {{queryIndex + 1}}</h4>
@ -221,12 +215,7 @@
<mat-icon>delete</mat-icon> <mat-icon>delete</mat-icon>
</button> </button>
</div> </div>
<div class="col-auto">
<button mat-button class="action-btn" type="button" (click)="addCase(queryIndex)" [disabled]="formGroup.disabled">{{'REFERENCE-TYPE-EDITOR.ACTIONS.ADD-CASE' | translate}}</button>
</div> </div>
</div>
</mat-card-header>
<mat-card-content>
<div class="row"> <div class="row">
<div class="col-6"> <div class="col-6">
<mat-form-field class="w-100"> <mat-form-field class="w-100">
@ -245,26 +234,20 @@
</mat-form-field> </mat-form-field>
</div> </div>
</div> </div>
</mat-card-content>
</div>
<!-- Query Cases --> <!-- Query Cases -->
<div *ngFor="let case of query.get('cases').controls; let caseIndex=index;" class="row mb-3"> <h3 class="col-12">{{'REFERENCE-TYPE-EDITOR.FIELDS.CASES' | translate}}
<button mat-button class="action-btn" type="button" (click)="addCase(queryIndex)" [disabled]="formGroup.disabled">{{'REFERENCE-TYPE-EDITOR.ACTIONS.ADD-CASE' | translate}}</button>
</h3>
<div *ngFor="let case of query.get('cases').controls; let caseIndex=index;" class="row">
<div class="col-12"> <div class="col-12">
<mat-card-header> <div class="row mb d-flex align-items-center">
<div class="row mb-3 d-flex align-items-center">
<div class="col-auto d-flex"> <div class="col-auto d-flex">
<h4 class="col-12">{{'REFERENCE-TYPE-EDITOR.FIELDS.CASE' | translate}} {{caseIndex + 1}}</h4> <span>{{caseIndex + 1}}</span>
</div> </div>
<div class="col-auto d-flex"> <div class="col">
<button mat-icon-button class="action-list-icon" matTooltip="{{'REFERENCE-TYPE-EDITOR.ACTIONS.REMOVE-CASE' | translate}}" (click)="removeCase(queryIndex, caseIndex)" [disabled]="formGroup.disabled">
<mat-icon>delete</mat-icon>
</button>
</div>
</div>
</mat-card-header>
<mat-card-content>
<div class="row"> <div class="row">
<div class="col-6"> <div class="col-4">
<mat-form-field class="w-100"> <mat-form-field class="w-100">
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.LIKE-PATTERN' | translate}}</mat-label> <mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.LIKE-PATTERN' | translate}}</mat-label>
<input matInput type="text" name="likePattern" [formControl]="case.get('likePattern')"> <input matInput type="text" name="likePattern" [formControl]="case.get('likePattern')">
@ -272,7 +255,7 @@
<mat-error *ngIf="case.get('likePattern').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="case.get('likePattern').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
</div> </div>
<div class="col-6"> <div class="col-4">
<mat-form-field class="w-100"> <mat-form-field class="w-100">
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.SEPARATOR' | translate}}</mat-label> <mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.SEPARATOR' | translate}}</mat-label>
<input matInput type="text" name="separator" [formControl]="case.get('separator')"> <input matInput type="text" name="separator" [formControl]="case.get('separator')">
@ -280,7 +263,7 @@
<mat-error *ngIf="case.get('separator').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="case.get('separator').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
</div> </div>
<div class="col-6"> <div class="col-4">
<mat-form-field class="w-100"> <mat-form-field class="w-100">
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.VALUE' | translate}}</mat-label> <mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.VALUE' | translate}}</mat-label>
<input matInput type="text" name="value" [formControl]="case.get('value')"> <input matInput type="text" name="value" [formControl]="case.get('value')">
@ -313,12 +296,20 @@
</mat-form-field> </mat-form-field>
</div> </div>
</div> </div>
</mat-card-content> </div>
<div class="col-auto d-flex">
<button mat-icon-button class="action-list-icon" matTooltip="{{'REFERENCE-TYPE-EDITOR.ACTIONS.REMOVE-CASE' | translate}}" (click)="removeCase(queryIndex, caseIndex)" [disabled]="formGroup.disabled">
<mat-icon>delete</mat-icon>
</button>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div>
</div>
</div>
</div> </div>
<!-- Options --> <!-- Options -->
<div class="row" *ngIf="formGroup.get('type').value == externalFetcherSourceType.STATIC"> <div class="row" *ngIf="formGroup.get('type').value == externalFetcherSourceType.STATIC">

View File

@ -1098,7 +1098,9 @@
"FIELDS": { "FIELDS": {
"SOURCE-CONFIGURATION": "Source Configuration", "SOURCE-CONFIGURATION": "Source Configuration",
"RESULTS": "Results", "RESULTS": "Results",
"FIELD-MAPPING": "Field Mapping", "FIELDS": "Fields",
"SOURCES": "Sources",
"FIELD-MAPPINGS": "Field Mappings",
"AUTHENTICATION": "Authentication", "AUTHENTICATION": "Authentication",
"QUERIES": "Queries", "QUERIES": "Queries",
"QUERY": "Query", "QUERY": "Query",
@ -1108,7 +1110,6 @@
"CODE": "Code", "CODE": "Code",
"VALUE": "Value", "VALUE": "Value",
"RESPONSE-PATH": "Response Path", "RESPONSE-PATH": "Response Path",
"FIELD": "Field",
"DATA-TYPE": "Data Type", "DATA-TYPE": "Data Type",
"KEY": "Key", "KEY": "Key",
"LABEL": "Label", "LABEL": "Label",
@ -1129,7 +1130,7 @@
"DEPENDENCIES": "Dependencies", "DEPENDENCIES": "Dependencies",
"DEPENDENCY": "Dependency", "DEPENDENCY": "Dependency",
"DEFAULT-VALUE": "Default Value", "DEFAULT-VALUE": "Default Value",
"CASE": "Case", "CASES": "Cases",
"LIKE-PATTERN": "Condition", "LIKE-PATTERN": "Condition",
"SOURCE-KEY": "Source Key" "SOURCE-KEY": "Source Key"
}, },
@ -1145,7 +1146,7 @@
"REMOVE-QUERY": "Remove Query", "REMOVE-QUERY": "Remove Query",
"ADD-CASE": "Add Case", "ADD-CASE": "Add Case",
"REMOVE-CASE": "Remove Case", "REMOVE-CASE": "Remove Case",
"SUBMIT-FIELDS": "Submit" "SUBMIT-FIELDS": "Update Fields"
}, },
"CONFIRM-DELETE-DIALOG": {} "CONFIRM-DELETE-DIALOG": {}
}, },
@ -1206,14 +1207,12 @@
"FIELDS": { "FIELDS": {
"LABEL": "Label", "LABEL": "Label",
"TYPE": "Type", "TYPE": "Type",
"DESCRIPTION": "Description",
"DESCRIPTION-PLACEHOLDER": "Reference description", "DESCRIPTION-PLACEHOLDER": "Reference description",
"REFERENCE": "reference", "REFERENCE": "Reference",
"ABBREVIATION": "abbreviation", "ABBREVIATION": "Abbreviation",
"SOURCE": "source", "SOURCE": "Source",
"SOURCE-TYPE": "Source Type", "SOURCE-TYPE": "Source Type",
"FIELDS": "Fields", "FIELDS": "Fields",
"FIELD": "Field",
"CODE": "Code", "CODE": "Code",
"DATA-TYPE": "Data Type", "DATA-TYPE": "Data Type",
"VALUE": "Value" "VALUE": "Value"