Design a ticket counter website with the following specifications with two separate views, one for a counter manager and the other for customers. See image below
a. The customer View
Take a Number: Allows the customer to take a ticket. When the button is clicked, the system generates a ticket number and displays to the customerNow Serving: Shows the latest number to be removed from the waiting queue and added to a counterLast Number: Shows the latest ticket number to be issuedCounters:The green dots: shows serving status – green is counter is online but not currently serving any customer, red if counter is online and currently serving a customerCurrent number: shows the number of the current ticket being served. If the counter is offline, the value of will be “Offline”, the status color changed to grey, and the whole counter will be greyed out (disabled)
b. Counter Management
“Go Offline”: This button shows “Go Offline” if the counter is online, and shows “Go Online” if the counter is offline. Toggles counter status when clicked. When offline, counter status on customer view will be grey, and the counter will be disabled in the customer view only”Complete Current”: Marks the current ticket being served as complete. When clicked, the current counter status becomes available, and the status on the Customer View will turn to greenCall Next: WillPick up the next first-in ticket from the waiting queue,Update in the customer view to the same ticket number (on the corresponding counter)Change the counter status (customer view) to redDisplay a message “No tickets in the waiting queue” if there are no more tickets to serve.
Note:
Build a backend application to manage the queues, so that both views can be run simultaneously on separate browsersDo NOT bother with login or authentication. Assume only one userHost the application using any free hosting option for demo purposes4. Host your source code on any public repository for easy sharing.