forked from fanruan/fineui
Zhenfei.Li
2 years ago
14 changed files with 611 additions and 544 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. |
||||
* @class BI.DatePicker |
||||
* @extends BI.Widget |
||||
* @class DatePicker |
||||
* @extends Widget |
||||
*/ |
||||
BI.DatePicker = BI.inherit(BI.Widget, { |
||||
_defaultConfig: function () { |
||||
var conf = BI.DatePicker.superclass._defaultConfig.apply(this, arguments); |
||||
@shortcut() |
||||
export class DatePicker extends Widget { |
||||
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", |
||||
height: 40, |
||||
min: "1900-01-01", // 最小日期
|
||||
max: "2099-12-31" // 最大日期
|
||||
max: "2099-12-31", // 最大日期
|
||||
}); |
||||
}, |
||||
|
||||
_init: function () { |
||||
BI.DatePicker.superclass._init.apply(this, arguments); |
||||
var self = this; |
||||
var o = this.options; |
||||
this._year = BI.getDate().getFullYear(); |
||||
this._month = BI.getDate().getMonth() + 1; |
||||
this.left = BI.createWidget({ |
||||
} |
||||
|
||||
_init() { |
||||
super._init(...arguments); |
||||
const o = this.options; |
||||
this._year = getDate().getFullYear(); |
||||
this._month = getDate().getMonth() + 1; |
||||
this.left = createWidget({ |
||||
type: "bi.icon_button", |
||||
cls: "pre-page-h-font", |
||||
width: 24, |
||||
height: 24 |
||||
height: 24, |
||||
}); |
||||
this.left.on(BI.IconButton.EVENT_CHANGE, function () { |
||||
if (self._month === 1) { |
||||
self.setValue({ |
||||
year: (self.year.getValue() - 1) || (BI.getDate().getFullYear() - 1), |
||||
month: 12 |
||||
this.left.on(IconButton.EVENT_CHANGE, () => { |
||||
if (this._month === 1) { |
||||
this.setValue({ |
||||
year: (this.year.getValue() - 1) || (getDate().getFullYear() - 1), |
||||
month: 12, |
||||
}); |
||||
} else { |
||||
self.setValue({ |
||||
year: self.year.getValue() || BI.getDate().getFullYear(), |
||||
month: (self.month.getValue() - 1) || BI.getDate().getMonth() |
||||
this.setValue({ |
||||
year: this.year.getValue() || getDate().getFullYear(), |
||||
month: (this.month.getValue() - 1) || getDate().getMonth(), |
||||
}); |
||||
} |
||||
self.fireEvent(BI.DatePicker.EVENT_CHANGE); |
||||
// self._checkLeftValid();
|
||||
// self._checkRightValid();
|
||||
this.fireEvent(DatePicker.EVENT_CHANGE); |
||||
// this._checkLeftValid();
|
||||
// this._checkRightValid();
|
||||
}); |
||||
|
||||
this.right = BI.createWidget({ |
||||
this.right = createWidget({ |
||||
type: "bi.icon_button", |
||||
cls: "next-page-h-font", |
||||
width: 24, |
||||
height: 24 |
||||
height: 24, |
||||
}); |
||||
|
||||
this.right.on(BI.IconButton.EVENT_CHANGE, function () { |
||||
if (self._month === 12) { |
||||
self.setValue({ |
||||
year: (self.year.getValue() + 1) || (BI.getDate().getFullYear() + 1), |
||||
month: 1 |
||||
this.right.on(IconButton.EVENT_CHANGE, () => { |
||||
if (this._month === 12) { |
||||
this.setValue({ |
||||
year: (this.year.getValue() + 1) || (getDate().getFullYear() + 1), |
||||
month: 1, |
||||
}); |
||||
} else { |
||||
self.setValue({ |
||||
year: self.year.getValue() || BI.getDate().getFullYear(), |
||||
month: (self.month.getValue() + 1) || (BI.getDate().getMonth() + 2) |
||||
this.setValue({ |
||||
year: this.year.getValue() || getDate().getFullYear(), |
||||
month: (this.month.getValue() + 1) || (getDate().getMonth() + 2), |
||||
}); |
||||
} |
||||
self.fireEvent(BI.DatePicker.EVENT_CHANGE); |
||||
// self._checkLeftValid();
|
||||
// self._checkRightValid();
|
||||
this.fireEvent(DatePicker.EVENT_CHANGE); |
||||
// this._checkLeftValid();
|
||||
// this._checkRightValid();
|
||||
}); |
||||
|
||||
this.year = BI.createWidget({ |
||||
this.year = createWidget({ |
||||
type: "bi.year_date_combo", |
||||
behaviors: o.behaviors, |
||||
min: o.min, |
||||
max: o.max |
||||
max: o.max, |
||||
}); |
||||
this.year.on(BI.YearDateCombo.EVENT_CHANGE, function () { |
||||
self.setValue({ |
||||
year: self.year.getValue(), |
||||
month: self._refreshMonth() |
||||
this.year.on(YearDateCombo.EVENT_CHANGE, () => { |
||||
this.setValue({ |
||||
year: this.year.getValue(), |
||||
month: this._refreshMonth(), |
||||
}); |
||||
self.fireEvent(BI.DatePicker.EVENT_CHANGE); |
||||
this.fireEvent(DatePicker.EVENT_CHANGE); |
||||
}); |
||||
this.year.on(BI.YearDateCombo.EVENT_BEFORE_POPUPVIEW, function () { |
||||
self.fireEvent(BI.DatePicker.EVENT_BEFORE_YEAR_MONTH_POPUPVIEW); |
||||
this.year.on(YearDateCombo.EVENT_BEFORE_POPUPVIEW, () => { |
||||
this.fireEvent(DatePicker.EVENT_BEFORE_YEAR_MONTH_POPUPVIEW); |
||||
}); |
||||
this.month = BI.createWidget({ |
||||
this.month = createWidget({ |
||||
type: "bi.month_date_combo", |
||||
behaviors: o.behaviors, |
||||
allowMonths: this._getAllowMonths() |
||||
allowMonths: this._getAllowMonths(), |
||||
}); |
||||
this.month.on(BI.MonthDateCombo.EVENT_CHANGE, function () { |
||||
self.setValue({ |
||||
year: self.year.getValue() || self._year, |
||||
month: self.month.getValue() |
||||
this.month.on(MonthDateCombo.EVENT_CHANGE, () => { |
||||
this.setValue({ |
||||
year: this.year.getValue() || this._year, |
||||
month: this.month.getValue(), |
||||
}); |
||||
self.fireEvent(BI.DatePicker.EVENT_CHANGE); |
||||
this.fireEvent(DatePicker.EVENT_CHANGE); |
||||
}); |
||||
this.month.on(BI.YearDateCombo.EVENT_BEFORE_POPUPVIEW, function () { |
||||
self.fireEvent(BI.DatePicker.EVENT_BEFORE_YEAR_MONTH_POPUPVIEW); |
||||
this.month.on(YearDateCombo.EVENT_BEFORE_POPUPVIEW, () => { |
||||
this.fireEvent(DatePicker.EVENT_BEFORE_YEAR_MONTH_POPUPVIEW); |
||||
}); |
||||
|
||||
BI.createWidget({ |
||||
createWidget({ |
||||
type: "bi.htape", |
||||
element: this, |
||||
items: [{ |
||||
el: { |
||||
type: "bi.center_adapt", |
||||
items: [this.left] |
||||
items: [this.left], |
||||
}, |
||||
width: 24 |
||||
width: 24, |
||||
}, { |
||||
el: { |
||||
type: "bi.center_adapt", |
||||
hgap: 10, |
||||
items: [this.year, this.month] |
||||
} |
||||
items: [this.year, this.month], |
||||
}, |
||||
}, { |
||||
el: { |
||||
type: "bi.center_adapt", |
||||
items: [this.right] |
||||
items: [this.right], |
||||
}, |
||||
width: 24 |
||||
}] |
||||
width: 24, |
||||
}], |
||||
}); |
||||
this.setValue({ |
||||
year: this._year, |
||||
month: this._month |
||||
month: this._month, |
||||
}); |
||||
}, |
||||
} |
||||
|
||||
_refreshMonth: function (defaultMonth) { |
||||
var month = this.month.getValue(); |
||||
_refreshMonth(defaultMonth) { |
||||
let month = this.month.getValue(); |
||||
this.month.populate(this._getAllowMonths()); |
||||
var allowMonth = this._getAllowMonths(); |
||||
if (!BI.contains(allowMonth, month)) { |
||||
const allowMonth = this._getAllowMonths(); |
||||
if (!contains(allowMonth, month)) { |
||||
month = defaultMonth || allowMonth[0]; |
||||
} |
||||
this.month.setValue(month); |
||||
|
||||
return month; |
||||
}, |
||||
} |
||||
|
||||
_getAllowMonths: function () { |
||||
var obj = this._getCheckMinMaxDate(); |
||||
var year = this.year.getValue() || this._year; |
||||
_getAllowMonths() { |
||||
const obj = this._getCheckMinMaxDate(); |
||||
const year = this.year.getValue() || this._year; |
||||
|
||||
return BI.filter(BI.range(1, 13), function (idx, v) { |
||||
return !BI.checkDateVoid(year, v, 1, obj.min, obj.max)[0]; |
||||
}); |
||||
}, |
||||
|
||||
// 上一年月不合法则灰化
|
||||
_checkLeftValid: function () { |
||||
var obj = this._getCheckMinMaxDate(); |
||||
var year = this._month === 1 ? this._year - 1 : this._year; |
||||
var month = this._month === 1 ? 12 : this._month - 1; |
||||
var valid = BI.isNull(BI.checkDateVoid(year, month, 1, obj.min, obj.max)[0]); |
||||
return filter(range(1, 13), (idx, v) => !checkDateVoid(year, v, 1, obj.min, obj.max)[0]); |
||||
} |
||||
|
||||
_checkLeftValid() { |
||||
const obj = this._getCheckMinMaxDate(); |
||||
const year = this._month === 1 ? this._year - 1 : this._year; |
||||
const month = this._month === 1 ? 12 : this._month - 1; |
||||
const valid = isNull(checkDateVoid(year, month, 1, obj.min, obj.max)[0]); |
||||
this.left.setEnable(valid); |
||||
|
||||
return valid; |
||||
}, |
||||
|
||||
// 下一年月不合法则灰化
|
||||
_checkRightValid: function () { |
||||
var obj = this._getCheckMinMaxDate(); |
||||
var year = this._month === 12 ? this._year + 1 : this._year; |
||||
var month = this._month === 12 ? 1 : this._month + 1; |
||||
var valid = BI.isNull(BI.checkDateVoid(year, month, 1, obj.min, obj.max)[0]); |
||||
} |
||||
|
||||
_checkRightValid() { |
||||
const obj = this._getCheckMinMaxDate(); |
||||
const year = this._month === 12 ? this._year + 1 : this._year; |
||||
const month = this._month === 12 ? 1 : this._month + 1; |
||||
const valid = isNull(checkDateVoid(year, month, 1, obj.min, obj.max)[0]); |
||||
this.right.setEnable(valid); |
||||
|
||||
return valid; |
||||
}, |
||||
} |
||||
|
||||
_getCheckMinMaxDate: function () { |
||||
var o = this.options; |
||||
var minDate = BI.parseDateTime(o.min, "%Y-%X-%d"); |
||||
var maxDate = BI.parseDateTime(o.max, "%Y-%X-%d"); |
||||
_getCheckMinMaxDate() { |
||||
const o = this.options; |
||||
const minDate = parseDateTime(o.min, "%Y-%X-%d"); |
||||
const maxDate = parseDateTime(o.max, "%Y-%X-%d"); |
||||
minDate.setDate(1); |
||||
maxDate.setDate(1); |
||||
|
||||
return { |
||||
min: BI.print(minDate, "%Y-%X-%d"), |
||||
max: BI.print(maxDate, "%Y-%X-%d") |
||||
min: print(minDate, "%Y-%X-%d"), |
||||
max: print(maxDate, "%Y-%X-%d"), |
||||
}; |
||||
}, |
||||
} |
||||
|
||||
setMinDate: function (minDate) { |
||||
setMinDate(minDate) { |
||||
this.options.min = minDate; |
||||
this.year.setMinDate(minDate); |
||||
this._refreshMonth(this._month); |
||||
// this._checkLeftValid();
|
||||
// this._checkRightValid();
|
||||
}, |
||||
} |
||||
|
||||
setMaxDate: function (maxDate) { |
||||
setMaxDate(maxDate) { |
||||
this.options.max = maxDate; |
||||
this.year.setMaxDate(maxDate); |
||||
this._refreshMonth(this._month); |
||||
// this._checkLeftValid();
|
||||
// this._checkRightValid();
|
||||
}, |
||||
} |
||||
|
||||
setValue: function (ob) { |
||||
this._year = BI.parseInt(ob.year); |
||||
this._month = BI.parseInt(ob.month); |
||||
setValue(ob) { |
||||
this._year = parseInt(ob.year); |
||||
this._month = parseInt(ob.month); |
||||
this.year.setValue(ob.year); |
||||
this._refreshMonth(this._month); |
||||
this.month.setValue(ob.month); |
||||
// this._checkLeftValid();
|
||||
// this._checkRightValid();
|
||||
}, |
||||
} |
||||
|
||||
getValue: function () { |
||||
getValue() { |
||||
return { |
||||
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 @@
|
||||
/** |
||||
* Created by GUY on 2015/9/7. |
||||
* @class BI.YearPicker |
||||
* @extends BI.Widget |
||||
*/ |
||||
BI.YearPicker = BI.inherit(BI.Widget, { |
||||
_defaultConfig: function () { |
||||
var conf = BI.YearPicker.superclass._defaultConfig.apply(this, arguments); |
||||
return BI.extend(conf, { |
||||
import { shortcut, Widget, extend, createWidget, getDate, parseDateTime } from "@/core"; |
||||
import { IconButton } from "@/base"; |
||||
import { YearDateCombo } from "./combo.year.date"; |
||||
|
||||
@shortcut() |
||||
export class YearPicker extends Widget { |
||||
static xtype = "bi.year_picker" |
||||
|
||||
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", |
||||
behaviors: {}, |
||||
height: 40, |
||||
min: "1900-01-01", // 最小日期
|
||||
max: "2099-12-31" // 最大日期
|
||||
max: "2099-12-31", // 最大日期
|
||||
}); |
||||
}, |
||||
|
||||
_init: function () { |
||||
BI.YearPicker.superclass._init.apply(this, arguments); |
||||
var self = this, o = this.options; |
||||
this._year = BI.getDate().getFullYear(); |
||||
this.left = BI.createWidget({ |
||||
type: "bi.icon_button", |
||||
} |
||||
|
||||
_init() { |
||||
super._init(...arguments); |
||||
const o = this.options; |
||||
this._year = getDate().getFullYear(); |
||||
this.left = createWidget({ |
||||
type: IconButton.xtype, |
||||
cls: "pre-page-h-font", |
||||
width: 25, |
||||
height: 25 |
||||
height: 25, |
||||
}); |
||||
this.left.on(BI.IconButton.EVENT_CHANGE, function () { |
||||
self.setValue(self.year.getValue() - 1); |
||||
self.fireEvent(BI.YearPicker.EVENT_CHANGE); |
||||
// self._checkLeftValid();
|
||||
// self._checkRightValid();
|
||||
this.left.on(IconButton.EVENT_CHANGE, () => { |
||||
this.setValue(this.year.getValue() - 1); |
||||
this.fireEvent(YearPicker.EVENT_CHANGE); |
||||
// this._checkLeftValid();
|
||||
// this._checkRightValid();
|
||||
}); |
||||
|
||||
this.right = BI.createWidget({ |
||||
type: "bi.icon_button", |
||||
this.right = createWidget({ |
||||
type: IconButton.xtype, |
||||
cls: "next-page-h-font", |
||||
width: 25, |
||||
height: 25 |
||||
height: 25, |
||||
}); |
||||
|
||||
this.right.on(BI.IconButton.EVENT_CHANGE, function () { |
||||
self.setValue(self.year.getValue() + 1); |
||||
self.fireEvent(BI.YearPicker.EVENT_CHANGE); |
||||
// self._checkLeftValid();
|
||||
// self._checkRightValid();
|
||||
this.right.on(IconButton.EVENT_CHANGE, () => { |
||||
this.setValue(this.year.getValue() + 1); |
||||
this.fireEvent(YearPicker.EVENT_CHANGE); |
||||
// this._checkLeftValid();
|
||||
// this._checkRightValid();
|
||||
}); |
||||
|
||||
this.year = BI.createWidget({ |
||||
this.year = createWidget({ |
||||
type: "bi.year_date_combo", |
||||
min: o.min, |
||||
behaviors: o.behaviors, |
||||
max: o.max, |
||||
width: 50 |
||||
width: 50, |
||||
}); |
||||
this.year.on(BI.YearDateCombo.EVENT_CHANGE, function () { |
||||
self.setValue(self.year.getValue()); |
||||
self.fireEvent(BI.YearPicker.EVENT_CHANGE); |
||||
this.year.on(YearDateCombo.EVENT_CHANGE, () => { |
||||
this.setValue(this.year.getValue()); |
||||
this.fireEvent(YearPicker.EVENT_CHANGE); |
||||
}); |
||||
this.year.on(BI.YearDateCombo.EVENT_BEFORE_POPUPVIEW, function () { |
||||
self.fireEvent(BI.YearPicker.EVENT_BEFORE_POPUPVIEW); |
||||
this.year.on(YearDateCombo.EVENT_BEFORE_POPUPVIEW, () => { |
||||
this.fireEvent(YearPicker.EVENT_BEFORE_POPUPVIEW); |
||||
}); |
||||
|
||||
BI.createWidget({ |
||||
createWidget({ |
||||
type: "bi.htape", |
||||
element: this, |
||||
items: [{ |
||||
el: { |
||||
type: "bi.center_adapt", |
||||
items: [this.left] |
||||
items: [this.left], |
||||
}, |
||||
width: 25 |
||||
width: 25, |
||||
}, { |
||||
type: "bi.center_adapt", |
||||
items: [{ |
||||
el: this.year |
||||
}] |
||||
el: this.year, |
||||
}], |
||||
}, { |
||||
el: { |
||||
type: "bi.center_adapt", |
||||
items: [this.right] |
||||
items: [this.right], |
||||
}, |
||||
width: 25 |
||||
}] |
||||
width: 25, |
||||
}], |
||||
}); |
||||
this.setValue(this._year); |
||||
}, |
||||
} |
||||
|
||||
_checkLeftValid: function () { |
||||
var o = this.options; |
||||
var valid = this._year > BI.parseDateTime(o.min, "%Y-%X-%d").getFullYear(); |
||||
_checkLeftValid() { |
||||
const o = this.options; |
||||
const valid = this._year > parseDateTime(o.min, "%Y-%X-%d").getFullYear(); |
||||
this.left.setEnable(valid); |
||||
|
||||
return valid; |
||||
}, |
||||
} |
||||
|
||||
_checkRightValid: function () { |
||||
var o = this.options; |
||||
var valid = this._year < BI.parseDateTime(o.max, "%Y-%X-%d").getFullYear(); |
||||
_checkRightValid() { |
||||
const o = this.options; |
||||
const valid = this._year < parseDateTime(o.max, "%Y-%X-%d").getFullYear(); |
||||
this.right.setEnable(valid); |
||||
|
||||
return valid; |
||||
}, |
||||
} |
||||
|
||||
setMinDate: function (minDate) { |
||||
setMinDate(minDate) { |
||||
this.options.min = minDate; |
||||
this.year.setMinDate(minDate); |
||||
// this._checkLeftValid();
|
||||
// this._checkRightValid();
|
||||
}, |
||||
} |
||||
|
||||
setMaxDate: function (maxDate) { |
||||
setMaxDate(maxDate) { |
||||
this.options.max = maxDate; |
||||
this.year.setMaxDate(maxDate); |
||||
// this._checkLeftValid();
|
||||
// this._checkRightValid();
|
||||
}, |
||||
|
||||
} |
||||
|
||||
setValue: function (v) { |
||||
setValue(v) { |
||||
this._year = v; |
||||
this.year.setValue(v); |
||||
// this._checkLeftValid();
|
||||
// this._checkRightValid();
|
||||
}, |
||||
} |
||||
|
||||
getValue: function () { |
||||
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,99 +1,102 @@
|
||||
import { shortcut, Widget, extend, Controller, createWidget, Events, createItems, toPix, map, contains, getDate, LogicFactory, parseInt } from "@/core"; |
||||
|
||||
/** |
||||
* 月份展示面板 |
||||
* |
||||
* Created by GUY on 2015/9/2. |
||||
* @class BI.MonthPopup |
||||
* @extends BI.Trigger |
||||
* @class MonthPopup |
||||
* @extends Widget |
||||
*/ |
||||
BI.MonthPopup = BI.inherit(BI.Widget, { |
||||
@shortcut() |
||||
export class MonthPopup extends Widget { |
||||
static xtype = "bi.month_popup" |
||||
|
||||
static EVENT_CHANGE = "EVENT_CHANGE" |
||||
|
||||
_defaultConfig: function () { |
||||
return BI.extend(BI.MonthPopup.superclass._defaultConfig.apply(this, arguments), { |
||||
_defaultConfig() { |
||||
return extend(super._defaultConfig(...arguments), { |
||||
baseCls: "bi-month-popup", |
||||
behaviors: {} |
||||
behaviors: {}, |
||||
}); |
||||
}, |
||||
} |
||||
|
||||
_init: function () { |
||||
BI.MonthPopup.superclass._init.apply(this, arguments); |
||||
var self = this, o = this.options; |
||||
_init() { |
||||
super._init(...arguments); |
||||
const o = this.options; |
||||
|
||||
this.selectedMonth = BI.getDate().getMonth() + 1; |
||||
this.selectedMonth = getDate().getMonth() + 1; |
||||
|
||||
this.month = BI.createWidget({ |
||||
this.month = createWidget({ |
||||
type: "bi.button_group", |
||||
element: this, |
||||
behaviors: o.behaviors, |
||||
items: BI.createItems(this._getItems(o.allowMonths), {}), |
||||
layouts: [BI.LogicFactory.createLogic("table", BI.extend({ |
||||
dynamic: true |
||||
items: createItems(this._getItems(o.allowMonths), {}), |
||||
layouts: [LogicFactory.createLogic("table", extend({ |
||||
dynamic: true, |
||||
}, { |
||||
columns: 2, |
||||
rows: 6, |
||||
columnSize: [1 / 2, 1 / 2], |
||||
rowSize: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT + 1 |
||||
rowSize: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT + 1, |
||||
})), { |
||||
type: "bi.center_adapt", |
||||
vgap: 2, |
||||
}], |
||||
value: o.value |
||||
value: o.value, |
||||
}); |
||||
|
||||
this.month.on(BI.Controller.EVENT_CHANGE, function (type, value) { |
||||
self.selectedMonth = value; |
||||
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); |
||||
if (type === BI.Events.CLICK) { |
||||
self.fireEvent(BI.MonthPopup.EVENT_CHANGE); |
||||
this.month.on(Controller.EVENT_CHANGE, (...args) => { |
||||
const [type, value] = args; |
||||
this.selectedMonth = value; |
||||
this.fireEvent(Controller.EVENT_CHANGE, ...args); |
||||
if (type === Events.CLICK) { |
||||
this.fireEvent(MonthPopup.EVENT_CHANGE); |
||||
} |
||||
}); |
||||
}, |
||||
} |
||||
|
||||
_getItems: function(m) { |
||||
BI.Widget.pushContext(this); |
||||
_getItems(m) { |
||||
Widget.pushContext(this); |
||||
// 纵向排列月
|
||||
var month = [1, 7, 2, 8, 3, 9, 4, 10, 5, 11, 6, 12]; |
||||
var items = []; |
||||
const month = [1, 7, 2, 8, 3, 9, 4, 10, 5, 11, 6, 12]; |
||||
let items = []; |
||||
items.push(month.slice(0, 2)); |
||||
items.push(month.slice(2, 4)); |
||||
items.push(month.slice(4, 6)); |
||||
items.push(month.slice(6, 8)); |
||||
items.push(month.slice(8, 10)); |
||||
items.push(month.slice(10, 12)); |
||||
items = BI.map(items, function (i, item) { |
||||
return BI.map(item, function (j, td) { |
||||
return { |
||||
type: "bi.text_item", |
||||
cls: "bi-border-radius bi-list-item-select", |
||||
textAlign: "center", |
||||
whiteSpace: "nowrap", |
||||
once: false, |
||||
forceSelected: true, |
||||
height: BI.toPix(BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT, 1), |
||||
width: 30, |
||||
value: td, |
||||
text: td, |
||||
disabled: !BI.contains(m, td) |
||||
}; |
||||
}); |
||||
}); |
||||
BI.Widget.popContext(); |
||||
items = map(items, (i, item) => map(item, (j, td) => { |
||||
return { |
||||
type: "bi.text_item", |
||||
cls: "bi-border-radius bi-list-item-select", |
||||
textAlign: "center", |
||||
whiteSpace: "nowrap", |
||||
once: false, |
||||
forceSelected: true, |
||||
height: toPix(BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT, 1), |
||||
width: 30, |
||||
value: td, |
||||
text: td, |
||||
disabled: !contains(m, td), |
||||
}; |
||||
})); |
||||
Widget.popContext(); |
||||
|
||||
return items; |
||||
}, |
||||
} |
||||
|
||||
populate: function(months) { |
||||
populate(months) { |
||||
this.month.populate(this._getItems(months)); |
||||
}, |
||||
} |
||||
|
||||
getValue: function () { |
||||
getValue() { |
||||
return this.selectedMonth; |
||||
}, |
||||
} |
||||
|
||||
setValue: function (v) { |
||||
v = BI.parseInt(v); |
||||
setValue(v) { |
||||
v = parseInt(v); |
||||
this.selectedMonth = v; |
||||
this.month.setValue([v]); |
||||
} |
||||
}); |
||||
BI.MonthPopup.EVENT_CHANGE = "EVENT_CHANGE"; |
||||
BI.shortcut("bi.month_popup", BI.MonthPopup); |
||||
} |
||||
|
||||
@ -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. |
||||
* @class BI.YearPopup |
||||
* @extends BI.Trigger |
||||
* @class YearPopup |
||||
* @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 () { |
||||
return BI.extend(BI.YearPopup.superclass._defaultConfig.apply(this, arguments), { |
||||
_defaultConfig() { |
||||
return extend(super._defaultConfig(...arguments), { |
||||
baseCls: "bi-year-popup", |
||||
behaviors: {}, |
||||
min: "1900-01-01", // 最小日期
|
||||
max: "2099-12-31" // 最大日期
|
||||
max: "2099-12-31", // 最大日期
|
||||
}); |
||||
}, |
||||
} |
||||
|
||||
_createYearCalendar: function (v) { |
||||
var o = this.options, y = this._year; |
||||
_createYearCalendar(v) { |
||||
const o = this.options, |
||||
y = this._year; |
||||
|
||||
var calendar = BI.createWidget({ |
||||
const calendar = createWidget({ |
||||
type: "bi.year_calendar", |
||||
behaviors: o.behaviors, |
||||
min: o.min, |
||||
max: o.max, |
||||
logic: { |
||||
dynamic: true |
||||
dynamic: true, |
||||
}, |
||||
year: y + v * 12 |
||||
year: y + v * 12, |
||||
}); |
||||
calendar.setValue(this._year); |
||||
|
||||
return calendar; |
||||
}, |
||||
} |
||||
|
||||
_init: function () { |
||||
BI.YearPopup.superclass._init.apply(this, arguments); |
||||
var self = this, o = this.options; |
||||
_init() { |
||||
super._init(...arguments); |
||||
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", |
||||
cls: "pre-page-h-font", |
||||
width: 24, |
||||
height: 24, |
||||
value: -1 |
||||
value: -1, |
||||
}); |
||||
|
||||
this.preBtn = BI.createWidget({ |
||||
this.preBtn = createWidget({ |
||||
type: "bi.icon_button", |
||||
cls: "next-page-h-font", |
||||
width: 24, |
||||
height: 24, |
||||
value: 1 |
||||
value: 1, |
||||
}); |
||||
|
||||
this.navigation = BI.createWidget({ |
||||
this.navigation = createWidget({ |
||||
type: "bi.navigation", |
||||
element: this, |
||||
single: true, |
||||
logic: { |
||||
dynamic: true |
||||
dynamic: true, |
||||
}, |
||||
tab: { |
||||
cls: "year-popup-navigation bi-high-light bi-split-top", |
||||
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 () { |
||||
self.selectedYear = this.getValue(); |
||||
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); |
||||
self.fireEvent(BI.YearPopup.EVENT_CHANGE, self.selectedYear); |
||||
this.navigation.on(Navigation.EVENT_CHANGE, (...args) => { |
||||
this.selectedYear = this.navigation.getValue(); |
||||
this.fireEvent(Controller.EVENT_CHANGE, ...args); |
||||
this.fireEvent(YearPopup.EVENT_CHANGE, this.selectedYear); |
||||
}); |
||||
|
||||
if(BI.isKey(o.value)){ |
||||
if (isKey(o.value)) { |
||||
this.setValue(o.value); |
||||
} |
||||
}, |
||||
} |
||||
|
||||
_checkMin: function () { |
||||
var calendar = this.navigation.getSelectedCard(); |
||||
if (BI.isNotNull(calendar)) { |
||||
_checkMin() { |
||||
const calendar = this.navigation.getSelectedCard(); |
||||
if (isNotNull(calendar)) { |
||||
calendar.setMinDate(this.options.min); |
||||
} |
||||
}, |
||||
} |
||||
|
||||
_checkMax: function () { |
||||
var calendar = this.navigation.getSelectedCard(); |
||||
if (BI.isNotNull(calendar)) { |
||||
_checkMax() { |
||||
const calendar = this.navigation.getSelectedCard(); |
||||
if (isNotNull(calendar)) { |
||||
calendar.setMaxDate(this.options.max); |
||||
} |
||||
}, |
||||
} |
||||
|
||||
setMinDate: function (minDate) { |
||||
if (BI.isNotEmptyString(this.options.min)) { |
||||
setMinDate(minDate) { |
||||
if (isNotEmptyString(this.options.min)) { |
||||
this.options.min = minDate; |
||||
this._checkMin(); |
||||
} |
||||
}, |
||||
} |
||||
|
||||
setMaxDate: function (maxDate) { |
||||
if (BI.isNotEmptyString(this.options.max)) { |
||||
setMaxDate(maxDate) { |
||||
if (isNotEmptyString(this.options.max)) { |
||||
this.options.max = maxDate; |
||||
this._checkMax(); |
||||
} |
||||
}, |
||||
} |
||||
|
||||
getValue: function () { |
||||
getValue() { |
||||
return this.selectedYear; |
||||
}, |
||||
} |
||||
|
||||
setValue: function (v) { |
||||
var o = this.options; |
||||
v = BI.parseInt(v); |
||||
setValue(v) { |
||||
v = parseInt(v); |
||||
// 切换年不受范围限制
|
||||
// 对于年控件来说，只要传入的minDate和maxDate的year区间包含v就是合法的
|
||||
// var startDate = BI.parseDateTime(o.min, "%Y-%X-%d");
|
||||
// var endDate = BI.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]) {
|
||||
// v = BI.getDate().getFullYear();
|
||||
// var startDate = parseDateTime(o.min, "%Y-%X-%d");
|
||||
// var endDate = parseDateTime(o.max, "%Y-%X-%d");
|
||||
// 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 = getDate().getFullYear();
|
||||
// }
|
||||
|
||||
this.selectedYear = v; |
||||
this.navigation.setSelect(BI.YearCalendar.getPageByYear(v)); |
||||
this.navigation.setSelect(YearCalendar.getPageByYear(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 |
||||
* |
||||
* Created by GUY on 2015/9/7. |
||||
* @class BI.DateTriangleTrigger |
||||
* @extends BI.Trigger |
||||
* @class DateTriangleTrigger |
||||
* @extends Trigger |
||||
*/ |
||||
BI.DateTriangleTrigger = BI.inherit(BI.Trigger, { |
||||
_const: { |
||||
@shortcut() |
||||
export class DateTriangleTrigger extends Trigger { |
||||
static xtype = "bi.date_triangle_trigger" |
||||
|
||||
_const = { |
||||
height: 24, |
||||
iconWidth: 12, |
||||
iconHeight: 12 |
||||
}, |
||||
iconHeight: 12, |
||||
}; |
||||
|
||||
_defaultConfig: function () { |
||||
return BI.extend( BI.DateTriangleTrigger.superclass._defaultConfig.apply(this, arguments), { |
||||
_defaultConfig() { |
||||
return extend(super._defaultConfig(...arguments), { |
||||
baseCls: "bi-date-triangle-trigger solid-triangle-bottom-font cursor-pointer", |
||||
height: 24 |
||||
height: 24, |
||||
}); |
||||
}, |
||||
_init: function () { |
||||
BI.DateTriangleTrigger.superclass._init.apply(this, arguments); |
||||
var o = this.options, c = this._const; |
||||
this.text = BI.createWidget({ |
||||
} |
||||
|
||||
_init() { |
||||
super._init(...arguments); |
||||
const o = this.options, |
||||
c = this._const; |
||||
this.text = createWidget({ |
||||
type: "bi.label", |
||||
cls: "list-item-text", |
||||
textAlign: "right", |
||||
text: o.text, |
||||
value: o.value, |
||||
height: c.height |
||||
height: c.height, |
||||
}); |
||||
|
||||
BI.createWidget({ |
||||
createWidget({ |
||||
type: "bi.vertical_adapt", |
||||
element: this, |
||||
items: [{ |
||||
el: this.text, |
||||
rgap: 5 |
||||
rgap: 5, |
||||
}, { |
||||
type: "bi.icon_label", |
||||
width: 16 |
||||
}] |
||||
width: 16, |
||||
}], |
||||
}); |
||||
}, |
||||
} |
||||
|
||||
setValue: function (v) { |
||||
setValue(v) { |
||||
this.text.setValue(v); |
||||
}, |
||||
} |
||||
|
||||
getValue: function () { |
||||
getValue() { |
||||
return this.text.getValue(); |
||||
}, |
||||
} |
||||
|
||||
setText: function (v) { |
||||
setText(v) { |
||||
this.text.setText(v); |
||||
}, |
||||
} |
||||
|
||||
getText: function () { |
||||
getText() { |
||||
return this.item.getText(); |
||||
}, |
||||
} |
||||
|
||||
getKey: function () { |
||||
getKey() { |
||||
|
||||
} |
||||
}); |
||||
BI.shortcut("bi.date_triangle_trigger", BI.DateTriangleTrigger); |
||||
} |
||||
|
||||
Loading…
Reference in new issue