Pull request #1845: BI-82267 fineui时间控件交互优化

Merge in VISUAL/fineui from ~WINDY/fui:master to master

* commit '56a3b879210cf8e91a59a1111d57fe2952420913':
  changelog
  BI-82267 fineui时间控件交互优化

changelog.md

@@ -1,4 +1,7 @@
 # 更新日志
+2.0(2021-03)
+- 时间类型控件优化动态时间面板的交互
+
 2.0(2021-02)
 - 增加updateModel属性，可以配置自动模式，自动watch属性并响应变化
 - 增加beforeRender生命周期函数

src/widget/date/calendar/picker.date.js

@@ -39,8 +39,8 @@ BI.DatePicker = BI.inherit(BI.Widget, {
                 });
             }
             self.fireEvent(BI.DatePicker.EVENT_CHANGE);
-            self._checkLeftValid();
-            self._checkRightValid();
+            // self._checkLeftValid();
+            // self._checkRightValid();
         });
 
         this.right = BI.createWidget({
@@ -63,8 +63,8 @@ BI.DatePicker = BI.inherit(BI.Widget, {
                 });
             }
             self.fireEvent(BI.DatePicker.EVENT_CHANGE);
-            self._checkLeftValid();
-            self._checkRightValid();
+            // self._checkLeftValid();
+            // self._checkRightValid();
         });
 
         this.year = BI.createWidget({
@@ -194,16 +194,16 @@ BI.DatePicker = BI.inherit(BI.Widget, {
         this.options.min = minDate;
         this.year.setMinDate(minDate);
         this._refreshMonth(this._month);
-        this._checkLeftValid();
-        this._checkRightValid();
+        // this._checkLeftValid();
+        // this._checkRightValid();
     },
 
     setMaxDate: function (maxDate) {
         this.options.max = maxDate;
         this.year.setMaxDate(maxDate);
         this._refreshMonth(this._month);
-        this._checkLeftValid();
-        this._checkRightValid();
+        // this._checkLeftValid();
+        // this._checkRightValid();
     },
 
     setValue: function (ob) {
@@ -212,8 +212,8 @@ BI.DatePicker = BI.inherit(BI.Widget, {
         this.year.setValue(ob.year);
         this._refreshMonth(this._month);
         this.month.setValue(ob.month);
-        this._checkLeftValid();
-        this._checkRightValid();
+        // this._checkLeftValid();
+        // this._checkRightValid();
     },
 
     getValue: function () {

src/widget/date/calendar/picker.year.js

@@ -28,8 +28,8 @@ BI.YearPicker = BI.inherit(BI.Widget, {
         this.left.on(BI.IconButton.EVENT_CHANGE, function () {
             self.setValue(self.year.getValue() - 1);
             self.fireEvent(BI.YearPicker.EVENT_CHANGE);
-            self._checkLeftValid();
-            self._checkRightValid();
+            // self._checkLeftValid();
+            // self._checkRightValid();
         });
 
         this.right = BI.createWidget({
@@ -42,8 +42,8 @@ BI.YearPicker = BI.inherit(BI.Widget, {
         this.right.on(BI.IconButton.EVENT_CHANGE, function () {
             self.setValue(self.year.getValue() + 1);
             self.fireEvent(BI.YearPicker.EVENT_CHANGE);
-            self._checkLeftValid();
-            self._checkRightValid();
+            // self._checkLeftValid();
+            // self._checkRightValid();
         });
 
         this.year = BI.createWidget({
@@ -105,23 +105,23 @@ BI.YearPicker = BI.inherit(BI.Widget, {
     setMinDate: function (minDate) {
         this.options.min = minDate;
         this.year.setMinDate(minDate);
-        this._checkLeftValid();
-        this._checkRightValid();
+        // this._checkLeftValid();
+        // this._checkRightValid();
     },
 
     setMaxDate: function (maxDate) {
         this.options.max = maxDate;
         this.year.setMaxDate(maxDate);
-        this._checkLeftValid();
-        this._checkRightValid();
+        // this._checkLeftValid();
+        // this._checkRightValid();
     },
 
 
     setValue: function (v) {
         this._year = v;
         this.year.setValue(v);
-        this._checkLeftValid();
-        this._checkRightValid();
+        // this._checkLeftValid();
+        // this._checkRightValid();
     },
 
     getValue: function () {

src/widget/datepane/datepane.js

@@ -88,20 +88,51 @@ BI.DynamicDatePane = BI.inherit(BI.Widget, {
                         case BI.DynamicDatePane.Dynamic:
                         default:
                             return {
+                                type: "bi.vtape",
+                                items: [{
                                     type: "bi.dynamic_date_card",
                                     min: o.minDate,
                                     max: o.maxDate,
+                                    ref: function () {
+                                        self.dynamicPane = this;
+                                    }
+                                }, {
+                                    el: {
+                                        type: "bi.center",
+                                        items: [{
+                                            type: "bi.text_button",
+                                            cls: "bi-high-light bi-border-top",
+                                            shadow: true,
+                                            text: BI.i18nText("BI-Basic_Clear"),
+                                            textHeight: 23,
                                             listeners: [{
-                                    eventName: "EVENT_CHANGE",
+                                                eventName: BI.TextButton.EVENT_CHANGE,
                                                 action: function () {
-                                        if (self._checkValue(self.getValue())) {
+                                                    self.setValue();
                                                     self.fireEvent(BI.DynamicDatePane.EVENT_CHANGE);
                                                 }
+                                            }]
+                                        }, {
+                                            type: "bi.text_button",
+                                            cls: "bi-border-left bi-high-light bi-border-top",
+                                            textHeight: 23,
+                                            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.DynamicDatePopup.BUTTON_OK_EVENT_CHANGE);
+                                                    } else {
+                                                        self.fireEvent(BI.DynamicDatePane.EVENT_CHANGE);
                                                     }
-                                }],
-                                ref: function () {
-                                    self.dynamicPane = this;
                                                 }
+                                            }]
+                                        }]
+                                    },
+                                    height: 24
+                                }]
                             };
                     }
                 }
@@ -167,9 +198,10 @@ BI.DynamicDatePane = BI.inherit(BI.Widget, {
     },
 
     getValue: function () {
+        var type = this.dateTab.getSelect();
         return {
-            type: this.dateTab.getSelect(),
-            value: this.dateTab.getValue()
+            type: type,
+            value: type === BI.DynamicDatePane.Static ? this.dateTab.getValue() : this.dynamicPane.getValue()
         };
     }
 });

src/widget/datetimepane/datetimepane.js

@@ -88,20 +88,51 @@ BI.DynamicDateTimePane = BI.inherit(BI.Widget, {
                         case BI.DynamicDateTimePane.Dynamic:
                         default:
                             return {
+                                type: "bi.vtape",
+                                items: [{
                                     type: "bi.dynamic_date_card",
                                     min: o.minDate,
                                     max: o.maxDate,
+                                    ref: function () {
+                                        self.dynamicPane = this;
+                                    }
+                                }, {
+                                    el: {
+                                        type: "bi.center",
+                                        items: [{
+                                            type: "bi.text_button",
+                                            cls: "bi-high-light bi-border-top",
+                                            shadow: true,
+                                            text: BI.i18nText("BI-Basic_Clear"),
+                                            textHeight: 23,
                                             listeners: [{
-                                    eventName: "EVENT_CHANGE",
+                                                eventName: BI.TextButton.EVENT_CHANGE,
                                                 action: function () {
-                                        if(self._checkValue(self.getValue())) {
-                                            self.fireEvent("EVENT_CHANGE");
+                                                    self.setValue();
+                                                    self.fireEvent(BI.DynamicDatePane.EVENT_CHANGE);
                                                 }
+                                            }]
+                                        }, {
+                                            type: "bi.text_button",
+                                            cls: "bi-border-left bi-high-light bi-border-top",
+                                            textHeight: 23,
+                                            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.DynamicDatePopup.BUTTON_OK_EVENT_CHANGE);
+                                                    } else {
+                                                        self.fireEvent(BI.DynamicDatePane.EVENT_CHANGE);
                                                     }
-                                }],
-                                ref: function () {
-                                    self.dynamicPane = this;
                                                 }
+                                            }]
+                                        }]
+                                    },
+                                    height: 24
+                                }]
                             };
                     }
                 }

src/widget/dynamicdate/dynamicdate.card.js

@@ -142,18 +142,6 @@ BI.DynamicDateCard = BI.inherit(BI.Widget, {
                 el: {
                     type: "bi.dynamic_date_param_item",
                     validationChecker: BI.bind(self._checkDate, self),
-                    errorText: function () {
-                        var start = BI.parseDateTime(o.min, "%Y-%X-%d");
-                        var end = BI.parseDateTime(o.max, "%Y-%X-%d");
-                        return BI.i18nText("BI-Basic_Date_Range_Error",
-                            start.getFullYear(),
-                            start.getMonth() + 1,
-                            start.getDate(),
-                            end.getFullYear(),
-                            end.getMonth() + 1,
-                            end.getDate()
-                        );
-                    },
                     dateType: value.dateType,
                     value: value.value,
                     offset: value.offset,
@@ -162,6 +150,11 @@ BI.DynamicDateCard = BI.inherit(BI.Widget, {
                         action: function () {
                             self.fireEvent("EVENT_CHANGE");
                         }
+                    }, {
+                        eventName: "EVENT_INPUT_CHANGE",
+                        action: function () {
+                            BI.Bubbles.hide("dynamic-date-error");
+                        }
                     }]
                 },
                 tgap: idx === 0 ? 5 : 0
@@ -219,7 +212,7 @@ BI.DynamicDateCard = BI.inherit(BI.Widget, {
 
     _checkDate: function (obj) {
         var o = this.options;
-        var date = BI.DynamicDateHelper.getCalculation(BI.extend(this.getValue(), this._digestDateTypeValue(obj)));
+        var date = BI.DynamicDateHelper.getCalculation(BI.extend(this._getValue(), this._digestDateTypeValue(obj)));
 
         return !BI.checkDateVoid(date.getFullYear(), date.getMonth() + 1, date.getDate(), o.min, o.max)[0];
     },
@@ -358,7 +351,7 @@ BI.DynamicDateCard = BI.inherit(BI.Widget, {
         this.resultPane.populate(this._getParamJson(valuesItems, v.position));
     },
 
-    getValue: function () {
+    _getValue: function () {
         var self = this;
         var valueMap = {};
         var selectValues = this.checkgroup.getValue();
@@ -373,8 +366,45 @@ BI.DynamicDateCard = BI.inherit(BI.Widget, {
             var value = buttons[0].getValue();
             valueMap.workDay = (value.offset === 0 ? -value.value : +value.value);
         }
+
         return valueMap;
+    },
+
+    _getErrorText: function () {
+        var o = this.options;
+        var start = BI.parseDateTime(o.min, "%Y-%X-%d");
+        var end = BI.parseDateTime(o.max, "%Y-%X-%d");
+
+        return BI.i18nText("BI-Basic_Date_Range_Error",
+            start.getFullYear(),
+            start.getMonth() + 1,
+            start.getDate(),
+            end.getFullYear(),
+            end.getMonth() + 1,
+            end.getDate()
+        );
+    },
+
+    getValue: function () {
+        return this.checkValidation() ? this._getValue() : {};
+    },
+
+    checkValidation: function (show) {
+        var buttons = this.resultPane.getAllButtons();
+        var errorText;
+        var invalid = BI.any(buttons, function (idx, button) {
+            return button.checkValidation && !button.checkValidation();
+        });
+        if (invalid) {
+            errorText = BI.i18nText("BI-Please_Input_Natural_Number");
+        } else {
+            invalid = !this._checkDate(this._getValue());
+            errorText = this._getErrorText();
         }
+        invalid && show && BI.Bubbles.show("dynamic-date-error", errorText, this.resultPane);
+
+        return !invalid;
+    },
 
 });
 BI.shortcut("bi.dynamic_date_card", BI.DynamicDateCard);

src/widget/dynamicdate/dynamicdate.param.item.js

@@ -6,9 +6,6 @@ BI.DynamicDateParamItem = BI.inherit(BI.Widget, {
         validationChecker: function() {
             return true;
         },
-        errorText: function () {
-            return BI.i18nText("BI-Please_Input_Natural_Number");
-        },
         value: 0,
         offset: 0,
         height: 24
@@ -24,23 +21,14 @@ BI.DynamicDateParamItem = BI.inherit(BI.Widget, {
                     cls: "bi-border",
                     height: 22,
                     validationChecker: function (v) {
-                        return BI.isNaturalNumber(v) && o.validationChecker(BI.extend({}, self.getValue(), {
-                            value: v
-                        }));
+                        return BI.isNaturalNumber(v);
                     },
                     value: o.value,
                     ref: function () {
                         self.editor = this;
                     },
-                    errorText: function (v) {
-                        if (BI.isEmptyString(v)) {
-                            return BI.i18nText("BI-Basic_Please_Input_Content");
-                        }
-                        if (!BI.isNumeric(v)) {
+                    errorText: function () {
                         return BI.i18nText("BI-Please_Input_Natural_Number");
-                        }
-
-                        return o.errorText(v);
                     },
                     allowBlank: false,
                     listeners: [{
@@ -48,6 +36,11 @@ BI.DynamicDateParamItem = BI.inherit(BI.Widget, {
                         action: function () {
                             self.fireEvent(BI.DynamicDateParamItem.EVENT_CHANGE);
                         }
+                    }, {
+                        eventName: BI.SignEditor.EVENT_CHANGE,
+                        action: function () {
+                            self.fireEvent(BI.DynamicDateParamItem.EVENT_INPUT_CHANGE);
+                        }
                     }]
                 },
                 width: 60
@@ -112,6 +105,10 @@ BI.DynamicDateParamItem = BI.inherit(BI.Widget, {
         return text;
     },
 
+    checkValidation: function () {
+        return BI.isNaturalNumber(this.editor.getValue());
+    },
+
     setValue: function (v) {
         v = v || {};
         v.value = v.value || 0;
@@ -130,4 +127,5 @@ BI.DynamicDateParamItem = BI.inherit(BI.Widget, {
 
 });
 BI.DynamicDateParamItem.EVENT_CHANGE = "EVENT_CHANGE";
+BI.DynamicDateParamItem.EVENT_INPUT_CHANGE = "EVENT_INPUT_CHANGE";
 BI.shortcut("bi.dynamic_date_param_item", BI.DynamicDateParamItem);

src/widget/dynamicdate/dynamicdate.popup.js

@@ -59,8 +59,13 @@ BI.DynamicDatePopup = BI.inherit(BI.Widget, {
                         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.DynamicDatePopup.BUTTON_OK_EVENT_CHANGE);
+                                } else {
                                     self.fireEvent(BI.DynamicDatePopup.BUTTON_OK_EVENT_CHANGE);
                                 }
+                            }
                         }]
                     }]],
                     height: 24
@@ -194,7 +199,7 @@ BI.DynamicDatePopup = BI.inherit(BI.Widget, {
         if (this.options.min !== minDate) {
             this.options.min = minDate;
             this.ymd && this.ymd.setMinDate(minDate);
-            this.dynamicPane && this.ymd.setMinDate(minDate);
+            this.dynamicPane && this.dynamicPane.setMinDate(minDate);
         }
     },
 
@@ -202,7 +207,7 @@ BI.DynamicDatePopup = BI.inherit(BI.Widget, {
         if (this.options.max !== maxDate) {
             this.options.max = maxDate;
             this.ymd && this.ymd.setMaxDate(maxDate);
-            this.dynamicPane && this.ymd.setMaxDate(maxDate);
+            this.dynamicPane && this.dynamicPane.setMaxDate(maxDate);
         }
     },
 

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

@@ -15,6 +15,9 @@ BI.DynamicYearCard = BI.inherit(BI.Widget, {
         var self = this, o = this.options;
         return {
             type: "bi.vertical",
+            ref: function (_ref) {
+                self.wrapper = _ref;
+            },
             items: [{
                 type: "bi.label",
                 text: BI.i18nText("BI-Multi_Date_Relative_Current_Time"),
@@ -25,19 +28,16 @@ BI.DynamicYearCard = BI.inherit(BI.Widget, {
                 ref: function () {
                     self.item = this;
                 },
-                validationChecker: BI.bind(self._checkDate, self),
-                errorText: function () {
-                    var start = BI.parseDateTime(o.min, "%Y-%X-%d");
-                    var end = BI.parseDateTime(o.max, "%Y-%X-%d");
-                    return BI.i18nText("BI-Basic_Year_Range_Error",
-                        start.getFullYear(),
-                        end.getFullYear());
-                },
                 listeners: [{
                     eventName: "EVENT_CHANGE",
                     action: function () {
                         self.fireEvent("EVENT_CHANGE");
                     }
+                }, {
+                    eventName: "EVENT_INPUT_CHANGE",
+                    action: function () {
+                        BI.Bubbles.hide("dynamic-year-error");
+                    }
                 }]
             }],
             vgap: 10,
@@ -47,9 +47,7 @@ BI.DynamicYearCard = BI.inherit(BI.Widget, {
 
     _checkDate: function (obj) {
         var o = this.options;
-        var date = BI.DynamicDateHelper.getCalculation({
-            year: (obj.offset === 0 ? -obj.value : +obj.value)
-        });
+        var date = BI.DynamicDateHelper.getCalculation(this._getValue());
 
         return !BI.checkDateVoid(date.getFullYear(), date.getMonth() + 1, date.getDate(), o.min, o.max)[0];
     },
@@ -62,6 +60,15 @@ BI.DynamicYearCard = BI.inherit(BI.Widget, {
         };
     },
 
+    _getErrorText: function () {
+        var o = this.options;
+        var start = BI.parseDateTime(o.min, "%Y-%X-%d");
+        var end = BI.parseDateTime(o.max, "%Y-%X-%d");
+        return BI.i18nText("BI-Basic_Year_Range_Error",
+            start.getFullYear(),
+            end.getFullYear());
+    },
+
     setMinDate: function(minDate) {
         if (BI.isNotEmptyString(this.options.min)) {
             this.options.min = minDate;
@@ -79,12 +86,30 @@ BI.DynamicYearCard = BI.inherit(BI.Widget, {
         this.item.setValue(this._createValue(BI.DynamicDateCard.TYPE.YEAR, v.year));
     },
 
-    getValue: function () {
+    _getValue: function () {
         var value = this.item.getValue();
         return {
             year: (value.offset === 0 ? -value.value : +value.value)
         };
+    },
+
+    getValue: function () {
+        return this.checkValidation() ? this._getValue() : {};
+    },
+
+    checkValidation: function (show) {
+        var errorText;
+        var invalid = !this.item.checkValidation();
+        if (invalid) {
+            errorText = BI.i18nText("BI-Please_Input_Natural_Number");
+        } else {
+            invalid = !this._checkDate(this._getValue());
+            errorText = this._getErrorText();
         }
+        invalid && show && BI.Bubbles.show("dynamic-year-error", errorText, this.wrapper);
+
+        return !invalid;
+    },
 });
 BI.DynamicYearCard.EVENT_CHANGE = "EVENT_CHANGE";
 BI.shortcut("bi.dynamic_year_card", BI.DynamicYearCard);

src/widget/year/popup.year.js

@@ -67,8 +67,13 @@ BI.DynamicYearPopup = BI.inherit(BI.Widget, {
                         listeners: [{
                             eventName: BI.TextButton.EVENT_CHANGE,
                             action: function () {
+                                var type = self.dateTab.getSelect();
+                                if (type === BI.DynamicDateCombo.Dynamic) {
+                                    self.dynamicPane.checkValidation(true) && self.fireEvent(BI.DynamicYearMonthPopup.BUTTON_OK_EVENT_CHANGE);
+                                } else {
                                     self.fireEvent(BI.DynamicYearPopup.BUTTON_OK_EVENT_CHANGE);
                                 }
+                            }
                         }]
                     }]],
                     height: 24

src/widget/yearmonth/card.dynamic.yearmonth.js

@@ -15,6 +15,9 @@ BI.DynamicYearMonthCard = BI.inherit(BI.Widget, {
         var self = this;
         return {
             type: "bi.vertical",
+            ref: function (_ref) {
+                self.wrapper = _ref;
+            },
             items: [{
                 type: "bi.label",
                 text: BI.i18nText("BI-Multi_Date_Relative_Current_Time"),
@@ -23,7 +26,6 @@ BI.DynamicYearMonthCard = BI.inherit(BI.Widget, {
             }, {
                 type: "bi.dynamic_date_param_item",
                 validationChecker: BI.bind(self._checkDate, self),
-                errorText: BI.bind(this._errorTextGetter, this),
                 ref: function () {
                     self.year = this;
                 },
@@ -32,11 +34,14 @@ BI.DynamicYearMonthCard = BI.inherit(BI.Widget, {
                     action: function () {
                         self.fireEvent("EVENT_CHANGE");
                     }
+                }, {
+                    eventName: "EVENT_INPUT_CHANGE",
+                    action: function () {
+                        BI.Bubbles.hide("dynamic-year-month-error");
+                    }
                 }]
             }, {
                 type: "bi.dynamic_date_param_item",
-                validationChecker: BI.bind(self._checkDate, self),
-                errorText: BI.bind(this._errorTextGetter, this),
                 dateType: BI.DynamicDateCard.TYPE.MONTH,
                 ref: function () {
                     self.month = this;
@@ -46,6 +51,11 @@ BI.DynamicYearMonthCard = BI.inherit(BI.Widget, {
                     action: function () {
                         self.fireEvent("EVENT_CHANGE");
                     }
+                }, {
+                    eventName: "EVENT_INPUT_CHANGE",
+                    action: function () {
+                        BI.Bubbles.hide("dynamic-year-month-error");
+                    }
                 }]
             }],
             vgap: 10,
@@ -53,7 +63,7 @@ BI.DynamicYearMonthCard = BI.inherit(BI.Widget, {
         };
     },
 
-    _errorTextGetter: function () {
+    _getErrorText: function () {
         var o = this.options;
         var start = BI.parseDateTime(o.min, "%Y-%X-%d");
         var end = BI.parseDateTime(o.max, "%Y-%X-%d");
@@ -67,7 +77,7 @@ BI.DynamicYearMonthCard = BI.inherit(BI.Widget, {
 
     _checkDate: function (obj) {
         var o = this.options;
-        var date = BI.DynamicDateHelper.getCalculation(BI.extend(this.getValue(), this._digestDateTypeValue(obj)));
+        var date = BI.DynamicDateHelper.getCalculation(BI.extend(this._getValue(), this._digestDateTypeValue(obj)));
 
         return !BI.checkDateVoid(date.getFullYear(), date.getMonth() + 1, date.getDate(), o.min, o.max)[0];
     },
@@ -113,14 +123,34 @@ BI.DynamicYearMonthCard = BI.inherit(BI.Widget, {
         this.month.setValue(this._createValue(BI.DynamicDateCard.TYPE.MONTH, v.month));
     },
 
-    getValue: function () {
+    _getValue: function () {
         var year = this.year.getValue();
         var month = this.month.getValue();
         return {
             year: (year.offset === 0 ? -year.value : year.value),
             month: (month.offset === 0 ? -month.value : month.value)
         };
+    },
+
+    getValue: function () {
+        return this.checkValidation() ? this._getValue() : {};
+    },
+
+    checkValidation: function (show) {
+        var errorText;
+        var yearInvalid = !this.year.checkValidation();
+        var monthInvalid = !this.month.checkValidation();
+        var invalid = yearInvalid || monthInvalid;
+        if (invalid) {
+            errorText = BI.i18nText("BI-Please_Input_Natural_Number");
+        } else {
+            invalid = !this._checkDate(this._getValue());
+            errorText = this._getErrorText();
         }
+        invalid && show && BI.Bubbles.show("dynamic-year-month-error", errorText, this.wrapper);
+
+        return !invalid;
+    },
 });
 BI.DynamicYearMonthCard.EVENT_CHANGE = "EVENT_CHANGE";
 BI.shortcut("bi.dynamic_year_month_card", BI.DynamicYearMonthCard);

src/widget/yearmonth/popup.yearmonth.js

@@ -67,8 +67,13 @@ BI.DynamicYearMonthPopup = BI.inherit(BI.Widget, {
                         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: 24

src/widget/yearquarter/card.dynamic.yearquarter.js

@@ -15,6 +15,9 @@ BI.DynamicYearQuarterCard = BI.inherit(BI.Widget, {
         var self = this;
         return {
             type: "bi.vertical",
+            ref: function (_ref) {
+                self.wrapper = _ref;
+            },
             items: [{
                 type: "bi.label",
                 text: BI.i18nText("BI-Multi_Date_Relative_Current_Time"),
@@ -23,7 +26,6 @@ BI.DynamicYearQuarterCard = BI.inherit(BI.Widget, {
             }, {
                 type: "bi.dynamic_date_param_item",
                 validationChecker: BI.bind(self._checkDate, self),
-                errorText: BI.bind(this._errorTextGetter, this),
                 ref: function () {
                     self.year = this;
                 },
@@ -32,11 +34,14 @@ BI.DynamicYearQuarterCard = BI.inherit(BI.Widget, {
                     action: function () {
                         self.fireEvent("EVENT_CHANGE");
                     }
+                }, {
+                    eventName: "EVENT_INPUT_CHANGE",
+                    action: function () {
+                        BI.Bubbles.hide("dynamic-year-quarter-error");
+                    }
                 }]
             }, {
                 type: "bi.dynamic_date_param_item",
-                validationChecker: BI.bind(self._checkDate, self),
-                errorText: BI.bind(this._errorTextGetter, this),
                 dateType: BI.DynamicDateCard.TYPE.QUARTER,
                 ref: function () {
                     self.quarter = this;
@@ -46,6 +51,11 @@ BI.DynamicYearQuarterCard = BI.inherit(BI.Widget, {
                     action: function () {
                         self.fireEvent("EVENT_CHANGE");
                     }
+                }, {
+                    eventName: "EVENT_INPUT_CHANGE",
+                    action: function () {
+                        BI.Bubbles.hide("dynamic-year-quarter-error");
+                    }
                 }]
             }],
             vgap: 10,
@@ -53,7 +63,7 @@ BI.DynamicYearQuarterCard = BI.inherit(BI.Widget, {
         };
     },
 
-    _errorTextGetter: function () {
+    _getErrorText: function () {
         var o = this.options;
         var start = BI.parseDateTime(o.min, "%Y-%X-%d");
         var end = BI.parseDateTime(o.max, "%Y-%X-%d");
@@ -67,7 +77,7 @@ BI.DynamicYearQuarterCard = BI.inherit(BI.Widget, {
 
     _checkDate: function (obj) {
         var o = this.options;
-        var date = BI.DynamicDateHelper.getCalculation(BI.extend(this.getValue(), this._digestDateTypeValue(obj)));
+        var date = BI.DynamicDateHelper.getCalculation(BI.extend(this._getValue(), this._digestDateTypeValue(obj)));
 
         return !BI.checkDateVoid(date.getFullYear(), date.getMonth() + 1, date.getDate(), o.min, o.max)[0];
     },
@@ -113,14 +123,34 @@ BI.DynamicYearQuarterCard = BI.inherit(BI.Widget, {
         this.quarter.setValue(this._createValue(BI.DynamicDateCard.TYPE.QUARTER, v.quarter));
     },
 
-    getValue: function () {
+    _getValue: function () {
         var year = this.year.getValue();
         var quarter = this.quarter.getValue();
         return {
             year: (year.offset === 0 ? -year.value : year.value),
             quarter: (quarter.offset === 0 ? -quarter.value : quarter.value)
         };
+    },
+
+    getValue: function () {
+        return this.checkValidation() ? this._getValue() : {};
+    },
+
+    checkValidation: function (show) {
+        var errorText;
+        var yearInvalid = !this.year.checkValidation();
+        var quarterInvalid = !this.quarter.checkValidation();
+        var invalid = yearInvalid || quarterInvalid;
+        if (invalid) {
+            errorText = BI.i18nText("BI-Please_Input_Natural_Number");
+        } else {
+            invalid = !this._checkDate(this._getValue());
+            errorText = this._getErrorText();
         }
+        invalid && show && BI.Bubbles.show("dynamic-year-quarter-error", errorText, this.wrapper);
+
+        return !invalid;
+    },
 });
 BI.DynamicYearQuarterCard.EVENT_CHANGE = "EVENT_CHANGE";
 BI.shortcut("bi.dynamic_year_quarter_card", BI.DynamicYearQuarterCard);

src/widget/yearquarter/popup.yearquarter.js

@@ -60,8 +60,13 @@ BI.DynamicYearQuarterPopup = BI.inherit(BI.Widget, {
                         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.DynamicDatePopup.BUTTON_OK_EVENT_CHANGE);
+                                } else {
                                     self.fireEvent(BI.DynamicYearQuarterPopup.BUTTON_OK_EVENT_CHANGE);
                                 }
+                            }
                         }]
                     }]],
                     height: 24