dendi-wang/thingsboard
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

UI: Add time format for timeseries table

Browse Source
This commit is contained in:
Artem Dzhereleiko 2023-11-23 18:16:12 +02:00
parent ef26f18d5a
commit 9117f9cf55
4 changed files with 22 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
ui-ngx/src/app/modules/home/components/widget/lib/settings/cards/timeseries-table-widget-settings.component.html
View File

@ -36,6 +36,19 @@
<mat-slide-toggle class="mat-slide" formControlName="showMilliseconds">
{{ 'widgets.table.display-milliseconds' | translate }}
</mat-slide-toggle>
<div class="tb-form-row space-between column-xs">
<div translate>widgets.table.time-format</div>
<mat-form-field appearance="outline" subscriptSizing="dynamic">
<mat-select formControlName="timeFormat">
<mat-option [value]="'12h'">
{{ 'widgets.table.time-format-12h' | translate }}
</mat-option>
<mat-option [value]="'24h'">
{{ 'widgets.table.time-format-24h' | translate }}
</mat-option>
</mat-select>
</mat-form-field>
</div>
<mat-slide-toggle class="mat-slide" formControlName="enableStickyAction">
{{ 'widgets.table.enable-sticky-action' | translate }}
</mat-slide-toggle>

2
ui-ngx/src/app/modules/home/components/widget/lib/settings/cards/timeseries-table-widget-settings.component.ts
View File

@ -48,6 +48,7 @@ export class TimeseriesTableWidgetSettingsComponent extends WidgetSettingsCompon
reserveSpaceForHiddenAction: 'true',
showTimestamp: true,
showMilliseconds: false,
timeFormat: '24h',
displayPagination: true,
useEntityLabel: false,
defaultPageSize: 10,
@ -68,6 +69,7 @@ export class TimeseriesTableWidgetSettingsComponent extends WidgetSettingsCompon
reserveSpaceForHiddenAction: [settings.reserveSpaceForHiddenAction, []],
showTimestamp: [settings.showTimestamp, []],
showMilliseconds: [settings.showMilliseconds, []],
timeFormat: [settings.timeFormat, []],
displayPagination: [settings.displayPagination, []],
useEntityLabel: [settings.useEntityLabel, []],
defaultPageSize: [settings.defaultPageSize, [Validators.min(1)]],

4
ui-ngx/src/app/modules/home/components/widget/lib/timeseries-table-widget.component.ts
View File

@ -99,6 +99,7 @@ export interface TimeseriesTableWidgetSettings extends TableWidgetSettings {
showTimestamp: boolean;
showMilliseconds: boolean;
hideEmptyLines: boolean;
timeFormat: '12h' | '24h';
}
interface TimeseriesWidgetLatestDataKeySettings extends TableWidgetDataKeySettings {
@ -320,7 +321,8 @@ export class TimeseriesTableWidgetComponent extends PageComponent implements OnI
this.hideEmptyLines = isDefined(this.settings.hideEmptyLines) ? this.settings.hideEmptyLines : false;
this.useEntityLabel = isDefined(this.widgetConfig.settings.useEntityLabel) ? this.widgetConfig.settings.useEntityLabel : false;
this.showTimestamp = this.settings.showTimestamp !== false;
this.dateFormatFilter = (this.settings.showMilliseconds !== true) ? 'yyyy-MM-dd HH:mm:ss' : 'yyyy-MM-dd HH:mm:ss.SSS';
const timeFormat: '12h' | '24h' = isDefined(this.settings.timeFormat) ? this.settings.timeFormat : '24h';
this.dateFormatFilter = `yyyy-MM-dd ${timeFormat === '24h' ? 'HH' : 'hh'}:mm:ss${this.settings.showMilliseconds ? '.SSS' : ''}`;
this.rowStylesInfo = getRowStyleInfo(this.settings, 'rowData, ctx');

5
ui-ngx/src/assets/locale/locale.constant-en_US.json
View File

@ -6318,7 +6318,10 @@
"timeseries-column-error": "At least one timeseries column should be specified",
"alarm-column-error": "At least one alarm column should be specified",
"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",
"time-format": "Time format",
"time-format-12h": "12H",
"time-format-24h": "24H"
},
"wind-speed-direction": {
"layout": "Layout",