501 lines
26 KiB
HTML
501 lines
26 KiB
HTML
<div class="row description-template-type-editor">
|
|
<div class="col-md-8 offset-md-2 colums-gapped">
|
|
|
|
<div class="row justify-content-between align-items-center">
|
|
<div class="col">
|
|
<h3 *ngIf="isNew">{{'REFERENCE-TYPE-EDITOR.NEW' | translate}}</h3>
|
|
<app-navigation-breadcrumb />
|
|
</div>
|
|
|
|
<div class="col-auto">
|
|
<button mat-button class="action-btn" (click)="cancel()" type="button">{{'REFERENCE-TYPE-EDITOR.ACTIONS.CANCEL' | translate}}</button>
|
|
</div>
|
|
<div class="col-auto" *ngIf="canDelete">
|
|
<button mat-button (click)="delete()" class="action-btn" type="button">
|
|
<mat-icon>delete</mat-icon>
|
|
{{'REFERENCE-TYPE-EDITOR.ACTIONS.DELETE' | translate}}
|
|
</button>
|
|
</div>
|
|
<!-- <div class="col-auto" *ngIf="canFinalize">
|
|
<button mat-button class="action-btn" (click)="finalize(); formSubmit()">
|
|
<mat-icon>save</mat-icon>
|
|
{{'DESCRIPTION-TEMPLATE-TYPE-EDITOR.ACTIONS.FINALIZE' | translate}}
|
|
</button>
|
|
</div> -->
|
|
<div class="col-auto" *ngIf="canSave">
|
|
<button mat-button class="action-btn" (click)="formSubmit()">
|
|
<mat-icon>save</mat-icon>
|
|
{{'REFERENCE-TYPE-EDITOR.ACTIONS.SAVE' | translate}}
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<mat-card appearance="outlined">
|
|
<mat-card-header>
|
|
<mat-card-title *ngIf="isNew">{{'REFERENCE-TYPE-EDITOR.NEW' | translate}}</mat-card-title>
|
|
</mat-card-header>
|
|
<mat-card-content>
|
|
<form (ngSubmit)="formSubmit()" [formGroup]="formGroup" *ngIf="formGroup">
|
|
<div class="info-grid">
|
|
<div class="info-grid-value">
|
|
<mat-form-field class="col-lg-6">
|
|
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.NAME' | translate}}</mat-label>
|
|
<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('required')">
|
|
{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="info-grid-value">
|
|
<mat-form-field class="col-lg-6">
|
|
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.CODE' | translate}}</mat-label>
|
|
<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('required')">
|
|
{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</mat-card-content>
|
|
</mat-card>
|
|
|
|
|
|
<mat-card appearance="outlined">
|
|
<mat-card-header>
|
|
<mat-card-title *ngIf="isNew">Reference Type Fields</mat-card-title>
|
|
<button mat-button class="action-btn" type="button" (click)="addField()" [disabled]="formGroup.disabled">{{'REFERENCE-TYPE-EDITOR.ACTIONS.ADD-FIELD' | translate}}</button>
|
|
<!-- <mat-card-title *ngIf="!isNew">{{formGroup.get('name').value}}</mat-card-title> -->
|
|
</mat-card-header>
|
|
<mat-card-content>
|
|
<form (ngSubmit)="formSubmit()" [formGroup]="formGroup" *ngIf="formGroup">
|
|
|
|
<!-- FIELDS -->
|
|
<div class="col-12" cdkDropList (cdkDropListDropped)="dropFields($event)">
|
|
<div *ngFor="let field of formGroup.get('definition').get('fields').controls; let fieldIndex=index;" class="row mb-3" cdkDrag [cdkDragDisabled]="formGroup.disabled">
|
|
<div class="col-12">
|
|
<mat-card-header>
|
|
<div class="row mb-3 d-flex align-items-center">
|
|
<div class="col-auto d-flex">
|
|
<mat-card-title>{{'REFERENCE-TYPE-EDITOR.FIELDS.FIELD' | translate}} {{fieldIndex + 1}}</mat-card-title>
|
|
</div>
|
|
|
|
<div class="col-auto d-flex">
|
|
<button mat-icon-button class="action-list-icon" matTooltip="remove field" (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-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.LABEL' | translate}}</mat-label>
|
|
<input matInput type="text" name="label" [formControl]="field.get('label')" required>
|
|
<mat-error *ngIf="field.get('label').hasError('required')">
|
|
{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="col-6">
|
|
<mat-form-field class="w-100">
|
|
<mat-label>Description</mat-label>
|
|
<input matInput type="text" name="description" [formControl]="field.get('description')">
|
|
<mat-error *ngIf="field.get('description').hasError('required')">
|
|
{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="col-6">
|
|
<mat-form-field class="w-100">
|
|
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.CODE' | translate}}</mat-label>
|
|
<input matInput type="text" name="code" [formControl]="field.get('code')" required>
|
|
<mat-error *ngIf="field.get('code').hasError('required')">
|
|
{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="col-6">
|
|
<mat-form-field class="w-100">
|
|
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.DATA-TYPE' | translate}}</mat-label>
|
|
<mat-select name="dataType" [formControl]="field.get('dataType')">
|
|
<mat-option *ngFor="let dataType of visibleDataTypes" [value] = "dataType.type">
|
|
{{dataType.name}}
|
|
</mat-option>
|
|
</mat-select>
|
|
<mat-error *ngIf="field.get('dataType').hasError('required')">
|
|
{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
|
|
</div>
|
|
</mat-card-content>
|
|
</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">Submit</button>
|
|
</div>
|
|
</form>
|
|
</mat-card-content>
|
|
</mat-card>
|
|
|
|
<mat-card appearance="outlined">
|
|
<mat-card-header>
|
|
<mat-card-title *ngIf="isNew">Reference Type Source</mat-card-title>
|
|
<mat-card-header>
|
|
<button mat-button class="action-btn" type="button" (click)="addSource()" [disabled]="formGroup.disabled">{{'REFERENCE-TYPE-EDITOR.ACTIONS.ADD-CONFIG' | translate}}</button>
|
|
</mat-card-header>
|
|
</mat-card-header>
|
|
<mat-card-content>
|
|
<form (ngSubmit)="formSubmit()" [formGroup]="formGroup" *ngIf="formGroup">
|
|
<!-- Source Config Info -->
|
|
<div class="col-12">
|
|
<div *ngFor="let source of formGroup.get('definition').get('sources').controls; let sourceIndex=index;" class="row mb-3" cdkDrag [cdkDragDisabled]="formGroup.disabled">
|
|
<div class="col-12">
|
|
<mat-card-content>
|
|
<div class="row mb-3 d-flex align-items-center">
|
|
<div class="col-auto d-flex">
|
|
<mat-card-title>{{'REFERENCE-TYPE-EDITOR.FIELDS.SOURCE-CONFIGURATION' | translate}} {{sourceIndex + 1}}</mat-card-title>
|
|
</div>
|
|
<div class="col-auto d-flex">
|
|
<button mat-icon-button class="action-list-icon" matTooltip="remove Source Configiguration" (click)="removeSource(sourceIndex)" [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-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.KEY' | translate}}</mat-label>
|
|
<input matInput type="text" name="key" [formControl]="source.get('key')" required>
|
|
<mat-error *ngIf="source.get('key').hasError('required')">
|
|
{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="col-6">
|
|
<mat-form-field class="w-100">
|
|
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.LABEL' | translate}}</mat-label>
|
|
<input matInput type="text" name="label" [formControl]="source.get('label')" required>
|
|
<mat-error *ngIf="source.get('label').hasError('required')">
|
|
{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="col-6">
|
|
<mat-form-field class="w-100">
|
|
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.ORDINAL' | translate}}</mat-label>
|
|
<input matInput type="text" name="ordinal" [formControl]="source.get('ordinal')" required>
|
|
<mat-error *ngIf="source.get('ordinal').hasError('required')">
|
|
{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="col-6">
|
|
<mat-form-field class="w-100">
|
|
<mat-label>Source Type</mat-label>
|
|
<mat-select name="type" [formControl]="source.get('type')" required>
|
|
<mat-option *ngFor="let vis of visibleSourceTypes" [value] = "vis.type">
|
|
{{vis.name}}
|
|
</mat-option>
|
|
</mat-select>
|
|
<mat-error *ngIf="source.get('type').hasError('required')">
|
|
{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
|
|
<div class="row" *ngIf="source.get('type').value == 0">
|
|
<div class="col-6">
|
|
<mat-form-field class="w-100">
|
|
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.URL' | translate}}</mat-label>
|
|
<input matInput type="text" name="ordinal" [formControl]="source.get('url')">
|
|
<mat-error *ngIf="source.get('url').hasError('required')">
|
|
{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="col-6">
|
|
<mat-form-field class="w-100">
|
|
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.PAGINATION-PATH' | translate}}</mat-label>
|
|
<input matInput type="text" name="paginationPath" [formControl]="source.get('paginationPath')">
|
|
<mat-error *ngIf="source.get('paginationPath').hasError('required')">
|
|
{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="col-6">
|
|
<mat-form-field class="w-100">
|
|
<mat-label>Content Type</mat-label>
|
|
<input matInput type="text" name="contentType" [formControl]="source.get('contentType')">
|
|
<mat-error *ngIf="source.get('contentType').hasError('required')">
|
|
{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="col-6">
|
|
<mat-form-field class="w-100">
|
|
<mat-label>First Page</mat-label>
|
|
<input matInput type="text" name="firstPage" [formControl]="source.get('firstPage')">
|
|
<mat-error *ngIf="source.get('firstPage').hasError('required')">
|
|
{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="col-6">
|
|
<mat-form-field class="w-100">
|
|
<mat-label>HTTP Method</mat-label>
|
|
<mat-select name="httpMethod" [formControl]="source.get('httpMethod')">
|
|
<mat-option *ngFor="let vis of visibleHTTPMethodTypes" [value] = "vis.type">
|
|
{{vis.name}}
|
|
</mat-option>
|
|
</mat-select>
|
|
<mat-error *ngIf="source.get('httpMethod').hasError('required')">
|
|
{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="col-6">
|
|
<mat-form-field *ngIf="source.get('httpMethod').value == 1" class="w-100">
|
|
<mat-label>Request Body</mat-label>
|
|
<input matInput type="text" name="requestBody" [formControl]="source.get('requestBody')">
|
|
<mat-error *ngIf="source.get('requestBody').hasError('required')">
|
|
{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="col-6">
|
|
<mat-form-field class="w-100">
|
|
<mat-label>Filter Type</mat-label>
|
|
<input matInput type="text" name="filterType" [formControl]="source.get('filterType')">
|
|
<mat-error *ngIf="source.get('filterType').hasError('required')">
|
|
{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
<!-- Results info -->
|
|
<h3 class="col-12">{{'REFERENCE-TYPE-EDITOR.FIELDS.RESULTS' | translate}}</h3>
|
|
<div class="col-6">
|
|
<mat-form-field class="w-100">
|
|
<mat-label>Results Path</mat-label>
|
|
<input matInput type="text" name="resultsArrayPath" [formControl]="source.get('results').get('resultsArrayPath')">
|
|
<mat-error *ngIf="source.get('results').get('resultsArrayPath').hasError('required')">
|
|
{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
<!-- fields mapping -->
|
|
<div class="col-12">
|
|
<div *ngFor="let field of source.get('results').get('fieldsMapping').controls; let fieldMappingIndex=index;" class="row mb-3" cdkDrag [cdkDragDisabled]="formGroup.disabled">
|
|
<div class="col-12">
|
|
<mat-card-header>
|
|
<div class="row mb-3 d-flex align-items-center">
|
|
<div class="col-auto d-flex">
|
|
<h4 class="col-12">{{'REFERENCE-TYPE-EDITOR.FIELDS.FIELD-MAPPING' | translate}} {{fieldMappingIndex + 1}}</h4>
|
|
</div>
|
|
</div>
|
|
</mat-card-header>
|
|
<mat-card-content>
|
|
<div class="row" *ngIf="fieldMappingIndex < systemFieldsMapping.length">
|
|
<div class="col-6">
|
|
<mat-form-field class="w-100">
|
|
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.CODE' | translate}}</mat-label>
|
|
<input matInput type="text" [readonly]="true" name="code" [formControl]="field.get('code')"[ngModel]="systemFieldsMapping[fieldMappingIndex]">
|
|
<mat-error *ngIf="field.get('code').hasError('required')">
|
|
{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="col-6">
|
|
<mat-form-field class="w-100">
|
|
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.RESPONSE-PATH' | translate}}</mat-label>
|
|
<input matInput type="text" name="responsePath" [formControl]="field.get('responsePath')">
|
|
<mat-error *ngIf="field.get('responsePath').hasError('required')">
|
|
{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
</div>
|
|
<div class="row" *ngIf="fieldMappingIndex >= systemFieldsMapping.length">
|
|
<div class="col-6">
|
|
<mat-form-field class="w-100">
|
|
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.CODE' | translate}}</mat-label>
|
|
<input matInput type="text" [readonly]="true" name="code" [formControl]="field.get('code')" [ngModel]="formGroup.get('definition').get('fields').value[fieldMappingIndex - systemFieldsMapping.length].code">
|
|
<mat-error *ngIf="field.get('code').hasError('required')">
|
|
{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="col-6">
|
|
<mat-form-field class="w-100">
|
|
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.RESPONSE-PATH' | translate}}</mat-label>
|
|
<input matInput type="text" name="responsePath" [formControl]="field.get('responsePath')">
|
|
<mat-error *ngIf="field.get('responsePath').hasError('required')">
|
|
{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
</div>
|
|
</mat-card-content>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- Auth info -->
|
|
<h3 class="col-12">{{'REFERENCE-TYPE-EDITOR.FIELDS.AUTHENTICATION' | translate}}</h3>
|
|
<div class="col-6">
|
|
<mat-form-field class="w-100">
|
|
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.URL' | translate}}</mat-label>
|
|
<input matInput type="text" name="authUrl" [formControl]="source.get('auth').get('authUrl')">
|
|
<mat-error *ngIf="source.get('auth').get('authUrl').hasError('required')">
|
|
{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="col-6">
|
|
<mat-form-field class="w-100">
|
|
<mat-label>Method</mat-label>
|
|
<mat-select name="httpMethod" [formControl]="source.get('auth').get('authMethod')">
|
|
<mat-option *ngFor="let vis of visibleHTTPMethodTypes" [value] = "vis.type">
|
|
{{vis.name}}
|
|
</mat-option>
|
|
</mat-select>
|
|
<mat-error *ngIf="source.get('auth').get('authMethod').hasError('required')">
|
|
{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="col-6">
|
|
<mat-form-field class="w-100">
|
|
<mat-label>Token Path</mat-label>
|
|
<input matInput type="text" name="authTokenPath" [formControl]="source.get('auth').get('authTokenPath')">
|
|
<mat-error *ngIf="source.get('auth').get('authTokenPath').hasError('required')">
|
|
{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="col-6">
|
|
<mat-form-field class="w-100">
|
|
<mat-label>Request Body</mat-label>
|
|
<input matInput type="text" name="authRequestBody" [formControl]="source.get('auth').get('authRequestBody')">
|
|
<mat-error *ngIf="source.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-label>Type</mat-label>
|
|
<input matInput type="text" name="type" [formControl]="source.get('auth').get('type')">
|
|
<mat-error *ngIf="source.get('auth').get('type').hasError('required')">
|
|
{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
<!-- Queries info -->
|
|
<h3 class="col-12">{{'REFERENCE-TYPE-EDITOR.FIELDS.QUERIES' | translate}}
|
|
<button mat-button type="button" (click)="addQuery(sourceIndex)" [disabled]="formGroup.disabled">{{'REFERENCE-TYPE-EDITOR.ACTIONS.ADD-QUERY' | translate}}</button>
|
|
</h3>
|
|
<div class="col-12" cdkDropList (cdkDropListDropped)="dropQueries($event)">
|
|
<div *ngFor="let query of source.get('queries').controls; let queryIndex=index;" class="row mb-3" cdkDrag [cdkDragDisabled]="formGroup.disabled">
|
|
<div class="col-12">
|
|
<mat-card-header>
|
|
<div class="row mb-3 d-flex align-items-center">
|
|
<div class="col-auto d-flex">
|
|
<h4 class="col-12">{{'REFERENCE-TYPE-EDITOR.FIELDS.QUERY' | translate}} {{queryIndex + 1}}</h4>
|
|
</div>
|
|
<div class="col-auto d-flex">
|
|
<button mat-icon-button class="action-list-icon" matTooltip="remove query" (click)="removeQuery(queryIndex, fieldMappingIndex)" [disabled]="formGroup.disabled">
|
|
<mat-icon>delete</mat-icon>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</mat-card-header>
|
|
<mat-card-content>
|
|
<div class="col-6">
|
|
<mat-form-field class="w-100">
|
|
<mat-label>Condition</mat-label>
|
|
<input matInput type="text" name="condition" [formControl]="query.get('condition')" required>
|
|
<mat-error *ngIf="query.get('condition').hasError('required')">
|
|
{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="col-6">
|
|
<mat-form-field class="w-100">
|
|
<mat-label>Separator</mat-label>
|
|
<input matInput type="text" name="separator" [formControl]="query.get('separator')" required>
|
|
<mat-error *ngIf="query.get('separator').hasError('required')">
|
|
{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="col-6">
|
|
<mat-form-field class="w-100">
|
|
<mat-label>Value</mat-label>
|
|
<input matInput type="text" name="value" [formControl]="query.get('value')" required>
|
|
<mat-error *ngIf="query.get('value').hasError('required')">
|
|
{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="col-6">
|
|
<mat-form-field class="w-100">
|
|
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.ORDINAL' | translate}}</mat-label>
|
|
<input matInput type="text" name="value" [formControl]="query.get('ordinal')" required>
|
|
<mat-error *ngIf="query.get('ordinal').hasError('required')">
|
|
{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
</mat-card-content>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- Options -->
|
|
<div class="row" *ngIf="source.get('type').value == 1">
|
|
<div class="col-12">
|
|
<h3 class="col-12">{{'REFERENCE-TYPE-EDITOR.FIELDS.OPTIONS' | translate}}</h3>
|
|
<div *ngFor="let option of source.get('options').controls; let optionsIndex=index;" class="row mb-3" cdkDrag [cdkDragDisabled]="formGroup.disabled">
|
|
<div class="col-12">
|
|
<mat-card-header>
|
|
<div class="row mb-3 d-flex align-items-center">
|
|
<div class="col-auto d-flex">
|
|
<h4 class="col-12">{{'REFERENCE-TYPE-EDITOR.FIELDS.OPTION' | translate}} {{optionsIndex + 1}}</h4>
|
|
</div>
|
|
</div>
|
|
</mat-card-header>
|
|
<mat-card-content>
|
|
<div class="row" *ngIf="optionsIndex < systemFieldsMapping.length">
|
|
<div class="col-6">
|
|
<mat-form-field class="w-100">
|
|
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.CODE' | translate}}</mat-label>
|
|
<input matInput type="text" [readonly]="true" name="code" [formControl]="option.get('code')"[ngModel]="systemFieldsMapping[optionsIndex]">
|
|
<mat-error *ngIf="option.get('code').hasError('required')">
|
|
{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="col-6">
|
|
<mat-form-field class="w-100">
|
|
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.VALUE' | translate}}</mat-label>
|
|
<input matInput type="text" name="value" [formControl]="option.get('value')">
|
|
<mat-error *ngIf="option.get('value').hasError('required')">
|
|
{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
</div>
|
|
<div class="row" *ngIf="optionsIndex >= systemFieldsMapping.length">
|
|
<div class="col-6">
|
|
<mat-form-field class="w-100">
|
|
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.CODE' | translate}}</mat-label>
|
|
<input matInput type="text" [readonly]="true" name="code" [formControl]="option.get('code')" [ngModel]="formGroup.get('definition').get('fields').value[optionsIndex - systemFieldsMapping.length].code">
|
|
<mat-error *ngIf="option.get('code').hasError('required')">
|
|
{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="col-6">
|
|
<mat-form-field class="w-100">
|
|
<mat-label>{{'REFERENCE-TYPE-EDITOR.FIELDS.VALUE' | translate}}</mat-label>
|
|
<input matInput type="text" name="value" [formControl]="option.get('value')">
|
|
<mat-error *ngIf="option.get('value').hasError('required')">
|
|
{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
</div>
|
|
</mat-card-content>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
</div>
|
|
</mat-card-content>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</mat-card-content>
|
|
</mat-card>
|
|
|
|
</div>
|
|
</div>
|
|
|