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

UI: refactoring and disabled collapse on single cell action

Browse Source
This commit is contained in:
Artem Dzhereleiko 2023-07-07 15:05:30 +03:00
parent 4194d2b194
commit 72b50e8926
14 changed files with 26 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -125,7 +125,7 @@
<mat-cell *matCellDef="let alarm" [ngStyle.gt-md]="{ minWidth: (alarmsDatasource.countCellButtonAction * 48) + 'px',
maxWidth: (alarmsDatasource.countCellButtonAction * 48) + 'px',
width: (alarmsDatasource.countCellButtonAction * 48) + 'px' }">
<div [fxHide]="hideActionCellButtons" fxShow.gt-md fxFlex fxLayout="row" fxLayoutAlign="end">
<div [fxHide]="collapseCellActions" fxShow.gt-md fxFlex fxLayout="row" fxLayoutAlign="end">
<ng-container *ngFor="let actionDescriptor of alarm.actionCellButtons; trackBy: trackByActionCellDescriptionId">
<span *ngIf="!actionDescriptor.icon" style="width: 40px;"></span>
<button mat-icon-button [disabled]="(isLoading$ | async) || !actionEnabled(alarm, actionDescriptor)"
@ -137,7 +137,7 @@
</button>
</ng-container>
</div>
<div fxHide [fxShow.lt-lg]="hideActionCellButtons" *ngIf="alarm.hasActions">
<div fxHide [fxShow.lt-lg]="collapseCellActions" *ngIf="alarm.hasActions">
<button mat-icon-button
(click)="$event.stopPropagation(); ctx.detectChanges();"
[matMenuTriggerFor]="cellActionsMenu">

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

@ -181,7 +181,7 @@ export class AlarmsTableWidgetComponent extends PageComponent implements OnInit,
public displayPagination = true;
public enableStickyHeader = true;
public enableStickyAction = false;
public hideActionCellButtons = true;
public collapseCellActions = true;
public pageSizeOptions;
public pageLink: AlarmDataPageLink;
public sortOrderProperty: string;
@ -366,7 +366,7 @@ export class AlarmsTableWidgetComponent extends PageComponent implements OnInit,
this.displayPagination = isDefined(this.settings.displayPagination) ? this.settings.displayPagination : true;
this.enableStickyHeader = isDefined(this.settings.enableStickyHeader) ? this.settings.enableStickyHeader : true;
this.enableStickyAction = isDefined(this.settings.enableStickyAction) ? this.settings.enableStickyAction : false;
this.hideActionCellButtons = isDefined(this.settings.hideActionCellButtons) ? this.settings.hideActionCellButtons : true;
this.collapseCellActions = isDefined(this.settings.collapseCellActions) ? this.settings.collapseCellActions : true;
this.columnDisplayAction.show = isDefined(this.settings.enableSelectColumnDisplay) ? this.settings.enableSelectColumnDisplay : true;
let enableFilter;
if (isDefined(this.settings.enableFilter)) {

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

@ -55,7 +55,7 @@
<mat-cell *matCellDef="let entity" [ngStyle.gt-md]="{ minWidth: (entityDatasource.countCellButtonAction * 48) + 'px',
maxWidth: (entityDatasource.countCellButtonAction * 48) + 'px',
width: (entityDatasource.countCellButtonAction * 48) + 'px' }">
<div [fxHide]="hideActionCellButtons" fxShow.gt-md fxFlex fxLayout="row" fxLayoutAlign="end">
<div [fxHide]="collapseCellActions && entityDatasource.countCellButtonAction !== 1" fxShow.gt-md fxFlex fxLayout="row" fxLayoutAlign="end">
<ng-container *ngFor="let actionDescriptor of entity.actionCellButtons; trackBy: trackByActionCellDescriptionId">
<span *ngIf="!actionDescriptor.icon" style="width: 40px;"></span>
<button mat-icon-button [disabled]="isLoading$ | async"
@ -67,7 +67,7 @@
</button>
</ng-container>
</div>
<div fxHide [fxShow.lt-lg]="hideActionCellButtons" *ngIf="entity.hasActions">
<div fxHide [fxShow.lt-lg]="collapseCellActions && entityDatasource.countCellButtonAction !== 1" *ngIf="entity.hasActions">
<button mat-icon-button
(click)="$event.stopPropagation(); ctx.detectChanges();"
[matMenuTriggerFor]="cellActionsMenu">

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

