cashier_app/components/my-components/my-time-area-pickerview.vue

49 lines
919 B
Vue

<template>
<myPickerview :list="list" :isLink="false" @confirm="confirm" ref="picker"></myPickerview>
</template>
<script setup>
import {
reactive,
ref
} from "vue";
import myPickerview from './my-pickerview'
const picker = ref(null)
function generateString(length, char) {
return char.repeat(length);
}
function createNumberArr(len) {
return new Array(len).fill(1).map((v, index) => {
return `${generateString(`${len}`.length-1,'0')}${index}`.slice(-2)
})
}
const $HOURS =createNumberArr(24)
const $MINUTES = createNumberArr(60)
const list = reactive(
[
$HOURS,
[':'],
$MINUTES,
['至'],
$HOURS,
[':'],
$MINUTES
]
)
const emits=defineEmits(['confirm'])
function open() {
picker.value.open()
}
function confirm(e){
const val=e.join('').replace('至','-')
emits('confirm',val)
}
defineExpose({
open
})
</script>
<style lang="scss" scoped>
</style>