@decoloop/planner
Version:
The Sieval Dedicated Solutions decoloop planner widget
389 lines (331 loc) • 9.42 kB
Markdown
# Releases
## 1.2.4
- fix only hidden articles on validation
## 1.2.3
- add custom translations for 'datepicker'
- 'datepicker' validations
- hide summaries in 'all steps'
## 1.2.2
- add submit validation for 'all steps' modus
- fix to change an address
## 1.2.1
- Fix hidden articles
## 1.2.0
- new flow to show all steps at once.
- new option to apply selected quantity to all active articles (shared articles)
- new option to show calendar (datepicker)
- new way to visualize customer step (grid)
- improved styling
# Activity logging
Inline custom events like 'activity' are not supported in HTML.
JavaScript event listeners are needed to handle the 'activity' event.
```html
<decoloop-planner id="widget"/>
<script>
document
.getElementById("widget")
.addEventListener("activity", e => { console.log(e.detail) });
</script>
```
```html
button name="dlpButtonLoader" id="widget-button">[text]</button>
<script>
document
.getElementById("widget-button")
.addEventListener("activity", e => { console.log(e.detail) });
</script>
```
## Example logging object
```json
{
"details": {
"skillCode": "OTHER.MEASURE.PIECES",
"active": true
},
"hasErrors": false,
"errors": [],
"kind": 0,
"action": "toggle"
}
```
| Parameter | Type | Description |
| --------- | -------- | -------------------------- |
| `kind` | `int` | Widget step |
| `action` | `string` | Action within the step |
| `details` | `object or null` | based on action |
| `hasErrors` | `boolean` | true when the `errors` list has values |
| `errors` | `string[]` | list of errors |
## Widget step: Articles
Kind = 0
### Action: toggle
```json
{
"details": {
"skillCode": "OTHER.MEASURE.PIECES",
"active": true
},
"hasErrors": false,
"errors": [],
"kind": 0,
"action": "toggle"
}
```
| Parameter | Type | Description |
| --------- | -------- | -------------------------- |
| `skillCode` | `string` | selected article |
| `active` | `boolean` | selected or deselected |
### Action: change
```json
{
"details": {
"skillCode": "OTHER.MEASURE.PIECES",
"quantity": "5"
},
"kind": 0,
"hasErrors": false,
"errors": [],
"action": "change"
}
```
| Parameter | Type | Description |
| --------- | -------- | -------------------------- |
| `skillCode` | `string` | selected article |
| `quantity` | `int` | selected quantity |
### Action: submit
```json
{
"details": {
"articles": [
{
"code": "OTHER.MEASURE.PIECES",
"quantity": 5
}
]
},
"kind": 0,
"hasErrors": false,
"errors": [],
"action": "submit"
}
```
| Parameter | Type | Description |
| --------- | -------- | -------------------------- |
| `articles` | `object[]` | list of selected articles |
| `articles[].code` | `string` | code |
| `articles[].quantity` | `int` | quantity |
Possible errors that can occur:
- error.session.session_expired
- error.articles.articles_requires_at_least_1_item
- error.articles.article_invalid
- error.employees.no_valid_skills"
## Widget step: Address
Kind = 1
### Action: autocomplete
- Works only on dutch addresses.
- Non-blocking action, full address fields are visible in case of invalid address
```json
{
"details": {
"request": {
"streetNumber": "51",
"zip": "8011CA"
},
"response": {
"address": {
"streetName": "Westerlaan",
"streetNumber": "51",
"addition": null,
"zipCode": "8011CA",
"cityName": "Zwolle",
"country_ISO3166_1_2": "NL",
},
"isValid": true
}
},
"kind": 1,
"hasErrors": false,
"errors": [],
"action": "autocomplete"
}
```
| Parameter | Type | Description |
| --------- | -------- | -------------------------- |
| `request` | `object` | inserted address info |
| `request.streetNumber` | `string` | streetNumber |
| `request.zip` | `string` | zip |
| `response` | `object or null` | received info |
| `response.address.isValid` | `boolean` | if address can be found |
| `response.address` | `object or null` | address info, null when isValid is false |
| `response.address.streetName` | `string` | street name|
| `response.address.streetNumber` | `string` | street number |
| `response.address.addition` | `string` | addition |
| `response.address.zipCode` | `string` | zip |
| `response.address.cityName` | `string` | city |
| `response.address.country_ISO3166_1_2` | `string` | country code |
Possible errors that can occur:
- error.session.session_expired
- error.address.address_invalid
### Action: branch
```json
{
"details": {
"licenseeId": 999
},
"kind": 1,
"hasErrors": false,
"errors": [],
"action": "branch"
}
```
| Parameter | Type | Description |
| --------- | -------- | -------------------------- |
| `licenseeId` | `int` | branch id |
### Action: submit
```json
{
"details": {
"request": {
"streetNumber": "51",
"zip": "8011",
"streetName": "Westerlaan",
"city": "Zwolle",
"licenseeId": null
},
"response": {
"streetName": "Westerlaan",
"streetNumber": "51",
"addition": null,
"zipCode": "8011 CA",
"cityName": "Zwolle",
"country_ISO3166_1_2": "nl"
}
},
"kind": 1,
"hasErrors": false,
"errors": [],
"action": "submit"
}
```
| Parameter | Type | Description |
| --------- | -------- | -------------------------- |
| `request` | `object` | inserted address info |
| `request.streetNumber` | `string` | street number |
| `request.streetName` | `string` | street name |
| `request.zip` | `string` | zip |
| `request.city` | `string` | city |
| `request.licenseeId` | `int or null` | branch id |
| `response` | `object or null` | received info |
| `response.streetName` | `string` | street name|
| `response.streetNumber` | `string` | street number |
| `response.addition` | `string` | addition |
| `response.zipCode` | `string` | zip |
| `response.cityName` | `string` | city |
| `response.country_ISO3166_1_2` | `string` | country code |
Possible errors that can occur:
- error.session.session_expired
- error.address.address_invalid
- error.address.address_difference_detection
- error.address.address_difference_detection.zip
- error.address.address_difference_detection.street_name
- error.address.address_difference_detection.street_number
- error.address.address_difference_detection.city
- error.worklocation.none_in_area
- error.worklocation.none_in_max_distance
## Widget step: Schedule
Kind = 3
### Action: set_time
```json
{
"details": {
"time": "2022-12-28T12:00:00Z"
},
"kind": 2,
"hasErrors": false,
"errors": [],
"action": "set_time"
}
```
| Parameter | Type | Description |
| --------- | -------- | -------------------------- |
| `time` | `DateTime` | selected date and time |
### Action: next_range
```json
{
"details": null,
"kind": 2,
"hasErrors": false,
"errors": [],
"action": "next_range"
}
```
### Action: previous_range
```json
{
"details": null,
"kind": 2,
"hasErrors": false,
"errors": [],
"action": "previous_range"
}
```
### Action: submit
```json
{
"details": {
"firstName": "John",
"middleName": "",
"lastName": "Doe",
"emailAddress": "johndoe@decoloop.com",
"phoneNumber": "0612345678",
"mobilePhoneNumber": "",
"languageAbbreviation": "nl",
"remark": "Extra info"
},
"kind": 3,
"hasErrors": false,
"errors": [],
"action": "submit"
}
```
| Parameter | Type | Description |
| --------- | -------- | -------------------------- |
| `firstName` | `string` | |
| `middleName` | `string` | |
| `lastName` | `string` | |
| `emailAddress` | `string` | |
| `phoneNumber` | `string` | |
| `mobilePhoneNumber` | `string` | |
| `languageAbbreviation` | `string` | |
| `remark` | `string` | |
## Widget step: Confirm
Kind = 4
### Action: submit
```json
{
"details": {
"reference": "1010.00125"
},
"kind": 4,
"hasErrors": false,
"errors": [],
"action": "submit"
}
```
| Parameter | Type | Description |
| --------- | -------- | -------------------------- |
| `reference` | `string` | received reference number |
Possible errors that can occur:
- error.session_expired
- error.dateslot.invalid_timeslot
- error.unknown.unknown
## Generic action: previous
Available in each step
```json
{
"details": null,
"kind": 1,
"hasErrors": false,
"errors": [],
"action": "previous"
}
```