/** * 日期时间组合函数 * 提供日期格式化、倒计时等与日期时间相关的可复用逻辑 */ import { ref, computed, onUnmounted } from 'vue'; import { formatDate } from '@/utils/helper'; /** * 格式化日期时间的组合函数 * @param {Object} options - 配置选项 * @param {string} options.format - 日期格式 * @returns {Object} - 包含格式化方法的对象 */ export const useDateTime = (options = {}) => { const { format = 'yyyy-MM-dd HH:mm:ss' } = options; /** * 格式化日期 * @param {Date|string|number} date - 日期值 * @param {string} customFormat - 自定义格式 * @returns {string} - 格式化后的日期字符串 */ const formatDateTime = (date, customFormat) => { return formatDate(date, customFormat || format); }; /** * 获取当前时间 * @returns {Date} - 当前日期对象 */ const getCurrentTime = () => { return new Date(); }; /** * 获取当前格式化时间 * @param {string} customFormat - 自定义格式 * @returns {string} - 格式化后的当前时间 */ const getCurrentFormattedTime = (customFormat) => { return formatDateTime(getCurrentTime(), customFormat); }; return { formatDateTime, getCurrentTime, getCurrentFormattedTime }; }; /** * 实时时钟组合函数 * @param {string} format - 日期格式 * @returns {Object} - 包含当前时间和停止时钟的方法 */ export const useClock = (format = 'yyyy-MM-dd HH:mm:ss') => { const currentTime = ref(getCurrentFormattedTime()); let timer = null; // 获取当前格式化时间 function getCurrentFormattedTime() { return formatDate(new Date(), format); } // 启动时钟 const startClock = () => { if (timer) clearInterval(timer); timer = setInterval(() => { currentTime.value = getCurrentFormattedTime(); }, 1000); }; // 停止时钟 const stopClock = () => { if (timer) { clearInterval(timer); timer = null; } }; // 组件卸载时停止时钟 onUnmounted(stopClock); // 初始启动时钟 startClock(); return { currentTime: computed(() => currentTime.value), startClock, stopClock }; }; /** * 倒计时组合函数 * @param {number} targetTime - 目标时间戳(毫秒) * @returns {Object} - 包含倒计时数据和控制方法 */ export const useCountdown = (targetTime) => { const days = ref(0); const hours = ref(0); const minutes = ref(0); const seconds = ref(0); const isCompleted = ref(false); let timer = null; // 计算倒计时 const calculateCountdown = () => { const now = new Date().getTime(); const difference = targetTime - now; if (difference <= 0) { days.value = 0; hours.value = 0; minutes.value = 0; seconds.value = 0; isCompleted.value = true; stopCountdown(); return; } days.value = Math.floor(difference / (1000 * 60 * 60 * 24)); hours.value = Math.floor((difference % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); minutes.value = Math.floor((difference % (1000 * 60 * 60)) / (1000 * 60)); seconds.value = Math.floor((difference % (1000 * 60)) / 1000); }; // 启动倒计时 const startCountdown = () => { if (timer) clearInterval(timer); calculateCountdown(); timer = setInterval(calculateCountdown, 1000); }; // 停止倒计时 const stopCountdown = () => { if (timer) { clearInterval(timer); timer = null; } }; // 重置倒计时 const resetCountdown = (newTargetTime) => { if (newTargetTime) { targetTime = newTargetTime; } isCompleted.value = false; startCountdown(); }; // 组件卸载时停止倒计时 onUnmounted(stopCountdown); // 初始启动倒计时 startCountdown(); return { days: computed(() => days.value), hours: computed(() => hours.value), minutes: computed(() => minutes.value), seconds: computed(() => seconds.value), isCompleted: computed(() => isCompleted.value), startCountdown, stopCountdown, resetCountdown }; }; // 默认导出主要的日期时间组合函数 export default useDateTime;