diff --git a/src/components/partials/Comments.vue b/src/components/partials/Comments.vue
index 404290c6ffdb22d97c43cdbdc5021e5170a3f917..b7b88c9d899315481b5ee8aa627de51d088c7424 100644
--- a/src/components/partials/Comments.vue
+++ b/src/components/partials/Comments.vue
@@ -11,11 +11,11 @@
         bg-variant="light"
         class="item"
         v-for="comment in lists"
-        :key="comment.commenter_id"
+        :key="comment._id.$oid"
       >
         <div><small class="font-weight-bold">{{comment.commenter_name}}</small></div>
         {{comment.comment_text}}
-        <div><small class="text-muted font-italic">{{comment.date}}</small></div>
+        <div><small class="text-muted font-italic">{{convertTimestamp(comment.date.$date)}}</small></div>
         <b-card
           v-if="comment.hasOwnProperty('reply')"
           bg-variant="dark"
@@ -165,16 +165,23 @@ export default {
     },
   },
   methods: {
-    addComment: function() {
-      this.items.unshift({
-        "id"    : (this.rows+1),
-        "userid": 0,
-        "name": "Rifo Ahmad Genadi",
-        "content": this.text,
-        "timestamp": "29 Maret 2019, 02.48 WIB",
+    addComment() {
+      let fetchData = {
+        method: 'POST',
+        body: JSON.stringify({ page_id: this.id, text: this.text }),
+        headers: { "Content-Type": "application/json", "Authorization": this.$store.state.user.token }
+      }
+
+      fetch(`${this.$store.state.baseUrl}/api/comment/add`, fetchData)
+      .then(response => response.json())
+      .then(response => {
+        console.log(response)
+        if(response.status === 200) {
+          this.refreshContent()
+        }
       })
     },
-    replyComment: function(id) {
+    replyComment(id) {
       this.items[this.rows-id-1].reply = {
         "name": "Administrator",
         "content": this.replyText[id],
@@ -182,8 +189,9 @@ export default {
       }
       this.refreshContent();
     },
-    refreshContent: function() {
+    refreshContent() {
       if(this.id != '') {
+        this.data = []
         this.noticeText = "Memuat komentar"
         let fetchData = {
           method: 'POST',
@@ -191,8 +199,6 @@ export default {
           headers: { "Content-Type": "application/json" }
         }
 
-        print(fetchData)
-
         fetch(`${this.$store.state.baseUrl}/api/comment/get`, fetchData)
         .then(response => response.json())
         .then(response => {
@@ -204,6 +210,17 @@ export default {
           }
         })
       }
+    },
+    convertTimestamp(unix) {
+      let months = ['Januari', 'Februari', 'Maret', 'April', 'Mei', 'Juni', 'Juli', 'Agustus', 'September', 'Oktober', 'November', 'Desember']
+      let date = new Date(unix)
+      let year = date.getFullYear()
+      let month = months[date.getMonth()]
+      let day = date.getDate()
+      let hours = date.getHours()
+      let minutes = "0" + date.getMinutes()
+      let seconds = "0" + date.getSeconds()
+      return day + ' ' + month + ' ' + year + ', ' + hours +':'+ minutes.substr(-2) + ':' + seconds.substr(-2) + ' WIB'
     }
   },
   created() {