dmp overview ui changes (in progress)

This commit is contained in:
Sofia Papacharalampous 2024-07-05 14:21:09 +03:00
parent 52f93e3aa7
commit 9b4742658d
2 changed files with 28 additions and 7 deletions

View File

@ -15,9 +15,31 @@
<div class="row"> <div class="row">
<div class="col-12 col-lg-8 pl-2"> <div class="col-12 col-lg-8 pl-2">
<div class="row"> <div class="row">
<div class="col-auto"><span class="dmp-logo">{{ 'PLAN-OVERVIEW.TITLE' | translate }}</span></div> <div class="col-auto mt-3"><span class="dmp-logo">{{ 'PLAN-OVERVIEW.TITLE' | translate }}</span></div>
<div class="col-auto d-flex"><span class="dmp-label">{{ dmp.label }}</span></div> <!-- <div class="col-auto d-flex"><span class="dmp-label">{{ dmp.label }}</span></div> -->
<div class="col-auto d-flex">
<mat-form-field appearance="fill" class="w-100">
<mat-select placeholder="{{'PLAN-OVERVIEW.VERSION' | translate}} {{dmp.version}}" [(ngModel)]="selectedDmpVersion.id" (selectionChange)="versionChanged(selectedDmpVersion.id)" style="line-height: normal; width: fit-content;">
<mat-select-trigger style="width: fit-content;">
<span class="dmp-label">
{{'PLAN-OVERVIEW.VERSION' | translate}} {{ selectedDmpVersion?.version }}
{{ dmp.label }}
</span>
<!-- <br> -->
<!-- <span class="ml-2" style="font-size: .8rem;">
{{'PLAN-OVERVIEW.VERSION' | translate}} {{ selectedDmpVersion?.version }}
</span> -->
</mat-select-trigger>
<mat-option *ngFor="let version of dmp?.otherPlanVersions" [value]="version?.id">
<span>{{'PLAN-OVERVIEW.VERSION' | translate}} {{version?.version}}</span>
</mat-option>
</mat-select>
</mat-form-field>
</div>
</div> </div>
<div class="row align-items-center mt-3 mb-4 label-txt"> <div class="row align-items-center mt-3 mb-4 label-txt">
<div *ngIf="isUserDmpRelated()" class="col-auto d-flex"> <div *ngIf="isUserDmpRelated()" class="col-auto d-flex">
<p class="ml-0 mb-0 label2-txt">{{ enumUtils.toPlanUserRolesString(planService.getCurrentUserRolesInPlan(dmp?.planUsers)) }} <p class="ml-0 mb-0 label2-txt">{{ enumUtils.toPlanUserRolesString(planService.getCurrentUserRolesInPlan(dmp?.planUsers)) }}
@ -32,14 +54,14 @@
<mat-icon class="status-icon">lock_outline</mat-icon> <mat-icon class="status-icon">lock_outline</mat-icon>
{{'PLAN-OVERVIEW.LOCKED' | translate}} {{'PLAN-OVERVIEW.LOCKED' | translate}}
</div> </div>
<div class="col-auto" *ngIf="selectedDmpVersion"> <!-- <div class="col-auto" *ngIf="selectedDmpVersion">
<mat-form-field appearance="outline" subscriptSizing="dynamic" class="dense-3 versions-select"> <mat-form-field appearance="outline" subscriptSizing="dynamic" class="dense-3 versions-select">
<mat-select placeholder="{{'PLAN-OVERVIEW.VERSION' | translate}} {{dmp.version}}" [(ngModel)]="selectedDmpVersion.id" (selectionChange)="versionChanged(selectedDmpVersion.id)"> <mat-select placeholder="{{'PLAN-OVERVIEW.VERSION' | translate}} {{dmp.version}}" [(ngModel)]="selectedDmpVersion.id" (selectionChange)="versionChanged(selectedDmpVersion.id)">
<mat-option *ngFor="let version of dmp?.otherPlanVersions" [value]="version?.id"> <mat-option *ngFor="let version of dmp?.otherPlanVersions" [value]="version?.id">
{{'PLAN-OVERVIEW.VERSION' | translate}} {{version.version}}</mat-option> {{'PLAN-OVERVIEW.VERSION' | translate}} {{version.version}}</mat-option>
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
</div> </div> -->
<div class="col-auto d-flex">{{'PLAN-OVERVIEW.EDITED' | translate}} : <div class="col-auto d-flex">{{'PLAN-OVERVIEW.EDITED' | translate}} :
{{dmp.updatedAt | dateTimeFormatter: "d MMMM y"}} {{dmp.updatedAt | dateTimeFormatter: "d MMMM y"}}
</div> </div>
@ -216,7 +238,7 @@
</div> </div>
</div> </div>
</ng-container> </ng-container>
<ng-container *ngIf="canCreateNewVersion()"> <!-- <ng-container *ngIf="canCreateNewVersion()">
<div class="row mb-3 align-items-center" (click)="newVersionClicked()"> <div class="row mb-3 align-items-center" (click)="newVersionClicked()">
<div class="col-auto pr-0"> <div class="col-auto pr-0">
<button mat-mini-fab class="frame-btn"> <button mat-mini-fab class="frame-btn">
@ -227,7 +249,7 @@
<p class="mb-0 pl-2 frame-txt">{{ 'PLAN-OVERVIEW.ACTIONS.NEW-VERSION' | translate }}</p> <p class="mb-0 pl-2 frame-txt">{{ 'PLAN-OVERVIEW.ACTIONS.NEW-VERSION' | translate }}</p>
</div> </div>
</div> </div>
</ng-container> </ng-container> -->
<mat-menu #exportMenu="matMenu" xPosition="before"> <mat-menu #exportMenu="matMenu" xPosition="before">
<button mat-menu-item *ngFor='let fileTransformer of fileTransformerService.availableFormatsFor(fileTransformerEntityTypeEnum.Dmp)' (click)="fileTransformerService.exportDmp(dmp.id, fileTransformer.repositoryId, fileTransformer.format)"> <button mat-menu-item *ngFor='let fileTransformer of fileTransformerService.availableFormatsFor(fileTransformerEntityTypeEnum.Dmp)' (click)="fileTransformerService.exportDmp(dmp.id, fileTransformer.repositoryId, fileTransformer.format)">
<i class="fa pr-2" [ngClass]="fileTransformer.icon ? fileTransformer.icon : 'fa-file-o'"></i> <i class="fa pr-2" [ngClass]="fileTransformer.icon ? fileTransformer.icon : 'fa-file-o'"></i>

View File

@ -297,7 +297,6 @@
align-items: center; align-items: center;
} }
.dmp-label,
.description-btn, .description-btn,
.description-finalized-btn, .description-finalized-btn,
.add-description-btn, .add-description-btn,