xzzn/emsapp
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

工作栏

Browse Source
This commit is contained in:
白菜
2025-07-29 23:05:58 +08:00
parent 2b4022d1d0
commit ce9b4a4ca4
13 changed files with 2173 additions and 634 deletions
Download Patch File Download Diff File Expand all files Collapse all files

211
pages/work/db/index.vue Normal file
View File

@ -0,0 +1,211 @@
<template>
<view class="page-container">
<uni-collapse ref="collapse">
<!-- 总表 -->
<uni-collapse-item open :class="zbInfo.emsCommunicationStatus !== '0' ? 'danger' :'running'">
<template v-slot:title>
<view class="title-row">
<view class="title">{{`1#${zbInfo.deviceName || ''}`}}</view>
<view class="msg">
<view>{{communicationStatusOptions[zbInfo.emsCommunicationStatus] || ''}}</view>
<view>数据更新时间：{{zbInfo.dataUpdateTime || ''}}</view>
</view>
</view>
</template>
<uni-group :title=" item.category" mode="card" v-for="(item,index) in zbInfo.loadDataDetailInfo"
:key="index+'zbInfo'">
<uni-row>
<uni-col :span="8">
<view>总/kWh</view>
</uni-col>
<uni-col :span="16">
<view>{{item.totalKwh}}</view>
</uni-col>
</uni-row>
<uni-row>
<uni-col :span="8">
<view>尖/kWh</view>
</uni-col>
<uni-col :span="16">
<view>{{item.peakKwh}}</view>
</uni-col>
</uni-row>
<uni-row>
<uni-col :span="8">
<view>峰/kWh</view>
</uni-col>
<uni-col :span="16">
<view>{{item.highKwh}}</view>
</uni-col>
</uni-row>
<uni-row>
<uni-col :span="8">
<view>平/kWh</view>
</uni-col>
<uni-col :span="16">
<view>{{item.flatKwh}}</view>
</uni-col>
</uni-row>
<uni-row>
<uni-col :span="8">
<view>谷/kWh</view>
</uni-col>
<uni-col :span="16">
<view>{{item.valleyKwh}}</view>
</uni-col>
</uni-row>
</uni-group>
</uni-collapse-item>
<!-- 储能表 -->
<uni-collapse-item open :class="cnbInfo.emsCommunicationStatus !== '0' ? 'danger' :'running'">
<template v-slot:title>
<view class="title-row">
<view class="title">{{`2#${cnbInfo.deviceName || ''}`}}</view>
<view class="msg">
<view>{{communicationStatusOptions[cnbInfo.emsCommunicationStatus] || ''}}</view>
<view>数据更新时间：{{cnbInfo.dataUpdateTime || ''}}</view>
</view>
</view>
</template>
<uni-group :title="item.category" mode="card" v-for="(item,index) in cnbInfo.meteDataDetailInfo"
:key="index+'cnbInfo'">
<uni-row>
<uni-col :span="8">
<view>有功功率</view>
</uni-col>
<uni-col :span="16">
<view>{{item.activePower}}</view>
</uni-col>
</uni-row>
<uni-row>
<uni-col :span="8">
<view>无功功率</view>
</uni-col>
<uni-col :span="16">
<view>{{item.reactivePower}}</view>
</uni-col>
</uni-row>
</uni-group>
</uni-collapse-item>
</uni-collapse>
</view>
</template>
<script>
import {
getAmmeterDataList
} from '@/api/ems/site.js'
import {
mapState
} from 'vuex'
export default {
computed: {
...mapState({
communicationStatusOptions: (state) =>
state.ems.communicationStatusOptions,
})
},
data() {
return {
siteId: '',
zbInfo: {},
cnbInfo: {},
}
},
mounted() {
uni.showLoading()
this.siteId = this.$route.query.siteId || ''
getAmmeterDataList({
siteId: this.siteId
}).then(response => {
this.zbInfo = JSON.parse(JSON.stringify(response?.data?.ammeterLoadData || {}));
this.cnbInfo = JSON.parse(JSON.stringify(response?.data?.ammeterMeteData || {}));
this.$nextTick(() => {
setTimeout(() => {
this.$refs.collapse.resize()
uni.hideLoading()
}, 100)
})
}).catch(() => {
uni.hideLoading()
})
}
}
</script>
<style lang="scss" scoped>
.title-row {
padding: 0 15px;
position: relative;
height: 50px;
.title {
font-weight: 500;
line-height: 50px;
}
.msg {
position: absolute;
right: 15px;
top: 50%;
transform: translateY(-50%);
text-align: right;
}
}
::v-deep {
.uni-group__title {
background-color: #959595;
.uni-group__title-text {
color: #fff;
}
}
.uni-collapse-item__wrap-content {
.uni-group--card:last-child {
margin-bottom: 25px;
}
}
// row-行样式
.uni-group__content {
padding: 10px 15px;
.uni-row {
padding: 5px 0;
}
}
// 折叠面板内容区域背景颜色
.uni-collapse-item__wrap {
background-color: #eee;
}
// 运行状态颜色区分
.running {
.uni-collapse-item__title-text {
color: #05AEA3;
}
.title-row {
color: #05AEA3;
}
}
.danger {
.uni-collapse-item__title-text {
color: #FC6B69;
}
.title-row {
color: #FC6B69;
}
}
}
</style>