<template>
    <div class="pd10">
        <el-row style="overflow-y: hidden">
            <el-col>
                <el-tabs v-model.trim="activeName" @tab-click="handleClick" type="border-card">
                    <!-- 监测终端统计 -->

                    <!-- 监测点统计 -->
                    <el-tab-pane
                        label="区域稳态电能质量水平评估"
                        name="first"
                        :style="'height:' + vh + ';overflow: hidden;'"
                    >
                        <Census1 v-if="activeName == 'first'"></Census1>
                    </el-tab-pane>
                    <el-tab-pane
                        label="区域暂态电能质量水平评估"
                        name="second"
                        :style="'height:' + vh + ';overflow: hidden;'"
                    >
                        <transient v-if="activeName == 'second'"></transient>
                    </el-tab-pane>
                </el-tabs>
            </el-col>
        </el-row>
    </div>
</template>

<script>
import Census1 from './baselineLevelAssessment/baselineLevelAssessment.vue'
import transient from './baselineLevelAssessment/transient.vue'

export default {
    name: 'zhuwanjzsppg',
    components: { Census1, transient },
    data() {
        return {
            vh: '',
            activeName: 'first'
        }
    },
    created() {},
    mounted() {
        this.setHeight()
        window.addEventListener('resize', this.setHeight)
    },
    beforeDestroy() {
        window.removeEventListener('resize', this.setHeight)
    },
    methods: {
        setHeight() {
            this.vh = window.sessionStorage.getItem('appheight') - 80 + 'px'
        },
        handleClick(tab, event) {
            // console.log(tab, event);
        }
    }
}
</script>

<style lang="less" scoped>
@import url('../../styles/comStyle.less');
</style>
