Alarms and status

Alarm Banner <smart-alarm-banner>

AlarmBanner shows the alarms an operator should deal with next.

<smart-alarm-banner> · 6 properties, 2 methods, 2 events · source/modules/smart.alarmbanner.js

Usage in Angular

The Angular wrapper is AlarmBannerComponent from AlarmBannerModule: every property is an input, every event an output named on<Event>, and the methods are called on the component reference from @ViewChild. A method that returns a value returns a Promise of it, resolved once the component has rendered; its ...Sync() twin returns the value at once, or null before the component has rendered. Unknown bindings are rejected at compile time.

import { AlarmBannerModule, AlarmBannerComponent } from 'smart-industrial/angular/alarmbanner';

<smart-alarm-banner #alarmBanner [showAcknowledge]="true"
    (onAcknowledge)="onAcknowledge($event)"></smart-alarm-banner>

@ViewChild('alarmBanner', { read: AlarmBannerComponent }) alarmBanner!: AlarmBannerComponent;
// methods are called on the component reference
this.alarmBanner.acknowledgeAll();

Properties

Input	Type, default	Description
[acknowledgeLabel] acknowledgeLabel	string	Sets or retrieves the caption of the acknowledge button. It is empty by default, so the caption comes from the acknowledge message ("Ack" in English) and follows the locale. A value set here takes precedence over the message.
[alarms] alarms	array	Sets or retrieves the alarms. Each entry is an object with: id - the identifier of the alarm, returned in the events; tag - the instrument or point tag; message - the alarm text; priority - a number, or a number written as text, as in ISA-18.2: 0 and 1 critical, 2 warning, 3 and above advisory; severity - critical, warning or advisory (any case), which overrides the priority mapping and, for a record without a priority, sets its place in the order; timestamp - a Date, epoch milliseconds or a value Date can parse, shown as the time, or the date and time when it is not today; acknowledged - whether an operator has acknowledged the alarm; active - false once the condition has cleared (absent means active), so an unacknowledged alarm with active false is shown as returned to normal; shelvedUntil, suppressed, outOfService - an alarm shelved into the future, suppressed or out of service is not shown. Flags written as the text "false", "0", "no" or "off" are false. Assign a new array to update the component, or call redraw after modifying the array in place; an array that is deep-equal to the current one does not trigger a redraw.
[emptyMessage] emptyMessage	string	Sets or retrieves the text shown when there are no alarms to display. It is empty by default, so the text comes from the empty message ("No active alarms" in English) and follows the locale. A value set here takes precedence over the message.
[maxVisible] maxVisible	number 1	Sets or retrieves the number of alarms shown at once. One row is usual for an operator screen; a larger stack suits a wall display that covers several areas.
[showAcknowledge] showAcknowledge	boolean true	Sets or retrieves whether an acknowledge button is shown on unacknowledged alarms. The default is true. Boolean attributes are presence-based, so show-acknowledge="false" in markup enables the button; set the property from script to disable it.
[showTimestamps] showTimestamps	boolean true	Sets or retrieves whether the alarm timestamp is rendered. Same attribute caveat as showAcknowledge: set the property from script to turn it off.

Methods

Method	Description
acknowledgeAll(): void	Raises the acknowledge event once for every unacknowledged alarm the banner would show, including alarms that returned to normal unacknowledged; shelved, suppressed and out-of-service alarms are left alone. Nothing is raised while the banner is disabled. The component does not change the alarms; the application applies the acknowledgements and returns an updated list.
visibleAlarms(): Promise<any> and visibleAlarmsSync(): any	Returns the alarms the banner is currently showing, in the order shown: active unacknowledged, returned to normal unacknowledged, acknowledged; then priority, severity and age.

Events

The data of an event is in event.detail. acknowledge is a request: the alarm banner keeps alarms as they are until the application sets acknowledged on the alarm and hands the list back. alarmClick reports a click on an alarm row.

Output	Description and detail
(onAcknowledge) acknowledge	This event is triggered when an operator acknowledges an alarm, either from its acknowledge button or through acknowledgeAll. One press raises one event: the repeats of a held Enter or Space are ignored, and the same alarm acknowledged again within 600 ms (a double click) is not raised twice. alarm any The alarm being acknowledged.
(onAlarmClick) alarmClick	This event is triggered when an alarm row is clicked anywhere other than its acknowledge button, typically used to open the alarm's detail. alarm any The alarm that was clicked.

CSS variables

The component declares 2 CSS variables; the CSS page shows how to set them.

--smart-alarm-banner-blink-duration --smart-alarm-banner-row-gap