<template>
    <div class="_energy">
     <layout>
         <template #left>
             <div style="height: 100%;display: flex;flex-direction: column;overflow: hidden;">
                <sameDay style="flex: 1;"/>
                 <consumptionPower style="flex: 1;"/>
                 <consumptionWater style="flex: 1;"/>
             </div>
         </template>
         <template #content>
             <p>能源</p>
         </template>
         <template #right>
             <div style="height: 100%;display: flex;flex-direction: column;overflow: hidden;">
                <running style="flex: 1;"/>
                <consume  style="flex: 1;"/>
                <carbonEmission style="flex: 1;"/>
             </div>
         </template>
     </layout>
    </div>
 </template>
 
 <script setup name="Role">
 import layout from "@/components/layout_/index.vue";
 import sameDay from './modules/sameDay.vue'
 import consumptionPower from './modules/consumptionPower.vue'
 import consumptionWater from './modules/consumptionWater.vue'
 import running from './modules/running.vue'
 import carbonEmission from './modules/carbonEmission.vue'
 import consume from './modules/consume.vue'
 
 
 </script> 
 <style lang="scss">
 ._energy{
     height: 100%;
 }
 </style>
 