updates
This commit is contained in:
@@ -728,13 +728,7 @@ export class Render {
|
|||||||
new TwoDatePicker(input, {
|
new TwoDatePicker(input, {
|
||||||
style: field.style || 'normal',
|
style: field.style || 'normal',
|
||||||
disabled: field.disabled || false,
|
disabled: field.disabled || false,
|
||||||
multiple: field.multiple || false,
|
|
||||||
setTime: field['set-time'] || false,
|
|
||||||
locales: field.locales || 'ro-RO',
|
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;
|
return input;
|
||||||
|
|||||||
+1
-1
@@ -148,7 +148,7 @@ export class Rt {
|
|||||||
|
|
||||||
if (Rt.csrfToken) {
|
if (Rt.csrfToken) {
|
||||||
headers = { 'X-CSRF-TOKEN': Rt.csrfToken }
|
headers = { 'X-CSRF-TOKEN': Rt.csrfToken }
|
||||||
}
|
}
|
||||||
|
|
||||||
return async(reqOpts) => {
|
return async(reqOpts) => {
|
||||||
|
|
||||||
|
|||||||
@@ -29,7 +29,7 @@ export class FormValidator extends Validator {
|
|||||||
reset_form : false
|
reset_form : false
|
||||||
}, ... opts };
|
}, ... opts };
|
||||||
|
|
||||||
Ut.trigger(this.opts.onInit, this.target.elements);
|
Ut.trigger(this.opts.onInit, this.target.elements, this);
|
||||||
|
|
||||||
this.setEvents();
|
this.setEvents();
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -160,10 +160,7 @@ export class Popup {
|
|||||||
resize() {
|
resize() {
|
||||||
|
|
||||||
if (this.opts.scrollBar) {
|
if (this.opts.scrollBar) {
|
||||||
this.card.container.dxCss('max-height',
|
this.card.container.style.maxHeight = ( window.innerHeight - (this.card?.toolbar?.clientHeight || 0) - this.opts.marginTop - this.opts.marginBottom ) + 'px';
|
||||||
( window.innerHeight - (this.card?.toolbar?.clientHeight || 0) - this.opts.marginTop - this.opts.marginBottom )
|
|
||||||
+ 'px'
|
|
||||||
);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
Ut.trigger(this.opts.onResize,
|
Ut.trigger(this.opts.onResize,
|
||||||
@@ -178,6 +175,8 @@ export class Popup {
|
|||||||
*/
|
*/
|
||||||
setEvents() {
|
setEvents() {
|
||||||
|
|
||||||
|
const that = this;
|
||||||
|
|
||||||
if (this.opts.scrollBar) {
|
if (this.opts.scrollBar) {
|
||||||
|
|
||||||
let tm = null;
|
let tm = null;
|
||||||
@@ -189,7 +188,7 @@ export class Popup {
|
|||||||
tm = null;
|
tm = null;
|
||||||
}
|
}
|
||||||
|
|
||||||
tm = setTimeout(_ => t.resize(), 300);
|
tm = setTimeout(_ => that.resize(), 300);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -29,7 +29,7 @@ export class TwoDatePicker {
|
|||||||
anim : true,
|
anim : true,
|
||||||
locales : 'ro-RO',
|
locales : 'ro-RO',
|
||||||
cancelable : true,
|
cancelable : true,
|
||||||
hiddenMode : false
|
hiddenMode : false,
|
||||||
}, ... opts };
|
}, ... opts };
|
||||||
|
|
||||||
this.events = events || {};
|
this.events = events || {};
|
||||||
@@ -69,7 +69,7 @@ export class TwoDatePicker {
|
|||||||
this.ui.append(firstCol);
|
this.ui.append(firstCol);
|
||||||
this.ui.append(secondCol);
|
this.ui.append(secondCol);
|
||||||
|
|
||||||
let dpOpts = {
|
const dpOpts = {
|
||||||
style : this.opts.style,
|
style : this.opts.style,
|
||||||
disabled : this.opts.disabled,
|
disabled : this.opts.disabled,
|
||||||
fullMonth : this.opts.fullMonth,
|
fullMonth : this.opts.fullMonth,
|
||||||
@@ -81,12 +81,12 @@ export class TwoDatePicker {
|
|||||||
|
|
||||||
new DatePicker(firstCol, dpOpts, {
|
new DatePicker(firstCol, dpOpts, {
|
||||||
init: datepicker => that.datepicker[0] = datepicker,
|
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, {
|
new DatePicker(secondCol, dpOpts, {
|
||||||
init: datepicker => that.datepicker[1] = datepicker,
|
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) {
|
if (this.isInput) {
|
||||||
@@ -111,9 +111,62 @@ export class TwoDatePicker {
|
|||||||
this.target.append(this.ui);
|
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
|
* TwoDatePicker, Show UI
|
||||||
*/
|
*/
|
||||||
@@ -129,7 +182,7 @@ export class TwoDatePicker {
|
|||||||
|
|
||||||
this.isOpen = true;
|
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;
|
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', _ => {
|
this.target.dxOn('clear', _ => {
|
||||||
that.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
|
// 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) {
|
if (tm) {
|
||||||
clearTimeout(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');
|
this.target.dxOff('click.two_datepicker keydown.two_datepicker paste.two_datepicker restore.two_datepicker');
|
||||||
|
|
||||||
document.body.dxOff('click.two_datepicker' + this.ekey);
|
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');
|
this.target.dxRemoveData('two_datepicker');
|
||||||
|
|
||||||
Stack.delete(this);
|
Stack.delete(this);
|
||||||
|
|
||||||
|
Ut.trigger(this.opts.onDestroy, this);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
Reference in New Issue
Block a user