PROD-5684: Setting to disable sorting in Entity-group tables and Table-widgets

This commit is contained in:
Tarnavskiy 2025-02-28 11:39:43 +02:00
parent 5f41a359c0
commit 343df41a26
14 changed files with 42 additions and 14 deletions

View File

@ -78,7 +78,7 @@
</mat-cell> </mat-cell>
</ng-container> </ng-container>
<ng-container [matColumnDef]="column.def" *ngFor="let column of columns; let $index = index; trackBy: trackByColumnDef;"> <ng-container [matColumnDef]="column.def" *ngFor="let column of columns; let $index = index; trackBy: trackByColumnDef;">
<mat-header-cell [style]="headerStyle(column)" *matHeaderCellDef mat-sort-header [disabled]="isSorting(column)"> <mat-header-cell [style]="headerStyle(column)" *matHeaderCellDef mat-sort-header [disabled]="!column.sortable">
{{ column.title }} {{ column.title }}
</mat-header-cell> </mat-header-cell>
<mat-cell *matCellDef="let alarm; let row = index" <mat-cell *matCellDef="let alarm; let row = index"

View File

@ -429,6 +429,7 @@ export class AlarmsTableWidgetComponent extends PageComponent implements OnInit,
dataKey.label = this.utils.customTranslation(dataKey.label, dataKey.label); dataKey.label = this.utils.customTranslation(dataKey.label, dataKey.label);
dataKey.title = getHeaderTitle(dataKey, keySettings, this.utils); dataKey.title = getHeaderTitle(dataKey, keySettings, this.utils);
dataKey.def = 'def' + this.columns.length; dataKey.def = 'def' + this.columns.length;
dataKey.sortable = !keySettings.disableSorting && !(dataKey.type === DataKeyType.alarm && dataKey.name.startsWith('details.'));
if (dataKey.type === DataKeyType.alarm && !isDefined(keySettings.columnWidth)) { if (dataKey.type === DataKeyType.alarm && !isDefined(keySettings.columnWidth)) {
const alarmField = alarmFields[dataKey.name]; const alarmField = alarmFields[dataKey.name];
if (alarmField && alarmField.time) { if (alarmField && alarmField.time) {
@ -1146,10 +1147,6 @@ export class AlarmsTableWidgetComponent extends PageComponent implements OnInit,
} }
} }
isSorting(column: EntityColumn): boolean {
return column.type === DataKeyType.alarm && column.name.startsWith('details.');
}
private clearCache() { private clearCache() {
this.cellContentCache.length = 0; this.cellContentCache.length = 0;
this.cellStyleCache.length = 0; this.cellStyleCache.length = 0;

View File

@ -448,7 +448,8 @@ export class EntitiesTableWidgetComponent extends PageComponent implements OnIni
dataKey.label = this.utils.customTranslation(dataKey.label, dataKey.label); dataKey.label = this.utils.customTranslation(dataKey.label, dataKey.label);
dataKey.title = getHeaderTitle(dataKey, keySettings, this.utils); dataKey.title = getHeaderTitle(dataKey, keySettings, this.utils);
dataKey.def = 'def' + this.columns.length; dataKey.def = 'def' + this.columns.length;
dataKey.sortable = !dataKey.usePostProcessing && (!dataKey.aggregationType || dataKey.aggregationType === AggregationType.NONE); dataKey.sortable = !keySettings.disableSorting && !dataKey.usePostProcessing
&& (!dataKey.aggregationType ||dataKey.aggregationType === AggregationType.NONE);
if (dataKey.type === DataKeyType.entityField && if (dataKey.type === DataKeyType.entityField &&
!isDefined(keySettings.columnWidth) || keySettings.columnWidth === '0px') { !isDefined(keySettings.columnWidth) || keySettings.columnWidth === '0px') {
const entityField = entityFields[dataKey.name]; const entityField = entityFields[dataKey.name];

View File

@ -59,6 +59,11 @@
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
</div> </div>
<div class="tb-form-row">
<mat-slide-toggle class="mat-slide" formControlName="disableSorting">
{{ 'widgets.table.disable-sorting' | translate }}
</mat-slide-toggle>
</div>
</div> </div>
<div class="tb-form-panel tb-slide-toggle"> <div class="tb-form-panel tb-slide-toggle">
<mat-expansion-panel class="tb-settings" [expanded]="alarmsTableKeySettingsForm.get('useCellStyleFunction').value"> <mat-expansion-panel class="tb-settings" [expanded]="alarmsTableKeySettingsForm.get('useCellStyleFunction').value">

View File

@ -47,7 +47,8 @@ export class AlarmsTableKeySettingsComponent extends WidgetSettingsComponent {
useCellContentFunction: false, useCellContentFunction: false,
cellContentFunction: '', cellContentFunction: '',
defaultColumnVisibility: 'visible', defaultColumnVisibility: 'visible',
columnSelectionToDisplay: 'enabled' columnSelectionToDisplay: 'enabled',
disableSorting: false
}; };
} }
@ -61,6 +62,7 @@ export class AlarmsTableKeySettingsComponent extends WidgetSettingsComponent {
cellContentFunction: [settings.cellContentFunction, [Validators.required]], cellContentFunction: [settings.cellContentFunction, [Validators.required]],
defaultColumnVisibility: [settings.defaultColumnVisibility, []], defaultColumnVisibility: [settings.defaultColumnVisibility, []],
columnSelectionToDisplay: [settings.columnSelectionToDisplay, []], columnSelectionToDisplay: [settings.columnSelectionToDisplay, []],
disableSorting: [settings.disableSorting, []]
}); });
} }

