Browse Source

KERNEL-14067 feat:year && yearInterval 的es6化

es6
crawford.zhou 2 years ago
parent
commit
6b1aeb6d9f
  1. 10
      src/widget/index.js
  2. 135
      src/widget/year/card.dynamic.year.js
  3. 229
      src/widget/year/card.year.js
  4. 262
      src/widget/year/combo.year.js
  5. 5
      src/widget/year/index.js
  6. 440
      src/widget/year/popup.year.js
  7. 291
      src/widget/year/trigger.year.js
  8. 296
      src/widget/yearinterval/yearinterval.js

10
src/widget/index.js

@ -19,7 +19,8 @@ import { NumberEditor } from "./numbereditor/number.editor";
import { NumberInterval } from "./numberinterval/numberinterval"; import { NumberInterval } from "./numberinterval/numberinterval";
import * as multiselect from "./multiselect"; import * as multiselect from "./multiselect";
import * as multiselectlist from "./multiselectlist"; import * as multiselectlist from "./multiselectlist";
import * as year from "./year";
import { YearInterval } from "./yearinterval/yearinterval";
Object.assign(BI, { Object.assign(BI, {
Collapse, Collapse,
...calendar, ...calendar,
@ -29,6 +30,7 @@ Object.assign(BI, {
...datetimepane, ...datetimepane,
...dynamicdatetime, ...dynamicdatetime,
...time, ...time,
...year,
...editor, ...editor,
...downList, ...downList,
...singleSliderItem, ...singleSliderItem,
@ -40,6 +42,7 @@ Object.assign(BI, {
MultiTreeListCombo, MultiTreeListCombo,
NumberEditor, NumberEditor,
NumberInterval, NumberInterval,
YearInterval,
...multiselect, ...multiselect,
...multiselectlist, ...multiselectlist,
}); });
@ -57,7 +60,7 @@ export * from "./multiselectlist";
export * from "./downlist"; export * from "./downlist";
export * from "./singleslider"; export * from "./singleslider";
export * from "./intervalslider"; export * from "./intervalslider";
export * from "./year";
export { export {
Collapse, Collapse,
NumberEditor, NumberEditor,
@ -66,5 +69,6 @@ export {
SingleTreeCombo, SingleTreeCombo,
MultiTreeCombo, MultiTreeCombo,
MultiTreeInsertCombo, MultiTreeInsertCombo,
MultiTreeListCombo MultiTreeListCombo,
YearInterval
}; };

135
src/widget/year/card.dynamic.year.js

@ -5,115 +5,118 @@
* @class BI.YearCard * @class BI.YearCard
* @extends BI.Trigger * @extends BI.Trigger
*/ */
BI.DynamicYearCard = BI.inherit(BI.Widget, { import { checkDateVoid, i18nText, isNotEmptyString, parseDateTime, shortcut, VerticalLayout, Widget } from "@/core";
import { Bubbles, Label } from "@/base";
import { DynamicDateCard, DynamicDateHelper, DynamicDateParamItem } from "@/widget";
props: { @shortcut()
baseCls: "bi-year-card" export class DynamicYearCard extends Widget {
}, static xtype = "bi.dynamic_year_card";
static EVENT_CHANGE = "EVENT_CHANGE";
render: function () { props = {
var self = this, o = this.options; baseCls: "bi-year-card",
}
render() {
return { return {
type: "bi.vertical", type: VerticalLayout.xtype,
ref: function (_ref) { ref: _ref => {
self.wrapper = _ref; this.wrapper = _ref;
}, },
items: [{ items: [{
type: "bi.label", type: Label.xtype,
text: BI.i18nText("BI-Multi_Date_Relative_Current_Time"), text: i18nText("BI-Multi_Date_Relative_Current_Time"),
textAlign: "left", textAlign: "left",
height: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT, height: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT,
}, { }, {
type: "bi.dynamic_date_param_item", type: DynamicDateParamItem.xtype,
ref: function () { ref: _ref => {
self.item = this; this.item = _ref;
}, },
listeners: [{ listeners: [{
eventName: "EVENT_CHANGE", eventName: "EVENT_CHANGE",
action: function () { action: () => {
self.fireEvent("EVENT_CHANGE"); this.fireEvent("EVENT_CHANGE");
} },
}, { }, {
eventName: "EVENT_INPUT_CHANGE", eventName: "EVENT_INPUT_CHANGE",
action: function () { action: () => {
BI.Bubbles.hide("dynamic-year-error"); Bubbles.hide("dynamic-year-error");
} },
}] }],
}], }],
vgap: 10, vgap: 10,
hgap: 10 hgap: 10,
}; };
}, }
_checkDate() {
_checkDate: function (obj) { const o = this.options;
var o = this.options; const date = DynamicDateHelper.getCalculation(this._getValue());
var date = BI.DynamicDateHelper.getCalculation(this._getValue());
return !BI.checkDateVoid(date.getFullYear(), date.getMonth() + 1, date.getDate(), o.min, o.max)[0]; return !checkDateVoid(date.getFullYear(), date.getMonth() + 1, date.getDate(), o.min, o.max)[0];
}, }
_createValue: function (type, v) { _createValue(type, v) {
return { return {
dateType: type, dateType: type,
value: Math.abs(v), value: Math.abs(v),
offset: v > 0 ? 1 : 0 offset: v > 0 ? 1 : 0,
}; };
}, }
_getErrorText: function () { _getErrorText() {
var o = this.options; const o = this.options;
var start = BI.parseDateTime(o.min, "%Y-%X-%d"); const start = parseDateTime(o.min, "%Y-%X-%d");
var end = BI.parseDateTime(o.max, "%Y-%X-%d"); const end = parseDateTime(o.max, "%Y-%X-%d");
return BI.i18nText("BI-Basic_Year_Range_Error",
return i18nText("BI-Basic_Year_Range_Error",
start.getFullYear(), start.getFullYear(),
end.getFullYear()); end.getFullYear());
}, }
setMinDate: function(minDate) { setMinDate(minDate) {
if (BI.isNotEmptyString(this.options.min)) { if (isNotEmptyString(this.options.min)) {
this.options.min = minDate; this.options.min = minDate;
} }
}, }
setMaxDate: function (maxDate) { setMaxDate(maxDate) {
if (BI.isNotEmptyString(this.options.max)) { if (isNotEmptyString(this.options.max)) {
this.options.max = maxDate; this.options.max = maxDate;
} }
}, }
setValue: function (v) { setValue(v) {
v = v || {year: 0}; v = v || { year: 0 };
this.item.setValue(this._createValue(BI.DynamicDateCard.TYPE.YEAR, v.year)); this.item.setValue(this._createValue(DynamicDateCard.TYPE.YEAR, v.year));
}, }
_getValue: function () { _getValue() {
var value = this.item.getValue(); const value = this.item.getValue();
return { return {
year: (value.offset === 0 ? -value.value : +value.value) year: (value.offset === 0 ? -value.value : +value.value),
}; };
}, }
getInputValue: function () { getInputValue() {
return this._getValue(); return this._getValue();
}, }
getValue: function () { getValue() {
return this.checkValidation() ? this._getValue() : {}; return this.checkValidation() ? this._getValue() : {};
}, }
checkValidation: function (show) { checkValidation(show) {
var errorText; let errorText;
var invalid = !this.item.checkValidation(); let invalid = !this.item.checkValidation();
if (invalid) { if (invalid) {
errorText = BI.i18nText("BI-Please_Input_Natural_Number"); errorText = i18nText("BI-Please_Input_Natural_Number");
} else { } else {
invalid = !this._checkDate(this._getValue()); invalid = !this._checkDate(this._getValue());
errorText = this._getErrorText(); errorText = this._getErrorText();
} }
invalid && show && BI.Bubbles.show("dynamic-year-error", errorText, this.item); invalid && show && Bubbles.show("dynamic-year-error", errorText, this.item, {});
return !invalid; return !invalid;
}, }
}); }
BI.DynamicYearCard.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.dynamic_year_card", BI.DynamicYearCard);

229
src/widget/year/card.year.js

@ -1,194 +1,205 @@
/** import { shortcut, Widget, extend, createWidget, getDate, bind, Controller, isKey, HTapeLayout, CenterAdaptLayout, Layout, each, isNotEmptyString, checkDateVoid, parseInt } from "@/core";
* 年份展示面板 import { YearCalendar } from "@/case";
* import { IconButton, Navigation } from "@/base";
* Created by GUY on 2015/9/2.
* @class BI.StaticYearCard @shortcut()
* @extends BI.Trigger export class StaticYearCard extends Widget {
*/ static xtype = "bi.static_year_card";
BI.StaticYearCard = BI.inherit(BI.Widget, {
static EVENT_CHANGE = "EVENT_CHANGE";
_defaultConfig: function () {
return BI.extend(BI.StaticYearCard.superclass._defaultConfig.apply(this, arguments), { _defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-year-card", baseCls: "bi-year-card",
behaviors: {}, behaviors: {},
min: "1900-01-01", // 最小日期 min: "1900-01-01", // 最小日期
max: "2099-12-31" // 最大日期 max: "2099-12-31", // 最大日期
}); });
}, }
_createYearCalendar: function (v) {
var o = this.options, y = this._year;
var calendar = BI.createWidget({ _createYearCalendar(v) {
type: "bi.year_calendar", const o = this.options,
y = this._year;
const calendar = createWidget({
type: YearCalendar.xtype,
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 () {
BI.StaticYearCard.superclass._init.apply(this, arguments);
var self = this, o = this.options;
this.selectedYear = this._year = BI.getDate().getFullYear(); _init() {
super._init(...arguments);
const o = this.options;
this.backBtn = BI.createWidget({ this.selectedYear = this._year = getDate().getFullYear();
type: "bi.icon_button", this.backBtn = createWidget({
type: IconButton.xtype,
cls: "pre-page-h-font", cls: "pre-page-h-font",
width: 25, width: 25,
height: 25, height: 25,
value: -1, value: -1,
listeners: [{ listeners: [
eventName: BI.IconButton.EVENT_CHANGE, {
action: function () { eventName: IconButton.EVENT_CHANGE,
self.navigation.setSelect(self.navigation.getSelect() - 1); action :() => {
self._checkLeftValid(); this.navigation.setSelect(
self._checkRightValid(); this.navigation.getSelect() - 1
);
this._checkLeftValid();
this._checkRightValid();
},
} }
}] ],
}); });
this.preBtn = BI.createWidget({ this.preBtn = 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,
value: 1, value: 1,
listeners: [{ listeners: [
eventName: BI.IconButton.EVENT_CHANGE, {
action: function () { eventName: IconButton.EVENT_CHANGE,
self.navigation.setSelect(self.navigation.getSelect() + 1); action :() => {
self._checkLeftValid(); this.navigation.setSelect(
self._checkRightValid(); this.navigation.getSelect() + 1
);
this._checkLeftValid();
this._checkRightValid();
},
} }
}] ],
}); });
this.navigation = BI.createWidget({ this.navigation = createWidget({
type: "bi.navigation", type: Navigation.xtype,
direction: "top", direction: "top",
element: this, element: this,
single: true, single: true,
logic: { logic: {
dynamic: true dynamic: true,
}, },
tab: { tab: {
type: "bi.htape", type: HTapeLayout.xtype,
cls: "bi-split-top bi-split-bottom", cls: "bi-split-top bi-split-bottom",
height: 30, height: 30,
items: [{ items: [
el: { {
type: "bi.center_adapt", el: {
items: [self.backBtn] type: CenterAdaptLayout.xtype,
items: [this.backBtn],
},
width: 25,
}, },
width: 25 {
}, { type: Layout.xtype,
type: "bi.layout"
}, {
el: {
type: "bi.center_adapt",
items: [self.preBtn]
}, },
width: 25 {
}] el: {
type: CenterAdaptLayout.xtype,
items: [this.preBtn],
},
width: 25,
}
],
}, },
cardCreator: BI.bind(this._createYearCalendar, this), cardCreator: bind(this._createYearCalendar, this),
afterCardShow: function () { afterCardShow: () => {
this.setValue(self.selectedYear); this.navigation.setValue(this.selectedYear);
// var calendar = this.getSelectedCard(); // var calendar = this.getSelectedCard();
// self.backBtn.setEnable(!calendar.isFrontYear()); // this.backBtn.setEnable(!calendar.isFrontYear());
// self.preBtn.setEnable(!calendar.isFinalYear()); // this.preBtn.setEnable(!calendar.isFinalYear());
} },
}); });
this.navigation.on(BI.Navigation.EVENT_CHANGE, function () { this.navigation.on(Navigation.EVENT_CHANGE, () => {
self.selectedYear = this.getValue(); this.selectedYear = this.navigation.getValue();
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); this.fireEvent(Controller.EVENT_CHANGE, ...arguments);
self.fireEvent(BI.StaticYearCard.EVENT_CHANGE, self.selectedYear); this.fireEvent(StaticYearCard.EVENT_CHANGE, this.selectedYear);
}); });
if(BI.isKey(o.value)){ if (isKey(o.value)) {
this.setValue(o.value); this.setValue(o.value);
} }
}, }
_checkLeftValid: function () { _checkLeftValid() {
var o = this.options; const valid = true;
var valid = true;
this.backBtn.setEnable(valid); this.backBtn.setEnable(valid);
return valid; return valid;
}, }
_checkRightValid: function () { _checkRightValid() {
var o = this.options; const valid = true;
var valid = true;
this.preBtn.setEnable(valid); this.preBtn.setEnable(valid);
return valid; return valid;
}, }
_checkMin: function () { _checkMin() {
var o = this.options; const o = this.options;
BI.each(this.navigation.getAllCard(), function (idx, calendar) { each(this.navigation.getAllCard(), (idx, calendar) => {
calendar.setMinDate(o.min); calendar.setMinDate(o.min);
}); });
}, }
_checkMax: function () { _checkMax() {
var o = this.options; const o = this.options;
BI.each(this.navigation.getAllCard(), function (idx, calendar) { each(this.navigation.getAllCard(), (idx, calendar) => {
calendar.setMaxDate(o.max); calendar.setMaxDate(o.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._checkLeftValid(); this._checkLeftValid();
this._checkRightValid(); this._checkRightValid();
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._checkLeftValid(); this._checkLeftValid();
this._checkRightValid(); this._checkRightValid();
this._checkMax(); this._checkMax();
} }
}, }
getValue: function () { getValue() {
return { return {
year: this.selectedYear year: this.selectedYear,
}; };
}, }
setValue: function (obj) { setValue(obj) {
var o = this.options; const o = this.options;
obj = obj || {}; obj = obj || {};
var v = obj.year; let v = obj.year;
if (BI.checkDateVoid(v, 1, 1, o.min, o.max)[0]) { if (checkDateVoid(v, 1, 1, o.min, o.max)[0]) {
v = BI.getDate().getFullYear(); v = getDate().getFullYear();
this.selectedYear = ""; this.selectedYear = "";
this.navigation.setSelect(BI.YearCalendar.getPageByYear(v)); this.navigation.setSelect(YearCalendar.getPageByYear(v));
this.navigation.setValue(""); this.navigation.setValue("");
} else { } else {
this.selectedYear = BI.parseInt(v); this.selectedYear = parseInt(v);
this.navigation.setSelect(BI.YearCalendar.getPageByYear(v)); this.navigation.setSelect(YearCalendar.getPageByYear(v));
this.navigation.setValue(this.selectedYear); this.navigation.setValue(this.selectedYear);
} }
this._checkLeftValid(); this._checkLeftValid();
this._checkRightValid(); this._checkRightValid();
} }
}); }
BI.StaticYearCard.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.static_year_card", BI.StaticYearCard);

262
src/widget/year/combo.year.js

@ -1,73 +1,84 @@
BI.DynamicYearCombo = BI.inherit(BI.Widget, { import { shortcut, Widget, toPix, getDate, isNotNull, AbsoluteLayout, HorizontalFillLayout, extend } from "@/core";
import { DynamicYearTrigger } from "@/widget/year/trigger.year";
import { DynamicDateCombo } from "@/widget";
import { Combo } from "@/base";
import { DynamicYearPopup } from "@/widget/year/popup.year";
_const: { @shortcut()
iconWidth: 24 export class DynamicYearCombo extends Widget {
}, static xtype = "bi.dynamic_year_combo";
static EVENT_CONFIRM = "EVENT_CONFIRM";
static EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";
static EVENT_ERROR = "EVENT_ERROR";
static EVENT_VALID = "EVENT_VALID";
static EVENT_FOCUS = "EVENT_FOCUS";
_const ={
iconWidth: 24,
}
props: { props={
baseCls: "bi-year-combo", baseCls: "bi-year-combo",
behaviors: {}, behaviors: {},
minDate: "1900-01-01", // 最小日期 minDate: "1900-01-01", // 最小日期
maxDate: "2099-12-31", // 最大日期 maxDate: "2099-12-31", // 最大日期
height: 24, height: 24,
supportDynamic: true supportDynamic: true,
}, }
_init: function () { _init() {
var self = this, o = this.options; const o = this.options;
BI.DynamicYearCombo.superclass._init.apply(this, arguments); super._init(...arguments);
this.storeValue = o.value; this.storeValue = o.value;
var border = o.simple ? 1 : 2; const border = o.simple ? 1 : 2;
this.trigger = BI.createWidget({ this.trigger = BI.createWidget({
type: "bi.dynamic_year_trigger", type: DynamicYearTrigger.xtype,
simple: o.simple, simple: o.simple,
min: o.minDate, min: o.minDate,
max: o.maxDate, max: o.maxDate,
height: BI.toPix(o.height, border), height: toPix(o.height, border),
value: o.value || "", value: o.value || "",
watermark: o.watermark watermark: o.watermark,
}); });
this.trigger.on(BI.DynamicYearTrigger.EVENT_KEY_DOWN, function () { this.trigger.on(DynamicYearTrigger.EVENT_KEY_DOWN, () => {
if (self.combo.isViewVisible()) { if (this.combo.isViewVisible()) {
self.combo.hideView(); this.combo.hideView();
} }
}); });
this.trigger.on(BI.DynamicYearTrigger.EVENT_FOCUS, function () { this.trigger.on(DynamicYearTrigger.EVENT_FOCUS, () => {
self.storeTriggerValue = this.getKey(); this.storeTriggerValue = this.getKey();
self.fireEvent(BI.DynamicYearCombo.EVENT_FOCUS); this.fireEvent(DynamicYearCombo.EVENT_FOCUS);
}); });
this.trigger.on(BI.DynamicYearTrigger.EVENT_START, function () { this.trigger.on(DynamicYearTrigger.EVENT_START, () => {
self.combo.isViewVisible() && self.combo.hideView(); this.combo.isViewVisible() && this.combo.hideView();
}); });
this.trigger.on(BI.DynamicYearTrigger.EVENT_STOP, function () { this.trigger.on(DynamicYearTrigger.EVENT_STOP, () => {
self.combo.showView(); this.combo.showView();
}); });
this.trigger.on(BI.DynamicYearTrigger.EVENT_ERROR, function () { this.trigger.on(DynamicYearTrigger.EVENT_ERROR, () => {
self.combo.isViewVisible() && self.combo.hideView(); this.combo.isViewVisible() && this.combo.hideView();
self.comboWrapper.element.addClass("error"); this.comboWrapper.element.addClass("error");
self.fireEvent(BI.DynamicYearCombo.EVENT_ERROR); this.fireEvent(DynamicYearCombo.EVENT_ERROR);
}); });
this.trigger.on(BI.DynamicYearTrigger.EVENT_VALID, function () { this.trigger.on(DynamicYearTrigger.EVENT_VALID, () => {
self.comboWrapper.element.removeClass("error"); this.comboWrapper.element.removeClass("error");
self.fireEvent(BI.DynamicYearCombo.EVENT_VALID); this.fireEvent(DynamicYearCombo.EVENT_VALID);
}); });
this.trigger.on(BI.DynamicYearTrigger.EVENT_CONFIRM, function () { this.trigger.on(DynamicYearTrigger.EVENT_CONFIRM, () => {
if (self.combo.isViewVisible()) { if (this.combo.isViewVisible()) {
return; return;
} }
if (this.getKey() && this.getKey() !== self.storeTriggerValue) { if (this.getKey() && this.getKey() !== this.storeTriggerValue) {
self.storeValue = self.trigger.getValue(); this.storeValue = this.trigger.getValue();
self.setValue(self.storeValue); this.setValue(this.storeValue);
} else if (!this.getKey()) { } else if (!this.getKey()) {
self.storeValue = null; this.storeValue = null;
self.setValue(); this.setValue();
} }
self._checkDynamicValue(self.storeValue); this._checkDynamicValue(this.storeValue);
self.fireEvent(BI.DynamicYearCombo.EVENT_CONFIRM); this.fireEvent(DynamicYearCombo.EVENT_CONFIRM);
}); });
this.combo = BI.createWidget({ this.combo = BI.createWidget({
type: "bi.combo", type: Combo.xtype,
container: o.container, container: o.container,
isNeedAdjustHeight: false, isNeedAdjustHeight: false,
isNeedAdjustWidth: false, isNeedAdjustWidth: false,
@ -78,150 +89,143 @@ BI.DynamicYearCombo = BI.inherit(BI.Widget, {
minWidth: 85, minWidth: 85,
stopPropagation: false, stopPropagation: false,
el: { el: {
type: "bi.dynamic_year_popup", type: DynamicYearPopup.xtype,
supportDynamic: o.supportDynamic, supportDynamic: o.supportDynamic,
ref: function () { ref: _ref => {
self.popup = this; this.popup = _ref;
}, },
listeners: [{ listeners: [{
eventName: BI.DynamicYearPopup.EVENT_CHANGE, eventName: DynamicYearPopup.EVENT_CHANGE,
action: function () { action:() => {
self.setValue(self.popup.getValue()); this.setValue(this.popup.getValue());
self.combo.hideView(); this.combo.hideView();
self.fireEvent(BI.DynamicYearCombo.EVENT_CONFIRM); this.fireEvent(DynamicYearCombo.EVENT_CONFIRM);
} },
}, { }, {
eventName: BI.DynamicYearPopup.BUTTON_CLEAR_EVENT_CHANGE, eventName: DynamicYearPopup.BUTTON_CLEAR_EVENT_CHANGE,
action: function () { action: () => {
self.setValue(); this.setValue();
self.combo.hideView(); this.combo.hideView();
self.fireEvent(BI.DynamicYearCombo.EVENT_CONFIRM); this.fireEvent(DynamicYearCombo.EVENT_CONFIRM);
} },
}, { }, {
eventName: BI.DynamicYearPopup.BUTTON_lABEL_EVENT_CHANGE, eventName: DynamicYearPopup.BUTTON_lABEL_EVENT_CHANGE,
action: function () { action: () => {
var date = BI.getDate(); const date = getDate();
self.setValue({ type: BI.DynamicYearCombo.Static, value: { year: date.getFullYear() } }); this.setValue({ type: DynamicYearCombo.Static, value: { year: date.getFullYear() } });
self.combo.hideView(); this.combo.hideView();
self.fireEvent(BI.DynamicDateCombo.EVENT_CONFIRM); this.fireEvent(DynamicDateCombo.EVENT_CONFIRM);
} },
}, { }, {
eventName: BI.DynamicYearPopup.BUTTON_OK_EVENT_CHANGE, eventName: DynamicYearPopup.BUTTON_OK_EVENT_CHANGE,
action: function () { action: () => {
self.setValue(self.popup.getValue()); this.setValue(this.popup.getValue());
self.combo.hideView(); this.combo.hideView();
self.fireEvent(BI.DynamicDateCombo.EVENT_CONFIRM); this.fireEvent(DynamicDateCombo.EVENT_CONFIRM);
} },
}], }],
behaviors: o.behaviors, behaviors: o.behaviors,
min: o.minDate, min: o.minDate,
max: o.maxDate max: o.maxDate,
}, },
value: o.value || "" value: o.value || "",
} },
}); });
this.combo.on(BI.Combo.EVENT_BEFORE_POPUPVIEW, function () { this.combo.on(Combo.EVENT_BEFORE_POPUPVIEW, () => {
self.popup.setMinDate(o.minDate); this.popup.setMinDate(o.minDate);
self.popup.setMaxDate(o.maxDate); this.popup.setMaxDate(o.maxDate);
self.popup.setValue(self.storeValue); this.popup.setValue(this.storeValue);
self.fireEvent(BI.DynamicYearCombo.EVENT_BEFORE_POPUPVIEW); this.fireEvent(DynamicYearCombo.EVENT_BEFORE_POPUPVIEW);
}); });
BI.createWidget({ BI.createWidget({
type: "bi.absolute", type: AbsoluteLayout.xtype,
element: this, element: this,
items: [{ items: [{
el: { el: {
type: "bi.horizontal_fill", type: HorizontalFillLayout.xtype,
columnSize: ["", "fill"], columnSize: ["", "fill"],
cls: (o.simple ? "bi-border-bottom" : "bi-border bi-border-radius") + " bi-focus-shadow", cls: `${o.simple ? "bi-border-bottom" : "bi-border bi-border-radius"} bi-focus-shadow`,
ref: function () { ref: _ref => {
self.comboWrapper = this; this.comboWrapper = _ref;
}, },
items: [{ items: [{
el: { el: {
type: "bi.icon_button", type: "bi.icon_button",
cls: "bi-trigger-icon-button date-change-h-font", cls: "bi-trigger-icon-button date-change-h-font",
width: this._const.iconWidth, width: this._const.iconWidth,
height: BI.toPix(o.height, border), height: toPix(o.height, border),
ref: function () { ref: _ref => {
self.changeIcon = this; this.changeIcon = _ref;
} },
}, },
}, this.combo] }, this.combo],
}, },
top: 0, top: 0,
left: 0, left: 0,
right: 0, right: 0,
bottom: 0 bottom: 0,
}] }],
}); });
this._checkDynamicValue(o.value); this._checkDynamicValue(o.value);
}, }
_checkDynamicValue: function (v) { _checkDynamicValue(v) {
var type = null; let type = null;
if (BI.isNotNull(v)) { if (isNotNull(v)) {
type = v.type; type = v.type;
} }
switch (type) { switch (type) {
case BI.DynamicYearCombo.Dynamic: case DynamicYearCombo.Dynamic:
this.changeIcon.setVisible(true); this.changeIcon.setVisible(true);
break; break;
default: default:
this.changeIcon.setVisible(false); this.changeIcon.setVisible(false);
break; break;
} }
}, }
setMinDate: function (minDate) { setMinDate(minDate) {
var o = this.options; const o = this.options;
o.minDate = minDate; o.minDate = minDate;
this.trigger.setMinDate(minDate); this.trigger.setMinDate(minDate);
this.popup && this.popup.setMinDate(minDate); this.popup && this.popup.setMinDate(minDate);
}, }
setMaxDate: function (maxDate) { setMaxDate(maxDate) {
var o = this.options; const o = this.options;
o.maxDate = maxDate; o.maxDate = maxDate;
this.trigger.setMaxDate(maxDate); this.trigger.setMaxDate(maxDate);
this.popup && this.popup.setMaxDate(maxDate); this.popup && this.popup.setMaxDate(maxDate);
}, }
hideView: function () { hideView() {
this.combo.hideView(); this.combo.hideView();
}, }
getKey: function () { getKey() {
return this.trigger.getKey() + ""; return `${this.trigger.getKey()}`;
}, }
setValue: function (v) { setValue(v) {
this.storeValue = v; this.storeValue = v;
this.trigger.setValue(v); this.trigger.setValue(v);
this._checkDynamicValue(v); this._checkDynamicValue(v);
}, }
getValue: function () { getValue() {
return this.storeValue; return this.storeValue;
}, }
isStateValid: function () { isStateValid() {
return this.trigger.isValid(); return this.trigger.isValid();
}, }
setWaterMark: function (v) { setWaterMark(v) {
this.trigger.setWaterMark(v); this.trigger.setWaterMark(v);
} }
}); }
BI.DynamicYearCombo.EVENT_CONFIRM = "EVENT_CONFIRM"; extend(DynamicYearCombo, {
BI.DynamicYearCombo.EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";
BI.DynamicYearCombo.EVENT_ERROR = "EVENT_ERROR";
BI.DynamicYearCombo.EVENT_VALID = "EVENT_VALID";
BI.DynamicYearCombo.EVENT_FOCUS = "EVENT_FOCUS";
BI.shortcut("bi.dynamic_year_combo", BI.DynamicYearCombo);
BI.extend(BI.DynamicYearCombo, {
Static: 1, Static: 1,
Dynamic: 2 Dynamic: 2,
}); });

5
src/widget/year/index.js

@ -0,0 +1,5 @@
export { DynamicYearCard } from "./card.dynamic.year";
export { StaticYearCard } from "./card.year";
export { DynamicYearCombo } from "./combo.year";
export { DynamicYearPopup } from "./popup.year";
export { DynamicYearTrigger } from "./trigger.year";

440
src/widget/year/popup.year.js

@ -1,246 +1,318 @@
/** import { shortcut, Widget, toPix, i18nText, VerticalLayout, GridLayout, print, getDate, checkDateVoid, createItems } from "@/core";
* 年份展示面板 import { TextButton, Tab } from "@/base";
* import { DynamicDateCombo, DynamicDateHelper, DynamicYearCard, DynamicYearCombo, StaticYearCard } from "@/widget";
* Created by GUY on 2015/9/2. import { LinearSegment } from "@/case";
* @class BI.DynamicYearPopup
* @extends BI.Trigger
*/
BI.DynamicYearPopup = BI.inherit(BI.Widget, {
constants: {
tabHeight: 40,
},
props: { @shortcut()
export class DynamicYearPopup extends Widget {
static xtype = "bi.dynamic_year_popup";
props = {
baseCls: "bi-dynamic-year-popup", baseCls: "bi-dynamic-year-popup",
behaviors: {}, behaviors: {},
min: "1900-01-01", // 最小日期 min: "1900-01-01",
max: "2099-12-31", // 最大日期, max: "2099-12-31",
width: 180, width: 180,
supportDynamic: true, supportDynamic: true,
}, };
constants = {
tabHeight: 40,
};
static BUTTON_CLEAR_EVENT_CHANGE = "BUTTON_CLEAR_EVENT_CHANGE";
static BUTTON_lABEL_EVENT_CHANGE = "BUTTON_lABEL_EVENT_CHANGE";
static BUTTON_OK_EVENT_CHANGE = "BUTTON_OK_EVENT_CHANGE";
static EVENT_CHANGE = "EVENT_CHANGE";
render: function () { render() {
var self = this, opts = this.options, c = this.constants; this.storeValue = { type: DynamicYearCombo.Static };
this.storeValue = {type: BI.DynamicYearCombo.Static};
return { return {
type: "bi.vertical", type: VerticalLayout.xtype,
items: [{ items: [
el: this._getTabJson() {
}, { el: this._getTabJson(),
el: {
type: "bi.grid",
items: [[{
type: "bi.text_button",
cls: "bi-split-top bi-high-light",
textHeight: BI.toPix(BI.SIZE_CONSANTS.TOOL_BAR_HEIGHT, 1),
shadow: true,
text: BI.i18nText("BI-Basic_Clear"),
listeners: [{
eventName: BI.TextButton.EVENT_CHANGE,
action: function () {
self.fireEvent(BI.DynamicYearPopup.BUTTON_CLEAR_EVENT_CHANGE);
}
}]
}, {
type: "bi.text_button",
textHeight: BI.toPix(BI.SIZE_CONSANTS.TOOL_BAR_HEIGHT, 1),
cls: "bi-split-left bi-split-right bi-high-light bi-split-top",
shadow: true,
text: BI.i18nText("BI-Basic_Current_Year"),
disabled: this._checkTodayValid(),
ref: function () {
self.yearButton = this;
},
listeners: [{
eventName: BI.TextButton.EVENT_CHANGE,
action: function () {
self.fireEvent(BI.DynamicYearPopup.BUTTON_lABEL_EVENT_CHANGE);
}
}]
}, {
type: "bi.text_button",
cls: "bi-split-top bi-high-light",
textHeight: BI.toPix(BI.SIZE_CONSANTS.TOOL_BAR_HEIGHT, 1),
shadow: true,
text: BI.i18nText("BI-Basic_OK"),
listeners: [{
eventName: BI.TextButton.EVENT_CHANGE,
action: function () {
var type = self.dateTab.getSelect();
if (type === BI.DynamicDateCombo.Dynamic) {
self.dynamicPane.checkValidation(true) && self.fireEvent(BI.DynamicYearMonthPopup.BUTTON_OK_EVENT_CHANGE);
} else {
self.fireEvent(BI.DynamicYearPopup.BUTTON_OK_EVENT_CHANGE);
}
}
}]
}]],
height: BI.SIZE_CONSANTS.TOOL_BAR_HEIGHT,
}, },
}] {
el: {
type: GridLayout.xtype,
items: [
[
{
type: TextButton.xtype,
cls: "bi-split-top bi-high-light",
textHeight: toPix(
BI.SIZE_CONSANTS.TOOL_BAR_HEIGHT,
1
),
shadow: true,
text: i18nText("BI-Basic_Clear"),
listeners: [
{
eventName: TextButton.EVENT_CHANGE,
action :() => {
this.fireEvent(
DynamicYearPopup.BUTTON_CLEAR_EVENT_CHANGE
);
},
}
],
},
{
type: TextButton.xtype,
textHeight: toPix(
BI.SIZE_CONSANTS.TOOL_BAR_HEIGHT,
1
),
cls: "bi-split-left bi-split-right bi-high-light bi-split-top",
shadow: true,
text: i18nText("BI-Basic_Current_Year"),
disabled: this._checkTodayValid(),
ref: _ref => {
this.yearButton = _ref;
},
listeners: [
{
eventName: TextButton.EVENT_CHANGE,
action :() => {
this.fireEvent(
DynamicYearPopup.BUTTON_lABEL_EVENT_CHANGE
);
},
}
],
},
{
type: TextButton.xtype,
cls: "bi-split-top bi-high-light",
textHeight: toPix(
BI.SIZE_CONSANTS.TOOL_BAR_HEIGHT,
1
),
shadow: true,
text: i18nText("BI-Basic_OK"),
listeners: [
{
eventName: TextButton.EVENT_CHANGE,
action :() => {
const type =
this.dateTab.getSelect();
if (
type ===
DynamicDateCombo.Dynamic
) {
this.dynamicPane.checkValidation(
true
) &&
this.fireEvent(
BI.DynamicYearMonthPopup.BUTTON_OK_EVENT_CHANGE
);
} else {
this.fireEvent(
DynamicYearPopup.BUTTON_OK_EVENT_CHANGE
);
}
},
}
],
}
]
],
height: BI.SIZE_CONSANTS.TOOL_BAR_HEIGHT,
},
}
],
}; };
}, }
_setInnerValue: function () { _setInnerValue() {
if (this.dateTab.getSelect() === BI.DynamicDateCombo.Static) { if (this.dateTab.getSelect() === DynamicDateCombo.Static) {
this.yearButton.setValue(BI.i18nText("BI-Basic_Current_Year")); this.yearButton.setValue(i18nText("BI-Basic_Current_Year"));
this.yearButton.setEnable(!this._checkYearValid()); this.yearButton.setEnable(!this._checkYearValid());
} else { } else {
var date = BI.DynamicDateHelper.getCalculation(this.dynamicPane.getInputValue()); let date = DynamicDateHelper.getCalculation(
date = BI.print(date, "%Y"); this.dynamicPane.getInputValue()
);
date = print(date, "%Y");
this.yearButton.setValue(date); this.yearButton.setValue(date);
this.yearButton.setEnable(false); this.yearButton.setEnable(false);
} }
}, }
_checkYearValid: function () { _checkYearValid() {
var o = this.options; const o = this.options;
var today = BI.getDate(); const today = getDate();
return !!BI.checkDateVoid(today.getFullYear(), today.getMonth() + 1, today.getDate(), o.min, o.max)[0];
}, return !!checkDateVoid(
today.getFullYear(),
today.getMonth() + 1,
today.getDate(),
o.min,
o.max
)[0];
}
_getTabJson: function () { _getTabJson() {
var self = this, o = this.options; const o = this.options;
return { return {
type: "bi.tab", type: Tab.xtype,
logic: { logic: {
dynamic: true dynamic: true,
}, },
ref: function () { ref: _ref => {
self.dateTab = this; this.dateTab = _ref;
}, },
tab: { tab: {
type: "bi.linear_segment", type: LinearSegment.xtype,
invisible: !o.supportDynamic, invisible: !o.supportDynamic,
height: this.constants.tabHeight, height: this.constants.tabHeight,
items: BI.createItems([{ items: createItems(
text: BI.i18nText("BI-Basic_Year_Fen"), [
value: BI.DynamicYearCombo.Static {
}, { text: i18nText("BI-Basic_Year_Fen"),
text: BI.i18nText("BI-Basic_Dynamic_Title"), value: DynamicYearCombo.Static,
value: BI.DynamicYearCombo.Dynamic },
}], { {
textAlign: "center" text: i18nText("BI-Basic_Dynamic_Title"),
}) value: DynamicYearCombo.Dynamic,
}
],
{
textAlign: "center",
}
),
}, },
cardCreator: function (v) { cardCreator: v => {
switch (v) { switch (v) {
case BI.DynamicYearCombo.Dynamic: case DynamicYearCombo.Dynamic:
return { return {
type: "bi.dynamic_year_card", type: DynamicYearCard.xtype,
cls: "dynamic-year-pane", cls: "dynamic-year-pane",
min: self.options.min, min: o.min,
max: self.options.max, max: o.max,
listeners: [{ listeners: [
{
eventName: "EVENT_CHANGE", eventName: "EVENT_CHANGE",
action: function () { action : () => {
self._setInnerValue(self.year, v); this._setInnerValue(this.year, v);
} },
}],
ref: function () {
self.dynamicPane = this;
} }
}; ],
case BI.DynamicYearCombo.Static: ref: _ref => {
default: this.dynamicPane = _ref;
return { },
type: "bi.static_year_card", };
behaviors: o.behaviors, case DynamicYearCombo.Static:
min: self.options.min, default:
max: self.options.max, return {
listeners: [{ type: StaticYearCard.xtype,
eventName: BI.StaticYearCard.EVENT_CHANGE, behaviors: o.behaviors,
action: function () { min: o.min,
self.fireEvent(BI.DynamicYearPopup.EVENT_CHANGE); max: o.max,
} listeners: [
}], {
ref: function () { eventName: StaticYearCard.EVENT_CHANGE,
self.year = this; action: () => {
this.fireEvent(
DynamicYearPopup.EVENT_CHANGE
);
},
} }
}; ],
ref: _ref => {
this.year = _ref;
},
};
} }
}, },
listeners: [{ listeners: [
eventName: BI.Tab.EVENT_CHANGE, {
action: function () { eventName: Tab.EVENT_CHANGE,
var v = self.dateTab.getSelect(); action :() => {
switch (v) { const v = this.dateTab.getSelect();
case BI.DynamicYearCombo.Static: switch (v) {
var date = BI.DynamicDateHelper.getCalculation(self.dynamicPane.getValue()); case DynamicYearCombo.Static: {
self.year.setValue({year: date.getFullYear()}); const date = DynamicDateHelper.getCalculation(this.dynamicPane.getValue());
self._setInnerValue(); this.year.setValue({ year: date.getFullYear() });
this._setInnerValue();
break; break;
case BI.DynamicYearCombo.Dynamic: }
case DynamicYearCombo.Dynamic:
default: default:
if(self.storeValue && self.storeValue.type === BI.DynamicYearCombo.Dynamic) { if (
self.dynamicPane.setValue(self.storeValue.value); this.storeValue &&
}else{ this.storeValue.type ===
self.dynamicPane.setValue({ DynamicYearCombo.Dynamic
year: 0 ) {
this.dynamicPane.setValue(
this.storeValue.value
);
} else {
this.dynamicPane.setValue({
year: 0,
}); });
} }
self._setInnerValue(); this._setInnerValue();
break; break;
} }
},
} }
}] ],
}; };
}, }
_checkTodayValid: function () { _checkTodayValid() {
var o = this.options; const o = this.options;
var today = BI.getDate(); const today = getDate();
return !!BI.checkDateVoid(today.getFullYear(), today.getMonth() + 1, today.getDate(), o.min, o.max)[0];
}, return !!checkDateVoid(
today.getFullYear(),
today.getMonth() + 1,
today.getDate(),
o.min,
o.max
)[0];
}
setMinDate: function (minDate) { setMinDate(minDate) {
if (this.options.min !== minDate) { if (this.options.min !== minDate) {
this.options.min = minDate; this.options.min = minDate;
this.year && this.year.setMinDate(minDate); this.year && this.year.setMinDate(minDate);
this.dynamicPane && this.dynamicPane.setMinDate(minDate); this.dynamicPane && this.dynamicPane.setMinDate(minDate);
} }
}, }
setMaxDate: function (maxDate) { setMaxDate(maxDate) {
if (this.options.max !== maxDate) { if (this.options.max !== maxDate) {
this.options.max = maxDate; this.options.max = maxDate;
this.year && this.year.setMaxDate(maxDate); this.year && this.year.setMaxDate(maxDate);
this.dynamicPane && this.dynamicPane.setMaxDate(maxDate); this.dynamicPane && this.dynamicPane.setMaxDate(maxDate);
} }
}, }
setValue: function (v) { setValue(v) {
this.storeValue = v; this.storeValue = v;
var self = this;
var type, value;
v = v || {}; v = v || {};
type = v.type || BI.DynamicDateCombo.Static; const type = v.type || DynamicDateCombo.Static;
value = v.value || v; const value = v.value || v;
this.dateTab.setSelect(type); this.dateTab.setSelect(type);
switch (type) { switch (type) {
case BI.DynamicDateCombo.Dynamic: case DynamicDateCombo.Dynamic:
this.dynamicPane.setValue(value); this.dynamicPane.setValue(value);
self._setInnerValue(); this._setInnerValue();
break; break;
case BI.DynamicDateCombo.Static: case DynamicDateCombo.Static:
default: default:
this.year.setValue(value); this.year.setValue(value);
this.yearButton.setValue(BI.i18nText("BI-Basic_Current_Year")); this.yearButton.setValue(i18nText("BI-Basic_Current_Year"));
this.yearButton.setEnable(!this._checkTodayValid()); this.yearButton.setEnable(!this._checkTodayValid());
break; break;
} }
}, }
getValue: function () { getValue() {
return { return {
type: this.dateTab.getSelect(), type: this.dateTab.getSelect(),
value: this.dateTab.getValue() value: this.dateTab.getValue(),
}; };
} }
}
});
BI.DynamicYearPopup.BUTTON_CLEAR_EVENT_CHANGE = "BUTTON_CLEAR_EVENT_CHANGE";
BI.DynamicYearPopup.BUTTON_lABEL_EVENT_CHANGE = "BUTTON_lABEL_EVENT_CHANGE";
BI.DynamicYearPopup.BUTTON_OK_EVENT_CHANGE = "BUTTON_OK_EVENT_CHANGE";
BI.DynamicYearPopup.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.dynamic_year_popup", BI.DynamicYearPopup);

291
src/widget/year/trigger.year.js

@ -1,204 +1,227 @@
BI.DynamicYearTrigger = BI.inherit(BI.Trigger, { import { shortcut, extend, i18nText, bind, createWidget, isPositiveInteger, checkDateVoid, parseDateTime, isNotNull, isNotEmptyString, parseInt, print, getDate, HorizontalFillLayout } from "@/core";
_const: { import { Trigger, TextButton } from "@/base";
hgap: 4, import { SignEditor, TriggerIconButton } from "@/case";
vgap: 2, import { DynamicDateCombo, DynamicDateHelper } from "@/widget";
iconWidth: 24
}, @shortcut()
export class DynamicYearTrigger extends Trigger {
_defaultConfig: function () { static xtype = "bi.dynamic_year_trigger";
return BI.extend(BI.DynamicYearTrigger.superclass._defaultConfig.apply(this, arguments), {
_const = { hgap: 4, vgap: 2, iconWidth: 24 };
static EVENT_KEY_DOWN = "EVENT_KEY_DOWN";
static EVENT_FOCUS = "EVENT_FOCUS";
static EVENT_ERROR = "EVENT_ERROR";
static EVENT_START = "EVENT_START";
static EVENT_CONFIRM = "EVENT_CONFIRM";
static EVENT_STOP = "EVENT_STOP";
static EVENT_VALID = "EVENT_VALID";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
extraCls: "bi-year-trigger", extraCls: "bi-year-trigger",
min: "1900-01-01", // 最小日期 min: "1900-01-01", // 最小日期
max: "2099-12-31", // 最大日期 max: "2099-12-31", // 最大日期
height: 24, height: 24,
watermark: BI.i18nText("BI-Basic_Unrestricted") watermark: i18nText("BI-Basic_Unrestricted"),
}); });
}, }
beforeInit: function (callback) { beforeInit(callback) {
var o = this.options; const o = this.options;
o.title = BI.bind(this._titleCreator, this); o.title = bind(this._titleCreator, this);
callback(); callback();
}, }
_init: function () { _init() {
BI.DynamicYearTrigger.superclass._init.apply(this, arguments); super._init(...arguments);
var self = this, o = this.options, c = this._const; const o = this.options,
this.editor = BI.createWidget({ c = this._const;
type: "bi.sign_editor", this.editor = createWidget({
type: SignEditor.xtype,
simple: o.simple, simple: o.simple,
height: o.height, height: o.height,
validationChecker: function (v) { validationChecker: v => (
return v === "" || (BI.isPositiveInteger(v) && !BI.checkDateVoid(v, 1, 1, o.min, o.max)[0]); v === "" ||
}, (isPositiveInteger(v) &&
quitChecker: function (v) { !checkDateVoid(v, 1, 1, o.min, o.max)[0])
return false; ),
}, quitChecker: () => false,
hgap: c.hgap, hgap: c.hgap,
vgap: c.vgap, vgap: c.vgap,
watermark: o.watermark, watermark: o.watermark,
allowBlank: true, allowBlank: true,
errorText: function (v) { errorText:v => {
if (BI.isPositiveInteger(v)) { if (isPositiveInteger(v)) {
var start = BI.parseDateTime(o.min, "%Y-%X-%d"); const start = parseDateTime(o.min, "%Y-%X-%d");
var end = BI.parseDateTime(o.max, "%Y-%X-%d"); const end = parseDateTime(o.max, "%Y-%X-%d");
return BI.i18nText("BI-Basic_Year_Range_Error", return i18nText(
"BI-Basic_Year_Range_Error",
start.getFullYear(), start.getFullYear(),
end.getFullYear()); end.getFullYear()
);
} }
return BI.i18nText("BI-Year_Trigger_Invalid_Text"); return i18nText("BI-Year_Trigger_Invalid_Text");
}, },
}); });
this.editor.on(BI.SignEditor.EVENT_KEY_DOWN, function () { this.editor.on(SignEditor.EVENT_KEY_DOWN, () => {
self.fireEvent(BI.DynamicYearTrigger.EVENT_KEY_DOWN, arguments); this.fireEvent(DynamicYearTrigger.EVENT_KEY_DOWN, ...arguments);
}); });
this.editor.on(BI.SignEditor.EVENT_FOCUS, function () { this.editor.on(SignEditor.EVENT_FOCUS, () => {
self.fireEvent(BI.DynamicYearTrigger.EVENT_FOCUS); this.fireEvent(DynamicYearTrigger.EVENT_FOCUS);
}); });
this.editor.on(BI.SignEditor.EVENT_STOP, function () { this.editor.on(SignEditor.EVENT_STOP, () => {
self.fireEvent(BI.DynamicYearTrigger.EVENT_STOP); this.fireEvent(DynamicYearTrigger.EVENT_STOP);
}); });
this.editor.on(BI.SignEditor.EVENT_CONFIRM, function () { this.editor.on(SignEditor.EVENT_CONFIRM, () => {
var value = self.editor.getValue(); const value = this.editor.getValue();
if (BI.isNotNull(value)) { if (isNotNull(value)) {
self.editor.setValue(value); this.editor.setValue(value);
} }
if (BI.isNotEmptyString(value)) { if (isNotEmptyString(value)) {
self.storeValue = { this.storeValue = {
type: BI.DynamicDateCombo.Static, type: DynamicDateCombo.Static,
value: { value: {
year: value year: value,
} },
}; };
} }
self.fireEvent(BI.DynamicYearTrigger.EVENT_CONFIRM); this.fireEvent(DynamicYearTrigger.EVENT_CONFIRM);
}); });
this.editor.on(BI.SignEditor.EVENT_SPACE, function () { this.editor.on(SignEditor.EVENT_SPACE, () => {
if (self.editor.isValid()) { if (this.editor.isValid()) {
self.editor.blur(); this.editor.blur();
} }
}); });
this.editor.on(BI.SignEditor.EVENT_START, function () { this.editor.on(SignEditor.EVENT_START, () => {
self.fireEvent(BI.DynamicYearTrigger.EVENT_START); this.fireEvent(DynamicYearTrigger.EVENT_START);
}); });
this.editor.on(BI.SignEditor.EVENT_ERROR, function () { this.editor.on(SignEditor.EVENT_ERROR, () => {
self.fireEvent(BI.DynamicYearTrigger.EVENT_ERROR); this.fireEvent(DynamicYearTrigger.EVENT_ERROR);
}); });
this.editor.on(BI.SignEditor.EVENT_VALID, function () { this.editor.on(SignEditor.EVENT_VALID, () => {
self.fireEvent(BI.DynamicYearTrigger.EVENT_VALID); this.fireEvent(DynamicYearTrigger.EVENT_VALID);
}); });
BI.createWidget({ createWidget({
element: this, element: this,
type: "bi.horizontal_fill", type: HorizontalFillLayout.xtype,
columnSize: ["fill", "", ""], columnSize: ["fill", "", ""],
items: [{ items: [
el: this.editor {
}, { el: this.editor,
el: { },
type: "bi.text_button", {
baseCls: "bi-trigger-year-text", el: {
text: BI.i18nText("BI-Multi_Date_Year"), type: TextButton.xtype,
baseCls: "bi-trigger-year-text",
text: i18nText("BI-Multi_Date_Year"),
},
}, },
}, { {
el: { el: {
type: "bi.trigger_icon_button", type: TriggerIconButton.xtype,
width: this._const.iconWidth width: this._const.iconWidth,
},
} }
}] ],
}); });
this.setValue(o.value); this.setValue(o.value);
}, }
_getText: function (obj) { _getText(obj) {
var value = ""; let value = "";
if(BI.isNotNull(obj.year) && BI.parseInt(obj.year) !== 0) { if (isNotNull(obj.year) && parseInt(obj.year) !== 0) {
value += Math.abs(obj.year) + BI.i18nText("BI-Basic_Year") + (obj.year < 0 ? BI.i18nText("BI-Basic_Front") : BI.i18nText("BI-Basic_Behind")); value +=
Math.abs(obj.year) +
i18nText("BI-Basic_Year") +
(obj.year < 0
? i18nText("BI-Basic_Front")
: i18nText("BI-Basic_Behind"));
} }
return value; return value;
}, }
_setInnerValue: function (date, text) { _setInnerValue(date) {
var dateStr = BI.print(date, "%Y"); const dateStr = print(date, "%Y");
this.editor.setState(dateStr); this.editor.setState(dateStr);
this.editor.setValue(dateStr); this.editor.setValue(dateStr);
}, }
_titleCreator: function () { _titleCreator() {
var storeValue = this.storeValue || {}; const storeValue = this.storeValue || {};
var type = storeValue.type || BI.DynamicDateCombo.Static; const type = storeValue.type || DynamicDateCombo.Static;
var value = storeValue.value; let value = storeValue.value;
if(!this.editor.isValid()) { if (!this.editor.isValid()) {
return ""; return "";
} }
switch (type) { switch (type) {
case BI.DynamicDateCombo.Dynamic: case DynamicDateCombo.Dynamic: {
var text = this._getText(value); const text = this._getText(value);
var date = BI.getDate(); let date = getDate();
date = BI.DynamicDateHelper.getCalculation(value); date = DynamicDateHelper.getCalculation(value);
var dateStr = BI.print(date, "%Y"); const dateStr = BI.print(date, "%Y");
return BI.isEmptyString(text) ? dateStr : (text + ":" + dateStr);
case BI.DynamicDateCombo.Static: return BI.isEmptyString(text) ? dateStr : (`${text}:${dateStr}`);
default: }
value = value || {};
return value.year; case DynamicDateCombo.Static:
default:
value = value || {};
return value.year;
} }
}, }
setValue: function (v) { setValue(v) {
var type, value; let type, value;
var date = BI.getDate(); let date = getDate();
this.storeValue = v; this.storeValue = v;
if (BI.isNotNull(v)) { if (isNotNull(v)) {
type = v.type || BI.DynamicDateCombo.Static; type = v.type || DynamicDateCombo.Static;
value = v.value || v; value = v.value || v;
} }
switch (type) { switch (type) {
case BI.DynamicDateCombo.Dynamic: case DynamicDateCombo.Dynamic: {
var text = this._getText(value); const text = this._getText(value);
date = BI.DynamicDateHelper.getCalculation(value); date = DynamicDateHelper.getCalculation(value);
this._setInnerValue(date, text); this._setInnerValue(date, text);
break; break;
case BI.DynamicDateCombo.Static: }
default: case DynamicDateCombo.Static:
value = value || {}; default:
this.editor.setState(value.year); value = value || {};
this.editor.setValue(value.year); this.editor.setState(value.year);
break; this.editor.setValue(value.year);
break;
} }
}, }
setMinDate: function (minDate) { setMinDate(minDate) {
if (BI.isNotEmptyString(this.options.min)) { if (isNotEmptyString(this.options.min)) {
this.options.min = minDate; this.options.min = minDate;
} }
}, }
setMaxDate: function (maxDate) { setMaxDate(maxDate) {
if (BI.isNotEmptyString(this.options.max)) { if (isNotEmptyString(this.options.max)) {
this.options.max = maxDate; this.options.max = maxDate;
} }
}, }
getValue: function () { getValue() {
return this.storeValue; return this.storeValue;
}, }
getKey: function () { getKey() {
return this.editor.getValue() | 0; return this.editor.getValue() | 0;
}, }
setWaterMark: function (v) { setWaterMark(v) {
this.editor.setWaterMark(v); this.editor.setWaterMark(v);
} }
}); }
BI.DynamicYearTrigger.EVENT_KEY_DOWN = "EVENT_KEY_DOWN";
BI.DynamicYearTrigger.EVENT_FOCUS = "EVENT_FOCUS";
BI.DynamicYearTrigger.EVENT_ERROR = "EVENT_ERROR";
BI.DynamicYearTrigger.EVENT_START = "EVENT_START";
BI.DynamicYearTrigger.EVENT_CONFIRM = "EVENT_CONFIRM";
BI.DynamicYearTrigger.EVENT_STOP = "EVENT_STOP";
BI.DynamicYearTrigger.EVENT_VALID = "EVENT_VALID";
BI.shortcut("bi.dynamic_year_trigger", BI.DynamicYearTrigger);

296
src/widget/yearinterval/yearinterval.js

@ -1,194 +1,232 @@
/** import { shortcut, HorizontalFillLayout, createWidget, i18nText, print, parseDateTime, checkDateVoid, isNotNull, checkDateLegal } from "@/core";
* @author windy import { Single, Label, Bubbles } from "@/base";
* @version 2.0 import { DynamicYearCombo } from "../year";
* Created by windy on 2021/1/25
*/ @shortcut()
BI.YearInterval = BI.inherit(BI.Single, { export class YearInterval extends Single {
constants: { static xtype = "bi.year_interval";
constants = {
height: 24, height: 24,
width: 25, width: 25,
lgap: 15, lgap: 15,
offset: -15, offset: -15,
timeErrorCls: "time-error" timeErrorCls: "time-error",
}, };
props = {
props: {
extraCls: "bi-year-interval", extraCls: "bi-year-interval",
minDate: "1900-01-01", minDate: "1900-01-01",
maxDate: "2099-12-31", maxDate: "2099-12-31",
supportDynamic: true, supportDynamic: true,
}, };
static EVENT_VALID = "EVENT_VALID";
static EVENT_ERROR = "EVENT_ERROR";
static EVENT_CHANGE = "EVENT_CHANGE";
static EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";
render: function () { render() {
var self = this, o = this.options; const o = this.options;
o.value = o.value || {}; o.value = o.value || {};
this.left = this._createCombo(o.value.start, o.watermark?.start); this.left = this._createCombo(o.value.start, o.watermark?.start);
this.right = this._createCombo(o.value.end, o.watermark?.end); this.right = this._createCombo(o.value.end, o.watermark?.end);
return { return {
type: "bi.horizontal_fill", type: HorizontalFillLayout.xtype,
columnSize: ["fill", "", "fill"], columnSize: ["fill", "", "fill"],
items: [{ items: [
el: self.left {
}, { el: this.left,
el: { },
type: "bi.label", {
height: o.height, el: {
hgap: 5, type: Label.xtype,
text: "-", height: o.height,
ref: function (_ref) { hgap: 5,
self.label = _ref; text: "-",
} ref: _ref => {
this.label = _ref;
},
},
},
{
el: this.right,
} }
}, { ],
el: self.right
}]
}; };
}, }
_createCombo: function (v, watermark) { _createCombo(v, watermark) {
var self = this, o = this.options; const o = this.options;
var combo = BI.createWidget({ const combo = createWidget({
type: "bi.dynamic_year_combo", type: DynamicYearCombo.xtype,
supportDynamic: o.supportDynamic, supportDynamic: o.supportDynamic,
minDate: o.minDate, minDate: o.minDate,
maxDate: o.maxDate, maxDate: o.maxDate,
height: o.height, height: o.height,
behaviors: o.behaviors, behaviors: o.behaviors,
value: v, value: v,
watermark: watermark, watermark,
listeners: [{ listeners: [
eventName: BI.DynamicYearCombo.EVENT_BEFORE_POPUPVIEW, {
action: function () { eventName: DynamicYearCombo.EVENT_BEFORE_POPUPVIEW,
self.fireEvent(BI.YearInterval.EVENT_BEFORE_POPUPVIEW); action: () => {
this.fireEvent(YearInterval.EVENT_BEFORE_POPUPVIEW);
},
} }
}] ],
}); });
combo.on(BI.DynamicYearCombo.EVENT_ERROR, function () { combo.on(DynamicYearCombo.EVENT_ERROR, () => {
self._clearTitle(); this._clearTitle();
BI.Bubbles.hide("error"); Bubbles.hide("error");
self.element.removeClass(self.constants.timeErrorCls); this.element.removeClass(this.constants.timeErrorCls);
self.fireEvent(BI.YearInterval.EVENT_ERROR); this.fireEvent(YearInterval.EVENT_ERROR);
}); });
combo.on(BI.DynamicYearCombo.EVENT_VALID, function () { combo.on(DynamicYearCombo.EVENT_VALID, () => {
self._checkValid(); this._checkValid();
}); });
combo.on(BI.DynamicYearCombo.EVENT_FOCUS, function () { combo.on(DynamicYearCombo.EVENT_FOCUS, () => {
self._checkValid(); this._checkValid();
}); });
combo.on(BI.DynamicYearCombo.EVENT_CONFIRM, function () { combo.on(DynamicYearCombo.EVENT_CONFIRM, () => {
BI.Bubbles.hide("error"); Bubbles.hide("error");
var smallDate = self.left.getKey(), bigDate = self.right.getKey(); const smallDate = this.left.getKey(),
if (self.left.isStateValid() && self.right.isStateValid() && self._check(smallDate, bigDate) && self._compare(smallDate, bigDate)) { bigDate = this.right.getKey();
self._setTitle(BI.i18nText("BI-Time_Interval_Error_Text")); if (
self.element.addClass(self.constants.timeErrorCls); this.left.isStateValid() &&
self.fireEvent(BI.YearInterval.EVENT_ERROR); this.right.isStateValid() &&
}else{ this._check(smallDate, bigDate) &&
self._clearTitle(); this._compare(smallDate, bigDate)
self.element.removeClass(self.constants.timeErrorCls); ) {
self.fireEvent(BI.YearInterval.EVENT_CHANGE); this._setTitle(i18nText("BI-Time_Interval_Error_Text"));
this.element.addClass(this.constants.timeErrorCls);
this.fireEvent(YearInterval.EVENT_ERROR);
} else {
this._clearTitle();
this.element.removeClass(this.constants.timeErrorCls);
this.fireEvent(YearInterval.EVENT_CHANGE);
} }
}); });
return combo; return combo;
}, }
_dateCheck: function (date) {
return BI.print(BI.parseDateTime(date, "%Y"), "%Y") === date || BI.print(BI.parseDateTime(date, "%Y"), "%Y") === date;
},
_dateCheck(date) {
return (
print(parseDateTime(date, "%Y"), "%Y") === date ||
print(parseDateTime(date, "%Y"), "%Y") === date
);
}
// 判是否在最大最小之间 _checkVoid(obj) {
_checkVoid: function (obj) { const o = this.options;
var o = this.options;
return !BI.checkDateVoid(obj.year, 1, 1, o.minDate, o.maxDate)[0]; return !checkDateVoid(obj.year, 1, 1, o.minDate, o.maxDate)[0];
}, }
// 判格式合法 _check(smallDate, bigDate) {
_check: function (smallDate, bigDate) { const smallObj = smallDate.match(/\d+/g),
var smallObj = smallDate.match(/\d+/g), bigObj = bigDate.match(/\d+/g); bigObj = bigDate.match(/\d+/g);
var smallDate4Check = ""; let smallDate4Check = "";
if (BI.isNotNull(smallObj)) { if (isNotNull(smallObj)) {
smallDate4Check = smallObj[0] || ""; smallDate4Check = smallObj[0] || "";
} }
var bigDate4Check = ""; let bigDate4Check = "";
if (BI.isNotNull(bigObj)) { if (isNotNull(bigObj)) {
bigDate4Check = bigObj[0] || ""; bigDate4Check = bigObj[0] || "";
} }
return this._dateCheck(smallDate4Check) && BI.checkDateLegal(smallDate4Check) && this._checkVoid({ return (
year: smallObj[0], this._dateCheck(smallDate4Check) &&
month: 1, checkDateLegal(smallDate4Check) &&
day: 1 this._checkVoid({
}) && this._dateCheck(bigDate4Check) && BI.checkDateLegal(bigDate4Check) && this._checkVoid({ year: smallObj[0],
year: bigObj[0], month: 1,
month: 12, day: 1,
day: 1 }) &&
}); this._dateCheck(bigDate4Check) &&
}, checkDateLegal(bigDate4Check) &&
this._checkVoid({
_compare: function (smallDate, bigDate) { year: bigObj[0],
smallDate = BI.print(BI.parseDateTime(smallDate, "%Y"), "%Y"); month: 12,
bigDate = BI.print(BI.parseDateTime(bigDate, "%Y"), "%Y"); day: 1,
return BI.isNotNull(smallDate) && BI.isNotNull(bigDate) && smallDate > bigDate; })
}, );
_setTitle: function (v) { }
_compare(smallDate, bigDate) {
smallDate = print(parseDateTime(smallDate, "%Y"), "%Y");
bigDate = print(parseDateTime(bigDate, "%Y"), "%Y");
return (
isNotNull(smallDate) && isNotNull(bigDate) && smallDate > bigDate
);
}
_setTitle(v) {
this.setTitle(v); this.setTitle(v);
}, }
_clearTitle: function () {
_clearTitle() {
this.setTitle(""); this.setTitle("");
}, }
_checkValid: function () {
var self = this; _checkValid() {
Bubbles.hide("error");
BI.Bubbles.hide("error"); const smallDate = this.left.getKey(),
var smallDate = self.left.getKey(), bigDate = self.right.getKey(); bigDate = this.right.getKey();
if (self.left.isValid() && self.right.isValid() && self._check(smallDate, bigDate) && self._compare(smallDate, bigDate)) { if (
self._setTitle(BI.i18nText("BI-Time_Interval_Error_Text")); this.left.isValid() &&
self.element.addClass(self.constants.timeErrorCls); this.right.isValid() &&
BI.Bubbles.show("error", BI.i18nText("BI-Time_Interval_Error_Text"), self, { this._check(smallDate, bigDate) &&
offsetStyle: "center" this._compare(smallDate, bigDate)
}); ) {
self.fireEvent(BI.YearInterval.EVENT_ERROR); this._setTitle(i18nText("BI-Time_Interval_Error_Text"));
this.element.addClass(this.constants.timeErrorCls);
Bubbles.show(
"error",
i18nText("BI-Time_Interval_Error_Text"),
this,
{
offsetStyle: "center",
}
);
this.fireEvent(YearInterval.EVENT_ERROR);
} else { } else {
self._clearTitle(); this._clearTitle();
self.element.removeClass(self.constants.timeErrorCls); this.element.removeClass(this.constants.timeErrorCls);
} }
}, }
setMinDate: function (minDate) { setMinDate(minDate) {
var o = this.options; const o = this.options;
o.minDate = minDate; o.minDate = minDate;
this.left.setMinDate(minDate); this.left.setMinDate(minDate);
this.right.setMinDate(minDate); this.right.setMinDate(minDate);
}, }
setMaxDate: function (maxDate) { setMaxDate(maxDate) {
var o = this.options; const o = this.options;
o.maxDate = maxDate; o.maxDate = maxDate;
this.left.setMaxDate(maxDate); this.left.setMaxDate(maxDate);
this.right.setMaxDate(maxDate); this.right.setMaxDate(maxDate);
}, }
setValue: function (date) { setValue(date) {
date = date || {}; date = date || {};
this.left.setValue(date.start); this.left.setValue(date.start);
this.right.setValue(date.end); this.right.setValue(date.end);
this._checkValid(); this._checkValid();
},
getValue: function () {
return {start: this.left.getValue(), end: this.right.getValue()};
} }
});
BI.YearInterval.EVENT_VALID = "EVENT_VALID"; getValue() {
BI.YearInterval.EVENT_ERROR = "EVENT_ERROR"; return { start: this.left.getValue(), end: this.right.getValue() };
BI.YearInterval.EVENT_CHANGE = "EVENT_CHANGE"; }
BI.YearInterval.EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW"; }
BI.shortcut("bi.year_interval", BI.YearInterval);

Loading…
Cancel
Save