Fluent Commerce Logo
Docs
Sign In

fc.mystique.manifest.store.fragment.waves

Setting

Changed on:

19 Jan 2024

Setting AreaUI component
Supported context levels:ACCOUNT RETAILER

Overview

When this setting is set, the waves page will be overriden in the Fluent Store Web App

Values

Data TypeValues
JSON

Value is provided below

Configuration example

1{
2    "manifestVersion": "2.0",
3    "routes": [
4        {
5            "type": "page",
6            "path": "waves",
7            "component": "fc.page",
8            "nav": {
9                "label": "i18n:fc.sf.ui.waves.index.nav",
10                "icon": "store",
11                "badge": {
12                    "queryName": "fulfilments",
13                    "variables": {
14                        "fromLocation": {
15                            "ref": "{{activeLocation.ref}}"
16                        },
17                        "status": [
18                            "AWAITING_WAVE"
19                        ]
20                    }
21                }
22            },
23            "props": {
24                "title": "i18n:fc.sf.ui.waves.index.wavesList.title",
25                "actions": {
26                    "userActionFilter": {
27                        "type": "include",
28                        "names": [
29                            "WaveCreate"
30                        ]
31                    },
32                    "userActionExtensions": {
33                        "WaveCreate": {
34                            "postSubmit": {
35                                "type": "navigate",
36                                "link": "/waves/{{wavesInProgress.edges.0.node.id}}"
37                            }
38                        }
39                    }
40                }
41            },
42            "data": {
43                "query": "query ($ordersAwaitingPickFromLocationRef: String!, $ordersAwaitingPickStatus: [String]!, $wavesInProgressLocationRef: String!, $_wavesInProgressStatus: [String]!, $wavesCompletedStatus: [String]!, $wavesCompletedUpdatedOn: DateTime!, $locationId: ID!) {  locationById(id: $locationId) {    ref  }  dashboardFulfilments: fulfilments(    first: 999    fromLocation: {ref: $ordersAwaitingPickFromLocationRef}    status: $ordersAwaitingPickStatus  ) {    edges {      node {        id      }    }    pageInfo {      hasNextPage    }  }  dashboardWavesInProgress: waves(    first: 999    processingLocation: {ref: $wavesInProgressLocationRef}    status: $_wavesInProgressStatus  ) {    edges {      node {        id      }    }    pageInfo {      hasNextPage    }  }  dashboardWavesCompleted: waves(    first: 999    processingLocation: {ref: $wavesInProgressLocationRef}    status: $wavesCompletedStatus    updatedOn: {from: $wavesCompletedUpdatedOn}  ) {    edges {      node {        id      }    }    pageInfo {      hasNextPage    }  }  fulfilments(    fromLocation: {ref: $ordersAwaitingPickFromLocationRef}    status: $ordersAwaitingPickStatus  ) {    edges {      node {        id        ref        order {          ref          totalPrice          customer {            firstName            lastName          }        }        expiryTime        deliveryType      }    }  }  wavesInProgress: waves(    processingLocation: {ref: $wavesInProgressLocationRef}    status: $_wavesInProgressStatus  ) {    edges {      node {        id        ref        status        location {          id          ref        }      }    }  }  wavesCompleted: waves(    processingLocation: {ref: $wavesInProgressLocationRef}    status: $wavesCompletedStatus    updatedOn: {from: $wavesCompletedUpdatedOn}  ) {    edges {      node {        id        ref        updatedOn        status        location {          id          ref        }      }    }    pageInfo {      hasNextPage    }  }}",
44                "variables": {
45                    "locationId": "{{activeLocation.id}}",
46                    "ordersAwaitingPickFromLocationRef": "{{activeLocation.ref}}",
47                    "ordersAwaitingPickStatus": [
48                        "AWAITING_WAVE"
49                    ],
50                    "wavesInProgressLocationRef": "{{activeLocation.ref}}",
51                    "_wavesInProgressStatus": [
52                        "PICK",
53                        "PACK",
54                        "DISPATCH"
55                    ],
56                    "wavesCompletedStatus": [
57                        "COMPLETE"
58                    ],
59                    "wavesCompletedUpdatedOn": "{{dateStringFormatter (dateAdd day=-1) 'YYYY-MM-DD[T]HH:mm:ss.SSS[Z]'}}"
60                }
61            },
62            "descendants": [
63                {
64                    "component": "fc.dashboard.threshold",
65                    "dataSource": "dashboardFulfilments",
66                    "props": {
67                        "label": "i18n:fc.sf.ui.waves.detail.dashboard.ordersAwaitingPick.title",
68                        "value": "{{edges.length}}",
69                        "thresholdLow": 1,
70                        "thresholdHigh": 10,
71                        "width": "third",
72                        "link": "#/waves/list/awaiting-pick"
73                    }
74                },
75                {
76                    "component": "fc.dashboard.threshold",
77                    "dataSource": "dashboardWavesInProgress",
78                    "props": {
79                        "label": "i18n:fc.sf.wave.inprogress.detail.title",
80                        "value": "{{edges.length}}",
81                        "thresholdLow": 1,
82                        "thresholdHigh": 3,
83                        "width": "third",
84                        "link": "#/waves/list/in-progress"
85                    }
86                },
87                {
88                    "component": "fc.dashboard.threshold",
89                    "dataSource": "dashboardWavesCompleted",
90                    "props": {
91                        "label": "i18n:fc.sf.wave.completed.detail.title",
92                        "value": "{{edges.length}}",
93                        "thresholdLow": 0,
94                        "thresholdHigh": 1000000,
95                        "width": "third",
96                        "link": "#/waves/list/completed"
97                    }
98                },
99                {
100                    "component": "fc.tabs.card",
101                    "props": {
102                        "noCard": true,
103                        "layouts": [
104                            {
105                                "label": "i18n:fc.sf.ui.waves.detail.dashboard.ordersAwaitingPick.title"
106                            },
107                            {
108                                "label": "i18n:fc.sf.wave.inprogress.detail.title"
109                            },
110                            {
111                                "label": "i18n:fc.sf.wave.completed.detail.title"
112                            }
113                        ]
114                    },
115                    "descendants": [
116                        {
117                            "component": "fc.list",
118                            "dataSource": "fulfilments",
119                            "props": {
120                                "filter": {
121                                    "enabled": true,
122                                    "exclude": [
123                                        "deliveryType",
124                                        "eta"
125                                    ]
126                                },
127                                "attributes": [
128                                    {
129                                        "label": "i18n:fc.sf.ui.waves.detail.list.fulfilments.column.customer.heading",
130                                        "value": "{{node.order.customer.firstName}} {{node.order.customer.lastName}}"
131                                    },
132                                    {
133                                        "label": "i18n:fc.sf.ui.waves.detail.list.fulfilments.column.order.heading",
134                                        "value": "{{node.order.ref}}"
135                                    },
136                                    {
137                                        "label": "i18n:fc.sf.ui.waves.detail.list.fulfilments.column.fulfilmentRef.heading",
138                                        "value": "{{node.ref}}"
139                                    },
140                                    {
141                                        "label": "i18n:fc.gql.order.items.totalPrice.label",
142                                        "value": "{{node.order.totalPrice}}"
143                                    },
144                                    {
145                                        "label": "i18n:fc.sf.ui.wave.index.card.create.list.column.timeRemaining.heading",
146                                        "value": "{{relativeDateFromNow node.expiryTime}}"
147                                    }
148                                ]
149                            }
150                        },
151                        {
152                            "component": "fc.list",
153                            "dataSource": "wavesInProgress",
154                            "props": {
155                                "filter": {
156                                    "enabled": true,
157                                    "exclude": [
158                                        "workflowRef",
159                                        "workflowVersion",
160                                        "Name",
161                                        "locationRef"
162                                    ]
163                                },
164                                "attributes": [
165                                    {
166                                        "label": "i18n:fc.sf.ui.waves.index.list.column.id.heading",
167                                        "value": "{{node.id}}",
168                                        "link": "#/waves/{{node.id}}"
169                                    },
170                                    {
171                                        "label": "i18n:fc.sf.ui.waves.index.list.column.ref.heading",
172                                        "value": "{{node.ref}}"
173                                    },
174                                    {
175                                        "label": "i18n:fc.sf.ui.waves.index.list.column.location.heading",
176                                        "value": "{{node.location.ref}}"
177                                    },
178                                    {
179                                        "label": "i18n:fc.sf.ui.waves.index.list.column.status.heading",
180                                        "value": "{{node.status}}"
181                                    }
182                                ]
183                            }
184                        },
185                        {
186                            "component": "fc.list",
187                            "dataSource": "wavesCompleted",
188                            "props": {
189                                "filter": {
190                                    "enabled": true,
191                                    "exclude": [
192                                        "workflowRef",
193                                        "workflowVersion",
194                                        "status",
195                                        "type",
196                                        "locationRef",
197                                        "updatedOn",
198                                        "name"
199                                    ]
200                                },
201                                "attributes": [
202                                    {
203                                        "label": "i18n:fc.sf.ui.waves.index.list.column.id.heading",
204                                        "value": "{{node.id}}",
205                                        "link": "#/waves/{{node.id}}"
206                                    },
207                                    {
208                                        "label": "i18n:fc.sf.ui.waves.index.list.column.ref.heading",
209                                        "value": "{{node.ref}}"
210                                    },
211                                    {
212                                        "label": "i18n:fc.sf.ui.waves.index.list.column.location.heading",
213                                        "value": "{{node.location.ref}}"
214                                    },
215                                    {
216                                        "label": "i18n:fc.sf.ui.waves.index.list.column.status.heading",
217                                        "value": "{{node.status}}"
218                                    }
219                                ]
220                            }
221                        }
222                    ]
223                },
224                {
225                    "component": "fc.page.refresh"
226                }
227            ]
228        },
229        {
230            "type": "page",
231            "path": "waves/:id",
232            "fullScreen": true,
233            "component": "fc.page.wizard",
234            "props": {
235                "title": "{{i18n \"fc.type.wave\"}} {{waveById.id}}",
236                "actions": true,
237                "closePath": "waves",
238                "steps": [
239                    {
240                        "title": "i18n:fc.sf.ui.waves.wizard.pick.title",
241                        "icon": "MdShoppingBasket",
242                        "action": {
243                            "name": "PickConfirm"
244                        },
245                        "condition": {
246                            "value": "{{waveById.status}}",
247                            "matches": "PICK"
248                        },
249                        "descendants": [
250                            {
251                                "component": "fc.page.section.header",
252                                "descendants": [
253                                    {
254                                        "component": "fc.button.print.download",
255                                        "props": {
256                                            "label": "i18n:fc.sf.ui.waves.detail.action.pickList.download.label",
257                                            "href": "/api/v4.1/wave/{{waveById.id}}/pickingList",
258                                            "filename": "wave-picklist-{{waveById.id}}.pdf"
259                                        }
260                                    }
261                                ]
262                            },
263                            {
264                                "component": "fc.page.wizard.action",
265                                "props": {
266                                    "width": "full",
267                                    "noCard": true
268                                }
269                            }
270                        ]
271                    },
272                    {
273                        "title": "i18n:fc.sf.ui.waves.wizard.pack.title",
274                        "icon": "FaBox",
275                        "action": {
276                            "name": "WaveDispatch"
277                        },
278                        "condition": {
279                            "value": "{{waveById.status}}",
280                            "matches": "PACK"
281                        },
282                        "descendants": [
283                            {
284                                "component": "fc.page.section.header",
285                                "descendants": [
286                                    {
287                                        "component": "fc.button.print.download",
288                                        "props": {
289                                            "label": "i18n:fc.sf.ui.waves.detail.action.packingSlip.download.label",
290                                            "href": "/api/v4.1/wave/{{waveById.id}}/packingSlip",
291                                            "filename": "wave-packlist-{{waveById.id}}.pdf"
292                                        }
293                                    }
294                                ]
295                            },
296                            {
297                                "component": "fc.page.refresh"
298                            },
299                            {
300                                "component": "fc.list",
301                                "dataSource": "waveById.fulfilments",
302                                "props": {
303                                    "attributes": [
304                                        {
305                                            "label": "i18n:fc.sf.ui.waves.detail.list.fulfilments.column.order.heading",
306                                            "value": "{{node.order.ref}}"
307                                        },
308                                        {
309                                            "label": "i18n:fc.sf.ui.waves.detail.list.fulfilments.column.customer.heading",
310                                            "value": "{{node.order.customer.firstName}} {{node.order.customer.lastName}}"
311                                        },
312                                        {
313                                            "label": "i18n:fc.sf.ui.waves.detail.list.fulfilments.column.orderType.heading",
314                                            "value": "{{node.order.type}}"
315                                        },
316                                        {
317                                            "label": "i18n:fc.sf.ui.waves.detail.list.fulfilments.column.fulfilmentStatus.heading",
318                                            "value": "{{node.status}}"
319                                        }
320                                    ]
321                                }
322                            },
323                            {
324                                "component": "fc.page.wizard.action",
325                                "props": {
326                                    "width": "full",
327                                    "noCard": true
328                                }
329                            }
330                        ]
331                    },
332                    {
333                        "title": "i18n:fc.sf.ui.waves.wizard.dispatch.title",
334                        "icon": "FaTruck",
335                        "action": {
336                            "name": "WaveComplete",
337                            "config": {
338                                "noSuccessMessage": false,
339                                "extension": {
340                                    "postSubmit": {
341                                        "type": "navigate",
342                                        "link": "waves"
343                                    }
344                                }
345                            }
346                        },
347                        "condition": {
348                            "value": "{{waveById.status}}",
349                            "matches": [
350                                "DISPATCH",
351                                "COMPLETE"
352                            ]
353                        },
354                        "descendants": [
355                            {
356                                "component": "fc.page.section.header",
357                                "descendants": [
358                                    {
359                                        "component": "fc.button.print.download",
360                                        "props": {
361                                            "label": "i18n:fc.sf.ui.waves.detail.action.packLabel.download.label",
362                                            "href": "/api/v4.1/wave/{{waveById.id}}/label",
363                                            "filename": "wave-packlabel-{{waveById.id}}.pdf"
364                                        }
365                                    }
366                                ]
367                            },
368                            {
369                                "component": "fc.page.refresh"
370                            },
371                            {
372                                "component": "fc.list",
373                                "dataSource": "waveById.fulfilments",
374                                "props": {
375                                    "attributes": [
376                                        {
377                                            "label": "i18n:fc.sf.ui.waves.detail.list.fulfilments.column.order.heading",
378                                            "value": "{{node.order.ref}}"
379                                        },
380                                        {
381                                            "label": "i18n:fc.sf.ui.waves.detail.list.fulfilments.column.customer.heading",
382                                            "value": "{{node.order.customer.firstName}} {{node.order.customer.lastName}}"
383                                        },
384                                        {
385                                            "label": "i18n:fc.sf.ui.waves.detail.list.fulfilments.column.orderType.heading",
386                                            "value": "{{node.order.type}}"
387                                        },
388                                        {
389                                            "label": "i18n:fc.gql.fulfilment.deliveryType.label",
390                                            "value": "{{node.order.fulfilmentChoice.deliveryType}}"
391                                        },
392                                        {
393                                            "label": "i18n:fc.sf.ui.waves.detail.list.fulfilments.column.fulfilmentStatus.heading",
394                                            "value": "{{node.status}}"
395                                        },
396                                        {
397                                            "label": "i18n:fc.sf.ui.waves.detail.list.fulfilments.column.carrier.heading",
398                                            "value": "{{node.articles.edges.0.node.consignmentArticles.edges.0.node.consignment.carrier.name}}"
399                                        },
400                                        {
401                                            "label": "i18n:fc.sf.ui.waves.index.list.column.status.heading",
402                                            "value": "{{node.articles.edges.0.node.consignmentArticles.edges.0.node.consignment.status}}",
403                                            "options": {
404                                                "styles": [
405                                                    {
406                                                        "matches": [
407                                                            "FAILED"
408                                                        ],
409                                                        "icon": {
410                                                            "name": "MdError",
411                                                            "color": "D23038"
412                                                        }
413                                                    },
414                                                    {
415                                                        "matches": [
416                                                            "ACTIVE_LODGED"
417                                                        ],
418                                                        "icon": {
419                                                            "name": "MdCheckCircle",
420                                                            "color": "38A64C"
421                                                        }
422                                                    },
423                                                    {
424                                                        "value": "{{eq node.fromAddress.id node.toAddress.id}}",
425                                                        "matches": [
426                                                            "true"
427                                                        ],
428                                                        "icon": {
429                                                            "name": "MdCheckCircle",
430                                                            "color": "38A64C"
431                                                        }
432                                                    },
433                                                    {
434                                                        "icon": {
435                                                            "name": "loading"
436                                                        }
437                                                    }
438                                                ]
439                                            }
440                                        }
441                                    ]
442                                }
443                            }
444                        ]
445                    }
446                ]
447            },
448            "data": {
449                "query": "query ($id: ID!) {  waveById(id: $id) {    id    ref    status    location {      id      ref    }    fulfilments {      edges {        node {          id          ref          status          fromAddress {            id            ref          }          toAddress {            id            ref          }          items {            edges {              node {                ref              }            }          }          order {            id            ref            type            status            fulfilmentChoice {              deliveryType            }            customer {              firstName              lastName              primaryEmail              primaryPhone            }          }          articles {            edges {              node {                ref                consignmentArticles(first: 1) {                  edges {                    node {                      consignment {                        id                        ref                        carrier {                          name                        }                        trackingLabel                        status                        updatedOn                      }                    }                  }                }              }            }          }        }      }    }  }}",
450                "variables": {
451                    "id": "{{params.id}}"
452                }
453            }
454        }
455    ]
456}

Language: json

Copyright © 2024 Fluent Retail Pty Ltd (trading as Fluent Commerce). All rights reserved. No materials on this docs.fluentcommerce.com site may be used in any way and/or for any purpose without prior written authorisation from Fluent Commerce. Current customers and partners shall use these materials strictly in accordance with the terms and conditions of their written agreements with Fluent Commerce or its affiliates.

Fluent Logo