Skip to content

Commit 1b3d250

Browse files
aplapanaaplapana
committed
ACP2E-3097: Datepicker for product with multiple Customizable Options with date fields not working when placing order from admin
1 parent 5fb6d26 commit 1b3d250

File tree

1 file changed

+113
-108
lines changed

1 file changed

+113
-108
lines changed

‎lib/web/mage/calendar.js

Lines changed: 113 additions & 108 deletions
Original file line numberDiff line numberDiff line change
@@ -105,8 +105,9 @@ define([
105105
_overwriteFindPos: function () {
106106
$.datepicker.constructor.prototype._findPos = function (obj) {
107107
let domPosition = obj.getBoundingClientRect();
108+
108109
return [domPosition.left, domPosition.top];
109-
}
110+
};
110111
},
111112

112113
/**
@@ -151,7 +152,7 @@ define([
151152
dayNames = this._get(inst, 'dayNames'),
152153
dayNamesMin = this._get(inst, 'dayNamesMin'),
153154
monthNames = this._get(inst, 'monthNames'),
154-
monthNamesShort = this._get(inst, 'monthNamesShort'),
155+
monthNamesShort = this._get(inst, 'monthNamesShort'),
155156
beforeShowDay = this._get(inst, 'beforeShowDay'),
156157
showOtherMonths = this._get(inst, 'showOtherMonths'),
157158
selectOtherMonths = this._get(inst, 'selectOtherMonths'),
@@ -208,22 +209,22 @@ define([
208209
'<span class="ui-icon ui-icon-circle-triangle-' + (isRTL ? 'e' : 'w') + '">' +
209210
'' + prevText + '</span></a>'
210211
: hideIfNoPrevNext ? ''
211-
: '<a class="ui-datepicker-prev ui-corner-all ui-state-disabled" title="' +
212-
'' + prevText + '"><span class="ui-icon ui-icon-circle-triangle-' +
213-
'' + (isRTL ? 'e' : 'w') + '">' + prevText + '</span></a>';
212+
: '<a class="ui-datepicker-prev ui-corner-all ui-state-disabled" title="' +
213+
'' + prevText + '"><span class="ui-icon ui-icon-circle-triangle-' +
214+
'' + (isRTL ? 'e' : 'w') + '">' + prevText + '</span></a>';
214215
nextText = !navigationAsDateFormat ?
215216
nextText
216-
: this.formatDate(nextText,
217+
: this.formatDate(nextText,
217218
this._daylightSavingAdjust(new Date(drawYear, drawMonth + stepMonths, 1)),
218219
this._getFormatConfig(inst));
219220
next = this._canAdjustMonth(inst, +1, drawYear, drawMonth) ?
220221
'<a class="ui-datepicker-next ui-corner-all" data-handler="next" data-event="click"' +
221222
'title="' + nextText + '"><span class="ui-icon ui-icon-circle-triangle-' +
222223
'' + (isRTL ? 'w' : 'e') + '">' + nextText + '</span></a>'
223224
: hideIfNoPrevNext ? ''
224-
: '<a class="ui-datepicker-next ui-corner-all ui-state-disabled" title="' + nextText + '">' +
225-
'<span class="ui-icon ui-icon-circle-triangle-' + (isRTL ? 'w' : 'e') + '">' + nextText +
226-
'</span></a>';
225+
: '<a class="ui-datepicker-next ui-corner-all ui-state-disabled" title="' + nextText + '">' +
226+
'<span class="ui-icon ui-icon-circle-triangle-' + (isRTL ? 'w' : 'e') + '">' + nextText +
227+
'</span></a>';
227228
gotoDate = this._get(inst, 'gotoCurrent') && inst.currentDay ? currentDate : today;
228229
currentText = !navigationAsDateFormat ? currentText :
229230
this.formatDate(currentText, gotoDate, this._getFormatConfig(inst));
@@ -235,8 +236,8 @@ define([
235236
buttonPanel = showButtonPanel ?
236237
'<div class="ui-datepicker-buttonpane ui-widget-content">' + (isRTL ? controls : '') +
237238
(this._isInRange(inst, gotoDate) ? '<button type="button" class="ui-datepicker-current ' +
238-
'ui-state-default ui-priority-secondary ui-corner-all" data-handler="today" data-event="click"' +
239-
'>' + currentText + '</button>' : '') + (isRTL ? '' : controls) + '</div>' : '';
239+
'ui-state-default ui-priority-secondary ui-corner-all" data-handler="today" data-event="click"' +
240+
'>' + currentText + '</button>' : '') + (isRTL ? '' : controls) + '</div>' : '';
240241
firstDay = parseInt(this._get(inst, 'firstDay'), 10);
241242
firstDay = isNaN(firstDay) ? 0 : firstDay;
242243

@@ -253,15 +254,19 @@ define([
253254

254255
if (numMonths[1] > 1) {
255256
switch (col) {
256-
case 0: calender += ' ui-datepicker-group-first';
257+
case 0:
258+
calender += ' ui-datepicker-group-first';
257259
cornerClass = ' ui-corner-' + (isRTL ? 'right' : 'left');
258260
break;
259261

260-
case numMonths[1] - 1: calender += ' ui-datepicker-group-last';
262+
case numMonths[1] - 1:
263+
calender += ' ui-datepicker-group-last';
261264
cornerClass = ' ui-corner-' + (isRTL ? 'left' : 'right');
262265
break;
263266

264-
default: calender += ' ui-datepicker-group-middle'; cornerClass = '';
267+
default:
268+
calender += ' ui-datepicker-group-middle';
269+
cornerClass = '';
265270
}
266271
}
267272
calender += '">';
@@ -271,7 +276,7 @@ define([
271276
(/all|left/.test(cornerClass) && parseInt(row, 10) === 0 ? isRTL ? next : prev : '') +
272277
(/all|right/.test(cornerClass) && parseInt(row, 10) === 0 ? isRTL ? prev : next : '') +
273278
this._generateMonthYearHeader(inst, drawMonth, drawYear, minDate, maxDate,
274-
row > 0 || col > 0, monthNames, monthNamesShort) + // draw month headers
279+
row > 0 || col > 0, monthNames, monthNamesShort) + // draw month headers
275280
'</div><table class="ui-datepicker-calendar"><thead>' +
276281
'<tr>';
277282
thead = showWeek ?
@@ -280,7 +285,7 @@ define([
280285
for (dow = 0; dow < 7; dow++) { // days of the week
281286
day = (dow + firstDay) % 7;
282287
thead += '<th' + ((dow + firstDay + 6) % 7 >= 5 ?
283-
' class="ui-datepicker-week-end"' : '') + '>' +
288+
' class="ui-datepicker-week-end"' : '') + '>' +
284289
'<span title="' + dayNames[day] + '">' + dayNamesMin[day] + '</span></th>';
285290
}
286291
calender += thead + '</tr></thead><tbody>';
@@ -298,40 +303,40 @@ define([
298303
for (dRow = 0; dRow < numRows; dRow++) { // create date picker rows
299304
calender += '<tr>';
300305
tbody = !showWeek ? '' : '<td class="ui-datepicker-week-col">' +
301-
this._get(inst, 'calculateWeek')(printDate) + '</td>';
306+
this._get(inst, 'calculateWeek')(printDate) + '</td>';
302307

303308
for (dow = 0; dow < 7; dow++) { // create date picker days
304309
daySettings = beforeShowDay ?
305310
beforeShowDay.apply(inst.input ? inst.input[0] : null, [printDate]) : [true, ''];
306311
otherMonth = printDate.getMonth() !== drawMonth;
307312
unselectable = otherMonth && !selectOtherMonths || !daySettings[0] ||
308-
minDate && printDate < minDate || maxDate && printDate > maxDate;
313+
minDate && printDate < minDate || maxDate && printDate > maxDate;
309314
tbody += '<td class="' +
310-
((dow + firstDay + 6) % 7 >= 5 ? ' ui-datepicker-week-end' : '') + // highlight weekends
311-
(otherMonth ? ' ui-datepicker-other-month' : '') + // highlight days from other months
312-
(printDate.getTime() === selectedDate.getTime() &&
313-
drawMonth === inst.selectedMonth && inst._keyEvent || // user pressed key
314-
defaultDate.getTime() === printDate.getTime() &&
315-
defaultDate.getTime() === selectedDate.getTime() ?
316-
// or defaultDate is current printedDate and defaultDate is selectedDate
317-
' ' + this._dayOverClass : '') + // highlight selected day
318-
(unselectable ? ' ' + this._unselectableClass + ' ui-state-disabled' : '') +
319-
(otherMonth && !showOtherMonths ? '' : ' ' + daySettings[1] + // highlight custom dates
320-
(printDate.getTime() === currentDate.getTime() ? ' ' + this._currentClass : '') +
321-
(printDate.getDate() === today.getDate() && printDate.getMonth() === today.getMonth() &&
322-
printDate.getYear() === today.getYear() ? ' ui-datepicker-today' : '')) + '"' +
323-
((!otherMonth || showOtherMonths) && daySettings[2] ?
324-
' title="' + daySettings[2] + '"' : '') + // cell title
325-
(unselectable ? '' : ' data-handler="selectDay" data-event="click" data-month="' +
326-
'' + printDate.getMonth() + '" data-year="' + printDate.getFullYear() + '"') + '>' +
327-
(otherMonth && !showOtherMonths ? '&#xa0;' : // display for other months
328-
unselectable ? '<span class="ui-state-default">' + printDate.getDate() + '</span>'
329-
: '<a class="ui-state-default' +
330-
(printDate.getTime() === today.getTime() ? ' ' : '') +
331-
(printDate.getTime() === currentDate.getTime() ? ' ui-state-active' : '') +
332-
(otherMonth ? ' ui-priority-secondary' : '') +
333-
'" data-date="' + printDate.getDate() + '" href="#">' +
334-
printDate.getDate() + '</a>') + '</td>';
315+
((dow + firstDay + 6) % 7 >= 5 ? ' ui-datepicker-week-end' : '') + // highlight weekends
316+
(otherMonth ? ' ui-datepicker-other-month' : '') + // highlight days from other months
317+
(printDate.getTime() === selectedDate.getTime() &&
318+
drawMonth === inst.selectedMonth && inst._keyEvent || // user pressed key
319+
defaultDate.getTime() === printDate.getTime() &&
320+
defaultDate.getTime() === selectedDate.getTime() ?
321+
// or defaultDate is current printedDate and defaultDate is selectedDate
322+
' ' + this._dayOverClass : '') + // highlight selected day
323+
(unselectable ? ' ' + this._unselectableClass + ' ui-state-disabled' : '') +
324+
(otherMonth && !showOtherMonths ? '' : ' ' + daySettings[1] + // highlight custom dates
325+
(printDate.getTime() === currentDate.getTime() ? ' ' + this._currentClass : '') +
326+
(printDate.getDate() === today.getDate() && printDate.getMonth() === today.getMonth() &&
327+
printDate.getYear() === today.getYear() ? ' ui-datepicker-today' : '')) + '"' +
328+
((!otherMonth || showOtherMonths) && daySettings[2] ?
329+
' title="' + daySettings[2] + '"' : '') + // cell title
330+
(unselectable ? '' : ' data-handler="selectDay" data-event="click" data-month="' +
331+
'' + printDate.getMonth() + '" data-year="' + printDate.getFullYear() + '"') + '>' +
332+
(otherMonth && !showOtherMonths ? '&#xa0;' : // display for other months
333+
unselectable ? '<span class="ui-state-default">' + printDate.getDate() + '</span>'
334+
: '<a class="ui-state-default' +
335+
(printDate.getTime() === today.getTime() ? ' ' : '') +
336+
(printDate.getTime() === currentDate.getTime() ? ' ui-state-active' : '') +
337+
(otherMonth ? ' ui-priority-secondary' : '') +
338+
'" data-date="' + printDate.getDate() + '" href="#">' +
339+
printDate.getDate() + '</a>') + '</td>';
335340
printDate.setDate(printDate.getDate() + 1);
336341
printDate = this._daylightSavingAdjust(printDate);
337342
}
@@ -344,8 +349,8 @@ define([
344349
drawYear++;
345350
}
346351
calender += '</tbody></table>' + (isMultiMonth ? '</div>' +
347-
(numMonths[0] > 0 && col === numMonths[1] - 1 ? '<div class="ui-datepicker-row-break"></div>'
348-
: '') : '');
352+
(numMonths[0] > 0 && col === numMonths[1] - 1 ? '<div class="ui-datepicker-row-break"></div>'
353+
: '') : '');
349354
group += calender;
350355
}
351356
html += group;
@@ -415,72 +420,72 @@ define([
415420
* @var {Object}
416421
*/
417422
$.widget('mage.calendar', $.extend({}, calendarBasePrototype,
418-
/** @lends {$.mage.calendar.prototype} */ {
419-
/**
420-
* key - backend format, value - jquery format
421-
* @type {Object}
422-
* @private
423-
*/
424-
dateTimeFormat: {
425-
date: {
426-
'EEEE': 'DD',
427-
'EEE': 'D',
428-
'EE': 'D',
429-
'E': 'D',
430-
'D': 'o',
431-
'MMMM': 'MM',
432-
'MMM': 'M',
433-
'MM': 'mm',
434-
'M': 'mm',
435-
'yyyy': 'yy',
436-
'y': 'yy',
437-
'Y': 'yy',
438-
'yy': 'yy' // Always long year format on frontend
439-
},
440-
time: {
441-
'a': 'TT'
442-
}
423+
/** @lends {$.mage.calendar.prototype} */ {
424+
/**
425+
* key - backend format, value - jquery format
426+
* @type {Object}
427+
* @private
428+
*/
429+
dateTimeFormat: {
430+
date: {
431+
'EEEE': 'DD',
432+
'EEE': 'D',
433+
'EE': 'D',
434+
'E': 'D',
435+
'D': 'o',
436+
'MMMM': 'MM',
437+
'MMM': 'M',
438+
'MM': 'mm',
439+
'M': 'mm',
440+
'yyyy': 'yy',
441+
'y': 'yy',
442+
'Y': 'yy',
443+
'yy': 'yy' // Always long year format on frontend
443444
},
445+
time: {
446+
'a': 'TT'
447+
}
448+
},
444449

445-
/**
446-
* Add Date and Time converting to _create method
447-
* @protected
448-
*/
449-
_create: function () {
450-
if (this.options.dateFormat) {
451-
this.options.dateFormat = this._convertFormat(this.options.dateFormat, 'date');
452-
}
453-
454-
if (this.options.timeFormat) {
455-
this.options.timeFormat = this._convertFormat(this.options.timeFormat, 'time');
456-
}
457-
calendarBasePrototype._create.apply(this, arguments);
458-
},
450+
/**
451+
* Add Date and Time converting to _create method
452+
* @protected
453+
*/
454+
_create: function () {
455+
if (this.options.dateFormat) {
456+
this.options.dateFormat = this._convertFormat(this.options.dateFormat, 'date');
457+
}
459458

460-
/**
461-
* Converting date or time format
462-
* @protected
463-
* @param {String} format
464-
* @param {String} type
465-
* @return {String}
466-
*/
467-
_convertFormat: function (format, type) {
468-
var symbols = format.match(/([a-z]+)/ig),
469-
separators = format.match(/([^a-z]+)/ig),
470-
self = this,
471-
convertedFormat = '';
472-
473-
if (symbols) {
474-
$.each(symbols, function (key, val) {
475-
convertedFormat +=
476-
(self.dateTimeFormat[type][val] || val) +
477-
(separators[key] || '');
478-
});
479-
}
459+
if (this.options.timeFormat) {
460+
this.options.timeFormat = this._convertFormat(this.options.timeFormat, 'time');
461+
}
462+
calendarBasePrototype._create.apply(this, arguments);
463+
},
480464

481-
return convertedFormat;
465+
/**
466+
* Converting date or time format
467+
* @protected
468+
* @param {String} format
469+
* @param {String} type
470+
* @return {String}
471+
*/
472+
_convertFormat: function (format, type) {
473+
var symbols = format.match(/([a-z]+)/ig),
474+
separators = format.match(/([^a-z]+)/ig),
475+
self = this,
476+
convertedFormat = '';
477+
478+
if (symbols) {
479+
$.each(symbols, function (key, val) {
480+
convertedFormat +=
481+
(self.dateTimeFormat[type][val] || val) +
482+
(separators[key] || '');
483+
});
482484
}
483-
})
485+
486+
return convertedFormat;
487+
}
488+
})
484489
);
485490

486491
/**
@@ -564,7 +569,7 @@ define([
564569
};
565570

566571
return {
567-
dateRange: $.mage.dateRange,
568-
calendar: $.mage.calendar
572+
dateRange: $.mage.dateRange,
573+
calendar: $.mage.calendar
569574
};
570575
});

0 commit comments

Comments
 (0)