From 71331b046d42c14c771b2a82ca7bbeba0b0d900f Mon Sep 17 00:00:00 2001
From: Denys Seredenko <denis-seredenko@ukr.net>
Date: Thu, 12 Jan 2023 14:26:48 +0100
Subject: [PATCH] * add new comment feature: #11

---
 src/components/modals/RegisterModal.vue |  3 ++-
 src/components/tabs/CommentsTab.vue     | 32 ++++++++++++++++++++++++-
 src/service/ContractsService.js         | 12 ++++++++++
 3 files changed, 45 insertions(+), 2 deletions(-)

diff --git a/src/components/modals/RegisterModal.vue b/src/components/modals/RegisterModal.vue
index 5686131..3f40f6f 100644
--- a/src/components/modals/RegisterModal.vue
+++ b/src/components/modals/RegisterModal.vue
@@ -49,6 +49,7 @@
 <script>
 import { mapActions } from 'vuex'
 import { applyContract } from '../../service/ContractsService'
+import router from '../../router/index'
 
 export default {
   computed: {
@@ -61,7 +62,7 @@ export default {
     apply(role) {
       const id = this.selectedContract
       if (id === null) {
-        //TODO: router push error page
+        router.push('/error?message=' + 'Contract not found' + '&code=404')
       }
       applyContract(id, role)
     }
diff --git a/src/components/tabs/CommentsTab.vue b/src/components/tabs/CommentsTab.vue
index 7475fa4..a299ab2 100644
--- a/src/components/tabs/CommentsTab.vue
+++ b/src/components/tabs/CommentsTab.vue
@@ -30,11 +30,15 @@
 
     <div class="flex justify-center">
       <div class="py-4 mb-10 shadow-2xl">
-        <form class="w-full max-w-xl bg-white rounded-lg px-4 pt-2">
+        <form
+          class="w-full max-w-xl bg-white rounded-lg px-4 pt-2"
+          @submit.prevent
+          @submit="postComment()">
           <div class="flex flex-wrap -mx-3 mb-6">
             <h2 class="px-4 pt-3 pb-2 text-gray-800 text-lg">Add comment</h2>
             <div class="w-full md:w-full px-3 mb-2 mt-2">
               <textarea
+                v-model="message"
                 class="bg-gray-100 rounded border border-gray-400 leading-normal resize-none w-full h-20 py-2 px-3 font-medium placeholder-gray-700 focus:outline-none focus:bg-white"
                 name="body"
                 placeholder="Type Your Comment"
@@ -56,12 +60,38 @@
   </div>
 </template>
 <script>
+import { saveComment } from '../../service/ContractsService'
+
 export default {
   props: {
     contract: {
       type: Object,
       default: () => ({})
     }
+  },
+  data() {
+    return {
+      message: ''
+    }
+  },
+  computed: {
+    name() {
+      return this.$store.state.keycloak.keycloak.tokenParsed.name
+    }
+  },
+  methods: {
+    postComment() {
+      if (this.message === '') return
+
+      const comment = {
+        name: this.name,
+        text: this.message,
+        date: new Date()
+      }
+
+      saveComment(comment)
+      this.$router.go()
+    }
   }
 }
 </script>
diff --git a/src/service/ContractsService.js b/src/service/ContractsService.js
index fe5da6a..3834cad 100644
--- a/src/service/ContractsService.js
+++ b/src/service/ContractsService.js
@@ -105,3 +105,15 @@ export async function deleteContract(contractId) {
       router.push('/error?message=' + error.message + '&code=' + error.code)
     })
 }
+
+export async function saveComment(comment) {
+  return HttpClient.post('/comments', comment)
+    .then(resp => {
+      //TODO: send also auth token with request
+      return resp.data
+    })
+    .catch(error => {
+      console.error(error)
+      router.push('/error?message=' + error.message + '&code=' + error.code)
+    })
+}