l
<template>
    <div class="pd10">
        <el-row>
            <el-col>
                <el-tabs v-model.trim="activeName" @tab-click="handleClick" type="border-card">
                    <el-tab-pane label="风电概况" name="1" :style="'height:' + vh + ';'">
                        <overview v-if="activeName == '1'"></overview>
                    </el-tab-pane>

                    <el-tab-pane label="风电场指标总览" name="2" :style="'height:' + vh + ';'">
                        <ElectricityOverview v-if="activeName == '2'"></ElectricityOverview>
                    </el-tab-pane>

                    <el-tab-pane label="发射特性分析" name="3" :style="'height:' + vh + ';'">
                        <EmissionAnalysis v-if="activeName == '3'"></EmissionAnalysis>
                    </el-tab-pane>
                    <el-tab-pane label="影响特性分析" name="4" :style="'height:' + vh + ';'">
                        <influence v-if="activeName == '4'"></influence>
                    </el-tab-pane>

                     <el-tab-pane label="详细数据表" name="5" :style="'height:' + vh + ';'">
                        <dataSheet v-if="activeName == '5'"></dataSheet>
                    </el-tab-pane>
                </el-tabs>
            </el-col>
        </el-row>
    </div>
</template>
<script>
import overview from './WindFarm/overview.vue'
import ElectricityOverview from './WindFarm/ElectricityOverview.vue'
import EmissionAnalysis from './WindFarm/EmissionAnalysis.vue'
import influence from './WindFarm/influence.vue'
import dataSheet from './WindFarm/dataSheet.vue'
export default {
    name: 'fdcck',
    components: { overview, ElectricityOverview, EmissionAnalysis, influence, dataSheet },
    data() {
        return {
            vh: '',
            zoom: '',
            activeName: '2',
            device: ''
        }
    },
    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') - 83 + 'px'
        },
        handleClick(tab, event) {
            // console.log(tab, event);
        }
    }
}
</script>
<style lang="less" scoped>
@import url('../../styles/comStyle.less');
::v-deep .el-table .cell {
    text-align: center;
}
::v-deep .el-tabs--border-card > .el-tabs__content {
    padding: 10px;
}
::v-deep .el-form-item--small .el-form-item__content,
.el-form-item--small .el-form-item__label {
    height: 32px;
}
::v-deep .el-form-item--small .el-form-item__content,
.el-form-item--small .el-form-item__label {
    height: 32px;
}
</style>
