From 62d8c5b0f3ff2234d5b8e9a092133f99842e16ae Mon Sep 17 00:00:00 2001
From: Saladin21 <13519187@std.stei.itb.ac.id>
Date: Sat, 16 Apr 2022 16:56:48 +0700
Subject: [PATCH] accept reject response

---
 src/components/table-response.vue | 37 +++++++++++++++++++++++++++----
 src/views/ResponseIndex.vue       | 35 +++++++++++++++++++++++++----
 2 files changed, 64 insertions(+), 8 deletions(-)

diff --git a/src/components/table-response.vue b/src/components/table-response.vue
index e0431ff..f7157d6 100644
--- a/src/components/table-response.vue
+++ b/src/components/table-response.vue
@@ -35,9 +35,10 @@
               </template>
             </template>
 
-          <td style="text-align: center">
-            <button @click="this.$emit('edit-entry', e[columns.Id.data])" class="btn btn-blue"> <i class="icon ion-android-create" style="font-size: 20px"></i> Edit </button>
-            <button @click="this.$emit('delete-entry', e[columns.Id.data])" class="btn-red"> <i class="icon ion-ios-trash-outline" style="font-size: 23px"></i> </button>
+          <td v-if="e.status == 'pending'" style="text-align: center">
+            <button @click="this.$emit('approve', e[columns.Id.data])" class="btn-green mx-2">Approve</button>
+            <button @click="this.$emit('adjust', e[columns.Id.data])" class="btn-blue mx-2">Adjust</button>
+            <button @click="this.$emit('reject', e[columns.Id.data])" class="btn-reject mx-2">Reject</button>
           </td>
         </tr>
       </tbody>
@@ -95,6 +96,10 @@ export default {
       default: true
     },
     key: Number,
+    refresh: {
+      type: Boolean,
+      default: true
+    },
   },
   data() {
     return {
@@ -127,6 +132,9 @@ export default {
     },
     endpoint(){
       this.getData()
+    },
+    refresh(){
+      this.getData()
     }
   },
   methods: {
@@ -135,7 +143,7 @@ export default {
       if (!this.sorted.asc){
         sortCol = `-${sortCol}`
       }
-        HTTP.get(`${this.endpoint}?page=${this.page}&sort=${sortCol}&filter[${this.filter_column}]=${this.filter}`).then((res)=>{
+        HTTP.get(`${this.endpoint}?page=${this.page}&sort=${sortCol}`).then((res)=>{
             if (res.status == 200){
               // console.log(res.data)
                 this.entries = res.data.data.data
@@ -217,4 +225,25 @@ li {
 th{
     text-align: center;
 }
+
+.btn-blue {
+  background-color: #6992b4;
+  color: #f1f7fc;
+  border-radius: 15px;
+  padding: 7px;
+}
+
+.btn-green {
+  background-color: #3CB371;
+  color: #f1f7fc;
+  border-radius: 15px;
+  padding: 7px;
+}
+
+.btn-reject {
+  background: #f4476b;
+  color: #f1f7fc;
+  border-radius: 15px;
+  padding: 7px;
+}
 </style>
diff --git a/src/views/ResponseIndex.vue b/src/views/ResponseIndex.vue
index 3b68d40..83eabdd 100644
--- a/src/views/ResponseIndex.vue
+++ b/src/views/ResponseIndex.vue
@@ -95,10 +95,12 @@
                             :columns="columns"
                             :filter="filter"
                             :filter_column="'status'"
-                            :edit = "false"
-                            :delete = "false"
                             :default_sort = "'status'"
+                            :refresh = "refresh"
                             @detail-entry="detailResponse"
+                            @approve="approve"
+                            @reject="reject"
+                            @adjust="adjust"
                         ></TableR>
                     </div>
                 </div>
@@ -158,18 +160,18 @@ export default {
             slug: "",
             endpoint:"",
             kpi:{},
+            refresh:true,
         }
     },
     created(){
         this.slug = this.$route.params.empId
         this.kpiId = this.$route.params.kpiId
         this.getEmpId()
-        console.log(this.isManager)
     },
     methods: {
         detailResponse(id){
             //routing page detail
-            this.$router.push({ name: "ResponseDetail", params: { kpiId: this.kpiId, empId:this.empId, responseId:id }});
+            this.$router.push({ name: "ResponseDetail", params: { kpiId: this.kpiId, empId:this.slug, responseId:id }});
         },
         getEmpId(){
             HTTP.get(`employees/${this.slug}`).then((res)=>{
@@ -182,6 +184,31 @@ export default {
                 this.kpi = res.data.data
                 this.endpoint = `kpis/${this.kpi.id}/employees/${this.emp.id}/kpi-responses`
             })
+        },
+        changeStatus(id, status){
+            HTTP.get(`kpi-responses/${id}`).then((res)=>{
+                let kpiRes = res.data.data
+                kpiRes.status = status
+                let response = {
+                    "kpi_id": kpiRes.kpi_id,
+                    "actual" : kpiRes.actual,
+                    "description" : kpiRes.description,
+                    "status" : status,
+                    "date" : kpiRes.date
+                }
+                HTTP.put(`kpi-responses/${id}`, response).then(()=>{
+                    this.refresh = !this.refresh
+                }).catch((e)=> {console.log(e.response.data)})
+            })
+        },
+        approve(id){
+            this.changeStatus(id, "approved")
+        },
+        reject(id){
+            this.changeStatus(id, "rejected")
+        },
+        adjust(id){
+            console.log(id)
         }
     }
     
-- 
GitLab