drip-public/iview
6
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

update DateTimePicker

Browse source 
update DateTimePicker
This commit is contained in:
梁灏 2016-12-30 13:56:34 +08:00
parent acde7262ef
commit 3693144258
4 changed files with 39 additions and 26 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
src/components/date-picker/panel/date.vue
View file

@ -60,8 +60,8 @@
@on-pick="handleMonthPick" @on-pick="handleMonthPick"
@on-pick-click="handlePickClick"></month-table> @on-pick-click="handlePickClick"></month-table>
<time-picker <time-picker
v-show="currentView === 'time'"
v-ref:time-picker v-ref:time-picker
v-show="currentView === 'time'"
:date="date" :date="date"
:value="value" :value="value"
:format="format" :format="format"
@ -142,6 +142,13 @@
this.year = newVal.getFullYear(); this.year = newVal.getFullYear();
this.month = newVal.getMonth(); this.month = newVal.getMonth();
} }
if (this.showTime) this.$refs.timePicker.value = newVal;
},
date (val) {
if (this.showTime) this.$refs.timePicker.date = val;
},
format (val) {
if (this.showTime) this.$refs.timePicker.format = val;
}, },
currentView (val) { currentView (val) {
if (val === 'time') this.$refs.timePicker.updateScroll(); if (val === 'time') this.$refs.timePicker.updateScroll();
@ -268,6 +275,12 @@
this.year = this.date.getFullYear(); this.year = this.date.getFullYear();
this.month = this.date.getMonth(); this.month = this.date.getMonth();
} }
if (this.showTime) {
this.$refs.timePicker.date = this.date;
this.$refs.timePicker.value = this.value;
this.$refs.timePicker.format = this.format;
this.$refs.timePicker.showDate = true;
}
} }
}; };
</script> </script>

41
src/components/date-picker/panel/time.vue
View file

@ -37,29 +37,32 @@
export default { export default {
mixins: [Mixin], mixins: [Mixin],
components: { TimeSpinner, Confirm }, components: { TimeSpinner, Confirm },
props: { // props: {
date: { // date: {
default () { // default () {
return initTimeDate(); // return initTimeDate();
} // }
}, // },
value: { // value: {
default: '' // default: ''
}, // },
showDate: { // showDate: {
type: Boolean, // type: Boolean,
default: false // default: false
}, // },
format: { // format: {
type: String, // type: String,
default: 'HH:mm:ss' // default: 'HH:mm:ss'
} // }
}, // },
data () { data () {
return { return {
prefixCls: prefixCls, prefixCls: prefixCls,
timePrefixCls: timePrefixCls, timePrefixCls: timePrefixCls,
// format: 'HH:mm:ss', date: initTimeDate(),
value: '',
showDate: false,
format: 'HH:mm:ss',
hours: '', hours: '',
minutes: '', minutes: '',
seconds: '', seconds: '',

3
src/components/date-picker/picker.vue
View file

@ -398,13 +398,10 @@
this.handleClear(); this.handleClear();
}); });
this.picker.$on('on-pick-success', () => { this.picker.$on('on-pick-success', () => {
// this.emitChange(this.value);
this.visible = false; this.visible = false;
this.$emit('on-ok'); this.$emit('on-ok');
}); });
this.picker.$on('on-pick-click', () => this.disableClickOutSide = true); this.picker.$on('on-pick-click', () => this.disableClickOutSide = true);
// todo $on('on-time-range')
} }
if (this.internalValue instanceof Date) { if (this.internalValue instanceof Date) {
this.picker.date = new Date(this.internalValue.getTime()); this.picker.date = new Date(this.internalValue.getTime());

6
test/routers/date.vue
View file

@ -5,9 +5,9 @@
</style> </style>
<template> <template>
<row> <row>
<!--<i-col span="12">--> <i-col span="12">
<!--<date-picker type="date" placeholder="选择日期" style="width: 200px" @on-ok="ok" confirm @on-clear="clear"></date-picker>--> <Time-picker :value="value" type="time" placeholder="选择时间" style="width: 168px"></Time-picker>
<!--</i-col>--> </i-col>
<!--<i-col span="12">--> <!--<i-col span="12">-->
<!--<date-picker :value="value3" type="daterange" placement="bottom-start" placeholder="选择日期" style="width: 200px"></date-picker>--> <!--<date-picker :value="value3" type="daterange" placement="bottom-start" placeholder="选择日期" style="width: 200px"></date-picker>-->
<!--</i-col>--> <!--</i-col>-->