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/reservation.vue | 9 +++++++++
 1 file changed, 9 insertions(+)
 create mode 100644 resources/js/components/reservation.vue

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

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


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 +++++++++++++++++++++++++++--
 1 file changed, 27 insertions(+), 2 deletions(-)

(limited to 'resources/js/components/reservation.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>
-- 
cgit v1.2.3


From 1aa368a4c461ec6a8bcd7695767ceda7b09f7c28 Mon Sep 17 00:00:00 2001
From: Mateja <mail@matejamaric.com>
Date: Wed, 17 Mar 2021 17:36:28 +0100
Subject: Small fixes in `reservations.vue`

---
 resources/js/components/reservation.vue | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

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

diff --git a/resources/js/components/reservation.vue b/resources/js/components/reservation.vue
index 1e04c89..fdc14d1 100644
--- a/resources/js/components/reservation.vue
+++ b/resources/js/components/reservation.vue
@@ -15,19 +15,19 @@
     <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>;
+      <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'],
+  props: [ 'reservationIndex' ],
   computed: {
     reservation() {
-      return this.$store.getters.getData[reservationIndex];
+      return this.$store.getters.getData[this.reservationIndex];
     }
   }
 }
-- 
cgit v1.2.3


From 1bbc94a7e39a1ca84d8aee2d10d942375ca3f264 Mon Sep 17 00:00:00 2001
From: Mateja <mail@matejamaric.com>
Date: Wed, 17 Mar 2021 20:15:58 +0100
Subject: Stopped using `contenteditable` in `reservation.vue`

---
 resources/js/components/reservation.vue | 35 +++++++++++++++++++++------------
 1 file changed, 22 insertions(+), 13 deletions(-)

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

diff --git a/resources/js/components/reservation.vue b/resources/js/components/reservation.vue
index fdc14d1..fbb5fdc 100644
--- a/resources/js/components/reservation.vue
+++ b/resources/js/components/reservation.vue
@@ -1,20 +1,20 @@
 <template>
   <tr>
-    <td>{{ reservation.id }}</td>
-    <td>
+    <td class="align-middle text-center">{{ reservation.id }}</td>
+    <td class="align-middle text-center">
       <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>
+    <td class="align-middle"><input type="text" v-model="reservation.operatorCall"></td>
+    <td class="align-middle"><input type="text" v-model="reservation.qso"></td>
+    <td class="align-middle"><input type="text" v-model="reservation.fromTime"></td>
+    <td class="align-middle"><input type="text" v-model="reservation.toTime"></td>
+    <td class="align-middle"><input type="text" v-model="reservation.specialCall"></td>
+    <td class="align-middle"><input type="text" v-model="reservation.frequencies"></td>
+    <td class="align-middle"><input type="text" v-model="reservation.modes"></td>
+    <td class="align-middle"><input type="text" v-model="reservation.operatorName"></td>
+    <td class="align-middle"><input type="text" v-model="reservation.operatorEmail"></td>
+    <td class="align-middle"><input type="text" v-model="reservation.operatorCall"></td>
+    <td class="align-middle">
       <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>
@@ -32,3 +32,12 @@ export default {
   }
 }
 </script>
+
+<style scoped>
+input {
+  background-color: white;
+  border: 1px solid lightgray;
+  border-radius: 3px;
+  padding: 0.2em;
+}
+</style>
-- 
cgit v1.2.3


From 074bff2e79d91610a936f329ac8f603049c3b334 Mon Sep 17 00:00:00 2001
From: Mateja <mail@matejamaric.com>
Date: Thu, 18 Mar 2021 19:37:53 +0100
Subject: Better styling for `reservation.vue` component.

---
 resources/js/components/reservation.vue | 32 +++++++++++++++++---------------
 1 file changed, 17 insertions(+), 15 deletions(-)

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

diff --git a/resources/js/components/reservation.vue b/resources/js/components/reservation.vue
index fbb5fdc..85348bd 100644
--- a/resources/js/components/reservation.vue
+++ b/resources/js/components/reservation.vue
@@ -1,20 +1,18 @@
 <template>
   <tr>
