forked from fanruan/fineui
Browse Source
Merge in VISUAL/fineui from ~ZHENFEI.LI/fineui:es6 to es6 * commit '8979ae1743f4c9eac3f77909909b347efd5524f5': KERNEL-14085 refactor: widget/calender、date 无JIRA任务 fix: 修复一些问题es6
Zhenfei.Li-李振飞
2 years ago
17 changed files with 616 additions and 545 deletions
@ -0,0 +1,8 @@ |
|||||||
|
export { MonthDateCombo } from "./combo.month.date"; |
||||||
|
export { YearDateCombo } from "./combo.year.date"; |
||||||
|
export { DatePicker } from "./picker.date"; |
||||||
|
export { YearPicker } from "./picker.year"; |
||||||
|
export { DateCalendarPopup } from "./popup.calendar.date"; |
||||||
|
export { MonthPopup } from "./popup.month"; |
||||||
|
export { YearPopup } from "./popup.year"; |
||||||
|
export { DateTriangleTrigger } from "./trigger.triangle.date"; |
@ -1,222 +1,226 @@ |
|||||||
|
import { shortcut, Widget, extend, createWidget, contains, isNull, getDate, filter, range, checkDateVoid, parseDateTime, parseInt, print } from "@/core"; |
||||||
|
import { IconButton } from "@/base"; |
||||||
|
import { YearDateCombo } from "./combo.year.date"; |
||||||
|
import { MonthDateCombo } from "./combo.month.date"; |
||||||
|
|
||||||
/** |
/** |
||||||
* Created by GUY on 2015/9/7. |
* Created by GUY on 2015/9/7. |
||||||
* @class BI.DatePicker |
* @class DatePicker |
||||||
* @extends BI.Widget |
* @extends Widget |
||||||
*/ |
*/ |
||||||
BI.DatePicker = BI.inherit(BI.Widget, { |
@shortcut() |
||||||
_defaultConfig: function () { |
export class DatePicker extends Widget { |
||||||
var conf = BI.DatePicker.superclass._defaultConfig.apply(this, arguments); |
static xtype = "bi.date_picker" |
||||||
|
|
||||||
|
static EVENT_CHANGE = "EVENT_CHANGE" |
||||||
|
static EVENT_BEFORE_YEAR_MONTH_POPUPVIEW = "EVENT_BEFORE_YEAR_MONTH_POPUPVIEW" |
||||||
|
|
||||||
|
_defaultConfig() { |
||||||
|
const conf = super._defaultConfig(...arguments); |
||||||
|
|
||||||
return BI.extend(conf, { |
return extend(conf, { |
||||||
baseCls: "bi-date-picker", |
baseCls: "bi-date-picker", |
||||||
height: 40, |
height: 40, |
||||||
min: "1900-01-01", // 最小日期
|
min: "1900-01-01", // 最小日期
|
||||||
max: "2099-12-31" // 最大日期
|
max: "2099-12-31", // 最大日期
|
||||||
}); |
}); |
||||||
}, |
} |
||||||
|
|
||||||
_init: function () { |
_init() { |
||||||
BI.DatePicker.superclass._init.apply(this, arguments); |
super._init(...arguments); |
||||||
var self = this; |
const o = this.options; |
||||||
var o = this.options; |
this._year = getDate().getFullYear(); |
||||||
this._year = BI.getDate().getFullYear(); |
this._month = getDate().getMonth() + 1; |
||||||
this._month = BI.getDate().getMonth() + 1; |
this.left = createWidget({ |
||||||
this.left = BI.createWidget({ |
|
||||||
type: "bi.icon_button", |
type: "bi.icon_button", |
||||||
cls: "pre-page-h-font", |
cls: "pre-page-h-font", |
||||||
width: 24, |
width: 24, |
||||||
height: 24 |
height: 24, |
||||||
}); |
}); |
||||||
this.left.on(BI.IconButton.EVENT_CHANGE, function () { |
this.left.on(IconButton.EVENT_CHANGE, () => { |
||||||
if (self._month === 1) { |
if (this._month === 1) { |
||||||
self.setValue({ |
this.setValue({ |
||||||
year: (self.year.getValue() - 1) || (BI.getDate().getFullYear() - 1), |
year: (this.year.getValue() - 1) || (getDate().getFullYear() - 1), |
||||||
month: 12 |
month: 12, |
||||||
}); |
}); |
||||||
} else { |
} else { |
||||||
self.setValue({ |
this.setValue({ |
||||||
year: self.year.getValue() || BI.getDate().getFullYear(), |
year: this.year.getValue() || getDate().getFullYear(), |
||||||
month: (self.month.getValue() - 1) || BI.getDate().getMonth() |
month: (this.month.getValue() - 1) || getDate().getMonth(), |
||||||
}); |
}); |
||||||
} |
} |
||||||
self.fireEvent(BI.DatePicker.EVENT_CHANGE); |
this.fireEvent(DatePicker.EVENT_CHANGE); |
||||||
// self._checkLeftValid();
|
// this._checkLeftValid();
|
||||||
// self._checkRightValid();
|
// this._checkRightValid();
|
||||||
}); |
}); |
||||||
|
|
||||||
this.right = BI.createWidget({ |
this.right = createWidget({ |
||||||
type: "bi.icon_button", |
type: "bi.icon_button", |
||||||
cls: "next-page-h-font", |
cls: "next-page-h-font", |
||||||
width: 24, |
width: 24, |
||||||
height: 24 |
height: 24, |
||||||
}); |
}); |
||||||
|
|
||||||
this.right.on(BI.IconButton.EVENT_CHANGE, function () { |
this.right.on(IconButton.EVENT_CHANGE, () => { |
||||||
if (self._month === 12) { |
if (this._month === 12) { |
||||||
self.setValue({ |
this.setValue({ |
||||||
year: (self.year.getValue() + 1) || (BI.getDate().getFullYear() + 1), |
year: (this.year.getValue() + 1) || (getDate().getFullYear() + 1), |
||||||
month: 1 |
month: 1, |
||||||
}); |
}); |
||||||
} else { |
} else { |
||||||
self.setValue({ |
this.setValue({ |
||||||
year: self.year.getValue() || BI.getDate().getFullYear(), |
year: this.year.getValue() || getDate().getFullYear(), |
||||||
month: (self.month.getValue() + 1) || (BI.getDate().getMonth() + 2) |
month: (this.month.getValue() + 1) || (getDate().getMonth() + 2), |
||||||
}); |
}); |
||||||
} |
} |
||||||
self.fireEvent(BI.DatePicker.EVENT_CHANGE); |
this.fireEvent(DatePicker.EVENT_CHANGE); |
||||||
// self._checkLeftValid();
|
// this._checkLeftValid();
|
||||||
// self._checkRightValid();
|
// this._checkRightValid();
|
||||||
}); |
}); |
||||||
|
|
||||||
this.year = BI.createWidget({ |
this.year = createWidget({ |
||||||
type: "bi.year_date_combo", |
type: "bi.year_date_combo", |
||||||
behaviors: o.behaviors, |
behaviors: o.behaviors, |
||||||
min: o.min, |
min: o.min, |
||||||
max: o.max |
max: o.max, |
||||||
}); |
}); |
||||||
this.year.on(BI.YearDateCombo.EVENT_CHANGE, function () { |
this.year.on(YearDateCombo.EVENT_CHANGE, () => { |
||||||
self.setValue({ |
this.setValue({ |
||||||
year: self.year.getValue(), |
year: this.year.getValue(), |
||||||
month: self._refreshMonth() |
month: this._refreshMonth(), |
||||||
}); |
}); |
||||||
self.fireEvent(BI.DatePicker.EVENT_CHANGE); |
this.fireEvent(DatePicker.EVENT_CHANGE); |
||||||
}); |
}); |
||||||
this.year.on(BI.YearDateCombo.EVENT_BEFORE_POPUPVIEW, function () { |
this.year.on(YearDateCombo.EVENT_BEFORE_POPUPVIEW, () => { |
||||||
self.fireEvent(BI.DatePicker.EVENT_BEFORE_YEAR_MONTH_POPUPVIEW); |
this.fireEvent(DatePicker.EVENT_BEFORE_YEAR_MONTH_POPUPVIEW); |
||||||
}); |
}); |
||||||
this.month = BI.createWidget({ |
this.month = createWidget({ |
||||||
type: "bi.month_date_combo", |
type: "bi.month_date_combo", |
||||||
behaviors: o.behaviors, |
behaviors: o.behaviors, |
||||||
allowMonths: this._getAllowMonths() |
allowMonths: this._getAllowMonths(), |
||||||
}); |
}); |
||||||
this.month.on(BI.MonthDateCombo.EVENT_CHANGE, function () { |
this.month.on(MonthDateCombo.EVENT_CHANGE, () => { |
||||||
self.setValue({ |
this.setValue({ |
||||||
year: self.year.getValue() || self._year, |
year: this.year.getValue() || this._year, |
||||||
month: self.month.getValue() |
month: this.month.getValue(), |
||||||
}); |
}); |
||||||
self.fireEvent(BI.DatePicker.EVENT_CHANGE); |
this.fireEvent(DatePicker.EVENT_CHANGE); |
||||||
}); |
}); |
||||||
this.month.on(BI.YearDateCombo.EVENT_BEFORE_POPUPVIEW, function () { |
this.month.on(YearDateCombo.EVENT_BEFORE_POPUPVIEW, () => { |
||||||
self.fireEvent(BI.DatePicker.EVENT_BEFORE_YEAR_MONTH_POPUPVIEW); |
this.fireEvent(DatePicker.EVENT_BEFORE_YEAR_MONTH_POPUPVIEW); |
||||||
}); |
}); |
||||||
|
|
||||||
BI.createWidget({ |
createWidget({ |
||||||
type: "bi.htape", |
type: "bi.htape", |
||||||
element: this, |
element: this, |
||||||
items: [{ |
items: [{ |
||||||
el: { |
el: { |
||||||
type: "bi.center_adapt", |
type: "bi.center_adapt", |
||||||
items: [this.left] |
items: [this.left], |
||||||
}, |
}, |
||||||
width: 24 |
width: 24, |
||||||
}, { |
}, { |
||||||
el: { |
el: { |
||||||
type: "bi.center_adapt", |
type: "bi.center_adapt", |
||||||
hgap: 10, |
hgap: 10, |
||||||
items: [this.year, this.month] |
items: [this.year, this.month], |
||||||
} |
}, |
||||||
}, { |
}, { |
||||||
el: { |
el: { |
||||||
type: "bi.center_adapt", |
type: "bi.center_adapt", |
||||||
items: [this.right] |
items: [this.right], |
||||||
}, |
}, |
||||||
width: 24 |
width: 24, |
||||||
}] |
}], |
||||||
}); |
}); |
||||||
this.setValue({ |
this.setValue({ |
||||||
year: this._year, |
year: this._year, |
||||||
month: this._month |
month: this._month, |
||||||
}); |
}); |
||||||
}, |
} |
||||||
|
|
||||||
_refreshMonth: function (defaultMonth) { |
_refreshMonth(defaultMonth) { |
||||||
var month = this.month.getValue(); |
let month = this.month.getValue(); |
||||||
this.month.populate(this._getAllowMonths()); |
this.month.populate(this._getAllowMonths()); |
||||||
var allowMonth = this._getAllowMonths(); |
const allowMonth = this._getAllowMonths(); |
||||||
if (!BI.contains(allowMonth, month)) { |
if (!contains(allowMonth, month)) { |
||||||
month = defaultMonth || allowMonth[0]; |
month = defaultMonth || allowMonth[0]; |
||||||
} |
} |
||||||
this.month.setValue(month); |
this.month.setValue(month); |
||||||
|
|
||||||
return month; |
return month; |
||||||
}, |
} |
||||||
|
|
||||||
_getAllowMonths: function () { |
_getAllowMonths() { |
||||||
var obj = this._getCheckMinMaxDate(); |
const obj = this._getCheckMinMaxDate(); |
||||||
var year = this.year.getValue() || this._year; |
const year = this.year.getValue() || this._year; |
||||||
|
|
||||||
return BI.filter(BI.range(1, 13), function (idx, v) { |
return filter(range(1, 13), (idx, v) => !checkDateVoid(year, v, 1, obj.min, obj.max)[0]); |
||||||
return !BI.checkDateVoid(year, v, 1, obj.min, obj.max)[0]; |
} |
||||||
}); |
|
||||||
}, |
|
||||||
|
|
||||||
// 上一年月不合法则灰化
|
_checkLeftValid() { |
||||||
_checkLeftValid: function () { |
const obj = this._getCheckMinMaxDate(); |
||||||
var obj = this._getCheckMinMaxDate(); |
const year = this._month === 1 ? this._year - 1 : this._year; |
||||||
var year = this._month === 1 ? this._year - 1 : this._year; |
const month = this._month === 1 ? 12 : this._month - 1; |
||||||
var month = this._month === 1 ? 12 : this._month - 1; |
const valid = isNull(checkDateVoid(year, month, 1, obj.min, obj.max)[0]); |
||||||
var valid = BI.isNull(BI.checkDateVoid(year, month, 1, obj.min, obj.max)[0]); |
|
||||||
this.left.setEnable(valid); |
this.left.setEnable(valid); |
||||||
|
|
||||||
return valid; |
return valid; |
||||||
}, |
} |
||||||
|
|
||||||
// 下一年月不合法则灰化
|
_checkRightValid() { |
||||||
_checkRightValid: function () { |
const obj = this._getCheckMinMaxDate(); |
||||||
var obj = this._getCheckMinMaxDate(); |
const year = this._month === 12 ? this._year + 1 : this._year; |
||||||
var year = this._month === 12 ? this._year + 1 : this._year; |
const month = this._month === 12 ? 1 : this._month + 1; |
||||||
var month = this._month === 12 ? 1 : this._month + 1; |
const valid = isNull(checkDateVoid(year, month, 1, obj.min, obj.max)[0]); |
||||||
var valid = BI.isNull(BI.checkDateVoid(year, month, 1, obj.min, obj.max)[0]); |
|
||||||
this.right.setEnable(valid); |
this.right.setEnable(valid); |
||||||
|
|
||||||
return valid; |
return valid; |
||||||
}, |
} |
||||||
|
|
||||||
_getCheckMinMaxDate: function () { |
_getCheckMinMaxDate() { |
||||||
var o = this.options; |
const o = this.options; |
||||||
var minDate = BI.parseDateTime(o.min, "%Y-%X-%d"); |
const minDate = parseDateTime(o.min, "%Y-%X-%d"); |
||||||
var maxDate = BI.parseDateTime(o.max, "%Y-%X-%d"); |
const maxDate = parseDateTime(o.max, "%Y-%X-%d"); |
||||||
minDate.setDate(1); |
minDate.setDate(1); |
||||||
maxDate.setDate(1); |
maxDate.setDate(1); |
||||||
|
|
||||||
return { |
return { |
||||||
min: BI.print(minDate, "%Y-%X-%d"), |
min: print(minDate, "%Y-%X-%d"), |
||||||
max: BI.print(maxDate, "%Y-%X-%d") |
max: print(maxDate, "%Y-%X-%d"), |
||||||
}; |
}; |
||||||
}, |
} |
||||||
|
|
||||||
setMinDate: function (minDate) { |
setMinDate(minDate) { |
||||||
this.options.min = minDate; |
this.options.min = minDate; |
||||||
this.year.setMinDate(minDate); |
this.year.setMinDate(minDate); |
||||||
this._refreshMonth(this._month); |
this._refreshMonth(this._month); |
||||||
// this._checkLeftValid();
|
// this._checkLeftValid();
|
||||||
// this._checkRightValid();
|
// this._checkRightValid();
|
||||||
}, |
} |
||||||
|
|
||||||
setMaxDate: function (maxDate) { |
setMaxDate(maxDate) { |
||||||
this.options.max = maxDate; |
this.options.max = maxDate; |
||||||
this.year.setMaxDate(maxDate); |
this.year.setMaxDate(maxDate); |
||||||
this._refreshMonth(this._month); |
this._refreshMonth(this._month); |
||||||
// this._checkLeftValid();
|
// this._checkLeftValid();
|
||||||
// this._checkRightValid();
|
// this._checkRightValid();
|
||||||
}, |
} |
||||||
|
|
||||||
setValue: function (ob) { |
setValue(ob) { |
||||||
this._year = BI.parseInt(ob.year); |
this._year = parseInt(ob.year); |
||||||
this._month = BI.parseInt(ob.month); |
this._month = parseInt(ob.month); |
||||||
this.year.setValue(ob.year); |
this.year.setValue(ob.year); |
||||||
this._refreshMonth(this._month); |
this._refreshMonth(this._month); |
||||||
this.month.setValue(ob.month); |
this.month.setValue(ob.month); |
||||||
// this._checkLeftValid();
|
// this._checkLeftValid();
|
||||||
// this._checkRightValid();
|
// this._checkRightValid();
|
||||||
}, |
} |
||||||
|
|
||||||
getValue: function () { |
getValue() { |
||||||
return { |
return { |
||||||
year: this.year.getValue(), |
year: this.year.getValue(), |
||||||
month: this.month.getValue() |
month: this.month.getValue(), |
||||||
}; |
}; |
||||||
} |
} |
||||||
}); |
} |
||||||
BI.DatePicker.EVENT_CHANGE = "EVENT_CHANGE"; |
|
||||||
BI.DatePicker.EVENT_BEFORE_YEAR_MONTH_POPUPVIEW = "EVENT_BEFORE_YEAR_MONTH_POPUPVIEW"; |
|
||||||
BI.shortcut("bi.date_picker", BI.DatePicker); |
|
||||||
|
@ -1,131 +1,135 @@ |
|||||||
/** |
import { shortcut, Widget, extend, createWidget, getDate, parseDateTime } from "@/core"; |
||||||
* Created by GUY on 2015/9/7. |
import { IconButton } from "@/base"; |
||||||
* @class BI.YearPicker |
import { YearDateCombo } from "./combo.year.date"; |
||||||
* @extends BI.Widget |
|
||||||
*/ |
@shortcut() |
||||||
BI.YearPicker = BI.inherit(BI.Widget, { |
export class YearPicker extends Widget { |
||||||
_defaultConfig: function () { |
static xtype = "bi.year_picker" |
||||||
var conf = BI.YearPicker.superclass._defaultConfig.apply(this, arguments); |
|
||||||
return BI.extend(conf, { |
static EVENT_CHANGE = "EVENT_CHANGE" |
||||||
|
static EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW" |
||||||
|
|
||||||
|
_defaultConfig() { |
||||||
|
const conf = super._defaultConfig(...arguments); |
||||||
|
|
||||||
|
return extend(conf, { |
||||||
baseCls: "bi-year-picker", |
baseCls: "bi-year-picker", |
||||||
behaviors: {}, |
behaviors: {}, |
||||||
height: 40, |
height: 40, |
||||||
min: "1900-01-01", // 最小日期
|
min: "1900-01-01", // 最小日期
|
||||||
max: "2099-12-31" // 最大日期
|
max: "2099-12-31", // 最大日期
|
||||||
}); |
}); |
||||||
}, |
} |
||||||
|
|
||||||
_init: function () { |
_init() { |
||||||
BI.YearPicker.superclass._init.apply(this, arguments); |
super._init(...arguments); |
||||||
var self = this, o = this.options; |
const o = this.options; |
||||||
this._year = BI.getDate().getFullYear(); |
this._year = getDate().getFullYear(); |
||||||
this.left = BI.createWidget({ |
this.left = createWidget({ |
||||||
type: "bi.icon_button", |
type: IconButton.xtype, |
||||||
cls: "pre-page-h-font", |
cls: "pre-page-h-font", |
||||||
width: 25, |
width: 25, |
||||||
height: 25 |
height: 25, |
||||||
}); |
}); |
||||||
this.left.on(BI.IconButton.EVENT_CHANGE, function () { |
this.left.on(IconButton.EVENT_CHANGE, () => { |
||||||
self.setValue(self.year.getValue() - 1); |
this.setValue(this.year.getValue() - 1); |
||||||
self.fireEvent(BI.YearPicker.EVENT_CHANGE); |
this.fireEvent(YearPicker.EVENT_CHANGE); |
||||||
// self._checkLeftValid();
|
// this._checkLeftValid();
|
||||||
// self._checkRightValid();
|
// this._checkRightValid();
|
||||||
}); |
}); |
||||||
|
|
||||||
this.right = BI.createWidget({ |
this.right = createWidget({ |
||||||
type: "bi.icon_button", |
type: IconButton.xtype, |
||||||
cls: "next-page-h-font", |
cls: "next-page-h-font", |
||||||
width: 25, |
width: 25, |
||||||
height: 25 |
height: 25, |
||||||
}); |
}); |
||||||
|
|
||||||
this.right.on(BI.IconButton.EVENT_CHANGE, function () { |
this.right.on(IconButton.EVENT_CHANGE, () => { |
||||||
self.setValue(self.year.getValue() + 1); |
this.setValue(this.year.getValue() + 1); |
||||||
self.fireEvent(BI.YearPicker.EVENT_CHANGE); |
this.fireEvent(YearPicker.EVENT_CHANGE); |
||||||
// self._checkLeftValid();
|
// this._checkLeftValid();
|
||||||
// self._checkRightValid();
|
// this._checkRightValid();
|
||||||
}); |
}); |
||||||
|
|
||||||
this.year = BI.createWidget({ |
this.year = createWidget({ |
||||||
type: "bi.year_date_combo", |
type: "bi.year_date_combo", |
||||||
min: o.min, |
min: o.min, |
||||||
behaviors: o.behaviors, |
behaviors: o.behaviors, |
||||||
max: o.max, |
max: o.max, |
||||||
width: 50 |
width: 50, |
||||||
}); |
}); |
||||||
this.year.on(BI.YearDateCombo.EVENT_CHANGE, function () { |
this.year.on(YearDateCombo.EVENT_CHANGE, () => { |
||||||
self.setValue(self.year.getValue()); |
this.setValue(this.year.getValue()); |
||||||
self.fireEvent(BI.YearPicker.EVENT_CHANGE); |
this.fireEvent(YearPicker.EVENT_CHANGE); |
||||||
}); |
}); |
||||||
this.year.on(BI.YearDateCombo.EVENT_BEFORE_POPUPVIEW, function () { |
this.year.on(YearDateCombo.EVENT_BEFORE_POPUPVIEW, () => { |
||||||
self.fireEvent(BI.YearPicker.EVENT_BEFORE_POPUPVIEW); |
this.fireEvent(YearPicker.EVENT_BEFORE_POPUPVIEW); |
||||||
}); |
}); |
||||||
|
|
||||||
BI.createWidget({ |
createWidget({ |
||||||
type: "bi.htape", |
type: "bi.htape", |
||||||
element: this, |
element: this, |
||||||
items: [{ |
items: [{ |
||||||
el: { |
el: { |
||||||
type: "bi.center_adapt", |
type: "bi.center_adapt", |
||||||
items: [this.left] |
items: [this.left], |
||||||
}, |
}, |
||||||
width: 25 |
width: 25, |
||||||
}, { |
}, { |
||||||
type: "bi.center_adapt", |
type: "bi.center_adapt", |
||||||
items: [{ |
items: [{ |
||||||
el: this.year |
el: this.year, |
||||||
}] |
}], |
||||||
}, { |
}, { |
||||||
el: { |
el: { |
||||||
type: "bi.center_adapt", |
type: "bi.center_adapt", |
||||||
items: [this.right] |
items: [this.right], |
||||||
}, |
}, |
||||||
width: 25 |
width: 25, |
||||||
}] |
}], |
||||||
}); |
}); |
||||||
this.setValue(this._year); |
this.setValue(this._year); |
||||||
}, |
} |
||||||
|
|
||||||
_checkLeftValid: function () { |
_checkLeftValid() { |
||||||
var o = this.options; |
const o = this.options; |
||||||
var valid = this._year > BI.parseDateTime(o.min, "%Y-%X-%d").getFullYear(); |
const valid = this._year > parseDateTime(o.min, "%Y-%X-%d").getFullYear(); |
||||||
this.left.setEnable(valid); |
this.left.setEnable(valid); |
||||||
|
|
||||||
return valid; |
return valid; |
||||||
}, |
} |
||||||
|
|
||||||
_checkRightValid: function () { |
_checkRightValid() { |
||||||
var o = this.options; |
const o = this.options; |
||||||
var valid = this._year < BI.parseDateTime(o.max, "%Y-%X-%d").getFullYear(); |
const valid = this._year < parseDateTime(o.max, "%Y-%X-%d").getFullYear(); |
||||||
this.right.setEnable(valid); |
this.right.setEnable(valid); |
||||||
|
|
||||||
return valid; |
return valid; |
||||||
}, |
} |
||||||
|
|
||||||
setMinDate: function (minDate) { |
setMinDate(minDate) { |
||||||
this.options.min = minDate; |
this.options.min = minDate; |
||||||
this.year.setMinDate(minDate); |
this.year.setMinDate(minDate); |
||||||
// this._checkLeftValid();
|
// this._checkLeftValid();
|
||||||
// this._checkRightValid();
|
// this._checkRightValid();
|
||||||
}, |
} |
||||||
|
|
||||||
setMaxDate: function (maxDate) { |
setMaxDate(maxDate) { |
||||||
this.options.max = maxDate; |
this.options.max = maxDate; |
||||||
this.year.setMaxDate(maxDate); |
this.year.setMaxDate(maxDate); |
||||||
// this._checkLeftValid();
|
// this._checkLeftValid();
|
||||||
// this._checkRightValid();
|
// this._checkRightValid();
|
||||||
}, |
} |
||||||
|
|
||||||
|
|
||||||
setValue: function (v) { |
setValue(v) { |
||||||
this._year = v; |
this._year = v; |
||||||
this.year.setValue(v); |
this.year.setValue(v); |
||||||
// this._checkLeftValid();
|
// this._checkLeftValid();
|
||||||
// this._checkRightValid();
|
// this._checkRightValid();
|
||||||
}, |
} |
||||||
|
|
||||||
getValue: function () { |
getValue() { |
||||||
return this.year.getValue(); |
return this.year.getValue(); |
||||||
} |
} |
||||||
}); |
} |
||||||
BI.YearPicker.EVENT_CHANGE = "EVENT_CHANGE"; |
|
||||||
BI.YearPicker.EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW"; |
|
||||||
BI.shortcut("bi.year_picker", BI.YearPicker); |
|
||||||
|
@ -1,136 +1,143 @@ |
|||||||
|
import { shortcut, Widget, extend, createWidget, isKey, Controller, bind, isNotNull, isNotEmptyString, getDate, parseInt } from "@/core"; |
||||||
|
import { Navigation } from "@/base"; |
||||||
|
import { YearCalendar } from "@/case"; |
||||||
|
|
||||||
/** |
/** |
||||||
* 年份展示面板 |
* 年份展示面板 |
||||||
* |
* |
||||||
* Created by GUY on 2015/9/2. |
* Created by GUY on 2015/9/2. |
||||||
* @class BI.YearPopup |
* @class YearPopup |
||||||
* @extends BI.Trigger |
* @extends Widget |
||||||
*/ |
*/ |
||||||
BI.YearPopup = BI.inherit(BI.Widget, { |
@shortcut() |
||||||
|
export class YearPopup extends Widget { |
||||||
|
static xtype = "bi.year_popup" |
||||||
|
|
||||||
|
static EVENT_CHANGE = "EVENT_CHANGE" |
||||||
|
|
||||||
_defaultConfig: function () { |
_defaultConfig() { |
||||||
return BI.extend(BI.YearPopup.superclass._defaultConfig.apply(this, arguments), { |
return extend(super._defaultConfig(...arguments), { |
||||||
baseCls: "bi-year-popup", |
baseCls: "bi-year-popup", |
||||||
behaviors: {}, |
behaviors: {}, |
||||||
min: "1900-01-01", // 最小日期
|
min: "1900-01-01", // 最小日期
|
||||||
max: "2099-12-31" // 最大日期
|
max: "2099-12-31", // 最大日期
|
||||||
}); |
}); |
||||||
}, |
} |
||||||
|
|
||||||
_createYearCalendar: function (v) { |
_createYearCalendar(v) { |
||||||
var o = this.options, y = this._year; |
const o = this.options, |
||||||
|
y = this._year; |
||||||
|
|
||||||
var calendar = BI.createWidget({ |
const calendar = createWidget({ |
||||||
type: "bi.year_calendar", |
type: "bi.year_calendar", |
||||||
behaviors: o.behaviors, |
behaviors: o.behaviors, |
||||||
min: o.min, |
min: o.min, |
||||||
max: o.max, |
max: o.max, |
||||||
logic: { |
logic: { |
||||||
dynamic: true |
dynamic: true, |
||||||
}, |
}, |
||||||
year: y + v * 12 |
year: y + v * 12, |
||||||
}); |
}); |
||||||
calendar.setValue(this._year); |
calendar.setValue(this._year); |
||||||
|
|
||||||
return calendar; |
return calendar; |
||||||
}, |
} |
||||||
|
|
||||||
_init: function () { |
_init() { |
||||||
BI.YearPopup.superclass._init.apply(this, arguments); |
super._init(...arguments); |
||||||
var self = this, o = this.options; |
const o = this.options; |
||||||
|
|
||||||
this.selectedYear = this._year = BI.getDate().getFullYear(); |
this.selectedYear = this._year = getDate().getFullYear(); |
||||||
|
|
||||||
this.backBtn = BI.createWidget({ |
this.backBtn = createWidget({ |
||||||
type: "bi.icon_button", |
type: "bi.icon_button", |
||||||
cls: "pre-page-h-font", |
cls: "pre-page-h-font", |
||||||
width: 24, |
width: 24, |
||||||
height: 24, |
height: 24, |
||||||
value: -1 |
value: -1, |
||||||
}); |
}); |
||||||
|
|
||||||
this.preBtn = BI.createWidget({ |
this.preBtn = createWidget({ |
||||||
type: "bi.icon_button", |
type: "bi.icon_button", |
||||||
cls: "next-page-h-font", |
cls: "next-page-h-font", |
||||||
width: 24, |
width: 24, |
||||||
height: 24, |
height: 24, |
||||||
value: 1 |
value: 1, |
||||||
}); |
}); |
||||||
|
|
||||||
this.navigation = BI.createWidget({ |
this.navigation = createWidget({ |
||||||
type: "bi.navigation", |
type: "bi.navigation", |
||||||
element: this, |
element: this, |
||||||
single: true, |
single: true, |
||||||
logic: { |
logic: { |
||||||
dynamic: true |
dynamic: true, |
||||||
}, |
}, |
||||||
tab: { |
tab: { |
||||||
cls: "year-popup-navigation bi-high-light bi-split-top", |
cls: "year-popup-navigation bi-high-light bi-split-top", |
||||||
height: 24, |
height: 24, |
||||||
items: [this.backBtn, this.preBtn] |
items: [this.backBtn, this.preBtn], |
||||||
|
}, |
||||||
|
cardCreator: bind(this._createYearCalendar, this), |
||||||
|
afterCardCreated: () => { |
||||||
|
this.setValue(this.selectedYear); |
||||||
}, |
}, |
||||||
cardCreator: BI.bind(this._createYearCalendar, this), |
|
||||||
afterCardCreated: function () { |
|
||||||
this.setValue(self.selectedYear); |
|
||||||
} |
|
||||||
}); |
}); |
||||||
|
|
||||||
this.navigation.on(BI.Navigation.EVENT_CHANGE, function () { |
this.navigation.on(Navigation.EVENT_CHANGE, (...args) => { |
||||||
self.selectedYear = this.getValue(); |
this.selectedYear = this.navigation.getValue(); |
||||||
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); |
this.fireEvent(Controller.EVENT_CHANGE, ...args); |
||||||
self.fireEvent(BI.YearPopup.EVENT_CHANGE, self.selectedYear); |
this.fireEvent(YearPopup.EVENT_CHANGE, this.selectedYear); |
||||||
}); |
}); |
||||||
|
|
||||||
if(BI.isKey(o.value)){ |
if (isKey(o.value)) { |
||||||
this.setValue(o.value); |
this.setValue(o.value); |
||||||
} |
} |
||||||
}, |
} |
||||||
|
|
||||||
_checkMin: function () { |
_checkMin() { |
||||||
var calendar = this.navigation.getSelectedCard(); |
const calendar = this.navigation.getSelectedCard(); |
||||||
if (BI.isNotNull(calendar)) { |
if (isNotNull(calendar)) { |
||||||
calendar.setMinDate(this.options.min); |
calendar.setMinDate(this.options.min); |
||||||
} |
} |
||||||
}, |
} |
||||||
|
|
||||||
_checkMax: function () { |
_checkMax() { |
||||||
var calendar = this.navigation.getSelectedCard(); |
const calendar = this.navigation.getSelectedCard(); |
||||||
if (BI.isNotNull(calendar)) { |
if (isNotNull(calendar)) { |
||||||
calendar.setMaxDate(this.options.max); |
calendar.setMaxDate(this.options.max); |
||||||
} |
} |
||||||
}, |
} |
||||||
|
|
||||||
setMinDate: function (minDate) { |
setMinDate(minDate) { |
||||||
if (BI.isNotEmptyString(this.options.min)) { |
if (isNotEmptyString(this.options.min)) { |
||||||
this.options.min = minDate; |
this.options.min = minDate; |
||||||
this._checkMin(); |
this._checkMin(); |
||||||
} |
} |
||||||
}, |
} |
||||||
|
|
||||||
setMaxDate: function (maxDate) { |
setMaxDate(maxDate) { |
||||||
if (BI.isNotEmptyString(this.options.max)) { |
if (isNotEmptyString(this.options.max)) { |
||||||
this.options.max = maxDate; |
this.options.max = maxDate; |
||||||
this._checkMax(); |
this._checkMax(); |
||||||
} |
} |
||||||
}, |
} |
||||||
|
|
||||||
getValue: function () { |
getValue() { |
||||||
return this.selectedYear; |
return this.selectedYear; |
||||||
}, |
} |
||||||
|
|
||||||
setValue: function (v) { |
setValue(v) { |
||||||
var o = this.options; |
v = parseInt(v); |
||||||
v = BI.parseInt(v); |
|
||||||
// 切换年不受范围限制
|
// 切换年不受范围限制
|
||||||
// 对于年控件来说,只要传入的minDate和maxDate的year区间包含v就是合法的
|
// 对于年控件来说,只要传入的minDate和maxDate的year区间包含v就是合法的
|
||||||
// var startDate = BI.parseDateTime(o.min, "%Y-%X-%d");
|
// var startDate = parseDateTime(o.min, "%Y-%X-%d");
|
||||||
// var endDate = BI.parseDateTime(o.max, "%Y-%X-%d");
|
// var endDate = parseDateTime(o.max, "%Y-%X-%d");
|
||||||
// if (BI.checkDateVoid(v, 1, 1, BI.print(BI.getDate(startDate.getFullYear(), 0, 1), "%Y-%X-%d"), BI.print(BI.getDate(endDate.getFullYear(), 0, 1), "%Y-%X-%d"))[0]) {
|
// if (checkDateVoid(v, 1, 1, print(getDate(startDate.getFullYear(), 0, 1), "%Y-%X-%d"), print(getDate(endDate.getFullYear(), 0, 1), "%Y-%X-%d"))[0]) {
|
||||||
// v = BI.getDate().getFullYear();
|
// v = getDate().getFullYear();
|
||||||
// }
|
// }
|
||||||
|
|
||||||
this.selectedYear = v; |
this.selectedYear = v; |
||||||
this.navigation.setSelect(BI.YearCalendar.getPageByYear(v)); |
this.navigation.setSelect(YearCalendar.getPageByYear(v)); |
||||||
this.navigation.setValue(v); |
this.navigation.setValue(v); |
||||||
} |
} |
||||||
}); |
} |
||||||
BI.YearPopup.EVENT_CHANGE = "EVENT_CHANGE"; |
|
||||||
BI.shortcut("bi.year_popup", BI.YearPopup); |
|
||||||
|
@ -1,66 +1,73 @@ |
|||||||
|
import { shortcut, extend, createWidget } from "@/core"; |
||||||
|
import { Trigger } from "@/base"; |
||||||
|
|
||||||
/** |
/** |
||||||
* 日期控件中的年份或月份trigger |
* 日期控件中的年份或月份trigger |
||||||
* |
* |
||||||
* Created by GUY on 2015/9/7. |
* Created by GUY on 2015/9/7. |
||||||
* @class BI.DateTriangleTrigger |
* @class DateTriangleTrigger |
||||||
* @extends BI.Trigger |
* @extends Trigger |
||||||
*/ |
*/ |
||||||
BI.DateTriangleTrigger = BI.inherit(BI.Trigger, { |
@shortcut() |
||||||
_const: { |
export class DateTriangleTrigger extends Trigger { |
||||||
|
static xtype = "bi.date_triangle_trigger" |
||||||
|
|
||||||
|
_const = { |
||||||
height: 24, |
height: 24, |
||||||
iconWidth: 12, |
iconWidth: 12, |
||||||
iconHeight: 12 |
iconHeight: 12, |
||||||
}, |
}; |
||||||
|
|
||||||
_defaultConfig: function () { |
_defaultConfig() { |
||||||
return BI.extend( BI.DateTriangleTrigger.superclass._defaultConfig.apply(this, arguments), { |
return extend(super._defaultConfig(...arguments), { |
||||||
baseCls: "bi-date-triangle-trigger solid-triangle-bottom-font cursor-pointer", |
baseCls: "bi-date-triangle-trigger solid-triangle-bottom-font cursor-pointer", |
||||||
height: 24 |
height: 24, |
||||||
}); |
}); |
||||||
}, |
} |
||||||
_init: function () { |
|
||||||
BI.DateTriangleTrigger.superclass._init.apply(this, arguments); |
_init() { |
||||||
var o = this.options, c = this._const; |
super._init(...arguments); |
||||||
this.text = BI.createWidget({ |
const o = this.options, |
||||||
|
c = this._const; |
||||||
|
this.text = createWidget({ |
||||||
type: "bi.label", |
type: "bi.label", |
||||||
cls: "list-item-text", |
cls: "list-item-text", |
||||||
textAlign: "right", |
textAlign: "right", |
||||||
text: o.text, |
text: o.text, |
||||||
value: o.value, |
value: o.value, |
||||||
height: c.height |
height: c.height, |
||||||
}); |
}); |
||||||
|
|
||||||
BI.createWidget({ |
createWidget({ |
||||||
type: "bi.vertical_adapt", |
type: "bi.vertical_adapt", |
||||||
element: this, |
element: this, |
||||||
items: [{ |
items: [{ |
||||||
el: this.text, |
el: this.text, |
||||||
rgap: 5 |
rgap: 5, |
||||||
}, { |
}, { |
||||||
type: "bi.icon_label", |
type: "bi.icon_label", |
||||||
width: 16 |
width: 16, |
||||||
}] |
}], |
||||||
}); |
}); |
||||||
}, |
} |
||||||
|
|
||||||
setValue: function (v) { |
setValue(v) { |
||||||
this.text.setValue(v); |
this.text.setValue(v); |
||||||
}, |
} |
||||||
|
|
||||||
getValue: function () { |
getValue() { |
||||||
return this.text.getValue(); |
return this.text.getValue(); |
||||||
}, |
} |
||||||
|
|
||||||
setText: function (v) { |
setText(v) { |
||||||
this.text.setText(v); |
this.text.setText(v); |
||||||
}, |
} |
||||||
|
|
||||||
getText: function () { |
getText() { |
||||||
return this.item.getText(); |
return this.item.getText(); |
||||||
}, |
} |
||||||
|
|
||||||
getKey: function () { |
getKey() { |
||||||
|
|
||||||
} |
} |
||||||
}); |
} |
||||||
BI.shortcut("bi.date_triangle_trigger", BI.DateTriangleTrigger); |
|
||||||
|
Loading…
Reference in new issue