fanruan
/
fineui
4
1
Fork 2
Code Issues 1 Pull Requests Releases Wiki Activity
Browse Source

Pull request #3400: KERNEL-14097 refactor: widget/yearmonth、yearmonthinterval ES6化 

Merge in VISUAL/fineui from ~IMPACT/fine-ui:es6 to es6

* commit 'd8e5ffcb0ea2b36fb7ec19e63230287f3f0435c5':
  KERNEL-14097 refactor: widget/yearmonth、yearmonthinterval ES6化
es6
Impact-吴家豪 1 year ago
parent
ecf38254e5 d8e5ffcb0e
commit
ac87906b0b
9 changed files with 1278 additions and 899 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 28
      src/widget/dynamicdate/dynamicdate.combo.js
  2. 6
      src/widget/index.js
  3. 288
      src/widget/yearmonth/card.dynamic.yearmonth.js
  4. 274
      src/widget/yearmonth/card.static.yearmonth.js
  5. 342
      src/widget/yearmonth/combo.yearmonth.js
  6. 5
      src/widget/yearmonth/index.js
  7. 444
      src/widget/yearmonth/popup.yearmonth.js
  8. 481
      src/widget/yearmonth/trigger.yearmonth.js
  9. 309
      src/widget/yearmonthinterval/yearmonthinterval.js

28
src/widget/dynamicdate/dynamicdate.combo.js
Unescape View File

@ -7,6 +7,20 @@ import { DynamicDatePopup } from "./dynamicdate.popup";
export class DynamicDateCombo extends Single { export class DynamicDateCombo extends Single {
static xtype = "bi.dynamic_date_combo" static xtype = "bi.dynamic_date_combo"
static EVENT_KEY_DOWN = "EVENT_KEY_DOWN"
static EVENT_CONFIRM = "EVENT_CONFIRM"
static EVENT_FOCUS = "EVENT_FOCUS"
static EVENT_BLUR = "EVENT_BLUR"
static EVENT_CHANGE = "EVENT_CHANGE"
static EVENT_VALID = "EVENT_VALID"
static EVENT_ERROR = "EVENT_ERROR"
static EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW"
static EVENT_BEFORE_YEAR_MONTH_POPUPVIEW = "EVENT_BEFORE_YEAR_MONTH_POPUPVIEW"
static EVENT_BEFORE_YEAR_MONTH_POPUPVIEW = "EVENT_BEFORE_YEAR_MONTH_POPUPVIEW"
static Static = 1;
static Dynamic = 2;
constants = { constants = {
popupHeight: 259, popupHeight: 259,
popupWidth: 270, popupWidth: 270,
@ -30,20 +44,6 @@ export class DynamicDateCombo extends Single {
isNeedAdjustWidth: false, isNeedAdjustWidth: false,
}; };
static EVENT_KEY_DOWN = "EVENT_KEY_DOWN"
static EVENT_CONFIRM = "EVENT_CONFIRM"
static EVENT_FOCUS = "EVENT_FOCUS"
static EVENT_BLUR = "EVENT_BLUR"
static EVENT_CHANGE = "EVENT_CHANGE"
static EVENT_VALID = "EVENT_VALID"
static EVENT_ERROR = "EVENT_ERROR"
static EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW"
static EVENT_BEFORE_YEAR_MONTH_POPUPVIEW = "EVENT_BEFORE_YEAR_MONTH_POPUPVIEW"
static EVENT_BEFORE_YEAR_MONTH_POPUPVIEW = "EVENT_BEFORE_YEAR_MONTH_POPUPVIEW"
static Static = 1;
static Dynamic = 2;
_init() { _init() {
super._init(...arguments); super._init(...arguments);
} }

6
src/widget/index.js
Unescape View File

@ -18,7 +18,9 @@ import { MultiTreeInsertCombo } from "./multitree/multi.tree.insert.combo";
import { MultiTreeListCombo } from "./multitree/multi.tree.list.combo"; import { MultiTreeListCombo } from "./multitree/multi.tree.list.combo";
import { NumberEditor } from "./numbereditor/number.editor"; import { NumberEditor } from "./numbereditor/number.editor";
import { NumberInterval } from "./numberinterval/numberinterval"; import { NumberInterval } from "./numberinterval/numberinterval";
import { YearMonthInterval } from "./yearmonthinterval/yearmonthinterval";
import { YearQuarterInterval } from "./yearquarterinterval/yearquarterinterval"; import { YearQuarterInterval } from "./yearquarterinterval/yearquarterinterval";
import * as yearmonth from "./yearmonth";
import * as multiselect from "./multiselect"; import * as multiselect from "./multiselect";
import * as multiselectlist from "./multiselectlist"; import * as multiselectlist from "./multiselectlist";
import * as multilayerselectree from "./multilayerselecttree"; import * as multilayerselectree from "./multilayerselecttree";
@ -52,7 +54,9 @@ Object.assign(BI, {
NumberEditor, NumberEditor,
NumberInterval, NumberInterval,
YearInterval, YearInterval,
YearMonthInterval,
YearQuarterInterval, YearQuarterInterval,
...yearmonth,
...multiselect, ...multiselect,
...multiselectlist, ...multiselectlist,
...multilayerselectree, ...multilayerselectree,
@ -70,6 +74,7 @@ export * from "./datetimepane";
export * from "./dynamicdatetime"; export * from "./dynamicdatetime";
export * from "./time"; export * from "./time";
export * from "./editor"; export * from "./editor";
export * from "./yearmonth";
export * from "./multiselect"; export * from "./multiselect";
export * from "./multiselectlist"; export * from "./multiselectlist";
export * from "./downlist"; export * from "./downlist";
@ -93,5 +98,6 @@ export {
MultiTreeInsertCombo, MultiTreeInsertCombo,
MultiTreeListCombo, MultiTreeListCombo,
YearInterval, YearInterval,
YearMonthInterval,
YearQuarterInterval YearQuarterInterval
}; };

288
src/widget/yearmonth/card.dynamic.yearmonth.js
Unescape View File

@ -1,166 +1,212 @@
/** import {
* 年月展示面板 shortcut,
* Widget,
* Created by GUY on 2015/9/2. i18nText,
* @class BI.YearCard bind,
* @extends BI.Trigger VerticalLayout,
*/ parseDateTime,
BI.DynamicYearMonthCard = BI.inherit(BI.Widget, { extend,
checkDateVoid,
props: { isNotEmptyString
baseCls: "bi-year-month-card" } from "@/core";
}, import { DynamicDateCard, DynamicDateParamItem, DynamicDateHelper } from "../dynamicdate";
import { Label, Bubbles } from "@/base";
render: function () {
var self = this; @shortcut()
export class DynamicYearMonthCard extends Widget {
static xtype = "bi.dynamic_year_month_card";
static EVENT_CHANGE = "EVENT_CHANGE";
props = { baseCls: "bi-year-month-card" };
render() {
return { return {
type: "bi.vertical", type: VerticalLayout.xtype,
items: [{ items: [
type: "bi.label", {
text: BI.i18nText("BI-Multi_Date_Relative_Current_Time"), type: Label.xtype,
textAlign: "left", text: i18nText("BI-Multi_Date_Relative_Current_Time"),
height: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT, textAlign: "left",
}, { height: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT,
type: "bi.vertical",
ref: function (_ref) {
self.wrapper = _ref;
}, },
items: [{ {
el: { type: VerticalLayout.xtype,
type: "bi.dynamic_date_param_item", ref: _ref => {
validationChecker: BI.bind(self._checkDate, self), this.wrapper = _ref;
ref: function () {
self.year = this;
},
listeners: [{
eventName: "EVENT_CHANGE",
action: function () {
self.fireEvent("EVENT_CHANGE");
}
}, {
eventName: "EVENT_INPUT_CHANGE",
action: function () {
BI.Bubbles.hide("dynamic-year-month-error");
}
}]
},
bgap: 10,
}, {
type: "bi.dynamic_date_param_item",
dateType: BI.DynamicDateCard.TYPE.MONTH,
ref: function () {
self.month = this;
}, },
listeners: [{ items: [
eventName: "EVENT_CHANGE", {
action: function () { el: {
self.fireEvent("EVENT_CHANGE"); type: DynamicDateParamItem.xtype,
} validationChecker: bind(this._checkDate, this),
}, { ref: _ref => {
eventName: "EVENT_INPUT_CHANGE", this.year = _ref;
action: function () { },
BI.Bubbles.hide("dynamic-year-month-error"); listeners: [
{
eventName: "EVENT_CHANGE",
action: () => {
this.fireEvent("EVENT_CHANGE");
},
},
{
eventName: "EVENT_INPUT_CHANGE",
action: () => {
Bubbles.hide(
"dynamic-year-month-error"
);
},
}
],
},
bgap: 10,
},
{
type: DynamicDateParamItem.xtype,
dateType: DynamicDateCard.TYPE.MONTH,
ref: _ref => {
this.month = _ref;
},
listeners: [
{
eventName: "EVENT_CHANGE",
action: () => {
this.fireEvent("EVENT_CHANGE");
},
},
{
eventName: "EVENT_INPUT_CHANGE",
action: () => {
Bubbles.hide(
"dynamic-year-month-error"
);
},
}
],
} }
}] ],
}] }
}], ],
vgap: 10, vgap: 10,
hgap: 10 hgap: 10,
}; };
}, }
_getErrorText() {
const o = this.options;
const start = parseDateTime(o.min, "%Y-%X-%d");
const end = parseDateTime(o.max, "%Y-%X-%d");
_getErrorText: function () { return i18nText(
var o = this.options; "BI-Basic_Year_Month_Range_Error",
var start = BI.parseDateTime(o.min, "%Y-%X-%d");
var end = BI.parseDateTime(o.max, "%Y-%X-%d");
return BI.i18nText("BI-Basic_Year_Month_Range_Error",
start.getFullYear(), start.getFullYear(),
start.getMonth() + 1, start.getMonth() + 1,
end.getFullYear(), end.getFullYear(),
end.getMonth() + 1 end.getMonth() + 1
); );
}, }
_checkDate: function (obj) { _checkDate(obj) {
var o = this.options; const o = this.options;
var date = BI.DynamicDateHelper.getCalculation(BI.extend(this._getValue(), this._digestDateTypeValue(obj))); const date = DynamicDateHelper.getCalculation(
extend(this._getValue(), this._digestDateTypeValue(obj))
);
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];
}
_digestDateTypeValue: function (value) { _digestDateTypeValue(value) {
var valueMap = {}; const valueMap = {};
switch (value.dateType) { switch (value.dateType) {
case BI.DynamicDateCard.TYPE.YEAR: case DynamicDateCard.TYPE.YEAR:
valueMap.year = (value.offset === 0 ? -value.value : +value.value); valueMap.year =
break; value.offset === 0 ? -value.value : +value.value;
case BI.DynamicDateCard.TYPE.MONTH: break;
valueMap.month = (value.offset === 0 ? -value.value : +value.value); case DynamicDateCard.TYPE.MONTH:
break; valueMap.month =
default: value.offset === 0 ? -value.value : +value.value;
break; break;
default:
break;
} }
return valueMap; return valueMap;
}, }
_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,
}; };
}, }
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, month: 0}; v = v || { year: 0, month: 0 };
this.year.setValue(this._createValue(BI.DynamicDateCard.TYPE.YEAR, v.year)); this.year.setValue(
this.month.setValue(this._createValue(BI.DynamicDateCard.TYPE.MONTH, v.month)); this._createValue(DynamicDateCard.TYPE.YEAR, v.year)
}, );
this.month.setValue(
this._createValue(DynamicDateCard.TYPE.MONTH, v.month)
);
}
_getValue: function () { _getValue() {
var year = this.year.getValue(); const year = this.year.getValue();
var month = this.month.getValue(); const month = this.month.getValue();
return { return {
year: (year.offset === 0 ? -year.value : year.value), year: year.offset === 0 ? -year.value : year.value,
month: (month.offset === 0 ? -month.value : month.value) month: month.offset === 0 ? -month.value : month.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 yearInvalid = !this.year.checkValidation(); const yearInvalid = !this.year.checkValidation();
var monthInvalid = !this.month.checkValidation(); const monthInvalid = !this.month.checkValidation();
var invalid = yearInvalid || monthInvalid; let invalid = yearInvalid || monthInvalid;
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-month-error", errorText, this.wrapper); invalid &&
show &&
Bubbles.show(
"dynamic-year-month-error",
errorText,
this.wrapper
);
return !invalid; return !invalid;
}, }
}); }
BI.DynamicYearMonthCard.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.dynamic_year_month_card", BI.DynamicYearMonthCard);

