课程讨论模块提取

client/src/modules/discuss/api/index.js

@@ -56,3 +56,40 @@ export const callbackComment = (param) => {
     { headers: { 'Content-Type': 'application/json' } }
   )
 }
+
+/**
+ * 回答问题
+ */
+export const answerQues = (param) => {
+  return httpRequest.post(
+    '/v2/qa/answers',
+    param,
+    { headers: { 'Content-Type': 'application/json' } }
+  )
+}
+/**
+ * 删除回答
+ */
+export const deleteAnswer = (aid) => {
+  return httpRequest.delete(
+    `/v2/qa/answers/${aid}`
+  )
+}
+/**
+ * 取消点赞
+ */
+export const unlike = (tagid) => {
+  return httpRequest.delete(
+    `/v2/qa/tags/${tagid}`
+  )
+}
+/**
+ * 点赞
+ */
+export const like = (param) => {
+  return httpRequest.post(
+    '/v2/qa/tags',
+    param,
+    { headers: { 'Content-Type': 'application/json' } }
+  )
+}

client/src/modules/discuss/assets/languages/en.json

@@ -4,6 +4,17 @@
       "answers": "Answers",
       "votes": "Votes",
       "noData": "No discussion"
+    },
+    "DiscussDetail": {
+      "title": "Problem details",
+      "like": "Like",
+      "discuss": "Discuss",
+      "reply": "Reply",
+      "delete": "Delete",
+      "send": "Send",
+      "noAnswer": "No answer",
+      "deleteSuccess": "Delete success",
+      "answering": "Answer"
     }
   }
 }
\ No newline at end of file

client/src/modules/discuss/assets/languages/zh-CN.json

@@ -4,6 +4,17 @@
       "answers": "回答",
       "votes": "投票",
       "noData": "暂无相关评论"
+    },
+    "DiscussDetail": {
+      "title": "问题详情",
+      "like": "点赞",
+      "discuss": "讨论",
+      "reply": "回复",
+      "delete": "删除",
+      "send": "发送",
+      "noAnswer": "暂无回答",
+      "deleteSuccess": "删除成功",
+      "answering": "回答问题"
     }
   }
 }

client/src/modules/discuss/components/answerItem.vue

+<template>
+  <div>
+    <div class="ask">
+      <div class="user-1">
+        <img class="img-1" :src="avatar" />
+        <div class="right-1">
+          <div class="name-1">{{data.replier.nickname}}</div>
+          <div class="time-1">{{data.created_time}}</div>
+        </div>
+      </div>
+      <div class="text" v-html="data.contents"></div>
+      <div class="user">
+        <template v-if="data.mine">
+          <div
+            class="right-txt"
+            @click="deleteAnswer(data.id)"
+          >{{ $t('pages.learn.discussDetail.delete') }}</div>
+        </template>
+        <div class="right-txt" @click="$emit('reply', {answer_id: data.id})">{{ $t('pages.learn.discussDetail.reply') }}</div>
+        <div
+          class="right-txt"
+          @click="commentVisible = !commentVisible"
+        >{{ $t('pages.learn.discussDetail.discuss') }}({{data.comments.length}})</div>
+        <div class="right-txt" @click="$emit('btnlike', {tagId: data.tag ? data.tag.id : null, ansId: data.id})">点赞({{data.tag_count}})</div>
+      </div>
+      <template v-if="commentVisible">
+        <!-- 评论列表 -->
+        <template v-for="item in data.comments">
+          <reply-item :data="item" :dataId="data.id" :key="item.id"></reply-item>
+        </template>
+      </template>
+    </div>
+  </div>
+</template>
+
+<script>
+import * as api from '../api/index.js'
+import replyItem from './replyItem.vue'
+export default {
+  components: { replyItem },
+  props: {
+    data: { type: Object, default: () => {} }
+  },
+  data() {
+    console.log(this.data)
+    return {
+      commentVisible: false
+    }
+  },
+  computed: {
+    avatar() {
+      return this.data.replier.avatar || '../assets/images/person-default.jpg'
+    }
+  },
+  methods: {
+    deleteAnswer (id) {
+      const loading = this.$loading({ lock: true, text: '', spinner: '', background: 'rgba(255, 255, 255, 0.9)' })
+      api.deleteAnswer(id).then(json => {
+        this.$parent.updateList()
+        this.$message({ type: 'success', message: this.$t('pages.learn.discussDetail.deleteSuccess') })
+      }).catch(e => { this.$message.error(e.message) }).finally(() => { loading.close() })
+    }
+  }
+}
+</script>
+
+<style lang="sass" scoped>
+</style>

client/src/modules/discuss/components/childAnswer.vue

