diff --git a/projects/components/src/table/columns/table-edit-columns-modal.component.ts b/projects/components/src/table/columns/table-edit-columns-modal.component.ts index d6a68e8a8..6946c4ea6 100644 --- a/projects/components/src/table/columns/table-edit-columns-modal.component.ts +++ b/projects/components/src/table/columns/table-edit-columns-modal.component.ts @@ -1,6 +1,5 @@ import { ChangeDetectionStrategy, Component, Inject } from '@angular/core'; import { ButtonRole } from '../../button/button'; -import { FilterAttribute } from '../../filtering/filter/filter-attribute'; import { ModalRef, MODAL_DATA } from '../../modal/modal'; import { TableColumnConfigExtended } from '../table.service'; @@ -50,12 +49,12 @@ export class TableEditColumnsModalComponent { @Inject(MODAL_DATA) public readonly modalData: TableColumnConfigExtended[] ) { this.editColumns = this.modalData - .filter(column => !this.isMetaTypeColumn(column.attribute)) + .filter(column => !this.isMetaTypeColumn(column)) .sort((a, b) => (a.visible === b.visible ? 0 : a.visible ? -1 : 1)); } - private isMetaTypeColumn(attribute: FilterAttribute | undefined): boolean { - return attribute === undefined || attribute.type.startsWith('$$'); + private isMetaTypeColumn(column: TableColumnConfigExtended): boolean { + return column.id.startsWith('$$') || (column.attribute !== undefined && column.attribute.type.startsWith('$$')); } public isLastRemainingColumn(column: TableColumnConfigExtended): boolean { diff --git a/projects/components/src/table/header/table-header-cell-renderer.component.test.ts b/projects/components/src/table/header/table-header-cell-renderer.component.test.ts index 0d90d1a7f..9396fc096 100644 --- a/projects/components/src/table/header/table-header-cell-renderer.component.test.ts +++ b/projects/components/src/table/header/table-header-cell-renderer.component.test.ts @@ -113,9 +113,7 @@ describe('Table Header Cell Renderer', () => { } }); - spectator.click('.options-button'); - expect(spectator.query('.sort-ascending', { root: true })).not.toExist(); - expect(spectator.query('.sort-descending', { root: true })).not.toExist(); + expect(spectator.query('.options-button', { root: true })).not.toExist(); }); test('should create tooltip correctly', () => { diff --git a/projects/components/src/table/header/table-header-cell-renderer.component.ts b/projects/components/src/table/header/table-header-cell-renderer.component.ts index 47c026f5d..90db5ec34 100644 --- a/projects/components/src/table/header/table-header-cell-renderer.component.ts +++ b/projects/components/src/table/header/table-header-cell-renderer.component.ts @@ -35,14 +35,18 @@ import { TableColumnConfigExtended } from '../table.service'; [htTooltip]="this.getTooltip(this.columnConfig.titleTooltip, this.columnConfig.title)" class="table-header-cell-renderer" > - +
{{ this.columnConfig.title }}
- + + +
+
+ @@ -54,9 +58,9 @@ import { TableColumnConfigExtended } from '../table.service';
Filter Values
-
+
Sort Ascending @@ -65,19 +69,15 @@ import { TableColumnConfigExtended } from '../table.service'; Sort Descending
-
- + +
Edit Columns
- - -
-
` @@ -115,6 +115,8 @@ export class TableHeaderCellRendererComponent implements OnInit, OnChanges { public classes: string[] = []; public isFilterable: boolean = false; + public isEditableAvailableColumns: boolean = false; + public isShowOptionButton: boolean = false; @ViewChild('htmlTooltip') public htmlTooltipTemplate?: TemplateRef; @@ -132,6 +134,9 @@ export class TableHeaderCellRendererComponent implements OnInit, OnChanges { if (changes.columnConfig || changes.metadata) { this.isFilterable = this.isAttributeFilterable(); + this.isEditableAvailableColumns = this.areAnyAvailableColumnsEditable(); + this.isShowOptionButton = + this.isFilterable || this.isEditableAvailableColumns || this.columnConfig?.sortable === true; } } @@ -183,6 +188,18 @@ export class TableHeaderCellRendererComponent implements OnInit, OnChanges { ); } + private areAnyAvailableColumnsEditable(): boolean { + if (this.availableColumns === undefined) { + return false; + } + + return this.availableColumns.some(column => this.isColumnEditable(column)); + } + + private isColumnEditable(columnConfig: TableColumnConfigExtended): boolean { + return columnConfig.editable === true; + } + public onFilterValues(): void { this.isFilterable && this.modalService.createModal({