<template>
  <div>
    <a-card size="small" :bordered="false">
      <a-tabs default-active-key="1" @change="handleChange">
        <a-tab-pane key="1" tab="开单统计报表(客户)">
          <customerCountList ref="customerList" :tableTitle="tableTitle" :removeReportFlag="0"></customerCountList>
        </a-tab-pane>
        <a-tab-pane key="2" tab="开单统计报表(省份)" force-render>
          <provinceCountList ref="provinceList" :tableTitle="tableTitle1" :removeReportFlag="0"></provinceCountList>
        </a-tab-pane>
        <a-tab-pane key="3" tab="剔除数据(客户)" force-render>
          <customerCountList ref="customerList1" :tableTitle="tableTitle2" :removeReportFlag="1"></customerCountList>
        </a-tab-pane>
        <a-tab-pane key="4" tab="剔除数据(省份)" force-render>
          <provinceCountList ref="provinceList1" :tableTitle="tableTitle3" :removeReportFlag="1"></provinceCountList>
        </a-tab-pane>
      </a-tabs>
    </a-card>
  </div>
</template>
<script>
import { commonMixin } from '@/utils/mixin'
// 组件
import customerCountList from './customerCountList.vue'
import provinceCountList from './provinceCountList.vue'
import tableTitle from './dataCustomer.js'
import tableTitle1 from './dataProvince.js'
export default {
  name: 'BillingStatisticsIndex',
  mixins: [commonMixin],
  components: { customerCountList, provinceCountList },
  data () {
    return {
      tabVal: 1, // tab值  1轮胎月度费用报表 2轮胎季度费用报表 3轮胎年度费用报表 4轮胎费用明细报表
      tableTitle: { count: tableTitle.count, list: tableTitle.list.filter(item => item.key !== 'bizNo') },
      tableTitle1: { count: tableTitle1.count, list: tableTitle1.list.filter(item => item.key !== 'bizNo') },
      tableTitle2: tableTitle,
      tableTitle3: tableTitle1
    }
  },
  methods: {
    // 切换tab值  change
    handleChange (val) {
      this.tabVal = val
    },
    // 初始化
    pageInit () {
      if (this.tabVal == 1) {
        this.$refs.customerList.pageInit()
      }
    }
  },
  mounted () {
    if (!this.$store.state.app.isNewTab) { // 页签刷新时调用
      this.pageInit()
    }
  },
  activated () {
    // 如果是新页签打开，则重置当前页面
    if (this.$store.state.app.isNewTab) {
      this.pageInit()
    }
  }
}

</script>
