prevent dispatch form event

when component import an Input, prevent dispatch event from Input to
Form

examples/routers/form.vue

@@ -1,35 +1,48 @@
 <template>
-    <i-form ref="formInline" :model="formInline" :rules="ruleInline" inline>
+    <div>
-        <Form-item prop="user">
+        date: {{ formInline.date }}
-            <Input type="text" v-model="formInline.user" placeholder="Username">
+        <i-form ref="formInline" :model="formInline" :rules="ruleInline">
-                <Icon type="ios-person-outline" slot="prepend"></Icon>
+            <Form-item prop="date">
-            </Input>
+                <Date-picker type="date" placeholder="选择日期" v-model="formInline.date"></Date-picker>
-        </Form-item>
+            </Form-item>
-        <Form-item prop="password">
+            <Form-item prop="user">
-            <Input type="password" v-model="formInline.password" placeholder="Password">
+                <Input v-model="formInline.user">
-                <Icon type="ios-locked-outline" slot="prepend"></Icon>
+            </Form-item>
-            </Input>
+            <Form-item>
-        </Form-item>
+                <i-button type="primary" @click.native="handleSubmit('formInline')">登录</i-button>
-        <Form-item>
+            </Form-item>
-            <Button type="primary" @click.native="handleSubmit('formInline')">登录</Button>
+        </i-form>
-        </Form-item>
+    </div>
-    </i-form>
 </template>
 <script>
     export default {
         data () {
             return {
                 formInline: {
-                    user: '',
+                    date: new Date(),
-                    password: ''
+                    user: ''
                 },
                 ruleInline: {
-                    user: [
+                    date: [
-                        { required: true, message: '请填写用户名', trigger: 'blur' }
+                        {
+                            required: true,
+                            type: 'date',
+                            message: '请选择日期',
+                            trigger: 'change'
+                        }
                     ],
-                    password: [
+                    user: [
-                        { required: true, message: '请填写密码', trigger: 'blur' },
+                        {
-                        { type: 'string', min: 6, message: '密码长度不能小于6位', trigger: 'blur' }
+                            required: true,
+                            message: '请输入',
+                            trigger: 'change',
+                            min: 10
+                        },
+                        {
+                            required: true,
+                            message: '请输入2',
+                            trigger: 'blur'
+                        }
                     ]
                 }
             }
@@ -38,11 +51,14 @@
             handleSubmit(name) {
                 this.$refs[name].validate((valid) => {
                     if (valid) {
-                        console.log('success');
+                        this.$Message.success('提交成功!');
                     } else {
-                        console.log('fail')
+                        this.$Message.error('表单验证失败!');
                     }
                 })
+            },
+            handleInput (val) {
+                console.log(val)
             }
         }
     }

examples/routers/message.vue

@@ -1,20 +1,22 @@
 <template>
-    <i-button @click.native="time">显示一个10秒的提示</i-button>
+    <div>
+        <i-button @click.native="success">显示成功提示</i-button>
+        <i-button @click.native="warning">显示警告提示</i-button>
+        <i-button @click.native="error">显示错误提示</i-button>
+    </div>
 </template>
 <script>
     export default {
         methods: {
-            time () {
+            success () {
-                this.$Message.info('我将在10秒后消失', 3, () => {
+                this.$Message.success('这是一条成功的提示');
-                    console.log(1111)
+            },
-                });
+            warning () {
+                this.$Message.warning('这是一条警告的提示');
+            },
+            error () {
+                this.$Message.error('对方不想说话，并且向你抛出了一个异常');
             }
-        },
-        mounted () {
-            this.$Message.config({
-                top: 50,
-                duration: 3
-            });
         }
     }
 </script>

src/components/base/notification/notification.vue

@@ -2,7 +2,7 @@
     <div :class="classes" :style="styles">
         <Notice
             v-for="notice in notices"
-            :key="notice"
+            :key="notice.name"
             :prefix-cls="prefixCls"
             :styles="notice.styles"
             :content="notice.content"
@@ -15,7 +15,6 @@
     </div>
 </template>
 <script>
-    // todo :key="notice"
     import Notice from './notice.vue';
 
     const prefixCls = 'ivu-notification';

src/components/date-picker/panel/time-range.vue

@@ -57,6 +57,7 @@
     const timePrefixCls = 'ivu-time-picker';
 
     export default {
+        name: 'TimePicker',
         mixins: [ Mixin, Locale ],
         components: { TimeSpinner, Confirm },
         data () {

src/components/date-picker/panel/time.vue

@@ -36,6 +36,7 @@
     const timePrefixCls = 'ivu-time-picker';
 
     export default {
+        name: 'TimePicker',
         mixins: [ Mixin, Locale ],
         components: { TimeSpinner, Confirm },
         data () {

src/components/date-picker/picker.vue

@@ -139,6 +139,7 @@
     };
 
     export default {
+        name: 'CalendarPicker',
         mixins: [ Emitter ],
         components: { iInput, Drop },
         directives: { clickoutside },
@@ -344,6 +345,7 @@
                 this.visualValue = correctValue;
                 event.target.value = correctValue;
                 this.internalValue = correctDate;
+                this.currentValue = correctDate;
 
                 if (correctValue !== oldValue) this.emitChange(correctDate);
             },
@@ -418,6 +420,12 @@
                 this.picker.resetView && this.picker.resetView();
             },
             emitChange (date) {
+                const newDate = this.formattingDate(date);
+
+                this.$emit('on-change', newDate);
+                this.dispatch('FormItem', 'on-form-change', newDate);
+            },
+            formattingDate (date) {
                 const type = this.type;
                 const format = this.format || DEFAULT_FORMATS[type];
                 const formatter = (
@@ -429,9 +437,7 @@
                 if (type === 'daterange' || type === 'timerange') {
                     newDate = [newDate.split(RANGE_SEPARATOR)[0], newDate.split(RANGE_SEPARATOR)[1]];
                 }
-
+                return newDate;
-                this.$emit('on-change', newDate);
-                this.dispatch('FormItem', 'on-form-change', newDate);
             }
         },
         watch: {
@@ -450,7 +456,7 @@
                 if (!val && this.picker && typeof this.picker.handleClear === 'function') {
                     this.picker.handleClear();
                 }
-                this.$emit('input', val);
+//                this.$emit('input', val);
             },
             value (val) {
                 this.currentValue = val;
@@ -492,14 +498,5 @@
         mounted () {
             if (this.open !== null) this.visible = this.open;
         }
-        // todo 事件
-//        events: {
-//            'on-form-blur' () {
-//                return false;
-//            },
-//            'on-form-change' () {
-//                return false;
-//            }
-//        }
     };
 </script>

src/components/input/input.vue

@@ -43,7 +43,7 @@
     </div>
 </template>
 <script>
-    import { oneOf } from '../../utils/assist';
+    import { oneOf, findComponentUpward } from '../../utils/assist';
     import calcTextareaHeight from '../../utils/calcTextareaHeight';
     import Emitter from '../../mixins/emitter';
 
@@ -152,7 +152,9 @@
             },
             handleBlur () {
                 this.$emit('on-blur');
-                this.dispatch('FormItem', 'on-form-blur', this.currentValue);
+                if (!findComponentUpward(this, ['DatePicker', 'TimePicker'])) {
+                    this.dispatch('FormItem', 'on-form-blur', this.currentValue);
+                }
             },
             handleInput (event) {
                 const value = event.target.value;
@@ -169,7 +171,9 @@
                     this.resizeTextarea();
                 });
                 this.currentValue = value;
-                this.dispatch('FormItem', 'on-form-change', value);
+                if (!findComponentUpward(this, ['DatePicker', 'TimePicker'])) {
+                    this.dispatch('FormItem', 'on-form-change', value);
+                }
             },
             resizeTextarea () {
                 const autosize = this.autosize;

src/utils/assist.js

@@ -166,3 +166,21 @@ export function scrollTop(el, from = 0, to, duration = 500) {
     }
     scroll(from, to, step);
 }
+
+// Find components upward
+function findComponentUpward (content, componentName, componentNames) {
+    if (typeof componentName === 'string') {
+        componentNames = [componentName];
+    } else {
+        componentNames = componentName;
+    }
+
+    let parent = content.$parent;
+    let name = parent.$options.name;
+    while (parent && (!name || componentNames.indexOf(name) < 0)) {
+        parent = parent.$parent;
+        if (parent) name = parent.$options.name;
+    }
+    return parent;
+}
+export {findComponentUpward};