Commit 73d10c280be5c99c94cf09411da09d7aa925044a

Authored by 梁灏
1 parent d1703993

update DatePicker

update DatePicker
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 };
... ...