birdpaper-ui
Version:
一个通用的 vue3 UI组件库。A common vue3 UI component library.
89 lines (88 loc) • 2.62 kB
JavaScript
import { defineComponent, ref, inject, computed, watch, nextTick } from "vue";
import { generateArray } from "../../../utils/util.js";
import { RecycleScroller } from "vue-virtual-scroller";
import "vue-virtual-scroller/dist/vue-virtual-scroller.css";
import dayjs from "dayjs";
import { timeInjectionKey } from "../types.js";
const _sfc_main = defineComponent({
name: "TimeTable",
components: { RecycleScroller },
props: {
visible: { type: Boolean, default: false }
},
setup(props) {
const name = "bp-time-table";
const ctx = ref();
const defaultValue = "00";
const hourList = generateArray(24);
const minuteList = generateArray(60);
const secondList = generateArray(60);
ctx.value = inject(timeInjectionKey);
const globalValue = ref(["", "", ""]);
const confirmDisabled = computed(() => globalValue.value.filter((item) => item === "").length > 0);
const typeRefs = ref([]);
const handleClick = (index, item) => {
globalValue.value[index] = item;
scrollTo(index, item);
setDefault();
};
const setDefault = () => {
for (let i = 0; i < globalValue.value.length; i++) {
const element = globalValue.value[i];
if (!element) {
globalValue.value[i] = defaultValue;
scrollTo(i);
}
}
};
const setNow = () => {
const now = dayjs().format("HH:mm:ss");
globalValue.value = now.split(":");
for (let i = 0; i < globalValue.value.length; i++) {
const item = globalValue.value[i];
scrollTo(i, item);
}
handleSelect();
};
const scrollTo = (i, item = defaultValue) => typeRefs.value[i].scrollToItem(item);
const handleSelect = () => {
ctx.value.onSelect(globalValue.value.join(":"));
};
watch(
() => props.visible,
() => {
if (props.visible) {
if (!ctx.value.modelValue)
return;
globalValue.value = ["", "", ""];
const arr = ctx.value.modelValue.split(":");
for (let i = 0; i < arr.length; i++) {
const element = arr[i];
globalValue.value.push(Number(element).toString().padStart(2, "0"));
}
nextTick(() => {
globalValue.value.map((item, index) => {
scrollTo(index, item);
});
});
}
}
);
return {
ctx,
name,
typeRefs,
hourList,
minuteList,
secondList,
globalValue,
confirmDisabled,
setNow,
handleClick,
handleSelect
};
}
});
export {
_sfc_main as default
};