ui change

This commit is contained in:
Sofia Papacharalampous 2024-07-05 16:30:38 +03:00
parent 6856561583
commit d94ea46782
1 changed files with 12 additions and 35 deletions

View File

@ -5,39 +5,25 @@
<div class="col-12 pl-2 mb-3"> <div class="col-12 pl-2 mb-3">
<app-navigation-breadcrumb /> <app-navigation-breadcrumb />
</div> </div>
<div class="col-12 mb-4 pl-1"> <!-- <div class="col-12 mb-4 pl-1">
<a (click)="goBack()" role="button"> <a (click)="goBack()" role="button">
<mat-icon class="back-icon pointer">chevron_left</mat-icon> <mat-icon class="back-icon pointer">chevron_left</mat-icon>
<span class="label-txt pointer">{{'PLAN-OVERVIEW.ACTIONS.BACK' | translate}}</span> <span class="label-txt pointer">{{'PLAN-OVERVIEW.ACTIONS.BACK' | translate}}</span>
</a> </a>
</div> </div> -->
</div> </div>
<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 align-items-center">
<div class="col-auto mt-3"><span class="dmp-logo">{{ 'PLAN-OVERVIEW.TITLE' | translate }}</span></div> <div class="col-auto"><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 pr-0 d-flex"><span class="dmp-label">{{ dmp.label }}</span></div>
<div class="col-auto pr-0"><span style="font-weight: 700;">.</span></div>
<div class="col-auto d-flex"> <div class="col-auto d-flex"><button mat-button [matMenuTriggerFor]="versions" style="border-radius: 100px; background-color: #eaeaea;">
<mat-form-field appearance="fill" class="w-100"> <div class="pl-2 pr-1 d-flex align-items-center">{{'PLAN-OVERVIEW.VERSION' | translate}} {{selectedDmpVersion?.version}} <mat-icon class="ml-1">arrow_drop_down</mat-icon></div>
<mat-select placeholder="{{'PLAN-OVERVIEW.VERSION' | translate}} {{dmp.version}}" [(ngModel)]="selectedDmpVersion.id" (selectionChange)="versionChanged(selectedDmpVersion.id)" style="line-height: normal; width: fit-content;"> </button></div>
<mat-select-trigger style="width: fit-content;"> <mat-menu #versions="matMenu">
<span class="dmp-label"> <button mat-menu-item *ngFor="let version of dmp?.otherPlanVersions" (click)="versionChanged(version.id)" >Version {{version?.version}}</button>
{{'PLAN-OVERVIEW.VERSION' | translate}} {{ selectedDmpVersion?.version }} </mat-menu>
{{ 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">
@ -54,14 +40,6 @@
<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">
<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-option *ngFor="let version of dmp?.otherPlanVersions" [value]="version?.id">
{{'PLAN-OVERVIEW.VERSION' | translate}} {{version.version}}</mat-option>
</mat-select>
</mat-form-field>
</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>
@ -73,7 +51,6 @@
</div> </div>
</div> </div>
<div class="row" *ngIf="!lockStatus || canClonePlan() || (canDeletePlan() && !isLocked)"> <div class="row" *ngIf="!lockStatus || canClonePlan() || (canDeletePlan() && !isLocked)">
<!-- <button *ngIf="isDraftDmp(dmp) && isDmpOwner(dmp) && !isLocked" (click)="editClicked(dmp)" mat-mini-fab class="mr-3 d-flex justify-content-center align-items-center" matTooltip="{{'PLAN-OVERVIEW.ACTIONS.EDIT' | translate}}" matTooltipPosition="above"> -->
<div *ngIf="canEditPlan(dmp) && !lockStatus; else previewButton" class="col-auto pr-0"> <div *ngIf="canEditPlan(dmp) && !lockStatus; else previewButton" class="col-auto pr-0">
<button (click)="editClicked()" mat-mini-fab class="d-flex justify-content-center align-items-center" matTooltip="{{'PLAN-OVERVIEW.ACTIONS.EDIT' | translate}}" matTooltipPosition="above"> <button (click)="editClicked()" mat-mini-fab class="d-flex justify-content-center align-items-center" matTooltip="{{'PLAN-OVERVIEW.ACTIONS.EDIT' | translate}}" matTooltipPosition="above">
<mat-icon class="mat-mini-fab-icon">create</mat-icon> <mat-icon class="mat-mini-fab-icon">create</mat-icon>