<template>
  <div>
    <el-tabs v-model="activeName" @tab-click="handleClick">
      <el-tab-pane label="经销商分析" name="first">
        <!-- 分享 -->
        <share-data />
        <!-- 浏览数据 -->
        <read-data type="agency" />
        <!-- 下载数据 -->
        <downloadData type="agency" />

      </el-tab-pane>
      <el-tab-pane label="团队内部分析" name="second">
        <!-- 浏览数据 -->
        <read-data type='team' />
        <!-- 下载数据 -->
        <downloadData type='team' />
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import shareData from "@/HManagement/archives_ad/dataAnalysis/modules/adShareData.vue";
import readData from '@/HManagement/archives_ad/dataAnalysis/modules/adReadData.vue';
import downloadData from "@/HManagement/archives_ad/dataAnalysis/modules/adDownloadData.vue";

export default {
  components: { shareData, readData, downloadData },
  data() {
    return {
      activeName: "first",
    }
  },
  methods: {
    handleClick(tab, event) {
      console.log(tab, event);
    }
  },
  mounted() {
  }
}
</script>

<style scoped>
/deep/.el-tabs__header {
  padding-left: 15px !important;
  background: #fff;
}

/deep/.el-tabs__nav-wrap::after {
  height: 0 !important;
}

.share-data {
  width: 100%;
}

.share-data .chart {
  display: flex;
  justify-content: space-between;
  height: 435px;
  background: red;
  width: 100%;
}
</style>