Maintenance and sites
Asset Card <smart-asset-card>
AssetCard is one machine as maintenance sees it: how long it has run, when it is next due for service, how it is doing and what is open against it.
<smart-asset-card> · 17 properties, 0 methods, 3 events · source/modules/smart.assetcard.js
Usage in TypeScript
The package ships its definitions: AssetCard is the element type and AssetCardProperties the properties, both exported from smart-industrial/source/typescript/smart.industrial. document.querySelector('smart-asset-card') is typed as AssetCard.
import { AssetCard, AssetCardProperties } from 'smart-industrial/source/typescript/smart.industrial';
const assetCard = document.querySelector('smart-asset-card') as AssetCard;
assetCard.name = 'Feed pump P-101';
assetCard.addEventListener('workOrderRequest', (event: CustomEvent) => console.log(event.detail));
Properties
| Property | Type, default | Description |
|---|---|---|
name | string | Sets or retrieves the name of the asset. It is the heading of the card and its accessible name. |
assetId | string | Sets or retrieves the asset's identifier, as the plant's maintenance system knows it. |
model | string | Sets or retrieves the maker and model. |
location | string | Sets or retrieves where the asset stands. |
state | AssetCardState | Sets or retrieves the machine's state. Only fault, maintenance and offline are marked; running and stopped are text. |
runHours | number | Sets or retrieves the run hours, from the PLC's counter. |
starts | number? | Sets or retrieves the number of starts, from the PLC's counter. Null hides it. |
serviceInterval | number | Sets or retrieves the hours between services. 0 for an asset without an hours-based interval, which the card says rather than drawing an empty bar. |
lastServiceHours | number | Sets or retrieves the run hours at the last service. The next is due at this plus the interval. When runHours is below it - a counter reset or replaced, or a service entered wrong - the card says the counter needs checking instead of showing a full interval. |
lastServiceDate | string | Sets or retrieves when the last service was done, as an ISO date. |
lastServiceBy | string | Sets or retrieves who did the last service. |
dueSoon | number | Sets or retrieves how much of the interval is left, as a fraction, when the service is marked due soon. |
condition | array | Sets or retrieves the condition readings as [{ label, value, unit, status, limit, direction }]. status is normal, warning or alarm; a reading out of band says so in words, with its limit. A warning names its side: direction 'high' or 'low' when given, otherwise high when a numeric value is above its limit and low when below it, and 'warning' when neither can be told. |
workOrders | array | Sets or retrieves the work orders as [{ id, title, status, priority, due }]. Done orders are not listed. Assign a new array to update the component. |
compact | boolean | Sets or retrieves whether the card shows only the name, the state and the service: for a wall of assets. |
readOnly | boolean | Sets or retrieves whether the card only shows. Request work and Record service are removed; work orders can still be opened. |
busy | boolean | Sets or retrieves whether the application is sending a request or recording a service. Send and Record wait. |
Events
The data of an event is in event.detail. workOrderRequest and serviceRecord are requests: the asset card raises them only while readOnly and busy are false and keeps workOrders, lastServiceHours and lastServiceDate until the application sets them. workOrderOpen reports a click on a listed work order.
| Event | Description and detail |
|---|---|
workOrderRequest | This event is triggered when the operator sends a request for work on the asset.assetId string The asset's identifier.text string What needs doing.priority string high, normal or low. |
serviceRecord | This event is triggered when a service is recorded, after the confirmation. The card does not restart the interval itself: the application records it and sets lastServiceHours.assetId string The asset's identifier.runHours number The run hours the service was done at. |
workOrderOpen | This event is triggered when a work order is opened from the card, for the application to show it.id string The id of the work order.assetId string The asset's identifier. |
Types
type AssetCardState
'running' | 'stopped' | 'fault' | 'maintenance' | 'offline'
CSS variables
The component declares 5 CSS variables; the CSS page shows how to set them.
--smart-asset-card-fill --smart-asset-card-warning --smart-asset-card-alarm --smart-asset-card-alarm-text --smart-asset-card-mono