Operator screens and process graphics

Device Control `<smart-device-control>`

DeviceControl is a faceplate for a discrete device such as a motor, a pump or an on/off valve.

JavaScript TypeScript Angular React Vue Blazor

<smart-device-control> · 19 properties, 6 methods, 6 events · source/modules/smart.devicecontrol.js

Usage in Blazor

The Razor component is <DeviceControl> in Smart.Blazor.Industrial: every property is a parameter in PascalCase, every event an EventCallback<Event> named On<Event> whose ev["Detail"] is the typed detail class, and the methods are called on the @ref. String choices are enums. In a Blazor Web App (.NET 8 and later) the page needs an interactive render mode, for example @rendermode InteractiveServer; a statically rendered component stays empty.

@using Smart.Blazor.Industrial
@* .NET 8 and later: an interactive render mode, on the page or for the whole app *@
@rendermode InteractiveServer

<DeviceControl @ref="deviceControl" Tag="P-2101A" Interactive="true"
    OnCommandRequest="OnCommandRequest" />

@code {
    DeviceControl deviceControl;

    void OnCommandRequest(Event ev)
    {
        DeviceControlCommandRequestEventDetail detail = ev["Detail"];
    }

    // void RequestCommand(string command)
    void Call() => deviceControl.RequestCommand("value");
}

Properties

Parameter	Type, default	Description
`Tag` tag	string	Sets or gets the device tag, the first word of the accessible name and of every event.
`Description` description	string	Sets or gets the description shown beside the tag.
`Kind` kind	DeviceControlKind motor	Sets or gets the device type: motor, pump or generic devices are started and stopped, a valve is opened and closed.
`State` state	DeviceControlState unknown	Sets or gets the device feedback as reported by the plant: running, stopped, starting, stopping, open, closed, opening, closing, fault or unknown. Feedback that matches the pending request completes the request. A fault is announced to assistive technology.
`Commanded` commanded	string	Sets or gets the last command reported by the plant (start, stop, open or close), shown as the filled command button. A command reported by the plant replaces a pending request from the screen.
`Mode` mode	DeviceControlMode auto	Sets or gets who commands the device: auto (the sequence), manual (the operator), local (a field switch; the screen can request stop or close only) or outOfService. Set by the application in response to the modeRequest event.
`AvailableModes` availableModes	IEnumerable<object> ["auto","manual"]	Sets or gets the modes the operator may ask for, shown as buttons. An entry that is not a string is skipped.
`Quality` quality	DeviceControlQuality good	Sets or gets the quality of the feedback: good, uncertain, bad or stale. Anything but good is shown as a badge and read out. Start and open are refused while the quality is bad or stale. Bad or stale feedback is drawn as not live: the lamp hollow and dashed, the state word grey and italic.
`Interlocked` interlocked	bool false	Sets or gets whether an interlock holds the device: start and open are refused while it does, and the reason is shown.
`InterlockReason` interlockReason	string	Sets or gets the interlock's reason, in plain language.
`Permissives` permissives	IEnumerable<object>	Sets or gets the start permissives as [{ label, met }]. Start and open are refused while one is not met, naming it. A permissive is met only when met is true, a non-zero number, or one of the strings 'true', '1', 'yes', 'on' or 'met'; 'false', 0, 'off', null and anything else are not met. An entry that is not an object is skipped.
`Discrepancy` discrepancy	bool false	Sets or gets the application's finding that the feedback disagrees with the command, started, still stopped, shown as an alarm on the faceplate.
`FaultText` faultText	string	Sets or gets the fault's text, shown and announced with the fault state.
`RunHours` runHours	double	Sets or gets the device's run hours, shown as a counter when given.
`StartCount` startCount	int	Sets or gets the number of starts, shown as a counter when given.
`Interactive` interactive	bool false	Sets or gets whether the screen may command the device at all. Off by default: a command requested from a faceplate the application has not enabled is refused with a reason.
`PendingTimeout` pendingTimeout	int 5000	Sets or gets how long a request is shown as on its way before it is dropped and writeTimeout fires, in milliseconds. A pending request keeps its deadline when the element is moved to another parent.
`ShowPermissives` showPermissives	bool true	Sets or gets whether the permissives are listed on the faceplate.
`Compact` compact	bool false	Sets or gets the compact form, for a strip of devices along an overview. It hides the description, the commanded text, the permissives and the counters, and keeps the tag, the quality badge, the mode chip, the lamp, the state, the notice, the commands (with Reset while faulted) and the mode buttons.

Methods

Method	Description
`void RequestCommand(string command)`	Requests a command: start or stop, open or close. Raises the commandRequest event and shows the command as pending, or raises the blocked event with the reason when the command cannot be requested. A command the device kind does not take, such as open on a pump, is ignored without an event. The same command requested again within one second, or a start or open that is already pending, is dropped. A command the feedback already reports, such as start on a running pump, raises commandRequest without being shown as pending. Does nothing while the faceplate is disabled. `command` string The command.
`void RequestMode(string mode)`	Requests a change of mode by raising the modeRequest event. The application responds by setting the mode property. Does nothing when the faceplate is not interactive or is disabled, when the mode is not in availableModes, or when it is already the current mode. `mode` string One of the availableModes.
`void RequestReset()`	Requests a fault reset by raising the resetRequest event, while the state is fault. Does nothing when the faceplate is not interactive or is disabled.
`void Refuse(string reason)`	Called by the application when it does not carry out the pending request. The request is no longer shown as pending and the reason is shown instead. `reason` string Why, in plain language.
`Task<string> PendingCommand()`	Returns the command shown as pending, or null.
`Task<bool> CanRequest(string command)`	Returns whether a command could be requested now. Stop and close need an interactive, enabled faceplate, in any mode. Start and open also need manual mode, live feedback (quality not bad or stale), no interlock and every permissive met. Returns false for a command the device kind does not take. `command` string The command.

Events

Every event is an EventCallback<Event>; Event is a dictionary and ev["Detail"] converts to the detail class named under the event.

Event	Description and detail
`OnCommandRequest` commandRequest DeviceControlCommandRequestEventDetail	This event is triggered when a command is requested. The application writes the command to the plant and reports the feedback through the state property; until then the faceplate shows the command as pending. `Tag` string The device tag. `Command` string start, stop, open or close.
`OnModeRequest` modeRequest DeviceControlModeRequestEventDetail	This event is triggered when a mode is requested. The application answers by setting mode. `Tag` string The device tag. `Mode` string The requested mode.
`OnResetRequest` resetRequest DeviceControlResetRequestEventDetail	This event is triggered when a fault reset is requested. `Tag` string The device tag.
`OnBlocked` blocked DeviceControlBlockedEventDetail	This event is triggered when a start, stop, open or close command could not be requested: the screen is not interactive, or, for start and open, the device is not in manual or is under local control, the feedback is bad or stale, an interlock holds it, or a permissive is not met. `Tag` string The device tag. `Command` string The command. `Reason` string Why, in plain language.
`OnWriteTimeout` writeTimeout DeviceControlWriteTimeoutEventDetail	This event is triggered when a pending request got no feedback within pendingTimeout and was dropped. `Tag` string The device tag. `Command` string The command that was pending.
`OnStateChange` stateChange DeviceControlStateChangeEventDetail	This event is triggered when the feedback state changes. `Tag` string The device tag. `State` string The new state. `OldState` string The previous state.

Types

`enum DeviceControlKind`

DeviceControlKind.Motor "motor" DeviceControlKind.Pump "pump" DeviceControlKind.Valve "valve" DeviceControlKind.Generic "generic"

`enum DeviceControlState`

DeviceControlState.Running "running" DeviceControlState.Stopped "stopped" DeviceControlState.Starting "starting" DeviceControlState.Stopping "stopping" DeviceControlState.Open "open" DeviceControlState.Closed "closed" DeviceControlState.Opening "opening" DeviceControlState.Closing "closing" DeviceControlState.Fault "fault" DeviceControlState.Unknown "unknown"

`enum DeviceControlMode`

DeviceControlMode.Auto "auto" DeviceControlMode.Manual "manual" DeviceControlMode.Local "local" DeviceControlMode.OutOfService "outOfService"

`enum DeviceControlQuality`

DeviceControlQuality.Good "good" DeviceControlQuality.Uncertain "uncertain" DeviceControlQuality.Bad "bad" DeviceControlQuality.Stale "stale"

CSS variables

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

--smart-device-width --smart-device-lamp-size --smart-device-panel --smart-device-header --smart-device-border --smart-device-ok --smart-device-warning --smart-device-critical --smart-device-accent --smart-device-neutral