Commit 1f8bf739 authored by Andrea Ida Malkah Klaura's avatar Andrea Ida Malkah Klaura
Browse files

ShowManager: layout & nice bootstrap show switcher

parent 606b50b8
<template> <template>
<b-container> <b-container>
<div> <div>
<h1>Sendereihen &amp; Sendungen</h1> <b-row v-if="showsLoaded">
<div class="row"> <b-col>
<div class="col"> Aktuell ausgewählt: &nbsp;&nbsp;
Aktuelle Sendereihe: <b-button disabled variant="outline-secondary"><b>{{ shows[currentShow].name }}</b></b-button>
<select v-model="currentShow" v-on:change="switchShow"> </b-col>
<option v-for="(show, index) in this.shows" v-bind:value="index">{{ show.name }}</option> <b-col align="right">
</select> <b-dropdown id="ddshows" text="Sendereihe auswählen" variant="info">
<b-dropdown-item v-for="(show, index) in this.shows" v-on:click="switchShow(index)">{{ show.name }}</b-dropdown-item>
</b-dropdown>
</b-col>
</b-row>
<div v-else style="text-align: center;"><img src="../assets/radio.gif" alt="loading data" /><br /></div>
<hr /> <hr />
</div>
</div>
<p align="left">Die nächsten <select v-model="numUpcoming"> <p align="left">Die nächsten <select v-model="numUpcoming">
<option>8</option> <option>8</option>
...@@ -142,8 +145,9 @@ export default { ...@@ -142,8 +145,9 @@ export default {
} }
}, },
methods: { methods: {
switchShow: function () { switchShow: function (index) {
this.episodesLoaded = false this.episodesLoaded = false
this.currentShow = index
this.currentShowID = this.shows[this.currentShow].id this.currentShowID = this.shows[this.currentShow].id
// fetch single episodes for a given show from PV backend // fetch single episodes for a given show from PV backend
this.$http.post(process.env.API_STEERING, { this.$http.post(process.env.API_STEERING, {
...@@ -203,7 +207,7 @@ export default { ...@@ -203,7 +207,7 @@ export default {
this.currentShowID = this.shows[0].id this.currentShowID = this.shows[0].id
this.currentShow = 0 this.currentShow = 0
this.showsLoaded = true this.showsLoaded = true
this.switchShow() this.switchShow(this.currentShow)
} }
}, response => { }, response => {
alert('There was an error fetching the data from the server') alert('There was an error fetching the data from the server')
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment