ui changes
This commit is contained in:
parent
ba33b29e41
commit
11911bd16e
|
@ -52,3 +52,5 @@ openDMP/dmp-backend/tmp/
|
||||||
logs/
|
logs/
|
||||||
dmp-backend/web/src/main/resources/certificates/
|
dmp-backend/web/src/main/resources/certificates/
|
||||||
/storage/
|
/storage/
|
||||||
|
dmp-backend/target/classes/
|
||||||
|
dmp-backend/core/target/maven-archiver/
|
||||||
|
|
|
@ -113,88 +113,97 @@
|
||||||
<mat-icon *ngIf="isSectionSelected(fieldIndex)" [ngClass]="{'drag-handle-disabled': formGroup.disabled}" cdkDragHandle class="drag-handle">drag_indicator</mat-icon>
|
<mat-icon *ngIf="isSectionSelected(fieldIndex)" [ngClass]="{'drag-handle-disabled': formGroup.disabled}" cdkDragHandle class="drag-handle">drag_indicator</mat-icon>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-auto section-field">
|
<div class="col">
|
||||||
<mat-form-field class="mt-3 w-100">
|
<div class="row">
|
||||||
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.CATEGORY' | translate}}</mat-label>
|
|
||||||
<mat-select [formControl]="field.get('category')" [disabled]="field.disabled" (selectionChange)="fieldCategoryChanged(sectionIndex, fieldIndex)">
|
<div class="col-4 section-field">
|
||||||
<mat-option *ngFor="let fieldCategory of dmpBlueprintFieldCategoryEnum" [value]="fieldCategory">{{enumUtils.toDmpBlueprintFieldCategoryString(fieldCategory)}}</mat-option>
|
<mat-form-field class="mt-3 w-100">
|
||||||
</mat-select>
|
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.CATEGORY' | translate}}</mat-label>
|
||||||
<mat-error *ngIf="field.get('category').hasError('backendError')">{{field.get('category').getError('backendError').message}}</mat-error>
|
<mat-select [formControl]="field.get('category')" [disabled]="field.disabled" (selectionChange)="fieldCategoryChanged(sectionIndex, fieldIndex)">
|
||||||
<mat-error *ngIf="field.get('category').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
<mat-option *ngFor="let fieldCategory of dmpBlueprintFieldCategoryEnum" [value]="fieldCategory">{{enumUtils.toDmpBlueprintFieldCategoryString(fieldCategory)}}</mat-option>
|
||||||
</mat-form-field>
|
</mat-select>
|
||||||
|
<mat-error *ngIf="field.get('category').hasError('backendError')">{{field.get('category').getError('backendError').message}}</mat-error>
|
||||||
|
<mat-error *ngIf="field.get('category').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||||
|
</mat-form-field>
|
||||||
|
</div>
|
||||||
|
<div class="col-4 section-field" *ngIf="field.get('category').value === dmpBlueprintSectionFieldCategory.System">
|
||||||
|
<mat-form-field class="mt-3 w-100">
|
||||||
|
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.SYSTEM-FIELD-TYPE' | translate}}</mat-label>
|
||||||
|
<mat-select [formControl]="field.get('systemFieldType')" [disabled]="field.disabled">
|
||||||
|
<mat-option *ngFor="let systemFieldType of dmpBlueprintSystemFieldTypeEnum" [disabled]="systemFieldDisabled(systemFieldType)" [value]="systemFieldType">{{enumUtils.toDmpBlueprintSystemFieldTypeString(systemFieldType)}}</mat-option>
|
||||||
|
</mat-select>
|
||||||
|
<mat-error *ngIf="field.get('systemFieldType').hasError('backendError')">{{field.get('systemFieldType').getError('backendError').message}}</mat-error>
|
||||||
|
<mat-error *ngIf="field.get('systemFieldType').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||||
|
</mat-form-field>
|
||||||
|
</div>
|
||||||
|
<div class="col-4 section-field" *ngIf="field.get('category').value === dmpBlueprintSectionFieldCategory.Extra">
|
||||||
|
<mat-form-field class="mt-3 w-100">
|
||||||
|
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.DATA-TYPE' | translate}}</mat-label>
|
||||||
|
<mat-select [formControl]="field.get('dataType')">
|
||||||
|
<mat-option *ngFor="let extraFieldDataType of dmpBlueprintExtraFieldDataTypeEnum" [value]="extraFieldDataType">
|
||||||
|
{{enumUtils.toDmpBlueprintExtraFieldDataTypeString(extraFieldDataType)}}
|
||||||
|
</mat-option>
|
||||||
|
</mat-select>
|
||||||
|
<mat-error *ngIf="field.get('dataType').hasError('backendError')">{{field.get('dataType').getError('backendError').message}}</mat-error>
|
||||||
|
<mat-error *ngIf="field.get('dataType').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||||
|
</mat-form-field>
|
||||||
|
</div>
|
||||||
|
<div class="col-4 section-field" *ngIf="field.get('category').value === dmpBlueprintSectionFieldCategory.ReferenceType">
|
||||||
|
<mat-form-field class="mt-3 w-100">
|
||||||
|
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.REFERENCE-TYPE' | translate}}</mat-label>
|
||||||
|
<app-single-auto-complete placeholder="{{'DMP-BLUEPRINT-EDITOR.FIELDS.REFERENCE-TYPE' | translate}}" [required]="true" [formControl]="field.get('referenceTypeId')" [configuration]="referenceTypeService.singleAutocompleteConfiguration"></app-single-auto-complete>
|
||||||
|
<mat-error *ngIf="field.get('referenceTypeId').hasError('backendError')">{{field.get('referenceTypeId').getError('backendError').message}}</mat-error>
|
||||||
|
<mat-error *ngIf="field.get('referenceTypeId').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||||
|
</mat-form-field>
|
||||||
|
</div>
|
||||||
|
<div class="col-4 section-field" *ngIf="field.get('category').value != null">
|
||||||
|
<mat-form-field class="mt-3 w-100">
|
||||||
|
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.FIELD-LABEL' | translate}}</mat-label>
|
||||||
|
<input matInput type="text" name="label" [formControl]="field.get('label')">
|
||||||
|
<mat-error *ngIf="field.get('label').hasError('backendError')">{{field.get('label').getError('backendError').message}}</mat-error>
|
||||||
|
<mat-error *ngIf="field.get('label').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||||
|
</mat-form-field>
|
||||||
|
</div>
|
||||||
|
<div class="col-4 section-field" *ngIf="field.get('category').value != null">
|
||||||
|
<mat-form-field class="mt-3 w-100">
|
||||||
|
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.FIELD-PLACEHOLDER' | translate}}</mat-label>
|
||||||
|
<input matInput type="text" name="placeholder" [formControl]="field.get('placeholder')">
|
||||||
|
<mat-error *ngIf="field.get('placeholder').hasError('backendError')">{{field.get('placeholder').getError('backendError').message}}</mat-error>
|
||||||
|
<mat-error *ngIf="field.get('placeholder').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||||
|
</mat-form-field>
|
||||||
|
</div>
|
||||||
|
<div class="col-4 auto section-field" *ngIf="field.get('category').value != null">
|
||||||
|
<mat-form-field class="mt-3 w-100">
|
||||||
|
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.FIELD-DESCRIPTION' | translate}}</mat-label>
|
||||||
|
<input matInput type="text" name="description" [formControl]="field.get('description')">
|
||||||
|
<mat-error *ngIf="field.get('description').hasError('backendError')">{{field.get('description').getError('backendError').message}}</mat-error>
|
||||||
|
<mat-error *ngIf="field.get('description').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||||
|
</mat-form-field>
|
||||||
|
</div>
|
||||||
|
<div class="col-4 section-field" *ngIf="field.get('category').value != null">
|
||||||
|
<mat-form-field class="mt-3 w-100">
|
||||||
|
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.SEMANTICS' | translate}}</mat-label>
|
||||||
|
<app-multiple-auto-complete placeholder="{{'DMP-BLUEPRINT-EDITOR.FIELDS.SEMANTICS' | translate}}" [hidePlaceholder]="true" [required]="false" [separatorKeysCodes]="separatorKeysCodes" [formControl]="field.get('semantics')" [configuration]="semanticsService.multipleAutocompleteConfiguration">
|
||||||
|
</app-multiple-auto-complete>
|
||||||
|
<mat-error *ngIf="field.get('semantics').hasError('backendError')">{{field.get('semantics').getError('backendError').message}}</mat-error>
|
||||||
|
<mat-error *ngIf="field.get('semantics').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||||
|
</mat-form-field>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-auto section-field" *ngIf="field.get('category').value === dmpBlueprintSectionFieldCategory.System">
|
<div class="col-auto">
|
||||||
<mat-form-field class="mt-3 w-100">
|
<div class="row">
|
||||||
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.SYSTEM-FIELD-TYPE' | translate}}</mat-label>
|
<div class="col-auto section-field" *ngIf="field.get('category').value != null">
|
||||||
<mat-select [formControl]="field.get('systemFieldType')" [disabled]="field.disabled">
|
<mat-checkbox [disabled]="field.get('systemFieldType')?.value === dmpBlueprintSystemFieldType.Title || field.get('systemFieldType')?.value === dmpBlueprintSystemFieldType.Description" [formControl]="field.get('required')"><span>{{'DMP-BLUEPRINT-EDITOR.FIELDS.FIELD-REQUIRED' | translate}}</span></mat-checkbox>
|
||||||
<mat-option *ngFor="let systemFieldType of dmpBlueprintSystemFieldTypeEnum" [disabled]="systemFieldDisabled(systemFieldType)" [value]="systemFieldType">{{enumUtils.toDmpBlueprintSystemFieldTypeString(systemFieldType)}}</mat-option>
|
<mat-error *ngIf="field.get('required').hasError('backendError')">{{field.get('required').getError('backendError').message}}</mat-error>
|
||||||
</mat-select>
|
<mat-error *ngIf="field.get('required').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||||
<mat-error *ngIf="field.get('systemFieldType').hasError('backendError')">{{field.get('systemFieldType').getError('backendError').message}}</mat-error>
|
</div>
|
||||||
<mat-error *ngIf="field.get('systemFieldType').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
<div [hidden]="viewOnly" class="col-auto section-field section-options-horizontal">
|
||||||
</mat-form-field>
|
<button mat-icon-button matTooltip="{{'DMP-BLUEPRINT-EDITOR.ACTIONS.REMOVE-FIELD' | translate}}" (click)="removeField(sectionIndex, fieldIndex)" [disabled]="formGroup.disabled">
|
||||||
</div>
|
<mat-icon>delete</mat-icon>
|
||||||
<div class="col-auto section-field" *ngIf="field.get('category').value === dmpBlueprintSectionFieldCategory.Extra">
|
</button>
|
||||||
<mat-form-field class="mt-3 w-100">
|
</div>
|
||||||
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.DATA-TYPE' | translate}}</mat-label>
|
</div>
|
||||||
<mat-select [formControl]="field.get('dataType')">
|
|
||||||
<mat-option *ngFor="let extraFieldDataType of dmpBlueprintExtraFieldDataTypeEnum" [value]="extraFieldDataType">
|
|
||||||
{{enumUtils.toDmpBlueprintExtraFieldDataTypeString(extraFieldDataType)}}
|
|
||||||
</mat-option>
|
|
||||||
</mat-select>
|
|
||||||
<mat-error *ngIf="field.get('dataType').hasError('backendError')">{{field.get('dataType').getError('backendError').message}}</mat-error>
|
|
||||||
<mat-error *ngIf="field.get('dataType').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
||||||
</mat-form-field>
|
|
||||||
</div>
|
|
||||||
<div class="col-auto section-field" *ngIf="field.get('category').value === dmpBlueprintSectionFieldCategory.ReferenceType">
|
|
||||||
<mat-form-field class="mt-3 w-100">
|
|
||||||
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.REFERENCE-TYPE' | translate}}</mat-label>
|
|
||||||
<app-single-auto-complete placeholder="{{'DMP-BLUEPRINT-EDITOR.FIELDS.REFERENCE-TYPE' | translate}}" [required]="true" [formControl]="field.get('referenceTypeId')" [configuration]="referenceTypeService.singleAutocompleteConfiguration"></app-single-auto-complete>
|
|
||||||
<mat-error *ngIf="field.get('referenceTypeId').hasError('backendError')">{{field.get('referenceTypeId').getError('backendError').message}}</mat-error>
|
|
||||||
<mat-error *ngIf="field.get('referenceTypeId').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
||||||
</mat-form-field>
|
|
||||||
</div>
|
|
||||||
<div class="col-auto section-field" *ngIf="field.get('category').value != null">
|
|
||||||
<mat-form-field class="mt-3 w-100">
|
|
||||||
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.FIELD-LABEL' | translate}}</mat-label>
|
|
||||||
<input matInput type="text" name="label" [formControl]="field.get('label')">
|
|
||||||
<mat-error *ngIf="field.get('label').hasError('backendError')">{{field.get('label').getError('backendError').message}}</mat-error>
|
|
||||||
<mat-error *ngIf="field.get('label').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
||||||
</mat-form-field>
|
|
||||||
</div>
|
|
||||||
<div class="col-auto section-field" *ngIf="field.get('category').value != null">
|
|
||||||
<mat-form-field class="mt-3 w-100">
|
|
||||||
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.FIELD-PLACEHOLDER' | translate}}</mat-label>
|
|
||||||
<input matInput type="text" name="placeholder" [formControl]="field.get('placeholder')">
|
|
||||||
<mat-error *ngIf="field.get('placeholder').hasError('backendError')">{{field.get('placeholder').getError('backendError').message}}</mat-error>
|
|
||||||
<mat-error *ngIf="field.get('placeholder').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
||||||
</mat-form-field>
|
|
||||||
</div>
|
|
||||||
<div class="col-auto section-field" *ngIf="field.get('category').value != null">
|
|
||||||
<mat-form-field class="mt-3 w-100">
|
|
||||||
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.FIELD-DESCRIPTION' | translate}}</mat-label>
|
|
||||||
<input matInput type="text" name="description" [formControl]="field.get('description')">
|
|
||||||
<mat-error *ngIf="field.get('description').hasError('backendError')">{{field.get('description').getError('backendError').message}}</mat-error>
|
|
||||||
<mat-error *ngIf="field.get('description').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
||||||
</mat-form-field>
|
|
||||||
</div>
|
|
||||||
<div class="col section-field" *ngIf="field.get('category').value != null">
|
|
||||||
<mat-form-field class="mt-3 w-100">
|
|
||||||
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.SEMANTICS' | translate}}</mat-label>
|
|
||||||
<app-multiple-auto-complete placeholder="{{'DMP-BLUEPRINT-EDITOR.FIELDS.SEMANTICS' | translate}}" [hidePlaceholder]="true" [required]="false" [separatorKeysCodes]="separatorKeysCodes" [formControl]="field.get('semantics')" [configuration]="semanticsService.multipleAutocompleteConfiguration">
|
|
||||||
</app-multiple-auto-complete>
|
|
||||||
<mat-error *ngIf="field.get('semantics').hasError('backendError')">{{field.get('semantics').getError('backendError').message}}</mat-error>
|
|
||||||
<mat-error *ngIf="field.get('semantics').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
||||||
</mat-form-field>
|
|
||||||
</div>
|
|
||||||
<div class="col-auto section-field" *ngIf="field.get('category').value != null">
|
|
||||||
<mat-checkbox [disabled]="field.get('systemFieldType')?.value === dmpBlueprintSystemFieldType.Title || field.get('systemFieldType')?.value === dmpBlueprintSystemFieldType.Description" [formControl]="field.get('required')"><span>{{'DMP-BLUEPRINT-EDITOR.FIELDS.FIELD-REQUIRED' | translate}}</span></mat-checkbox>
|
|
||||||
<mat-error *ngIf="field.get('required').hasError('backendError')">{{field.get('required').getError('backendError').message}}</mat-error>
|
|
||||||
<mat-error *ngIf="field.get('required').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
||||||
</div>
|
|
||||||
<div [hidden]="viewOnly" class="col-auto section-field section-options-horizontal">
|
|
||||||
<button mat-icon-button matTooltip="{{'DMP-BLUEPRINT-EDITOR.ACTIONS.REMOVE-FIELD' | translate}}" (click)="removeField(sectionIndex, fieldIndex)" [disabled]="formGroup.disabled">
|
|
||||||
<mat-icon>delete</mat-icon>
|
|
||||||
</button>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
|
|
|
@ -17,7 +17,7 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<ng-template #userForm>
|
<ng-template #userForm>
|
||||||
<div *ngFor="let user of form.get('users').controls; let userIndex=index;" cdkDrag class="mb-4 user-fields-wrapper" [cdkDragDisabled]="form.disabled">
|
<div *ngFor="let user of form.get('users').controls; let userIndex=index;" cdkDrag class="mb-4 row user-fields-wrapper" [cdkDragDisabled]="form.disabled">
|
||||||
<!-- <div class="pb-2 col-auto">
|
<!-- <div class="pb-2 col-auto">
|
||||||
<span style="font-size: 15px;">{{userIndex + 1}}</span>
|
<span style="font-size: 15px;">{{userIndex + 1}}</span>
|
||||||
</div> -->
|
</div> -->
|
||||||
|
|
|
@ -15,12 +15,5 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.user-fields-wrapper {
|
.user-fields-wrapper {
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
justify-content: space-around;
|
|
||||||
align-items: baseline;
|
|
||||||
|
|
||||||
@media (width <= 1350px) {
|
|
||||||
flex-direction: column;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue