<template>
  <div class="mw-cpt a-fade-in"
       :ref="item.tempOnlyId"
       :class="{'z-focused': isFocused}"
       @click="focusCpt">

    <!-- 最新议题组件 -->
    <div class="issue_news"
         v-if="item.componentFrontId==='resi-functionList-hall-latestIssueList'">
      <div class="d-cpt-wrap">
        <div v-if="item.configuration.title"
             class="d-cpt-title">{{item.configuration.title}}</div>
        <div v-else
             class="d-cpt-title">{{item.configuration.title}}</div>
        <div class="list">
          <div class="item2"
               :key="subindex"
               v-for="(subitem, subindex) in item.demoData.list">
            <div class="d-news-title">{{ subitem.title }}</div>
            <div class="d-news-content">{{ subitem.content || '最新议题内容' }}</div>
            <div class="d-news-info">
              <img v-if="subitem.avatar"
                   :src="subitem.avatar">
              <img v-else
                   src="@/assets/img/modules/wx-mini/index-set/page/avatar-mini.png">
              <span>来源：{{ subitem.author }}</span>
              <span class="f-fr">{{ subitem.date }}</span>
            </div>
          </div>
        </div>
      </div>
    </div>
    <!-- 结案项目组件 -->
    <div class="issue_news"
         v-else-if="item.componentFrontId==='resi-functionList-hall-closedProjectList'">
      <div class="d-cpt-wrap">
        <div v-if="item.configuration.title"
             class="d-cpt-title">{{item.configuration.title}}</div>
        <div v-else
             class="d-cpt-title">{{item.configuration.title}}</div>
        <div class="list">
          <div class="item3"
               :key="subindex"
               v-for="(subitem, subindex) in item.demoData.list">
            <div class="d-news-title">{{ subitem.title }}</div>
            <div class="d-news-content">{{ subitem.content }}</div>
            <div class="d-news-info">
              <img src="@/assets/img/modules/wx-mini/index-set/pavilion.png">
              <span>来源：{{ subitem.author }}</span>
              <span class="f-fr">{{ subitem.date }}</span>
            </div>
          </div>
        </div>
      </div>
    </div>

  </div>
</template>

<script>

export default {
  name: 'cptItem',
  data () {
    return {}
  },
  components: {
  },
  props: {
    isFocused: Boolean,
    item: Object
  },
  methods: {

    focusCpt () {
      this.$emit('focusCpt', this.item)
    }
  }
}
</script>
<style lang="scss" src="@/assets/scss/modules/wx-mini/issue.scss"></style>
