sadjv3_jishi/pages/my/scrollbarPicker.vue

160 lines
2.5 KiB
Vue

<template>
<div class="telly-item">
<telly-picker :value="value3" :showClear='false' :range="pickData" :rangekey="rangekey3"
:placeholderText="placeholderText" @bindChange="multibindChange" @cancel="cancel" @confirm="multiconfirm">
</telly-picker>
</div>
</template>
<script>
//import VuePicker from 'vue-pickers'
const tdata = [
{
"hour": '00',
},
{
"hour": '01',
},
{
"hour": '02',
},
{
"hour": '03',
},
{
"hour": '04',
},
{
"hour": '05',
},
{
"hour": '06',
},
{
"hour": '07',
},
{
"hour": '08',
},
{
"hour": '09',
},
{
"hour": '10',
},
{
"hour": '11',
},
{
"hour": '12',
},
{
"hour": '13',
},
{
"hour": '14',
},
{
"hour": '15',
},
{
"hour": '16',
},
{
"hour": '17',
},
{
"hour":'18',
},
{
"hour": '19',
},
{
"hour": '20',
},
{
"hour": '21',
},
{
"hour": '22',
},
{
"hour": '23',
},
]
var tdata2 = [
{
"minute": '00',
},
{
"minute": '30',
},
]
export default {
props: {
select:String,
},
data() {
return {
pickData: [
tdata,
tdata2
],
// result: '',
dateinfo: {},
//dateRange: [],
placeholderText:this.select,
value3: [0, 0],
rangekey3: ['hour', 'minute'],
}
},
watch:{
select(val){
this.placeholderText = val
}
},
methods: {
// cancel() {
// this.result = 'click cancel result: null'
// this.$emit('update:visibleShow', false);
// },
// confirm(res) {
// //console.log("this.result",res[0].label)
// this.$emit('update:visibleShow', false);
// this.$emit('Time', `${res[0].label}:${res[1].label}`);
// },
//多列选择器 确定事件
multiconfirm(e) {
console.log(e)
//this.dateinfo = {};
// this.dateinfo.year = e[0].hour;
// this.dateinfo.month = e[1].minute;
this.$emit('Time', `${e[0].hour}:${e[1].minute}`);
},
//多列选择器 选择改变事件
multibindChange(e) {
console.log(e)
},
//取消事件
cancel() {
uni.showToast({
title: "点击了取消"
})
},
}
}
</script>
<style lang="scss">
/deep/.uni-flex{
display: flex;
}
.telly-item {
display: flex;
text-align: center;
padding: 10rpx;
justify-content: center;
}
</style>