From 865bb1f30a0c4567522525fb0be9fd99bd796ecf Mon Sep 17 00:00:00 2001
From: Mateja <mail@matejamaric.com>
Date: Sat, 13 Mar 2021 17:56:37 +0100
Subject: Adding boilerplate code.

---
 resources/js/components/reservations.vue | 9 +++++++++
 1 file changed, 9 insertions(+)
 create mode 100644 resources/js/components/reservations.vue

(limited to 'resources/js/components/reservations.vue')

diff --git a/resources/js/components/reservations.vue b/resources/js/components/reservations.vue
new file mode 100644
index 0000000..48e54f5
--- /dev/null
+++ b/resources/js/components/reservations.vue
@@ -0,0 +1,9 @@
+<template>
+  
+</template>
+
+<script>
+export default {
+  
+}
+</script>
-- 
cgit v1.2.3-70-g09d2


From 294146dd14c412e0cd6c715685bcbce0ff92b865 Mon Sep 17 00:00:00 2001
From: Mateja <mail@matejamaric.com>
Date: Wed, 17 Mar 2021 12:59:27 +0100
Subject: Started work on reservation components.

---
 resources/js/components/reservation.vue  | 29 +++++++++++++++++--
 resources/js/components/reservations.vue | 49 ++++++++++++++++++++++++++++++--
 resources/js/store.js                    |  7 +++++
 3 files changed, 81 insertions(+), 4 deletions(-)

(limited to 'resources/js/components/reservations.vue')

diff --git a/resources/js/components/reservation.vue b/resources/js/components/reservation.vue
index 48e54f5..1e04c89 100644
--- a/resources/js/components/reservation.vue
+++ b/resources/js/components/reservation.vue
@@ -1,9 +1,34 @@
 <template>
-  
+  <tr>
+    <td>{{ reservation.id }}</td>
+    <td>
+      <input type="checkbox" :checked="reservation.approved"/>
+    </td>
+    <td contenteditable="true">{{ reservation.operatorCall }}</td>
+    <td contenteditable="true">{{ reservation.qso }}</td>
+    <td contenteditable="true">{{ reservation.fromTime }}</td>
+    <td contenteditable="true">{{ reservation.toTime }}</td>
+    <td contenteditable="true">{{ reservation.specialCall }}</td>
+    <td contenteditable="true">{{ reservation.frequencies }}</td>
+    <td contenteditable="true">{{ reservation.modes }}</td>
+    <td contenteditable="true">{{ reservation.operatorName }}</td>
+    <td contenteditable="true">{{ reservation.operatorEmail }}</td>
+    <td contenteditable="true">{{ reservation.operatorCall }}</td>
+    <td>
+      <button class="btn btn-primary mr-2">Update</button>;
+      <button class="btn btn-warning mr-2">Restore</button>;
+      <button class="btn btn-danger">Delete</button>;
+    </td>
+  </tr>
 </template>
 
 <script>
 export default {
-  
+  props: ['reservationIndex'],
+  computed: {
+    reservation() {
+      return this.$store.getters.getData[reservationIndex];
+    }
+  }
 }
 </script>
diff --git a/resources/js/components/reservations.vue b/resources/js/components/reservations.vue
index 48e54f5..278dfa4 100644
--- a/resources/js/components/reservations.vue
+++ b/resources/js/components/reservations.vue
@@ -1,9 +1,54 @@
 <template>
-  
+  <div>
+    <call-sign-filter @sign-changed="filterChanged()"></call-sign-filter>
+
+    <div class="table-responsive mt-2">
+        <table id="ajax-table" class="table table-striped table-bordered" style="white-space:nowrap;"><!-- table-hover -->
+            <thead class="thead-dark">
+                <tr>
+                    <th>ID</th>
+                    <th>Approved</th>
+                    <th>Operator Callsign</th>
+                    <th>QSO</th>
+                    <th>From</th>
+                    <th>To</th>
+                    <th>Special Callsign</th>
+                    <th>Frequencies</th>
+                    <th>Modes</th>
+                    <th>Operator Name</th>
+                    <th>Operator Email</th>
+                    <th>Operator Phone</th>
+                    <th>Actions</th>
+                </tr>
+            </thead>
+            <tbody>
+              <reservation-view v-for="(reservation, index) in reservations" 
+                :key="reservation.id" :reservation-index="index">
+              </reservation-view>
+            </tbody>
+        </table>
+    </div>
+  </div>
 </template>
 
 <script>
+import callSignFilter from './call-sign-filter.vue';
+import reservationView from './reservation.vue';
+
 export default {
-  
+  components: { callSignFilter, reservationView },
+  mounted() {
+    this.$store.dispatch('fillReservations');
+  },
+  computed: {
+    reservations() {
+      return this.$store.getters.getData;
+    }
+  },
+  methods: {
+    filterChanged() {
+      this.$store.dispatch('fillReservations');
+    }
+  }
 }
 </script>
diff --git a/resources/js/store.js b/resources/js/store.js
index 852ba6b..4ca0dc3 100644
--- a/resources/js/store.js
+++ b/resources/js/store.js
@@ -47,6 +47,13 @@ export default new Vuex.Store({
       }).catch(error => {
         console.log(error);
       });
+    },
+    async fillReservations(context) {
+      await axios.post('/special-calls/reservations', {'call-sign': this.state.selectedSign}).then(response => {
+        context.commit('setData', response.data.data);
+      }).catch(error => {
+        console.log(error);
+      });
     }
   }
 });
-- 
cgit v1.2.3-70-g09d2


