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 12:03:24 +08:00
parent a8571a5fa1
commit acde7262ef
4 changed files with 21 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -64,6 +64,7 @@
v-ref:time-picker v-ref:time-picker
:date="date" :date="date"
:value="value" :value="value"
:format="format"
show-date show-date
@on-pick="handleTimePick"></time-picker> @on-pick="handleTimePick"></time-picker>
</div> </div>
@ -109,7 +110,8 @@
year: null, year: null,
month: null, month: null,
confirm: false, confirm: false,
isTime: false isTime: false,
format: 'yyyy-MM-dd'
}; };
}, },
computed: { computed: {

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

@ -49,13 +49,17 @@
showDate: { showDate: {
type: Boolean, type: Boolean,
default: false default: false
},
format: {
type: String,
default: 'HH:mm:ss'
} }
}, },
data () { data () {
return { return {
prefixCls: prefixCls, prefixCls: prefixCls,
timePrefixCls: timePrefixCls, timePrefixCls: timePrefixCls,
format: 'HH:mm:ss', // format: 'HH:mm:ss',
hours: '', hours: '',
minutes: '', minutes: '',
seconds: '', seconds: '',

14
src/styles/components/time-picker.less
View file

@ -129,12 +129,20 @@
.@{picker-prefix-cls}-panel-content{ .@{picker-prefix-cls}-panel-content{
.@{time-picker-prefix-cls}{ .@{time-picker-prefix-cls}{
&-cells{ &-cells{
min-width: @time-picker-cells-width-with-date; min-width: @time-picker-cells-width-with-date-with-seconds;
&-with-seconds{ &-with-seconds{
min-width: @time-picker-cells-width-with-date-with-seconds; min-width: @time-picker-cells-width-with-date-with-seconds;
.@{time-picker-prefix-cls}-cells-list{
width: @time-picker-cells-width-with-date-with-seconds / 3;
ul{
li{
padding: 0 0 0 28px;
}
}
}
} }
&-list { &-list {
width: @time-picker-cells-width-with-date-base; width: @time-picker-cells-width-with-date-with-seconds / 2;
max-height: 216px; max-height: 216px;
&:first-child{ &:first-child{
border-radius: 0; border-radius: 0;
@ -145,7 +153,7 @@
ul{ ul{
padding: 0 0 192px 0; padding: 0 0 192px 0;
li{ li{
padding: 0 0 0 28px; padding: 0 0 0 46px;
} }
} }
} }

3
test/routers/date.vue
View file

@ -24,7 +24,7 @@
<!--style="width: 168px"></time-picker>--> <!--style="width: 168px"></time-picker>-->
<!--</i-col>--> <!--</i-col>-->
<i-col span="12"> <i-col span="12">
<Date-picker type="datetime" placeholder="选择日期时间" style="width: 200px" @on-change="c"></Date-picker> <Date-picker :value="value1" format="yyyy-MM-dd HH:mm:ss" type="datetime" placeholder="选择日期时间" style="width: 200px" @on-change="c"></Date-picker>
<!--<time-picker--> <!--<time-picker-->
<!--:value="value2"--> <!--:value="value2"-->
<!--type="timerange"--> <!--type="timerange"-->
@ -44,6 +44,7 @@
data () { data () {
return { return {
// value: '2016-12-12 03:03:03', // value: '2016-12-12 03:03:03',
value1: '2015-12-12 09:41',
value: '03:12:01', value: '03:12:01',
value2: ['08:40:00', '09:40:00'], value2: ['08:40:00', '09:40:00'],
// value2: [new Date(), new Date()], // value2: [new Date(), new Date()],