<template>
  <div class="marketing-detail">
    <div>
      <div v-for="(item, index) in dataList" :key="index" class="detail-single">
        <div class="detail-top">
          <span class="top-name">{{item.name}}</span>
          <div class="top-right">
            <span class="top-time">{{item.time}}</span>
            <span class="top-state">{{item.state}}</span>
          </div>
        </div>
        <div class="detail-data">
          <span class="">推送人数： {{item.num}}</span>
          <span>推送成功： {{item.suc}}</span>
          <span>{{item.type}}</span>
        </div>
        <div class="detail-node">
          <span>创建推送节点： {{item.node}}</span>
        </div>
      </div>
    </div>
    <!-- <div class="marketing-total">
      <span class="demonstration">显示总数</span>
      <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page.sync="currentPage1" :page-size="100" layout="total, prev, pager, next" :total="1000">
      </el-pagination>
    </div> -->
  </div>
</template>

<script>
export default {
  data () {
    return {
      currentPage1: 5,
      dataList: []
    }
  },
  created () {
    this.GetPushDetail()
  },
  methods: {
    GetPushDetail () {
      this.axios.get('static/msg-mass.json').then(res => {
        if (res && res.data) {
          this.dataList = res.data.dataList
        }
      })
    },
    handleSizeChange (val) {
      console.log(`每页 ${val} 条`)
    },
    handleCurrentChange (val) {
      console.log(`当前页: ${val}`)
    }
  }
}
</script>
<style lang="stylus" scoped>
.marketing-detail
  .detail-single
    background-color #eee
    padding 0px 10px
    margin-bottom 10px
    box-sizing border-box
    float left
    width 50%
    .detail-top
      .top-name, .top-right
        display inline-block
        height 40px
        line-height 40px
      .top-right
        float right
    .detail-data, .detail-node
      height 40px
      line-height 40px
</style>
