iview TimePicker实现选择时间段


<FormItem label="拜访时间" prop="fromHospital">
<TimePicker
v-model="value"
format="HH:mm"
:value="value"
type="timerange"
placement="bottom-start"
placeholder="Select time"
style="width:310px"
@on-change="getDuration"></TimePicker>
</FormItem>




getDuration () {
var startTime = this.value[0].split(':')
var endTime = this.value[1].split(':')
console.log(this.value[0])
console.log(this.value[1])
this.formItem.clinicalStartTimeStr = this.value[0]
this.formItem.clinicalEndTimeStr = this.value[1]
var time = (parseInt(endTime[0]) * 60 + parseInt(endTime[1])) - (parseInt(startTime[0]) * 60 + parseInt(startTime[1]))
// 小时数
var hour = parseInt(time / 60)
var minute = time % 60
if (hour > 0) {
// return hour+"小时"+minute+"分钟"
if (hour) {
this.formValidate.duration = hour + '小时' + minute + '分钟'
} else {
this.formValidate.duration = ''
}
} else {
if (!isNaN(minute)) {
this.formValidate.duration = minute + '分钟'
} else {
this.formValidate.duration = ''
}
}
},
posted @ 2020-06-03 14:39  nlovestudy  阅读(1455)  评论(0编辑  收藏  举报