MaDgiK-CITE
/
argos
13
0
Fork 0
Code Issues Pull Requests Projects Releases 3 Wiki Activity

increase semantics width on dmp blueprint editor

This commit is contained in:
Sofia Papacharalampous 2024-05-28 10:48:48 +03:00
parent 96c766d4f6
commit a26233b8c2
1 changed files with 11 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
dmp-frontend/src/app/ui/admin/dmp-blueprint/editor/dmp-blueprint-editor.component.html
View File

@ -104,8 +104,7 @@
<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 class="col"> <div class="col">
<div class="row"> <div class="row align-items-center">
<div class="col-12 col-xl-4"> <div class="col-12 col-xl-4">
<mat-form-field class="mt-3 w-100"> <mat-form-field class="mt-3 w-100">
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.CATEGORY' | translate}}</mat-label> <mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.CATEGORY' | translate}}</mat-label>
@ -170,7 +169,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-12 col-xl-4" *ngIf="field.get('category').value != null"> <div class="col-12 order-xl-8" *ngIf="field.get('category').value != null">
<mat-form-field class="mt-3 w-100"> <mat-form-field class="mt-3 w-100">
<mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.SEMANTICS' | translate}}</mat-label> <mat-label>{{'DMP-BLUEPRINT-EDITOR.FIELDS.SEMANTICS' | translate}}</mat-label>
<app-multiple-auto-complete placeholder="{{'DMP-BLUEPRINT-EDITOR.FIELDS.SEMANTICS' | translate}}" [required]="false" [separatorKeysCodes]="separatorKeysCodes" [formControl]="field.get('semantics')" [configuration]="semanticsService.multipleAutocompleteConfiguration"> <app-multiple-auto-complete placeholder="{{'DMP-BLUEPRINT-EDITOR.FIELDS.SEMANTICS' | translate}}" [required]="false" [separatorKeysCodes]="separatorKeysCodes" [formControl]="field.get('semantics')" [configuration]="semanticsService.multipleAutocompleteConfiguration">
@ -179,29 +178,25 @@
<mat-error *ngIf="field.get('semantics').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="field.get('semantics').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
</div> </div>
</div> <div class="col-auto col-xl-2 section-field" *ngIf="field.get('category').value != null">
</div> <mat-checkbox [disabled]="alwaysRequiredSystemFieldTypes.includes(field.get('systemFieldType')?.value) || formGroup.disabled" [checked]="field.get('required').value" (change)="field.get('required').setValue($event.checked)"><span>{{'DMP-BLUEPRINT-EDITOR.FIELDS.FIELD-REQUIRED' | translate}}</span></mat-checkbox>
<div class="col-12 col-xl-auto">
<div class="row flex-xl-column">
<div class="col-auto section-field" *ngIf="field.get('category').value != null">
<mat-checkbox class="pl-1" [disabled]="alwaysRequiredSystemFieldTypes.includes(field.get('systemFieldType')?.value) || formGroup.disabled" [checked]="field.get('required').value" (change)="field.get('required').setValue($event.checked)"><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('backendError')">{{field.get('required').getError('backendError').message}}</mat-error>
<mat-error *ngIf="field.get('required').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="field.get('required').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</div> </div>
<div class="col-auto"> <div class="col-auto col-xl-2">
<div class="pl-1" *ngIf="field.get('category').value === dmpBlueprintSectionFieldCategory.ReferenceType"> <div *ngIf="field.get('category').value === dmpBlueprintSectionFieldCategory.ReferenceType">
<mat-checkbox [disabled]="formGroup.disabled" [checked]="field.get('multipleSelect').value" (change)="field.get('multipleSelect').setValue($event.checked)"><span>{{'DMP-BLUEPRINT-EDITOR.FIELDS.FIELD-MULTIPLE-SELECT' | translate}}</span></mat-checkbox> <mat-checkbox [disabled]="formGroup.disabled" [checked]="field.get('multipleSelect').value" (change)="field.get('multipleSelect').setValue($event.checked)"><span>{{'DMP-BLUEPRINT-EDITOR.FIELDS.FIELD-MULTIPLE-SELECT' | translate}}</span></mat-checkbox>
<mat-error *ngIf="field.get('multipleSelect')?.hasError('backendError')">{{field.get('multipleSelect')?.getError('backendError').message}}</mat-error> <mat-error *ngIf="field.get('multipleSelect')?.hasError('backendError')">{{field.get('multipleSelect')?.getError('backendError').message}}</mat-error>
<mat-error *ngIf="field.get('multipleSelect')?.hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="field.get('multipleSelect')?.hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</div> </div>
</div> </div>
<div [hidden]="viewOnly" class="col-auto 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> </div>
<div [hidden]="viewOnly" class="col-12 col-xl-auto 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 *ngIf="fieldIndex != section.get('fields').controls.length-1" class="col-12"> <div *ngIf="fieldIndex != section.get('fields').controls.length-1" class="col-12">
<div class="pr-2 pl-2 mt-xl-1 mt-2 mb-1"> <div class="pr-2 pl-2 mt-xl-1 mt-2 mb-1">
<mat-divider></mat-divider> <mat-divider></mat-divider>