Commit 73d10c280be5c99c94cf09411da09d7aa925044a
1 parent
d1703993
update DatePicker
update DatePicker
Showing
3 changed files
with
51 additions
and
6 deletions
Show diff stats
src/components/date-picker/picker.vue
... | ... | @@ -359,6 +359,7 @@ |
359 | 359 | this.internalValue = ''; |
360 | 360 | this.value = ''; |
361 | 361 | this.$emit('on-clear'); |
362 | + this.$dispatch('on-form-change', ''); | |
362 | 363 | }, |
363 | 364 | showPicker () { |
364 | 365 | if (!this.picker) { |
... | ... | @@ -387,11 +388,10 @@ |
387 | 388 | |
388 | 389 | this.picker.$on('on-pick', (date, visible = false) => { |
389 | 390 | if (!this.confirm) this.visible = visible; |
390 | - | |
391 | - this.emitChange(date); | |
392 | 391 | this.value = date; |
393 | 392 | this.picker.value = date; |
394 | 393 | this.picker.resetView && this.picker.resetView(); |
394 | + this.emitChange(date); | |
395 | 395 | }); |
396 | 396 | |
397 | 397 | this.picker.$on('on-pick-clear', () => { |
... | ... | @@ -424,6 +424,7 @@ |
424 | 424 | } |
425 | 425 | |
426 | 426 | this.$emit('on-change', newDate); |
427 | + this.$dispatch('on-form-change', newDate); | |
427 | 428 | } |
428 | 429 | }, |
429 | 430 | watch: { |
... | ... | @@ -478,6 +479,14 @@ |
478 | 479 | }, |
479 | 480 | ready () { |
480 | 481 | if (this.open !== null) this.visible = this.open; |
482 | + }, | |
483 | + events: { | |
484 | + 'on-form-blur' () { | |
485 | + return false; | |
486 | + }, | |
487 | + 'on-form-change' () { | |
488 | + return false; | |
489 | + } | |
481 | 490 | } |
482 | 491 | }; |
483 | 492 | </script> |
... | ... |
test/routers/date.vue
1 | 1 | <template> |
2 | + {{value1}} -- {{ value2 }} | |
2 | 3 | <row> |
3 | 4 | <i-col span="12"> |
4 | - <Time-picker :value="val" type="time" placeholder="选择时间" style="width: 168px"></Time-picker> | |
5 | + <Date-picker :value.sync="value1" format="yyyy年MM月dd日" type="date" placeholder="选择日期" style="width: 200px"></Date-picker> | |
5 | 6 | </i-col> |
6 | 7 | <i-col span="12"> |
7 | - <Time-picker type="timerange" placement="bottom-end" placeholder="选择时间" style="width: 168px"></Time-picker> | |
8 | + <Date-picker :value.sync="value2" format="yyyy/MM/dd" type="daterange" placement="bottom-end" placeholder="选择日期" style="width: 200px"></Date-picker> | |
8 | 9 | </i-col> |
9 | 10 | </row> |
10 | 11 | </template> |
... | ... | @@ -12,7 +13,8 @@ |
12 | 13 | export default { |
13 | 14 | data () { |
14 | 15 | return { |
15 | - val: new Date | |
16 | + value1: '2016-01-01', | |
17 | + value2: ['2016-01-01', '2016-02-15'] | |
16 | 18 | } |
17 | 19 | } |
18 | 20 | } |
... | ... |
test/routers/form.vue
... | ... | @@ -63,6 +63,14 @@ |
63 | 63 | <form-item label="多选滑块" prop="slider"> |
64 | 64 | <Slider :value.sync="form.slider" range></Slider> |
65 | 65 | </form-item> |
66 | + <form-item label="日期" prop="date"> | |
67 | + {{ form.date }} | |
68 | + <Time-picker :value.sync="form.date" type="time" placeholder="选择时间" style="width: 168px"></Time-picker> | |
69 | + </form-item> | |
70 | + <form-item label="两个日期" prop="date2"> | |
71 | + {{ form.date2 | json}} | |
72 | + <Date-picker :value.sync="form.date2" type="daterange" placement="bottom-end" placeholder="选择日期" @on-change="c"></Date-picker> | |
73 | + </form-item> | |
66 | 74 | <form-item> |
67 | 75 | <i-button type="primary" @click="onSubmit('form')">提交</i-button> |
68 | 76 | </form-item> |
... | ... | @@ -108,7 +116,9 @@ |
108 | 116 | checkboxgroup: [], |
109 | 117 | select: '', |
110 | 118 | selectm: [], |
111 | - slider: [40, 50] | |
119 | + slider: [40, 50], | |
120 | + date: '', | |
121 | + date2: '' | |
112 | 122 | }, |
113 | 123 | rules: { |
114 | 124 | mail: [ |
... | ... | @@ -157,6 +167,27 @@ |
157 | 167 | } |
158 | 168 | } |
159 | 169 | } |
170 | + ], | |
171 | + date: [ | |
172 | + { | |
173 | + required: true | |
174 | + }, | |
175 | + { | |
176 | + type: 'date' | |
177 | + } | |
178 | + ], | |
179 | + date2: [ | |
180 | + { | |
181 | + type: 'array', len: 2, | |
182 | + fields: { | |
183 | + 0: { | |
184 | + type: 'date', required: true | |
185 | + }, | |
186 | + 1: { | |
187 | + type: 'date', required: true | |
188 | + } | |
189 | + } | |
190 | + } | |
160 | 191 | ] |
161 | 192 | } |
162 | 193 | } |
... | ... | @@ -172,6 +203,9 @@ |
172 | 203 | return false; |
173 | 204 | } |
174 | 205 | }); |
206 | + }, | |
207 | + c (s) { | |
208 | + console.log(this.form.date) | |
175 | 209 | } |
176 | 210 | } |
177 | 211 | }; |
... | ... |