<template>
    <div class="model">
        <!-- 标题栏 -->
        <el-row>
            <el-col :span="12">
                <TitleComponent title="报警管理" subtitle="配置新能源厂站的报警级别、类型及相关规则" />
            </el-col>
        </el-row>
        <!-- 报警管理 -->
        <el-row>
            <el-col :span="12">
                <levelPie />
            </el-col>
        </el-row>
        <el-row>
            <el-col :span="12">
                <fenxiBar />
            </el-col>
        </el-row>
        <el-row>
            <el-col :span="12">
                <totalView />
            </el-col>
        </el-row>
    </div>
</template>

<script setup>
import TitleComponent from '@/components/TitleComponent/index.vue';
import levelPie from '@/views/integratedManage/alarmManage/components/levelPie.vue'
import fenxiBar from '@/views/integratedManage/alarmManage/components/fenxiBar.vue'
import totalView from '@/views/integratedManage/alarmManage/components/totalView.vue';
</script>

<style scoped>
.model {
    padding: 20px 15px;
    background-color: rgba(242, 248, 252, 1);
}
</style>
