mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-09-17 14:21:29 +00:00
[ACS-7414] - Manage versions dialog
This commit is contained in:
committed by
Vito Albano
parent
b34b5994d7
commit
0da2ccb762
@@ -13,7 +13,7 @@
|
|||||||
</adf-version-upload>
|
</adf-version-upload>
|
||||||
</section>
|
</section>
|
||||||
<ng-container *ngIf="data.showVersionsOnly">
|
<ng-container *ngIf="data.showVersionsOnly">
|
||||||
<section mat-dialog-content>
|
<section class="adf-new-version-uploader-dialog-content" mat-dialog-content>
|
||||||
<div class="adf-version-list-container">
|
<div class="adf-version-list-container">
|
||||||
<div class="adf-version-list-table">
|
<div class="adf-version-list-table">
|
||||||
<adf-version-list
|
<adf-version-list
|
||||||
|
@@ -24,7 +24,7 @@
|
|||||||
height: 500px;
|
height: 500px;
|
||||||
}
|
}
|
||||||
|
|
||||||
&-title {
|
.adf-new-version-uploader-dialog-title {
|
||||||
flex: 0 0 auto;
|
flex: 0 0 auto;
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
@@ -36,12 +36,12 @@
|
|||||||
color: var(--adf-theme-foreground-text-color-087);
|
color: var(--adf-theme-foreground-text-color-087);
|
||||||
}
|
}
|
||||||
|
|
||||||
&-content {
|
.adf-new-version-uploader-dialog-content {
|
||||||
|
padding: 0;
|
||||||
flex: 1 1 auto;
|
flex: 1 1 auto;
|
||||||
position: relative;
|
position: relative;
|
||||||
max-height: 100vh;
|
max-height: 100vh;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
padding: 2px 26px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
&-actions {
|
&-actions {
|
||||||
|
@@ -2,62 +2,64 @@
|
|||||||
<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" *cdkVirtualFor="let version of versionsDataSource; let idx = index; let latestVersion = first">
|
||||||
<mat-icon matListItemLine>insert_drive_file</mat-icon>
|
<mat-icon class="adf-version-list-item-icon" matListItemIcon>insert_drive_file</mat-icon>
|
||||||
<p matListItemLine class="adf-version-list-item-line adf-version-list-item-name" [id]="'adf-version-list-item-name-' + version.entry.id" >{{version.entry.name}}</p>
|
<div class="adf-version-list-content" matListItemLine>
|
||||||
<p matListItemLine>
|
<div class="adf-version-list-item-details">
|
||||||
<span class="adf-version-list-item-line adf-version-list-item-version" [id]="'adf-version-list-item-version-' + version.entry.id" >{{version.entry.id}}</span> -
|
<p class="adf-version-list-item-line adf-version-list-item-name" [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" [id]="'adf-version-list-item-date-' + version.entry.id" >{{version.entry.modifiedAt | date}}</span>
|
<p class="adf-version-list-item-line">
|
||||||
</p>
|
<span class="adf-version-list-item-line adf-version-list-item-version" [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" [id]="'adf-version-list-item-date-' + version.entry.id" >{{version.entry.modifiedAt | date}}</span>
|
||||||
matListItemLine
|
</p>
|
||||||
[id]="'adf-version-list-item-comment-' + version.entry.id"
|
<p
|
||||||
class="adf-version-list-item-comment"
|
[id]="'adf-version-list-item-comment-' + version.entry.id"
|
||||||
*ngIf="showComments"
|
class="adf-version-list-item-comment"
|
||||||
[title]="version.entry.versionComment">
|
*ngIf="showComments"
|
||||||
{{ version.entry.versionComment }}
|
[title]="version.entry.versionComment">
|
||||||
</p>
|
{{ version.entry.versionComment }}
|
||||||
|
</p>
|
||||||
<div *ngIf="showActions">
|
</div>
|
||||||
<mat-menu [id]="'adf-version-list-action-menu-' + version.entry.id"
|
<div *ngIf="true">
|
||||||
#versionMenu="matMenu"
|
<mat-menu [id]="'adf-version-list-action-menu-' + version.entry.id"
|
||||||
yPosition="below"
|
#versionMenu="matMenu"
|
||||||
xPosition="before">
|
yPosition="below"
|
||||||
<ng-container *adf-acs-version="'7'">
|
xPosition="before">
|
||||||
<button *ngIf="allowViewVersions"
|
<ng-container *adf-acs-version="'7'">
|
||||||
[id]="'adf-version-list-action-view-' + version.entry.id"
|
<button *ngIf="allowViewVersions"
|
||||||
mat-menu-item
|
[id]="'adf-version-list-action-view-' + version.entry.id"
|
||||||
(click)="onViewVersion(version.entry.id)">
|
mat-menu-item
|
||||||
{{ 'ADF_VERSION_LIST.ACTIONS.VIEW' | translate }}
|
(click)="onViewVersion(version.entry.id)">
|
||||||
</button>
|
{{ 'ADF_VERSION_LIST.ACTIONS.VIEW' | translate }}
|
||||||
</ng-container>
|
</button>
|
||||||
<button
|
</ng-container>
|
||||||
[id]="'adf-version-list-action-restore-' + version.entry.id"
|
<button
|
||||||
[disabled]="!canUpdate() || latestVersion"
|
[id]="'adf-version-list-action-restore-' + version.entry.id"
|
||||||
mat-menu-item
|
[disabled]="!canUpdate() || latestVersion"
|
||||||
(click)="restore(version.entry.id)">
|
|
||||||
{{ 'ADF_VERSION_LIST.ACTIONS.RESTORE' | translate }}
|
|
||||||
</button>
|
|
||||||
<button *ngIf="allowDownload"
|
|
||||||
[id]="'adf-version-list-action-download-' + version.entry.id"
|
|
||||||
mat-menu-item
|
mat-menu-item
|
||||||
(click)="downloadVersion(version.entry.id)">
|
(click)="restore(version.entry.id)">
|
||||||
{{ 'ADF_VERSION_LIST.ACTIONS.DOWNLOAD' | translate }}
|
{{ 'ADF_VERSION_LIST.ACTIONS.RESTORE' | translate }}
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button *ngIf="allowDownload"
|
||||||
[disabled]="!canDelete()"
|
[id]="'adf-version-list-action-download-' + version.entry.id"
|
||||||
[id]="'adf-version-list-action-delete-' + version.entry.id"
|
mat-menu-item
|
||||||
(click)="deleteVersion(version.entry.id)"
|
(click)="downloadVersion(version.entry.id)">
|
||||||
mat-menu-item>
|
{{ 'ADF_VERSION_LIST.ACTIONS.DOWNLOAD' | translate }}
|
||||||
{{ 'ADF_VERSION_LIST.ACTIONS.DELETE' | translate }}
|
</button>
|
||||||
</button>
|
<button
|
||||||
</mat-menu>
|
[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
|
<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>
|
||||||
</div>
|
</div>
|
||||||
</mat-list-item>
|
</mat-list-item>
|
||||||
</cdk-virtual-scroll-viewport>
|
</cdk-virtual-scroll-viewport>
|
||||||
|
@@ -1,17 +1,53 @@
|
|||||||
/* stylelint-disable selector-class-pattern */
|
/* stylelint-disable selector-class-pattern */
|
||||||
|
/* stylelint-disable no-descending-specificity */
|
||||||
|
|
||||||
@import 'styles/mat-selectors';
|
@import 'styles/mat-selectors';
|
||||||
|
|
||||||
.adf-version-list {
|
.adf-version-list {
|
||||||
|
.adf-version-list-element {
|
||||||
|
.adf-version-list-item {
|
||||||
|
border-bottom: 1px solid var(--adf-theme-foreground-divider-color);
|
||||||
|
height: 88px;
|
||||||
|
padding: 0 16px;
|
||||||
|
|
||||||
|
.adf-version-list-item-details {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.adf-version-list-item-line {
|
||||||
|
margin: 0;
|
||||||
|
line-height: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.adf-version-list-item-name {
|
||||||
|
font-weight: normal;
|
||||||
|
color: var(--adf-theme-foreground-text-color-087);
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.adf-version-list-content {
|
||||||
|
display: flex;
|
||||||
|
padding-left: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.adf-version-list-item-icon {
|
||||||
|
color: var(--adf-theme-foreground-text-color-087);
|
||||||
|
margin: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.adf-version-list-item-version {
|
||||||
|
color: var(--adf-theme-foreground-text-color-087);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.adf-version-list-viewport {
|
.adf-version-list-viewport {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
overflow-x: hidden;
|
overflow-x: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
.adf-version-list-item {
|
|
||||||
border-bottom: 1px solid var(--adf-theme-foreground-divider-color);
|
|
||||||
width: 100vw;
|
|
||||||
}
|
|
||||||
|
|
||||||
&-item-version {
|
&-item-version {
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
}
|
}
|
||||||
@@ -21,8 +57,8 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
&-item-comment {
|
&-item-comment {
|
||||||
width: 500px;
|
|
||||||
opacity: 0.5;
|
opacity: 0.5;
|
||||||
|
margin: 0;
|
||||||
|
|
||||||
@media screen and (width <= 629px) {
|
@media screen and (width <= 629px) {
|
||||||
width: 97%;
|
width: 97%;
|
||||||
|
@@ -6,7 +6,8 @@
|
|||||||
class="adf-notification-history-menu_button"
|
class="adf-notification-history-menu_button"
|
||||||
id="adf-notification-history-open-button"
|
id="adf-notification-history-open-button"
|
||||||
(menuOpened)="onMenuOpened()">
|
(menuOpened)="onMenuOpened()">
|
||||||
<mat-icon matBadge="⁠"
|
<mat-icon class="adf-notification-history-menu_button-icon"
|
||||||
|
matBadge="⁠"
|
||||||
[matBadgeHidden]="!notifications.length"
|
[matBadgeHidden]="!notifications.length"
|
||||||
matBadgeColor="accent"
|
matBadgeColor="accent"
|
||||||
matBadgeSize="small">notifications</mat-icon>
|
matBadgeSize="small">notifications</mat-icon>
|
||||||
|
@@ -2,11 +2,17 @@
|
|||||||
|
|
||||||
.adf {
|
.adf {
|
||||||
&-notification-history-menu_button#{$mat-button} {
|
&-notification-history-menu_button#{$mat-button} {
|
||||||
margin-right: 0;
|
margin-right: 8px;
|
||||||
border-radius: 90%;
|
border-radius: 90%;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
min-width: 40px;
|
min-width: 40px;
|
||||||
height: 40px;
|
height: 40px;
|
||||||
|
|
||||||
|
.adf-notification-history-menu_button-icon {
|
||||||
|
font-size: 24px;
|
||||||
|
height: 24px;
|
||||||
|
width: 24px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&-notification-history-list #{$mat-subheader} {
|
&-notification-history-list #{$mat-subheader} {
|
||||||
|
Reference in New Issue
Block a user