Commit 8a4671b7 authored by jackie / Andrea Ida Malkah Klaura's avatar jackie / Andrea Ida Malkah Klaura
Browse files

FIX: emissions manager instead of schedule modal

parent d2fbfa9f
...@@ -34,6 +34,7 @@ export default { ...@@ -34,6 +34,7 @@ export default {
{ slug: 'home', title: 'Home' }, { slug: 'home', title: 'Home' },
{ slug: 'shows', title: 'Sendungen verwalten' }, { slug: 'shows', title: 'Sendungen verwalten' },
{ slug: 'files', title: 'Dateien und Playlists' }, { slug: 'files', title: 'Dateien und Playlists' },
{ slug: 'emissions', title: 'Sendezeiten'},
{ slug: 'settings', title: 'Settings' }, { slug: 'settings', title: 'Settings' },
{ slug: 'credits', title: 'Credits' }, { slug: 'credits', title: 'Credits' },
{ slug: 'debug', title: 'Debug' } { slug: 'debug', title: 'Debug' }
......
<template> <template>
<div> <b-container>
<!-- Modal for adding new shows --> <b-row v-if="loaded.shows">
<b-modal <b-col>
id="idModalSchedules" <h3>{{ shows[currentShow].name }}</h3>
ref="modalSchedules" </b-col>
title="Add/delete emission" <b-col align="right">
size="lg" <b-dropdown
@ok="updateSchedules" id="ddshows"
> text="Sendereihe auswählen"
<p v-if="loaded.show"> variant="outline-info"
Editing schedules for <b>{{ show.name }}</b> >
</p> <b-dropdown-item
v-for="(show, index) in shows"
:key="show.id"
@click="switchShow(index)"
>
{{ show.name }}
</b-dropdown-item>
</b-dropdown>
</b-col>
</b-row>
<b-row v-else>
<b-col cols="12">
<div align="center">
... loading show data ...
</div>
</b-col>
</b-row>
<full-calendar <hr>
ref="calendar"
editable="false" <full-calendar
default-view="agendaWeek" ref="calendar"
:events="calendarSlots" editable="false"
:config="calendarConfig" default-view="agendaWeek"
@view-render="renderView" :events="calendarSlots"
/> :config="calendarConfig"
</b-modal> @view-render="renderView"
</div> />
</b-container>
</template> </template>
<script> <script>
import axios from 'axios' import axios from 'axios'
import {FullCalendar} from 'vue-full-calendar' import { FullCalendar } from 'vue-full-calendar'
import 'fullcalendar/dist/fullcalendar.css' import 'fullcalendar/dist/fullcalendar.css'
export default { export default {
...@@ -35,7 +52,7 @@ export default { ...@@ -35,7 +52,7 @@ export default {
}, },
data () { data () {
return { return {
show: null, currentShow: 0,
shows: [], shows: [],
timeslots: [], timeslots: [],
calendarSlots: [], calendarSlots: [],
...@@ -65,30 +82,26 @@ export default { ...@@ -65,30 +82,26 @@ export default {
}, },
}, },
loaded: { loaded: {
show: false,
shows: false, shows: false,
timeslots: false, timeslots: false,
calendarSlots: false,
}, },
} }
}, },
mounted() { created () {
this.$root.$on('bv::modal::shown', (bvEvent, modalId) => { if (this.$route.query.show) {
if (this.$refs.calendar && modalId === 'idModalSchedules') { this.currentShow = this.$route.query.show
this.loadShows() } else {
this.$refs.calendar.fireMethod('render') this.currentShow = 0
} }
}) this.loadShows()
}, },
methods: { methods: {
// opens the main modal switchShow (index) {
open (show) { this.currentShow = index
this.show = show this.loadCalendarSlots()
this.loaded.show = true
this.timeslots = []
this.calendarSlots = []
this.$refs.modalSchedules.show()
}, },
getShowTitleById (id) { getShowTitleById (id) {
...@@ -103,35 +116,41 @@ export default { ...@@ -103,35 +116,41 @@ export default {
// this is called when the user changes the calendar view, so we just // this is called when the user changes the calendar view, so we just
// refetch the timeslots with the updated visible date range // refetch the timeslots with the updated visible date range
renderView (view) { renderView (view) {
this.$log.debug(view.start.format() + ' ' + view.end.format())
if (this.loaded.shows) { if (this.loaded.shows) {
this.$log.debug('refetching') this.$log.debug('refetching')
this.loadTimeslots(view.start.format(), view.end.format()) this.loadTimeslots(view.start.format(), view.end.format())
} }
}, },
loadCalendarSlots () {
this.loaded.calendarSlots = false
this.calendarSlots = []
for (let i in this.timeslots) {
let highlighting = 'otherShow'
if (this.timeslots[i].show === this.shows[this.currentShow].id) {
highlighting = 'currentShow'
}
this.calendarSlots.push({
start: this.timeslots[i].start,
end: this.timeslots[i].end,
title: this.getShowTitleById(this.timeslots[i].show),
className: highlighting
})
}
this.loaded.calendarSlots = true
},
loadTimeslots (start, end) { loadTimeslots (start, end) {
this.$log.debug('loadTimeslots: currentShow = '+this.currentShow)
this.loaded.timeslots = false this.loaded.timeslots = false
this.calendarSlots = []
let uri = process.env.VUE_APP_API_STEERING + 'timeslots?start=' + start + '&end=' + end let uri = process.env.VUE_APP_API_STEERING + 'timeslots?start=' + start + '&end=' + end
axios.get(uri, { axios.get(uri, {
withCredentials: true, withCredentials: true,
headers: { 'Authorization': 'Bearer ' + this.$parent.$parent.user.access_token } headers: { 'Authorization': 'Bearer ' + this.$parent.user.access_token }
}).then(response => { }).then(response => {
this.timeslots = response.data this.timeslots = response.data
for (let i in this.timeslots) {
let highlighting = 'otherShow'
if (this.timeslots[i].show === this.show.id) {
highlighting = 'currentShow'
}
this.calendarSlots.push({
start: this.timeslots[i].start,
end: this.timeslots[i].end,
title: this.getShowTitleById(this.timeslots[i].show),
className: highlighting
})
}
this.loaded.timeslots = true this.loaded.timeslots = true
this.loadCalendarSlots()
}).catch(error => { }).catch(error => {
this.$log.error(error.response.status + ' ' + error.response.statusText) this.$log.error(error.response.status + ' ' + error.response.statusText)
this.$log.error(error.response) this.$log.error(error.response)
...@@ -144,7 +163,7 @@ export default { ...@@ -144,7 +163,7 @@ export default {
let uri = process.env.VUE_APP_API_STEERING + 'shows' let uri = process.env.VUE_APP_API_STEERING + 'shows'
axios.get(uri, { axios.get(uri, {
withCredentials: true, withCredentials: true,
headers: { 'Authorization': 'Bearer ' + this.$parent.$parent.user.access_token } headers: { 'Authorization': 'Bearer ' + this.$parent.user.access_token }
}).then(response => { }).then(response => {
this.shows = response.data this.shows = response.data
this.loaded.shows = true this.loaded.shows = true
......
...@@ -115,15 +115,26 @@ ...@@ -115,15 +115,26 @@
<app-modalSuperuser <app-modalSuperuser
ref="appModalSuperuser" ref="appModalSuperuser"
/> />
<app-modalSchedules
ref="appModalSchedules"
/>
<!-- here are the filter settings for our timeslots table --> <!-- here are the filter settings for our timeslots table -->
<b-card> <b-card>
<b-btn v-b-toggle.timeslotFilterCollapse> <b-row>
Toggle timeslot filters <b-col>
</b-btn> <b-btn v-b-toggle.timeslotFilterCollapse>
Toggle timeslot filters
</b-btn>
</b-col>
<b-col align="right">
<b-button
v-if="$parent.user.steeringUser.is_superuser"
variant="info"
@click="$router.push({path: 'emissions', query: { show: currentShow }})"
>
Switch to Emission Manager
</b-button>
</b-col>
</b-row>
<b-collapse id="timeslotFilterCollapse"> <b-collapse id="timeslotFilterCollapse">
<br> <br>
<!-- How many slots to show per table page --> <!-- How many slots to show per table page -->
...@@ -178,7 +189,7 @@ ...@@ -178,7 +189,7 @@
Reset filter Reset filter
</b-btn> &nbsp; </b-btn> &nbsp;
<b-btn <b-btn
variant="info" variant="outline-success"
@click="applyFilter()" @click="applyFilter()"
> >
Apply filter Apply filter
...@@ -276,16 +287,6 @@ ...@@ -276,16 +287,6 @@
</div> </div>
</div> </div>
<div align="center">
<b-button
v-if="$parent.user.steeringUser.is_superuser"
variant="info"
@click="$refs.appModalSchedules.open(shows[currentShow])"
>
Add/delete emissions
</b-button>
</div>
<hr> <hr>
<h2>Allgemeine Einstellungen zur Sendereihe:</h2> <h2>Allgemeine Einstellungen zur Sendereihe:</h2>
...@@ -697,7 +698,6 @@ ...@@ -697,7 +698,6 @@
import modalNotes from './ShowManagerModalNotes.vue' import modalNotes from './ShowManagerModalNotes.vue'
import modalShow from './ShowManagerModalShow.vue' import modalShow from './ShowManagerModalShow.vue'
import modalSuperuser from './ShowManagerModalSuperuser.vue' import modalSuperuser from './ShowManagerModalSuperuser.vue'
import modalSchedules from './ShowManagerModalSchedules.vue'
import timeslotSort from '../mixins/timeslotSort' import timeslotSort from '../mixins/timeslotSort'
import prettyDate from '../mixins/prettyDate' import prettyDate from '../mixins/prettyDate'
import axios from 'axios' import axios from 'axios'
...@@ -710,7 +710,6 @@ export default { ...@@ -710,7 +710,6 @@ export default {
'app-modalNotes': modalNotes, 'app-modalNotes': modalNotes,
'app-modalShow': modalShow, 'app-modalShow': modalShow,
'app-modalSuperuser': modalSuperuser, 'app-modalSuperuser': modalSuperuser,
'app-modalSchedules': modalSchedules,
}, },
// generic functions that we want to use from our mixins folder // generic functions that we want to use from our mixins folder
......
...@@ -6,6 +6,7 @@ import Credits from '@/components/Credits' ...@@ -6,6 +6,7 @@ import Credits from '@/components/Credits'
import Settings from '@/components/Settings' import Settings from '@/components/Settings'
import ShowManager from '@/components/ShowManager' import ShowManager from '@/components/ShowManager'
import FileManager from '@/components/FileManager' import FileManager from '@/components/FileManager'
import EmissionManager from '@/components/EmissionManager'
import Debug from '@/components/Debug' import Debug from '@/components/Debug'
Vue.use(Router) Vue.use(Router)
...@@ -15,6 +16,7 @@ export default new Router({ ...@@ -15,6 +16,7 @@ export default new Router({
{ path: '/', alias: '/home', name: 'home', component: Home }, { path: '/', alias: '/home', name: 'home', component: Home },
{ path: '/shows', name: 'shows', component: ShowManager }, { path: '/shows', name: 'shows', component: ShowManager },
{ path: '/files', name: 'files', component: FileManager }, { path: '/files', name: 'files', component: FileManager },
{ path: '/emissions', name: 'emissions', component: EmissionManager },
{ path: '/help', name: 'help', component: Help }, { path: '/help', name: 'help', component: Help },
{ path: '/settings', name: 'settings', component: Settings }, { path: '/settings', name: 'settings', component: Settings },
{ path: '/credits', name: 'credits', component: Credits }, { path: '/credits', name: 'credits', component: Credits },
......
Markdown is supported
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