From a2a78c382f7ceadd270b590ff6c7c275de6cbc85 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=A2=81=E7=81=8F?= <admin@aresn.com>
Date: Fri, 30 Dec 2016 17:54:27 +0800
Subject: [PATCH] update DateTimePicker

update DateTimePicker
---
 .../date-picker/panel/date-range.vue          |  9 ++++++--
 src/components/date-picker/panel/date.vue     |  4 +++-
 .../date-picker/panel/time-range.vue          | 22 +++++++++++++++++--
 src/components/date-picker/panel/time.vue     | 11 ++++------
 4 files changed, 34 insertions(+), 12 deletions(-)

diff --git a/src/components/date-picker/panel/date-range.vue b/src/components/date-picker/panel/date-range.vue
index b7d92e11..aed152c8 100644
--- a/src/components/date-picker/panel/date-range.vue
+++ b/src/components/date-picker/panel/date-range.vue
@@ -117,7 +117,8 @@
                 <time-picker
                     v-ref:time-picker
                     v-show="isTime"
-                    @on-pick="handleTimePick"></time-picker>
+                    @on-pick="handleTimePick"
+                    @on-pick-click="handlePickClick"></time-picker>
             </div>
             <Confirm
                 v-if="confirm"
@@ -145,6 +146,7 @@
     const datePrefixCls = 'ivu-date-picker';
 
     export default {
+        name: 'DatePicker',
         mixins: [Mixin],
         components: { Icon, DateTable, YearTable, MonthTable, TimePicker, Confirm },
         data () {
@@ -287,12 +289,14 @@
                 this.handleConfirm();
                 if (this.showTime) this.$refs.timePicker.handleClear();
             },
-            resetView() {
+            resetView(reset = false) {
                 this.leftCurrentView = 'date';
                 this.rightCurrentView = 'date';
 
                 this.leftTableYear = this.leftYear;
                 this.rightTableYear = this.rightYear;
+
+                if (reset) this.isTime = false;
             },
             prevYear (direction) {
                 if (this[`${direction}CurrentView`] === 'year') {
@@ -394,6 +398,7 @@
         },
         compiled () {
             if (this.showTime) {
+                // todo 这里也到不了
                 this.$refs.timePicker.date = this.minDate;
                 this.$refs.timePicker.dateEnd = this.maxDate;
                 this.$refs.timePicker.value = this.value;
diff --git a/src/components/date-picker/panel/date.vue b/src/components/date-picker/panel/date.vue
index 64a2cccd..38b7682f 100644
--- a/src/components/date-picker/panel/date.vue
+++ b/src/components/date-picker/panel/date.vue
@@ -63,7 +63,8 @@
                     v-ref:time-picker
                     show-date
                     v-show="currentView === 'time'"
-                    @on-pick="handleTimePick"></time-picker>
+                    @on-pick="handleTimePick"
+                    @on-pick-click="handlePickClick"></time-picker>
             </div>
             <Confirm
                 v-if="confirm"
@@ -91,6 +92,7 @@
     const datePrefixCls = 'ivu-date-picker';
 
     export default {
+        name: 'DatePicker',
         mixins: [Mixin],
         components: { Icon, DateTable, YearTable, MonthTable, TimePicker, Confirm },
         data () {
diff --git a/src/components/date-picker/panel/time-range.vue b/src/components/date-picker/panel/time-range.vue
index 2caa5cc0..d36cb518 100644
--- a/src/components/date-picker/panel/time-range.vue
+++ b/src/components/date-picker/panel/time-range.vue
@@ -2,7 +2,10 @@
     <div :class="classes">
         <div :class="[prefixCls + '-body']">
             <div :class="[prefixCls + '-content', prefixCls + '-content-left']">
-                <div :class="[timePrefixCls + '-header']">开始时间</div>
+                <div :class="[timePrefixCls + '-header']">
+                    <template v-if="showDate">{{ visibleDate }}</template>
+                    <template v-else>开始时间</template>
+                </div>
                 <time-spinner
                     v-ref:time-spinner
                     :show-seconds="showSeconds"
@@ -17,7 +20,10 @@
                     @on-pick-click="handlePickClick"></time-spinner>
             </div>
             <div :class="[prefixCls + '-content', prefixCls + '-content-right']">
-                <div :class="[timePrefixCls + '-header']">结束时间</div>
+                <div :class="[timePrefixCls + '-header']">
+                    <template v-if="showDate">{{ visibleDateEnd }}</template>
+                    <template v-else>结束时间</template>
+                </div>
                 <time-spinner
                     v-ref:time-spinner-end
                     :show-seconds="showSeconds"
@@ -57,6 +63,7 @@
                 prefixCls: prefixCls,
                 timePrefixCls: timePrefixCls,
                 format: 'HH:mm:ss',
+                showDate: false,
                 date: initTimeDate(),
                 dateEnd: initTimeDate(),
                 value: '',
@@ -85,6 +92,14 @@
             },
             showSeconds () {
                 return (this.format || '').indexOf('ss') !== -1;
+            },
+            visibleDate () {
+                const date = this.date || initTimeDate();
+                return `${date.getFullYear()}年 ${date.getMonth() + 1}月`;
+            },
+            visibleDateEnd () {
+                const date = this.dateEnd || initTimeDate();
+                return `${date.getFullYear()}年 ${date.getMonth() + 1}月`;
             }
         },
         watch: {
@@ -177,6 +192,9 @@
                 this.$refs.timeSpinner.updateScroll();
                 this.$refs.timeSpinnerEnd.updateScroll();
             }
+        },
+        compiled () {
+            if (this.$parent && this.$parent.$options.name === 'DatePicker') this.showDate = true;
         }
     };
 </script>
\ No newline at end of file
diff --git a/src/components/date-picker/panel/time.vue b/src/components/date-picker/panel/time.vue
index 0c0fa60f..d03807c3 100644
--- a/src/components/date-picker/panel/time.vue
+++ b/src/components/date-picker/panel/time.vue
@@ -37,19 +37,13 @@
     export default {
         mixins: [Mixin],
         components: { TimeSpinner, Confirm },
-        props: {
-            showDate: {
-                type: Boolean,
-                default: false
-            }
-        },
         data () {
             return {
                 prefixCls: prefixCls,
                 timePrefixCls: timePrefixCls,
                 date: initTimeDate(),
                 value: '',
-//                showDate: false,
+                showDate: false,
                 format: 'HH:mm:ss',
                 hours: '',
                 minutes: '',
@@ -109,6 +103,9 @@
             updateScroll () {
                 this.$refs.timeSpinner.updateScroll();
             }
+        },
+        compiled () {
+            if (this.$parent && this.$parent.$options.name === 'DatePicker') this.showDate = true;
         }
     };
 </script>
\ No newline at end of file