JS | Count available timeslots of each staffs for the next few days

Posted about 1 year by Julien Pauthier

Post a topic
Julien Pauthier
Julien Pauthier Admin

This script lists how many available time slots each staff has for the next days:


<html>
<head>
    <title>Available time slots</title>
    <script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
</head>
<script type="text/javascript">

var idCompany = "";
var apiKey = "";
var token = "";
var url = "https://app.agendize.com/api/2.1/scheduling/companies/" + idCompany + "/staff?apikey=" + apiKey + "&token=" + token;
var xhr = new XMLHttpRequest();
var resultApi = [];

var nextDay;
var nbDaysMax = 10; // Maximum delay for booking
var nbDaysMin = 1; // Minimum delay for booking

var staffName = "";
var staffId = "";
var days = ['Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday'];

xhr.open("GET", url, true);
xhr.setRequestHeader("Content-Type", "application/json");
xhr.onreadystatechange = function () {
    var subresult = [];
    if (xhr.readyState === 4 && xhr.status === 200) {
        var json = JSON.parse(xhr.responseText);
        
        for (i = 0; i < json.items.length; i++) {
            nextDay = new Date();
            nextDay = new Date(nextDay.setDate(nextDay.getDate()+nbDaysMin-1));
            staffName = json.items[i].firstName + " " + json.items[i].lastName;
            staffId = json.items[i].id;
            console.log(staffId);

            for (currentDay = nbDaysMin-1; currentDay < nbDaysMax; currentDay++) {
                nextDay = new Date(nextDay.setDate(nextDay.getDate()+1));
                console.log(nextDay.getDay());
                        
                switch (nextDay.getDay()) {
                    case 1 : // Monday (only counting available time slots for week days in this example)
                    case 2 :
                    case 3 :
                    case 4 :
                    case 5 : // Friday
                        $.ajax({
                            type: 'GET',
                            url: "https://app.agendize.com/api/2.1/scheduling/companies/" + idCompany + "/widget/freeSlots?staffId=" + json.items[i].id + "&serviceId=[shortest]&startDate=" + nextDay.toISOString().split('T')[0] + "&endDate=" + nextDay.toISOString().split('T')[0] + "&apikey=" + apiKey + "&token=" + token,
                            dataType: 'json',
                            success: function(data) {
                            var items = [];
                        $.each(data.items, function(i,item){
                            subresult = [];
                            subresult.push(staffId);
                            subresult.push(staffName);
                            subresult.push(nextDay.toISOString().split('T')[0] + " (" + days[nextDay.getDay()] + ")");
                            subresult.push(item.slots.length);
                            resultApi.push(subresult);
                            });
                        },
                            data: {},
                            async: false
                        });
                    break;
                }
            }
        }
        
        process(resultApi);
    }
}
xhr.send();

function process(resultApi) {
    document.write("<body><table>");
    document.write('<thead style="font-weight:bold;background-color:#eee;"><td>Staff</td><td>Date</td><td>Slots</td></thead>');
    document.write("<tbody>");
    odd = false;
    var lang;
    var phone;
    for (i = 0; i < resultApi.length; i++) {
        document.write("<tr");
        if (odd) {      
                document.write(' style="background-color:#eee;"');
        }
        odd = !odd;
        document.write(">");
        document.write("<td><a target='new' href='https://app.agendize.com/book/" + idCompany + "/?cs=false&staff=" + resultApi[i][0] + "'>" + resultApi[i][1] + "</a></td>");
        document.write("<td>" + resultApi[i][2] + "</td>");
        document.write("<td " + ((resultApi[i][3] > 0) ? " style='font-weight:bold;'" : "") + ">" + resultApi[i][3] + "</td>");
        document.write("</tr>");
    }
    document.write("</tbody>");
    document.write("</table></body></html>");
}
</script>



0 Votes


1 Comments

Arnaud Masson

Arnaud Masson posted about 1 year Admin

Merci Julien

0 Votes

Login or Sign up to post a comment