vue3 js 方式实现学习时长正向计数器 时分秒转秒 秒转时分秒

//学习时长
const Locktime = ref('00:00:00');
const timeAlarmTWO = ref(null);
const hour = ref(0);
const minute = ref(0);
const second = ref(10);
const reckon = ref(true);// 判断是否在计时
//判断一下数值的变化
const timer = () => {
      second.value = second.value+1;
      if(second.value >= 60){
        second.value = 0;
        minute.value = minute.value + 1;
      }
      if(minute.value >= 60){
        minute.value = 0;
        hour.value = hour.value + 1;
      }
      let h = hour.value < 10 ? '0' + hour.value : hour.value;
      let m = minute.value < 10 ? '0' + minute.value : minute.value;
      let s = second.value < 10 ? '0' + second.value : second.value;
      Locktime.value = h + ":" + m + ":" + s;
    }
const Lockscreen = ()=> {
      if(reckon.value){
        reckon.value = false;
        //  定时器,每秒
        timeAlarmTWO.value=setInterval(timer,1000);
      } else {
        reckon.value = true;
        //second.value = 0;
        //minute.value = 0;
        //hour.value = 0;
        //Locktime.value = '00:00:00';
        //  一定要关闭!!!!
        clearInterval(timeAlarmTWO.value);
        timeAlarmTWO.value = null;
      }
    }
//将秒变为时分秒
const convertSecondsToTime = (seconds:any) => {
   
    var hours = Math.floor(seconds/ 3600); // 计算小时数
    seconds -= hours * 3600; // 从原始秒数中减去已经计算过的小时数
    
    var minutes = Math.floor(seconds / 60); // 计算分钟数
    seconds -= minutes * 60; // 从原始秒数中减去已经计算过的分钟数
    let h = hours < 10 ? '0' + hours : hours;
    let m = minutes < 10 ? '0' + minutes : minutes;
    let s = seconds < 10 ? '0' + seconds : seconds;
    return `${h}:${m}:${s}`;
}
 
var videoDurationInSeconds = 121.123423; // 示例视频持续时间(单位:秒)
var strPoint=videoDurationInSeconds.toString();//转字符串
var timeFormat = convertSecondsToTime(strPoint.split('.')[0]);//拆分
var pointFormat=strPoint.split('.')[1];
if(pointFormat)
{
  console.log(timeFormat+'.'+pointFormat);
}
else
{
  console.log(timeFormat);
}

/**
     * 时间转为秒
     * @param time 时间(00:00:00)
     * @returns {string} 时间戳(单位:秒)
     */
const convertTimeToSeconds = (times:any) => {
        var str = times.split('.')[0];

        var hour = str.split(':')[0];
        var min = str.split(':')[1];
        var sec = str.split(':')[2];
        str = Number(hour*3600) + Number(min*60) + Number(sec);
        if(times.split('.')[1])
        {
          str=str+'.'+times.split('.')[1];
        }
        return str;
    };
var videoTimes = '00:02:01.902'; // 示例视频持续时间(单位:秒)
var timesFormat = convertTimeToSeconds(videoTimes);
console.log(timesFormat);

 

posted on 2024-03-01 22:07  wuzx-blog  阅读(93)  评论(0编辑  收藏  举报