274
src/widget/yearmonth/card.static.yearmonth.js
Unescape View File

@ -1,171 +1,215 @@
BI.StaticYearMonthCard = BI.inherit(BI.Widget, { import {
shortcut,
Widget,
chunk,
map,
toPix,
extend,
VerticalLayout,
CenterAdaptLayout,
parseDateTime,
each,
checkDateVoid,
contains,
getDate,
parseInt
} from "@/core";
import { TextItem, ButtonGroup } from "@/base";
import { YearPicker } from "../date/calendar";
props: { @shortcut()
baseCls: "bi-static-year-month-card", export class StaticYearMonthCard extends Widget {
behaviors: {} static xtype = "bi.static_year_month_card";
},
_createMonths: function () { static EVENT_CHANGE = "EVENT_CHANGE";
var self = this;
props = { baseCls: "bi-static-year-month-card", behaviors: {} };
_createMonths() {
// 纵向排列月 // 纵向排列月
var month = [1, 7, 2, 8, 3, 9, 4, 10, 5, 11, 6, 12]; const month = [1, 7, 2, 8, 3, 9, 4, 10, 5, 11, 6, 12];
var items = BI.chunk(month, 2); const items = chunk(month, 2);
return BI.map(items, function (i, item) {
return BI.map(item, function (j, td) { return map(items, (i, item) => map(item, (j, td) => {
return { return {
type: "bi.text_item", type: TextItem.xtype,
cls: "bi-list-item-select", cls: "bi-list-item-select",
textAlign: "center", textAlign: "center",
whiteSpace: "nowrap", whiteSpace: "nowrap",
once: false, once: false,
forceSelected: true, forceSelected: true,
height: BI.toPix(BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT, 1), height: toPix(BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT, 1),
width: 38, width: 38,
value: td, value: td,
text: td, text: td,
ref: function (_ref) { ref: _ref => {
self.monthMap[j === 0 ? i : i + 6] = _ref; this.monthMap[j === 0 ? i : i + 6] = _ref;
} },
}; };
}); }));
}); }
},
render: function () { render() {
var self = this, o = this.options; const o = this.options;
this.monthMap = {}; this.monthMap = {};
return { return {
type: "bi.vertical", type: VerticalLayout.xtype,
items: [{ items: [
type: "bi.year_picker", {
cls: "bi-split-bottom", type: YearPicker.xtype,
min: o.min, cls: "bi-split-bottom",
max: o.max, min: o.min,
ref: function () { max: o.max,
self.yearPicker = this; ref: _ref => {
}, this.yearPicker = _ref;
behaviors: o.behaviors,
height: 30,
listeners: [{
eventName: BI.YearPicker.EVENT_CHANGE,
action: function () {
var value = this.getValue();
self._checkMonthStatus(value);
self._setYear(value);
}
}]
}, {
el: {
type: "bi.button_group",
behaviors: o.behaviors,
ref: function () {
self.month = this;
}, },
items: this._createMonths(), behaviors: o.behaviors,
layouts: [BI.LogicFactory.createLogic("table", BI.extend({ height: 30,
dynamic: true listeners: [
}, { {
columns: 2, eventName: YearPicker.EVENT_CHANGE,
rows: 6, action: () => {
columnSize: [1 / 2, 1 / 2], const value = this.yearPicker.getValue();
rowSize: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT + 1 this._checkMonthStatus(value);
})), { this._setYear(value);
type: "bi.center_adapt", },
vgap: 1,
hgap: 2
}],
value: o.value,
listeners: [{
eventName: BI.ButtonGroup.EVENT_CHANGE,
action: function () {
self.selectedYear = self.yearPicker.getValue();
self.selectedMonth = this.getValue()[0];
self.fireEvent(BI.StaticYearMonthCard.EVENT_CHANGE);
} }
}] ],
}, },
vgap: 5 {
}] el: {
type: ButtonGroup.xtype,
behaviors: o.behaviors,
ref: _ref => {
this.month = _ref;
},
items: this._createMonths(),
layouts: [
BI.LogicFactory.createLogic(
"table",
extend(
{
dynamic: true,
},
{
columns: 2,
rows: 6,
columnSize: [1 / 2, 1 / 2],
rowSize:
BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT +
1,
}
)
),
{
type: CenterAdaptLayout.xtype,
vgap: 1,
hgap: 2,
}
],
value: o.value,
listeners: [
{
eventName: ButtonGroup.EVENT_CHANGE,
action: () => {
this.selectedYear = this.yearPicker.getValue();
this.selectedMonth = this.month.getValue()[0];
this.fireEvent(
StaticYearMonthCard.EVENT_CHANGE
);
},
}
],
},
vgap: 5,
}
],
}; };
}, }
created: function() { created() {
this._checkMonthStatus(this.selectedYear); this._checkMonthStatus(this.selectedYear);
}, }
_checkMonthStatus: function (year) { _checkMonthStatus(year) {
var o = this.options; const o = this.options;
var minDate = BI.parseDateTime(o.min, "%Y-%X-%d"), maxDate = BI.parseDateTime(o.max, "%Y-%X-%d"); const minDate = parseDateTime(o.min, "%Y-%X-%d"),
var minYear = minDate.getFullYear(), maxYear = maxDate.getFullYear(); maxDate = parseDateTime(o.max, "%Y-%X-%d");
var minMonth = 0; const minYear = minDate.getFullYear(),
var maxMonth = 11; maxYear = maxDate.getFullYear();
let minMonth = 0;
let maxMonth = 11;
minYear === year && (minMonth = minDate.getMonth()); minYear === year && (minMonth = minDate.getMonth());
maxYear === year && (maxMonth = maxDate.getMonth()); maxYear === year && (maxMonth = maxDate.getMonth());
var yearInvalid = year < minYear || year > maxYear; const yearInvalid = year < minYear || year > maxYear;
BI.each(this.monthMap, function (month, obj) { each(this.monthMap, (month, obj) => {
var monthInvalid = month < minMonth || month > maxMonth; const monthInvalid = month < minMonth || month > maxMonth;
obj.setEnable(!yearInvalid && !monthInvalid); obj.setEnable(!yearInvalid && !monthInvalid);
}); });
}, }
_setYear: function (year) { _setYear(year) {
var o = this.options; const o = this.options;
var dateVoid = BI.checkDateVoid(year, this.selectedMonth, 1, o.min, o.max); const dateVoid = checkDateVoid(year, this.selectedMonth, 1, o.min, o.max);
// 在切换年的时候,如果月份不在区间内了,取消选中 // 在切换年的时候,如果月份不在区间内了,取消选中
if (BI.contains(["y", "m"], dateVoid[0])) { if (contains(["y", "m"], dateVoid[0])) {
this.selectedYear = year; this.selectedYear = year;
this.month.setValue(); this.month.setValue();
return; return;
} }
this.selectedYear = year; this.selectedYear = year;
this.month.setValue(this.selectedMonth); this.month.setValue(this.selectedMonth);
}, }
setMinDate: function (minDate) { setMinDate(minDate) {
if (this.options.min !== minDate) { if (this.options.min !== minDate) {
this.options.min = minDate; this.options.min = minDate;
this.yearPicker.setMinDate(minDate); this.yearPicker.setMinDate(minDate);
this._checkMonthStatus(this.selectedYear); this._checkMonthStatus(this.selectedYear);
} }
}, }
setMaxDate: function (maxDate) { setMaxDate(maxDate) {
if (this.options.max !== maxDate) { if (this.options.max !== maxDate) {
this.options.max = maxDate; this.options.max = maxDate;
this.yearPicker.setMaxDate(maxDate); this.yearPicker.setMaxDate(maxDate);
this._checkMonthStatus(this.selectedYear); this._checkMonthStatus(this.selectedYear);
} }
}, }
getValue: function () { getValue() {
return { return {
year: this.selectedYear, year: this.selectedYear,
month: this.selectedMonth month: this.selectedMonth,
}; };
}, }
setValue: function (obj) { setValue(obj) {
var o = this.options; const o = this.options;
var newObj = {}; const newObj = {};
newObj.year = obj.year || 0; newObj.year = obj.year || 0;
newObj.month = obj.month || 0; newObj.month = obj.month || 0;
if (newObj.year === 0 || newObj.month === 0 || BI.checkDateVoid(newObj.year, newObj.month, 1, o.min, o.max)[0]) { if (
var year = newObj.year || BI.getDate().getFullYear(); newObj.year === 0 ||
newObj.month === 0 ||
checkDateVoid(newObj.year, newObj.month, 1, o.min, o.max)[0]
) {
const year = newObj.year || getDate().getFullYear();
this.selectedYear = year; this.selectedYear = year;
this.selectedMonth = ""; this.selectedMonth = "";
this.yearPicker.setValue(year); this.yearPicker.setValue(year);
this.month.setValue(); this.month.setValue();
} else { } else {
this.selectedYear = BI.parseInt(newObj.year); this.selectedYear = parseInt(newObj.year);
this.selectedMonth = BI.parseInt(newObj.month); this.selectedMonth = parseInt(newObj.month);
this.yearPicker.setValue(this.selectedYear); this.yearPicker.setValue(this.selectedYear);
this.month.setValue(this.selectedMonth); this.month.setValue(this.selectedMonth);
} }
this._checkMonthStatus(this.selectedYear); this._checkMonthStatus(this.selectedYear);
} }
}); }
BI.StaticYearMonthCard.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.static_year_month_card", BI.StaticYearMonthCard);

