Commit 7c5ccdab4d747b87f628e112db300a0a7cbb98d8
1 parent
f92ef70f
update DatePicker
update DatePicker
Showing
3 changed files
with
72 additions
and
26 deletions
Show diff stats
src/components/date-picker/base/date-table.vue
src/components/date-picker/picker.vue
... | ... | @@ -248,21 +248,47 @@ |
248 | 248 | const value = event.target.value; |
249 | 249 | |
250 | 250 | let correctValue = ''; |
251 | - const format = this.format || DEFAULT_FORMATS[this.type]; | |
252 | - const parsedDate = parseDate(value, format); | |
251 | + let correctDate = ''; | |
252 | + const type = this.type; | |
253 | + const format = this.format || DEFAULT_FORMATS[type]; | |
253 | 254 | |
254 | - if (parsedDate instanceof Date) { | |
255 | - const options = this.options; | |
256 | - if (options.disabledDate && typeof options.disabledDate === 'function' && options.disabledDate(new Date(parsedDate))) { | |
257 | - correctValue = oldValue; | |
255 | + if (type === 'daterange' || type === 'timerange' || type === 'datetimerange') { | |
256 | + const parser = ( | |
257 | + TYPE_VALUE_RESOLVER_MAP[type] || | |
258 | + TYPE_VALUE_RESOLVER_MAP['default'] | |
259 | + ).parser; | |
260 | + | |
261 | + const formatter = ( | |
262 | + TYPE_VALUE_RESOLVER_MAP[type] || | |
263 | + TYPE_VALUE_RESOLVER_MAP['default'] | |
264 | + ).formatter; | |
265 | + | |
266 | + const parsedValue = parser(value, format); | |
267 | + | |
268 | + if (parsedValue) { | |
269 | + // todo 判断disabledDate | |
270 | + correctValue = formatter(parsedValue, format); | |
258 | 271 | } else { |
259 | - correctValue = formatDate(parsedDate, format); | |
272 | + correctValue = oldValue; | |
260 | 273 | } |
274 | + | |
275 | + correctDate = parsedValue; | |
261 | 276 | } else { |
262 | - correctValue = oldValue; | |
263 | - } | |
277 | + const parsedDate = parseDate(value, format); | |
264 | 278 | |
265 | - const correctDate = parseDate(correctValue, format); | |
279 | + if (parsedDate instanceof Date) { | |
280 | + const options = this.options; | |
281 | + if (options.disabledDate && typeof options.disabledDate === 'function' && options.disabledDate(new Date(parsedDate))) { | |
282 | + correctValue = oldValue; | |
283 | + } else { | |
284 | + correctValue = formatDate(parsedDate, format); | |
285 | + } | |
286 | + } else { | |
287 | + correctValue = oldValue; | |
288 | + } | |
289 | + | |
290 | + correctDate = parseDate(correctValue, format); | |
291 | + } | |
266 | 292 | |
267 | 293 | this.visualValue = correctValue; |
268 | 294 | event.target.value = correctValue; | ... | ... |
test/routers/date.vue
... | ... | @@ -17,10 +17,12 @@ |
17 | 17 | <i-col span="8"> |
18 | 18 | <date-picker |
19 | 19 | type="daterange" |
20 | - style="width:200px" | |
20 | + style="width:300px" | |
21 | 21 | placeholder="请选择日期" |
22 | 22 | :value.sync="value2" |
23 | 23 | align="right" |
24 | + :editable="true" | |
25 | + :format="format" | |
24 | 26 | :options="options2"></date-picker> |
25 | 27 | </i-col> |
26 | 28 | </row> |
... | ... | @@ -34,37 +36,52 @@ |
34 | 36 | value: '2016-12-25', |
35 | 37 | value2: ['2016-12-17', '2017-01-05'], |
36 | 38 | options2: { |
39 | +// disabledDate(time) { | |
40 | +//// console.log(time) | |
41 | +//// return time.getFullYear() < 2016; | |
42 | +//// return time.getTime() < Date.now() - 8.64e7; | |
43 | +//// return time && time.valueOf() < Date.now(); | |
44 | +// if (time.getDate() === 22 || time.getDate() === 23) { | |
45 | +// return true; | |
46 | +// } else { | |
47 | +// return false; | |
48 | +// } | |
49 | +// }, | |
37 | 50 | shortcuts: [ |
38 | 51 | { |
39 | - text: '今天', | |
52 | + text: '最近一周', | |
40 | 53 | value () { |
41 | -// return new Date(); | |
42 | - return '1/2/19' | |
54 | + const end = new Date(); | |
55 | + const start = new Date(); | |
56 | + start.setTime(start.getTime() - 3600 * 1000 * 24 * 7); | |
57 | + return [start, end]; | |
43 | 58 | }, |
44 | 59 | onClick (picker) { |
45 | - console.log('点击了今天'); | |
60 | + console.log('点击了最近一周'); | |
46 | 61 | } |
47 | 62 | }, |
48 | 63 | { |
49 | - text: '昨天', | |
64 | + text: '最近一个月', | |
50 | 65 | value () { |
51 | - const date = new Date(); | |
52 | - date.setTime(date.getTime() - 3600 * 1000 * 24); | |
53 | - return date; | |
66 | + const end = new Date(); | |
67 | + const start = new Date(); | |
68 | + start.setTime(start.getTime() - 3600 * 1000 * 24 * 30); | |
69 | + return [start, end]; | |
54 | 70 | }, |
55 | 71 | onClick () { |
56 | - console.log('点击了昨天'); | |
72 | + console.log('点击了最近一个月'); | |
57 | 73 | } |
58 | 74 | }, |
59 | 75 | { |
60 | 76 | text: '最近三个月', |
61 | 77 | value () { |
62 | - const date = new Date(); | |
63 | - date.setTime(date.getTime() - 3600 * 1000 * 24 * 7); | |
64 | - return date; | |
78 | + const end = new Date(); | |
79 | + const start = new Date(); | |
80 | + start.setTime(start.getTime() - 3600 * 1000 * 24 * 90); | |
81 | + return [start, end]; | |
65 | 82 | }, |
66 | 83 | onClick () { |
67 | - console.log('点击了一周前'); | |
84 | + console.log('点击了最近三个月'); | |
68 | 85 | } |
69 | 86 | } |
70 | 87 | ] | ... | ... |