Electronic records (21 CFR Part 11)

Audit Trail `<smart-audit-trail>`

AuditTrail displays audit trail entries for review, as required by 21 CFR Part 11 §11.10(e).

JavaScript TypeScript Angular React Vue Blazor

<smart-audit-trail> · 17 properties, 7 methods, 5 events · source/modules/smart.audittrail.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.audittrail.js';

<smart-audit-trail ref="auditTrail" :show-milliseconds="true" :show-review="true"
    @reviewRequest="onEvent"></smart-audit-trail>

// methods are called on the element the ref holds
auditTrail.value.addEntry({});

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

Properties

Binding	Type, default	Description
`:entries` entries	array	Sets or retrieves the entries, as { seq, id, at, system, user, userName, action, record, field, oldValue, newValue, reason, signature, previousHash, hash }, in sequence. For a running feed use addEntry(), which verifies only the entry it adds.
`:columns` columns	array	Sets or retrieves the columns shown, in order, from seq, at, user, action, record, field, oldValue, newValue, reason, signature and system. Empty shows all but system.
`:sort-direction` sortDirection	AuditTrailSortDirection desc	Sets or retrieves the order by sequence: newest first, or oldest first. The Time header toggles it.
`:filter` filter	object	Sets or retrieves the filter as { text, user, action, from, to }. text is searched across the entry, user and action are matched exactly, and from and to are ISO strings or epoch milliseconds. The toolbar edits the filter and raises the filterChange event.
`:show-toolbar` showToolbar	boolean true	Determines whether the search, filters, integrity badge and export buttons are shown.
`:show-integrity` showIntegrity	boolean true	Determines whether the hash chain is verified and its verdict shown.
`:genesis` genesis	string	Sets or retrieves the previousHash the first entry must carry, when the chain did not start at ''.
`:expected-head` expectedHead	string	Sets or retrieves the hash of an entry known to have been written - an anchor kept outside the trail, for example by the server. A hash chain verifies from its first entry to its last, so a copy with its newest entries removed is a shorter chain that is still intact; with an anchor the verdict fails when the chain does not contain this hash. Entries added after the anchor was taken do not fail it. Empty does not check.
`:expected-count` expectedCount	number 0	Sets or retrieves how many entries the trail is known to have held - an anchor kept outside the trail. The verdict fails when fewer entries are given, so removing the newest entries is detected. More entries are fine. 0 does not check.
`:require-chain` requireChain	boolean true	Determines whether entries that carry no hash at all are a failure. On (the default), a list without hashes - never chained, or with its hashes stripped - is shown as 'No hash chain - N entries cannot be verified' and integrity() returns { ok: false, reason: 'unchained' }. Off, it is shown as information and integrity() returns null, for an application whose log was never chained.
`:max-rows` maxRows	number 500	Sets or retrieves the maximum number of rows rendered. The footer shows how many entries are not rendered; they can be reached by narrowing the filter or by exporting.
`:show-milliseconds` showMilliseconds	boolean false	Determines whether the time column shows milliseconds.
`:show-review` showReview	boolean false	Determines whether a 'Mark reviewed' button is shown. The button raises the reviewRequest event with the entries shown; the application records the review, with a signature if required.
`:selected` selected	string	Sets or retrieves the id of the selected entry, or ''.
`:file-name` fileName	string audit-trail	Sets or retrieves the base name of a downloaded export.
`:label` label	string	Sets or retrieves the table's caption and the accessible name. Empty shows 'Audit trail'.
`:density` density	AuditTrailDensity normal	Sets or retrieves the target size of the toolbar controls.

Methods

Method	Description
`addEntry(entry: object): void`	Adds an entry, for example from a Trail subscription that keeps the viewer up to date. `entry` object The entry.
`visible(): array`	Returns the entries the filter lets through, in display order.
`count(): number`	Returns how many entries are held, filtered or not.
`integrity(): object`	Returns the chain verification as { ok, count, brokenAt, reason }, or null when integrity is not shown, when there are no entries and no anchor, or when no entry carries a hash and requireChain is off. reason is 'link', 'hash', 'sequence' or 'missing' at the first entry that fails, 'unchained' when no entry carries a hash, 'count' when fewer entries than expectedCount are given, or 'head' when the chain does not contain expectedHead. The verdict is kept between refreshes: filtering and sorting do not re-verify, and addEntry() verifies only the entry it adds.
`export(format: string, options?: object): string`	Returns the complete trail as text, with every entry and every hash, regardless of the current filter. In CSV, a text value that a spreadsheet would run as a formula (starting with =, +, -, @, a tab or a carriage return) is prefixed with an apostrophe; numbers are written as they are. The JSON export is the exact copy that verifies. `format` string 'csv' or 'json'. `options` object { filtered: true } for what is on screen instead.
`download(format: string, options?: object): void`	Downloads the export as a file and raises the export event. `format` string 'csv' or 'json'. `options` object { filtered: true } for what is on screen instead.
`select(id: string): void`	Selects an entry by id and raises the entrySelect event. Pass an empty string to clear the selection. `id` string The entry id.

Events

The data of an event is in event.detail. entrySelect and filterChange follow a change the audit trail has already made to selected or filter, export reports a download the audit trail starts itself, and integrityChange reports a new result of the chain check. reviewRequest is a request from the Review button, shown only while showReview is true, and the application carries out the review.

Event	Description and detail
`@entrySelect`	This event is triggered when an entry is selected by click, Enter or select(). `entry` object The entry.
`@filterChange`	This event is triggered when the toolbar changes the filter. `filter` object { text, user, action, from, to } as applied.
`@integrityChange`	This event is triggered when the chain verdict changes, an intact trail replaced by a copy that breaks, or the reverse. `integrity` object { ok, count, brokenAt, reason }, or null. `state` string 'intact', 'broken' or 'none'.
`@export`	This event is triggered when an export is downloaded. An export is itself an action that can be recorded in the audit trail. `format` string 'csv' or 'json'. `count` number How many entries were exported. `fileName` string The file name offered.
`@reviewRequest`	This event is triggered by the 'Mark reviewed' button. The application records the review. `entries` any[] The entries shown. `count` number How many. `filter` object The filter in force.

Types

`type AuditTrailSortDirection`

'asc' | 'desc'

`type AuditTrailDensity`

'normal' | 'touch'

CSS variables

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

--smart-audit-size --smart-audit-background --smart-audit-header-background --smart-audit-border --smart-audit-primary --smart-audit-primary-text --smart-audit-ok-text --smart-audit-error-text --smart-audit-selected --smart-audit-readout-font