342
src/widget/yearmonth/combo.yearmonth.js
Unescape View File

@ -1,69 +1,98 @@
BI.DynamicYearMonthCombo = BI.inherit(BI.Single, { import {
shortcut,
createWidget,
toPix,
isEqual,
isNotEmptyString,
getDate,
AbsoluteLayout,
HorizontalFillLayout,
isNotNull,
isNotEmptyObject,
checkDateVoid
} from "@/core";
import { Single, Combo, IconButton } from "@/base";
import { DynamicYearMonthTrigger } from "./trigger.yearmonth";
import { DynamicYearMonthPopup } from "./popup.yearmonth";
import { DynamicDateCombo } from "../dynamicdate";
props: { @shortcut()
export class DynamicYearMonthCombo extends Single {
static xtype = "bi.dynamic_year_month_combo";
static EVENT_ERROR = "EVENT_ERROR";
static EVENT_VALID = "EVENT_VALID";
static EVENT_FOCUS = "EVENT_FOCUS";
static EVENT_CONFIRM = "EVENT_CONFIRM";
static EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";
static Static = 1;
static Dynamic = 2;
props = {
baseCls: "bi-year-month-combo", baseCls: "bi-year-month-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,
isNeedAdjustHeight: false, isNeedAdjustHeight: false,
isNeedAdjustWidth: false isNeedAdjustWidth: false,
}, };
_init: function () { _init() {
var self = this, o = this.options; const o = this.options;
BI.DynamicYearMonthCombo.superclass._init.apply(this, arguments); super._init(...arguments);
this.storeValue = o.value; this.storeValue = o.value;
this.storeTriggerValue = ""; this.storeTriggerValue = "";
var border = o.simple ? 1 : 2; const border = o.simple ? 1 : 2;
this.trigger = BI.createWidget({ this.trigger = createWidget({
type: "bi.dynamic_year_month_trigger", type: "bi.dynamic_year_month_trigger",
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.DynamicYearMonthTrigger.EVENT_KEY_DOWN, function () { this.trigger.on(DynamicYearMonthTrigger.EVENT_KEY_DOWN, () => {
self.combo.isViewVisible() && self.combo.hideView(); this.combo.isViewVisible() && this.combo.hideView();
}); });
this.trigger.on(BI.DynamicYearMonthTrigger.EVENT_START, function () { this.trigger.on(DynamicYearMonthTrigger.EVENT_START, () => {
self.combo.isViewVisible() && self.combo.hideView(); this.combo.isViewVisible() && this.combo.hideView();
}); });
this.trigger.on(BI.DynamicYearMonthTrigger.EVENT_STOP, function () { this.trigger.on(DynamicYearMonthTrigger.EVENT_STOP, () => {
self.combo.showView(); this.combo.showView();
}); });
this.trigger.on(BI.DynamicYearMonthTrigger.EVENT_ERROR, function () { this.trigger.on(DynamicYearMonthTrigger.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.DynamicYearMonthCombo.EVENT_ERROR); this.fireEvent(DynamicYearMonthCombo.EVENT_ERROR);
}); });
this.trigger.on(BI.DynamicYearMonthTrigger.EVENT_VALID, function () { this.trigger.on(DynamicYearMonthTrigger.EVENT_VALID, () => {
self.comboWrapper.element.removeClass("error"); this.comboWrapper.element.removeClass("error");
self.fireEvent(BI.DynamicYearMonthCombo.EVENT_VALID); this.fireEvent(DynamicYearMonthCombo.EVENT_VALID);
}); });
this.trigger.on(BI.DynamicYearMonthTrigger.EVENT_CONFIRM, function () { this.trigger.on(DynamicYearMonthTrigger.EVENT_CONFIRM, () => {
var dateStore = self.storeTriggerValue; const dateStore = this.storeTriggerValue;
var dateObj = self.trigger.getKey(); const dateObj = this.trigger.getKey();
if (BI.isEqual(dateObj, dateStore)) { if (isEqual(dateObj, dateStore)) {
return; return;
} }
if (BI.isNotEmptyString(dateObj) && !BI.isEqual(dateObj, dateStore)) { if (isNotEmptyString(dateObj) && !isEqual(dateObj, dateStore)) {
self.storeValue = self.trigger.getValue(); this.storeValue = this.trigger.getValue();
self.setValue(self.trigger.getValue()); this.setValue(this.trigger.getValue());
} }
self._checkDynamicValue(self.storeValue); this._checkDynamicValue(this.storeValue);
self.fireEvent(BI.DynamicYearMonthCombo.EVENT_CONFIRM); this.fireEvent(DynamicYearMonthCombo.EVENT_CONFIRM);
}); });
this.trigger.on(BI.DynamicYearMonthTrigger.EVENT_FOCUS, function () { this.trigger.on(DynamicYearMonthTrigger.EVENT_FOCUS, () => {
self.storeTriggerValue = self.trigger.getKey(); this.storeTriggerValue = this.trigger.getKey();
self.fireEvent(BI.DynamicYearMonthCombo.EVENT_FOCUS); this.fireEvent(DynamicYearMonthCombo.EVENT_FOCUS);
}); });
this.combo = BI.createWidget({ this.combo = createWidget({
type: "bi.combo", type: Combo.xtype,
container: o.container, container: o.container,
isNeedAdjustHeight: o.isNeedAdjustHeight, isNeedAdjustHeight: o.isNeedAdjustHeight,
isNeedAdjustWidth: o.isNeedAdjustWidth, isNeedAdjustWidth: o.isNeedAdjustWidth,
@ -77,172 +106,185 @@ BI.DynamicYearMonthCombo = BI.inherit(BI.Single, {
type: "bi.dynamic_year_month_popup", type: "bi.dynamic_year_month_popup",
width: o.isNeedAdjustWidth ? o.width : undefined, width: o.isNeedAdjustWidth ? o.width : undefined,
supportDynamic: o.supportDynamic, supportDynamic: o.supportDynamic,
ref: function () { ref: _ref => {
self.popup = this; this.popup = _ref;
}, },
listeners: [ listeners: [
{ {
eventName: BI.DynamicYearMonthPopup.EVENT_CHANGE, eventName: DynamicYearMonthPopup.EVENT_CHANGE,
action: function () { action: () => {
self.setValue(self.popup.getValue()); this.setValue(this.popup.getValue());
self.combo.hideView(); this.combo.hideView();
self.fireEvent(BI.DynamicYearMonthCombo.EVENT_CONFIRM); this.fireEvent(
} DynamicYearMonthCombo.EVENT_CONFIRM
}, { );
eventName: BI.DynamicYearMonthPopup.BUTTON_CLEAR_EVENT_CHANGE, },
action: function () { },
self.setValue(); {
self.comboWrapper.element.removeClass("error"); eventName:
self.combo.hideView(); DynamicYearMonthPopup.BUTTON_CLEAR_EVENT_CHANGE,
self.fireEvent(BI.DynamicYearMonthCombo.EVENT_CONFIRM); action: () => {
} this.setValue();
}, { this.comboWrapper.element.removeClass("error");
eventName: BI.DynamicYearMonthPopup.BUTTON_lABEL_EVENT_CHANGE, this.combo.hideView();
action: function () { this.fireEvent(
var date = BI.getDate(); DynamicYearMonthCombo.EVENT_CONFIRM
self.setValue({ );
type: BI.DynamicYearMonthCombo.Static, },
value: { year: date.getFullYear(), month: date.getMonth() + 1 } },
{
eventName:
DynamicYearMonthPopup.BUTTON_lABEL_EVENT_CHANGE,
action: () => {
const date = getDate();
this.setValue({
type: DynamicYearMonthCombo.Static,
value: {
year: date.getFullYear(),
month: date.getMonth() + 1,
},
}); });
self.combo.hideView(); this.combo.hideView();
self.fireEvent(BI.DynamicDateCombo.EVENT_CONFIRM); this.fireEvent(DynamicDateCombo.EVENT_CONFIRM);
} },
}, { },
eventName: BI.DynamicYearMonthPopup.BUTTON_OK_EVENT_CHANGE, {
action: function () { eventName:
var value = self.popup.getValue(); DynamicYearMonthPopup.BUTTON_OK_EVENT_CHANGE,
if (self._checkValue(value)) { action: () => {
self.setValue(value); const value = this.popup.getValue();
if (this._checkValue(value)) {
this.setValue(value);
} }
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.DynamicYearMonthCombo.EVENT_BEFORE_POPUPVIEW); this.fireEvent(DynamicYearMonthCombo.EVENT_BEFORE_POPUPVIEW);
}); });
BI.createWidget({ 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:
ref: function () { `${o.simple
self.comboWrapper = this; ? "bi-border-bottom"
: "bi-border bi-border-radius"
} bi-focus-shadow`,
ref: _ref => {
this.comboWrapper = _ref;
}, },
items: [ items: [
{ {
el: { el: {
type: "bi.icon_button", type: IconButton.xtype,
cls: "bi-trigger-icon-button date-change-h-font", cls: "bi-trigger-icon-button date-change-h-font",
width: BI.toPix(o.height, border), width: toPix(o.height, border),
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.DynamicYearMonthCombo.Dynamic: case DynamicYearMonthCombo.Dynamic:
this.changeIcon.setVisible(true); this.changeIcon.setVisible(true);
break; break;
default: default:
this.changeIcon.setVisible(false); this.changeIcon.setVisible(false);
break; break;
} }
}, }
_checkValue: function (v) { _checkValue(v) {
var o = this.options; const o = this.options;
switch (v.type) { switch (v.type) {
case BI.DynamicDateCombo.Dynamic: case DynamicDateCombo.Dynamic:
return BI.isNotEmptyObject(v.value); return isNotEmptyObject(v.value);
case BI.DynamicDateCombo.Static: case DynamicDateCombo.Static: {
var value = v.value || {}; const value = v.value || {};
return !BI.checkDateVoid(value.year, value.month, 1, o.minDate, o.maxDate)[0]; return !checkDateVoid(
default: value.year,
return true; value.month,
1,
o.minDate,
o.maxDate
)[0];
} }
}, default:
return true;
}
}
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();
}, }
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;
}, }
getKey: function () { getKey() {
return this.trigger.getKey(); return this.trigger.getKey();
}, }
isStateValid: function () { isStateValid() {
return this.trigger.isStateValid(); return this.trigger.isStateValid();
} }
}
});
BI.DynamicYearMonthCombo.EVENT_ERROR = "EVENT_ERROR";
BI.DynamicYearMonthCombo.EVENT_VALID = "EVENT_VALID";
BI.DynamicYearMonthCombo.EVENT_FOCUS = "EVENT_FOCUS";
BI.DynamicYearMonthCombo.EVENT_CONFIRM = "EVENT_CONFIRM";
BI.DynamicYearMonthCombo.EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";
BI.shortcut("bi.dynamic_year_month_combo", BI.DynamicYearMonthCombo);
BI.extend(BI.DynamicYearMonthCombo, {
Static: 1,
Dynamic: 2
});

5
src/widget/yearmonth/index.js
Unescape View File

@ -0,0 +1,5 @@
export { DynamicYearMonthCard } from "./card.dynamic.yearmonth";
export { StaticYearMonthCard } from "./card.static.yearmonth";
export { DynamicYearMonthCombo } from "./combo.yearmonth";
export { DynamicYearMonthPopup } from "./popup.yearmonth";
export { DynamicYearMonthTrigger } from "./trigger.yearmonth";

444
src/widget/yearmonth/popup.yearmonth.js
Unescape View File

@ -1,241 +1,329 @@
/** import {
* 年月 shortcut,
* Widget,
* Created by GUY on 2015/9/2. toPix,
* @class BI.DynamicYearMonthPopup i18nText,
* @extends BI.Trigger VerticalLayout,
*/ GridLayout,
BI.DynamicYearMonthPopup = BI.inherit(BI.Widget, { print,
constants: { getDate,
tabHeight: 40, checkDateVoid,
}, createItems
} from "@/core";
import { DynamicYearMonthCombo } from "./combo.yearmonth";
import { TextButton, Tab } from "@/base";
import { DynamicDateCombo, DynamicDateHelper } from "../dynamicdate";
// import { DynamicYearCombo } from "../year/combo.year";
import { StaticYearMonthCard } from "./card.static.yearmonth";
import { LinearSegment } from "@/case";
import { DynamicYearMonthCard } from "./card.dynamic.yearmonth";
props: { @shortcut()
export class DynamicYearMonthPopup extends Widget {
static xtype = "bi.dynamic_year_month_popup";
constants = { tabHeight: 40 };
props = {
baseCls: "bi-year-month-popup", baseCls: "bi-year-month-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,
}, };
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: DynamicYearMonthCombo.Static };
this.storeValue = {type: BI.DynamicYearMonthCombo.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.DynamicYearMonthPopup.BUTTON_CLEAR_EVENT_CHANGE);
}
}]
}, {
type: "bi.text_button",
cls: "bi-split-left bi-split-right bi-high-light bi-split-top",
textHeight: BI.toPix(BI.SIZE_CONSANTS.TOOL_BAR_HEIGHT, 1),
shadow: true,
text: BI.i18nText("BI-Basic_Current_Month"),
disabled: this._checkTodayValid(),
ref: function () {
self.textButton = this;
},
listeners: [{
eventName: BI.TextButton.EVENT_CHANGE,
action: function () {
self.fireEvent(BI.DynamicYearMonthPopup.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.DynamicYearMonthPopup.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(
DynamicYearMonthPopup.BUTTON_CLEAR_EVENT_CHANGE
);
},
}
],
},
{
type: TextButton.xtype,
cls: "bi-split-left bi-split-right bi-high-light bi-split-top",
textHeight: toPix(
BI.SIZE_CONSANTS.TOOL_BAR_HEIGHT,
1
),
shadow: true,
text: i18nText("BI-Basic_Current_Month"),
disabled: this._checkTodayValid(),
ref: _ref => {
this.textButton = _ref;
},
listeners: [
{
eventName: TextButton.EVENT_CHANGE,
action: () => {
this.fireEvent(
DynamicYearMonthPopup.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(
DynamicYearMonthPopup.BUTTON_OK_EVENT_CHANGE
);
} else {
this.fireEvent(
DynamicYearMonthPopup.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.textButton.setValue(BI.i18nText("BI-Basic_Current_Month")); this.textButton.setValue(i18nText("BI-Basic_Current_Month"));
this.textButton.setEnable(!this._checkTodayValid()); this.textButton.setEnable(!this._checkTodayValid());
} else { } else {
var date = BI.DynamicDateHelper.getCalculation(this.dynamicPane.getInputValue()); let date = DynamicDateHelper.getCalculation(
date = BI.print(date, "%Y-%x"); this.dynamicPane.getInputValue()
);
date = print(date, "%Y-%x");
this.textButton.setValue(date); this.textButton.setValue(date);
this.textButton.setEnable(false); this.textButton.setEnable(false);
} }
}, }
_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];
}
_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,
cls: "bi-split-bottom", cls: "bi-split-bottom",
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_Month"), [
value: BI.DynamicYearCombo.Static {
}, { text: i18nText("BI-Basic_Year_Month"),
text: BI.i18nText("BI-Basic_Dynamic_Title"), value: BI.DynamicYearCombo.Static,
value: BI.DynamicYearCombo.Dynamic },
}], { {
textAlign: "center" text: i18nText("BI-Basic_Dynamic_Title"),
}) value: BI.DynamicYearCombo.Dynamic,
}
],
{
textAlign: "center",
}
),
}, },
cardCreator: function (v) { cardCreator: v => {
switch (v) { switch (v) {
case BI.DynamicYearCombo.Dynamic: case BI.DynamicYearCombo.Dynamic:
return { return {
type: "bi.dynamic_year_month_card", type: DynamicYearMonthCard.xtype,
cls: "dynamic-year-month-pane", cls: "dynamic-year-month-pane",
min: self.options.min, min: this.options.min,
max: self.options.max, max: this.options.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_month_card", };
behaviors: o.behaviors, case BI.DynamicYearCombo.Static:
min: self.options.min, default:
max: self.options.max, return {
listeners: [{ type: StaticYearMonthCard.xtype,
eventName: BI.StaticYearMonthCard.EVENT_CHANGE, behaviors: o.behaviors,
action: function () { min: this.options.min,
self.fireEvent(BI.DynamicYearMonthPopup.EVENT_CHANGE); max: this.options.max,
} listeners: [
}], {
ref: function () { eventName: StaticYearMonthCard.EVENT_CHANGE,
self.year = this; action: () => {
this.fireEvent(
DynamicYearMonthPopup.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 BI.DynamicYearCombo.Static: {
self.year.setValue({year: date.getFullYear(), month: date.getMonth() + 1}); const date = DynamicDateHelper.getCalculation(
self._setInnerValue(); this.dynamicPane.getValue()
);
this.year.setValue({
year: date.getFullYear(),
month: date.getMonth() + 1,
});
this._setInnerValue();
break; break;
}
case BI.DynamicYearCombo.Dynamic: case BI.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({ BI.DynamicYearCombo.Dynamic
year: 0 ) {
this.dynamicPane.setValue(
this.storeValue.value
);
} else {
this.dynamicPane.setValue({
year: 0,
}); });
} }
self._setInnerValue(); this._setInnerValue();
break; break;
} }
},
} }
}] ],
}; };
}, }
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.textButton.setValue(BI.i18nText("BI-Basic_Current_Month")); this.textButton.setValue(i18nText("BI-Basic_Current_Month"));
this.textButton.setEnable(!this._checkTodayValid()); this.textButton.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.DynamicYearMonthPopup.BUTTON_CLEAR_EVENT_CHANGE = "BUTTON_CLEAR_EVENT_CHANGE";
BI.DynamicYearMonthPopup.BUTTON_lABEL_EVENT_CHANGE = "BUTTON_lABEL_EVENT_CHANGE";
BI.DynamicYearMonthPopup.BUTTON_OK_EVENT_CHANGE = "BUTTON_OK_EVENT_CHANGE";
BI.DynamicYearMonthPopup.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.dynamic_year_month_popup", BI.DynamicYearMonthPopup);

