From 2ba5ca3db55578efb7e323494888f4e73dba533f Mon Sep 17 00:00:00 2001 From: Alex Tselegidis Date: Mon, 18 Jul 2016 20:18:55 +0200 Subject: [PATCH] Added events to table view (#182). --- src/assets/js/backend_calendar_table_view.js | 38 ++++++++++++++++++-- 1 file changed, 35 insertions(+), 3 deletions(-) diff --git a/src/assets/js/backend_calendar_table_view.js b/src/assets/js/backend_calendar_table_view.js index c34deef2..24317250 100644 --- a/src/assets/js/backend_calendar_table_view.js +++ b/src/assets/js/backend_calendar_table_view.js @@ -38,9 +38,41 @@ window.BackendCalendarTableView = window.BackendCalendarTableView || {}; _createView(startDate, endDate); }); - // @todo reload appts event + $calendarToolbar.on('change', '#select-filter-item', function() { + var startDate = new Date($('.calendar-view .date-column:first').data('date')); + var endDate = new Date(startDate.getTime()).add({days: parseInt($(this).val()) - 1}); + _createView(startDate, endDate); + }); + + $calendarToolbar.on('click', '#reload-appointments', function() { + var startDate = new Date($('.calendar-view .date-column:first').data('date')); + var endDate = new Date($('.calendar-view .date-column:last').data('date')); + _createView(startDate, endDate); + }); - // @todo click slot shows appointments modal + $calendar.on('click', '.calendar-view table td', function() { + if ($(this).index() === 0) { + return; // Clicked on an hour slot. + } + + // Open the appointments modal in the selected hour. + var hour = $(this).parent().find('td:first').text().split(':'); + var date = new Date($(this).parents('.date-column').data('date')); + date.set({hour: parseInt(hour[0]), minute: parseInt(hour[1])}); + + // Open the appointments dialog. + $('#insert-appointment').trigger('click'); + + // Update start date field. + $('#start-datetime').datepicker('setDate', date); + + // Select Service and provider. + var $providerColumn = $(this).parents('.provider-column'); + var serviceId = $providerColumn.find('thead tr:last th').eq($(this).index()).data('id'); + var providerId = $providerColumn.data('provider').id; + $('#select-service').val(serviceId).trigger('change'); + $('#select-provider').val(providerId).trigger('change'); + }); } function _createHeader() { @@ -75,7 +107,7 @@ window.BackendCalendarTableView = window.BackendCalendarTableView || {}; * @param {Date} endDate End date to be displayed. */ function _createView(startDate, endDate) { - $('#calendar .calendar-view').remove(); + $('#calendar .calendar-view').empty(); var $calendarView = $('
').appendTo('#calendar');