69 lines
1.5 KiB
Vue
69 lines
1.5 KiB
Vue
|
||
<template>
|
||
<!-- 6个方块-->
|
||
<el-row :gutter="10">
|
||
<el-col :xs="12" :sm="8" :lg="4" class="single-square-box-container" v-for="(item,index) in singleZdSqaure" :key="index+'singleSquareBox'">
|
||
<single-square-box :data="{...item,value:formatNumber(data[item.attr])}" ></single-square-box>
|
||
</el-col>
|
||
</el-row>
|
||
</template>
|
||
|
||
|
||
<script>
|
||
import SingleSquareBox from "@/components/Ems/SingleSquareBox/index.vue";
|
||
import {formatNumber} from '@/filters/ems'
|
||
export default {
|
||
components:{SingleSquareBox},
|
||
props:{
|
||
data:{
|
||
type:Object,
|
||
required:false,
|
||
default:()=>{return {}}
|
||
},
|
||
},
|
||
methods:{formatNumber},
|
||
data() {
|
||
return {
|
||
// 单个电站 四个方块数据
|
||
singleZdSqaure:[{
|
||
title:'实时有功功率（kW）',
|
||
value:'',
|
||
bgColor:'#FFF2CB',
|
||
attr:'totalActivePower'
|
||
},{
|
||
title:'实时无功功率（kVar）',
|
||
value:'',
|
||
bgColor:'#CBD6FF',
|
||
attr:'totalReactivePower'
|
||
},{
|
||
title:'电池堆SOC',
|
||
value:'',
|
||
bgColor:'#DCCBFF',
|
||
attr:'soc'
|
||
},{
|
||
title:'电池堆SOH',
|
||
value:'',
|
||
bgColor:'#FFD4CB',
|
||
attr:'soh'
|
||
},{
|
||
title:'今日充电量（kWh）',
|
||
value:'',
|
||
bgColor:'#FFD6F8',
|
||
attr:'dayChargedCap'
|
||
},{
|
||
title:'今日放电量（kWh）',
|
||
value:'',
|
||
bgColor:'#E1FFCA',
|
||
attr:'dayDisChargedCap'
|
||
}]
|
||
}
|
||
},
|
||
|
||
}
|
||
</script>
|
||
|
||
|
||
<style scoped lang="scss">
|
||
|
||
</style>
|