api

server/db.js

@@ -88,9 +88,11 @@ const db = {
         return stmt.run(title, start_at, audio_id, at_id)
     },
 
-    remove_enqueue (id) {
+    remove_enqueue (req, res) {
+        const id = req.params.id
         const stmt = connection.prepare('DELETE FROM queue where id = ?')
-        return stmt.run(id)
+        const ret = stmt.run(id)
+        return res.json(ret)
     }
 
     // mostrami la coda

server/index.js

@@ -49,6 +49,7 @@ app.post('/audio', upload.single('file'), (req, res) => {
 
 // get the current queue
 app.get('/queue', db.queue)
+app.delete('/queue/:id', db.remove_enqueue)
 app.post('/queue', upload.single('file'), async (req, res) => {
 
   const body = req.body

src/api/get.js

+
+export function runAPI(path, options) {
+    const baseurl = 'http://localhost:3000'
+    return fetch(baseurl + path, options).then(ret => ret.json())
+}

src/components/Coda.vue

@@ -4,13 +4,23 @@
     <v-card-text>
         <v-list-item-group>
             <v-list-item v-for='q in queue' :key="q.id">
-                <v-list-item-content>{{ q.title }}</v-list-item-content>
+                <v-list-item-content>
+                    <v-list-item-title>{{ q.title }}</v-list-item-title>
+                    <v-list-item-subtitle>{{ q.start_at }}</v-list-item-subtitle>
+                </v-list-item-content>
+                <v-list-item-action>
+                    <v-btn icon @click="remove(q)">
+                        <v-icon color="error lighten-1">mdi-delete</v-icon>
+                    </v-btn>
+                </v-list-item-action>
             </v-list-item>
         </v-list-item-group>
     </v-card-text>
 </div>
 </template>
 <script>
+import {runAPI} from '@/api/get'
+console.error(runAPI)
 export default {
     data () {
         return {
@@ -18,7 +28,18 @@ export default {
         }
     },
     async mounted () {
-        this.queue = await fetch('http://localhost:3000/queue').then(r => r.json())
+        this.queue = await runAPI('/queue')
+    },
+    methods: {
+        async remove(q) {
+            if (!window.confirm('Are you sure to remove this?')) {
+                console.error('ma sono qui!??!')
+                return
+            }
+            const ret = await runAPI(`/queue/${q.id}`, { method: 'DELETE'})
+            console.error('remove q', ret)
+            this.queue = await runAPI('/queue')
+        }
     }
 }
 </script>
\ No newline at end of file

src/components/Programmate.vue

@@ -18,7 +18,7 @@
 
             <template v-if="form.type !== 'blackholes'">
                 <v-text-field v-if='form.type === "from_internet"' prepend-icon='mdi-music' autocomplete="off" v-model='form.url' label='Link del file (mp3 o ogg)' hint="Puo' essere un media dal sito della radio ma non solo" />
-                <v-file-input v-else prepend-icon='mdi-music' autocomplete="off" v-model='form.file' label='File (mp3 o ogg)' hint="Il file da caricare" />
+                <v-file-input v-else prepend-icon='mdi-music' autocomplete="off" v-model='form.file' label='File (mp3 o ogg)' hint="Il file da caricare" accept="audio/*"/>
                 <v-text-field prepend-icon='mdi-text' v-model='form.trasmissione' label='Titolo' hint="il titolo comparira' come riferimento nella coda delle programmate"/>
             </template>
             <v-autocomplete v-else prepend-icon='mdi-music-note-whole'