maket/MaketRandevu
1
1
Fork 0
Code Issues 15 Pull requests Projects Releases 4 Packages Wiki Activity

Added dynamic date formats to backend/calendar page (not finished yet).

Browse source
This commit is contained in:
Alex Tselegidis 2015-12-11 00:04:40 +01:00
parent 8dd6a4a4e3
commit e7b9b80264
2 changed files with 47 additions and 30 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

61
src/assets/js/backend_calendar.js
View file

@ -203,12 +203,12 @@ var BackendCalendar = {
// Set the start and end datetime of the appointment. // Set the start and end datetime of the appointment.
var startDatetime = Date.parseExact(appointment['start_datetime'], var startDatetime = Date.parseExact(appointment['start_datetime'],
'yyyy-MM-dd HH:mm:ss').toString('dd/MM/yyyy HH:mm'); 'yyyy-MM-dd HH:mm:ss');
$dialog.find('#start-datetime').val(startDatetime); $dialog.find('#start-datetime').val(GeneralFunctions.formatDate(startDatetime, GlobalVariables.dateFormat, true));
var endDatetime = Date.parseExact(appointment['end_datetime'], var endDatetime = Date.parseExact(appointment['end_datetime'],
'yyyy-MM-dd HH:mm:ss').toString('dd/MM/yyyy HH:mm'); 'yyyy-MM-dd HH:mm:ss');
$dialog.find('#end-datetime').val(endDatetime); $dialog.find('#end-datetime').val(GeneralFunctions.formatDate(endDatetime, GlobalVariables.dateFormat, true));
var customer = appointment['customer']; var customer = appointment['customer'];
$dialog.find('#customer-id').val(appointment['id_users_customer']); $dialog.find('#customer-id').val(appointment['id_users_customer']);
@ -275,8 +275,7 @@ var BackendCalendar = {
$('#calendar').fullCalendar('getView').visStart, $('#calendar').fullCalendar('getView').visStart,
$('#calendar').fullCalendar('getView').visEnd); $('#calendar').fullCalendar('getView').visEnd);
// If current value is service, then the sync buttons must be // If current value is service, then the sync buttons must be disabled.
// disabled.
if ($('#select-filter-item option:selected').attr('type') if ($('#select-filter-item option:selected').attr('type')
=== BackendCalendar.FILTER_TYPE_SERVICE) { === BackendCalendar.FILTER_TYPE_SERVICE) {
$('#google-sync, #enable-sync, #insert-appointment, #insert-unavailable') $('#google-sync, #enable-sync, #insert-appointment, #insert-unavailable')
@ -382,12 +381,12 @@ var BackendCalendar = {
// Set the start and end datetime of the appointment. // Set the start and end datetime of the appointment.
var startDatetime = Date.parseExact(appointment['start_datetime'], var startDatetime = Date.parseExact(appointment['start_datetime'],
'yyyy-MM-dd HH:mm:ss').toString('dd/MM/yyyy HH:mm'); 'yyyy-MM-dd HH:mm:ss');
$dialog.find('#start-datetime').val(startDatetime); $dialog.find('#start-datetime').val(GeneralFunctions.formatDate(startDatetime, GlobalVariables.dateFormat, true));
var endDatetime = Date.parseExact(appointment['end_datetime'], var endDatetime = Date.parseExact(appointment['end_datetime'],
'yyyy-MM-dd HH:mm:ss').toString('dd/MM/yyyy HH:mm'); 'yyyy-MM-dd HH:mm:ss');
$dialog.find('#end-datetime').val(endDatetime); $dialog.find('#end-datetime').val(GeneralFunctions.formatDate(endDatetime, GlobalVariables.dateFormat, true));
var customer = appointment['customer']; var customer = appointment['customer'];
$dialog.find('#customer-id').val(appointment['id_users_customer']); $dialog.find('#customer-id').val(appointment['id_users_customer']);
@ -538,9 +537,9 @@ var BackendCalendar = {
// Id must exist on the object in order for the model to update // Id must exist on the object in order for the model to update
// the record and not to perform an insert operation. // the record and not to perform an insert operation.
var startDatetime = Date.parseExact($dialog.find('#start-datetime').val(), var startDatetime = Date.parse($dialog.find('#start-datetime').val(),
'dd/MM/yyyy HH:mm').toString('yyyy-MM-dd HH:mm:ss'); 'dd/MM/yyyy HH:mm').toString('yyyy-MM-dd HH:mm:ss');
var endDatetime = Date.parseExact($dialog.find('#end-datetime').val(), var endDatetime = Date.parse($dialog.find('#end-datetime').val(),
'dd/MM/yyyy HH:mm').toString('yyyy-MM-dd HH:mm:ss'); 'dd/MM/yyyy HH:mm').toString('yyyy-MM-dd HH:mm:ss');
var appointment = { var appointment = {
@ -836,8 +835,9 @@ var BackendCalendar = {
else else
start.addHours(1).set({ 'minute': 0 }); start.addHours(1).set({ 'minute': 0 });
$dialog.find('#start-datetime').val(start.toString('dd/MM/yyyy HH:mm')); $dialog.find('#start-datetime').val(GeneralFunctions.formatDate(start, GlobalVariables.dateFormat, true));
$dialog.find('#end-datetime').val(start.addMinutes(serviceDuration).toString('dd/MM/yyyy HH:mm')); $dialog.find('#end-datetime').val(GeneralFunctions.formatDate(start.addMinutes(serviceDuration),
GlobalVariables.dateFormat, true));
// Display modal form. // Display modal form.
$dialog.find('.modal-header h3').text(EALang['new_appointment_title']); $dialog.find('.modal-header h3').text(EALang['new_appointment_title']);
@ -1910,13 +1910,28 @@ var BackendCalendar = {
} }
}); });
var startDatetime = new Date().addMinutes(GlobalVariables.bookAdvanceTimeout) var startDatetime = new Date().addMinutes(GlobalVariables.bookAdvanceTimeout),
.toString('dd/MM/yyyy HH:mm'); formattedStartDatetime = GeneralFunctions.formatDate(startDatetime, GlobalVariables.dateFormat, true);
var endDatetime = new Date().addMinutes(GlobalVariables.bookAdvanceTimeout) var endDatetime = new Date().addMinutes(GlobalVariables.bookAdvanceTimeout)
.addMinutes(serviceDuration).toString('dd/MM/yyyy HH:mm'); .addMinutes(serviceDuration),
formattedEndDatetime = GeneralFunctions.formatDate(endDatetime, GlobalVariables.dateFormat, true);
var dateFormat;
switch(GlobalVariables.dateFormat) {
case 'DMY':
dateFormat = 'dd/mm/yy';
break;
case 'MDY':
dateFormat = 'mm/dd/yy';
break;
case 'YMD':
dateFormat = 'yy/mm/dd';
break;
}
$dialog.find('#start-datetime').datetimepicker({ $dialog.find('#start-datetime').datetimepicker({
'dateFormat': 'dd/mm/yy', 'dateFormat': dateFormat,
// Translation // Translation
dayNames: [EALang['sunday'], EALang['monday'], EALang['tuesday'], EALang['wednesday'], dayNames: [EALang['sunday'], EALang['monday'], EALang['tuesday'], EALang['wednesday'],
EALang['thursday'], EALang['friday'], EALang['saturday']], EALang['thursday'], EALang['friday'], EALang['saturday']],
@ -1941,10 +1956,10 @@ var BackendCalendar = {
minuteText: EALang['minutes'], minuteText: EALang['minutes'],
firstDay: 1 firstDay: 1
}); });
$dialog.find('#start-datetime').val(startDatetime); $dialog.find('#start-datetime').val(formattedStartDatetime);
$dialog.find('#end-datetime').datetimepicker({ $dialog.find('#end-datetime').datetimepicker({
'dateFormat': 'dd/mm/yy', 'dateFormat': dateFormat,
// Translation // Translation
dayNames: [EALang['sunday'], EALang['monday'], EALang['tuesday'], EALang['wednesday'], dayNames: [EALang['sunday'], EALang['monday'], EALang['tuesday'], EALang['wednesday'],
EALang['thursday'], EALang['friday'], EALang['saturday']], EALang['thursday'], EALang['friday'], EALang['saturday']],
@ -1969,7 +1984,7 @@ var BackendCalendar = {
minuteText: EALang['minutes'], minuteText: EALang['minutes'],
firstDay: 1 firstDay: 1
}); });
$dialog.find('#end-datetime').val(endDatetime); $dialog.find('#end-datetime').val(formattedEndDatetime);
}, },
/** /**
@ -2005,8 +2020,8 @@ var BackendCalendar = {
} }
// :: CHECK APPOINTMENT START AND END TIME // :: CHECK APPOINTMENT START AND END TIME
var start = Date.parseExact($('#start-datetime').val(), 'dd/MM/yyyy HH:mm'); var start = Date.parse($('#start-datetime').val(), 'dd/MM/yyyy HH:mm');
var end = Date.parseExact($('#end-datetime').val(), 'dd/MM/yyyy HH:mm'); var end = Date.parse($('#end-datetime').val(), 'dd/MM/yyyy HH:mm');
if (start > end) { if (start > end) {
$dialog.find('#start-datetime').parents().eq(1).addClass('error'); $dialog.find('#start-datetime').parents().eq(1).addClass('error');
$dialog.find('#end-datetime').parents().eq(1).addClass('error'); $dialog.find('#end-datetime').parents().eq(1).addClass('error');

16
src/assets/js/general_functions.js
View file

@ -369,23 +369,25 @@ var GeneralFunctions = {
/** /**
* Format a given date according to the date format setting. * Format a given date according to the date format setting.
* *
* @param {Date]} date The date to be formatted. * @param {Date]} date The date to be formatted.
* @param {string} dateFormatSetting The setting provided by PHP must be one of * @param {string} dateFormatSetting The setting provided by PHP must be one of
* the "DMY", "MDY" or "YMD". * the "DMY", "MDY" or "YMD".
* @param {bool} addHours (optional) Whether to add hours to the result.
* @returns {string} Returns the formatted date string. * @returns {string} Returns the formatted date string.
*/ */
formatDate: function(date, dateFormatSetting) { formatDate: function(date, dateFormatSetting, addHours) {
var result; var format, result,
hours = addHours ? ' HH:mm' : '';
switch(dateFormatSetting) { switch(dateFormatSetting) {
case 'DMY': case 'DMY':
result = Date.parse(date).toString('dd/MM/yyyy'); result = Date.parse(date).toString('dd/MM/yyyy' + hours);
break; break;
case 'MDY': case 'MDY':
result = Date.parse(date).toString('MM/dd/yyyy'); result = Date.parse(date).toString('MM/dd/yyyy' + hours);
break; break;
case 'YMD': case 'YMD':
result = Date.parse(date).toString('yyyy/MM/dd'); result = Date.parse(date).toString('yyyy/MM/dd' + hours);
break; break;
default: default:
throw new Error('Invalid date format setting provided!', dateFormatSetting); throw new Error('Invalid date format setting provided!', dateFormatSetting);