dmp-overview ui fix

This commit is contained in:
Sofia Papacharalampous 2024-04-16 13:29:34 +03:00
parent 7314bee9d2
commit c2d6e7b61b
2 changed files with 48 additions and 28 deletions

View File

@ -1,8 +1,12 @@
<div [matMenuTriggerFor]="depositMenu" class="row ml-0 mr-0 pl-4 pb-3 d-flex align-items-center"> <div [matMenuTriggerFor]="depositMenu" class="row pb-3 align-items-center">
<button mat-mini-fab class="frame-btn"> <div class="col-auto pr-0">
<mat-icon class="mat-mini-fab-icon">archive</mat-icon> <button mat-mini-fab class="frame-btn">
</button> <mat-icon class="mat-mini-fab-icon">archive</mat-icon>
<p class="mb-0 pl-2 frame-txt">{{ 'DMP-LISTING.ACTIONS.DEPOSIT' | translate }}</p> </button>
</div>
<div class="col-auto pl-0">
<p class="mb-0 pl-2 frame-txt">{{ 'DMP-LISTING.ACTIONS.DEPOSIT' | translate }}</p>
</div>
</div> </div>
<mat-menu #depositMenu="matMenu"> <mat-menu #depositMenu="matMenu">
<button mat-menu-item *ngFor="let repo of inputRepos" (click)="deposit(repo)"> <button mat-menu-item *ngFor="let repo of inputRepos" (click)="deposit(repo)">

View File

