other / mew-iview

Commit a2a78c382f7ceadd270b590ff6c7c275de6cbc85

Authored by 梁灏
1 parent 2dc27713

update DateTimePicker 

update DateTimePicker
Showing 4 changed files with 34 additions and 12 deletions   Show diff stats
Inline Side-by-side
src/components/date-picker/panel/date-range.vue
  Show/Hide comments   View file @a2a78c3
... ... @@ -117,7 +117,8 @@
117 117 <time-picker
118 118 v-ref:time-picker
119 119 v-show="isTime"
120   - @on-pick="handleTimePick"></time-picker>
  120 + @on-pick="handleTimePick"
  121 + @on-pick-click="handlePickClick"></time-picker>
121 122 </div>
122 123 <Confirm
123 124 v-if="confirm"
... ... @@ -145,6 +146,7 @@
145 146 const datePrefixCls = 'ivu-date-picker';
146 147  
147 148 export default {
  149 + name: 'DatePicker',
148 150 mixins: [Mixin],
149 151 components: { Icon, DateTable, YearTable, MonthTable, TimePicker, Confirm },
150 152 data () {
... ... @@ -287,12 +289,14 @@
287 289 this.handleConfirm();
288 290 if (this.showTime) this.$refs.timePicker.handleClear();
289 291 },
290   - resetView() {
  292 + resetView(reset = false) {
291 293 this.leftCurrentView = 'date';
292 294 this.rightCurrentView = 'date';
293 295  
294 296 this.leftTableYear = this.leftYear;
295 297 this.rightTableYear = this.rightYear;
  298 +
  299 + if (reset) this.isTime = false;
296 300 },
297 301 prevYear (direction) {
298 302 if (this[`${direction}CurrentView`] === 'year') {
... ... @@ -394,6 +398,7 @@
394 398 },
395 399 compiled () {
396 400 if (this.showTime) {
  401 + // todo 这里也到不了
397 402 this.$refs.timePicker.date = this.minDate;
398 403 this.$refs.timePicker.dateEnd = this.maxDate;
399 404 this.$refs.timePicker.value = this.value;
... ...
src/components/date-picker/panel/date.vue
  Show/Hide comments   View file @a2a78c3
... ... @@ -63,7 +63,8 @@
63 63 v-ref:time-picker
64 64 show-date
65 65 v-show="currentView === 'time'"
66   - @on-pick="handleTimePick"></time-picker>
  66 + @on-pick="handleTimePick"
  67 + @on-pick-click="handlePickClick"></time-picker>
67 68 </div>
68 69 <Confirm
69 70 v-if="confirm"
... ... @@ -91,6 +92,7 @@
91 92 const datePrefixCls = 'ivu-date-picker';
92 93  
93 94 export default {
  95 + name: 'DatePicker',
94 96 mixins: [Mixin],
95 97 components: { Icon, DateTable, YearTable, MonthTable, TimePicker, Confirm },
96 98 data () {
... ...
src/components/date-picker/panel/time-range.vue
  Show/Hide comments   View file @a2a78c3
... ... @@ -2,7 +2,10 @@
2 2 <div :class="classes">
3 3 <div :class="[prefixCls + '-body']">
4 4 <div :class="[prefixCls + '-content', prefixCls + '-content-left']">
5   - <div :class="[timePrefixCls + '-header']">开始时间</div>
  5 + <div :class="[timePrefixCls + '-header']">
  6 + <template v-if="showDate">{{ visibleDate }}</template>
  7 + <template v-else>开始时间</template>
  8 + </div>
6 9 <time-spinner
7 10 v-ref:time-spinner
8 11 :show-seconds="showSeconds"
... ... @@ -17,7 +20,10 @@
17 20 @on-pick-click="handlePickClick"></time-spinner>
18 21 </div>
19 22 <div :class="[prefixCls + '-content', prefixCls + '-content-right']">
20   - <div :class="[timePrefixCls + '-header']">结束时间</div>
  23 + <div :class="[timePrefixCls + '-header']">
  24 + <template v-if="showDate">{{ visibleDateEnd }}</template>
  25 + <template v-else>结束时间</template>
  26 + </div>
21 27 <time-spinner
22 28 v-ref:time-spinner-end
23 29 :show-seconds="showSeconds"
... ... @@ -57,6 +63,7 @@
57 63 prefixCls: prefixCls,
58 64 timePrefixCls: timePrefixCls,
59 65 format: 'HH:mm:ss',
  66 + showDate: false,
60 67 date: initTimeDate(),
61 68 dateEnd: initTimeDate(),
62 69 value: '',
... ... @@ -85,6 +92,14 @@
85 92 },
86 93 showSeconds () {
87 94 return (this.format || '').indexOf('ss') !== -1;
  95 + },
  96 + visibleDate () {
  97 + const date = this.date || initTimeDate();
  98 + return `${date.getFullYear()}年 ${date.getMonth() + 1}月`;
  99 + },
  100 + visibleDateEnd () {
  101 + const date = this.dateEnd || initTimeDate();
  102 + return `${date.getFullYear()}年 ${date.getMonth() + 1}月`;
88 103 }
89 104 },
90 105 watch: {
... ... @@ -177,6 +192,9 @@
177 192 this.$refs.timeSpinner.updateScroll();
178 193 this.$refs.timeSpinnerEnd.updateScroll();
179 194 }
  195 + },
  196 + compiled () {
  197 + if (this.$parent && this.$parent.$options.name === 'DatePicker') this.showDate = true;
180 198 }
181 199 };
182 200 </script>
183 201 \ No newline at end of file
... ...
src/components/date-picker/panel/time.vue
  Show/Hide comments   View file @a2a78c3
... ... @@ -37,19 +37,13 @@
37 37 export default {
38 38 mixins: [Mixin],
39 39 components: { TimeSpinner, Confirm },
40   - props: {
41   - showDate: {
42   - type: Boolean,
43   - default: false
44   - }
45   - },
46 40 data () {
47 41 return {
48 42 prefixCls: prefixCls,
49 43 timePrefixCls: timePrefixCls,
50 44 date: initTimeDate(),
51 45 value: '',
52   -// showDate: false,
  46 + showDate: false,
53 47 format: 'HH:mm:ss',
54 48 hours: '',
55 49 minutes: '',
... ... @@ -109,6 +103,9 @@
109 103 updateScroll () {
110 104 this.$refs.timeSpinner.updateScroll();
111 105 }
  106 + },
  107 + compiled () {
  108 + if (this.$parent && this.$parent.$options.name === 'DatePicker') this.showDate = true;
112 109 }
113 110 };
114 111 </script>
115 112 \ No newline at end of file
... ...