View File

@ -47,6 +47,11 @@
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
</div> </div>
<div class="tb-form-row">
<mat-slide-toggle class="mat-slide" formControlName="disableSorting">
{{ 'widgets.table.disable-sorting' | translate }}
</mat-slide-toggle>
</div>
</div> </div>
<div class="tb-form-panel tb-slide-toggle"> <div class="tb-form-panel tb-slide-toggle">
<mat-expansion-panel class="tb-settings" [expanded]="timeseriesTableKeySettingsForm.get('useCellStyleFunction').value"> <mat-expansion-panel class="tb-settings" [expanded]="timeseriesTableKeySettingsForm.get('useCellStyleFunction').value">

View File

@ -45,7 +45,8 @@ export class TimeseriesTableKeySettingsComponent extends WidgetSettingsComponent
useCellContentFunction: false, useCellContentFunction: false,
cellContentFunction: '', cellContentFunction: '',
defaultColumnVisibility: 'visible', defaultColumnVisibility: 'visible',
columnSelectionToDisplay: 'enabled' columnSelectionToDisplay: 'enabled',
disableSorting: false
}; };
} }
@ -57,6 +58,7 @@ export class TimeseriesTableKeySettingsComponent extends WidgetSettingsComponent
cellContentFunction: [settings.cellContentFunction, [Validators.required]], cellContentFunction: [settings.cellContentFunction, [Validators.required]],
defaultColumnVisibility: [settings.defaultColumnVisibility, []], defaultColumnVisibility: [settings.defaultColumnVisibility, []],
columnSelectionToDisplay: [settings.columnSelectionToDisplay, []], columnSelectionToDisplay: [settings.columnSelectionToDisplay, []],
disableSorting: [settings.disableSorting, []]
}); });
} }

View File

