el-slider 时间播放进度

要在el-slider上实现时间播放进度，需要先确定时间轴的总长度和当前播放时间。然后，可以将总长度设置为el-slider的最大值，将当前播放时间设置为el-slider的值，并在el-slider上显示当前播放时间。具体实现可以参考以下代码：

<template>
  <div>
    <el-slider :max="totalTime" v-model="currentTime" show-input tooltip-placement="bottom"></el-slider>
    <span>{{formatTime(currentTime)}} / {{formatTime(totalTime)}}</span>
  </div>
</template>

<script>
export default {
  data() {
    return {
      totalTime: 100, // 时间轴总长度
      currentTime: 0 // 当前播放时间
    };
  },
  methods: {
    formatTime(time) {
      // 时间格式化函数，将秒数转换为 hh:mm:ss 格式
      const hour = Math.floor(time / 3600);
      const minute = Math.floor((time - hour * 3600) / 60);
      const second = Math.floor(time - hour * 3600 - minute * 60);
      return `${hour < 10 ? '0' + hour : hour}:${minute < 10 ? '0' + minute : minute}:${second < 10 ? '0' + second : second}`;
    }
  }
};
</script>

以上代码中，el-slider的最大值为totalTime，v-model绑定的值为currentTime。在el-slider下方，使用两个span标签显示当前播放时间和总时长，并通过formatTime方法将秒数转换为hh:mm:ss格式。当currentTime发生变化时，el-slider的值会随之改变，因此可以实现时间播放进度。