mirror of
https://github.com/Alfresco/alfresco-content-app.git
synced 2025-05-12 17:04:46 +00:00
[ACS-4124] Display tags applied to file in files list (#2974)
* [ACS-4124] Display tags applied to file in files list * [ACS-4124] CR fixes * [ACS-4124] Hide tags for smaller displays * [ACS-4124] E2e fixes * [ACS-4124] E2e fixes
This commit is contained in:
parent
f4c80741e6
commit
a6e6f08df0
@ -90,7 +90,7 @@ describe('Favorites', () => {
|
||||
});
|
||||
|
||||
it('[C280482] has the correct columns', async () => {
|
||||
const expectedColumns = ['Name', 'Location', 'Size', 'Modified', 'Modified by'];
|
||||
const expectedColumns = ['Name', 'Location', 'Size', 'Modified', 'Modified by', 'Tags'];
|
||||
const actualColumns = await dataTable.getColumnHeadersText();
|
||||
|
||||
await expect(actualColumns).toEqual(expectedColumns);
|
||||
|
@ -102,7 +102,7 @@ describe('File Libraries', () => {
|
||||
});
|
||||
|
||||
it('[C217095] has the correct columns', async () => {
|
||||
const expectedColumns = ['Name', 'Description', 'My Role', 'Visibility'];
|
||||
const expectedColumns = ['Name', 'Description', 'My Role', 'Visibility', 'Tags'];
|
||||
const actualColumns = await dataTable.getColumnHeadersText();
|
||||
|
||||
await expect(actualColumns).toEqual(expectedColumns);
|
||||
@ -167,7 +167,7 @@ describe('File Libraries', () => {
|
||||
});
|
||||
|
||||
it('[C289893] has the correct columns', async () => {
|
||||
const expectedColumns = ['Name', 'Description', 'My Role', 'Visibility'];
|
||||
const expectedColumns = ['Name', 'Description', 'My Role', 'Visibility', 'Tags'];
|
||||
const actualColumns = await dataTable.getColumnHeadersText();
|
||||
|
||||
await expect(actualColumns).toEqual(expectedColumns);
|
||||
|
@ -79,7 +79,7 @@ describe('Personal Files', () => {
|
||||
});
|
||||
|
||||
it('[C217142] has the correct columns', async () => {
|
||||
const expectedColumns = ['Name', 'Size', 'Modified', 'Modified by'];
|
||||
const expectedColumns = ['Name', 'Size', 'Modified', 'Modified by', 'Tags'];
|
||||
const actualColumns = await dataTable.getColumnHeadersText();
|
||||
|
||||
await expect(actualColumns).toEqual(expectedColumns);
|
||||
|
@ -84,7 +84,7 @@ describe('Recent Files', () => {
|
||||
});
|
||||
|
||||
it('[C213168] has the correct columns', async () => {
|
||||
const expectedColumns = ['Name', 'Location', 'Size', 'Modified'];
|
||||
const expectedColumns = ['Name', 'Location', 'Size', 'Modified', 'Tags'];
|
||||
const actualColumns = await dataTable.getColumnHeadersText();
|
||||
|
||||
await expect(actualColumns).toEqual(expectedColumns);
|
||||
|
@ -90,7 +90,7 @@ describe('Shared Files', () => {
|
||||
});
|
||||
|
||||
it('[C213113] has the correct columns', async () => {
|
||||
const expectedColumns = ['Name', 'Location', 'Size', 'Modified', 'Modified by', 'Shared by'];
|
||||
const expectedColumns = ['Name', 'Location', 'Size', 'Modified', 'Modified by', 'Shared by', 'Tags'];
|
||||
const actualColumns = await dataTable.getColumnHeadersText();
|
||||
|
||||
await expect(actualColumns).toEqual(expectedColumns);
|
||||
|
@ -105,7 +105,7 @@ describe('Search results - files and folders', () => {
|
||||
const size = fileEntry.entry.content.sizeInBytes;
|
||||
|
||||
expect(await dataTable.isItemPresent(file)).toBe(true, `${file} is not displayed`);
|
||||
expect(await dataTable.getRowCellsCount(file)).toEqual(6, 'incorrect number of columns');
|
||||
expect(await dataTable.getRowCellsCount(file)).toEqual(7, 'incorrect number of columns');
|
||||
expect(await page.getName(file)).toBe(`${file} ( ${fileTitle} )`);
|
||||
expect(await page.getDescription(file)).toBe(fileDescription);
|
||||
expect(await page.getModified(file)).toBe(modifiedDate);
|
||||
@ -125,7 +125,7 @@ describe('Search results - files and folders', () => {
|
||||
const modifiedBy = folderEntry.entry.modifiedByUser.displayName;
|
||||
|
||||
expect(await dataTable.isItemPresent(folder)).toBe(true, `${folder} is not displayed`);
|
||||
expect(await dataTable.getRowCellsCount(file)).toEqual(6, 'incorrect number of columns');
|
||||
expect(await dataTable.getRowCellsCount(file)).toEqual(7, 'incorrect number of columns');
|
||||
expect(await page.getName(folder)).toBe(`${folder} ( ${folderTitle} )`);
|
||||
expect(await page.getDescription(folder)).toBe(folderDescription);
|
||||
expect(await page.getModified(folder)).toBe(modifiedDate);
|
||||
|
@ -187,7 +187,7 @@ describe('Search results - libraries', () => {
|
||||
await searchInput.searchFor(site1.name);
|
||||
await dataTable.waitForBody();
|
||||
|
||||
const expectedColumns = ['Name', 'Description', 'My Role', 'Visibility'];
|
||||
const expectedColumns = ['Name', 'Description', 'My Role', 'Visibility', 'Tags'];
|
||||
const actualColumns = await dataTable.getColumnHeadersText();
|
||||
|
||||
await expect(actualColumns).toEqual(expectedColumns);
|
||||
|
@ -2076,6 +2076,17 @@
|
||||
"sortable": true,
|
||||
"desktopOnly": true,
|
||||
"order": 50
|
||||
},
|
||||
{
|
||||
"id": "app.filer.tags",
|
||||
"template": "app.columns.tags",
|
||||
"key": "tags",
|
||||
"title": "APP.DOCUMENT_LIST.COLUMNS.TAGS",
|
||||
"class": "adf-full-width adf-expand-cell-4",
|
||||
"type": "text",
|
||||
"sortable": false,
|
||||
"desktopOnly": true,
|
||||
"order": 60
|
||||
}
|
||||
],
|
||||
"libraries": [
|
||||
@ -2130,6 +2141,17 @@
|
||||
"template": "app.columns.libraryStatus",
|
||||
"desktopOnly": true,
|
||||
"order": 50
|
||||
},
|
||||
{
|
||||
"id": "app.filer.tags",
|
||||
"template": "app.columns.tags",
|
||||
"key": "tags",
|
||||
"title": "APP.DOCUMENT_LIST.COLUMNS.TAGS",
|
||||
"class": "adf-full-width adf-expand-cell-4",
|
||||
"type": "text",
|
||||
"sortable": false,
|
||||
"desktopOnly": true,
|
||||
"order": 60
|
||||
}
|
||||
],
|
||||
"favoriteLibraries": [
|
||||
@ -2184,6 +2206,17 @@
|
||||
"template": "app.columns.libraryStatus",
|
||||
"desktopOnly": true,
|
||||
"order": 50
|
||||
},
|
||||
{
|
||||
"id": "app.filer.tags",
|
||||
"template": "app.columns.tags",
|
||||
"key": "tags",
|
||||
"title": "APP.DOCUMENT_LIST.COLUMNS.TAGS",
|
||||
"class": "adf-full-width adf-expand-cell-4",
|
||||
"type": "text",
|
||||
"sortable": false,
|
||||
"desktopOnly": true,
|
||||
"order": 60
|
||||
}
|
||||
],
|
||||
"shared": [
|
||||
@ -2262,6 +2295,17 @@
|
||||
"sortable": true,
|
||||
"desktopOnly": true,
|
||||
"order": 70
|
||||
},
|
||||
{
|
||||
"id": "app.filer.tags",
|
||||
"template": "app.columns.tags",
|
||||
"key": "tags",
|
||||
"title": "APP.DOCUMENT_LIST.COLUMNS.TAGS",
|
||||
"class": "adf-full-width adf-expand-cell-4",
|
||||
"type": "text",
|
||||
"sortable": false,
|
||||
"desktopOnly": true,
|
||||
"order": 80
|
||||
}
|
||||
],
|
||||
"recent": [
|
||||
@ -2316,6 +2360,17 @@
|
||||
"sortable": true,
|
||||
"desktopOnly": true,
|
||||
"order": 50
|
||||
},
|
||||
{
|
||||
"id": "app.filer.tags",
|
||||
"template": "app.columns.tags",
|
||||
"key": "tags",
|
||||
"title": "APP.DOCUMENT_LIST.COLUMNS.TAGS",
|
||||
"class": "adf-full-width adf-expand-cell-4",
|
||||
"type": "text",
|
||||
"sortable": false,
|
||||
"desktopOnly": true,
|
||||
"order": 60
|
||||
}
|
||||
],
|
||||
"favorites": [
|
||||
@ -2380,6 +2435,17 @@
|
||||
"sortable": true,
|
||||
"desktopOnly": true,
|
||||
"order": 60
|
||||
},
|
||||
{
|
||||
"id": "app.filer.tags",
|
||||
"template": "app.columns.tags",
|
||||
"key": "tags",
|
||||
"title": "APP.DOCUMENT_LIST.COLUMNS.TAGS",
|
||||
"class": "adf-full-width adf-expand-cell-4",
|
||||
"type": "text",
|
||||
"sortable": false,
|
||||
"desktopOnly": true,
|
||||
"order": 70
|
||||
}
|
||||
],
|
||||
"trashcan": [
|
||||
@ -2489,6 +2555,17 @@
|
||||
"template": "app.columns.libraryStatus",
|
||||
"desktopOnly": true,
|
||||
"order": 50
|
||||
},
|
||||
{
|
||||
"id": "app.filer.tags",
|
||||
"template": "app.columns.tags",
|
||||
"key": "tags",
|
||||
"title": "APP.DOCUMENT_LIST.COLUMNS.TAGS",
|
||||
"class": "adf-full-width adf-expand-cell-4",
|
||||
"type": "text",
|
||||
"sortable": false,
|
||||
"desktopOnly": true,
|
||||
"order": 60
|
||||
}
|
||||
]
|
||||
}
|
||||
|
@ -288,7 +288,8 @@
|
||||
"SHARED_BY": "Shared by",
|
||||
"DELETED_ON": "Deleted",
|
||||
"DELETED_BY": "Deleted by",
|
||||
"ROLE": "My Role"
|
||||
"ROLE": "My Role",
|
||||
"TAGS": "Tags"
|
||||
},
|
||||
"TOOLBAR": {
|
||||
"CARDVIEW": "Card view mode",
|
||||
|
@ -120,6 +120,7 @@ import { AppLayoutComponent } from './components/layout/app-layout/app-layout.co
|
||||
import { AppTrashcanModule } from './components/trashcan/trashcan.module';
|
||||
import { AppSharedLinkViewModule } from './components/shared-link-view/shared-link-view.module';
|
||||
import { AcaFolderRulesModule } from '@alfresco/aca-folder-rules';
|
||||
import { TagsColumnComponent } from './components/dl-custom-components/tags-column/tags-column.component';
|
||||
|
||||
registerLocaleData(localeFr);
|
||||
registerLocaleData(localeDe);
|
||||
@ -226,6 +227,7 @@ export class ContentServiceExtensionModule {
|
||||
'app.columns.libraryStatus': LibraryStatusColumnComponent,
|
||||
'app.columns.trashcanName': TrashcanNameColumnComponent,
|
||||
'app.columns.location': LocationLinkComponent,
|
||||
'app.columns.tags': TagsColumnComponent,
|
||||
'app.toolbar.toggleEditOffline': ToggleEditOfflineComponent,
|
||||
'app.toolbar.viewNode': ViewNodeComponent,
|
||||
'app.languagePicker': LanguagePickerComponent,
|
||||
|
@ -31,10 +31,11 @@ import { ContentModule } from '@alfresco/adf-content-services';
|
||||
import { MaterialModule } from '../../material.module';
|
||||
import { CoreModule } from '@alfresco/adf-core';
|
||||
import { ThumbnailColumnComponent } from './thumbnail-column/thumbnail-column.component';
|
||||
import { TagsColumnComponent } from './tags-column/tags-column.component';
|
||||
|
||||
@NgModule({
|
||||
imports: [BrowserModule, CoreModule.forChild(), ContentModule.forChild(), MaterialModule, LockedByModule],
|
||||
declarations: [CustomNameColumnComponent, ThumbnailColumnComponent],
|
||||
exports: [CustomNameColumnComponent, ThumbnailColumnComponent]
|
||||
declarations: [CustomNameColumnComponent, ThumbnailColumnComponent, TagsColumnComponent],
|
||||
exports: [CustomNameColumnComponent, ThumbnailColumnComponent, TagsColumnComponent]
|
||||
})
|
||||
export class DocumentListCustomComponentsModule {}
|
||||
|
@ -0,0 +1,15 @@
|
||||
.aca-tags-name-column {
|
||||
display: flex;
|
||||
width: inherit;
|
||||
|
||||
adf-tag-node-list {
|
||||
width: inherit;
|
||||
|
||||
.adf-tag-chips {
|
||||
background-color: white;
|
||||
border: 1px solid var(--theme-text-color);
|
||||
border-radius: 10px;
|
||||
color: var(--theme-text-color);
|
||||
}
|
||||
}
|
||||
}
|
@ -0,0 +1,54 @@
|
||||
/*!
|
||||
* @license
|
||||
* Alfresco Example Content Application
|
||||
*
|
||||
* Copyright (C) 2005 - 2020 Alfresco Software Limited
|
||||
*
|
||||
* This file is part of the Alfresco Example Content Application.
|
||||
* If the software was purchased under a paid Alfresco license, the terms of
|
||||
* the paid license agreement will prevail. Otherwise, the software is
|
||||
* provided under the following open source license terms:
|
||||
*
|
||||
* The Alfresco Example Content Application is free software: you can redistribute it and/or modify
|
||||
* it under the terms of the GNU Lesser General Public License as published by
|
||||
* the Free Software Foundation, either version 3 of the License, or
|
||||
* (at your option) any later version.
|
||||
*
|
||||
* The Alfresco Example Content Application is distributed in the hope that it will be useful,
|
||||
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
* GNU Lesser General Public License for more details.
|
||||
*
|
||||
* You should have received a copy of the GNU Lesser General Public License
|
||||
* along with Alfresco. If not, see <http://www.gnu.org/licenses/>.
|
||||
*/
|
||||
|
||||
import { ShareDataRow } from '@alfresco/adf-content-services';
|
||||
import { ChangeDetectorRef, Component, Input, ViewEncapsulation } from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'aca-tags-column',
|
||||
template: `
|
||||
<adf-tag-node-list [showDelete]="false" [limitTagsDisplayed]="true" [nodeId]="getNodeId(context.row)" (results)="onTagsLoaded()">
|
||||
</adf-tag-node-list>
|
||||
`,
|
||||
styleUrls: ['./tags-column.component.scss'],
|
||||
encapsulation: ViewEncapsulation.None,
|
||||
host: {
|
||||
class: 'adf-datatable-content-cell aca-tags-name-column'
|
||||
}
|
||||
})
|
||||
export class TagsColumnComponent {
|
||||
@Input()
|
||||
context: any;
|
||||
|
||||
constructor(private cd: ChangeDetectorRef) {}
|
||||
|
||||
getNodeId(row: ShareDataRow): string {
|
||||
return row.id;
|
||||
}
|
||||
|
||||
onTagsLoaded(): void {
|
||||
this.cd.detectChanges();
|
||||
}
|
||||
}
|
@ -71,6 +71,11 @@
|
||||
<data-column key="content.sizeInBytes" type="fileSize" title="APP.DOCUMENT_LIST.COLUMNS.SIZE" class="adf-no-grow-cell adf-ellipsis-cell" [sortable]="false" *ngIf="!isSmallScreen"></data-column>
|
||||
<data-column key="modifiedAt" type="date" title="APP.DOCUMENT_LIST.COLUMNS.MODIFIED_ON" class="adf-no-grow-cell adf-ellipsis-cell" format="timeAgo" [sortable]="false" *ngIf="!isSmallScreen"></data-column>
|
||||
<data-column key="modifiedByUser.displayName" title="APP.DOCUMENT_LIST.COLUMNS.MODIFIED_BY" class="adf-no-grow-cell adf-ellipsis-cell" [sortable]="false" *ngIf="!isSmallScreen"></data-column>
|
||||
<data-column key="$tags" type="text" title="APP.DOCUMENT_LIST.COLUMNS.TAGS" class="adf-full-width adf-expand-cell-4" [sortable]="false">
|
||||
<ng-template let-context>
|
||||
<aca-tags-column [context]="context"></aca-tags-column>
|
||||
</ng-template>
|
||||
</data-column>
|
||||
</data-columns>
|
||||
|
||||
<adf-custom-empty-content-template>
|
||||
|
Loading…
x
Reference in New Issue
Block a user