Cleaning Audit Tool

What is the cleaning Audit Tool? 馃

Cleaning Audit Tool is an auditing app that I made for a hospital located in the western suburbs of Victoria state, Australia.

The hospital had cancelled their subscription to a 3rd party auditing web software and wanted their own app developed.

Coming out of coding bootcamp, this was a great opportunity to practice and expand my web development skills.

How I built it - tech stack

They gave me the freedom to use my choice of the tech stack which turned out to be:

Material UI for Front End - Pre built components such as the radio buttons for multi choice options and date pickers were needed to speed up the development time.

Mssql and Sequelize ORM for Backend - the dev team there used Mssql, and with my MongoDB experience I thought it best to use an ORM (Sequelize)

UseForm Hook for forms - UseForm hook was a very convenient package that helped with the complex form submissions.

Redux for state management - Redux was used in this app for user privilege management. The app had 'task roles', so redux was used to manage that.

Deployment - all apps were deployed with docker on Azure as an App Service.

App preview

1. Functional Area Search

The user will need to search up the functional area - this is simply a collection of rooms to audit

They will filter, starting from the campus, followed by buildings, floors and then finally the functional area

They will press the 'Submit' button, which will become enabled as soon as all the fields are selected

CADT room select
2. Room Select

The user will see a list of rooms

The room number and room name is shown

The 'Add Room' button will lead to a page to add a new room

Clicking one of these room cards will direct user to a single room page

( See #3 )

CADT single room
3. Single Room

This single room page is showing all the areas we must audit ( here we only see 5 )

These elements the user sees are the criteria for the audit

The 'N/A' button will make it so user does not have to audit the element, but that is a very critical feature and only admins have this privilege

Pressing one of these elements will lead to the sub elements / audit prompts

( See #4 )

4. Room Audit Prompt

The audit prompts are given three options, "YES", "NO" and "N/A"

Only by pressing the 'NO' button does the extended collapsible form open

5. Audit Form

The user will fill the form with the values given in the dropdowns

Photo is added by sending files to a Microsoft Power Automate server and a url link to the photo is returned

Photo preview is shown, the bin icon will delete the photo from local save

6. Room Audited

Once all the elements and sub elements are audited, the rooms become disabled (Blue room card)

(See slide 2)

Rooms are locked from further audit, until the next audit date which is displayed

The user will press the submit functional area and a summary information card is shown

The user can go back to the audit page ( See #1 ) or goto the Action Plan ( See #7 )

CADT - admin view
7. Admin Grid View

The Action Plan view shows all the elements that had failed the audit, meaning at the audit form fill out ( See #5 ), auditor had pressed 'NO'

Currently the view is in Grid View but user can see it in Card View ( See #9 )

User can export the failed audits into CSV ( See #8 )

The 'Column Setting' tab controls which fields the user wants to see

They must press 'Save Settings' so the app remembers it next time

CADT - admin view
8. Export CSV View

Pressing the 'Export CSV' ( See #7 ) will export all the failed audits in a similar view to the grid view

All the column settings changes will also be reflected here

9. Admin Card View and sign off

Pressing the items in card view is convenient as it shows more information with the drawer component

There is a sign off section at the button to sign off on failed audits that have been corrected

User can leave or not leave a comment, then simply sign off and the item will be taken off the failed audit view