37 lines
844 B
Vue
37 lines
844 B
Vue
<template>
|
|
<div class="audio-file-selector">
|
|
<select v-model="selectedFile" @change="onFileSelect">
|
|
<option value="">Select an audio file</option>
|
|
<option v-for="(src, title) in audioFiles" :key="title" :value="src">
|
|
{{ title }}
|
|
</option>
|
|
</select>
|
|
</div>
|
|
</template>
|
|
|
|
<script lang="ts">
|
|
import { defineComponent, ref } from 'vue'
|
|
|
|
export default defineComponent({
|
|
name: 'AudioFileSelector',
|
|
emits: ['file-selected'],
|
|
setup (_, { emit }) {
|
|
const config = useRuntimeConfig()
|
|
const audioFiles = ref(config.public.tracks)
|
|
|
|
const selectedFile = ref('')
|
|
|
|
const onFileSelect = () => {
|
|
const fullPath = window.location.origin + selectedFile.value
|
|
emit('file-selected', fullPath)
|
|
}
|
|
|
|
return {
|
|
audioFiles,
|
|
selectedFile,
|
|
onFileSelect
|
|
}
|
|
}
|
|
})
|
|
</script>
|