-    <td class="align-middle text-center">{{ reservation.id }}</td>
-    <td class="align-middle text-center">
-      <input type="checkbox" :checked="reservation.approved"/>
-    </td>
-    <td class="align-middle"><input type="text" v-model="reservation.operatorCall"></td>
-    <td class="align-middle"><input type="text" v-model="reservation.qso"></td>
-    <td class="align-middle"><input type="text" v-model="reservation.fromTime"></td>
-    <td class="align-middle"><input type="text" v-model="reservation.toTime"></td>
-    <td class="align-middle"><input type="text" v-model="reservation.specialCall"></td>
-    <td class="align-middle"><input type="text" v-model="reservation.frequencies"></td>
-    <td class="align-middle"><input type="text" v-model="reservation.modes"></td>
-    <td class="align-middle"><input type="text" v-model="reservation.operatorName"></td>
-    <td class="align-middle"><input type="text" v-model="reservation.operatorEmail"></td>
-    <td class="align-middle"><input type="text" v-model="reservation.operatorCall"></td>
-    <td class="align-middle">
+    <td v-text="reservation.id"></td>
+    <td><input type="checkbox" :checked="reservation.approved"/></td>
+    <td><input type="text" v-model="reservation.operatorCall"></td>
+    <td><input type="text" v-model="reservation.qso"></td>
+    <td><input type="text" v-model="reservation.fromTime"></td>
+    <td><input type="text" v-model="reservation.toTime"></td>
+    <td><input type="text" v-model="reservation.specialCall"></td>
+    <td><input type="text" v-model="reservation.frequencies"></td>
+    <td><input type="text" v-model="reservation.modes"></td>
+    <td><input type="text" v-model="reservation.operatorName"></td>
+    <td><input type="text" v-model="reservation.operatorEmail"></td>
+    <td><input type="text" v-model="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>
@@ -34,6 +32,10 @@ export default {
 </script>
 
 <style scoped>
+td {
+  text-align: center;
+  vertical-align: middle;
+}
 input {
   background-color: white;
   border: 1px solid lightgray;
-- 
cgit v1.2.3


From 1306d59960fadbd5637960e60b9a00f547a1aeb9 Mon Sep 17 00:00:00 2001
From: Mateja <mail@matejamaric.com>
Date: Fri, 19 Mar 2021 14:16:32 +0100
Subject: Work on `reservation.vue` component:

- Use data properties instead of computed properties
- Use v-model for checkbox
---
 resources/js/components/reservation.vue | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

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

diff --git a/resources/js/components/reservation.vue b/resources/js/components/reservation.vue
index 85348bd..aa8b209 100644
--- a/resources/js/components/reservation.vue
+++ b/resources/js/components/reservation.vue
@@ -1,7 +1,7 @@
 <template>
   <tr>
     <td v-text="reservation.id"></td>
-    <td><input type="checkbox" :checked="reservation.approved"/></td>
+    <td><input type="checkbox" v-model="reservation.approved"/></td>
     <td><input type="text" v-model="reservation.operatorCall"></td>
     <td><input type="text" v-model="reservation.qso"></td>
     <td><input type="text" v-model="reservation.fromTime"></td>
@@ -23,9 +23,9 @@
 <script>
 export default {
   props: [ 'reservationIndex' ],
-  computed: {
-    reservation() {
-      return this.$store.getters.getData[this.reservationIndex];
+  data() {
+    return {
+      reservation: this.$store.getters.getData[this.reservationIndex]
     }
   }
 }
-- 
cgit v1.2.3


From 5a30e103893c05d138a80ed18d65a948aea973e6 Mon Sep 17 00:00:00 2001
From: Mateja <mail@matejamaric.com>
Date: Sat, 20 Mar 2021 20:33:17 +0100
Subject: Fix operatorPhone and add click methods.

---
 resources/js/components/reservation.vue | 19 +++++++++++++++----
 1 file changed, 15 insertions(+), 4 deletions(-)

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

diff --git a/resources/js/components/reservation.vue b/resources/js/components/reservation.vue
index aa8b209..d733c9d 100644
--- a/resources/js/components/reservation.vue
+++ b/resources/js/components/reservation.vue
@@ -11,11 +11,11 @@
     <td><input type="text" v-model="reservation.modes"></td>
     <td><input type="text" v-model="reservation.operatorName"></td>
     <td><input type="text" v-model="reservation.operatorEmail"></td>
-    <td><input type="text" v-model="reservation.operatorCall"></td>
+    <td><input type="text" v-model="reservation.operatorPhone"></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>
+      <button class="btn btn-primary mr-2" @click="updateRow">Update</button>
+      <button class="btn btn-warning mr-2" @click="restoreRow">Restore</button>
+      <button class="btn btn-danger" @click="deleteRow">Delete</button>
     </td>
   </tr>
 </template>
@@ -27,6 +27,17 @@ export default {
     return {
       reservation: this.$store.getters.getData[this.reservationIndex]
     }
+  },
+  methods: {
+    updateRow() {
+
+    },
+    restoreRow() {
+
+    },
+    deleteRow() {
+
+    }
   }
 }
 </script>
-- 
cgit v1.2.3


From 09ee04d39911f169457567c869d732a11387651a Mon Sep 17 00:00:00 2001
From: Mateja <mail@matejamaric.com>
Date: Sat, 20 Mar 2021 22:47:33 +0100
Subject: Use Lodash cloneDeep for `reservation.vue` component.

---
 resources/js/components/reservation.vue | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

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

diff --git a/resources/js/components/reservation.vue b/resources/js/components/reservation.vue
index d733c9d..5389e1a 100644
--- a/resources/js/components/reservation.vue
+++ b/resources/js/components/reservation.vue
@@ -25,15 +25,18 @@ export default {
   props: [ 'reservationIndex' ],
   data() {
     return {
-      reservation: this.$store.getters.getData[this.reservationIndex]
+      reservation: {}
     }
   },
+  mounted() {
+    this.reservation = _.cloneDeep(this.$store.getters.getData[this.reservationIndex]);
+  },
   methods: {
     updateRow() {
 
     },
     restoreRow() {
-
+      this.reservation = _.cloneDeep(this.$store.getters.getData[this.reservationIndex]);
     },
     deleteRow() {
 
-- 
cgit v1.2.3


From 2809ccf7272d4b77c5eb3f3d6599143dc4678d70 Mon Sep 17 00:00:00 2001
From: Mateja <mail@matejamaric.com>
Date: Sun, 21 Mar 2021 18:05:38 +0100
Subject: Work on `reservation.vue` component.

- Move Lodash cloneDeep to Vuex store.
---
 resources/js/components/reservation.vue | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

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

diff --git a/resources/js/components/reservation.vue b/resources/js/components/reservation.vue
index 5389e1a..ec430ab 100644
--- a/resources/js/components/reservation.vue
+++ b/resources/js/components/reservation.vue
@@ -25,21 +25,21 @@ export default {
   props: [ 'reservationIndex' ],
   data() {
     return {
-      reservation: {}
+      reservation: this.$store.getters.getDataRow(this.reservationIndex)
     }
   },
-  mounted() {
-    this.reservation = _.cloneDeep(this.$store.getters.getData[this.reservationIndex]);
-  },
   methods: {
     updateRow() {
-
+      this.$store.dispatch('pushReservation', {
+        index: this.reservationIndex,
+        reservation: this.reservation
+      });
     },
     restoreRow() {
-      this.reservation = _.cloneDeep(this.$store.getters.getData[this.reservationIndex]);
+      this.reservation = this.$store.getters.getDataRow(this.reservationIndex);
     },
     deleteRow() {
-
+      this.$store.dispatch('removeReservation', this.reservationIndex);
     }
   }
 }
-- 
cgit v1.2.3