From 2f5e8adb8d310690db54aca55382f4733e337a85 Mon Sep 17 00:00:00 2001
From: Mateja <mail@matejamaric.com>
Date: Sat, 20 Mar 2021 19:42:18 +0100
Subject: Better names for Vuex actions and mutations.

---
 resources/js/components/activities.vue            |  4 ++--
 resources/js/components/call-sign-description.vue |  2 +-
 resources/js/components/call-sign-filter.vue      |  2 +-
 resources/js/components/reservations.vue          |  4 ++--
 resources/js/store.js                             | 10 +++++-----
 5 files changed, 11 insertions(+), 11 deletions(-)

(limited to 'resources/js/components/reservations.vue')

diff --git a/resources/js/components/activities.vue b/resources/js/components/activities.vue
index 2f2cf03..dd22c7f 100644
--- a/resources/js/components/activities.vue
+++ b/resources/js/components/activities.vue
@@ -37,7 +37,7 @@ import callSignFilter from './call-sign-filter.vue';
 export default {
   components: { callSignFilter },
   mounted() {
-    this.$store.dispatch('fillData');
+    this.$store.dispatch('pullActivities');
   },
   computed: {
     activities() {
@@ -46,7 +46,7 @@ export default {
   },
   methods: {
     filterChanged() {
-      this.$store.dispatch('fillData');
+      this.$store.dispatch('pullActivities');
     }
   }
 }
diff --git a/resources/js/components/call-sign-description.vue b/resources/js/components/call-sign-description.vue
index e930176..30cd37d 100644
--- a/resources/js/components/call-sign-description.vue
+++ b/resources/js/components/call-sign-description.vue
@@ -18,7 +18,7 @@
 <script>
 export default {
   mounted() {
-    this.$store.dispatch('fillSigns').then(() => {
+    this.$store.dispatch('pullSigns').then(() => {
       try {
         this.$store.dispatch('setSelectedSign', this.$store.getters.getSigns[0].sign);
       }
diff --git a/resources/js/components/call-sign-filter.vue b/resources/js/components/call-sign-filter.vue
index bf554bd..16eaae8 100644
--- a/resources/js/components/call-sign-filter.vue
+++ b/resources/js/components/call-sign-filter.vue
@@ -11,7 +11,7 @@
 <script>
 export default {
   mounted() {
-    this.$store.dispatch('fillSigns');
+    this.$store.dispatch('pullSigns');
   },
   computed: {
     selected: {
diff --git a/resources/js/components/reservations.vue b/resources/js/components/reservations.vue
index 278dfa4..8849474 100644
--- a/resources/js/components/reservations.vue
+++ b/resources/js/components/reservations.vue
@@ -38,7 +38,7 @@ import reservationView from './reservation.vue';
 export default {
   components: { callSignFilter, reservationView },
   mounted() {
-    this.$store.dispatch('fillReservations');
+    this.$store.dispatch('pullReservations');
   },
   computed: {
     reservations() {
@@ -47,7 +47,7 @@ export default {
   },
   methods: {
     filterChanged() {
-      this.$store.dispatch('fillReservations');
+      this.$store.dispatch('pullReservations');
     }
   }
 }
diff --git a/resources/js/store.js b/resources/js/store.js
index 4ca0dc3..345b866 100644
--- a/resources/js/store.js
+++ b/resources/js/store.js
@@ -23,7 +23,7 @@ export default new Vuex.Store({
     setSelectedSign(state, sign) {
       state.selectedSign = sign;
     },
-    fillSigns(state, signs) {
+    setSigns(state, signs) {
       state.callSigns = signs;
     },
     setData(state, data) {
@@ -34,21 +34,21 @@ export default new Vuex.Store({
     setSelectedSign(context, sign) {
       context.commit('setSelectedSign', sign);
     },
-    async fillSigns(context) {
+    async pullSigns(context) {
       await axios.get('/special-calls/show').then(response => {
-        context.commit('fillSigns', response.data);
+        context.commit('setSigns', response.data);
       }).catch(error => {
         console.log(error);
       });
     },
-    async fillData(context) {
+    async pullActivities(context) {
       await axios.post('/api/activities', {'call-sign': this.state.selectedSign}).then(response => {
         context.commit('setData', response.data.data);
       }).catch(error => {
         console.log(error);
       });
     },
-    async fillReservations(context) {
+    async pullReservations(context) {
       await axios.post('/special-calls/reservations', {'call-sign': this.state.selectedSign}).then(response => {
         context.commit('setData', response.data.data);
       }).catch(error => {
-- 
cgit v1.2.3-70-g09d2


From ce6dbf4d6f1340a02899faa3c4984b3493270ce8 Mon Sep 17 00:00:00 2001
From: Mateja <mail@matejamaric.com>
Date: Sun, 21 Mar 2021 20:31:12 +0100
Subject: Limit reservations table height to fit on desktop screens.

---
 resources/js/components/reservations.vue | 8 ++++++++
 1 file changed, 8 insertions(+)

(limited to 'resources/js/components/reservations.vue')

diff --git a/resources/js/components/reservations.vue b/resources/js/components/reservations.vue
index 8849474..0c420b8 100644
--- a/resources/js/components/reservations.vue
+++ b/resources/js/components/reservations.vue
@@ -52,3 +52,11 @@ export default {
   }
 }
 </script>
+
+<style scoped>
+@media only screen and (min-width:961px) {
+  .table-responsive {
+    max-height: 80vh;
+  }
+}
+</style>
-- 
cgit v1.2.3-70-g09d2

