New-site/resources/views/Schedule/ScheduleTable.vue

44 lines
1.2 KiB
Vue

<script>
import {useScheduleStore} from '../../stores/schedule.js';
import {ref} from "vue";
export default {
name: "ScheduleTable",
data: () => ({
schedules: ref(),
scheduleStore: useScheduleStore(),
fetching: true
}),
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">
<v-skeleton-loader v-if="fetching" type="table"/>
<v-table v-else class="text-xl-h5 text-lg-h5 text-md-h5 text-sm-h5 text-body-2 w-66">
<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>