inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-07-24 17:32:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

[ACS-7414] - manage versions dialog (#9545)

Browse Source
This commit is contained in:
dominikiwanekhyland
2024-04-12 15:31:37 +02:00
committed by VitoAlbano
parent 26310858ae
commit ef173c65c1
2 changed files with 84 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files

81
lib/content-services/src/lib/version-manager/version-list.component.html
View File

@@ -2,26 +2,28 @@
color="accent"></mat-progress-bar> color="accent"></mat-progress-bar>
<mat-list class="adf-version-list adf-version-list-element" [hidden]="isLoading"> <mat-list class="adf-version-list adf-version-list-element" [hidden]="isLoading">
<cdk-virtual-scroll-viewport #viewport itemSize="88" class="adf-version-list-viewport"> <cdk-virtual-scroll-viewport #viewport itemSize="88" class="adf-version-list-viewport">
<mat-list-item class="adf-version-list-item" *cdkVirtualFor="let version of versionsDataSource; let idx = index; let latestVersion = first"> <mat-list-item class="adf-version-list-item"
<mat-icon matListItemLine>insert_drive_file</mat-icon> *cdkVirtualFor="let version of versionsDataSource; let idx = index; let latestVersion = first">
<p matListItemLine class="adf-version-list-item-line adf-version-list-item-name" <mat-icon class="adf-version-list-icon" matListItemIcon>insert_drive_file</mat-icon>
[id]="'adf-version-list-item-name-' + version.entry.id">{{ version.entry.name }}</p> <div class="adf-version-list-content">
<p matListItemLine> <div class="adf-version-list-item-details">
<span class="adf-version-list-item-line adf-version-list-item-version" <p class="adf-version-list-item-line adf-version-list-item-name"
[id]="'adf-version-list-item-version-' + version.entry.id">{{ version.entry.id }}</span> - [id]="'adf-version-list-item-name-' + version.entry.id">{{ version.entry.name }}</p>
<span class="adf-version-list-item-line adf-version-list-item-date" <p>
[id]="'adf-version-list-item-date-' + version.entry.id">{{ version.entry.modifiedAt | date }}</span> <span class="adf-version-list-item-line adf-version-list-item-version"
</p> [id]="'adf-version-list-item-version-' + version.entry.id">{{ version.entry.id }}</span> -
<p <span class="adf-version-list-item-line adf-version-list-item-date"
matListItemLine [id]="'adf-version-list-item-date-' + version.entry.id">{{ version.entry.modifiedAt | date }}</span>
[id]="'adf-version-list-item-comment-' + version.entry.id" </p>
class="adf-version-list-item-comment" <p
*ngIf="showComments" [id]="'adf-version-list-item-comment-' + version.entry.id"
[title]="version.entry.versionComment"> class="adf-version-list-item-comment"
{{ version.entry.versionComment }} *ngIf="showComments"
</p> [title]="version.entry.versionComment">
{{ version.entry.versionComment }}
<div *ngIf="showActions"> </p>
</div>
<ng-container *ngIf="showActions">
<mat-menu [id]="'adf-version-list-action-menu-' + version.entry.id" <mat-menu [id]="'adf-version-list-action-menu-' + version.entry.id"
#versionMenu="matMenu" #versionMenu="matMenu"
yPosition="below" yPosition="below"
@@ -30,25 +32,38 @@
<button *ngIf="allowViewVersions" <button *ngIf="allowViewVersions"
[id]="'adf-version-list-action-view-' + version.entry.id" [id]="'adf-version-list-action-view-' + version.entry.id"
mat-menu-item mat-menu-item
(click)="downloadVersion(version.entry.id)"> (click)="onViewVersion(version.entry.id)">
{{ 'ADF_VERSION_LIST.ACTIONS.DOWNLOAD' | translate }} {{ 'ADF_VERSION_LIST.ACTIONS.VIEW' | translate }}
</button> </button>
<button </ng-container>
[disabled]="!canDelete()" <button
[id]="'adf-version-list-action-delete-' + version.entry.id" [id]="'adf-version-list-action-restore-' + version.entry.id"
(click)="deleteVersion(version.entry.id)" [disabled]="!canUpdate() || latestVersion"
mat-menu-item> mat-menu-item
{{ 'ADF_VERSION_LIST.ACTIONS.DELETE' | translate }} (click)="restore(version.entry.id)">
</button> {{ 'ADF_VERSION_LIST.ACTIONS.RESTORE' | translate }}
</mat-menu> </button>
<button *ngIf="allowDownload"
<button mat-icon-button [id]="'adf-version-list-action-download-' + version.entry.id"
mat-menu-item
(click)="downloadVersion(version.entry.id)">
{{ 'ADF_VERSION_LIST.ACTIONS.DOWNLOAD' | translate }}
</button>
<button
[disabled]="!canDelete()"
[id]="'adf-version-list-action-delete-' + version.entry.id"
(click)="deleteVersion(version.entry.id)"
mat-menu-item>
{{ 'ADF_VERSION_LIST.ACTIONS.DELETE' | translate }}
</button>
</mat-menu>
<button mat-icon-button
[matMenuTriggerFor]="versionMenu" [matMenuTriggerFor]="versionMenu"
[id]="'adf-version-list-action-menu-button-' + version.entry.id" [id]="'adf-version-list-action-menu-button-' + version.entry.id"
title="{{ 'ADF_VERSION_LIST.MANAGE_VERSION_OPTIONS' | translate }}"> title="{{ 'ADF_VERSION_LIST.MANAGE_VERSION_OPTIONS' | translate }}">
<mat-icon>more_vert</mat-icon> <mat-icon>more_vert</mat-icon>
</button> </button>
</div> </ng-container>
</div> </div>
</mat-list-item> </mat-list-item>
</cdk-virtual-scroll-viewport> </cdk-virtual-scroll-viewport>

52
lib/content-services/src/lib/version-manager/version-list.component.scss
View File

@@ -1,19 +1,39 @@
/* stylelint-disable selector-class-pattern */
/* stylelint-disable no-descending-specificity */
@import 'styles/mat-selectors';
.adf-version-list { .adf-version-list {
height: 100%; &-viewport {
overflow-x: hidden; height: 100%;
display: flex; overflow-x: hidden;
display: flex;
:first-child { :first-child {
max-width: 100%; max-width: 100%;
}
} }
&-item { &-item-details {
border-bottom: 1px solid var(--adf-theme-foreground-divider-color); flex: 1;
width: 100%; width: 90%;
}
&-content {
display: flex;
p {
margin: 0;
overflow: hidden;
}
}
.adf-version-list-icon {
margin: 0 16px;
color: var(--theme-sidenav-user-menu-color);
}
&.adf-version-list-element {
.adf-version-list-item {
border-bottom: 1px solid var(--adf-theme-foreground-divider-color);
width: 100%;
height: 88px;
}
} }
&-item-version { &-item-version {
@@ -22,20 +42,20 @@
&-item-date { &-item-date {
opacity: 0.6; opacity: 0.6;
white-space: normal;
} }
&-item-comment { &-item-comment {
width: 100%; width: auto;
opacity: 0.5; opacity: 0.5;
margin: 0;
@media screen and (width <= 629px) { @media screen and (width <= 629px) {
width: 97%; width: 97%;
} }
} }
&-item-name, &-item-name {
&-item-date {
white-space: normal; white-space: normal;
font-size: 16px;
} }
} }