From 8fcb75eec477f4594cccf0085a04272d183b25cb Mon Sep 17 00:00:00 2001 From: grainsoft Date: Wed, 17 Dec 2025 09:52:17 +0200 Subject: [PATCH] updates --- src/core/Render.js | 6 -- src/core/Rt.js | 2 +- src/utils/form-validator/FormValidator.js | 2 +- src/widgets/popup/Popup.js | 9 ++- src/widgets/two-datepicker/TwoDatepicker.js | 75 ++++++++++++++++++--- 5 files changed, 71 insertions(+), 23 deletions(-) diff --git a/src/core/Render.js b/src/core/Render.js index 74e64f9..4e62925 100644 --- a/src/core/Render.js +++ b/src/core/Render.js @@ -728,13 +728,7 @@ export class Render { new TwoDatePicker(input, { style: field.style || 'normal', disabled: field.disabled || false, - multiple: field.multiple || false, - setTime: field['set-time'] || false, locales: field.locales || 'ro-RO', - dateFormat : field['date-format'] || 'dd-mm-yyyy', - valueFormat : field['value-format'] || 'dd-mm-yyyy', - datesSep : field['dates-sep'] || ' / ', - valuesSep : field['values-sep'] || '&' }); return input; diff --git a/src/core/Rt.js b/src/core/Rt.js index 5fd3b02..ccc4479 100644 --- a/src/core/Rt.js +++ b/src/core/Rt.js @@ -148,7 +148,7 @@ export class Rt { if (Rt.csrfToken) { headers = { 'X-CSRF-TOKEN': Rt.csrfToken } - } + } return async(reqOpts) => { diff --git a/src/utils/form-validator/FormValidator.js b/src/utils/form-validator/FormValidator.js index 29be3e7..2f1ec34 100644 --- a/src/utils/form-validator/FormValidator.js +++ b/src/utils/form-validator/FormValidator.js @@ -29,7 +29,7 @@ export class FormValidator extends Validator { reset_form : false }, ... opts }; - Ut.trigger(this.opts.onInit, this.target.elements); + Ut.trigger(this.opts.onInit, this.target.elements, this); this.setEvents(); } diff --git a/src/widgets/popup/Popup.js b/src/widgets/popup/Popup.js index 6aaa11d..2e072b0 100644 --- a/src/widgets/popup/Popup.js +++ b/src/widgets/popup/Popup.js @@ -160,10 +160,7 @@ export class Popup { resize() { if (this.opts.scrollBar) { - this.card.container.dxCss('max-height', - ( window.innerHeight - (this.card?.toolbar?.clientHeight || 0) - this.opts.marginTop - this.opts.marginBottom ) - + 'px' - ); + this.card.container.style.maxHeight = ( window.innerHeight - (this.card?.toolbar?.clientHeight || 0) - this.opts.marginTop - this.opts.marginBottom ) + 'px'; } Ut.trigger(this.opts.onResize, @@ -178,6 +175,8 @@ export class Popup { */ setEvents() { + const that = this; + if (this.opts.scrollBar) { let tm = null; @@ -189,7 +188,7 @@ export class Popup { tm = null; } - tm = setTimeout(_ => t.resize(), 300); + tm = setTimeout(_ => that.resize(), 300); }); } diff --git a/src/widgets/two-datepicker/TwoDatepicker.js b/src/widgets/two-datepicker/TwoDatepicker.js index b7fb3cd..bdb4778 100644 --- a/src/widgets/two-datepicker/TwoDatepicker.js +++ b/src/widgets/two-datepicker/TwoDatepicker.js @@ -29,7 +29,7 @@ export class TwoDatePicker { anim : true, locales : 'ro-RO', cancelable : true, - hiddenMode : false + hiddenMode : false, }, ... opts }; this.events = events || {}; @@ -69,7 +69,7 @@ export class TwoDatePicker { this.ui.append(firstCol); this.ui.append(secondCol); - let dpOpts = { + const dpOpts = { style : this.opts.style, disabled : this.opts.disabled, fullMonth : this.opts.fullMonth, @@ -81,12 +81,12 @@ export class TwoDatePicker { new DatePicker(firstCol, dpOpts, { init: datepicker => that.datepicker[0] = datepicker, - onSelect: (_, date) => Ut.trigger(that.events.onChange, that, date, 0) + onSelect: (_, val) => this.selectDate(0, val) }); new DatePicker(secondCol, dpOpts, { init: datepicker => that.datepicker[1] = datepicker, - onSelect: (_, date) => Ut.trigger(that.events.onChange, that, date, 1) + onSelect: (_, val) => this.selectDate(1, val) }); if (this.isInput) { @@ -111,9 +111,62 @@ export class TwoDatePicker { this.target.append(this.ui); } - Ut.trigger(this.events.init, this); + Ut.trigger(this.opts.onInit, this); } + /** + * TwoDatePicker, Select Value + */ + selectDate(index, val) { + + Ut.trigger(this.opts.onSelect, this, index, val); + + const firstDp = this.datepicker[0]; + const secondDp = this.datepicker[1]; + + if (index == 0) { + + secondDp.clear(); + secondDp.minDate = firstDp.selectedDate; + + if (firstDp.month != secondDp.month) { + + secondDp.year = firstDp.year; + secondDp.month = firstDp.month; + + secondDp.makeUI(); + } + else { + secondDp.setDateRange({ minDate: firstDp.selectedDate }); + } + + return; + } + + if (!firstDp.selectedDate) { + this.target.value = ''; + return; + } + + this.target.value = `${this.dateFormat(firstDp.selectedDate)} - ${this.dateFormat(secondDp.selectedDate)}`; + this.hide(); + + Ut.trigger(this.opts.onChange, this); + this.target.dxTrigger('changed'); + } + + /** + * TwoDatepicker, Date Format + */ + dateFormat(date) { + return date.toLocaleDateString(this.opts.locales, { + day : '2-digit', + month : '2-digit', + year : 'numeric' + }); + //.replace(/\./g, '/'); + }; + /** * TwoDatePicker, Show UI */ @@ -129,7 +182,7 @@ export class TwoDatePicker { this.isOpen = true; - Ut.trigger(this.events.onShow, this); + Ut.trigger(this.opts.onShow, this); } /** @@ -147,7 +200,7 @@ export class TwoDatePicker { this.isOpen = false; - Ut.trigger(this.events.onHide, this); + Ut.trigger(this.opts.onHide, this); } } @@ -243,7 +296,7 @@ export class TwoDatePicker { this.target.dxOn('clear', _ => { that.clear(); - Ut.trigger(that.events.onChange, that, null, false); + Ut.trigger(that.opts.onChange, that, null, false); }); } @@ -255,7 +308,7 @@ export class TwoDatePicker { // Resize window Handler - window.dxOn('resize.two_datepicker' + this.ekey + ' orientationchange.two_datepicker' + this.ekey, _ => { + window.dxOn('scroll.two_datepicker resize.two_datepicker' + this.ekey + ' orientationchange.two_datepicker' + this.ekey, _ => { if (tm) { clearTimeout(tm); @@ -282,11 +335,13 @@ export class TwoDatePicker { this.target.dxOff('click.two_datepicker keydown.two_datepicker paste.two_datepicker restore.two_datepicker'); document.body.dxOff('click.two_datepicker' + this.ekey); - window.dxOff('resize.two_datepicker' + this.ekey + ' orientationchange.two_datepicker' + this.ekey); + window.dxOff('scroll.two_datepicker resize.two_datepicker' + this.ekey + ' orientationchange.two_datepicker' + this.ekey); } this.target.dxRemoveData('two_datepicker'); Stack.delete(this); + + Ut.trigger(this.opts.onDestroy, this); } } \ No newline at end of file