@ -56,6 +56,11 @@
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
</div> </div>
<div class="tb-form-row">
<mat-slide-toggle class="mat-slide" formControlName="disableSorting">
{{ 'widgets.table.disable-sorting' | translate }}
</mat-slide-toggle>
</div>
</div> </div>
<div [class.!hidden]="!timeseriesTableLatestKeySettingsForm.get('show').value" class="tb-form-panel tb-slide-toggle"> <div [class.!hidden]="!timeseriesTableLatestKeySettingsForm.get('show').value" class="tb-form-panel tb-slide-toggle">
<mat-expansion-panel class="tb-settings" [expanded]="timeseriesTableLatestKeySettingsForm.get('useCellStyleFunction').value"> <mat-expansion-panel class="tb-settings" [expanded]="timeseriesTableLatestKeySettingsForm.get('useCellStyleFunction').value">

View File

@ -46,7 +46,8 @@ export class TimeseriesTableLatestKeySettingsComponent extends WidgetSettingsCom
useCellContentFunction: false, useCellContentFunction: false,
cellContentFunction: '', cellContentFunction: '',
defaultColumnVisibility: 'visible', defaultColumnVisibility: 'visible',
columnSelectionToDisplay: 'enabled' columnSelectionToDisplay: 'enabled',
disableSorting: false
}; };
} }
@ -60,6 +61,7 @@ export class TimeseriesTableLatestKeySettingsComponent extends WidgetSettingsCom
cellContentFunction: [settings.cellContentFunction, [Validators.required]], cellContentFunction: [settings.cellContentFunction, [Validators.required]],
defaultColumnVisibility: [settings.defaultColumnVisibility, []], defaultColumnVisibility: [settings.defaultColumnVisibility, []],
columnSelectionToDisplay: [settings.columnSelectionToDisplay, []], columnSelectionToDisplay: [settings.columnSelectionToDisplay, []],
disableSorting: [settings.disableSorting, []]
}); });
} }

View File

@ -59,6 +59,11 @@
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
</div> </div>
<div class="tb-form-row">
<mat-slide-toggle class="mat-slide" formControlName="disableSorting">
{{ 'widgets.table.disable-sorting' | translate }}
</mat-slide-toggle>
</div>
</div> </div>
<div class="tb-form-panel tb-slide-toggle"> <div class="tb-form-panel tb-slide-toggle">
<mat-expansion-panel class="tb-settings" [expanded]="entitiesTableKeySettingsForm.get('useCellStyleFunction').value"> <mat-expansion-panel class="tb-settings" [expanded]="entitiesTableKeySettingsForm.get('useCellStyleFunction').value">

View File

@ -47,7 +47,8 @@ export class EntitiesTableKeySettingsComponent extends WidgetSettingsComponent {
useCellContentFunction: false, useCellContentFunction: false,
cellContentFunction: '', cellContentFunction: '',
defaultColumnVisibility: 'visible', defaultColumnVisibility: 'visible',
columnSelectionToDisplay: 'enabled' columnSelectionToDisplay: 'enabled',
disableSorting: false
}; };
} }
@ -61,6 +62,7 @@ export class EntitiesTableKeySettingsComponent extends WidgetSettingsComponent {
cellContentFunction: [settings.cellContentFunction, [Validators.required]], cellContentFunction: [settings.cellContentFunction, [Validators.required]],
defaultColumnVisibility: [settings.defaultColumnVisibility, []], defaultColumnVisibility: [settings.defaultColumnVisibility, []],
columnSelectionToDisplay: [settings.columnSelectionToDisplay, []], columnSelectionToDisplay: [settings.columnSelectionToDisplay, []],
disableSorting: [settings.disableSorting, []]
}); });
} }

View File

