WildTree App (Workshop Ordering Tool)
Hosted version here: WildTree App
This is an application that helps WildTree reps communicate and purchase meat bundles from butchers for freezer meal workshops. It solves the current problem of reps communicating with butchers by email for preparing customer bundle orders.
Angular | FireBase | SASS | Bower | Grunt
You can watch a quick 7 minute video presentation of the application here.
Table of Contents
- Rep Account
- Butcher Account
Below is a Walkthrough of the functionality of the application from a rep and butcher user role.
The application has user authentication through Firebase. You are able to login with a Google or Facebook account. (Currently all accounts created are rep accounts.)
The first time a user logins as a rep they will see a an empty list of workshops with the option to create one.
Once a user clicks "Add a New Workshop" a modal will open with options for name, date, time and bundles.
Once the user clicks "Add Workshop" then the modal is closed and the new workshop is added to the dashboard with options to submit the workshop, add orders or delete the workshop.
Clicking on "Update Order" will open the order dashboard for the new workshop as seen below. Since it is the first time it has been selected for this workshop the order will be empty.
Clicking on "Add A New Order" will give the user the option to "Add Order" or Add Custom Order" (A custom order will let the user change the default meat on each meal).
Adding Normal Order
The user selects the bundle type and will be shown a list off the meals included. They can then add the quantity needed and click "Add Order".
Adding Custom Order
The user can select the bundle they need to make custom. They can then select the meats they need to update in each meal. After that they add the quantity and click "Add Order".
Once orders are added the order dashboard will look like the screen below with the option to remove and update orders.
Once a user clicks the chat bubble icons on the nav bar they will be taken to the messaging screen which will look similar to the one below.
The messaging system uses websockets allowing for real time updates (without refresh) of messages and notifications.
The user can then click on a specific conversation, delete a conversation or click "Start Conversation" to add a new conversation with any user that has not already been started. Also, any delete or create action you perform on your end will impact the user you are messaging by deleting or adding messages in their account.
When a butcher logs in they will see a dashboard containing workshops submitted from reps listed in the order of most recent workshop date.
When a butcher clicks the "Print Order" button on a workshop, they are shown a modal with all the workshop details like below.
The butcher is able to click "Approve Workshop" on any listed workshops. This will update the status of the workshop on the rep side allowing them to see that the butcher has approved the current order.
Once a butcher has opened the print modal then they will see a print button in the top right. This will prompt the printer with a simple list formatting of the order that are on this workshop for fulfillment.