-<template>
-  <div>
-    <div class='ask'>
-      <template v-for='(item, index) in abswerData.comments'>
-        <div v-bind:key="index" class='item-list' :data-id='item.id'>
-          <div class='user'>
-            <div class='name'>{{item.user.name}}</div>
-            <div class='time'>{{item.user.time}}</div>
-            <template v-if='item.mine'><div class='right-txt' @click='deleteComment' :data-cid='item.cid'>{{ $t('pages.learn.discussDetail.delete') }}</div></template>
-            <div class='right-txt' @click='callbackComment' :data-sid='abswerData.sid' :data-qid='abswerData.qid' :data-quesid='abswerData.qid' :data-to='item.user.name'>{{ $t('pages.learn.discussDetail.reply') }}</div>
-          </div>
-          <div class='text'>{{item.text}}</div>
-        </div>
-      </template>
-    </div>
-  </div>
-</template>
-
-<script>
-import * as api from '../api/index'
-export default {
-  data () {
-    return {
-      abswerData: {}
-    }
-  },
-  props: {
-    dataJson: {
-      type: Object,
-      require: false
-    }
-  },
-  mounted() {
-  },
-  methods: {
-    deleteComment (e) {
-      const cid = e.currentTarget.dataset.cid
-      const loading = this.$loading({ lock: true, text: '', spinner: '', background: 'rgba(255, 255, 255, 0.9)' })
-      api.deleteComment(cid).then(json => {
-        this.$emit('updateList')
-        this.$message({ type: 'success', message: this.$t('pages.learn.discussDetail.deleteSuccess') })
-      }).catch(e => { this.$message.error(e.message) }).finally(() => { loading.close() })
-    },
-    callbackComment () {
-    }
-  },
-  watch: {
-    dataJson: function(newVal, oldVal) {
-      this.abswerData = newVal
-      console.log(this.abswerData, '==============')
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-
-</style>

client/src/modules/discuss/components/replyDetailItem.vue

+<template>
+  <div class="item-list">
+    <div class="user">
+      <div class="name">{{data.observer.nickname}}</div>
+      <div class="time">{{data.created_time}}</div>
+      <template v-if="data.mine">
+        <div
+          class="right-txt"
+          @click="deleteComment(data.id)"
+        >{{ $t('pages.learn.discussDetail.delete') }}</div>
+      </template>
+      <div class="right-txt" @click="$emit('reply', {to: data.observer.nickname, question_id: dataId})">{{ $t('pages.learn.discussDetail.reply') }}</div>
+    </div>
+    <div class="text" v-html="data.comments"></div>
+  </div>
+</template>
+<script>
+import * as api from '../api/index.js'
+export default {
+  props: {
+    data: { type: Object, default: () => {} },
+    dataId: { type: String, default: () => {} }
+  },
+  data() {
+    return {}
+  },
+  methods: {
+    deleteComment (id) {
+      const loading = this.$loading({ lock: true, text: '', spinner: '', background: 'rgba(255, 255, 255, 0.9)' })
+      api.deleteComment(id).then(json => {
+        this.$parent.updateList()
+        this.$message({ type: 'success', message: this.$t('pages.learn.discussDetail.deleteSuccess') })
+      }).catch(e => { this.$message.error(e.message) }).finally(() => { loading.close() })
+    }
+  }
+}
+</script>

client/src/modules/discuss/components/replyItem.vue

+<template>
+  <div class="item-list">
+    <div class="user">
+      <div class="name">{{data.observer.nickname}}</div>
+      <div class="time">{{data.created_time}}</div>
+      <template v-if="data.mine">
+        <div
+          class="right-txt"
+          @click="deleteComment(data.id)"
+        >{{ $t('pages.learn.discussDetail.delete') }}</div>
+      </template>
+      <div class="right-txt" @click="reply({answer_id: dataId, to: data.observer.nickname})">{{ $t('pages.learn.discussDetail.reply') }}</div>
+    </div>
+    <div class="text" v-html="data.comments"></div>
+  </div>
+</template>
+<script>
+import * as api from '../api/index.js'
+export default {
+  props: {
+    data: { type: Object, default: () => {} },
+    dataId: { type: String, default: () => {} }
+  },
+  data() {
+    return {}
+  },
+  methods: {
+    reply (param) {
+      this.$parent.$parent.replyComposeParam(param)
+    },
+    deleteComment (id) {
+      const loading = this.$loading({ lock: true, text: '', spinner: '', background: 'rgba(255, 255, 255, 0.9)' })
+      api.deleteComment(id).then(json => {
+        this.$parent.$parent.updateList()
+        this.$message({ type: 'success', message: this.$t('pages.learn.discussDetail.deleteSuccess') })
+      }).catch(e => { this.$message.error(e.message) }).finally(() => { loading.close() })
+    }
+  }
+}
+</script>