Recipes, orders and scheduled jobs

Order Queue <smart-order-queue>

OrderQueue shows what a line is making, how far along it is, and what comes next.

<smart-order-queue> · 8 properties, 0 methods, 1 events · source/modules/smart.orderqueue.js

Usage in Vue

Vue uses the custom element directly. A property is bound with :kebab-name; an array or an object needs the .prop modifier so that Vue sets the property rather than an attribute. Events are listened to with @eventName; methods are called on the element through a template ref.

import 'smart-industrial/source/modules/smart.orderqueue.js';

<smart-order-queue ref="orderQueue" :label="'Line 3 orders'"
    @orderAction="onEvent"></smart-order-queue>



// an array or an object is set as a property, not converted to an attribute: use .prop
<smart-order-queue :orders.prop="orders"></smart-order-queue>

Properties

Binding	Type, default	Description
:orders orders	array	Sets or retrieves the orders as [{ id, product, quantity, unit, due, recipe, status, produced, started, finished }], the shape a Scada Studio station returns from /api/orders. status is queued, running, paused, done or aborted. Assign a new array to update the component.
:label label	string	Sets or retrieves the heading of the queue. It is also the accessible name of the group.
:rate rate	number 0	Sets or retrieves the line's rate in units an hour, for the projection. Left 0, the rate is the running order's own so far, once it has run five minutes and made something.
:show-finished showFinished	boolean true	Sets or retrieves whether finished and aborted orders are listed under the queue.
:read-only readOnly	boolean false	Sets or retrieves whether the queue only shows the orders. Every button is removed.
:busy busy	string	Sets or retrieves the id of the order the application is acting on. Its buttons wait. The queue also sets it itself as it raises orderAction, so a double press is one action even when the application sets busy only after an await. It is released when the application sets busy, refuses (errorMessage) or hands back the order changed, or after ten seconds.
:error-message errorMessage	string	Sets or retrieves the reason the station refused an action. It is shown as an alert and announced.
:error error	string	Sets the reason the station refused an action, by its earlier name: it sets errorMessage. Reading it returns the element's error-reporting method, which reads as the message where text is wanted; read errorMessage for the message.

Events

The data of an event is in event.detail. orderAction is a request: the order queue raises it only while readOnly is false, asks for confirmation first for complete and abort, and keeps orders until the application updates them. The application can set busy to the order id while it works.

Event

Description and detail

@orderAction

This event is triggered when the operator starts, pauses, resumes, completes or aborts an order - after the confirmation, for complete and abort. The queue is not changed: the application asks the station and hands back the orders. A double press raises one action, and the answer to Complete or Abort has to be a second decision: the second click of the double-click that asked, or a press within 300 ms of the question, is not an answer. id string The id of the order. action string start, pause, resume, complete or abort.

CSS variables

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

--smart-order-queue-fill --smart-order-queue-late --smart-order-queue-error --smart-order-queue-mono