30 lines
458 B
Vue
30 lines
458 B
Vue
<template>
|
|
<input class="progress"
|
|
:max="player.duration"
|
|
min="0"
|
|
type="range"
|
|
:value="player.currentTime"
|
|
@change="(event) => $store.dispatch('player/seek', event.target.value)">
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: 'ProgressBar',
|
|
computed: {
|
|
player() {
|
|
return this.$store.state.player
|
|
},
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.progress {
|
|
height: 4px;
|
|
min-height: 4px;
|
|
position: absolute;
|
|
top: -2px;
|
|
width: 99%;
|
|
}
|
|
</style>
|