sc-approve
This document is a user guide for the sc-approve component version 6.5.64.
1 Purpose
sc-approve places an approve field in the form of a checkbox on a form. Ticking the checkbox indicates approval and will display an approval message beside the ticked checkbox. The approval message consists of a message label, the approver's account name and the approval date & time.
The sc-approve field is only enabled for those users whose account has the access key associated with that sc-approve field.
The sc-approve definition provides fields for setting the properties of an approve field and is fully described below.
2 Definition
sc-approve is defined by a set of name/value pair fields consisting of:
- Required system fields
- Required customizable fields
- Optional customizable fields
Note:
- Default values for fields described in the tables below are shown in bold text.
2.1 Required System Fields
Field | Valid Values | Description |
---|---|---|
componentName | sc-approve | The component name. Example: "componentName": "sc-approve" |
2.2 Required Customizable Fields
Field | Valid Values | Description |
---|---|---|
name | Any value written in camel case. | Defines the name of the sc-approve field in the document and database. Examples: "name": "typicalDefnScApprove" "name": "reviewedAndApproved" |
2.3 Optional Customizable Fields
Field | Valid Values | Description |
---|---|---|
approveMessage | Ticking the sc-approve field checkbox will display an approval message beside the ticked checkbox. The message consists of a message label, the approver's account name and the approval date & time. |
|
Any text value | The approval message label. Example: "approveMessage": "Reviewed and Approved by:" |
|
Approved by: | Default value. | |
defaultValue | true | The sc-approve-field checkbox will initially display as ticked. Example: "defaultValue": true |
false | Default value. The sc-approve-field checkbox will initially display as unticked. |
|
disableSave | true | Changing the sc-approve field value (ticking or unticking the checkbox) does not trigger the Save icon to flash. Exiting the form without saving changes to the sc-approve field value does not trigger a warning message to display. In the Angular version of the sc-approve component, clicking the Save icon will not save the sc-approve field value to the document. In the AngularJS version of the sc-approve component, clicking the Save icon will save the sc-approve field value to the document. Example: "disableSave": true |
false | Default value. Changing the sc-approve field value (ticking or unticking the checkbox) does trigger the Save icon to flash. Exiting the form without saving changes to the sc-approve field value does trigger a warning message to display. In both the Angular and AngularJS versions of the sc-approve component, clicking the Save icon will save the sc-approve field value to the document. |
|
enabled | false | The sc-approve field checkbox is greyed out. A Stop icon appears on mouseover of the sc-approve field checkbox. The sc-approve field checkbox cannot be ticked (or unticked). Example: "enabled": false |
true | Default value. The sc-approve field checkbox is not greyed out. A Stop icon does not appear on mouseover of the sc-approve field checkbox. The sc-approve field checkbox can be ticked (or unticked). |
|
fullWidth | true | The sc-approve field displays full width on the form. Example: "fullWidth": true |
false | Default value. The sc-approve field does not display full width on the form. |
|
keyIds | Array of keys ids | An array of one or more key ids. A user account must have at least one of these keyIds in order to access the sc-approve field. If a user account does not have at least one of these keyIds, then the sc-approve field will be disabled and the stop icon will display on mouseover of the sc-approve field. Example: "keyIds": [ "de00fcb0-84af-11e8-82c8-778f0f89c2be" ] |
label | Any value | Defines the name of the sc-approve field on the form i.e. the field label. Examples: "label": "Typical Defn sc-approve" "label": "Reviewed and Approved" |
Defaults to no label is displayed. | ||
mandatory | true | The sc-approve field displays as mandatory (i.e. label in red text with an asterisk). Saving without ticking the sc-approve field, a pop-up message displays prompting the user to enter a value for the sc-approve field. Unticking the sc-ace-text field checkbox, "This field is required" in red text will display below the sc-approve field. Example: "mandatory": true |
false | Default value. The field displays as optional (i.e. label in black text). Saving without ticking the sc-approve field, a pop-up message does not display prompting the user to enter a value for the sc-approve field. Unticking the sc-ace-text field checkbox, "This field is required" in red text will not display below the sc-approve field. |
|
visible | false | The sc-approve field is not visible on the form. Example: "visible": false |
true | Default value. The sc-approve field is visible on the form. |
3 Typical Definition
Below is a typical sc-approve definition, defined with its required fields plus any optional field whose value is typically other than its default value.
{
"name": "Typical Defn sc-approve",
"keyIds": ["3e88afa0-5e50-11e8-baa9-a9d161e55a91"],
"label": "Typical Defn sc-approve",
"componentName": "sc-approve"
}
One or more of the optional fields shown below can be included in the above definition should a value other than their default value be required.
"approveMessage": "Reviewed and Finalised By:",
"defaultValue":true,
"disableSave":true,
"enabled":false,
"fullWidth":true,
"mandatory": true,
"visible":false,
4 Examples
Example 1:
A typical sc-approve definition, defined with its required fields plus any optional field whose value is typically other than its default value.
{
"componentName": "sc-approve",
"name": "typicalDefnScApprove",
"keyIds": [
"de00fcb0-84af-11e8-82c8-778f0f89c2be"
],
"label": "Typical Defn sc-approve"
}
Resulting sc-approve field on the form:
Resulting sc-approve field on the form after ticking its checkbox:
Resulting field in the document and database:
"typicalDefnScApprove": {
"approveAccount": {
"documentId": "b7c1e1b0-2b9f-11e6-ac9c-170c531a5a0c",
"name": "User Account - barry.eadie@fieldtec.com"
},
"approveDate": "2021-11-24T02:05:58.046Z"
}
Example 2
sc-approve field defined as:
{
"componentName": "sc-approve",
"name": "nonTypicalDefnScApprove",
"keyIds": [
"de00fcb0-84af-11e8-82c8-778f0f89c2be"
],
"label": "Reviewed and Approved",
"approveMessage": "Reviewed and Approved by:",
"mandatory": true
}
Resulting field on the form:
Resulting sc-approve field on the form after ticking its checkbox:
Resulting field in the document and database after saving the document:
"nonTypicalDefnScApprove": {
"approveAccount": {
"documentId": "b6d7e1b0-1abc-2def-3ghi-100c135a5f3d",
"name": "User Account - barry.eadie@fieldtec.com"
},
"approveDate": "2021-11-24T11:11:15.231Z"
}