@ -166,50 +166,66 @@
<div class="row"> <div class="row">
<div class="col-12"> <div class="col-12">
<div class="frame mb-3 pt-4 pl-4 pr-5 pb-3"> <div class="frame mb-3 pt-4 pl-4 pr-5 pb-3">
<div class="row"> <ng-container *ngIf="isDraftDmp() && canFinalizeDmp() && !isLocked">
<ng-container *ngIf="isDraftDmp() && canFinalizeDmp() && !isLocked"> <div class="row align-items-center" (click)="finalize(dmp)">
<div class="col-12 d-flex align-items-center" (click)="finalize(dmp)"> <div class="col-auto pr-0">
<button mat-mini-fab class="finalize-btn"> <button mat-mini-fab class="finalize-btn">
<mat-icon class="mat-mini-fab-icon">check</mat-icon> <mat-icon class="mat-mini-fab-icon">check</mat-icon>
</button> </button>
</div>
<div class="col-auto pl-0">
<p class="mb-0 pl-2 finalize-txt">{{ 'DMP-OVERVIEW.ACTIONS.FINALIZE' | translate }}</p> <p class="mb-0 pl-2 finalize-txt">{{ 'DMP-OVERVIEW.ACTIONS.FINALIZE' | translate }}</p>
</div> </div>
<div class="col-12 d-flex align-items-center"> </div>
<div class="row align-items-center">
<div class="col-12">
<hr class="hr-line"> <hr class="hr-line">
</div> </div>
</ng-container> </div>
<app-dmp-deposit-dropdown *ngIf="(hasDoi(dmp) || moreDeposit()) && isFinalizedDmp(dmp) && !this.isPublicView && canDepositDmp(dmp) && inputRepos.length > 0" [inputRepos]="inputRepos" [dmp]="dmp" (outputReposEmitter)="afterDeposit($event)"></app-dmp-deposit-dropdown> </ng-container>
<ng-container *ngIf="isFinalizedDmp(dmp) && hasDoi(dmp) && !isPublishedDmp(dmp) && canFinalizeDmp(dmp)" (click)="reverseFinalization()"> <app-dmp-deposit-dropdown *ngIf="(hasDoi(dmp) || moreDeposit()) && isFinalizedDmp(dmp) && !this.isPublicView && canDepositDmp(dmp) && inputRepos.length > 0" [inputRepos]="inputRepos" [dmp]="dmp" (outputReposEmitter)="afterDeposit($event)"></app-dmp-deposit-dropdown>
<div class="col-12 mb-1 d-flex align-items-center"> <ng-container *ngIf="isFinalizedDmp(dmp) && hasDoi(dmp) && !isPublishedDmp(dmp) && canFinalizeDmp(dmp)">
<div (click)="reverseFinalization()" class="row mb-3 align-items-center">
<div class="col-auto pr-0">
<button mat-mini-fab class="frame-btn"> <button mat-mini-fab class="frame-btn">
<mat-icon class="mat-mini-fab-icon">unarchive</mat-icon> <mat-icon class="mat-mini-fab-icon">unarchive</mat-icon>
</button> </button>
</div>
<div class="col-auto pl-0">
<p class="mb-0 pl-2 frame-txt">{{ 'DMP-OVERVIEW.ACTIONS.REVERSE' | translate }}</p> <p class="mb-0 pl-2 frame-txt">{{ 'DMP-OVERVIEW.ACTIONS.REVERSE' | translate }}</p>
</div> </div>
</ng-container> </div>
<ng-container *ngIf="canExportDmp() && fileTransformerService.availableFormats.length > 0"> </ng-container>
<div class="col-12 mb-1 d-flex align-items-center"> <ng-container *ngIf="canExportDmp() && fileTransformerService.availableFormats.length > 0">
<div class="row mb-3 align-items-center">
<div class="col-auto pr-0">
<button mat-mini-fab class="frame-btn" [matMenuTriggerFor]="exportMenu"> <button mat-mini-fab class="frame-btn" [matMenuTriggerFor]="exportMenu">
<mat-icon class="mat-mini-fab-icon">open_in_new</mat-icon> <mat-icon class="mat-mini-fab-icon">open_in_new</mat-icon>
</button> </button>
<p class="mb-0 mr-0 pl-2 frame-txt" [matMenuTriggerFor]="exportMenu">{{ 'DMP-OVERVIEW.ACTIONS.EXPORT' | translate }}</p>
</div> </div>
</ng-container> <div class="col-auto pl-0">
<ng-container *ngIf="canCreateNewVersion()"> <p class="mb-0 pl-2 frame-txt" [matMenuTriggerFor]="exportMenu">{{ 'DMP-OVERVIEW.ACTIONS.EXPORT' | translate }}</p>
<div class="col-12 d-flex align-items-center" (click)="newVersionClicked()"> </div>
</div>
</ng-container>
<ng-container *ngIf="canCreateNewVersion()">
<div class="row mb-3 align-items-center" (click)="newVersionClicked()">
<div class="col-auto pr-0">
<button mat-mini-fab class="frame-btn"> <button mat-mini-fab class="frame-btn">
<mat-icon class="mat-mini-fab-icon">add_to_photos</mat-icon> <mat-icon class="mat-mini-fab-icon">add_to_photos</mat-icon>
</button> </button>
</div>
<div class="col-auto pl-0">
<p class="mb-0 pl-2 frame-txt">{{ 'DMP-OVERVIEW.ACTIONS.NEW-VERSION' | translate }}</p> <p class="mb-0 pl-2 frame-txt">{{ 'DMP-OVERVIEW.ACTIONS.NEW-VERSION' | translate }}</p>
</div> </div>
</ng-container> </div>
<mat-menu #exportMenu="matMenu" xPosition="before"> </ng-container>
<button mat-menu-item *ngFor='let fileTransformer of fileTransformerService.availableFormats' (click)="fileTransformerService.exportDmp(dmp.id, fileTransformer.repositoryId, fileTransformer.format)"> <mat-menu #exportMenu="matMenu" xPosition="before">
<i class="fa pr-2" [ngClass]="fileTransformer.icon ? fileTransformer.icon : 'fa-file-o'"></i> <button mat-menu-item *ngFor='let fileTransformer of fileTransformerService.availableFormats' (click)="fileTransformerService.exportDmp(dmp.id, fileTransformer.repositoryId, fileTransformer.format)">
<span>{{'GENERAL.FILE-TRANSFORMER.' + fileTransformer?.format?.toUpperCase() | translate}}</span> <i class="fa pr-2" [ngClass]="fileTransformer.icon ? fileTransformer.icon : 'fa-file-o'"></i>
</button> <span>{{'GENERAL.FILE-TRANSFORMER.' + fileTransformer?.format?.toUpperCase() | translate}}</span>
</mat-menu> </button>
</div> </mat-menu>
</div> </div>
</div> </div>
</div> </div>