diff --git a/src/components/kpiCard.vue b/src/components/kpiCard.vue
index 71f9e233e891e9a9e217164bcf4142d897beee8d..e63b0f6bd4e0df534b8787f706b1d02d38997f1b 100644
--- a/src/components/kpiCard.vue
+++ b/src/components/kpiCard.vue
@@ -1,8 +1,16 @@
 <template>
   <div class="card mx-3 my-1 bground-light">
       <div class="card-body">
-          <h5 class="card-title text-blue">{{kpi.name}}</h5>
-          <p class="card-text text-blue">{{kpi.description}}</p>
+          <h5 class="card-title">{{kpi.name}}</h5>
+          <p class="card-subtitle text-blue">{{kpi.description}}</p>
+          <p class="card-subtitle text-blue mt-1">Deadline: {{kpi.deadline_time}}</p>
+      </div>
+      
+      <div class="card-footer">
+        <ul class="list-group list-group-horizontal" id="footer">
+          <li class="list-group-item bground-light text-blue">Target: {{kpi.target}}</li>
+          <li class="list-group-item bground-light text-blue">Weight: {{kpi.weight}}</li>
+        </ul>
       </div>
   </div>
 </template>
@@ -25,5 +33,7 @@ export default {
 </script>
 
 <style scoped>
-
+#footer{
+  width: 100%;
+}
 </style>
diff --git a/src/http-common.js b/src/http-common.js
index 71391958d777dccd75bcdb36c06ac5c3920c92e7..79a652db6c05881d51273c7944758e302983e845 100644
--- a/src/http-common.js
+++ b/src/http-common.js
@@ -1,7 +1,7 @@
 import axios from 'axios';
 
 export const HTTP = axios.create({
-  baseURL: `http://localhost:8000/api/`,
+  baseURL: `https://simkpi-backend.herokuapp.com/api`,
 //   headers: {
 //     Authorization: 'Bearer {token}'
 //   }
diff --git a/src/views/KpiIndex.vue b/src/views/KpiIndex.vue
index 60a3ba2fd55855a1e67166ffae6fe7075aabaff8..2449e5b8a06e11180b3bfc1b7209d274ee6c608a 100644
--- a/src/views/KpiIndex.vue
+++ b/src/views/KpiIndex.vue
@@ -42,11 +42,15 @@ export default {
     data(){
         return{
             temp_kpi: {
+                employee_id: 1,
                 name: "KPI",
                 description: "Deskripsi dari KPI",
-                deadline: "20-03-2022",
+                target: "100%",
+                is_score_inverted: false,
+                target_type: "percentage",
                 weight: "20",
-                target: "100%"
+                deadline: null,
+                deadline_time: "23:00",
             },
             filter:"Harian",
             kpis: [],
@@ -60,7 +64,6 @@ export default {
             this.kpis.push(this.temp_kpi)
             this.kpis.push(this.temp_kpi)
             this.kpis.push(this.temp_kpi)
-            console.log("get kpi")
         }
     },
     mounted(){