mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-07-24 17:32:15 +00:00
[ADF-2322] Card view datatable and documentlist (#2968)
* move table in style * Enable the cardview mode * add button in demo shell to change view add missing translation terms toolbar * missing comma * add example in demo shell * style loading and images * border card container * document list tests * test check class and input * test fix * fix test process services * more documentation * rirpristinate base pacakge integgration * remove test color
This commit is contained in:
Eugenio Romano
GitHub
@@ -1,15 +1,33 @@
|
||||
<div class="container">
|
||||
|
||||
<div class="adf-recent-container">
|
||||
<mat-list>
|
||||
<mat-list-item><mat-icon>history</mat-icon>{{ 'DOCUMENT_LIST.RECENT' | translate }}</mat-list-item>
|
||||
<mat-divider></mat-divider>
|
||||
</mat-list>
|
||||
|
||||
<adf-document-list
|
||||
[currentFolderId]="'-recent-'"
|
||||
locationFormat="/files"
|
||||
[cardview]="true"
|
||||
[showHeader]="false"
|
||||
[maxItems]="5"
|
||||
(preview)="showFile($event)"
|
||||
selectionMode="null">
|
||||
</adf-document-list>
|
||||
</div>
|
||||
|
||||
<div class="adf-site-container-style" id="site-container">
|
||||
<adf-sites-dropdown (change)="getSiteContent($event)" [hideMyFiles]="false">
|
||||
</adf-sites-dropdown>
|
||||
</div>
|
||||
<div class="document-list-container" fxLayout="row" fxLayoutAlign="start stretch" fxLayoutGap="16px">
|
||||
<adf-upload-drag-area fxFlex="1 1 auto"
|
||||
[disabled]="disableDragArea"
|
||||
[parentId]="getDocumentListCurrentFolderId()"
|
||||
[versioning]="versioning"
|
||||
[adf-node-permission]="'create'"
|
||||
[adf-nodes]="disableDragArea ? getCurrentDocumentListNode() : []">
|
||||
[disabled]="disableDragArea"
|
||||
[parentId]="getDocumentListCurrentFolderId()"
|
||||
[versioning]="versioning"
|
||||
[adf-node-permission]="'create'"
|
||||
[adf-nodes]="disableDragArea ? getCurrentDocumentListNode() : []">
|
||||
<div *ngIf="errorMessage" class="error-message">
|
||||
<button (click)="resetError()" mat-icon-button>
|
||||
<mat-icon>highlight_off</mat-icon>
|
||||
@@ -35,26 +53,35 @@
|
||||
<adf-toolbar-divider fxFlex="0 0 auto"></adf-toolbar-divider>
|
||||
|
||||
<div fxFlex="0 0 auto" class="adf-document-action-buttons" fxShow fxHide.lt-sm="true">
|
||||
<button
|
||||
mat-icon-button
|
||||
title="{{ 'DOCUMENT_LIST.TOOLBAR.CARDVIEW' | translate }}"
|
||||
(click)="toogleCardview()">
|
||||
<mat-icon>view_comfy</mat-icon>
|
||||
</button>
|
||||
<button
|
||||
mat-icon-button
|
||||
[disabled]="!canCreateContent(documentList.folderNode)"
|
||||
title="{{ 'DOCUMENT_LIST.TOOLBAR.NEW_FOLDER' | translate }}"
|
||||
[adf-create-folder]="getDocumentListCurrentFolderId()">
|
||||
<mat-icon>create_new_folder</mat-icon>
|
||||
</button>
|
||||
<button mat-icon-button
|
||||
[disabled]="!canEditFolder(documentList.selection)"
|
||||
title="{{ 'DOCUMENT_LIST.TOOLBAR.EDIT_FOLDER' | translate }}"
|
||||
[adf-edit-folder]="documentList.selection[0]?.entry">
|
||||
<mat-icon>create</mat-icon>
|
||||
</button>
|
||||
<button mat-icon-button
|
||||
[disabled]="!hasSelection(documentList.selection)"
|
||||
title="Download"
|
||||
title="{{ 'DOCUMENT_LIST.TOOLBAR.DOWNLOAD' | translate }}"
|
||||
[adfNodeDownload]="documentList.selection">
|
||||
<mat-icon>get_app</mat-icon>
|
||||
</button>
|
||||
<button mat-icon-button
|
||||
adf-node-permission="delete"
|
||||
[adf-nodes]="documentList.selection"
|
||||
title="{{ 'DOCUMENT_LIST.TOOLBAR.DELETE' | translate }}"
|
||||
(delete)="documentList.reload()"
|
||||
[adf-delete]="documentList.selection">
|
||||
<mat-icon>delete</mat-icon>
|
||||
@@ -91,29 +118,34 @@
|
||||
<mat-icon>more_vert</mat-icon>
|
||||
</button>
|
||||
<mat-menu #menu="matMenu">
|
||||
<button mat-menu-item
|
||||
(click)="toogleCardview()">
|
||||
<mat-icon>view_comfy</mat-icon>
|
||||
<span>{{ 'DOCUMENT_LIST.TOOLBAR.CARDVIEW' | translate }}</span>
|
||||
</button>
|
||||
<button mat-menu-item
|
||||
[adf-create-folder]="getDocumentListCurrentFolderId()">
|
||||
<mat-icon>create_new_folder</mat-icon>
|
||||
<span>New folder</span>
|
||||
<span>{{ 'DOCUMENT_LIST.TOOLBAR.NEW_FOLDER' | translate }}</span>
|
||||
</button>
|
||||
<button mat-menu-item
|
||||
[disabled]="!canEditFolder(documentList.selection)"
|
||||
[adf-edit-folder]="documentList.selection[0]?.entry">
|
||||
<mat-icon>create</mat-icon>
|
||||
<span>Edit folder</span>
|
||||
<span>{{ 'DOCUMENT_LIST.TOOLBAR.EDIT_FOLDER' | translate }}</span>
|
||||
</button>
|
||||
<button mat-menu-item
|
||||
[disabled]="!hasSelection(documentList.selection)"
|
||||
title="Download"
|
||||
(click)="downloadNodes(documentList.selection)">
|
||||
<mat-icon>get_app</mat-icon>
|
||||
<span>Download</span>
|
||||
<span>{{ 'DOCUMENT_LIST.TOOLBAR.DOWNLOAD' | translate }}</span>
|
||||
</button>
|
||||
<button mat-menu-item
|
||||
adf-node-permission="delete"
|
||||
[adf-nodes]="documentList.selection">
|
||||
<mat-icon>delete</mat-icon>
|
||||
<span>Delete</span>
|
||||
<span>{{ 'DOCUMENT_LIST.TOOLBAR.DELETE' | translate }}</span>
|
||||
</button>
|
||||
</mat-menu>
|
||||
</adf-toolbar>
|
||||
@@ -128,6 +160,7 @@
|
||||
[allowDropFiles]="true"
|
||||
[selectionMode]="selectionMode"
|
||||
[multiselect]="multiselect"
|
||||
[cardview]="cardview"
|
||||
[node]="nodeResult"
|
||||
(error)="onNavigationError($event)"
|
||||
(success)="resetError()"
|
||||
@@ -276,13 +309,13 @@
|
||||
<ng-template #choose_document_template>
|
||||
<div class="adf-manage-versions-empty">
|
||||
<mat-icon class="adf-manage-versions-empty-icon">face</mat-icon>
|
||||
{{'VERSION.CHOOSE_FILE' | translate}}
|
||||
{{'VERSION.CHOOSE_FILE' | translate}}
|
||||
</div>
|
||||
</ng-template>
|
||||
<ng-template #no_permission_to_versions>
|
||||
<div class="adf-manage-versions-no-permission">
|
||||
<mat-icon class="adf-manage-versions-no-permission-icon">warning</mat-icon>
|
||||
{{'VERSION.NO_PERMISSION' | translate}}
|
||||
{{'VERSION.NO_PERMISSION' | translate}}
|
||||
</div>
|
||||
</ng-template>
|
||||
</div>
|
||||
@@ -292,7 +325,7 @@
|
||||
|
||||
<context-menu-holder></context-menu-holder>
|
||||
|
||||
<div *ngIf="processId" >
|
||||
<div *ngIf="processId">
|
||||
<adf-start-process
|
||||
[values]="formValues"
|
||||
[appId]="processId">
|
||||
@@ -338,9 +371,9 @@
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<mat-slide-toggle [color]="'primary'" [(ngModel)]="maxSizeShow">{{'DOCUMENT_LIST.MAX_SIZE' |
|
||||
translate}}
|
||||
</mat-slide-toggle>
|
||||
<mat-slide-toggle [color]="'primary'" [(ngModel)]="maxSizeShow">{{'DOCUMENT_LIST.MAX_SIZE' |
|
||||
translate}}
|
||||
</mat-slide-toggle>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
@@ -358,15 +391,15 @@
|
||||
<h5>Upload</h5>
|
||||
<section *ngIf="acceptedFilesTypeShow">
|
||||
<mat-form-field floatPlaceholder="float">
|
||||
<input matInput
|
||||
placeholder="Extension accepted"
|
||||
[(ngModel)]="acceptedFilesType"
|
||||
data-automation-id="accepted-files-type">
|
||||
<input matInput
|
||||
placeholder="Extension accepted"
|
||||
[(ngModel)]="acceptedFilesType"
|
||||
data-automation-id="accepted-files-type">
|
||||
</mat-form-field>
|
||||
</section>
|
||||
<section *ngIf="maxSizeShow">
|
||||
<mat-form-field>
|
||||
<input matInput type="number" placeholder="Max file size" [(ngModel)]="maxFilesSize"
|
||||
<input matInput type="number" placeholder="Max file size" [(ngModel)]="maxFilesSize"
|
||||
data-automation-id="max-files-size">
|
||||
</mat-form-field>
|
||||
</section>
|
||||
|
||||
Reference in New Issue
Block a user