481
src/widget/yearmonth/trigger.yearmonth.js
Unescape View File

@ -1,101 +1,174 @@
BI.DynamicYearMonthTrigger = BI.inherit(BI.Trigger, { import {
_const: { shortcut,
hgap: 4, bind,
vgap: 2, createWidget,
iconWidth: 24 i18nText,
}, HTapeLayout,
CenterLayout,
HorizontalFillLayout,
isEmptyString,
parseDateTime,
isPositiveInteger,
checkDateVoid,
isNotEmptyString,
getDate,
print,
isNotNull,
checkDateLegal,
parseInt,
isNull
} from "@/core";
import { Trigger, TextButton } from "@/base";
import { TriggerIconButton, SignEditor } from "@/case";
import { DynamicDateCombo, DynamicDateHelper } from "../dynamicdate";
props: () => ({ @shortcut()
extraCls: "bi-year-month-trigger", export class DynamicYearMonthTrigger extends Trigger {
min: "1900-01-01", // 最小日期 static xtype = "bi.dynamic_year_month_trigger";
max: "2099-12-31", // 最大日期
height: 24,
watermark: {
year: BI.i18nText("BI-Basic_Unrestricted"),
month: BI.i18nText("BI-Basic_Unrestricted"),
},
}),
beforeInit: function (callback) { _const = { hgap: 4, vgap: 2, iconWidth: 24 };
var o = this.options;
o.title = BI.bind(this._titleCreator, this); static EVENT_VALID = "EVENT_VALID";
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_KEY_DOWN = "EVENT_KEY_DOWN";
props() {
return {
extraCls: "bi-year-month-trigger",
min: "1900-01-01", // 最小日期
max: "2099-12-31", // 最大日期
height: 24,
watermark: {
year: i18nText("BI-Basic_Unrestricted"),
month: i18nText("BI-Basic_Unrestricted"),
},
};
}
beforeInit(callback) {
const o = this.options;
o.title = bind(this._titleCreator, this);
callback(); callback();
}, }
_init: function () { _init() {
BI.DynamicYearMonthTrigger.superclass._init.apply(this, arguments); super._init(...arguments);
var o = this.options; const o = this.options;
this.yearEditor = this._createEditor(true); this.yearEditor = this._createEditor(true);
this.monthEditor = this._createEditor(false); this.monthEditor = this._createEditor(false);
BI.createWidget({ createWidget({
element: this, element: this,
type: "bi.htape", type: HTapeLayout.xtype,
items: [{ items: [
type: "bi.center", {
items: [{ type: CenterLayout.xtype,
type: "bi.horizontal_fill", items: [
columnSize: ["fill", ""], {
items: [this.yearEditor, { type: HorizontalFillLayout.xtype,
el: { columnSize: ["fill", ""],
type: "bi.text_button", items: [
text: BI.i18nText("BI-Multi_Date_Year"), this.yearEditor,
}, {
}] el: {
}, { type: TextButton.xtype,
type: "bi.horizontal_fill", text: i18nText("BI-Multi_Date_Year"),
columnSize: ["fill", ""], },
items: [this.monthEditor, { }
el: { ],
type: "bi.text_button",
text: BI.i18nText("BI-Multi_Date_Month"),
}, },
}] {
}] type: HorizontalFillLayout.xtype,
}, { columnSize: ["fill", ""],
el: { items: [
type: "bi.trigger_icon_button", this.monthEditor,
width: this._const.iconWidth {
el: {
type: TextButton.xtype,
text: i18nText("BI-Multi_Date_Month"),
},
}
],
}
],
}, },
width: this._const.iconWidth {
}] el: {
type: TriggerIconButton.xtype,
width: this._const.iconWidth,
},
width: this._const.iconWidth,
}
],
}); });
this.setValue(o.value); this.setValue(o.value);
}, }
_createEditor: function (isYear) { _createEditor(isYear) {
var self = this, o = this.options, c = this._const; const o = this.options,
var editor = BI.createWidget({ c = this._const;
type: "bi.sign_editor", const editor = createWidget({
type: SignEditor.xtype,
simple: o.simple, simple: o.simple,
height: o.height, height: o.height,
validationChecker: function (v) { validationChecker: v => {
if (isYear) { if (isYear) {
var month = self.monthEditor.getValue(); let month = this.monthEditor.getValue();
if(BI.isEmptyString(month)) { if (isEmptyString(month)) {
month = parseInt(v, 10) === BI.parseDateTime(o.min, "%Y-%X-%d").getFullYear() ? (BI.parseDateTime(o.min, "%Y-%X-%d").getMonth() + 1) : 1; month =
parseInt(v, 10) ===
parseDateTime(o.min, "%Y-%X-%d").getFullYear()
? parseDateTime(o.min, "%Y-%X-%d").getMonth() +
1
: 1;
} }
return v === "" || (BI.isPositiveInteger(v) && !BI.checkDateVoid(v, month, 1, o.min, o.max)[0]);
return (
v === "" ||
(isPositiveInteger(v) &&
!checkDateVoid(v, month, 1, o.min, o.max)[0])
);
} }
var year = self.yearEditor.getValue(); const year = this.yearEditor.getValue();
return v === "" || ((BI.isPositiveInteger(v) && v >= 1 && v <= 12) && (BI.isEmptyString(year) ? true : !BI.checkDateVoid(self.yearEditor.getValue(), v, 1, o.min, o.max)[0])); return (
}, v === "" ||
quitChecker: function () { (isPositiveInteger(v) &&
return false; v >= 1 &&
v <= 12 &&
(isEmptyString(year)
? true
: !checkDateVoid(
this.yearEditor.getValue(),
v,
1,
o.min,
o.max
)[0]))
);
}, },
quitChecker: () => false,
watermark: isYear ? o.watermark?.year : o.watermark.month, watermark: isYear ? o.watermark?.year : o.watermark.month,
errorText: function (v) { errorText: v => {
var year = isYear ? v : self.yearEditor.getValue(); const year = isYear ? v : this.yearEditor.getValue();
var month = isYear ? self.monthEditor.getValue() : v; const month = isYear ? this.monthEditor.getValue() : v;
if (!BI.isPositiveInteger(year) || !BI.isPositiveInteger(month) || month > 12) { if (
return BI.i18nText("BI-Year_Trigger_Invalid_Text"); !isPositiveInteger(year) ||
!isPositiveInteger(month) ||
month > 12
) {
return i18nText("BI-Year_Trigger_Invalid_Text");
} }
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_Month_Range_Error", return i18nText(
"BI-Basic_Year_Month_Range_Error",
start.getFullYear(), start.getFullYear(),
start.getMonth() + 1, start.getMonth() + 1,
end.getFullYear(), end.getFullYear(),
@ -104,192 +177,212 @@ BI.DynamicYearMonthTrigger = BI.inherit(BI.Trigger, {
}, },
hgap: c.hgap, hgap: c.hgap,
vgap: c.vgap, vgap: c.vgap,
allowBlank: true allowBlank: true,
}); });
editor.on(BI.SignEditor.EVENT_KEY_DOWN, function () { editor.on(SignEditor.EVENT_KEY_DOWN, () => {
self.fireEvent(BI.DynamicYearMonthTrigger.EVENT_KEY_DOWN); this.fireEvent(DynamicYearMonthTrigger.EVENT_KEY_DOWN);
}); });
editor.on(BI.SignEditor.EVENT_FOCUS, function () { editor.on(SignEditor.EVENT_FOCUS, () => {
self.fireEvent(BI.DynamicYearMonthTrigger.EVENT_FOCUS); this.fireEvent(DynamicYearMonthTrigger.EVENT_FOCUS);
}); });
editor.on(BI.SignEditor.EVENT_STOP, function () { editor.on(SignEditor.EVENT_STOP, () => {
self.fireEvent(BI.DynamicYearMonthTrigger.EVENT_STOP); this.fireEvent(DynamicYearMonthTrigger.EVENT_STOP);
}); });
editor.on(BI.SignEditor.EVENT_CONFIRM, function () { editor.on(SignEditor.EVENT_CONFIRM, () => {
self._doEditorConfirm(editor); this._doEditorConfirm(editor);
self.fireEvent(BI.DynamicYearMonthTrigger.EVENT_CONFIRM); this.fireEvent(DynamicYearMonthTrigger.EVENT_CONFIRM);
}); });
editor.on(BI.SignEditor.EVENT_SPACE, function () { editor.on(SignEditor.EVENT_SPACE, () => {
if (editor.isValid()) { if (editor.isValid()) {
editor.blur(); editor.blur();
} }
}); });
editor.on(BI.SignEditor.EVENT_START, function () { editor.on(SignEditor.EVENT_START, () => {
self.fireEvent(BI.DynamicYearMonthTrigger.EVENT_START); this.fireEvent(DynamicYearMonthTrigger.EVENT_START);
}); });
editor.on(BI.SignEditor.EVENT_ERROR, function () { editor.on(SignEditor.EVENT_ERROR, () => {
self.fireEvent(BI.DynamicYearMonthTrigger.EVENT_ERROR); this.fireEvent(DynamicYearMonthTrigger.EVENT_ERROR);
}); });
editor.on(BI.SignEditor.EVENT_VALID, function () { editor.on(SignEditor.EVENT_VALID, () => {
var year = self.yearEditor.getValue(); const year = this.yearEditor.getValue();
var month = self.monthEditor.getValue(); const month = this.monthEditor.getValue();
if(BI.isNotEmptyString(year) && BI.isNotEmptyString(month)) { if (isNotEmptyString(year) && isNotEmptyString(month)) {
if(BI.isPositiveInteger(year) && month >= 1 && month <= 12 && !BI.checkDateVoid(year, month, 1, o.min, o.max)[0]) { if (
self.fireEvent(BI.DynamicYearMonthTrigger.EVENT_VALID); isPositiveInteger(year) &&
month >= 1 &&
month <= 12 &&
!checkDateVoid(year, month, 1, o.min, o.max)[0]
) {
this.fireEvent(DynamicYearMonthTrigger.EVENT_VALID);
} }
} }
}); });
editor.on(BI.SignEditor.EVENT_CHANGE, function () { editor.on(SignEditor.EVENT_CHANGE, () => {
if(isYear) { if (isYear) {
self._autoSwitch(editor); this._autoSwitch(editor);
} }
}); });
return editor; return editor;
}, }
_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.monthEditor.isValid() || !this.yearEditor.isValid()) { if (!this.monthEditor.isValid() || !this.yearEditor.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-%x"); const dateStr = print(date, "%Y-%x");
return BI.isEmptyString(text) ? dateStr : (text + ":" + dateStr);
case BI.DynamicDateCombo.Static: return isEmptyString(text) ? dateStr : `${text}:${dateStr}`;
default: }
value = value || {}; case DynamicDateCombo.Static:
return this._getStaticTitle(value); default:
value = value || {};
return this._getStaticTitle(value);
} }
}, }
_doEditorConfirm: function (editor) { _doEditorConfirm(editor) {
var value = editor.getValue(); const value = editor.getValue();
if (BI.isNotNull(value)) { if (isNotNull(value)) {
editor.setValue(value); editor.setValue(value);
} }
var monthValue = this.monthEditor.getValue(); const monthValue = this.monthEditor.getValue();
this.storeValue = { this.storeValue = {
type: BI.DynamicDateCombo.Static, type: DynamicDateCombo.Static,
value: { value: {
year: this.yearEditor.getValue(), year: this.yearEditor.getValue(),
month: BI.isEmptyString(this.monthEditor.getValue()) ? "" : monthValue month: isEmptyString(this.monthEditor.getValue())
} ? ""
: monthValue,
},
}; };
}, }
_yearCheck: function (v) { _yearCheck(v) {
var date = BI.print(BI.parseDateTime(v, "%Y-%X-%d"), "%Y-%X-%d"); const date = print(parseDateTime(v, "%Y-%X-%d"), "%Y-%X-%d");
return BI.print(BI.parseDateTime(v, "%Y"), "%Y") === v && date >= this.options.min && date <= this.options.max;
}, return (
print(parseDateTime(v, "%Y"), "%Y") === v &&
date >= this.options.min &&
date <= this.options.max
);
}
_autoSwitch: function (editor) { _autoSwitch(editor) {
var v = editor.getValue(); const v = editor.getValue();
if (BI.isNotEmptyString(v) && BI.checkDateLegal(v)) { if (isNotEmptyString(v) && checkDateLegal(v)) {
if (v.length === 4 && this._yearCheck(v)) { if (v.length === 4 && this._yearCheck(v)) {
this._doEditorConfirm(editor); this._doEditorConfirm(editor);
this.fireEvent(BI.DynamicYearMonthTrigger.EVENT_CONFIRM); this.fireEvent(DynamicYearMonthTrigger.EVENT_CONFIRM);
this.monthEditor.focus(); this.monthEditor.focus();
} }
} }
}, }
_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"));
} }
if(BI.isNotNull(obj.month) && BI.parseInt(obj.month) !== 0) { if (isNotNull(obj.month) && parseInt(obj.month) !== 0) {
value += Math.abs(obj.month) + BI.i18nText("BI-Basic_Month") + (obj.month < 0 ? BI.i18nText("BI-Basic_Front") : BI.i18nText("BI-Basic_Behind")); value +=
Math.abs(obj.month) +
i18nText("BI-Basic_Month") +
(obj.month < 0
? i18nText("BI-Basic_Front")
: i18nText("BI-Basic_Behind"));
} }
return value; return value;
}, }
_setInnerValue: function (date, text) { _setInnerValue(date, text) {
this.yearEditor.setValue(date.getFullYear()); this.yearEditor.setValue(date.getFullYear());
this.monthEditor.setValue(date.getMonth() + 1); this.monthEditor.setValue(date.getMonth() + 1);
}, }
_getStaticTitle: function (value) { _getStaticTitle(value) {
value = value || {}; value = value || {};
var hasYear = !(BI.isNull(value.year) || BI.isEmptyString(value.year)); const hasYear = !(isNull(value.year) || isEmptyString(value.year));
var hasMonth = !(BI.isNull(value.month) || BI.isEmptyString(value.month)); const hasMonth = !(isNull(value.month) || isEmptyString(value.month));
switch ((hasYear << 1) | hasMonth) { switch ((hasYear << 1) | hasMonth) {
// !hasYear && !hasMonth // !hasYear && !hasMonth
case 0: case 0:
return ""; return "";
// !hasYear && hasMonth // !hasYear && hasMonth
case 1: case 1:
return value.month; return value.month;
// hasYear && !hasMonth // hasYear && !hasMonth
case 2: case 2:
return value.year; return value.year;
// hasYear && hasMonth // hasYear && hasMonth
case 3: case 3:
default: default:
return value.year + "-" + value.month; return `${value.year}-${value.month}`;
} }
}, }
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) {
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: {
var month = BI.isNull(value.month) ? null : value.month; value = value || {};
this.yearEditor.setValue(value.year); const month = isNull(value.month) ? null : value.month;
this.monthEditor.setValue(month); this.yearEditor.setValue(value.year);
break; this.monthEditor.setValue(month);
break;
}
} }
}, }
getValue: function () { getValue() {
return this.storeValue; return this.storeValue;
}, }
getKey: function () { getKey() {
return this.yearEditor.getValue() + "-" + this.monthEditor.getValue(); return `${this.yearEditor.getValue()}-${this.monthEditor.getValue()}`;
}, }
isStateValid: function () { isStateValid() {
return this.yearEditor.isValid() && this.monthEditor.isValid(); return this.yearEditor.isValid() && this.monthEditor.isValid();
} }
}); }
BI.DynamicYearMonthTrigger.EVENT_VALID = "EVENT_VALID";
BI.DynamicYearMonthTrigger.EVENT_FOCUS = "EVENT_FOCUS";
BI.DynamicYearMonthTrigger.EVENT_ERROR = "EVENT_ERROR";
BI.DynamicYearMonthTrigger.EVENT_START = "EVENT_START";
BI.DynamicYearMonthTrigger.EVENT_CONFIRM = "EVENT_CONFIRM";
BI.DynamicYearMonthTrigger.EVENT_STOP = "EVENT_STOP";
BI.DynamicYearMonthTrigger.EVENT_KEY_DOWN = "EVENT_KEY_DOWN";
BI.shortcut("bi.dynamic_year_month_trigger", BI.DynamicYearMonthTrigger);

