69 lines
4.2 KiB
HTML
69 lines
4.2 KiB
HTML
<div class="dmp-profile-editor">
|
|
<form *ngIf="formGroup" (ngSubmit)="formSubmit()" [formGroup]="formGroup">
|
|
<mat-card>
|
|
<mat-card-header>
|
|
<mat-card-title *ngIf="isNew">
|
|
<h4>{{'DMP-PROFILE-EDITOR.TITLE.NEW' | translate}}</h4>
|
|
</mat-card-title>
|
|
<mat-card-title *ngIf="!isNew">
|
|
<h4>{{formGroup.get('label').value}}</h4>
|
|
</mat-card-title>
|
|
</mat-card-header>
|
|
<mat-card-content>
|
|
<div class="row">
|
|
<mat-form-field class="col-12">
|
|
<input matInput placeholder="{{'DMP-PROFILE-EDITOR.FIELDS.LABEL' | translate}}" type="text" name="label" formControlName="label" required>
|
|
<mat-error *ngIf="formGroup.get('label').hasError('backendError')">{{formGroup.get('label').getError('backendError').message}}</mat-error>
|
|
<mat-error *ngIf="formGroup.get('label').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
|
|
<h4 class="col-12">{{'DMP-PROFILE-EDITOR.FIELDS.TITLE' | translate}}</h4>
|
|
<div class="col-12">
|
|
<div class="row" *ngFor="let fieldFormGroup of formGroup.get('definition').get('fields')['controls'];let i=index">
|
|
<mat-form-field class="col">
|
|
<input matInput placeholder="{{'DMP-PROFILE-EDITOR.FIELDS.LABEL' | translate}}" type="text" name="label" [formControl]="fieldFormGroup.get('label')" required>
|
|
<mat-error *ngIf="fieldFormGroup.get('label').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
<mat-error *ngIf="fieldFormGroup.get('label').hasError('backendError')">{{fieldFormGroup.get('label').getError('backendError').message}}</mat-error>
|
|
</mat-form-field>
|
|
<mat-form-field class="col">
|
|
<mat-select placeholder="{{'DMP-PROFILE-EDITOR.FIELDS.TYPE' | translate}}" [formControl]="fieldFormGroup.get('type')" required>
|
|
<mat-option *ngFor="let fieldType of getDMPProfileFieldTypeValues()" [value]="fieldType">{{
|
|
getDMPProfileFieldTypeWithLanguage(fieldType) | translate}}</mat-option>
|
|
</mat-select>
|
|
<mat-error *ngIf="fieldFormGroup.get('type').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
<mat-error *ngIf="fieldFormGroup.get('type').hasError('backendError')">{{fieldFormGroup.get('type').getError('backendError').message}}</mat-error>
|
|
</mat-form-field>
|
|
<mat-form-field class="col">
|
|
<mat-select placeholder="{{'DMP-PROFILE-EDITOR.FIELDS.DATATYPE' | translate}}" [formControl]="fieldFormGroup.get('dataType')" required>
|
|
<mat-option *ngFor="let fieldDataType of getDMPProfileFieldDataTypeValues()" [value]="fieldDataType">{{
|
|
getDMPProfileFieldDataTypeWithLanguage(fieldDataType) | translate}}</mat-option>
|
|
</mat-select>
|
|
<mat-error *ngIf="fieldFormGroup.get('dataType').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
<mat-error *ngIf="fieldFormGroup.get('dataType').hasError('backendError')">{{fieldFormGroup.get('dataType').getError('backendError').message}}</mat-error>
|
|
</mat-form-field>
|
|
<div class="centered-row-item col-auto">
|
|
<mat-checkbox [formControl]="fieldFormGroup.get('required')">{{'DMP-PROFILE-EDITOR.FIELDS.REQUIRED' | translate}}</mat-checkbox>
|
|
</div>
|
|
<div class="centered-row-item col-auto"><button mat-icon-button color="primary" type="button" (click)="removeField(i)">
|
|
<mat-icon class="mat-24">delete</mat-icon>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<button mat-icon-button class="col-auto" color="primary" type="button" (click)="addField()">
|
|
<mat-icon class="mat-24">add</mat-icon>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<div class="col-12">
|
|
<div class="row">
|
|
<div class="col"></div>
|
|
<div class="col-auto" *ngIf="!isNew"><button mat-raised-button color="primary" type="button" (click)="delete()">{{'DMP-PROFILE-EDITOR.ACTIONS.DELETE' | translate}}</button></div>
|
|
<div class="col-auto"><button mat-raised-button color="primary" (click)="cancel()" type="button">{{'DMP-PROFILE-EDITOR.ACTIONS.CANCEL' | translate}}</button></div>
|
|
<div class="col-auto"><button mat-raised-button color="primary" type="submit">{{'DMP-PROFILE-EDITOR.ACTIONS.SAVE' | translate}}</button></div>
|
|
</div>
|
|
</div>
|
|
</mat-card-content>
|
|
</mat-card>
|
|
</form>
|
|
</div>
|