Production floor

Shift Log `<smart-shift-log>`

ShiftLog is the book on the control-room desk, kept where the screens are: what one shift needs the next to know that no tag says - that a filler jammed twice and was cleared by hand, that maintenance is coming at ten.

JavaScript TypeScript Angular React Vue Blazor

<smart-shift-log> · 14 properties, 1 methods, 4 events · source/modules/smart.shiftlog.js

Usage in Blazor

The Razor component is <ShiftLog> 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

<ShiftLog @ref="shiftLog" Label="Line 3 shift log"
    OnEntryAdd="OnEntryAdd" />

@code {
    ShiftLog shiftLog;

    void OnEntryAdd(Event ev)
    {
        ShiftLogEntryAddEventDetail detail = ev["Detail"];
    }

    // Task<string> ExportCsv()
    void Call() => shiftLog.ExportCsv();
}

Properties

Parameter	Type, default	Description
`Entries` entries	IEnumerable<object>	Sets or retrieves the entries as [{ id, at, author, role, category, text, tag, correcting }], the shape a Scada Studio station returns from /api/shiftlog. correcting is the id of the entry an entry corrects; the corrected entry stays, marked as corrected. Assign a new array to update the component.
`Categories` categories	IEnumerable<object> ["note","handover","maintenance","qua…	Sets or retrieves the categories an entry can have, and the filters above the list. Each is named through the category-<name> message, so a plant's own category needs a message too.
`Label` label	string	Sets or retrieves the heading of the log. It is also the accessible name of the group.
`Shift` shift	object	Sets or retrieves the current shift as { name, from, to }. Entries from before from are listed under Earlier shifts.
`Author` author	string	Sets or retrieves the name shown as writing the next entry. It is only shown: the station stamps the author of the session that sends the entry.
`Filter` filter	string	Sets or retrieves the category the list is filtered to; empty lists every entry.
`ReadOnly` readOnly	bool false	Sets or retrieves whether the log only shows the entries. The box and the Correct buttons are removed: a supervisor's view.
`Busy` busy	bool false	Sets or retrieves whether the application is storing an entry. The Add button waits while it is set.
`ErrorMessage` errorMessage	string	Sets or retrieves the reason the station refused an entry. When set, it is shown and announced, and the draft is put back into the box rather than lost - unless the operator has started another entry meanwhile, which is kept: the refused text then waits beside the reason, with a button that puts it back below what is in the box.
`Error` error	string	Sets the reason the station refused an entry, 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.
`MaxLength` maxLength	int 2000	Sets or retrieves the longest entry, in characters.
`Search` search	string	Sets or retrieves the words the entries shown must contain - in the text, the author, the tag or the category. The words are marked where they are found. The box above the list sets it as it is typed.
`Range` range	ShiftLogRange all	Sets or retrieves the period shown: everything, this shift (from shift.from), the last 24 hours, the last 7 days.
`PageSize` pageSize	int 100	Sets or retrieves how many entries are drawn at once; the rest are a "Show more" away, so a year's log opens as fast as a day's.

Methods

Method	Description
`Task<string> ExportCsv()`	Returns the entries shown - after the category, the search and the period - as CSV: time, author, category, tag, text and the entry each corrects. A cell a spreadsheet would read as a formula is written as text.

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
`OnEntryAdd` entryAdd ShiftLogEntryAddEventDetail	This event is triggered when the operator adds an entry, with the Add button or Ctrl+Enter. The component does not store it: the application sends it to the station, which stamps the time and the author, and hands back the entries. The box is cleared; if the application then sets error, the text comes back. `Text` string The text of the entry. `Category` string Its category. `Tag` string The tag it is about, when one was given. `Correcting` string The id of the entry it corrects, when it is a correction.
`OnExportRequest` exportRequest ShiftLogExportRequestEventDetail	This event is triggered by Export CSV, with the file's text. The component then downloads it; an application that stores the file its own way calls preventDefault(). `Csv` string The CSV. `Count` int The entries in it.
`OnSearchChange` searchChange ShiftLogSearchChangeEventDetail	This event is triggered when the search is changed in the box. `Search` string The words searched for.
`OnFilterChange` filterChange ShiftLogFilterChangeEventDetail	This event is triggered when the operator filters the list by a category. `Category` string The category filtered to; empty for every entry.

Types

`enum ShiftLogRange`

ShiftLogRange.All "all" ShiftLogRange.Shift "shift" ShiftLogRange.Day "day" ShiftLogRange.Week "week"

CSS variables

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

--smart-shift-log-handover --smart-shift-log-safety --smart-shift-log-error --smart-shift-log-mono