Browse Source

BI-43293 feat: 完成对日期控件的格式化支持

es6
windy 6 years ago
parent
commit
4b79c55b77
  1. 27
      demo/js/widget/date/demo.multidate_combo.js
  2. 4
      src/widget/dynamicdate/dynamicdate.combo.js
  3. 76
      src/widget/dynamicdate/dynamicdate.trigger.js
  4. 4
      src/widget/dynamicdatetime/dynamicdatetime.combo.js
  5. 80
      src/widget/dynamicdatetime/dynamicdatetime.trigger.js

27
demo/js/widget/date/demo.multidate_combo.js

@ -20,15 +20,24 @@ Demo.Date = BI.inherit(BI.Widget, {
ref: function () { ref: function () {
self.datecombo = this; self.datecombo = this;
}, },
width: 300 width: 300,
// value: { // format: "%Y-%X-%d", // yyyy-MM-dd
// type: 1, // format: "%Y/%X/%d", // yyyy/MM/dd
// value: { // format: "%Y-%x-%e", // yyyy-M-d
// year: 2018, // format: "%Y/%x/%e", // yyyy/M/d
// month: 2, // format: "%X/%d/%Y", // MM/dd/yyyy
// day: 23 // format: "%X/%e/%y", // MM/d/yy
// } // format: "%X.%d.%Y", // MM.dd.yyyy
// } // format: "%X.%e.%Y", // MM.d.yyyy
// format: "%X-%e-%y", // MM.d.yyyy
value: {
type: 1,
value: {
year: 2018,
month: 2,
day: 23
}
}
}, { }, {
type: "bi.button", type: "bi.button",
text: "getValue", text: "getValue",

4
src/widget/dynamicdate/dynamicdate.combo.js

@ -10,7 +10,8 @@ BI.DynamicDateCombo = BI.inherit(BI.Single, {
baseCls: "bi-dynamic-date-combo bi-border bi-focus-shadow bi-border-radius", baseCls: "bi-dynamic-date-combo bi-border bi-focus-shadow bi-border-radius",
height: 22, height: 22,
minDate: "1900-01-01", minDate: "1900-01-01",
maxDate: "2099-12-31" maxDate: "2099-12-31",
format: "%Y-%X-%d"
}, },
@ -48,6 +49,7 @@ BI.DynamicDateCombo = BI.inherit(BI.Single, {
type: "bi.dynamic_date_trigger", type: "bi.dynamic_date_trigger",
min: opts.minDate, min: opts.minDate,
max: opts.maxDate, max: opts.maxDate,
format: opts.format,
height: opts.height, height: opts.height,
value: opts.value, value: opts.value,
ref: function () { ref: function () {

76
src/widget/dynamicdate/dynamicdate.trigger.js

@ -4,14 +4,16 @@ BI.DynamicDateTrigger = BI.inherit(BI.Trigger, {
vgap: 2, vgap: 2,
yearLength: 4, yearLength: 4,
yearMonthLength: 6, yearMonthLength: 6,
yearFullMonthLength: 7 yearFullMonthLength: 7,
compareFormat: "%Y-%X-%d"
}, },
props: { props: {
extraCls: "bi-date-trigger", extraCls: "bi-date-trigger",
min: "1900-01-01", // 最小日期 min: "1900-01-01", // 最小日期
max: "2099-12-31", // 最大日期 max: "2099-12-31", // 最大日期
height: 24 height: 24,
format: "" // 显示的日期格式化方式
}, },
_init: function () { _init: function () {
@ -22,9 +24,10 @@ BI.DynamicDateTrigger = BI.inherit(BI.Trigger, {
type: "bi.sign_editor", type: "bi.sign_editor",
height: o.height, height: o.height,
validationChecker: function (v) { validationChecker: function (v) {
var date = v.match(/\d+/g); var formatStr = self._getStandardDateStr(v);
self._autoAppend(v, date); var date = formatStr.match(/\d+/g);
return self._dateCheck(v) && BI.checkDateLegal(v) && self._checkVoid({ !BI.isKey(o.format) && self._autoAppend(v, date);
return self._dateCheck(formatStr) && BI.checkDateLegal(formatStr) && self._checkVoid({
year: date[0] | 0, year: date[0] | 0,
month: date[1] | 0, month: date[1] | 0,
day: date[2] | 0 day: date[2] | 0
@ -38,10 +41,11 @@ BI.DynamicDateTrigger = BI.inherit(BI.Trigger, {
allowBlank: true, allowBlank: true,
watermark: BI.i18nText("BI-Basic_Unrestricted"), watermark: BI.i18nText("BI-Basic_Unrestricted"),
errorText: function () { errorText: function () {
if (self.editor.isEditing()) { var str = "";
return BI.i18nText("BI-Date_Trigger_Error_Text"); if (!BI.isKey(o.format)) {
str = self.editor.isEditing() ? BI.i18nText("BI-Date_Trigger_Error_Text"): BI.i18nText("BI-Year_Trigger_Invalid_Text");
} }
return BI.i18nText("BI-Year_Trigger_Invalid_Text"); return str;
}, },
title: function () { title: function () {
var storeValue = self.storeValue || {}; var storeValue = self.storeValue || {};
@ -52,14 +56,14 @@ BI.DynamicDateTrigger = BI.inherit(BI.Trigger, {
var text = self._getText(value); var text = self._getText(value);
var date = BI.getDate(); var date = BI.getDate();
date = BI.DynamicDateHelper.getCalculation(value); date = BI.DynamicDateHelper.getCalculation(value);
var dateStr = BI.print(date, "%Y-%X-%d"); var dateStr = BI.print(date, self._getFormatString());
return BI.isEmptyString(text) ? dateStr : (text + ":" + dateStr); return BI.isEmptyString(text) ? dateStr : (text + ":" + dateStr);
case BI.DynamicDateCombo.Static: case BI.DynamicDateCombo.Static:
default: default:
if (BI.isNull(value) || BI.isNull(value.day)) { if (BI.isNull(value) || BI.isNull(value.day)) {
return ""; return "";
} }
return BI.print(BI.getDate(value.year, (value.month - 1), value.day), "%Y-%X-%d"); return BI.print(BI.getDate(value.year, (value.month - 1), value.day), self._getFormatString());
} }
} }
}); });
@ -86,7 +90,8 @@ BI.DynamicDateTrigger = BI.inherit(BI.Trigger, {
} }
if (BI.isNotEmptyString(value) && !BI.isEqual(self.storeTriggerValue, self.getKey())) { if (BI.isNotEmptyString(value) && !BI.isEqual(self.storeTriggerValue, self.getKey())) {
var date = value.split("-"); var formatStr = self._getStandardDateStr(value);
var date = formatStr.match(/\d+/g);
self.storeValue = { self.storeValue = {
type: BI.DynamicDateCombo.Static, type: BI.DynamicDateCombo.Static,
value: { value: {
@ -121,6 +126,45 @@ BI.DynamicDateTrigger = BI.inherit(BI.Trigger, {
}); });
this.setValue(o.value); this.setValue(o.value);
}, },
_getStandardDateStr: function (v) {
var c = this._const;
var result = [0, 1, 2];
var formatArray = this._getFormatString().match(/%./g);
BI.each(formatArray, function (idx, v) {
switch (v) {
case "%Y":
case "%y":
result[0] = idx;
break;
case "%X":
case "%x":
result[1] = idx;
break;
case "%d":
case "%e":
default:
result[2] = idx;
break;
}
});
var dateArray = v.match(/\d+/g);
var newArray = [];
BI.each(dateArray, function (idx) {
newArray[idx] = dateArray[result[idx]];
});
// 这边之所以不直接返回join结果是因为年的格式可能只有2位,所以需要format一下
if(newArray.length === result.length && newArray[0].length === 2) {
return BI.print(BI.parseDateTime(newArray.join("-"), c.compareFormat), c.compareFormat);
}
// 这边format成-20-也没关系, 反正都是不合法的
return newArray.join("-");
},
_getFormatString: function () {
return this.options.format || this._const.compareFormat;
},
_dateCheck: function (date) { _dateCheck: function (date) {
return BI.print(BI.parseDateTime(date, "%Y-%x-%d"), "%Y-%x-%d") === date || return BI.print(BI.parseDateTime(date, "%Y-%x-%d"), "%Y-%x-%d") === date ||
BI.print(BI.parseDateTime(date, "%Y-%X-%d"), "%Y-%X-%d") === date || BI.print(BI.parseDateTime(date, "%Y-%X-%d"), "%Y-%X-%d") === date ||
@ -150,19 +194,19 @@ BI.DynamicDateTrigger = BI.inherit(BI.Trigger, {
}, },
_yearCheck: function (v) { _yearCheck: function (v) {
var date = BI.print(BI.parseDateTime(v, "%Y-%X-%d"), "%Y-%X-%d"); var date = BI.print(BI.parseDateTime(v, this._getFormatString()), this._const.compareFormat);
return BI.print(BI.parseDateTime(v, "%Y"), "%Y") === v && date >= this.options.min && date <= this.options.max; return BI.print(BI.parseDateTime(v, "%Y"), "%Y") === v && date >= this.options.min && date <= this.options.max;
}, },
_monthCheck: function (v) { _monthCheck: function (v) {
var date = BI.parseDateTime(v, "%Y-%X-%d"); var date = BI.parseDateTime(v, this._getFormatString());
var dateStr = BI.print(date, "%Y-%X-%d"); var dateStr = BI.print(date, this._const.compareFormat);
return (date.getMonth() >= 0 && (BI.print(BI.parseDateTime(v, "%Y-%X"), "%Y-%X") === v || return (date.getMonth() >= 0 && (BI.print(BI.parseDateTime(v, "%Y-%X"), "%Y-%X") === v ||
BI.print(BI.parseDateTime(v, "%Y-%x"), "%Y-%x") === v)) && dateStr >= this.options.min && dateStr <= this.options.max; BI.print(BI.parseDateTime(v, "%Y-%x"), "%Y-%x") === v)) && dateStr >= this.options.min && dateStr <= this.options.max;
}, },
_setInnerValue: function (date) { _setInnerValue: function (date) {
var dateStr = BI.print(date, "%Y-%X-%d"); var dateStr = BI.print(date, this._getFormatString());
this.editor.setState(dateStr); this.editor.setState(dateStr);
this.editor.setValue(dateStr); this.editor.setValue(dateStr);
}, },
@ -238,7 +282,7 @@ BI.DynamicDateTrigger = BI.inherit(BI.Trigger, {
this.editor.setState(""); this.editor.setState("");
this.editor.setValue(""); this.editor.setValue("");
} else { } else {
var dateStr = BI.print(BI.getDate(value.year, (value.month - 1), value.day), "%Y-%X-%d"); var dateStr = BI.print(BI.getDate(value.year, (value.month - 1), value.day), this._getFormatString());
this.editor.setState(dateStr); this.editor.setState(dateStr);
this.editor.setValue(dateStr); this.editor.setValue(dateStr);
} }

4
src/widget/dynamicdatetime/dynamicdatetime.combo.js

@ -10,7 +10,8 @@ BI.DynamicDateTimeCombo = BI.inherit(BI.Single, {
baseCls: "bi-dynamic-date-combo bi-border bi-focus-shadow", baseCls: "bi-dynamic-date-combo bi-border bi-focus-shadow",
height: 22, height: 22,
minDate: "1900-01-01", minDate: "1900-01-01",
maxDate: "2099-12-31" maxDate: "2099-12-31",
format: "%Y-%X-%d"
}, },
@ -48,6 +49,7 @@ BI.DynamicDateTimeCombo = BI.inherit(BI.Single, {
type: "bi.dynamic_date_time_trigger", type: "bi.dynamic_date_time_trigger",
min: opts.minDate, min: opts.minDate,
max: opts.maxDate, max: opts.maxDate,
format: opts.format,
height: opts.height, height: opts.height,
value: opts.value, value: opts.value,
ref: function () { ref: function () {

80
src/widget/dynamicdatetime/dynamicdatetime.trigger.js

@ -4,14 +4,16 @@ BI.DynamicDateTimeTrigger = BI.inherit(BI.Trigger, {
vgap: 2, vgap: 2,
yearLength: 4, yearLength: 4,
yearMonthLength: 6, yearMonthLength: 6,
yearFullMonthLength: 7 yearFullMonthLength: 7,
compareFormat: "%Y-%X-%d %H:%M:%S"
}, },
props: { props: {
extraCls: "bi-date-time-trigger", extraCls: "bi-date-time-trigger",
min: "1900-01-01", // 最小日期 min: "1900-01-01", // 最小日期
max: "2099-12-31", // 最大日期 max: "2099-12-31", // 最大日期
height: 24 height: 24,
format: "%Y-%X-%d %H:%M:%S" // 显示的日期格式化方式
}, },
_init: function () { _init: function () {
@ -22,9 +24,10 @@ BI.DynamicDateTimeTrigger = BI.inherit(BI.Trigger, {
type: "bi.sign_editor", type: "bi.sign_editor",
height: o.height, height: o.height,
validationChecker: function (v) { validationChecker: function (v) {
var date = v.match(/\d+/g); var formatStr = self._getStandardDateStr(v);
self._autoAppend(v, date); var date = formatStr.match(/\d+/g);
return self._dateCheck(v) && BI.checkDateLegal(v) && self._checkVoid({ self._isDefaultDateFormat() && self._autoAppend(v, date);
return self._dateCheck(formatStr) && BI.checkDateLegal(formatStr) && self._checkVoid({
year: date[0] | 0, year: date[0] | 0,
month: date[1] | 0, month: date[1] | 0,
day: date[2] | 0 day: date[2] | 0
@ -38,10 +41,11 @@ BI.DynamicDateTimeTrigger = BI.inherit(BI.Trigger, {
allowBlank: true, allowBlank: true,
watermark: BI.i18nText("BI-Basic_Unrestricted"), watermark: BI.i18nText("BI-Basic_Unrestricted"),
errorText: function () { errorText: function () {
if (self.editor.isEditing()) { var str = "";
return BI.i18nText("BI-Basic_Date_Time_Error_Text"); if (self._isDefaultDateFormat()) {
str = self.editor.isEditing() ? BI.i18nText("BI-Basic_Date_Time_Error_Text") : BI.i18nText("BI-Year_Trigger_Invalid_Text");
} }
return BI.i18nText("BI-Year_Trigger_Invalid_Text"); return str;
}, },
title: function () { title: function () {
var storeValue = self.storeValue || {}; var storeValue = self.storeValue || {};
@ -51,7 +55,7 @@ BI.DynamicDateTimeTrigger = BI.inherit(BI.Trigger, {
case BI.DynamicDateCombo.Dynamic: case BI.DynamicDateCombo.Dynamic:
var text = self._getText(value); var text = self._getText(value);
var date = BI.DynamicDateHelper.getCalculation(value); var date = BI.DynamicDateHelper.getCalculation(value);
var dateStr = BI.print(date, "%Y-%x-%e %H:%M:%S"); var dateStr = BI.print(date, o.format);
return BI.isEmptyString(text) ? dateStr : (text + ":" + dateStr); return BI.isEmptyString(text) ? dateStr : (text + ":" + dateStr);
case BI.DynamicDateCombo.Static: case BI.DynamicDateCombo.Static:
default: default:
@ -59,7 +63,7 @@ BI.DynamicDateTimeTrigger = BI.inherit(BI.Trigger, {
return ""; return "";
} }
return BI.print(BI.getDate(value.year, (value.month - 1), value.day, value.hour || 0, value.minute || 0, return BI.print(BI.getDate(value.year, (value.month - 1), value.day, value.hour || 0, value.minute || 0,
value.second || 0), "%Y-%X-%d %H:%M:%S"); value.second || 0), o.format);
} }
} }
}); });
@ -86,7 +90,8 @@ BI.DynamicDateTimeTrigger = BI.inherit(BI.Trigger, {
} }
if (BI.isNotEmptyString(value) && !BI.isEqual(self.storeTriggerValue, self.getKey())) { if (BI.isNotEmptyString(value) && !BI.isEqual(self.storeTriggerValue, self.getKey())) {
var date = value.split(/-|\s|:/); var formatStr = self._getStandardDateStr(value);
var date = formatStr.match(/\d+/g);
self.storeValue = { self.storeValue = {
type: BI.DynamicDateCombo.Static, type: BI.DynamicDateCombo.Static,
value: { value: {
@ -119,8 +124,55 @@ BI.DynamicDateTimeTrigger = BI.inherit(BI.Trigger, {
}); });
this.setValue(o.value); this.setValue(o.value);
}, },
_isDefaultDateFormat: function () {
return this.options.format === this._const.compareFormat;
},
_getStandardDateStr: function (v) {
var result = [0, 1, 2, 3, 4, 5];
var formatArray = this.options.format.match(/%./g);
BI.each(formatArray, function (idx, v) {
switch (v) {
case "%Y":
case "%y":
result[0] = idx;
break;
case "%X":
case "%x":
result[1] = idx;
break;
case "%d":
case "%e":
result[2] = idx;
break;
case "%H":
case "%h":
result[3] = idx;
break;
case "%M":
case "%m":
result[4] = idx;
break;
case "%S":
case "%s":
default:
result[5] = idx;
break;
}
});
var dateArray = v.match(/\d+/g);
var newArray = [];
BI.each(dateArray, function (idx) {
newArray[idx] = dateArray[result[idx]];
});
return newArray.slice(0, 3).join("-") + " " + newArray.slice(3).join(":");
},
_dateCheck: function (date) { _dateCheck: function (date) {
return BI.print(BI.parseDateTime(date, "%Y-%x-%d %H:%M:%S"), "%Y-%x-%d %H:%M:%S") === date || var o = this.options;
return BI.print(BI.parseDateTime(date, o.format), o.format) === date ||
BI.print(BI.parseDateTime(date, "%Y-%x-%d %H:%M:%S"), "%Y-%x-%d %H:%M:%S") === date ||
BI.print(BI.parseDateTime(date, "%Y-%X-%d %H:%M:%S"), "%Y-%X-%d %H:%M:%S") === date || BI.print(BI.parseDateTime(date, "%Y-%X-%d %H:%M:%S"), "%Y-%X-%d %H:%M:%S") === date ||
BI.print(BI.parseDateTime(date, "%Y-%x-%e %H:%M:%S"), "%Y-%x-%e %H:%M:%S") === date || BI.print(BI.parseDateTime(date, "%Y-%x-%e %H:%M:%S"), "%Y-%x-%e %H:%M:%S") === date ||
BI.print(BI.parseDateTime(date, "%Y-%X-%e %H:%M:%S"), "%Y-%X-%e %H:%M:%S") === date || BI.print(BI.parseDateTime(date, "%Y-%X-%e %H:%M:%S"), "%Y-%X-%e %H:%M:%S") === date ||
@ -158,7 +210,7 @@ BI.DynamicDateTimeTrigger = BI.inherit(BI.Trigger, {
}, },
_monthCheck: function (v) { _monthCheck: function (v) {
var date = BI.parseDateTime(v, "%Y-%X-%d"); var date = BI.parseDateTime(v, this.options.format);
var dateStr = BI.print(date, "%Y-%X-%d"); var dateStr = BI.print(date, "%Y-%X-%d");
return (date.getMonth() > 0 && (BI.print(BI.parseDateTime(v, "%Y-%X"), "%Y-%X") === v || return (date.getMonth() > 0 && (BI.print(BI.parseDateTime(v, "%Y-%X"), "%Y-%X") === v ||
BI.print(BI.parseDateTime(v, "%Y-%x"), "%Y-%x") === v)) && dateStr >= this.options.min && dateStr <= this.options.max; BI.print(BI.parseDateTime(v, "%Y-%x"), "%Y-%x") === v)) && dateStr >= this.options.min && dateStr <= this.options.max;
@ -242,7 +294,7 @@ BI.DynamicDateTimeTrigger = BI.inherit(BI.Trigger, {
this.editor.setValue(""); this.editor.setValue("");
} else { } else {
var dateStr = BI.print(BI.getDate(value.year, (value.month - 1), value.day, value.hour || 0, value.minute || 0, var dateStr = BI.print(BI.getDate(value.year, (value.month - 1), value.day, value.hour || 0, value.minute || 0,
value.second || 0), "%Y-%X-%d %H:%M:%S"); value.second || 0), this.options.format);
this.editor.setState(dateStr); this.editor.setState(dateStr);
this.editor.setValue(dateStr); this.editor.setValue(dateStr);
} }

Loading…
Cancel
Save