@ -142,7 +142,7 @@ export class EntitiesTableWidgetComponent extends PageComponent implements OnIni
public displayPagination = true;
public enableStickyHeader = true;
public enableStickyAction = true;
public hideActionCellButtons = true;
public collapseCellActions = true;
public pageSizeOptions;
public pageLink: EntityDataPageLink;
public sortOrderProperty: string;
@ -292,7 +292,7 @@ export class EntitiesTableWidgetComponent extends PageComponent implements OnIni
this.displayPagination = isDefined(this.settings.displayPagination) ? this.settings.displayPagination : true;
this.enableStickyHeader = isDefined(this.settings.enableStickyHeader) ? this.settings.enableStickyHeader : true;
this.enableStickyAction = isDefined(this.settings.enableStickyAction) ? this.settings.enableStickyAction : true;
this.hideActionCellButtons = isDefined(this.settings.hideActionCellButtons) ? this.settings.hideActionCellButtons : true;
this.collapseCellActions = isDefined(this.settings.collapseCellActions) ? this.settings.collapseCellActions : true;
this.columnDisplayAction.show = isDefined(this.settings.enableSelectColumnDisplay) ? this.settings.enableSelectColumnDisplay : true;
this.rowStylesInfo = getRowStyleInfo(this.settings, 'entity, ctx');

4
ui-ngx/src/app/modules/home/components/widget/lib/settings/alarm/alarms-table-widget-settings.component.html
View File

@ -51,8 +51,8 @@
<mat-slide-toggle class="mat-slide" formControlName="enableStickyAction">
{{ 'widgets.table.enable-sticky-action' | translate }}
</mat-slide-toggle>
<mat-slide-toggle class="mat-slide" formControlName="hideActionCellButtons">
{{ 'widgets.table.hide-action-cell-buttons' | translate }}
<mat-slide-toggle class="mat-slide" formControlName="collapseCellActions">
{{ 'widgets.table.collapse-cell-actions-mobile' | translate }}
</mat-slide-toggle>
</div>
<div class="tb-form-panel stroked">

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

@ -47,7 +47,7 @@ export class AlarmsTableWidgetSettingsComponent extends WidgetSettingsComponent
enableFilter: true,
enableStickyHeader: true,
enableStickyAction: true,
hideActionCellButtons: true,
collapseCellActions: true,
reserveSpaceForHiddenAction: 'true',
displayDetails: true,
allowAcknowledgment: true,
@ -70,7 +70,7 @@ export class AlarmsTableWidgetSettingsComponent extends WidgetSettingsComponent
enableFilter: [settings.enableFilter, []],
enableStickyHeader: [settings.enableStickyHeader, []],
enableStickyAction: [settings.enableStickyAction, []],
hideActionCellButtons: [settings.hideActionCellButtons, []],
collapseCellActions: [settings.collapseCellActions, []],
reserveSpaceForHiddenAction: [settings.reserveSpaceForHiddenAction, []],
displayDetails: [settings.displayDetails, []],
allowAcknowledgment: [settings.allowAcknowledgment, []],

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

@ -66,8 +66,8 @@
<mat-slide-toggle class="mat-slide" formControlName="enableStickyAction">
{{ 'widgets.table.enable-sticky-action' | translate }}
</mat-slide-toggle>
<mat-slide-toggle class="mat-slide" formControlName="hideActionCellButtons">
{{ 'widgets.table.hide-action-cell-buttons' | translate }}
<mat-slide-toggle class="mat-slide" formControlName="collapseCellActions">
{{ 'widgets.table.collapse-cell-actions-mobile' | translate }}
</mat-slide-toggle>
</div>
<mat-form-field fxFlex subscriptSizing="dynamic">

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

@ -45,7 +45,7 @@ export class EntitiesTableWidgetSettingsComponent extends WidgetSettingsComponen
enableSelectColumnDisplay: true,
enableStickyHeader: true,
enableStickyAction: true,
hideActionCellButtons: true,
collapseCellActions: true,
reserveSpaceForHiddenAction: 'true',
displayEntityName: true,
entityNameColumnTitle: '',
@ -67,7 +67,7 @@ export class EntitiesTableWidgetSettingsComponent extends WidgetSettingsComponen
enableSelectColumnDisplay: [settings.enableSelectColumnDisplay, []],
enableStickyHeader: [settings.enableStickyHeader, []],
enableStickyAction: [settings.enableStickyAction, []],
hideActionCellButtons: [settings.hideActionCellButtons, []],
collapseCellActions: [settings.collapseCellActions, []],
reserveSpaceForHiddenAction: [settings.reserveSpaceForHiddenAction, []],
displayEntityName: [settings.displayEntityName, []],
entityNameColumnTitle: [settings.entityNameColumnTitle, []],

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

