<template>
  <div class="adPlan">
    <el-tabs v-model="activeName" class="adPlan-tabs" @tab-change="tabChange">
      <el-tab-pane label="待审核" name="first">
        <auditView ref="first" />
      </el-tab-pane>
      <el-tab-pane label="已通过" name="second">
        <auSucces ref="second" />
      </el-tab-pane>
      <el-tab-pane label="已拒绝" name="third">
        <refuseView ref="third" />
      </el-tab-pane>
    </el-tabs>
  </div>
  
</template>

<script setup>
  import { ref,getCurrentInstance } from "vue";
  import auditView from "./components/auditView.vue";
  import auSucces from './components/auSuccess.vue';
  import refuseView from './components/refuseView.vue'
  const { proxy,ctx:that } = getCurrentInstance();

  const activeName = ref('first')

  const tabChange = (tab) => {
    proxy.$refs[tab].calculateTable();
  }
</script>

<style lang="scss" scoped>
.adPlan{
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  padding: 0 16px;
}
</style>
<style lang="scss">
.adPlan-tabs{
  height: 100%;
  width: 100%;
  .el-tabs__content{
    height: calc(100% - 55px);
    .el-tab-pane{
      height: 100%;
      width: 100%;
    }
  }
}
</style>