模块提取

client/src/modules/discuss/src/discussDetail.vue

@@ -7,15 +7,15 @@
         <div class='user'>
           <div class='name'>{{user.name}}</div>
           <div class='time'>{{user.time}}</div>
-          <!-- <template v-if='discussQues.mine'><div class='right-txt' @click='deleteDiscuss'>{{ $t('pages.learn.discussDetail.delete') }}</div></template>
+          <template v-if='discussQues.mine'><div class='right-txt' @click='deleteDiscuss'>{{ $t('pages.learn.discussDetail.delete') }}</div></template>
           <div class='right-txt' @click='callbackComment' :data-sid='discussQues.sid' :data-qid='discussQues.qid' :data-quesid='discussQues.qid'>{{ $t('pages.learn.discussDetail.reply') }}</div>
           <div class='right-txt' @click='openOrcloseDis' data-key='disQus'>{{ $t('pages.learn.discussDetail.discuss') }}({{discussQues.comCnt}})</div>
-          <div class='right-txt' @click='btnlike' :data-quesid='discussQues.qid' :data-sid='discussQues.sid' :data-tagid='discussQues.tag_id'>
+          <!-- <div class='right-txt' @click='btnlike' :data-quesid='discussQues.qid' :data-sid='discussQues.sid' :data-tagid='discussQues.tag_id'>
             {{ $t('pages.learn.discussDetail.like') }}({{discussQues.likeCnt}})</div> -->
         </div>
-        <template v-if='disQus.isShowComment'>
+        <div v-show='disQus.isShowComment'>
           <answer :dataJson="discussQues" @updateList="getData"></answer>
-        </template>
+        </div>
       </div>
       <div class='result'>{{discussQues.askCnt}} {{ $t('pages.learn.discussion.answers') }}<div style='display: inline-block; width: 0.2rem;'></div>{{discussQues.TouCnt}} {{ $t('pages.learn.discussion.votes') }}</div>
       <!-- <template v-for='(item, index) in answersList'>
@@ -61,6 +61,14 @@
       </template>
       <div style='width: 750rpx; height: 200rpx;'></div> -->
     </div>
+    <div class='input-publish'>
+    <textarea id="editor"></textarea>
+      <!-- <div class='ask'> -->
+        <!-- <image class='img' src='./icons/ask.png' mode='aspectFill'></image> -->
+        <!-- <input type='text' class="txt" placeholder='{{inputStatus.placeholder}}' focus='{{inputStatus.canFocus}}' bindblur='blurInput' confirm-type='send' bindconfirm='publishContent' value='{{inputStatus.input}}' cursor-spacing='20'/> -->
+      <!-- </div> -->
+      <el-button type="primary" @click="publishContent">{{ $t('pages.learn.discussDetail.send') }}</el-button><em class="send">({{inputStatus.placeholder}})</em>
+    </div>
   </div>
 </template>
 
@@ -84,6 +92,11 @@ export default {
       /* 存储状态值 的对象, 记录上次用户操作 */
       disQus: {
         isShowComment: false
+      },
+      inputStatus: {
+        canFocus: false,
+        placeholder: `${this.$t('pages.learn.discussDetail.answering')} ...`,
+        input: ''
       }
     }
   },
@@ -96,9 +109,9 @@ export default {
     }
   },
   methods: {
-    // updateList () {
-    //   this.getData()
-    // },
+    updateList () {
+      this.getData()
+    },
     deleteDiscuss () {
       const loading = this.$loading({ lock: true, text: '', spinner: '', background: 'rgba(255, 255, 255, 0.9)' })
       api.deleteDiscuss(this.id).then(json => {
@@ -133,6 +146,39 @@ export default {
       //   // this.answers = answers
       // }).catch(e => { this.$message.error(e.message) }).finally(() => { loading.close() })
     },
+    callbackComment (e) {
+      // /* 如果，输入框中，本身已经存在输入内容，那么再点击其他回复时，不给提示，直接清空 */
+      this.inputStatus.input = '' // 这里如果想判断，不能使用 inputStatus.input这个 在blur时存储
+      const _data = e.currentTarget.dataset
+      const qid = _data.qid
+      const quesid = _data.quesid
+      const ansid = _data.ansid
+      const to = _data.to
+      const sid = _data.sid
+      const json = {}
+      if (qid) { json.questionId = qid }
+      if (to) { json.to = to }
+      if (quesid) { json.question_id = quesid }
+      if (ansid) { json.answer_id = ansid }
+      if (sid) { json.semester_id = sid }
+      this.call = json
+      if (to) {
+        this.inputStatus.placeholder = this.$t('pages.learn.discussDetail.reply') + to + '：'
+      } else {
+        this.inputStatus.placeholder = `${this.$t('pages.learn.discussDetail.reply')}：`
+      }
+      this.inputStatus.canFocus = true
+      $('#editor').focus()
+    },
+    openOrcloseDis (e) {
+      const key = e.currentTarget.dataset.key
+      if (key === 'disQus') {
+        this.disQus.isShowComment = !this.disQus.isShowComment
+      } else {
+        const index = e.currentTarget.dataset.index
+        this.answers[index].isShowComment = !this.answers[index].isShowComment
+      }
+    },
     setData (_data) {
       const json = {
         ques: {
@@ -153,7 +199,7 @@ export default {
           isShowComment: false,
           has_tag: _data.has_tag,
           tag_id: (_data.tag && _data.tag.id) || '',
-          comments: _data.comments.map(function (_, i) {
+          comments: _data.comments.map((_, i) => {
             return {
               cid: _.id,
               user: {
@@ -165,36 +211,7 @@ export default {
               mine: _.mine
             }
           })
-        },
-        answer: (_data.answers && _data.answers.map(function (_, i) {
-          return {
-            aid: _.id,
-            user: {
-              url: _.replier.avatar || '',
-              name: _.replier.nickname,
-              time: _.created_time
-            },
-            text: _.contents,
-            likeCnt: _.tag_count,
-            comCnt: _.comments.length,
-            mine: _.mine,
-            isShowComment: false,
-            has_tag: _.has_tag,
-            tag_id: (_.tag && _.tag.id) || '',
-            comments: _.comments.map(function (__, i) {
-              return {
-                cid: __.id,
-                user: {
-                  url: __.observer.avatar || '',
-                  name: __.observer.nickname,
-                  time: __.created_time
-                },
-                text: __.comments,
-                mine: __.mine
-              }
-            })
-          }
-        })) || []
+        }
       }
       return json
     }