<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>
