Browse Source
* commit '4d385c2f0c71a424e1f765c1342a71927c56a69f': BI-17245 年月区间控件 BI-17050 multi_layer_single_treees6
guy
7 years ago
25 changed files with 857 additions and 81 deletions
@ -0,0 +1,45 @@ |
|||||||
|
Demo.YearMonthInterval = BI.inherit(BI.Widget, { |
||||||
|
props: { |
||||||
|
baseCls: "" |
||||||
|
}, |
||||||
|
|
||||||
|
render: function () { |
||||||
|
var self = this; |
||||||
|
return { |
||||||
|
type: "bi.horizontal_auto", |
||||||
|
items: [{ |
||||||
|
type: "bi.year_month_interval", |
||||||
|
ref: function (_ref) { |
||||||
|
self.interval = _ref; |
||||||
|
}, |
||||||
|
value: { |
||||||
|
start: { |
||||||
|
type: 2, |
||||||
|
value: { |
||||||
|
year: -1, |
||||||
|
month: 1 |
||||||
|
} |
||||||
|
}, |
||||||
|
end: { |
||||||
|
type: 1, |
||||||
|
value: { |
||||||
|
year: 2018, |
||||||
|
month: 0 |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
width: 400 |
||||||
|
}, { |
||||||
|
type: "bi.button", |
||||||
|
text: "getValue", |
||||||
|
handler: function () { |
||||||
|
BI.Msg.toast(JSON.stringify(self.interval.getValue())); |
||||||
|
}, |
||||||
|
width: 300 |
||||||
|
}], |
||||||
|
vgap: 20 |
||||||
|
}; |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
BI.shortcut("demo.year_month_interval", Demo.YearMonthInterval); |
@ -1,6 +1,6 @@ |
|||||||
.bi-param-time-interval.time-error .bi-input { |
.bi-time-interval.time-error .bi-input { |
||||||
color: #ff4949; |
color: #ff4949; |
||||||
} |
} |
||||||
.bi-param-time-interval.time-error .sign-editor-text { |
.bi-time-interval.time-error .sign-editor-text { |
||||||
color: #ff4949; |
color: #ff4949; |
||||||
} |
} |
||||||
|
@ -0,0 +1,6 @@ |
|||||||
|
.bi-year-month-interval.time-error .bi-input { |
||||||
|
color: #ff4949; |
||||||
|
} |
||||||
|
.bi-year-month-interval.time-error .sign-editor-text { |
||||||
|
color: #ff4949; |
||||||
|
} |
@ -0,0 +1,10 @@ |
|||||||
|
@import "../../index"; |
||||||
|
|
||||||
|
.bi-year-month-interval{ |
||||||
|
&.time-error .bi-input{ |
||||||
|
color:@color-bi-text-failure |
||||||
|
} |
||||||
|
&.time-error .sign-editor-text{ |
||||||
|
color:@color-bi-text-failure |
||||||
|
} |
||||||
|
} |
@ -0,0 +1,180 @@ |
|||||||
|
BI.YearMonthInterval = BI.inherit(BI.Single, { |
||||||
|
constants: { |
||||||
|
height: 25, |
||||||
|
width: 25, |
||||||
|
lgap: 15, |
||||||
|
offset: -15, |
||||||
|
timeErrorCls: "time-error", |
||||||
|
DATE_MIN_VALUE: "1900-01-01", |
||||||
|
DATE_MAX_VALUE: "2099-12-31" |
||||||
|
}, |
||||||
|
|
||||||
|
props: { |
||||||
|
extraCls: "bi-year-month-interval" |
||||||
|
}, |
||||||
|
|
||||||
|
_init: function () { |
||||||
|
var self = this, o = this.options; |
||||||
|
BI.YearMonthInterval.superclass._init.apply(this, arguments); |
||||||
|
|
||||||
|
o.value = o.value || {}; |
||||||
|
this.left = this._createCombo(o.value.start); |
||||||
|
this.right = this._createCombo(o.value.end); |
||||||
|
this.label = BI.createWidget({ |
||||||
|
type: "bi.label", |
||||||
|
height: this.constants.height, |
||||||
|
width: this.constants.width, |
||||||
|
text: "-" |
||||||
|
}); |
||||||
|
BI.createWidget({ |
||||||
|
element: self, |
||||||
|
type: "bi.center", |
||||||
|
hgap: 15, |
||||||
|
height: this.constants.height, |
||||||
|
items: [{ |
||||||
|
type: "bi.absolute", |
||||||
|
items: [{ |
||||||
|
el: self.left, |
||||||
|
left: this.constants.offset, |
||||||
|
right: 0, |
||||||
|
top: 0, |
||||||
|
bottom: 0 |
||||||
|
}] |
||||||
|
}, { |
||||||
|
type: "bi.absolute", |
||||||
|
items: [{ |
||||||
|
el: self.right, |
||||||
|
left: 0, |
||||||
|
right: this.constants.offset, |
||||||
|
top: 0, |
||||||
|
bottom: 0 |
||||||
|
}] |
||||||
|
}] |
||||||
|
}); |
||||||
|
BI.createWidget({ |
||||||
|
type: "bi.horizontal_auto", |
||||||
|
element: this, |
||||||
|
items: [ |
||||||
|
self.label |
||||||
|
] |
||||||
|
}); |
||||||
|
}, |
||||||
|
|
||||||
|
_createCombo: function (v) { |
||||||
|
var self = this; |
||||||
|
var combo = BI.createWidget({ |
||||||
|
type: "bi.dynamic_year_month_combo", |
||||||
|
value: v |
||||||
|
}); |
||||||
|
combo.on(BI.DynamicYearMonthCombo.EVENT_ERROR, function () { |
||||||
|
self._clearTitle(); |
||||||
|
self.element.removeClass(self.constants.timeErrorCls); |
||||||
|
self.fireEvent(BI.YearMonthInterval.EVENT_ERROR); |
||||||
|
}); |
||||||
|
|
||||||
|
combo.on(BI.DynamicYearMonthCombo.EVENT_VALID, function () { |
||||||
|
BI.Bubbles.hide("error"); |
||||||
|
var smallDate = self.left.getKey(), bigDate = self.right.getKey(); |
||||||
|
if (self._check(smallDate, bigDate) && self._compare(smallDate, bigDate)) { |
||||||
|
self._setTitle(BI.i18nText("BI-Time_Interval_Error_Text")); |
||||||
|
self.element.addClass(self.constants.timeErrorCls); |
||||||
|
BI.Bubbles.show("error", BI.i18nText("BI-Time_Interval_Error_Text"), self, { |
||||||
|
offsetStyle: "center" |
||||||
|
}); |
||||||
|
self.fireEvent(BI.YearMonthInterval.EVENT_ERROR); |
||||||
|
} else { |
||||||
|
self._clearTitle(); |
||||||
|
self.element.removeClass(self.constants.timeErrorCls); |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
combo.on(BI.DynamicYearMonthCombo.EVENT_FOCUS, function () { |
||||||
|
BI.Bubbles.hide("error"); |
||||||
|
var smallDate = self.left.getKey(), bigDate = self.right.getKey(); |
||||||
|
if (self._check(smallDate, bigDate) && self._compare(smallDate, bigDate)) { |
||||||
|
self._setTitle(BI.i18nText("BI-Time_Interval_Error_Text")); |
||||||
|
self.element.addClass(self.constants.timeErrorCls); |
||||||
|
BI.Bubbles.show("error", BI.i18nText("BI-Time_Interval_Error_Text"), self, { |
||||||
|
offsetStyle: "center" |
||||||
|
}); |
||||||
|
self.fireEvent(BI.YearMonthInterval.EVENT_ERROR); |
||||||
|
} else { |
||||||
|
self._clearTitle(); |
||||||
|
self.element.removeClass(self.constants.timeErrorCls); |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
combo.on(BI.DynamicYearMonthCombo.EVENT_BEFORE_POPUPVIEW, function () { |
||||||
|
self.left.hideView(); |
||||||
|
self.right.hideView(); |
||||||
|
}); |
||||||
|
|
||||||
|
combo.on(BI.DynamicYearMonthCombo.EVENT_CONFIRM, function () { |
||||||
|
BI.Bubbles.hide("error"); |
||||||
|
var smallDate = self.left.getKey(), bigDate = self.right.getKey(); |
||||||
|
if (self._check(smallDate, bigDate) && self._compare(smallDate, bigDate)) { |
||||||
|
self._setTitle(BI.i18nText("BI-Time_Interval_Error_Text")); |
||||||
|
self.element.addClass(self.constants.timeErrorCls); |
||||||
|
self.fireEvent(BI.YearMonthInterval.EVENT_ERROR); |
||||||
|
}else{ |
||||||
|
self._clearTitle(); |
||||||
|
self.element.removeClass(self.constants.timeErrorCls); |
||||||
|
self.fireEvent(BI.YearMonthInterval.EVENT_CHANGE); |
||||||
|
} |
||||||
|
}); |
||||||
|
return combo; |
||||||
|
}, |
||||||
|
|
||||||
|
|
||||||
|
_dateCheck: function (date) { |
||||||
|
return BI.parseDateTime(date, "%Y-%x").print("%Y-%x") === date || BI.parseDateTime(date, "%Y-%X").print("%Y-%X") === date; |
||||||
|
}, |
||||||
|
|
||||||
|
|
||||||
|
// 判是否在最大最小之间
|
||||||
|
_checkVoid: function (obj) { |
||||||
|
return !BI.checkDateVoid(obj.year, obj.month, 1, this.constants.DATE_MIN_VALUE, this.constants.DATE_MAX_VALUE)[0]; |
||||||
|
}, |
||||||
|
|
||||||
|
// 判格式合法
|
||||||
|
_check: function (smallDate, bigDate) { |
||||||
|
var smallObj = smallDate.match(/\d+/g), bigObj = bigDate.match(/\d+/g); |
||||||
|
return this._dateCheck(smallDate) && BI.checkDateLegal(smallDate) && this._checkVoid({ |
||||||
|
year: smallObj[0], |
||||||
|
month: smallObj[1], |
||||||
|
day: 1 |
||||||
|
}) && this._dateCheck(bigDate) && BI.checkDateLegal(bigDate) && this._checkVoid({ |
||||||
|
year: bigObj[0], |
||||||
|
month: bigObj[1], |
||||||
|
day: 1 |
||||||
|
}); |
||||||
|
}, |
||||||
|
|
||||||
|
_compare: function (smallDate, bigDate) { |
||||||
|
smallDate = BI.parseDateTime(smallDate, "%Y-%X").print("%Y-%X"); |
||||||
|
bigDate = BI.parseDateTime(bigDate, "%Y-%X").print("%Y-%X"); |
||||||
|
return BI.isNotNull(smallDate) && BI.isNotNull(bigDate) && smallDate > bigDate; |
||||||
|
}, |
||||||
|
_setTitle: function (v) { |
||||||
|
this.left.setTitle(v); |
||||||
|
this.right.setTitle(v); |
||||||
|
this.label.setTitle(v); |
||||||
|
}, |
||||||
|
_clearTitle: function () { |
||||||
|
this.left.setTitle(""); |
||||||
|
this.right.setTitle(""); |
||||||
|
this.label.setTitle(""); |
||||||
|
}, |
||||||
|
setValue: function (date) { |
||||||
|
date = date || {}; |
||||||
|
this.left.setValue(date.start); |
||||||
|
this.right.setValue(date.end); |
||||||
|
}, |
||||||
|
getValue: function () { |
||||||
|
return {start: this.left.getValue(), end: this.right.getValue()}; |
||||||
|
} |
||||||
|
}); |
||||||
|
BI.YearMonthInterval.EVENT_VALID = "EVENT_VALID"; |
||||||
|
BI.YearMonthInterval.EVENT_ERROR = "EVENT_ERROR"; |
||||||
|
BI.YearMonthInterval.EVENT_CHANGE = "EVENT_CHANGE"; |
||||||
|
BI.shortcut("bi.year_month_interval", BI.YearMonthInterval); |
Loading…
Reference in new issue