From 5d79c586b963b1249eb148816a70d1cec618511f Mon Sep 17 00:00:00 2001
From: Mateja <mail@matejamaric.com>
Date: Sun, 14 Mar 2021 21:38:01 +0100
Subject: Work on `activities` component.
It currently doesn't update on filter change.
---
resources/js/components/activities.vue | 26 ++++++++++++++++++++++++--
resources/js/components/call-sign-filter.vue | 1 +
resources/js/store.js | 13 +++++++++++++
3 files changed, 38 insertions(+), 2 deletions(-)
(limited to 'resources/js')
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);
+ });
}
}
});
--
cgit v1.2.3