HIsheR
28 lines
1.5 KiB
TypeScript
28 lines
1.5 KiB
TypeScript
import { h, signal } from '@ui-arch/frame';
|
|
import type { CountdownHandle, CountdownProps } from './types.js';
|
|
|
|
/*** 倒计时：秒级递减到 0 自动停表并触发 onFinish，缺省 mm:ss 展示，句柄可 start / stop / reset ***/
|
|
export function countdown(props: CountdownProps): CountdownHandle {
|
|
const remain = signal(props.seconds); // 剩余秒数（单一来源，h() 函数型子节点响应式刷新文本）
|
|
let timer = 0; // setInterval 句柄（0 表示停表中）
|
|
const fmt = props.format ?? ((s: number): string => `${String(Math.floor(s / 60)).padStart(2, '0')}:${String(s % 60).padStart(2, '0')}`); // 缺省 mm:ss 两位补零
|
|
|
|
const stop = (): void => { if (timer) { clearInterval(timer); timer = 0; } }; // 停表并清句柄，幂等
|
|
|
|
/*** 开始 / 续跑：重入先停旧表；已归零时视为重开一轮 ***/
|
|
const start = (): void => {
|
|
stop();
|
|
if (remain() <= 0) remain(props.seconds);
|
|
timer = window.setInterval(() => {
|
|
const next = Math.max(0, remain() - 1);
|
|
remain(next);
|
|
if (next <= 0) { stop(); if (props.onFinish) props.onFinish(); } // 归零即停表并回调，不留负数帧
|
|
}, 1000);
|
|
};
|
|
|
|
const reset = (): void => { stop(); remain(props.seconds); }; // 复位到总时长并停表
|
|
const el = h('span', { class: 'ua-countdown', role: 'timer' }, () => fmt(remain())) as HTMLSpanElement;
|
|
if (props.running ?? true) start(); // 缺省挂载即开始
|
|
return { el, start, stop, reset };
|
|
}
|