<template>
  <div class="app-container">
    <el-tabs
      v-model="tabStatus"
      @tab-click="handleTagToggle"
    >
      <el-tab-pane label="新增销售统计" name="0">
        <next-add ref="add" />
      </el-tab-pane>
      <el-tab-pane label="销售业绩统计" name="1">
        <next-sale ref="sale" />
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
// 组件
import NextAdd from './components/NextAdd'
import NextSale from './components/NextSale'
export default {
  components: {
    NextAdd,
    NextSale
  },
  data() {
    return {
      tabStatus: '0',
      searchParams: {
        search_name: '',
        page_index: 1,
        page_size: 20
      },
      allNextTable: [],
      allNextTableTotal: 0
    }
  },
  watch: {
    tabStatus(newVal, oldVal) {
      this.init()
    }
  },
  created() {
    this.$nextTick(() => {
      this.init()
    })
  },
  methods: {
    // 选项卡切换
    handleTagToggle(tab) {
      this.tabStatus = tab.name
    },
    // 初始化
    init() {
      const tab = this.tabStatus
      switch (tab) {
        case '0':
          this.$refs.add.newNextList()
          break
        case '1':
          this.$refs.sale.allNextList()
          break
        default:
      }
    }
  }
}
</script>
