<template>
  <div>
    <div class="detail-main__comments">
      <div class="detail-comments">
        <div class="detail-comments__wrapper">
          <div
            class="detail-comments__title"
            :data-comments="commentsList.total_comments"
          >
            Комментарии
          </div>
          <ul class="detail-comments__list">
            <ArticleCommentsItem
              v-for="commentsItem in commentsList.comments"
              :key="commentsItem.id"
              :commentsItem="commentsItem"
              @commentResponse="commentResponseData"
            />
          </ul>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import { mapGetters } from "vuex"
export default {
  props: {
    pull_id: {
      type: String,
    },
    newCommentsList: {
      type: Object,
    },
  },
  watch: {
    newCommentsList(val) {
      this.commentsList = val;
    },
  },
  data() {
    return {
      script: ``,
      commentsList: []
    }
  },
  mounted() {
    this.$axios.get("/comments/pull_" + this.pull_id + (0 ? 'page_' + 0 : ''))
    .then((Comments) => {
      this.commentsList = Comments.data.data;
    });
  },
  methods: {
    commentResponseData(data) {
      this.$emit('commentResponse', data);
    }
  }
}
</script>

<style>
</style>
