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,21 +248,47 @@ | ||
| 248 | const value = event.target.value; | 248 | const value = event.target.value; |
| 249 | 249 | ||
| 250 | let correctValue = ''; | 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 | } else { | 271 | } else { |
| 259 | - correctValue = formatDate(parsedDate, format); | 272 | + correctValue = oldValue; |
| 260 | } | 273 | } |
| 274 | + | ||
| 275 | + correctDate = parsedValue; | ||
| 261 | } else { | 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 | this.visualValue = correctValue; | 293 | this.visualValue = correctValue; |
| 268 | event.target.value = correctValue; | 294 | event.target.value = correctValue; |
test/routers/date.vue
| @@ -17,10 +17,12 @@ | @@ -17,10 +17,12 @@ | ||
| 17 | <i-col span="8"> | 17 | <i-col span="8"> |
| 18 | <date-picker | 18 | <date-picker |
| 19 | type="daterange" | 19 | type="daterange" |
| 20 | - style="width:200px" | 20 | + style="width:300px" |
| 21 | placeholder="请选择日期" | 21 | placeholder="请选择日期" |
| 22 | :value.sync="value2" | 22 | :value.sync="value2" |
| 23 | align="right" | 23 | align="right" |
| 24 | + :editable="true" | ||
| 25 | + :format="format" | ||
| 24 | :options="options2"></date-picker> | 26 | :options="options2"></date-picker> |
| 25 | </i-col> | 27 | </i-col> |
| 26 | </row> | 28 | </row> |
| @@ -34,37 +36,52 @@ | @@ -34,37 +36,52 @@ | ||
| 34 | value: '2016-12-25', | 36 | value: '2016-12-25', |
| 35 | value2: ['2016-12-17', '2017-01-05'], | 37 | value2: ['2016-12-17', '2017-01-05'], |
| 36 | options2: { | 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 | shortcuts: [ | 50 | shortcuts: [ |
| 38 | { | 51 | { |
| 39 | - text: '今天', | 52 | + text: '最近一周', |
| 40 | value () { | 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 | onClick (picker) { | 59 | onClick (picker) { |
| 45 | - console.log('点击了今天'); | 60 | + console.log('点击了最近一周'); |
| 46 | } | 61 | } |
| 47 | }, | 62 | }, |
| 48 | { | 63 | { |
| 49 | - text: '昨天', | 64 | + text: '最近一个月', |
| 50 | value () { | 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 | onClick () { | 71 | onClick () { |
| 56 | - console.log('点击了昨天'); | 72 | + console.log('点击了最近一个月'); |
| 57 | } | 73 | } |
| 58 | }, | 74 | }, |
| 59 | { | 75 | { |
| 60 | text: '最近三个月', | 76 | text: '最近三个月', |
| 61 | value () { | 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 | onClick () { | 83 | onClick () { |
| 67 | - console.log('点击了一周前'); | 84 | + console.log('点击了最近三个月'); |
| 68 | } | 85 | } |
| 69 | } | 86 | } |
| 70 | ] | 87 | ] |