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

UI: improved usability of bulk operations in alarm widget table

Browse Source
This commit is contained in:
rusikv 2023-11-06 16:56:21 +02:00
parent 33abe0ebe5
commit 15703a7c01
1 changed files with 50 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -888,30 +888,38 @@ export class AlarmsTableWidgetComponent extends PageComponent implements OnInit,
$event.stopPropagation(); $event.stopPropagation();
} }
if (this.alarmsDatasource.selection.hasValue()) { if (this.alarmsDatasource.selection.hasValue()) {
const alarmIds = this.alarmsDatasource.selection.selected.filter( const unacknowledgedAlarms = this.alarmsDatasource.selection.selected.filter(
(alarmId) => alarmId !== NULL_UUID (alarm) => alarm.id.id !== NULL_UUID && (alarm.status === AlarmStatus.CLEARED_UNACK ||
alarm.status === AlarmStatus.ACTIVE_UNACK)
); );
if (alarmIds.length) { let title = '';
const title = this.translate.instant('alarm.aknowledge-alarms-title', {count: alarmIds.length}); let content = '';
const content = this.translate.instant('alarm.aknowledge-alarms-text', {count: alarmIds.length}); if (!unacknowledgedAlarms.length) {
title = this.translate.instant('alarm.selected-alarms', {count: unacknowledgedAlarms.length});
content = this.translate.instant('alarm.selected-alarms-are-acknowledged');
this.dialogService.alert(
title,
content
).subscribe();
} else {
title = this.translate.instant('alarm.aknowledge-alarms-title', {count: unacknowledgedAlarms.length});
content = this.translate.instant('alarm.aknowledge-alarms-text', {count: unacknowledgedAlarms.length});
this.dialogService.confirm( this.dialogService.confirm(
title, title,
content, content,
this.translate.instant('action.no'), this.translate.instant('action.no'),
this.translate.instant('action.yes') this.translate.instant('action.yes')
).subscribe((res) => { ).subscribe((res) => {
if (res) {
if (res) { if (res) {
const tasks: Observable<AlarmInfo>[] = []; const tasks: Observable<AlarmInfo>[] = [];
for (const alarmId of alarmIds) { for (const alarm of unacknowledgedAlarms) {
tasks.push(this.alarmService.ackAlarm(alarmId)); tasks.push(this.alarmService.ackAlarm(alarm.id.id));
} }
forkJoin(tasks).subscribe(() => { forkJoin(tasks).subscribe(() => {
this.alarmsDatasource.clearSelection(); this.alarmsDatasource.clearSelection();
this.subscription.update(); this.subscription.update();
}); });
} }
}
}); });
} }
} }
@ -944,30 +952,38 @@ export class AlarmsTableWidgetComponent extends PageComponent implements OnInit,
$event.stopPropagation(); $event.stopPropagation();
} }
if (this.alarmsDatasource.selection.hasValue()) { if (this.alarmsDatasource.selection.hasValue()) {
const alarmIds = this.alarmsDatasource.selection.selected.filter( const activeAlarms = this.alarmsDatasource.selection.selected.filter(
(alarmId) => alarmId !== NULL_UUID (alarm) => alarm.id.id !== NULL_UUID && (alarm.status === AlarmStatus.ACTIVE_ACK ||
alarm.status === AlarmStatus.ACTIVE_UNACK)
); );
if (alarmIds.length) { let title = '';
const title = this.translate.instant('alarm.clear-alarms-title', {count: alarmIds.length}); let content = '';
const content = this.translate.instant('alarm.clear-alarms-text', {count: alarmIds.length}); if (!activeAlarms.length) {
title = this.translate.instant('alarm.selected-alarms', {count: activeAlarms.length});
content = this.translate.instant('alarm.selected-alarms-are-cleared');
this.dialogService.alert(
title,
content
).subscribe();
} else {
title = this.translate.instant('alarm.clear-alarms-title', {count: activeAlarms.length});
content = this.translate.instant('alarm.clear-alarms-text', {count: activeAlarms.length});
this.dialogService.confirm( this.dialogService.confirm(
title, title,
content, content,
this.translate.instant('action.no'), this.translate.instant('action.no'),
this.translate.instant('action.yes') this.translate.instant('action.yes')
).subscribe((res) => { ).subscribe((res) => {
if (res) {
if (res) { if (res) {
const tasks: Observable<AlarmInfo>[] = []; const tasks: Observable<AlarmInfo>[] = [];
for (const alarmId of alarmIds) { for (const alarm of activeAlarms) {
tasks.push(this.alarmService.clearAlarm(alarmId)); tasks.push(this.alarmService.clearAlarm(alarm.id.id));
} }
forkJoin(tasks).subscribe(() => { forkJoin(tasks).subscribe(() => {
this.alarmsDatasource.clearSelection(); this.alarmsDatasource.clearSelection();
this.subscription.update(); this.subscription.update();
}); });
} }
}
}); });
} }
} }
@ -1124,7 +1140,8 @@ class AlarmsDatasource implements DataSource<AlarmDataInfo> {
private alarmsSubject = new BehaviorSubject<AlarmDataInfo[]>([]); private alarmsSubject = new BehaviorSubject<AlarmDataInfo[]>([]);
private pageDataSubject = new BehaviorSubject<PageData<AlarmDataInfo>>(emptyPageData<AlarmDataInfo>()); private pageDataSubject = new BehaviorSubject<PageData<AlarmDataInfo>>(emptyPageData<AlarmDataInfo>());
public selection = new SelectionModel<string>(true, [], false); public selection = new SelectionModel<AlarmDataInfo>(true, [], false,
(alarm1: AlarmDataInfo, alarm2: AlarmDataInfo) => alarm1.id.id === alarm2.id.id);
private selectionModeChanged = new EventEmitter<boolean>(); private selectionModeChanged = new EventEmitter<boolean>();
@ -1202,7 +1219,7 @@ class AlarmsDatasource implements DataSource<AlarmDataInfo> {
} }
if (this.selection.hasValue()) { if (this.selection.hasValue()) {
const alarmIds = alarms.map((alarm) => alarm.id.id); const alarmIds = alarms.map((alarm) => alarm.id.id);
const toRemove = this.selection.selected.filter(alarmId => alarmIds.indexOf(alarmId) === -1); const toRemove = this.selection.selected.filter(alarm => alarmIds.indexOf(alarm.id.id) === -1);
this.selection.deselect(...toRemove); this.selection.deselect(...toRemove);
if (this.selection.isEmpty()) { if (this.selection.isEmpty()) {
isEmptySelection = true; isEmptySelection = true;
@ -1276,14 +1293,14 @@ class AlarmsDatasource implements DataSource<AlarmDataInfo> {
toggleSelection(alarm: AlarmDataInfo) { toggleSelection(alarm: AlarmDataInfo) {
const hasValue = this.selection.hasValue(); const hasValue = this.selection.hasValue();
this.selection.toggle(alarm.id.id); this.selection.toggle(alarm);
if (hasValue !== this.selection.hasValue()) { if (hasValue !== this.selection.hasValue()) {
this.onSelectionModeChanged(this.selection.hasValue()); this.onSelectionModeChanged(this.selection.hasValue());
} }
} }
isSelected(alarm: AlarmDataInfo): boolean { isSelected(alarm: AlarmDataInfo): boolean {
return this.selection.isSelected(alarm.id.id); return this.selection.isSelected(alarm);
} }
clearSelection() { clearSelection() {
@ -1304,7 +1321,7 @@ class AlarmsDatasource implements DataSource<AlarmDataInfo> {
} }
} else { } else {
alarms.forEach(row => { alarms.forEach(row => {
this.selection.select(row.id.id); this.selection.select(row);
}); });
if (numSelected === 0) { if (numSelected === 0) {
this.onSelectionModeChanged(true); this.onSelectionModeChanged(true);