You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
 

49 lines
1.8 KiB

<template>
<a-tabs v-model:activeKey="activeKey" @change="handleTabChange">
<a-tab-pane key="1" tab="能耗统计">
<energyConsumption ref="energyConsumptionRef" />
</a-tab-pane>
<a-tab-pane key="2" tab="碳排统计" force-render>
<carbonEmissions ref="carbonEmissionsRef" />
</a-tab-pane>
<a-tab-pane key="3" tab="碳排速算">
<quickCalculation ref="quickCalculationRef" />
</a-tab-pane>
</a-tabs>
</template>
<script lang="ts" setup>
import { ref } from 'vue';
import energyConsumption from './energyConsumption/index.vue';
import carbonEmissions from './carbonEmissions/index.vue';
import quickCalculation from './quickCalculation/index.vue';
defineOptions({
name: 'CarbonEmissionStatisticsIndex', // 与页面路由name一致缓存才可生效
components: {
energyConsumption,
carbonEmissions,
quickCalculation,
},
});
const activeKey = ref('1');
const energyConsumptionRef = ref<InstanceType<typeof energyConsumption> | null>(null);
const carbonEmissionsRef = ref<InstanceType<typeof carbonEmissions> | null>(null);
const quickCalculationRef = ref<InstanceType<typeof quickCalculation> | null>(null);
// 切换tab页的回调
const handleTabChange = (key) => {
console.log('Tab changed:', key);
// 在这里可以执行需要在页面切换时执行的逻辑
if (key === '1') {
if (energyConsumptionRef.value) {
energyConsumptionRef.value.mainRef.nsTableRef.reload();
}
} else if (key === '2') {
if (carbonEmissionsRef.value) {
carbonEmissionsRef.value.getTableList(); // 调用子组件的方法
}
} else if (key === '3') {
if (quickCalculationRef.value) {
quickCalculationRef.value.getTreeData();
}
}
};
</script>