@ -39,8 +39,8 @@
<mat-slide-toggle class="mat-slide" formControlName="enableStickyAction">
{{ 'widgets.table.enable-sticky-action' | translate }}
</mat-slide-toggle>
<mat-slide-toggle class="mat-slide" formControlName="hideActionCellButtons">
{{ 'widgets.table.hide-action-cell-buttons' | translate }}
<mat-slide-toggle class="mat-slide" formControlName="collapseCellActions">
{{ 'widgets.table.collapse-cell-actions-mobile' | translate }}
</mat-slide-toggle>
<mat-form-field fxFlex subscriptSizing="dynamic">
<mat-label translate>widgets.table.hidden-cell-button-display-mode</mat-label>

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

@ -44,7 +44,7 @@ export class TimeseriesTableWidgetSettingsComponent extends WidgetSettingsCompon
enableSelectColumnDisplay: true,
enableStickyHeader: true,
enableStickyAction: true,
hideActionCellButtons: true,
collapseCellActions: true,
reserveSpaceForHiddenAction: 'true',
showTimestamp: true,
showMilliseconds: false,
@ -64,7 +64,7 @@ export class TimeseriesTableWidgetSettingsComponent extends WidgetSettingsCompon
enableSelectColumnDisplay: [settings.enableSelectColumnDisplay, []],
enableStickyHeader: [settings.enableStickyHeader, []],
enableStickyAction: [settings.enableStickyAction, []],
hideActionCellButtons: [settings.hideActionCellButtons, []],
collapseCellActions: [settings.collapseCellActions, []],
reserveSpaceForHiddenAction: [settings.reserveSpaceForHiddenAction, []],
showTimestamp: [settings.showTimestamp, []],
showMilliseconds: [settings.showMilliseconds, []],

2
ui-ngx/src/app/modules/home/components/widget/lib/table-widget.models.ts
View File

@ -33,7 +33,7 @@ export interface TableWidgetSettings {
enableSearch: boolean;
enableSelectColumnDisplay: boolean;
enableStickyAction: boolean;
hideActionCellButtons: boolean;
collapseCellActions: boolean;
enableStickyHeader: boolean;
displayPagination: boolean;
defaultPageSize: number;

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

@ -67,7 +67,7 @@
<mat-cell *matCellDef="let row" [ngStyle.gt-md]="{ minWidth: (source.timeseriesDatasource.countCellButtonAction * 48) + 'px',
maxWidth: (source.timeseriesDatasource.countCellButtonAction * 48) + 'px',
width: (source.timeseriesDatasource.countCellButtonAction * 48) + 'px' }">
<div [fxHide]="hideActionCellButtons" fxShow.gt-md fxFlex fxLayout="row" fxLayoutAlign="end">
<div [fxHide]="collapseCellActions && source.timeseriesDatasource.countCellButtonAction !== 1" fxShow.gt-md fxFlex fxLayout="row" fxLayoutAlign="end">
<ng-container *ngFor="let actionDescriptor of row.actionCellButtons; trackBy: trackByActionCellDescriptionId">
<span *ngIf="!actionDescriptor.icon" style="width: 40px;"></span>
<button *ngIf="actionDescriptor.icon"
@ -79,7 +79,7 @@
</button>
</ng-container>
</div>
<div fxHide [fxShow.lt-lg]="hideActionCellButtons" *ngIf="row.hasActions">
<div fxHide [fxShow.lt-lg]="collapseCellActions && source.timeseriesDatasource.countCellButtonAction !== 1" *ngIf="row.hasActions">
<button mat-icon-button
(click)="$event.stopPropagation(); ctx.detectChanges();"
[matMenuTriggerFor]="cellActionsMenu">

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

@ -154,7 +154,7 @@ export class TimeseriesTableWidgetComponent extends PageComponent implements OnI
public displayPagination = true;
public enableStickyHeader = true;
public enableStickyAction = true;
public hideActionCellButtons = true;
public collapseCellActions = true;
public pageSizeOptions;
public textSearchMode = false;
public hidePageSize = false;
@ -307,7 +307,7 @@ export class TimeseriesTableWidgetComponent extends PageComponent implements OnI
this.displayPagination = isDefined(this.settings.displayPagination) ? this.settings.displayPagination : true;
this.enableStickyHeader = isDefined(this.settings.enableStickyHeader) ? this.settings.enableStickyHeader : true;
this.enableStickyAction = isDefined(this.settings.enableStickyAction) ? this.settings.enableStickyAction : true;
this.hideActionCellButtons = isDefined(this.settings.hideActionCellButtons) ? this.settings.hideActionCellButtons : true;
this.collapseCellActions = isDefined(this.settings.collapseCellActions) ? this.settings.collapseCellActions : true;
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;

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

@ -5270,7 +5270,7 @@
"rows": "Rows",
"timeseries-column-error": "At least one timeseries column should be specified",
"table-tabs": "Table tabs",
"hide-action-cell-buttons": "Hide action cell buttons"
"collapse-cell-actions-mobile": "Collapse cell actions in mobile view"
},
"value-source": {
"value-source": "Value source",