diff options
| -rw-r--r-- | resources/js/components/activities.vue | 26 | ||||
| -rw-r--r-- | resources/js/components/call-sign-filter.vue | 1 | ||||
| -rw-r--r-- | resources/js/store.js | 13 |
3 files changed, 38 insertions, 2 deletions
diff --git a/resources/js/components/activities.vue b/resources/js/components/activities.vue index 976516f..01e7002 100644 --- a/resources/js/components/activities.vue +++ b/resources/js/components/activities.vue @@ -1,5 +1,5 @@ <template> - <div> + <div @signChanged="filterChanged()"> <call-sign-filter></call-sign-filter> <div class="table-responsive mt-2"> @@ -16,6 +16,15 @@ </tr> </thead> <tbody> + <tr v-for="activity in activities"> + <td>{{ activity.operatorCall }}</td> + <td>{{ activity.fromTime }}</td> + <td>{{ activity.toTime }}</td> + <td>{{ activity.specialCall }}</td> + <td>{{ activity.frequencies }}</td> + <td>{{ activity.modes }}</td> + <td>{{ activity.qso }}</td> + </tr> </tbody> </table> </div> @@ -26,6 +35,19 @@ import callSignFilter from './call-sign-filter.vue'; export default { - components: { callSignFilter } + components: { callSignFilter }, + mounted() { + this.$store.dispatch('fillData'); + }, + computed: { + activities() { + return this.$store.getters.getData; + } + }, + methods: { + filterChanged() { + this.$store.dispatch('fillData'); + } + } } </script> diff --git a/resources/js/components/call-sign-filter.vue b/resources/js/components/call-sign-filter.vue index 8e3228c..e8d22a5 100644 --- a/resources/js/components/call-sign-filter.vue +++ b/resources/js/components/call-sign-filter.vue @@ -20,6 +20,7 @@ export default { }, set(value) { this.$store.dispatch('setSelectedSign', value); + this.$emit('signChanged'); } }, options() { diff --git a/resources/js/store.js b/resources/js/store.js index 669f0bc..852ba6b 100644 --- a/resources/js/store.js +++ b/resources/js/store.js @@ -14,6 +14,9 @@ export default new Vuex.Store({ }, getSigns(state) { return state.callSigns; + }, + getData(state) { + return state.data; } }, mutations: { @@ -22,6 +25,9 @@ export default new Vuex.Store({ }, fillSigns(state, signs) { state.callSigns = signs; + }, + setData(state, data) { + state.data = data; } }, actions: { @@ -34,6 +40,13 @@ export default new Vuex.Store({ }).catch(error => { console.log(error); }); + }, + async fillData(context) { + await axios.post('/api/activities', {'call-sign': this.state.selectedSign}).then(response => { + context.commit('setData', response.data.data); + }).catch(error => { + console.log(error); + }); } } }); |