<template>
  <div class="detail-all clear">
    <el-row>
      <el-col :span="12" v-for="(item, index) in dataList" :key="index">
        <div class="detail-single">
          <div class="detail-top">
            <span class="top-name detail-title">{{item.name}}</span>
            <div class="top-right">
              <span class="top-time detail-title">{{item.time}}</span>
              <span class="top-state">{{item.state}}</span>
            </div>
          </div>
          <div class="detail-data">
            <span>
              <span class="detail-title">推送人数：</span> {{item.num}}
              <span class="detail-title">推送成功:</span> {{item.suc}}
            </span>
            <span class="detail-title">失败原因:</span> {{item.suc}}
            <span class="detail-title">{{item.type}}</span>
          </div>
          <div class="detail-node">
            <span class="detail-title">创建推送节点：</span> {{item.node}}
          </div>
        </div>
      </el-col>
    </el-row>
    <pagination></pagination>
  </div>
</template>

<script>
import Pagination from 'components/Pagination'
export default {
  data () {
    return {
      dataList: []
    }
  },
  components: {
    Pagination
  },
  created () {
    this.GetPushDetail()
  },
  methods: {
    GetPushDetail () {
      this.axios.get('static/msg-mass.json').then(res => {
        if (res && res.data) {
          this.dataList = res.data.dataList
        }
      })
    }
  }
}
</script>
<style lang="stylus" scoped>
.detail-all
  .detail-title
    font-size 14px
    color #496D92
    text-align left
  .detail-single
    height 124px
    background-color rgba(251, 252, 252, 1)
    border-radius 5px
    box-shadow 5px 5px 5px rgba(228, 228, 228, 0.349019)
    margin 0 15px 15px 0
    padding 0 10px
    .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>
/*

.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

*/
