Commit a8571a5fa17b9772908cf795029d256f58fd30d6
1 parent
62c7f997
update DateTimePicker
update DateTimePicker
Showing
3 changed files
with
18 additions
and
0 deletions
Show diff stats
src/components/date-picker/panel/date.vue
src/components/date-picker/panel/time.vue
| 1 | 1 | <template> |
| 2 | 2 | <div :class="[prefixCls + '-body-wrapper']"> |
| 3 | 3 | <div :class="[prefixCls + '-body']"> |
| 4 | + <div :class="[timePrefixCls + '-header']" v-if="showDate">{{ visibleDate }}</div> | |
| 4 | 5 | <div :class="[prefixCls + '-content']"> |
| 5 | 6 | <time-spinner |
| 6 | 7 | v-ref:time-spinner |
| ... | ... | @@ -44,6 +45,10 @@ |
| 44 | 45 | }, |
| 45 | 46 | value: { |
| 46 | 47 | default: '' |
| 48 | + }, | |
| 49 | + showDate: { | |
| 50 | + type: Boolean, | |
| 51 | + default: false | |
| 47 | 52 | } |
| 48 | 53 | }, |
| 49 | 54 | data () { |
| ... | ... | @@ -64,6 +69,10 @@ |
| 64 | 69 | computed: { |
| 65 | 70 | showSeconds () { |
| 66 | 71 | return (this.format || '').indexOf('ss') !== -1; |
| 72 | + }, | |
| 73 | + visibleDate () { | |
| 74 | + const date = this.date; | |
| 75 | + return `${date.getFullYear()}年 ${date.getMonth() + 1}月`; | |
| 67 | 76 | } |
| 68 | 77 | }, |
| 69 | 78 | watch: { | ... | ... |
src/styles/components/time-picker.less
| ... | ... | @@ -135,7 +135,15 @@ |
| 135 | 135 | } |
| 136 | 136 | &-list { |
| 137 | 137 | width: @time-picker-cells-width-with-date-base; |
| 138 | + max-height: 216px; | |
| 139 | + &:first-child{ | |
| 140 | + border-radius: 0; | |
| 141 | + } | |
| 142 | + &:last-child{ | |
| 143 | + border-radius: 0; | |
| 144 | + } | |
| 138 | 145 | ul{ |
| 146 | + padding: 0 0 192px 0; | |
| 139 | 147 | li{ |
| 140 | 148 | padding: 0 0 0 28px; |
| 141 | 149 | } | ... | ... |