@ -61,6 +61,7 @@ export interface TableWidgetDataKeySettings {
cellContentFunction?: TbFunction; cellContentFunction?: TbFunction;
defaultColumnVisibility?: ColumnVisibilityOptions; defaultColumnVisibility?: ColumnVisibilityOptions;
columnSelectionToDisplay?: ColumnSelectionOptions; columnSelectionToDisplay?: ColumnSelectionOptions;
disableSorting?: boolean;
} }
export type ShowCellButtonActionFunction = (ctx: WidgetContext, data: EntityData | AlarmDataInfo | FormattedData) => boolean; export type ShowCellButtonActionFunction = (ctx: WidgetContext, data: EntityData | AlarmDataInfo | FormattedData) => boolean;
@ -145,7 +146,7 @@ export function entityDataSortOrderFromString(strSortOrder: string, columns: Ent
if (!column) { if (!column) {
column = findColumnByName(property, columns); column = findColumnByName(property, columns);
} }
if (column && column.entityKey) { if (column && column.entityKey && column.sortable) {
return {key: column.entityKey, direction}; return {key: column.entityKey, direction};
} }
return null; return null;

View File

@ -518,8 +518,8 @@ export class TimeseriesTableWidgetComponent extends PageComponent implements OnI
const latestDataKeys = datasource.latestDataKeys; const latestDataKeys = datasource.latestDataKeys;
let header: TimeseriesHeader[] = []; let header: TimeseriesHeader[] = [];
dataKeys.forEach((dataKey, index) => { dataKeys.forEach((dataKey, index) => {
const sortable = !dataKey.usePostProcessing;
const keySettings: TableWidgetDataKeySettings = dataKey.settings; const keySettings: TableWidgetDataKeySettings = dataKey.settings;
const sortable = !keySettings.disableSorting && !dataKey.usePostProcessing;
const styleInfo = getCellStyleInfo(this.ctx, keySettings, 'value, rowData, ctx'); const styleInfo = getCellStyleInfo(this.ctx, keySettings, 'value, rowData, ctx');
const contentFunctionInfo = getCellContentFunctionInfo(this.ctx, keySettings, 'value, rowData, ctx'); const contentFunctionInfo = getCellContentFunctionInfo(this.ctx, keySettings, 'value, rowData, ctx');
const columnDefaultVisibility = getColumnDefaultVisibility(keySettings, this.ctx); const columnDefaultVisibility = getColumnDefaultVisibility(keySettings, this.ctx);
@ -544,8 +544,8 @@ export class TimeseriesTableWidgetComponent extends PageComponent implements OnI
if (latestDataKeys) { if (latestDataKeys) {
latestDataKeys.forEach((dataKey, latestIndex) => { latestDataKeys.forEach((dataKey, latestIndex) => {
const index = dataKeys.length + latestIndex; const index = dataKeys.length + latestIndex;
const sortable = !dataKey.usePostProcessing;
const keySettings: TimeseriesWidgetLatestDataKeySettings = dataKey.settings; const keySettings: TimeseriesWidgetLatestDataKeySettings = dataKey.settings;
const sortable = !keySettings.disableSorting && !dataKey.usePostProcessing;
const styleInfo = getCellStyleInfo(this.ctx, keySettings, 'value, rowData, ctx'); const styleInfo = getCellStyleInfo(this.ctx, keySettings, 'value, rowData, ctx');
const contentFunctionInfo = getCellContentFunctionInfo(this.ctx, keySettings, 'value, rowData, ctx'); const contentFunctionInfo = getCellContentFunctionInfo(this.ctx, keySettings, 'value, rowData, ctx');
const columnDefaultVisibility = getColumnDefaultVisibility(keySettings, this.ctx); const columnDefaultVisibility = getColumnDefaultVisibility(keySettings, this.ctx);

View File

@ -8164,7 +8164,8 @@
"timeseries-column-error": "At least one time series column should be specified", "timeseries-column-error": "At least one time series column should be specified",
"alarm-column-error": "At least one alarm column should be specified", "alarm-column-error": "At least one alarm column should be specified",
"table-tabs": "Table tabs", "table-tabs": "Table tabs",
"show-cell-actions-menu-mobile": "Show cell actions dropdown menu in mobile mode" "show-cell-actions-menu-mobile": "Show cell actions dropdown menu in mobile mode",
"disable-sorting": "Disable sorting"
}, },
"latest-chart": { "latest-chart": {
"total": "Total", "total": "Total",