<template>
  <div class="tabsContainer">
    <el-tabs v-model="activeName" @tab-click="handleClick">
      <el-tab-pane label="汇总" name="first">
        <BFangTable :height="height" />
      </el-tab-pane>
      <el-tab-pane label="明细" name="second">
        <BFangLjTable :height="height" />
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import BFangTable from "@/views/zyjhzx/bfang/comps/BFangTable.vue";
import BFangLjTable from "@/views/zyjhzx/bfang/comps/BFangLJTable.vue";
import {EventBus} from "@/event-bus";

export default {
  name:'PPComponent',
  components: {BFangLjTable, BFangTable},
  props:{
    height:{
      type:Number|String,
      default:()=>786
    }
  },
  data(){
    return{
      activeName:'first',
    }
  },
  created(){
    EventBus.$on('detailShow', params => {
      this.activeName='second'
    })
  },
  methods:{
    handleClick(){
      EventBus.$emit('detailActive',this.activeName==='second')
    }
  }
}
</script>
<style scoped>
.el-tabs__content {
  display: flex;
  flex-direction: column;
}
.el-tab-pane {
  flex: 1; /* 让tab-pane填满可用空间 */
}
</style>
