47 lines
1.4 KiB
Vue
47 lines
1.4 KiB
Vue
<script>
|
|
import {useScheduleStore} from '../../stores/schedule.js';
|
|
import {ref} from "vue";
|
|
|
|
export default {
|
|
name: "ScheduleTable",
|
|
data: () => ({
|
|
schedules: ref(),
|
|
scheduleStore: useScheduleStore(),
|
|
fetching: true
|
|
}),
|
|
props: {
|
|
isWide: Boolean
|
|
},
|
|
methods: {
|
|
parseDate(date){
|
|
let dateArr = date.split("-");
|
|
return dateArr[2] + "." + dateArr[1];
|
|
}
|
|
},
|
|
mounted() {
|
|
this.scheduleStore.getSchedules().then(()=>{
|
|
this.schedules = this.scheduleStore.schedules;
|
|
this.fetching = false;
|
|
});
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<div class="w-100 d-flex justify-center mt-6 mb-6">
|
|
<v-skeleton-loader v-if="fetching" type="table" class="bg-grey-darken-3 mr-3 ml-1"/>
|
|
<v-table v-else class="bg-grey-darken-3 neon-border pa-3 ml-1 mr-3 text-xl-h5 text-lg-h5 text-md-h5 text-sm-h5 text-body-2" :class="isWide ? 'w-66' : 'w-100'">
|
|
<tbody>
|
|
<tr v-for="schedule in schedules">
|
|
<td>{{ parseDate(schedule.current_date) }} {{ schedule.weekday_name }} {{ schedule.stream_time }}</td>
|
|
<td>{{ schedule.name }}</td>
|
|
</tr>
|
|
</tbody>
|
|
</v-table>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped>
|
|
|
|
</style>
|