<template>
  <div
    class="boxWrap"
    id="boxWrap">
    <Form1></Form1>

    <div
      class="table-box"
      id="table-box"
      style="margin-bottom:0"
      ref="table-wrap">
      <el-tabs v-model="activeName">
        <el-tab-pane
          label="售票员统计"
          name="售票员统计">
          <span slot="label">
            售票员统计
            <!-- <Tip msg="仅包含窗口的门票销售数据，不包含线上门票的销售数据。"></Tip> -->
          </span>

          <Table1></Table1>
        </el-tab-pane>

        <el-tab-pane
          label="售票点统计"
          name="售票点统计">
          <span slot="label">
            售票点统计
            <!-- <Tip msg="仅包含窗口的门票销售数据，不包含线上门票的销售数据。"></Tip> -->
          </span>

          <Table4></Table4>
        </el-tab-pane>

        <el-tab-pane
          label="财务汇总统计"
          name="财务汇总统计">
          <span slot="label">
            财务汇总统计
            <!-- <Tip msg="仅包含窗口的门票销售数据，不包含线上门票的销售数据。"></Tip> -->
          </span>

          <Table2></Table2>
        </el-tab-pane>

        <el-tab-pane
          label="收款统计"
          name="收款统计">
          <span slot="label">
            收款统计
            <Tip msg="仅包含窗口的门票和会员的销售收款数据。"></Tip>
          </span>

          <Table3></Table3>
        </el-tab-pane>
      </el-tabs>

      <el-switch
        class="switch"
        v-model="isColSpan"
        active-text="合并单元格"
        inactive-text="关闭合并"
        :active-value="true"
        :inactive-value="false">
      </el-switch>
    </div>
  </div>
</template>

<script>
import Form1 from './Form1.vue'
import Table1 from './Table1.vue'
import Table2 from './Table2.vue'
import Table3 from './Table3.vue'
import Table4 from './Table4.vue'

export default {
  components: {
    Form1,
    Table1,
    Table2,
    Table3,
    Table4
  },
  provide () {
    return {
      app: this
    }
  },
  data () {
    return {
      isColSpan: true,
      loading: false,
      loading0: false,
      activeName: '售票员统计',

      index: 0,
      tableData0: [],
      tableIndex: 1,
      OrderIndexArr: [],

      tableData: [],
      cashData: [],
      financialData: [],
      channelList: []
    }
  }
}
</script>

<style lang="scss" scoped>
.table-box {
  border: 0; position: relative;
  ::v-deep .el-tabs__nav-wrap {
    padding: 0 24px;
  }
}
.switch{
  position: absolute; right: 10px;top: 10px;
}
</style>
