import { getValueOfRule } from "@r-utils/common"; import { ref, computed, toRef } from "vue"; import type { InputOptions, InputValue } from "@r-utils/common"; import type { Ref } from "vue"; /** * 倒计时工具 * @param initTime 初始时间,秒 */ export function useTimer(initTime = 0) { const time = ref(initTime); const timeInterval = ref>(); const start = () => { timeInterval.value = setInterval(() => { if (time.value <= 0) { clearInterval(timeInterval.value); return; } time.value--; }, 1000); }; const restart = () => { time.value = initTime; start(); }; const stop = () => { time.value = 0; clearInterval(timeInterval.value); }; return { time, start, restart, timeInterval, stop }; } type UseNumberSetFn = (v: string | number) => string | number; const defaultUseNumberSetFn: UseNumberSetFn = (v: string | number) => String(v); /** * 把响应式变量转为数字输出 * @param value 要监听的值 * @param setFn 在监听值改变时,处理函数 */ export function useNumber( value: Ref, setFn: UseNumberSetFn = defaultUseNumberSetFn, ) { const int = computed({ // 总是返回整数 get: () => Number.parseInt(String(value.value)), set: (v) => { value.value = setFn(v); }, }); const float = computed({ // 总是返回 float get: () => Number.parseFloat(String(value.value)), set: (v) => { value.value = setFn(v); }, }); const number = computed({ // 总是返回 Number get: () => Number(value.value), set: (v) => { value.value = setFn(v); }, }); return { number, int, float }; } /** * 监听一个响应式变量,转为字符串输出 * @param value 要监听的值 */ export function useString(value: Ref) { const string = computed({ get: () => String(value.value), set: (v) => { value.value = v; }, }); return { string }; } interface UseValueOfRuleOptions { value: InputValue | Ref; rule: InputOptions; } /** * 按自定义规则转换数字或文本 * @param options */ export function useValueOfRule(options: UseValueOfRuleOptions) { const value = toRef(options.value); const rule = toRef(options.rule); function handleChange() { const newValue = getValueOfRule(value.value, rule.value); value.value = newValue; } return { value, rule, handleChange, }; }