From ca4e3c5fca61b44ac7cfd14050f2777842ed5f4f Mon Sep 17 00:00:00 2001
From: Shaw <1050429181@qq.om>
Date: Fri, 4 Jun 2021 22:54:00 +0800
Subject: [PATCH] comment fix bugs 1. clear after comment 2. comment can't be
 empty 3. comment user head sculpture

---
 src/component/Comment/CommentForm.vue | 86 ++++++++++++++-------------
 src/component/Comment/CommentItem.vue |  2 +-
 2 files changed, 47 insertions(+), 41 deletions(-)

diff --git a/src/component/Comment/CommentForm.vue b/src/component/Comment/CommentForm.vue
index cc9f0d9..81f372f 100644
--- a/src/component/Comment/CommentForm.vue
+++ b/src/component/Comment/CommentForm.vue
@@ -29,49 +29,55 @@
 </template>
 
 <script>
-import { pushComment } from '@/api/comment'
+import { pushComment } from "@/api/comment";
 
-export default{
-    name: 'CommentForm',
-    data(){
-        return{
-            commentText: '',
-            isLoading: false
-        }
+export default {
+  name: "CommentForm",
+  data() {
+    return {
+      commentText: "",
+      isLoading: false,
+    };
+  },
+  props: {
+    slug: {
+      type: String,
+      default: null,
     },
-    props:{
-        slug:{
-            type: String,
-            default: null
-        }
+  },
+  methods: {
+    async pushComment() {
+      pushComment(commentText).then((response) => {
+        const { data } = response;
+        this.commentText = "";
+      });
     },
-    methods:{
-        async pushComment(){
-            pushComment(commentText).then(response =>{
-                const {data} = response
-                this.commentText = ''
-            })
-        },
 
-        async onSubmit(){
-            this.isLoading = true
-            try{
-                let postData = {}
-                console.log(this.commentText)
-                postData['content'] = this.commentText
-                postData['topic_id'] = this.slug
-                await pushComment(postData)
-                this.$emit('loadComment',this.slug)
-                this.$message.success('comment successfully')
-            }catch(e){
-                this.$buefy.toast.open({
-                    message: `Cannot comment this post.${e}`,
-                    type: 'is-danger'
-                })
-            }finally{
-                this.isLoading = false
-            }
+    async onSubmit() {
+      this.isLoading = true;
+      try {
+        let postData = {};
+        console.log(this.commentText);
+        if(this.commentText!='')
+        {
+          postData["content"] = this.commentText;
+          postData["topic_id"] = this.slug;
+          await pushComment(postData);
+          this.$emit("loadComment", this.slug);
+          this.$message.success("comment successfully");
+          this.commentText = "";          
         }
-    }
-}
+        else
+          alert("Comment text can't be empty");
+      } catch (e) {
+        this.$buefy.toast.open({
+          message: `Cannot comment this post.${e}`,
+          type: "is-danger",
+        });
+      } finally {
+        this.isLoading = false;
+      }
+    },
+  },
+};
 </script>
\ No newline at end of file
diff --git a/src/component/Comment/CommentItem.vue b/src/component/Comment/CommentItem.vue
index bf6275e..643b621 100644
--- a/src/component/Comment/CommentItem.vue
+++ b/src/component/Comment/CommentItem.vue
@@ -1,7 +1,7 @@
 <template>
     <article class="media">
         <figure class="media-left image is-48x48">
-            <img :src="`http://cn.gravater.com/avatar/${comment.usrId}?s=164&d=monsterid`">
+            <img :src="`https://cn.gravatar.com/avatar/${comment.userId}?s=164&d=monsterid`">
         </figure>
         <div class="media-content">
             <div class="content">
-- 
Gitee