ClockInClockOut.js

ClockInClockOut

Functions:

getTotal() - Determines how many hours went passed between the employee clocking in and clocking out. If the "timeOut" variable says :"noTimeYet" the string is ignored and no calculation is performed.Next, setTotalHours() is posted within the module.

filterHours() - Resets the getTotal() function while setting our timeClock to null while the function goes through its process and to clear out the old data. Next we determine if any of the employee hours string matches the string types into the "filter" text field. If there is a match the object iteration is push to a temporary variable until the for loop is finished. After our iteration have finished getTotal() is called and the timeClock is set.

populateFields() - Also resets our local data with getTotal([]) passing an empty array. Timeclock is also set to null while the function get the ticket request and calls to the database "ticket" table using an axios "get." Once the "hours" data is returned timeClock is set, getTotal() is ran with our new data, our employee hours for the selected ticket are posted to employee hours and the messages for the selected ticket are requested with "getMessages()."

inOut() - Will initially set our timeclock to null while the function goes through its process. Next, "whichTicket" is determined so that we can create the "currentTime" based on this and which button the user clicked "IN", or "OUT", we know which time value to fill in. Since we are always doing a put to a greater JSON object, we collect our data into a new object named "putData" and send this object off via axios. Upon a successful return we call the "populateFields()" function again. The "timeclock variable and employee hours are set at the en of this function.

useEffect() - Start off by making sure we have the ticketInfo. Then we check if there is any hint of where we were based on the last user ticket by checking sessionStorage. If there is a ticket listed we call "populateFields()." We also get the current time and populate the time and date fields for user convenience.