This episode is for members only
Sign up to access "Build an Appointment Booking System With Inertia" right now.
Get started
Already a member? Sign in to continue
Playing
10. Subtracting employee schedule exclusions
Episodes
02. Core functionality
03. How we build up availability
7m 55s
0%
04. Employees and services
7m 39s
0%
05. Employee schedules and exclusions
7m 53s
0%
06. Setting up appointments
5m 34s
0%
07. Working with date periods
10m 4s
0%
08. Iterating over requested days in a period
4m 51s
0%
09. Adding schedule availability
15m 38s
0%
10. Subtracting employee schedule exclusions
7m 53s
0%
11. Excluding time already passed
2m 57s
0%
12. Writing tests for schedule availability
19m 50s
0%
13. Generating slots
14m 47s
0%
14. Building the service availability generator
7m 5s
0%
15. Adding employees into slots
9m 44s
0%
16. Removing empty slots
4m 42s
0%
17. Removing slots with booked appointments
6m 44s
0%
18. Using a custom date collection
3m 34s
0%
19. Writing tests for service availablity
18m 42s
0%
03. Building the booking UI
04. Building the availability calendar
25. Rendering the datepicker
6m 51s
0%
26. Fetching availability
9m 16s
0%
27. Disabling unavailable dates
6m 25s
0%
28. Showing the first available date
2m 4s
0%
29. Fetching future availability
10m 4s
0%
30. Showing slot count on the calendar
9m 1s
0%
31. Fixing up core availability in the past
2m 34s
0%
32. Showing available slots
5m 49s
0%
05. Booking appointments
Transcript
00:00
OK, so in the last episode, that was probably the most complicated part about adding our schedule availability just
00:06
for the fact that we have each day with a different time. Now, the next part is going to be about adding in exclusions. So the first thing I'm going to do is go over to the database to exclude a certain day, and what I'm actually going to do is I'm going to fill in all of the days
00:23
here with some times just so we've got a nice full schedule and we can go ahead and test this out. I'm not going to work Saturdays and Sundays. We'll ignore that.
00:32
But I work every single weekday now, nine to five. OK, so I'm going to go ahead and add in a schedule exclusion in here. And that's going to be like a holiday or just a day off. So let's just choose obviously my employee.
00:47
And let's go ahead and fill this in with the current date and time. And we'll just fill in created and updated. And now let's go ahead and choose when we want to be off. So I'm going to say that I want the
00:58
second of February off and I want that to be all day. So I'm just going to add in. From nine till five, and of course, when you're adding this in an admin panel, it will just be the case of inserting a record in with a selected start and end
01:13
time and end date, so let's copy this across to here, change this over to five and we're good to go. We'll modify this in a minute to go over several days just so you can see that this works, too.
01:24
OK, so I'm off on the second of February. Let's go over to what we have already. And of course, inside of here, we are going to have the second of February within this. Now, just to make this a little bit easier
01:35
to see just while we're playing around with this in the browser, I'm just going to go ahead and iterate over each of these periods. So let's go and do a for each on these periods. And of course, let's call these period and let's just dump.
01:50
On them periods, just so we get a nice list out here and we can just see them a little bit better and to make this even easier, we could use as string that's going to give us this kind of thing here. So we've got this start at this date, at this time, ends at this date,
02:04
ends at this time. So it's just a little bit of an easier way to see what we're doing. So at the moment, obviously, if we look at the exclusion here, the second of February,
02:13
let's go to the second of February here. You can see that sure enough is listed because we haven't excluded it yet. So that's what we do down here. We're just going to find the schedule
02:23
exclusions that exist for that employee, iterate over them and then just remove them from this period. So let's go ahead and do this now. So let's say this employee schedule exclusions.
02:35
And again, we're not going to work at a database level. We're just going to grab the collection here and we're going to do an each over these like so. Now, at this point, it's important to note
02:45
we're not scoping this by the date that's been requested. So this will iterate over every single exclusion that's ever been put into the database. We might go ahead and change that later, because if, say, over a longer period of time, you've created lots of exclusions,
02:58
you're going to end up iterating over way too much data. But we can figure that out later. OK, so we've got a schedule exclusion inside of here for each of these. So let's say schedule exclusion and we'll just call that exclusion.
03:11
And then in here, we'll just call another method. So let's just say this add schedule exclusion. And we'll pass that exclusion in, which, as we know, has a start and end date. OK, so let's go ahead and grab this method name.
03:27
And I'm actually going to call this subtract schedule exclusion, because technically what we're doing is we're removing it from this period collection. So let's grab this and we'll create another method out in here to pretty much do the same thing.
03:41
So we've got the exclusion being passed into here. So let's go ahead and add that in as the exclusion. And this is really simple. So we want to do what we did here, but just subtract the start and end.
03:56
So we're going to again reset periods, because remember, this is immutable. It doesn't mutate it if we just say this periods and subtract. That won't work. So let's say this periods reassign it
04:11
and we want to subtract a new period like we did before. So we're going to make out a period. We want to grab the start date, end date and of course set the precision. So this is going to be the exclusion starts at date, which, remember,
04:26
is cast to a carbon object because we added that over in the model just here. And we'll do the ends at date. So let's fill the ends at date in and we'll go ahead and set the precision in here to a minute because we need all of these precisions to match.
04:43
OK, let's take a look at what this has given us. Remember, the exclusion is all day on the 2nd of February. Let's give that a refresh. And as we can see, this still exists in here.
04:54
So let's just double check. We added this in properly and yeah, we didn't. I copied over to the completely wrong place, which you probably noticed. So let's go ahead and grab the ends at date and we'll add the start date there
05:07
as 9 o'clock, so created at and updated at just when that was inserted, obviously. OK, let's try again. So we've got starts at 9 on the 2nd of February, ends at 5 on the 2nd of February. Let's go over and give that a refresh.
05:21
And there we go. You can see that has now disappeared. So now let's sort of reduce this just to say, well, we might want a half day off or we might want two full days off or we might just want a day off and then come
05:35
in a little bit later the next day. So let's just play around with this and see what happens. So I'm going to reduce this from 9 till 12. So we're just taking the morning off basically.
05:44
And let's give that a refresh. And as you can see is here and we've got we start at 12 o'clock and finish at the normal time minus the services time. So 12 o'clock is not great because we kind of want this to start at 12.
06:00
Again, if you wanted to give them an extra 10 minutes after 12, you would just adjust that at the exclusion level. So let's go ahead and add a boundary onto here and we'll say exclude end. And let's give that a refresh.
06:13
And there we go. So we now start at 12 on this particular day and we finish at normal time. So that's working nicely. And of course, you can adjust that to be whatever within the period of day.
06:23
You could even have lunchtimes off and you could set that as a recurring thing, whatever you wanted to do. So now let's look at what happens if I, for example, want the entire day off on the second and I want to come back
06:37
at 12 on the third, so that would take the entire day on the second and I would start at 12 on the third. Let's give that a refresh and let's have a look at what we've got. OK, so it looks like we're missing a few days here.
06:52
I've got a feeling that the dates that we are iterating through probably fall into a weekend. So just for the sake of testing this out, I'm going to go over to my schedule and I'm going to set that I do work on Saturday.
07:05
And I do work on Sunday just so we don't miss out on any dates. So let's give that a refresh. And OK, yeah, so we start work on the first and nine till the normal time. We've got the entirety of the second off
07:18
because that's how we set that as our exclusion. And then we come in on the third at 12 and of course, finish at normal time. So there we go. We just needed to add in the Saturday and Sunday,
07:28
because sometimes when you're working with these dates, you don't know what day it is, although you could dump that out. And there we go. They are our schedule exclusion.
07:35
So very, very easy to do this in terms of just subtracting a period from that period collection. So now we've got a bunch of blocks which we know we can work based on the schedule that we have, the days that we have and the holidays or schedule exclusions.
39 episodes•5 hrs 0 mins•1 year ago
Overview
Building an availability calendar and booking system is a notoriously difficult problem to solve. That’s exactly what we’re going to cover in this course.
Step by step, we’ll build an appointment slot generator that calculates availability based on employee schedules, employee’s booked time off, the length of service chosen, existing appointments, and cancelled appointments.
For maximum flexibility, we’ll also allow multi-employee availability checks, so we’ll be able to see every employee who can perform a service (and their available slots).
To finish up, we’ll create an entire booking flow with Inertia (using Vue), including a beautiful booking calendar that shows detailed availability across multiple dates, the ability to choose a time slot — and finally the ability to book an appointment.
Phew. We’ve got a lot to learn — let’s build a booking system with Inertia!
Alex Garrett-Smith
Hey, I'm the founder of Codecourse!
Episode discussion
No comments, yet. Be the first!