FSM FSTPO UI
Was this helpful?
Was this helpful?
In FSTP, we are trying to decouple the vehicle dispose from the FSM application. Whether vehicle is attached to any FSM application or not, we allow the vehicle to dispose in the FSTP plant.
After logging as a FSTP user, we have now the home button option:
Code changes path are:
DIGIT-Dev/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/components/FsmCard.js
After moving into “home” option, an FSTP user can choose from the following options:
FSTP can choose Add Vehicle Log option if he/she wants to check whether a vehicle is linked to any application and dispose.
FSTP can choose Inbox if he/she wants to check all the applications that are is ready to dispose.
The path for code:
frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FstpOperations.js
The code snippet for populating the options:
The code snippet for rendering the icon:
ULBHomeCard.js is the common component used to populate options in the screen.
The paths:
frontend/micro-ui/web/micro-ui-internals/packages/react-components/src/atoms/ULBHomeCard.js
FSTP can add vehicle log using vehicle number (in proper format with spaces, e.g. AB 00 CD 1234). An improper format will throw an error.
The path for the code:
frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FstpAddVehicle.js
The code snippet for populating the add vehicle log field and its validation:
The code snippet for rendering the screen:
After entering the vehicle number in the add vehicle log screen, we are fetching the FSM application, which is linked to that specific vehicle number. The data is rendered as shown below:
The path for the code:
frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FstpServiceRequest.js
The code snippets for fetching the FSM application linked to vehicle number:
Fetching the vehicle Id using vehicle number
Fetching the vehicle log using vehicle Id
Extracting out the FSM application number from vehicle log:
Fetching the FSM application details using FSM application number
The code snippets to render the data:
Mobile view
Desktop view
After selecting the application, FSTPO can dispose the vehicle log in the vehicle log screen.
Additional details and attachment fields are introduced in new updates in FSM v1.2.1 .
The screen for the existing vehicle log:
The screen for new vehicle log if no application is found for vehicle is shown below. FSTPO can dispose the new vehicle log by providing all the details below.
The path for the code:
frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/FstpOperatorDetails.js
The code snippet for additional details and attachments field:
For new vehicle log:
The code snippets to render input field for new vehicle log:
