63 lines
2.2 KiB
Vue
63 lines
2.2 KiB
Vue
<template v-cloak>
|
|
<div>
|
|
<headernav :section="section" :subsection="subsection"></headernav>
|
|
<scheduletabs :statusCount="statusCount"></scheduletabs>
|
|
<table class="table is-fullwidth is-striped is-hoverable">
|
|
<thead>
|
|
<tr>
|
|
<th>Client</th>
|
|
<th>Schedule</th>
|
|
<th>When <span class="icon"><i class="mdi mdi-18px mdi-chevron-up" aria-hidden="true"></i></span>
|
|
<span class="icon"><i class="mdi mdi-28px mdi-chevron-down" aria-hidden="true"></i></span>
|
|
</th>
|
|
<th><span class="is-pulled-right">Actions</span></th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr v-for="schedule in schedules" :key="schedule.id">
|
|
<td><span class="icon tbl-icon"><i class="mdi mdi-24px mdi-check has-text-success" aria-hidden="true"></i></span>
|
|
{{ schedule.client }}</td>
|
|
<td>{{ schedule.name }}</td>
|
|
<td>{{ schedule.date }}</td>
|
|
<td><i class="mdi mdi-24px mdi-magnify is-pulled-right" aria-hidden="true"></i></td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
<pagination v-if="pagination.last_page > 1" :pagination="pagination" :offset="5" @paginate="fetchSchedules()"></pagination>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data () {
|
|
return {
|
|
schedules: null,
|
|
statusCount: {},
|
|
section: 'Schedules',
|
|
subsection: "success",
|
|
pagination: {
|
|
'current_page': 1
|
|
}
|
|
}
|
|
},
|
|
methods: {
|
|
fetchSchedules() {
|
|
axios.get('/api/v1/schedule/success?page=' + this.pagination.current_page)
|
|
.then(response => {
|
|
this.schedules = response.data.data,
|
|
this.statusCount = response.data.count,
|
|
this.pagination = response.data.meta;
|
|
})
|
|
.catch(error => {
|
|
console.log(error.response.data);
|
|
});
|
|
}
|
|
},
|
|
created() {
|
|
this.fetchSchedules();
|
|
setInterval(() => this.fetchSchedules(), 10000);
|
|
}
|
|
}
|
|
</script>
|
|
|