<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="second" :style="'height:' + vh + ';'">
                        <Census1 v-if="activeName == 'second'"></Census1>
                    </el-tab-pane>
                    <!-- 监测终端统计 -->
                    <el-tab-pane label="指标统计报表报告" name="first" :style="'height:' + vh + ';'">
                        <!-- v-if="id != '' ? true : false" -->
                        <steadyState ref="steadyState" :id="id" />
                        <!-- <Census></Census> -->
                    </el-tab-pane>
                    <el-tab-pane label="暂态区域报告" name="Regionalreports" :style="'height:' + vh + ';'">
                        <!-- 区域报告  监测点报告 -->
                        <Regionalreports v-if="activeName == 'Regionalreports'"></Regionalreports>
                    </el-tab-pane>
                </el-tabs>
            </el-col>
        </el-row>
    </div>
</template>

<script>
import Timslot from './statisticalReport/Timeslot.vue'
import Timslot1 from './statisticalReport/Timeslot1.vue'
import Census from './statisticalReport/Census.vue'
import steadyState from './statisticalReport/steadyState.vue'
import Census1 from './statisticalReport/Census1.vue'
import Census2 from './statisticalReport/Census2.vue'
import Regionalreports from './statisticalReport/Regionalreports.vue'
// import Regionalreports from "./statisticalReport/Regionalreports.vue";

export default {
    name: 'zwtjbb',
    components: {
        Timslot1,
        Timslot,
        Census,
        Census1,
        Census2,
        Regionalreports,
        steadyState
    },
    data() {
        return {
            vh: '',
            vh1: '',
            activeName: 'second',
            device: '',
            id: ''
        }
    },
    created() {},
    mounted() {
        this.setHeight()
        window.addEventListener('resize', this.setHeight)
    },
    beforeDestroy() {
        window.removeEventListener('resize', this.setHeight)
    },
    methods: {
        setHeight() {
            this.device = window.devicePixelRatio
            this.vh = window.sessionStorage.getItem('appheight') - 80 + 'px'
            this.vh1 = window.sessionStorage.getItem('appheight') - 20 + 'px'
        },
        handleClick(tab, event) {
            // if ((this.activeName == "first")) {
            //   this.$refs.steadyState.getTemplateLists();
            // }
        }
    }
}
</script>

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