<template>
    <div class="homePage">
        <div class="center-bar" style="height: 100%;">
            <el-row :gutter="10" style="height: 100%;">
                <el-col :span="16">
                    <el-row>
                        <el-col :span="24">
                            <ControlAllArea :datas="datas"/>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="24">
                            <CheckArea />
                        </el-col>
                    </el-row>
                </el-col>
                <!-- <el-col :span="8">
                    <el-row>
                        <el-col :span="23">
                            <ModeControl :current="current"></ModeControl>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="23">
                            <FocusArea />
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="23">
                            <WarningArea></WarningArea>
                        </el-col>
                    </el-row>
                </el-col> -->
            </el-row>
            <!-- <WindturbineDetailPages v-model="dialogVisible"></WindturbineDetailPages> -->
        </div>
    </div>
</template>

<script>
    // @ is an alias to /src
    import MessageBridge from 'utils/MessageBridge'
    import ControlAllArea from "components/control/controlAllArea.vue";
    import CheckArea from "components/check/checkArea.vue";
    import ModeControl from "components/modeControl/modeControl.vue";
    import FocusArea from "components/focus/focusArea.vue";
    import WarningArea from "components/warning/warningArea.vue";
    export default {
        name: 'Home',
        components: {
            ControlAllArea,
            CheckArea,
            ModeControl,
            FocusArea,
            WarningArea
        },
        created() {
            this.initData();
        },
        data() {
            return {
                url: process.env.VUE_APP_SHARDINGURL,
                current: 2,
            };
        },
        mounted() {
            const { current,datas } = this.$route.query
            this.current = Number(current) 
        },
        methods: {
            initData: function () {
                var mb = MessageBridge.getInstance();
                var vs = [{ key: "/topic/fault-popup", action: this.faultMessage }];
                mb.register(vs);
            },
            faultMessage(msg) {
                var val = JSON.parse(msg);
            },
        },
    }
</script>
<style scoped>
    .homePage {
        height: 87%;
    }
</style>