[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:
MichalKinas
2023-02-15 17:29:25 +01:00
committed by GitHub
parent f4c80741e6
commit a6e6f08df0
14 changed files with 167 additions and 12 deletions

View File

@@ -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,

View File

@@ -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 {}

View File

@@ -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);
}
}
}

View File

@@ -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();
}
}

View File

@@ -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>