309
src/widget/yearmonthinterval/yearmonthinterval.js
Unescape View File

@ -1,49 +1,74 @@
BI.YearMonthInterval = BI.inherit(BI.Single, { import {
constants: { shortcut,
HorizontalFillLayout,
createWidget,
i18nText,
print,
parseDateTime,
checkDateVoid,
isNotNull,
checkDateLegal
} from "@/core";
import { Single, Label, Bubbles } from "@/base";
import { DynamicYearMonthCombo } from "../yearmonth/combo.yearmonth";
@shortcut()
export class YearMonthInterval extends Single {
static xtype = "bi.year_month_interval";
static EVENT_VALID = "EVENT_VALID";
static EVENT_ERROR = "EVENT_ERROR";
static EVENT_CHANGE = "EVENT_CHANGE";
static EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";
constants = {
width: 25, width: 25,
lgap: 15, lgap: 15,
offset: -15, offset: -15,
timeErrorCls: "time-error" timeErrorCls: "time-error",
}, };
props = {
props: {
extraCls: "bi-year-month-interval", extraCls: "bi-year-month-interval",
minDate: "1900-01-01", minDate: "1900-01-01",
maxDate: "2099-12-31", maxDate: "2099-12-31",
supportDynamic: true, supportDynamic: true,
height: 24 height: 24,
}, };
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_month_combo", type: "bi.dynamic_year_month_combo",
supportDynamic: o.supportDynamic, supportDynamic: o.supportDynamic,
height: o.height, height: o.height,
@ -51,138 +76,168 @@ BI.YearMonthInterval = BI.inherit(BI.Single, {
maxDate: o.maxDate, maxDate: o.maxDate,
behaviors: o.behaviors, behaviors: o.behaviors,
value: v, value: v,
watermark: watermark, watermark,
listeners: [{ listeners: [
eventName: BI.DynamicYearMonthCombo.EVENT_BEFORE_POPUPVIEW, {
action: function () { eventName: DynamicYearMonthCombo.EVENT_BEFORE_POPUPVIEW,
self.fireEvent(BI.YearMonthInterval.EVENT_BEFORE_POPUPVIEW); action: () => {
this.fireEvent(
YearMonthInterval.EVENT_BEFORE_POPUPVIEW
);
},
} }
}] ],
}); });
combo.on(BI.DynamicYearMonthCombo.EVENT_ERROR, function () { combo.on(DynamicYearMonthCombo.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.YearMonthInterval.EVENT_ERROR); this.fireEvent(YearMonthInterval.EVENT_ERROR);
}); });
combo.on(BI.DynamicYearMonthCombo.EVENT_VALID, function () { combo.on(DynamicYearMonthCombo.EVENT_VALID, () => {
self._checkValid(); this._checkValid();
}); });
combo.on(BI.DynamicYearMonthCombo.EVENT_FOCUS, function () { combo.on(DynamicYearMonthCombo.EVENT_FOCUS, () => {
self._checkValid(); this._checkValid();
}); });
combo.on(BI.DynamicYearMonthCombo.EVENT_CONFIRM, function () { combo.on(DynamicYearMonthCombo.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.YearMonthInterval.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.YearMonthInterval.EVENT_CHANGE); this._setTitle(i18nText("BI-Time_Interval_Error_Text"));
this.element.addClass(this.constants.timeErrorCls);
this.fireEvent(YearMonthInterval.EVENT_ERROR);
} else {
this._clearTitle();
this.element.removeClass(this.constants.timeErrorCls);
this.fireEvent(YearMonthInterval.EVENT_CHANGE);
} }
}); });
return combo; return combo;
}, }
_dateCheck: function (date) {
return BI.print(BI.parseDateTime(date, "%Y-%x"), "%Y-%x") === date || BI.print(BI.parseDateTime(date, "%Y-%X"), "%Y-%X") === date;
},
_dateCheck(date) {
return (
print(parseDateTime(date, "%Y-%x"), "%Y-%x") === date ||
print(parseDateTime(date, "%Y-%X"), "%Y-%X") === date
);
}
// 判是否在最大最小之间 _checkVoid(obj) {
_checkVoid: function (obj) { const o = this.options;
var o = this.options;
return !BI.checkDateVoid(obj.year, obj.month, 1, o.minDate, o.maxDate)[0]; return !checkDateVoid(obj.year, obj.month, 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] || "") + "-" + (smallObj[1] || 1); smallDate4Check = `${smallObj[0] || ""}-${smallObj[1] || 1}`;
} }
var bigDate4Check = ""; let bigDate4Check = "";
if (BI.isNotNull(bigObj)) { if (isNotNull(bigObj)) {
bigDate4Check = (bigObj[0] || "") + "-" + (bigObj[1] || 1); bigDate4Check = `${bigObj[0] || ""}-${bigObj[1] || 1}`;
} }
return this._dateCheck(smallDate4Check) && BI.checkDateLegal(smallDate4Check) && this._checkVoid({ return (
year: smallObj[0], this._dateCheck(smallDate4Check) &&
month: smallObj[1] || 1, checkDateLegal(smallDate4Check) &&
day: 1 this._checkVoid({
}) && this._dateCheck(bigDate4Check) && BI.checkDateLegal(bigDate4Check) && this._checkVoid({ year: smallObj[0],
year: bigObj[0], month: smallObj[1] || 1,
month: bigObj[1] || 1, 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-%X"), "%Y-%X"); month: bigObj[1] || 1,
bigDate = BI.print(BI.parseDateTime(bigDate, "%Y-%X"), "%Y-%X"); day: 1,
return BI.isNotNull(smallDate) && BI.isNotNull(bigDate) && smallDate > bigDate; })
}, );
_setTitle: function (v) { }
_compare(smallDate, bigDate) {
smallDate = print(parseDateTime(smallDate, "%Y-%X"), "%Y-%X");
bigDate = print(parseDateTime(bigDate, "%Y-%X"), "%Y-%X");
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.YearMonthInterval.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(YearMonthInterval.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.YearMonthInterval.EVENT_VALID = "EVENT_VALID"; getValue() {
BI.YearMonthInterval.EVENT_ERROR = "EVENT_ERROR"; return { start: this.left.getValue(), end: this.right.getValue() };
BI.YearMonthInterval.EVENT_CHANGE = "EVENT_CHANGE"; }
BI.YearMonthInterval.EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW"; }
BI.shortcut("bi.year_month_interval", BI.YearMonthInterval);

Write Preview
Loading…
Cancel
Save