添加评论功能

src/api/modules/learn.js

@@ -11,6 +11,8 @@ export default {
     // 查询素材详情
     JTXT_GET_MATERIAL_MATERIALID: "materials/{materialId}",
     // 发表评论
-    JTXT_POST_MATERIALS_COMMENT: "materials/{materialId}/comment"
+    JTXT_POST_MATERIALS_COMMENT: "materials/{materialId}/comment",
+    // 查询评论
+    JTXT_GET_MATERIALS_COMMENTS: "materials/{materialId}/comments"
   }
 };

src/views/home/learn/page-learn-content.vue

@@ -151,27 +151,18 @@ export default {
     // 查询：评论列表内容
     getCommentListFun() {
       // ！！！需要查询评论列表内容！！！
-      // TODO...
-      this.commentList = [
-        {
-          headerUrl: "", // 头像路径
-          userId: "评论的用户ID1", // 用户名
-          content: "这里是评论的内容1", // 评论内容
-          createdTime: "2021-04-10" // 评论日期
-        },
-        {
-          headerUrl: "", // 头像路径
-          userId: "评论的用户ID2", // 用户名
-          content: "这里是评论的内容2", // 评论内容
-          createdTime: "2021-04-10" // 评论日期
-        },
-        {
-          headerUrl: "", // 头像路径
-          userId: "评论的用户ID3", // 用户名
-          content: "这里是评论的内容3", // 评论内容
-          createdTime: "2021-04-10" // 评论日期
-        }
-      ];
+      let path = {
+        materialId: this.materialId
+      };
+      this.$_http
+        .get(this.$pathParams(this.$_API.JTXT_GET_MATERIALS_COMMENTS, path))
+        .then(res => {
+          this.commentList = res.data;
+          console.log("--comment--", res.data);
+        })
+        .catch(() => {
+          this.$store.commit("toggleLoading", false);
+        });
     },
     // 操作：返回
     onClickLeft() {
@@ -241,7 +232,28 @@ export default {
         Toast("未填写有效评论，无法发布");
         return;
       }
-      Toast("发布评论成功");
+      let path = {
+        materialId: this.materialId
+      };
+      let params = {
+        userId: "testuser-ztdxxDGdNj",
+        content: inputVal,
+        materialId: this.materialId
+      };
+      this.$_http
+        .post(
+          this.$pathParams(this.$_API.JTXT_POST_MATERIALS_COMMENT, path),
+          params
+        )
+        .then(res => {
+          Toast("发布评论成功");
+          console.log("--评论成功--", res.data);
+          //   重新查询评论列表
+          this.getCommentListFun();
+        })
+        .catch(() => {
+          this.$store.commit("toggleLoading", false);
+        });
       this.canclePostCommentFun(); // 置空输入框
     },
     // 操作：取消评论