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

styling

This commit is contained in:
Sofia Papacharalampous 2024-07-01 16:20:56 +03:00
parent f7c1e56ee1
commit a4bf15aded
1 changed files with 33 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

58
dmp-frontend/src/app/ui/dmp/new/upload-dialogue/dmp-upload-dialog.component.html
View File

@ -7,13 +7,15 @@
<mat-icon>close</mat-icon>
</div>
</div>
<div class="">
<div class="upload-form col-12 pr-0 pl-0">
</div>
<mat-dialog-content class="container-fluid confirmation-dialog">
<div class="row">
<div class="upload-form col-12">
<mat-form-field class="w-100" *ngIf="files?.length == 0 || files[0].type.includes('/xml')">
<input [(ngModel)]="dmpTitle" matInput placeholder="{{'DMP-UPLOAD.PLACEHOLDER' | translate}}">
</mat-form-field>
</div>
<div class="col-12 pr-0 pl-0">
<div class="col-12">
<ngx-dropzone class="drop-file" (change)="selectFile($event)" [accept]="'text/xml, application/json'" [multiple]="false">
<ngx-dropzone-preview class="file-preview" *ngFor="let f of files" [removable]="true" (removed)="onRemove(f)">
<ngx-dropzone-label class="file-label">{{ f.name }}</ngx-dropzone-label>
@ -30,11 +32,11 @@
<input class="hidden" #fileInput type="file" onClick="this.form.reset()" (change)="uploadFile($event)" accept="text/xml, application/json">
</form>
</div>
<div class="upload-form col-12 pr-0 pl-0" *ngIf="formGroup == null && files.length > 0 && files[0].type.includes('/json')">
<div class="upload-form col-12" *ngIf="formGroup == null && files.length > 0 && files[0].type.includes('/json')">
{{ 'DMP-UPLOAD.ANALYZING-FILE' | translate }}
<b class="fa fa-spinner fa-spin" ></b>
</div>
<div class="upload-form col-12 pr-0 pl-0" *ngIf="formGroup && files.length > 0 && files[0].type.includes('/json')">
<div class="upload-form col-12" *ngIf="formGroup && files.length > 0 && files[0].type.includes('/json')">
<mat-form-field class="w-100">
<input [formControl]="formGroup.get('label')" matInput required="true" placeholder="{{'DMP-UPLOAD.PLACEHOLDER' | translate}}">
</mat-form-field>
@ -44,25 +46,31 @@
</mat-form-field>
<ng-container *ngIf="formGroup.get('blueprintId').value">
<div *ngFor="let description of formGroup.get('descriptions').controls; let descriptionIndex=index;" class="row mb-3">
<span *ngIf="description.get('label').value" style="font-size: 1rem;">
{{ description.get('label').value }}
</span>
<mat-form-field class="w-100">
<mat-label>{{'DMP-UPLOAD.FIELDS.DESCRIPTION-TEMPLATE' | translate}}</mat-label>
<app-single-auto-complete required="true" placeholder="{{'DMP-UPLOAD.FIELDS.DESCRIPTION-TEMPLATE-PLACHOLDER' | translate}}" [formControl]="description.get('templateId')" [configuration]="descriptionTemplateSingleAutocompleteConfiguration"></app-single-auto-complete>
<mat-error *ngIf="description.get('templateId').hasError('backendError')">{{description.get('templateId').getError('backendError').message}}</mat-error>
<mat-error *ngIf="description.get('templateId').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field>
<mat-form-field class="w-100">
<mat-label>{{'DMP-UPLOAD.FIELDS.SECTION' | translate}}</mat-label>
<mat-select [formControl]="description.get('sectionId')" placeholder="{{'DMP-UPLOAD.FIELDS.SECTION-PLACEHOLDER' | translate}}">
<mat-option *ngFor="let section of selectedBlueprintSections" [value]="section.id">
<span style="font-size: 1rem;">
{{ section.label }}
</span>
</mat-option>
</mat-select>
</mat-form-field>
<div class="col-12">
<span *ngIf="description.get('label').value" style="font-size: 1rem;">
{{ description.get('label').value }}
</span>
</div>
<div class="col-12">
<mat-form-field class="w-100">
<mat-label>{{'DMP-UPLOAD.FIELDS.DESCRIPTION-TEMPLATE' | translate}}</mat-label>
<app-single-auto-complete required="true" placeholder="{{'DMP-UPLOAD.FIELDS.DESCRIPTION-TEMPLATE-PLACHOLDER' | translate}}" [formControl]="description.get('templateId')" [configuration]="descriptionTemplateSingleAutocompleteConfiguration"></app-single-auto-complete>
<mat-error *ngIf="description.get('templateId').hasError('backendError')">{{description.get('templateId').getError('backendError').message}}</mat-error>
<mat-error *ngIf="description.get('templateId').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field>
</div>
<div class="col-12">
<mat-form-field class="w-100">
<mat-label>{{'DMP-UPLOAD.FIELDS.SECTION' | translate}}</mat-label>
<mat-select [formControl]="description.get('sectionId')" placeholder="{{'DMP-UPLOAD.FIELDS.SECTION-PLACEHOLDER' | translate}}">
<mat-option *ngFor="let section of selectedBlueprintSections" [value]="section.id">
<span style="font-size: 1rem;">
{{ section.label }}
</span>
</mat-option>
</mat-select>
</mat-form-field>
</div>
</div>
</ng-container>
</div>
@ -78,4 +86,4 @@
</div>
</div>
</div>
</div>
</mat-dialog-content>