<template>
  <div class="income-detail-header">
     <p class="total-income">收入明细</p>
     <div v-if="data.length === 0" class="no-data">暂无收入明细</div>
     <div v-else>
       <incomeItem :data="data"></incomeItem>
     </div>
  </div>
</template>

<script>
import incomeItem from './incomeItem'
export default {
  name: 'income-detail',
  props: {
      data: {
          type: Array,
          default: []
      }
  },
  data() {
    return {
     
    };
  },
    components: {
        incomeItem
    }

};
</script>

<style lang="scss" scoped>
.total-income {
  font-size: 36px;
  padding: 15px;
  border-bottom: solid 1px #eee;
}
.no-data {
      color: #ccc;
      font-weight: bold;
      text-align: center;
      font-size: 42px;
      padding: 100px 0;
  }
</style>