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

develop #2

Merged
dashixiong merged 2 commits from develop into main 2026-04-01 06:29:32 +00:00
Conversation 0 Commits 2 Files Changed 19 +1937 -942
19 changed files with 1937 additions and 942 deletions
Download Patch File Download Diff File Expand all files Collapse all files

161
api/ems/site.js
View File

@ -24,14 +24,22 @@ export function getBMSBatteryCluster(data) {
}) })
} }
//获取电表数据 //获取电表数据
export function getAmmeterDataList(data) { export function getAmmeterDataList(data) {
return request({ return request({
url: `/ems/siteMonitor/getAmmeterDataList`, //?siteId=${siteId} url: `/ems/siteMonitor/getAmmeterDataList`, //?siteId=${siteId}
method: 'get', method: 'get',
data data
}) })
} }
//获取所有设备
export function getDeviceList(siteId) {
return request({
url: `/ems/siteConfig/getDeviceList?siteId=${siteId}`,
method: 'get'
})
}
//获取pcs头部的设备信息 //获取pcs头部的设备信息
export function getRunningHeadInfo(data) { export function getRunningHeadInfo(data) {
@ -41,47 +49,51 @@ export function getRunningHeadInfo(data) {
data data
}) })
} }
//获取pcs列表 //获取pcs列表
export function getPcsDetailInfo(data) { export function getPcsDetailInfo(data) {
return request({ return request({
url: `/ems/siteMonitor/getPcsDetailInfo`, //?siteId=${siteId} url: `/ems/siteMonitor/getPcsDetailInfo`, //?siteId=${siteId}
method: 'get', method: 'get',
data data
}) })
} }
//获取pcs名称列表
export function getPcsNameList(siteId) {
return request({
url: `/ems/siteMonitor/getPcsNameList?siteId=${siteId}`,
method: 'get'
})
}
//获取单体电池 电池堆列表数据 //获取单体电池 电池堆列表数据
export function getStackNameList(data) { export function getStackNameList(siteId) {
return request({ return request({
url: `/ems/siteMonitor/getStackNameList`, //?siteId=${siteId} url: `/ems/siteMonitor/getStackNameList?siteId=${siteId}`,
method: 'get', method: 'get'
data })
}) }
} //获取单体电池 电池簇列表数据
//获取单体电池 电池簇列表数据 export function getClusterNameList({ stackDeviceId, siteId }) {
export function getClusterNameList(data) { return request({
return request({ url: `/ems/siteMonitor/getClusterNameList?stackDeviceId=${stackDeviceId}&siteId=${siteId}`,
url: `/ems/siteMonitor/getClusterNameList`, //?stackDeviceId=${stackDeviceId}&siteId=${siteId} method: 'get'
method: 'get', })
data }
}) //单体电池表格数据
} export function getClusterDataInfoList({ siteId, stackDeviceId, clusterDeviceId, batteryId, pageSize, pageNum }) {
//单体电池表格数据 return request({
export function getClusterDataInfoList(data) { url: `/ems/siteMonitor/getClusterDataInfoList?clusterDeviceId=${clusterDeviceId}&siteId=${siteId}&stackDeviceId=${stackDeviceId}&batteryId=${batteryId}&pageSize=${pageSize}&pageNum=${pageNum}`,
return request({ method: 'get'
url: `/ems/siteMonitor/getClusterDataInfoList?`, //clusterDeviceId=${clusterDeviceId}&siteId=${siteId}&stackDeviceId=${stackDeviceId}&pageSize=${pageSize}&pageNum=${pageNum} })
method: 'get', }
data // 单体电池图表
}) export function getSingleBatteryData({ siteId, deviceId, clusterDeviceId, startDate, endDate }) {
} return request({
// 单体电池图表 url: `/ems/siteMonitor/getSingleBatteryData?siteId=${siteId}&deviceId=${deviceId}&startDate=${startDate}&endDate=${endDate}&clusterDeviceId=${clusterDeviceId}`,
export function getSingleBatteryData(data) { method: 'get'
return request({ })
url: `/ems/siteMonitor/getSingleBatteryData`, //?siteId=${siteId}&deviceId=${deviceId}&startDate=${startDate}&endDate=${endDate}&clusterDeviceId=${clusterDeviceId}`, }
method: 'get',
data
})
}
//获取单个站点的基本信息 //获取单个站点的基本信息
export function getSingleSiteBaseInfo(data) { export function getSingleSiteBaseInfo(data) {
@ -92,12 +104,19 @@ export function getSingleSiteBaseInfo(data) {
}) })
} }
//单站监控 首页 总累计运行数据 //单站监控 首页 总累计运行数据（基于日表）
export function getDzjkHomeView(data) { export function getDzjkHomeTotalView(siteId) {
return request({ return request({
url: `/ems/siteMonitor/homeView`, //?siteId=${siteId} url: `/ems/siteMonitor/homeTotalView?siteId=${siteId}`,
method: 'get', method: 'get'
data })
}
// 单站监控项目展示数据（字段配置 + 最新值）
export function getProjectDisplayData(siteId) {
return request({
url: `/ems/siteMonitor/getProjectDisplayData?siteId=${siteId}`,
method: 'get'
}) })
} }
@ -119,18 +138,30 @@ export function getSevenChargeData(data) {
}) })
} }
//单站监控 首页 当日功率曲线 //单站监控 首页 当日功率曲线
export function getPointData(data) { export function getPointData(data) {
return request({ return request({
url: `/ems/siteMonitor/getPointData`, url: `/ems/siteMonitor/getPointData`,
method: 'get', method: 'get',
data data
}) })
} }
// 获取站点包含的设备种类 用来判断单站监控设备监控的菜单栏展示 // 点位配置-曲线数据（与管理端一致）
export function getSiteAllDeviceCategory(data) { export function getPointConfigCurve(data) {
return request({ return request({
url: `/ems/pointConfig/curve`,
method: 'post',
data,
headers: {
repeatSubmit: false
}
})
}
// 获取站点包含的设备种类 用来判断单站监控设备监控的菜单栏展示
export function getSiteAllDeviceCategory(data) {
return request({
url: `/ems/siteConfig/getSiteAllDeviceCategory`, url: `/ems/siteConfig/getSiteAllDeviceCategory`,
method: 'get', method: 'get',
data data

69
components/SiteSelector/index.vue Normal file
View File

@ -0,0 +1,69 @@
<template>
<view class="ems-site-selector">
<uni-data-picker placeholder="请选择" popup-title="业态选择" :step-searh="true" :value="siteId" :clear-icon="false"
:localdata="siteTypeOptions" :ellipsis="false" @change="handleChange">
</uni-data-picker>
</view>
</template>
<script>
import { mapGetters } from 'vuex'
export default {
computed: {
...mapGetters(['siteId', 'siteTypeOptions'])
},
methods: {
handleChange(data) {
const valueList = data?.detail?.value || []
const siteObj = valueList[1]
if (!siteObj || siteObj.value === undefined || siteObj.value === null || siteObj.value === this.siteId) return
this.$store.dispatch('SetCurrentSiteId', siteObj.value)
this.$emit('change', siteObj.value)
}
},
created() {
this.$store.dispatch('LoadSites')
}
}
</script>
<style lang="scss" scoped>
.ems-site-selector {
.uni-data-tree {
::v-deep {
.input-value {
border: none;
padding-left: 0;
.selected-area {
width: 90%;
flex: none;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
.selected-list {
color: #fff;
}
}
.text-color {
color: #fff;
font-size: 34rpx;
line-height: 36rpx;
font-weight: bolder;
}
.arrow-area {
transform: rotate(-135deg);
.input-arrow {
border-color: #fff;
}
}
}
}
}
}
</style>

128
components/SiteSwitchHeader/index.vue Normal file
View File

@ -0,0 +1,128 @@
<template>
<view class="site-switch-header">
<uni-data-picker
placeholder="请选择"
popup-title="业态选择"
:step-searh="true"
:value="siteId"
:clear-icon="false"
:localdata="siteTypeOptions"
:ellipsis="false"
@change="handleChange"
/>
<view class="info">
<view class="list">
<uni-icons type="location" color="#fff" size="20"></uni-icons>
{{ siteAddress || '-' }}
</view>
<view class="list">
<uni-icons type="calendar" color="#fff" size="20"></uni-icons>
{{ runningTime || '-' }}
</view>
</view>
</view>
</template>
<script>
export default {
props: {
siteId: {
type: [String, Number],
default: ''
},
siteTypeOptions: {
type: Array,
default: () => []
},
siteAddress: {
type: String,
default: '-'
},
runningTime: {
type: String,
default: '-'
}
},
methods: {
handleChange(data) {
this.$emit('change', data)
}
}
}
</script>
<style lang="scss" scoped>
.site-switch-header {
background: linear-gradient(to right, #547ef4, #679ff5);
padding: 30rpx 30rpx;
padding-bottom: 100rpx;
color: #fff;
.info {
color: #fff;
font-size: 26rpx;
line-height: 30rpx;
vertical-align: middle;
margin-top: 20rpx;
>.list {
display: flex;
justify-content: flex-start;
align-items: center;
&:not(:last-child) {
margin-bottom: 20rpx;
}
>.uni-icons {
margin-right: 10rpx;
}
}
}
.uni-data-tree {
::v-deep {
.uni-data-tree-dialog {
color: #333;
.selected-item,
.dialog-title {
color: #333;
}
}
.input-value {
border: none;
padding-left: 0;
.selected-area {
width: 90%;
flex: none;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
.selected-list {
color: #fff;
}
}
.text-color {
color: #fff;
font-size: 34rpx;
line-height: 36rpx;
font-weight: bolder;
}
.arrow-area {
transform: rotate(-135deg);
.input-arrow {
border-color: #fff;
}
}
}
}
}
}
</style>

7
config.js
View File

@ -1,10 +1,11 @@
// 应用全局配置 // 应用全局配置
module.exports = { module.exports = {
// todo 打包项目时切换baseUrl // todo 打包项目时切换baseUrl
// baseUrl: 'http://localhost:8089',
// 测试环境 // 测试环境
// baseUrl: 'http://110.40.171.179:8089', baseUrl: 'http://110.40.171.179:8089',
// 生产环境 // 生产环境
baseUrl: 'http://1.15.120.242:8089', // baseUrl: 'http://1.15.120.242:8089',
// 应用信息 // 应用信息
appInfo: { appInfo: {
// 应用名称 // 应用名称

28
pages.json
View File

@ -102,17 +102,23 @@
"navigationBarTitleText": "电表" "navigationBarTitleText": "电表"
} }
}, },
{ {
"path": "pages/work/pcs/index", "path": "pages/work/pcs/index",
"style": { "style": {
"navigationBarTitleText": "PCS" "navigationBarTitleText": "PCS"
} }
}, },
{ {
"path": "pages/work/dtdc/index", "path": "pages/work/yl/index",
"style": { "style": {
"navigationBarTitleText": "单体电池", "navigationBarTitleText": "冷却"
"onReachBottomDistance": 100 }
},
{
"path": "pages/work/dtdc/index",
"style": {
"navigationBarTitleText": "单体电池",
"onReachBottomDistance": 100
} }
} }

209
pages/index.vue
View File

@ -1,16 +1,7 @@
<template> <template>
<view class="home-container"> <view class="home-container">
<view class="site-sections-list"> <site-switch-header :site-id="siteId" :site-type-options="siteTypeOptions" :site-address="baseInfo.siteAddress"
<view class="site-title">站点选择</view> :running-time="baseInfo.runningTime" @change="selectedSite" />
<radio-group class="site-radio" @change="onSiteChange">
<label v-for="item in siteOptions" :key="item.value" class="radio-item"
:class="{ active: item.value === siteId, disabled: item.disable }">
<radio class="radio" :value="item.value" :disabled="item.disable"
:checked="item.value === siteId" color="#547ef4" />
<text class="radio-text">{{ item.text }}</text>
</label>
</radio-group>
</view>
<view class="base-info"> <view class="base-info">
<view class="map-card"> <view class="map-card">
@ -22,16 +13,16 @@
<view class="title">总累计运行数据</view> <view class="title">总累计运行数据</view>
<view class="total-revenue"> <view class="total-revenue">
<text class="label">总收入</text> <text class="label">总收入</text>
<text class="value">{{ format2(runningInfo.totalRevenue) }}</text> <text class="value">{{ format2(totalRevenueDisplayValue) }}</text>
<text class="unit">元</text> <text class="unit">元</text>
</view> </view>
</view> </view>
<uni-grid :column="2" :showBorder="false" :square="false" :highlight="false"> <uni-grid :column="2" :showBorder="false" :square="false" :highlight="false">
<uni-grid-item v-for="(item, index) in sjglData" :key="index + 'sjglData'"> <uni-grid-item v-for="(item, index) in runningDataCards" :key="index + 'sjglData'">
<view class="grid-item-box"> <view class="grid-item-box">
<view class="title">{{ item.title }}</view> <view class="title">{{ item.title }}</view>
<view class="text" :style="{ color: item.color }"> <view class="text" :style="{ color: item.color }">
{{ format2(runningInfo[item.attr]) }} {{ format2(item.value) }}
</view> </view>
</view> </view>
</uni-grid-item> </uni-grid-item>
@ -58,18 +49,43 @@
} from '@/utils/filters' } from '@/utils/filters'
import { import {
getAllSites, getAllSites,
getDzjkHomeView, getSingleSiteBaseInfo,
getDzjkHomeTotalView,
getProjectDisplayData,
getAmmeterRevenueData getAmmeterRevenueData
} from '@/api/ems/site.js' } from '@/api/ems/site.js'
import SiteSwitchHeader from '@/components/SiteSwitchHeader/index.vue'
const createSiteTypeOptions = () => ([{
text: '储能',
value: 'cn',
children: []
},
{
text: '光能',
value: 'gn',
children: []
},
{
text: '岸电',
value: 'ad',
children: []
}
])
export default { export default {
components: {
SiteSwitchHeader
},
data() { data() {
return { return {
pageScrollTop: 0, pageScrollTop: 0,
siteOptions: [], siteOptions: [],
siteTypeOptions: createSiteTypeOptions(),
siteId: '', siteId: '',
mapUrl: '', mapUrl: '',
baseInfo: {},
runningInfo: {}, runningInfo: {},
runningDisplayData: [],
revenueChartData: {}, revenueChartData: {},
revenueOptions: { revenueOptions: {
padding: [10, 5, 0, 10], padding: [10, 5, 0, 10],
@ -86,7 +102,7 @@
}, },
extra: {} extra: {}
}, },
sjglData: [{ fallbackSjglData: [{
title: "今日充电量（kWh）", title: "今日充电量（kWh）",
attr: "dayChargedCap", attr: "dayChargedCap",
color: '#4472c4' color: '#4472c4'
@ -130,9 +146,49 @@
} }
}, },
computed: { computed: {
...mapGetters(['belongSite']) ...mapGetters(['belongSite', 'currentSiteId']),
totalRunningSectionData() {
return (this.runningDisplayData || []).filter(item => item.sectionName === '总累计运行数据')
},
totalRevenueDisplayItem() {
const sectionData = this.totalRunningSectionData || []
const byFieldCode = sectionData.find(item => item.fieldCode === 'totalRevenue')
if (byFieldCode) {
return byFieldCode
}
return sectionData.find(item => item.fieldName === '总收入')
},
totalRevenueDisplayValue() {
return this.totalRevenueDisplayItem ? this.totalRevenueDisplayItem.fieldValue : this.runningInfo.totalRevenue
},
runningDataCards() {
const sectionData = this.totalRunningSectionData || []
if (sectionData.length > 0) {
const revenueFieldCode = this.totalRevenueDisplayItem ? this.totalRevenueDisplayItem.fieldCode : ''
return sectionData
.filter(item => item.fieldCode !== revenueFieldCode)
.map((item, index) => ({
title: item.fieldName,
value: item.fieldValue,
color: this.getCardColor(index)
}))
}
return this.fallbackSjglData.map(item => ({
title: item.title,
value: this.runningInfo[item.attr],
color: item.color
}))
}
}, },
methods: { methods: {
isAvailableSite(siteId) {
const site = this.siteOptions.find(item => item.value === siteId)
return !!(site && !site.disable)
},
getCardColor(index) {
const colors = ['#4472c4', '#70ad47', '#4472c4', '#f67438', '#4472c4', '#70ad47', '#70ad47', '#f67438']
return colors[index % colors.length]
},
format2(value) { format2(value) {
const num = Number(value || 0) const num = Number(value || 0)
return Number.isFinite(num) ? num.toFixed(2) : '0.00' return Number.isFinite(num) ? num.toFixed(2) : '0.00'
@ -152,38 +208,67 @@
} }
return list return list
}, },
onSiteChange(e) { selectedSite(data) {
const value = e.detail.value const siteObj = (data.detail.value || [])[1]
const value = siteObj?.value
if (!value) return
if (value === this.siteId) return if (value === this.siteId) return
this.siteId = value this.siteId = value
this.$store.commit('SET_CURRENTSITEID', value)
this.updateSiteInfo() this.updateSiteInfo()
}, },
updateSiteInfo() { updateSiteInfo() {
if (!this.siteId) { if (!this.siteId) {
this.baseInfo = {}
this.runningInfo = {} this.runningInfo = {}
this.runningDisplayData = []
this.revenueChartData = {} this.revenueChartData = {}
this.mapUrl = '' this.mapUrl = ''
return return
} }
this.updateMapCenter() this.updateMapCenter()
this.getSiteBaseInfo()
this.getRunningInfo() this.getRunningInfo()
this.getRevenueChartData() this.getRevenueChartData()
}, },
getSiteBaseInfo() {
return getSingleSiteBaseInfo({
siteId: this.siteId
}).then(response => {
this.baseInfo = response?.data || {}
})
},
getSiteList() { getSiteList() {
getAllSites().then(response => { getAllSites().then(response => {
const data = response?.data || [] const data = response?.data || []
this.siteOptions = data.map(item => { const canAccessAll = !this.belongSite || this.belongSite.length === 0 || this.belongSite.includes('all')
return { const siteTypeOptions = createSiteTypeOptions().map(item => ({
...item,
children: []
}))
data.forEach(item => {
if (!canAccessAll && !this.belongSite.includes(item.siteId)) return
const siteType = (item.siteType || item.type || 'cn').toString().toLowerCase()
const typeOption = siteTypeOptions.find(i => i.value === siteType) || siteTypeOptions.find(i => i.value === 'cn')
if (!typeOption) return
typeOption.children.push({
text: item.siteName, text: item.siteName,
value: item.siteId, value: item.siteId,
id: item.id,
longitude: Number(item.longitude || 0), longitude: Number(item.longitude || 0),
latitude: Number(item.latitude || 0), latitude: Number(item.latitude || 0)
disable: !this.belongSite || this.belongSite.length === 0 || this.belongSite.includes('all') ? false : !this })
.belongSite.includes(item.siteId)
}
}) })
this.siteId = this.siteOptions.find(item => !item.disable)?.value || '' this.siteTypeOptions = siteTypeOptions.filter(item => (item.children || []).length > 0)
this.siteId && this.updateSiteInfo() this.siteOptions = this.siteTypeOptions.reduce((result, typeItem) => {
return result.concat(typeItem.children || [])
}, [])
const defaultSiteId = this.isAvailableSite(this.currentSiteId) ? this.currentSiteId : (this.siteOptions[0]?.value || '')
if (defaultSiteId) {
this.siteId = defaultSiteId
this.$store.commit('SET_CURRENTSITEID', defaultSiteId)
this.updateSiteInfo()
}
}) })
}, },
updateMapCenter() { updateMapCenter() {
@ -202,10 +287,12 @@
this.mapUrl = `https://api.tianditu.gov.cn/staticimage?center=${lon},${lat}&width=${width}&height=${height}&zoom=${zoom}&layers=${layers}&markers=${lon},${lat}&tk=${tk}` this.mapUrl = `https://api.tianditu.gov.cn/staticimage?center=${lon},${lat}&width=${width}&height=${height}&zoom=${zoom}&layers=${layers}&markers=${lon},${lat}&tk=${tk}`
}, },
getRunningInfo() { getRunningInfo() {
getDzjkHomeView({ return Promise.all([
siteId: this.siteId getDzjkHomeTotalView(this.siteId),
}).then(response => { getProjectDisplayData(this.siteId)
this.runningInfo = response?.data || {} ]).then(([homeResponse, displayResponse]) => {
this.runningInfo = homeResponse?.data || {}
this.runningDisplayData = displayResponse?.data || []
}) })
}, },
getRevenueChartData() { getRevenueChartData() {
@ -284,6 +371,14 @@
}) })
} }
}, },
watch: {
currentSiteId(newSiteId) {
if (!newSiteId || newSiteId === this.siteId) return
if (!this.isAvailableSite(newSiteId)) return
this.siteId = newSiteId
this.updateSiteInfo()
}
},
onLoad() { onLoad() {
this.$nextTick(() => { this.$nextTick(() => {
this.getSiteList() this.getSiteList()
@ -319,58 +414,6 @@
padding-top: 0; padding-top: 0;
} }
.site-sections-list {
background: linear-gradient(to right, #547ef4, #679ff5);
padding: 30rpx 30rpx;
padding-bottom: 100rpx;
color: #fff;
.site-title {
font-size: 28rpx;
font-weight: 600;
margin-bottom: 16rpx;
}
.site-radio {
display: flex;
flex-wrap: wrap;
gap: 16rpx;
}
.radio-item {
display: flex;
align-items: center;
padding: 12rpx 20rpx;
border-radius: 28rpx;
background: rgba(0, 0, 0, 0.18);
color: rgba(255, 255, 255, 0.75);
box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);
transition: all 0.2s ease;
&.active {
background: #ffffff;
color: #233157;
box-shadow: 0 12rpx 22rpx rgba(0, 0, 0, 0.18);
}
&.disabled {
opacity: 0.45;
}
.radio {
display: none;
}
.radio-text {
font-size: 24rpx;
font-weight: 600;
letter-spacing: 0.5rpx;
}
}
}
.base-info { .base-info {
margin-top: -80rpx; margin-top: -80rpx;
border-radius: 80rpx 80rpx 0 0; border-radius: 80rpx 80rpx 0 0;

12
pages/mine/avatar/index.vue
View File

@ -123,6 +123,9 @@
}, },
loadImage: function () { loadImage: function () {
var _this = this var _this = this
uni.showLoading({
title: '图片加载中...',
})
uni.getImageInfo({ uni.getImageInfo({
src: _this.imageSrc, src: _this.imageSrc,
@ -188,7 +191,14 @@
isShowImg: true isShowImg: true
}) })
uni.hideLoading() uni.hideLoading()
} },
fail() {
uni.hideLoading()
uni.showToast({
title: '图片加载失败',
icon: 'none'
})
},
}) })
}, },
// 拖动时候触发的touchStart事件 // 拖动时候触发的touchStart事件

265
pages/work/bmsdcc/index.vue
View File

@ -41,9 +41,9 @@
</view> </view>
</uni-group> </uni-group>
<!-- 设备数据 --> <!-- 设备数据 -->
<uni-group mode="card" class="data-card-group"> <uni-group mode="card" class="data-card-group">
<uni-row v-for="(infoDataItem,infoDataIndex) in infoData" :key="infoDataIndex+'infoData'" <uni-row v-for="(infoDataItem,infoDataIndex) in infoData" :key="infoDataIndex+'infoData'"
class="data-row"> class="data-row">
<uni-col :span="8"> <uni-col :span="8">
<view class="title">{{infoDataItem.label}}</view> <view class="title">{{infoDataItem.label}}</view>
</uni-col> </uni-col>
@ -51,37 +51,12 @@
<view class="value">{{item[infoDataItem.attr] | formatNumber}} <view class="value">{{item[infoDataItem.attr] | formatNumber}}
<text v-if="infoDataItem.unit" v-html="infoDataItem.unit"></text> <text v-if="infoDataItem.unit" v-html="infoDataItem.unit"></text>
</view> </view>
</uni-col> </uni-col>
</uni-row> </uni-row>
</uni-group> </uni-group>
<!-- 子设备表格 --> </view>
<uni-group mode="card" class="child-card-group" style="margin-bottom:20rpx;"> </uni-collapse-item>
<uni-table border stripe emptyText="暂无数据" class="child-table"> </uni-collapse>
<!-- 表头行 -->
<uni-tr>
<uni-th align="center">名称</uni-th>
<uni-th align="center">单体平均值</uni-th>
<uni-th align="center">单体最小值</uni-th>
<uni-th align="center">单体最小值ID</uni-th>
<uni-th align="center">单体最大值</uni-th>
<uni-th align="center">单体最大值ID</uni-th>
</uni-tr>
<!-- 表格数据行 -->
<uni-tr v-for="(tableItem, tableIndex) in item.batteryDataList"
:key="tableIndex+'batteryDataList'">
<uni-td align="center"
v-html="`${tableItem.dataName}（${unitObj[tableItem.dataName]}）`"></uni-td>
<uni-td align="center">{{tableItem.avgData}}</uni-td>
<uni-td align="center">{{tableItem.minData}}</uni-td>
<uni-td align="center">{{tableItem.minDataID}}</uni-td>
<uni-td align="center">{{tableItem.maxData}}</uni-td>
<uni-td align="center">{{tableItem.maxDataID}}</uni-td>
</uni-tr>
</uni-table>
</uni-group>
</view>
</uni-collapse-item>
</uni-collapse>
<view class="no-data" v-else> <view class="no-data" v-else>
暂无数据 暂无数据
</view> </view>
@ -89,14 +64,16 @@
</template> </template>
<script> <script>
import { import {
getBMSBatteryCluster getProjectDisplayData,
} from '@/api/ems/site.js' getStackNameList,
import { getClusterNameList
mapState } from '@/api/ems/site.js'
} from 'vuex' import {
export default { mapState
} from 'vuex'
export default {
computed: { computed: {
...mapState({ ...mapState({
CLUSTERWorkStatusOptions: (state) => CLUSTERWorkStatusOptions: (state) =>
@ -105,16 +82,13 @@
state.ems.communicationStatusOptions, state.ems.communicationStatusOptions,
}) })
}, },
data() { data() {
return { return {
unitObj: { displayData: [],
'电压': 'V', clusterDeviceList: [],
'温度': '&#8451;', list: [],
'SOC': '%' siteId: '',
}, infoData: [{
list: [],
siteId: '',
infoData: [{
label: '簇电压', label: '簇电压',
attr: 'clusterVoltage', attr: 'clusterVoltage',
unit: 'V', unit: 'V',
@ -178,36 +152,157 @@
} }
}, },
methods: { methods: {
handleCardClass(item) { handleCardClass(item) {
const { const {
workStatus = '' workStatus = ''
} = item } = item
return !(Object.keys(this.CLUSTERWorkStatusOptions).includes(item.workStatus)) ? "timing-collapse-item" : return !(Object.keys(this.CLUSTERWorkStatusOptions).includes(item.workStatus)) ? "timing-collapse-item" :
workStatus === '9' ? 'warning-collapse-item' : 'running-collapse-item' workStatus === '9' ? 'warning-collapse-item' : 'running-collapse-item'
}, },
}, getModuleRows(menuCode, sectionName) {
onLoad(options) { return (this.displayData || []).filter(item => item.menuCode === menuCode && item.sectionName === sectionName)
uni.showLoading() },
this.siteId = options.siteId || '' getFieldName(fieldCode) {
getBMSBatteryCluster({ const raw = String(fieldCode || '').trim()
siteId: this.siteId if (!raw) return ''
}).then(response => { const index = raw.lastIndexOf('__')
this.list = response?.data || [] return index >= 0 ? raw.slice(index + 2) : raw
if (this.list.length > 0) { },
this.$nextTick(() => { getFieldRowMap(rows = [], deviceId = '') {
setTimeout(() => { const map = {}
// this.$refs.collapse.resize() const targetDeviceId = String(deviceId || '')
uni.hideLoading() rows.forEach(item => {
}, 100) if (!item || !item.fieldCode) return
}) const itemDeviceId = String(item.deviceId || '')
} else { if (itemDeviceId !== targetDeviceId) return
uni.hideLoading() const fieldName = this.getFieldName(item.fieldCode)
} map[fieldName] = item
const displayName = String(item.fieldName || '').trim()
}).catch(() => { if (displayName && !map[displayName]) {
uni.hideLoading() map[displayName] = item
}) }
} })
} rows.forEach(item => {
</script> if (!item || !item.fieldCode) return
const itemDeviceId = String(item.deviceId || '')
if (itemDeviceId !== '') return
const fieldName = this.getFieldName(item.fieldCode)
if (map[fieldName] === undefined || map[fieldName] === null || map[fieldName] === '') {
map[fieldName] = item
}
const displayName = String(item.fieldName || '').trim()
if (displayName && !map[displayName]) {
map[displayName] = item
}
})
return map
},
getFieldMap(rows = [], deviceId = '') {
const rowMap = this.getFieldRowMap(rows, deviceId)
return Object.keys(rowMap).reduce((acc, fieldName) => {
const row = rowMap[fieldName]
if (acc[fieldName] === undefined) {
acc[fieldName] = row?.fieldValue
}
return acc
}, {})
},
getLatestTime(menuCode) {
const times = (this.displayData || [])
.filter(item => item.menuCode === menuCode && item.valueTime)
.map(item => new Date(item.valueTime).getTime())
.filter(ts => !isNaN(ts))
if (times.length === 0) {
return '-'
}
const date = new Date(Math.max(...times))
const p = (n) => String(n).padStart(2, '0')
return `${date.getFullYear()}-${p(date.getMonth() + 1)}-${p(date.getDate())} ${p(date.getHours())}:${p(date.getMinutes())}:${p(date.getSeconds())}`
},
getClusterDeviceList() {
return getStackNameList(this.siteId)
.then(response => {
const stackList = response?.data || []
if (!stackList.length) {
this.clusterDeviceList = []
return
}
const requests = stackList.map(stack => {
const stackDeviceId = stack.deviceId || stack.id || ''
return getClusterNameList({
stackDeviceId,
siteId: this.siteId
})
.then(clusterResponse => {
const clusterList = clusterResponse?.data || []
return clusterList.map(cluster => ({
...cluster,
parentDeviceName: stack.deviceName || stack.name || stackDeviceId || '',
}))
})
.catch(() => [])
})
return Promise.all(requests).then(results => {
this.clusterDeviceList = results.flat()
})
})
.catch(() => {
this.clusterDeviceList = []
})
},
buildList() {
const devices = (this.clusterDeviceList && this.clusterDeviceList.length > 0) ? this.clusterDeviceList : [{
deviceId: this.siteId,
deviceName: 'BMS电池簇',
parentDeviceName: ''
}]
this.list = devices.map(device => {
const deviceId = device.deviceId || device.id || this.siteId
const infoMap = this.getFieldMap(this.getModuleRows('SBJK_BMSDCC', '簇信息'), deviceId)
const statusMap = this.getFieldMap(this.getModuleRows('SBJK_BMSDCC', '状态'), deviceId)
return {
...infoMap,
workStatus: statusMap.workStatus,
pcsCommunicationStatus: statusMap.pcsCommunicationStatus,
emsCommunicationStatus: statusMap.emsCommunicationStatus,
currentSoc: infoMap.currentSoc,
siteId: this.siteId,
deviceId,
parentDeviceName: device.parentDeviceName || '',
deviceName: device.deviceName || device.name || device.deviceId || device.id || 'BMS电池簇',
dataUpdateTime: this.getLatestTime('SBJK_BMSDCC'),
alarmNum: 0,
}
})
},
updateData() {
return Promise.all([
getProjectDisplayData(this.siteId),
this.getClusterDeviceList()
]).then(([displayResponse]) => {
this.displayData = displayResponse?.data || []
this.buildList()
}).catch(() => {
this.displayData = []
this.list = []
})
},
},
onLoad(options) {
uni.showLoading()
this.siteId = options.siteId || ''
this.updateData().finally(() => {
if (this.list.length > 0) {
this.$nextTick(() => {
setTimeout(() => {
uni.hideLoading()
}, 100)
})
return
}
uni.hideLoading()
})
}
}
</script>

212
pages/work/bmszl/index.vue
View File

@ -53,45 +53,9 @@
</uni-col> </uni-col>
</uni-row> </uni-row>
</uni-group> </uni-group>
<!-- 子设备表格 --> </view>
<uni-group mode="card" class="child-card-group" style="margin-bottom:20rpx;"> </uni-collapse-item>
<uni-table border stripe emptyText="暂无数据" class="child-table"> </uni-collapse>
<!-- 表头行 -->
<uni-tr>
<uni-th align="center">簇号</uni-th>
<uni-th align="center">簇电压</uni-th>
<uni-th align="center">簇电流</uni-th>
<uni-th align="center">簇SOC</uni-th>
<uni-th align="center">单体最高电压</uni-th>
<uni-th align="center">电池号码</uni-th>
<uni-th align="center">单体最低电压</uni-th>
<uni-th align="center">电池号码</uni-th>
<uni-th align="center">单体最高温度</uni-th>
<uni-th align="center">电池号码</uni-th>
<uni-th align="center">单体最低温度</uni-th>
<uni-th align="center">电池号码</uni-th>
</uni-tr>
<!-- 表格数据行 -->
<uni-tr v-for="(tableItem, tableIndex) in item.batteryDataList"
:key="tableIndex+'batteryDataList'">
<uni-td align="center">{{tableItem.clusterId}}</uni-td>
<uni-td align="center">{{tableItem.clusterVoltage}}V</uni-td>
<uni-td align="center">{{tableItem.clusterCurrent}}A</uni-td>
<uni-td align="center">{{tableItem.currentSoc}}%</uni-td>
<uni-td align="center">{{tableItem.maxCellVoltage}}V</uni-td>
<uni-td align="center">{{tableItem.maxCellVoltageId}}</uni-td>
<uni-td align="center">{{tableItem.minCellVoltage}}V</uni-td>
<uni-td align="center">{{tableItem.maxCellVoltageId}}</uni-td>
<uni-td align="center">{{tableItem.maxCellTemp}}&#8451;</uni-td>
<uni-td align="center">{{tableItem.maxCellTempId}}</uni-td>
<uni-td align="center">{{tableItem.minCellTemp}}&#8451;</uni-td>
<uni-td align="center">{{tableItem.minCellTempId}}</uni-td>
</uni-tr>
</uni-table>
</uni-group>
</view>
</uni-collapse-item>
</uni-collapse>
<view class="no-data" v-else> <view class="no-data" v-else>
暂无数据 暂无数据
</view> </view>
@ -99,14 +63,15 @@
</template> </template>
<script> <script>
import { import {
getBMSOverView getProjectDisplayData,
} from '@/api/ems/site.js' getStackNameList
import { } from '@/api/ems/site.js'
mapState import {
} from 'vuex' mapState
export default { } from 'vuex'
export default {
computed: { computed: {
...mapState({ ...mapState({
STACKWorkStatusOptions: (state) => STACKWorkStatusOptions: (state) =>
@ -115,11 +80,13 @@
state.ems.communicationStatusOptions, state.ems.communicationStatusOptions,
}) })
}, },
data() { data() {
return { return {
list: [], displayData: [],
siteId: '', stackDeviceList: [],
infoData: [{ list: [],
siteId: '',
infoData: [{
label: '电池堆总电压', label: '电池堆总电压',
attr: 'stackVoltage', attr: 'stackVoltage',
unit: 'V', unit: 'V',
@ -182,37 +149,110 @@
] ]
} }
}, },
methods: { methods: {
handleCardClass(item) { getModuleRows(menuCode, sectionName) {
const { return (this.displayData || []).filter(item => item.menuCode === menuCode && item.sectionName === sectionName)
workStatus = '' },
} = item getFieldName(fieldCode) {
return !Object.keys(this.STACKWorkStatusOptions).find(i => i === workStatus) ? "timing-collapse-item" : const raw = String(fieldCode || '').trim()
workStatus === '9' ? 'warning-collapse-item' : 'running-collapse-item' if (!raw) return ''
}, const index = raw.lastIndexOf('__')
}, return index >= 0 ? raw.slice(index + 2) : raw
onLoad(options) { },
uni.showLoading() isEmptyValue(value) {
this.siteId = options.siteId || '' return value === undefined || value === null || value === ''
getBMSOverView({ },
siteId: this.siteId getFieldRowMap(rows = [], deviceId = '') {
}).then(response => { const map = {}
this.list = response?.data || [] const targetDeviceId = String(deviceId || '')
if (this.list.length > 0) { rows.forEach(item => {
this.$nextTick(() => { if (!item || !item.fieldCode) return
setTimeout(() => { const itemDeviceId = String(item.deviceId || '')
this.$refs.collapse.resize() if (itemDeviceId !== targetDeviceId) return
uni.hideLoading() map[this.getFieldName(item.fieldCode)] = item
}, 100) })
}) rows.forEach(item => {
} else { if (!item || !item.fieldCode) return
uni.hideLoading() const itemDeviceId = String(item.deviceId || '')
} if (itemDeviceId !== '') return
const fieldName = this.getFieldName(item.fieldCode)
}).catch(() => { const existRow = map[fieldName]
uni.hideLoading() if (!existRow || this.isEmptyValue(existRow.fieldValue)) {
}) map[fieldName] = item
} }
} })
</script> return map
},
getFieldMap(rowMap = {}) {
const map = {}
Object.keys(rowMap || {}).forEach((fieldName) => {
map[fieldName] = rowMap[fieldName]?.fieldValue
})
return map
},
buildBaseInfoList() {
const devices = (this.stackDeviceList && this.stackDeviceList.length > 0) ? this.stackDeviceList : [{
deviceId: this.siteId,
deviceName: 'BMS总览'
}]
this.list = devices.map(device => {
const id = device.deviceId || device.id || this.siteId
const infoRowMap = this.getFieldRowMap(this.getModuleRows('SBJK_BMSZL', '堆信息'), id)
const statusRowMap = this.getFieldRowMap(this.getModuleRows('SBJK_BMSZL', '状态'), id)
const infoMap = this.getFieldMap(infoRowMap)
const statusMap = this.getFieldMap(statusRowMap)
return {
...infoMap,
workStatus: statusMap.workStatus,
pcsCommunicationStatus: statusMap.pcsCommunicationStatus,
emsCommunicationStatus: statusMap.emsCommunicationStatus,
siteId: this.siteId,
deviceId: id,
deviceName: device.deviceName || device.name || device.deviceId || device.id || 'BMS总览',
batteryDataList: []
}
})
},
handleCardClass(item) {
const {
workStatus = ''
} = item
return !Object.keys(this.STACKWorkStatusOptions).find(i => i === workStatus) ? "timing-collapse-item" :
workStatus === '9' ? 'warning-collapse-item' : 'running-collapse-item'
},
updateData() {
return Promise.all([
getProjectDisplayData(this.siteId),
getStackNameList(this.siteId)
]).then(([displayResponse, stackResponse]) => {
this.displayData = displayResponse?.data || []
this.stackDeviceList = stackResponse?.data || []
this.buildBaseInfoList()
}).catch(() => {
this.displayData = []
this.stackDeviceList = []
this.list = []
})
}
},
onLoad(options) {
uni.showLoading()
this.siteId = options.siteId || ''
this.updateData().then(() => {
if (this.list.length === 0) {
uni.hideLoading()
return
}
this.$nextTick(() => {
setTimeout(() => {
this.$refs.collapse && this.$refs.collapse.resize()
uni.hideLoading()
}, 100)
})
}).catch(() => {
uni.hideLoading()
})
}
}
</script>

315
pages/work/db/index.vue
View File

@ -17,12 +17,12 @@
</view> </view>
</template> </template>
<view class='content'> <view class='content'>
<uni-group mode="card" class="data-card-group"> <uni-group mode="card" class="data-card-group">
<uni-row v-for="(tempDataItem,tempDataIndex) in <uni-row v-for="(tempDataItem,tempDataIndex) in
(deviceIdTypeMsg[item.deviceId] || otherTypeMsg)" :key="tempDataIndex+'dbTempData'" class="data-row"> (item.fieldConfigs || otherTypeMsg)" :key="tempDataIndex+'dbTempData'" class="data-row">
<uni-col :span="8"> <uni-col :span="8">
<view class="title">{{tempDataItem.name}}</view> <view class="title">{{tempDataItem.name}}</view>
</uni-col> </uni-col>
<uni-col :span="16"> <uni-col :span="16">
<view class="value">{{item[tempDataItem.attr] | formatNumber}} <view class="value">{{item[tempDataItem.attr] | formatNumber}}
<text v-if="tempDataItem.unit" v-html="tempDataItem.unit"></text> <text v-if="tempDataItem.unit" v-html="tempDataItem.unit"></text>
@ -40,129 +40,31 @@
</template> </template>
<script> <script>
import { import {
getAmmeterDataList getProjectDisplayData,
} from '@/api/ems/site.js' getDeviceList
import { } from '@/api/ems/site.js'
mapState import {
} from 'vuex' mapState
export default { } from 'vuex'
export default {
computed: { computed: {
...mapState({ ...mapState({
communicationStatusOptions: (state) => communicationStatusOptions: (state) =>
state.ems.communicationStatusOptions, state.ems.communicationStatusOptions,
}) })
}, },
data() { data() {
return { return {
siteId: '', siteId: '',
list: [], displayData: [],
deviceIdTypeMsg: { ammeterDeviceList: [],
'LOAD': [{ list: [],
name: '正向有功电能', otherTypeMsg: [{
attr: 'forwardActive', name: '正向有功电能',
pointName: '正向有功电能', attr: 'forwardActive',
unit: 'kWh' pointName: '正向有功电能',
},
{
name: '反向有功电能',
attr: 'reverseActive',
pointName: '反向有功电能',
unit: 'kWh'
},
{
name: '正向无功电能',
attr: 'forwardReactive',
pointName: '正向无功电能',
unit: 'kvarh'
},
{
name: '反向无功电能',
attr: 'reverseReactive',
pointName: '反向无功电能',
unit: 'kvarh'
},
{
name: '有功功率',
attr: 'activePower',
pointName: '总有功功率',
unit: 'kW'
},
{
name: '无功功率',
attr: 'reactivePower',
pointName: '总无功功率',
unit: 'kvar'
}
],
'METE': [{
name: '正向有功电能',
attr: 'forwardActive',
pointName: '正向有功电能',
unit: 'kWh'
},
{
name: '反向有功电能',
attr: 'reverseActive',
pointName: '反向有功电能',
unit: 'kWh'
},
{
name: '正向无功电能',
attr: 'forwardReactive',
pointName: '正向无功电能',
unit: 'kvarh'
},
{
name: '反向无功电能',
attr: 'reverseReactive',
pointName: '反向无功电能',
unit: 'kvarh'
},
{
name: '有功功率',
attr: 'activePower',
pointName: '总有功功率',
unit: 'kW'
},
{
name: '无功功率',
attr: 'reactivePower',
pointName: '总无功功率',
unit: 'kvar'
}
],
'METEGF': [{
name: '有功电能',
attr: 'activeEnergy',
pointName: '有功电能',
unit: 'kWh'
},
{
name: '无功电能',
attr: 'reactiveEnergy',
pointName: '无功电能',
unit: 'kvarh'
},
{
name: '有功功率',
attr: 'activePower',
pointName: '总有功功率',
unit: 'kW'
},
{
name: '无功功率',
attr: 'reactivePower',
pointName: '总无功功率',
unit: 'kvar'
}
]
},
otherTypeMsg: [{
name: '正向有功电能',
attr: 'forwardActive',
pointName: '正向有功电能',
unit: 'kWh' unit: 'kWh'
}, },
{ {
@ -171,32 +73,145 @@
pointName: '反向有功电能', pointName: '反向有功电能',
unit: 'kWh' unit: 'kWh'
}, },
{ {
name: '有功功率', name: '正向无功电能',
attr: 'activePower', attr: 'forwardReactive',
pointName: '总有功功率', pointName: '正向无功电能',
unit: 'kW' unit: 'kvarh'
}, },
] {
} name: '反向无功电能',
}, attr: 'reverseReactive',
onLoad(options) { pointName: '反向无功电能',
uni.showLoading() unit: 'kvarh'
this.siteId = options.siteId || '' },
getAmmeterDataList({ {
siteId: this.siteId name: '有功功率',
}).then(response => { attr: 'activePower',
this.list = response?.data || [] pointName: '总有功功率',
if (this.list.length > 0) { unit: 'kW'
this.$nextTick(() => { },
setTimeout(() => { {
this.$refs.collapse.resize() name: '无功功率',
uni.hideLoading() attr: 'reactivePower',
}, 1000) pointName: '总无功功率',
}) unit: 'kvar'
} else { },
uni.hideLoading() ]
} }
},
methods: {
getModuleRows(menuCode) {
return (this.displayData || []).filter(item => item.menuCode === menuCode)
},
getFieldName(fieldCode) {
const raw = String(fieldCode || '').trim()
if (!raw) return ''
const index = raw.lastIndexOf('__')
return index >= 0 ? raw.slice(index + 2) : raw
},
isEmptyValue(value) {
return value === undefined || value === null || value === ''
},
getFieldRowMap(rows = [], deviceId = '') {
const map = {}
const targetDeviceId = String(deviceId || '')
rows.forEach(item => {
if (!item || !item.fieldCode) return
const itemDeviceId = String(item.deviceId || '')
if (itemDeviceId !== targetDeviceId) return
map[this.getFieldName(item.fieldCode)] = item
})
rows.forEach(item => {
if (!item || !item.fieldCode) return
const itemDeviceId = String(item.deviceId || '')
if (itemDeviceId !== '') return
const fieldName = this.getFieldName(item.fieldCode)
const existRow = map[fieldName]
if (!existRow || this.isEmptyValue(existRow.fieldValue)) {
map[fieldName] = item
}
})
return map
},
getFieldConfigs(rows = []) {
const result = []
const seen = {}
(rows || []).forEach(item => {
const attr = this.getFieldName(item?.fieldCode)
const name = String(item?.fieldName || '').trim()
if (!attr || !name || seen[name]) return
const base = this.otherTypeMsg.find(i => i.attr === attr) || {}
result.push({
name,
attr,
pointName: base.pointName || name,
unit: base.unit || ''
})
seen[name] = true
})
return result.length > 0 ? result : this.otherTypeMsg
},
buildList() {
const rows = this.getModuleRows('SBJK_DB')
const fieldConfigs = this.getFieldConfigs(rows)
let devices = (this.ammeterDeviceList || []).filter(item => item.deviceCategory === 'AMMETER')
if (devices.length === 0) {
const grouped = {}
rows.forEach(item => {
const id = String(item?.deviceId || '').trim()
if (!id || grouped[id]) return
grouped[id] = {
deviceId: id,
deviceName: id
}
})
devices = Object.values(grouped)
}
if (devices.length === 0) {
devices = [{
deviceId: '',
deviceName: '电表'
}]
}
this.list = devices.map(device => {
const id = String(device.deviceId || device.id || '').trim()
const fieldRowMap = this.getFieldRowMap(rows, id)
const statusValue = fieldRowMap.communicationStatus?.fieldValue || fieldRowMap.emsCommunicationStatus?.fieldValue || ''
const values = {}
fieldConfigs.forEach(cfg => {
values[cfg.attr] = fieldRowMap[cfg.attr]?.fieldValue
})
return {
...values,
deviceId: id,
deviceName: device.deviceName || device.name || id || '电表',
emsCommunicationStatus: String(statusValue || ''),
fieldConfigs
}
})
}
},
onLoad(options) {
uni.showLoading()
this.siteId = options.siteId || ''
Promise.all([
getProjectDisplayData(this.siteId),
getDeviceList(this.siteId)
]).then(([displayResponse, deviceResponse]) => {
this.displayData = displayResponse?.data || []
this.ammeterDeviceList = deviceResponse?.data || []
this.buildList()
if (this.list.length > 0) {
this.$nextTick(() => {
setTimeout(() => {
this.$refs.collapse.resize()
uni.hideLoading()
}, 100)
})
} else {
uni.hideLoading()
}
}).catch(() => { }).catch(() => {
uni.hideLoading() uni.hideLoading()
@ -213,4 +228,4 @@
background-color: #fff; background-color: #fff;
color: #000; color: #000;
} }
</style> </style>

16
pages/work/dtdc/index.vue
View File

@ -329,14 +329,12 @@
this.getClusterList() this.getClusterList()
} }
}, },
getStackList() { getStackList() {
getStackNameList({ getStackNameList(this.siteId).then(response => {
siteId: this.siteId this.stackOptions = JSON.parse(JSON.stringify(response?.data || [])).map(item => {
}).then(response => { return {
this.stackOptions = JSON.parse(JSON.stringify(response?.data || [])).map(item => { text: item.deviceName,
return { value: item.id
text: item.deviceName,
value: item.id
} }
}) })
}) })
@ -516,4 +514,4 @@
} }
} }
</style> </style>

580
pages/work/index.vue
View File

@ -1,32 +1,20 @@
<template> <template>
<view class="work-container"> <view class="work-container">
<view class="site-sections-list"> <site-switch-header :site-id="siteId" :site-type-options="siteTypeOptions" :site-address="baseInfo.siteAddress"
<uni-data-picker placeholder="请选择" popup-title="业态选择" :step-searh="true" :value="siteId" :clear-icon="false" :running-time="baseInfo.runningTime" @change="selectedSite" />
:localdata="siteTypeOptions" :ellipsis="false" @change="selectedSite">
</uni-data-picker>
<view class="info">
<view class="list"> <uni-icons type="location" color="#fff" size="20"></uni-icons>
{{baseInfo.siteAddress || '-'}}
</view>
<view class="list">
<uni-icons type="calendar" color="#fff" size="20"></uni-icons>
{{baseInfo.runningTime || '-'}}
</view>
</view>
</view>
<!-- 静态信息 --> <!-- 静态信息 -->
<view class="base-info"> <view class="base-info">
<uni-group mode="card" class="install-data"> <uni-group mode="card" class="install-data">
<uni-grid :column="2" :showBorder="false" :square="false" :highlight="false"> <uni-grid :column="2" :showBorder="false" :square="false" :highlight="false">
<uni-grid-item> <uni-grid-item>
<view class="grid-item-box"> <view class="grid-item-box">
<view class="title">装机功率(MW)</view> <view class="title">装机功率(MWh)</view>
<view class="text">{{baseInfo.installPower | formatNumber}}</view> <view class="text">{{baseInfo.installPower | formatNumber}}</view>
</view> </view>
</uni-grid-item> </uni-grid-item>
<uni-grid-item> <uni-grid-item>
<view class="grid-item-box"> <view class="grid-item-box">
<view class="title">装机容量(MW)</view> <view class="title">装机容量(MWh)</view>
<view class="text">{{baseInfo.installCapacity | formatNumber}}</view> <view class="text">{{baseInfo.installCapacity | formatNumber}}</view>
</view> </view>
</uni-grid-item> </uni-grid-item>
@ -66,29 +54,49 @@
</template> </template>
<script> <script>
import { import {
mapGetters mapGetters
} from 'vuex' } from 'vuex'
import DateRangeSelect from './DateRangeSelect.vue' import DateRangeSelect from './DateRangeSelect.vue'
import { import SiteSwitchHeader from '@/components/SiteSwitchHeader/index.vue'
getAllSites, import {
getSingleSiteBaseInfo, getAllSites,
getSevenChargeData, getSingleSiteBaseInfo,
getPointData, getProjectDisplayData,
getSiteAllDeviceCategory getPointConfigCurve,
} from '@/api/ems/site.js' getSiteAllDeviceCategory
export default { } from '@/api/ems/site.js'
components: { const createSiteTypeOptions = () => ([{
DateRangeSelect text: '储能',
}, value: 'cn',
children: []
},
{
text: '光能',
value: 'gn',
children: []
},
{
text: '岸电',
value: 'ad',
children: []
}
])
export default {
components: {
DateRangeSelect,
SiteSwitchHeader
},
data() { data() {
return { return {
// 图表数据 // 图表数据
weekChartTimeRange: [], weekChartTimeRange: [],
activeChartTimeRange: [], activeChartTimeRange: [],
weekChartData: {}, weekChartData: {},
activeChartData: {}, activeChartData: {},
pageScrollTop: 0, curveDisplayData: [],
curveDisplayLoadingPromise: null,
pageScrollTop: 0,
glqxOptions: { glqxOptions: {
padding: [10, 5, 0, 10], padding: [10, 5, 0, 10],
dataLabel: false, dataLabel: false,
@ -140,25 +148,8 @@
// padding: [10, 15, 10, 15] // padding: [10, 15, 10, 15]
}, },
// 图表数据结束 // 图表数据结束
deviceCategoryOptions: [], //当前站点包含的设备类别 deviceCategoryOptions: [], //当前站点包含的设备类别
siteTypeOptions: [{ siteTypeOptions: createSiteTypeOptions(),
text: '储能',
value: 'cn',
children: []
},
{
text: '光能',
value: 'gn',
disable: true,
children: []
},
{
text: '岸电',
value: 'ad',
disable: true,
children: []
}
],
siteId: '', //选择的站点ID siteId: '', //选择的站点ID
baseInfo: {}, //站点基本信息 baseInfo: {}, //站点基本信息
gridList: [{ gridList: [{
@ -179,32 +170,45 @@
text: 'PCS', text: 'PCS',
categoryName: 'PCS' categoryName: 'PCS'
}, },
{ {
page: 'db', page: 'db',
icon: 'icon-dianbiao4', icon: 'icon-dianbiao4',
text: '电表', text: '电表',
categoryName: 'AMMETER' categoryName: 'AMMETER'
}, },
{ {
page: 'dtdc', page: 'yl',
icon: 'icon-dantidianchi', icon: 'icon-gongneng-diandongji',
text: '单体电池', text: '冷却',
categoryName: 'COOLING'
},
{
page: 'dtdc',
icon: 'icon-dantidianchi',
text: '单体电池',
categoryName: 'BATTERY' categoryName: 'BATTERY'
} }
] ]
} }
}, },
computed: { computed: {
...mapGetters(['belongSite']), ...mapGetters(['belongSite', 'currentSiteId']),
siteGirdList() { siteGirdList() {
return this.gridList.filter(i => this.deviceCategoryOptions.includes(i.categoryName)) return this.gridList.filter(i => this.deviceCategoryOptions.includes(i.categoryName))
} }
}, },
methods: { methods: {
// 更新一周冲放曲线时间范围 重置图表 isAvailableSite(siteId) {
updateWeekChartDate(data) { const allSites = this.siteTypeOptions.reduce((result, typeItem) => {
this.weekChartTimeRange = data || [] return result.concat(typeItem.children || [])
this.siteId && this.getWeekChartData() }, [])
const site = allSites.find(item => item.value === siteId)
return !!(site && !site.disable)
},
// 更新一周冲放曲线时间范围 重置图表
updateWeekChartDate(data) {
this.weekChartTimeRange = data || []
this.siteId && this.getWeekChartData()
}, },
// 更新当日功率曲线时间范围 重置图表 // 更新当日功率曲线时间范围 重置图表
updateActiveChartDate(data) { updateActiveChartDate(data) {
@ -221,44 +225,162 @@
} = e.detail } = e.detail
this.$tab.navigateTo(`/pages/work/${this.siteGirdList[index].page}/index?siteId=${this.siteId}`) this.$tab.navigateTo(`/pages/work/${this.siteGirdList[index].page}/index?siteId=${this.siteId}`)
}, },
selectedSite(data) { selectedSite(data) {
const [typeObj, siteObj] = data.detail.value const siteObj = (data.detail.value || [])[1]
const { const value = siteObj?.value
text, if (!value) return
value if (value === this.siteId) return
} = siteObj this.siteId = value
if (value === this.siteId) return this.$store.commit('SET_CURRENTSITEID', value)
this.siteId = value this.updateSiteInfo()
this.updateSiteInfo() },
}, updateSiteInfo() {
updateSiteInfo() { if (!this.siteId) return
if (!this.siteId) return this.curveDisplayData = []
this.getSiteBaseInfo() this.curveDisplayLoadingPromise = null
this.getWeekChartData() this.getSiteBaseInfo()
this.getGVQXData() this.getWeekChartData()
this.getSiteDeviceCategory() this.getGVQXData()
}, this.getSiteDeviceCategory()
getSiteList() { },
getAllSites().then(response => { getFieldName(fieldCode) {
const data = response?.data || [] const raw = String(fieldCode || '').trim()
this.siteTypeOptions.find(i => i.value === 'cn').children = data.map(item => { if (!raw) return ''
return { const index = raw.lastIndexOf('__')
text: item.siteName, return index >= 0 ? raw.slice(index + 2) : raw
value: item.siteId, },
id: item.id, normalizeDateTime(value, endOfDay) {
disable: !this.belongSite || this.belongSite.length === 0 || this const raw = String(value || '').trim()
.belongSite.includes('all') ? false : !this.belongSite.includes(item if (!raw) return ''
.siteId) if (raw.includes(' ')) return raw
} return `${raw} ${endOfDay ? '23:59:59' : '00:00:00'}`
}) },
// 设置默认展示的站点 parseToTimestamp(value) {
this.siteId = this.siteTypeOptions.find(i => i.children && i.children.length > 0)?.children if (!value) return null
.find( const timestamp = new Date(value).getTime()
item => !item return Number.isNaN(timestamp) ? null : timestamp
.disable)?.value || '' },
this.siteId && this.updateSiteInfo() ensureCurveDisplayData() {
}) if (!this.siteId) return Promise.resolve([])
}, if (this.curveDisplayData.length > 0) return Promise.resolve(this.curveDisplayData)
if (this.curveDisplayLoadingPromise) return this.curveDisplayLoadingPromise
this.curveDisplayLoadingPromise = getProjectDisplayData(this.siteId)
.then(response => {
this.curveDisplayData = response?.data || []
return this.curveDisplayData
})
.catch(() => {
this.curveDisplayData = []
return []
})
.finally(() => {
this.curveDisplayLoadingPromise = null
})
return this.curveDisplayLoadingPromise
},
fetchCurveSeries(pointId, name, startTime, endTime) {
if (!pointId) return Promise.resolve(null)
return getPointConfigCurve({
siteId: this.siteId,
pointId,
pointType: 'data',
rangeType: 'custom',
startTime,
endTime
}).then(response => {
const list = response?.data || []
const points = list.map(item => {
const timestamp = this.parseToTimestamp(item.dataTime)
const value = Number(item.pointValue)
if (!timestamp || Number.isNaN(value)) return null
return {
timestamp,
label: item.dataTime,
value
}
}).filter(Boolean)
return {
name,
points
}
}).catch(() => null)
},
buildLineChartData(seriesList) {
const validSeries = (seriesList || []).filter(item => item && (item.points || []).length > 0)
if (validSeries.length === 0) {
return {
categories: [],
series: []
}
}
const labelByTimestamp = {}
const timestampSet = new Set()
validSeries.forEach(item => {
item.points.forEach(point => {
timestampSet.add(point.timestamp)
if (!labelByTimestamp[point.timestamp]) {
labelByTimestamp[point.timestamp] = point.label
}
})
})
const sortedTimestamps = Array.from(timestampSet).sort((a, b) => a - b)
const categories = sortedTimestamps.map(item => labelByTimestamp[item])
const series = validSeries.map(item => {
const pointMap = {}
item.points.forEach(point => {
pointMap[point.timestamp] = point.value
})
return {
name: item.name,
data: sortedTimestamps.map(timestamp => pointMap[timestamp] ?? null)
}
})
return {
categories,
series
}
},
findActiveCurveRow(sectionRows, keywords = []) {
const keywordSet = new Set((keywords || []).map(item => String(item || '').toLowerCase()))
return (sectionRows || []).find(row => {
const fieldCode = this.getFieldName(row?.fieldCode).toLowerCase()
const fieldName = String(row?.fieldName || '').toLowerCase()
if (keywordSet.has(fieldCode) || keywordSet.has(fieldName)) return true
return Array.from(keywordSet).some(keyword => fieldCode.includes(keyword) || fieldName.includes(keyword))
})
},
getSiteList() {
getAllSites().then(response => {
const data = response?.data || []
const canAccessAll = !this.belongSite || this.belongSite.length === 0 || this.belongSite.includes('all')
const siteTypeOptions = createSiteTypeOptions().map(item => ({
...item,
children: []
}))
data.forEach(item => {
if (!canAccessAll && !this.belongSite.includes(item.siteId)) return
const siteType = (item.siteType || item.type || 'cn').toString().toLowerCase()
const typeOption = siteTypeOptions.find(i => i.value === siteType) || siteTypeOptions.find(i => i.value === 'cn')
if (!typeOption) return
typeOption.children.push({
text: item.siteName,
value: item.siteId,
id: item.id
})
})
this.siteTypeOptions = siteTypeOptions.filter(item => (item.children || []).length > 0)
const siteChildren = this.siteTypeOptions.reduce((result, typeItem) => {
return result.concat(typeItem.children || [])
}, [])
// 设置默认展示的站点
const defaultSiteId = this.isAvailableSite(this.currentSiteId) ? this.currentSiteId : (siteChildren[0]?.value || '')
if (defaultSiteId) {
this.siteId = defaultSiteId
this.$store.commit('SET_CURRENTSITEID', defaultSiteId)
this.updateSiteInfo()
}
})
},
getSiteBaseInfo() { getSiteBaseInfo() {
getSingleSiteBaseInfo({ getSingleSiteBaseInfo({
siteId: this.siteId siteId: this.siteId
@ -281,100 +403,67 @@
day = time.getDate() day = time.getDate()
return `${month<10?'0'+month : month}/${day<10 ? '0'+day : day}` return `${month<10?'0'+month : month}/${day<10 ? '0'+day : day}`
}, },
getGVQXData() { getGVQXData() {
this.$refs.activeChartDateRangeSelect.showBtnLoading(true) this.$refs.activeChartDateRangeSelect.showBtnLoading(true)
getPointData({ const startTime = this.normalizeDateTime(this.activeChartTimeRange[0], false)
siteId: this.siteId, const endTime = this.normalizeDateTime(this.activeChartTimeRange[1], true)
startDate: this.activeChartTimeRange[0], this.ensureCurveDisplayData().then(displayData => {
endDate: this.activeChartTimeRange[1] const sectionRows = (displayData || []).filter(item =>
}).then(response => { item && item.sectionName === '当日功率曲线' && item.useFixedDisplay !== 1 && item.dataPoint
console.log('当日功率曲线', response) )
let data = response?.data || [], const targetRows = [{
categories = [], name: '电网功率',
source = [{ row: this.findActiveCurveRow(sectionRows, ['gridpower', '电网功率'])
name: '电网功率', },
attr: 'gridPower', {
data: [] name: '负载功率',
}, row: this.findActiveCurveRow(sectionRows, ['loadpower', '负载功率'])
{ },
name: '负载功率', {
attr: 'loadPower', name: '储能功率',
data: [] row: this.findActiveCurveRow(sectionRows, ['storagepower', '储能功率'])
}, }
{ ].filter(item => item.row && item.row.dataPoint)
name: '储能功率', const tasks = targetRows.map(item => this.fetchCurveSeries(String(item.row.dataPoint).trim(), item.name, startTime,
attr: 'storagePower', endTime))
data: [] return Promise.all(tasks).then(series => {
}, this.activeChartData = JSON.parse(JSON.stringify(this.buildLineChartData((series || []).filter(Boolean))))
{ })
name: '光伏功率', }).finally(() => this.$refs.activeChartDateRangeSelect.showBtnLoading(false))
attr: 'pvPower',
data: [] },
}, getWeekChartData() {
{ this.$refs.weekChartDateRangeSelect.showBtnLoading(true)
name: 'soc平均值', const startTime = this.normalizeDateTime(this.weekChartTimeRange[0], false)
attr: 'avgSoc', const endTime = this.normalizeDateTime(this.weekChartTimeRange[1], true)
data: [] this.ensureCurveDisplayData().then(displayData => {
}, const sectionRows = (displayData || []).filter(item =>
{ item && item.sectionName === '一周充放曲线' && item.useFixedDisplay !== 1 && item.dataPoint
name: 'soh平均值', )
attr: 'avgSoh', const tasks = sectionRows.map(row => {
data: [] const pointId = String(row.dataPoint || '').trim()
}, if (!pointId) return Promise.resolve(null)
{ const name = row.fieldName || this.getFieldName(row.fieldCode) || pointId
name: '电池平均温度平均值平均值', return this.fetchCurveSeries(pointId, name, startTime, endTime)
attr: 'avgTemp', })
data: [] return Promise.all(tasks).then(series => {
}, this.weekChartData = JSON.parse(JSON.stringify(this.buildLineChartData((series || []).filter(Boolean))))
})
] }).finally(() => this.$refs.weekChartDateRangeSelect.showBtnLoading(false))
data.forEach((item) => { }
categories.push(item.statisDate || undefined) },
source.forEach(i => i.data.push(item[i.attr])) watch: {
}) currentSiteId(newSiteId) {
this.activeChartData = JSON.parse(JSON.stringify({ if (!newSiteId || newSiteId === this.siteId) return
categories, if (!this.isAvailableSite(newSiteId)) return
series: source this.siteId = newSiteId
})) this.updateSiteInfo()
}).finally(() => this.$refs.activeChartDateRangeSelect.showBtnLoading(false)) }
},
}, // 页面切换不会重新调用，如果希望每次切换页面都重新调接口，使用onShow
getWeekChartData() { onLoad() {
this.$refs.weekChartDateRangeSelect.showBtnLoading(true) this.$nextTick(() => {
getSevenChargeData({ this.getSiteList()
siteId: this.siteId,
startDate: this.weekChartTimeRange[0],
endDate: this.weekChartTimeRange[1]
}).then(response => {
console.log('一周功率曲线', response)
let data = response?.data || [],
categories = [],
chargedCap = [],
disChargedCap = []
data.forEach(item => {
categories.push(this.handleDate(item.ammeterDate) || undefined)
chargedCap.push(item.chargedCap)
disChargedCap.push(item.disChargedCap)
})
this.weekChartData = JSON.parse(JSON.stringify({
categories,
series: [{
"name": '充电量',
"data": chargedCap
},
{
"name": '放电量',
"data": disChargedCap
}
]
}))
}).finally(() => this.$refs.weekChartDateRangeSelect.showBtnLoading(false))
}
},
// 页面切换不会重新调用，如果希望每次切换页面都重新调接口，使用onShow
onLoad() {
this.$nextTick(() => {
this.getSiteList()
this.$refs.weekChartDateRangeSelect.init() this.$refs.weekChartDateRangeSelect.init()
this.$refs.activeChartDateRangeSelect.init(true) this.$refs.activeChartDateRangeSelect.init(true)
}) })
@ -410,79 +499,8 @@
margin-top: 10rpx; margin-top: 10rpx;
} }
// 站点选择 // 基本信息
.site-sections-list { .base-info {
background: linear-gradient(to right, #547ef4, #679ff5);
padding: 30rpx 30rpx;
padding-bottom: 100rpx;
.info {
color: #fff;
font-size: 26rpx;
line-height: 30rpx;
vertical-align: middle;
margin-top: 20rpx;
>.list {
display: flex;
justify-content: flex-start;
align-items: center;
&:not(:last-child) {
margin-bottom: 20rpx;
}
>.uni-icons {
margin-right: 10rpx;
}
}
}
.uni-data-tree {
::v-deep {
.input-value {
border: none;
padding-left: 0;
.selected-area {
width: 90%;
flex: none;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
.selected-list {
color: #fff;
}
}
// 选择中的文字样式
.text-color {
color: #fff;
font-size: 34rpx;
line-height: 36rpx;
font-weight: bolder;
}
// 右侧箭头
.arrow-area {
transform: rotate(-135deg);
.input-arrow {
border-color: #fff;
}
}
}
}
}
}
// 基本信息
.base-info {
margin-top: -80rpx; margin-top: -80rpx;
border-radius: 80rpx 80rpx 0 0; border-radius: 80rpx 80rpx 0 0;
padding: 30rpx; padding: 30rpx;
@ -581,4 +599,4 @@
} }
@media screen and (min-width: 500px) {} @media screen and (min-width: 500px) {}
</style> </style>

456
pages/work/pcs/index.vue
View File

@ -1,24 +1,48 @@
<template> <template>
<view class="page-container"> <view class="page-container">
<!-- 顶部6个数据 --> <!-- 顶部总览横向展示 -->
<uni-grid class="info-grid" :square="false" :column="2" :showBorder="false"> <scroll-view class="info-overview-scroll" scroll-x>
<uni-grid-item v-for="(item,index) in runningHeadData" :key="index+'head'"> <view class="info-overview-row">
<view class="grid-item-box"> <view class="info-overview-card" v-for="(item,index) in runningHeadCards" :key="index+'head'">
<image :src="require('@/static/images/ems/pcs/'+item.img+'.jpg')" class="icon" alt=""/> <view class="grid-item-box">
<view class="title">{{item.title}}</view> <image :src="require('@/static/images/ems/pcs/'+item.img+'.jpg')" class="icon" alt="" />
<view class="text">{{runningHeadInfo[item.attr] | formatNumber}}</view> <view class="title">{{item.title}}</view>
</view> <view class="text">{{item.value | formatNumber}}</view>
</uni-grid-item> </view>
</uni-grid> </view>
</view>
<uni-collapse ref="collapse" accordion v-if="list.length > 0"> </scroll-view>
<uni-collapse-item v-for="(item,index) in list" :key="index+'pcs'" :open="index===0"
class="common-collapse-item" :class="handleCardClass(item)"> <!-- 设备标签横向展示 -->
<scroll-view class="pcs-tags-scroll" scroll-x>
<view class="pcs-tags-row">
<view
class="pcs-tag-item"
:class="{ active: !selectedPcsId }"
@click="handleTagClick('')"
>
全部
</view>
<view
v-for="(item, index) in pcsDeviceList"
:key="index + 'pcsTag'"
class="pcs-tag-item"
:class="{ active: selectedPcsId === (item.deviceId || item.id || '') }"
@click="handleTagClick(item.deviceId || item.id || '')"
>
{{ item.deviceName || item.deviceId || item.id || 'PCS' }}
</view>
</view>
</scroll-view>
<uni-collapse ref="collapse" accordion v-if="filteredList.length > 0">
<uni-collapse-item v-for="(item,index) in filteredList" :key="index+'pcs'" :open="index===0"
class="common-collapse-item" :class="handleCardClass(item)">
<template v-slot:title> <template v-slot:title>
<view class='title-wrapper'> <view class='title-wrapper'>
<view class="top"> <view class="top">
<view class="status">{{PCSWorkStatusOptions[item.workStatus] || '暂无数据'}}</view> <view class="status">{{formatDictValue((PCSWorkStatusOptions || {}), item.workStatus, '暂无数据')}}</view>
<text class="name">{{item.deviceName}}</text> <text class="name">{{item.deviceName}}</text>
</view> </view>
</view> </view>
@ -31,25 +55,25 @@
<view class="grid-item-box"> <view class="grid-item-box">
<view class="title">工作状态</view> <view class="title">工作状态</view>
<text <text
class="text work-status-color">{{PCSWorkStatusOptions[item.workStatus] || '-'}}</text> class="text work-status-color">{{formatDictValue((PCSWorkStatusOptions || {}), item.workStatus)}}</text>
</view> </view>
</view> </view>
<view class="flex-lists"> <view class="flex-lists">
<view class="grid-item-box"> <view class="grid-item-box">
<view class="title">并网状态</view> <view class="title">并网状态</view>
<text class="text">{{gridStatusOptions[item.gridStatus] || '-'}}</text> <text class="text">{{formatDictValue((gridStatusOptions || {}), item.gridStatus)}}</text>
</view> </view>
</view> </view>
<view class="flex-lists"> <view class="flex-lists">
<view class="grid-item-box"> <view class="grid-item-box">
<view class="title">设备状态</view> <view class="title">设备状态</view>
<text class="text">{{deviceStatusOptions[item.deviceStatus] || '-'}}</text> <text class="text">{{formatDictValue((deviceStatusOptions || {}), item.deviceStatus)}}</text>
</view> </view>
</view> </view>
<view class="flex-lists"> <view class="flex-lists">
<view class="grid-item-box"> <view class="grid-item-box">
<view class="title">控制模式</view> <view class="title">控制模式</view>
<text class="text">{{controlModeOptions[item.controlMode] || '-'}}</text> <text class="text">{{formatDictValue((controlModeOptions || {}), item.controlMode)}}</text>
</view> </view>
</view> </view>
</view> </view>
@ -96,25 +120,25 @@
</uni-group> </uni-group>
</view> </view>
</uni-collapse-item> </uni-collapse-item>
</uni-collapse> </uni-collapse>
<view class="no-data" v-else> <view class="no-data" v-else>
暂无数据 暂无数据
</view> </view>
</view> </view>
</template> </template>
<script> <script>
import { import {
getRunningHeadInfo, getProjectDisplayData,
getPcsDetailInfo getPcsNameList
} from '@/api/ems/site.js' } from '@/api/ems/site.js'
import { import {
mapState mapState
} from 'vuex' } from 'vuex'
export default { export default {
computed: { computed: {
...mapState({ ...mapState({
PCSWorkStatusOptions: (state) => PCSWorkStatusOptions: (state) =>
state.ems.PCSWorkStatusOptions, state.ems.PCSWorkStatusOptions,
communicationStatusOptions: (state) => communicationStatusOptions: (state) =>
@ -123,46 +147,31 @@
state.ems.deviceStatusOptions, state.ems.deviceStatusOptions,
gridStatusOptions: (state) => gridStatusOptions: (state) =>
state.ems.gridStatusOptions, state.ems.gridStatusOptions,
controlModeOptions: (state) => controlModeOptions: (state) =>
state.ems.controlModeOptions, state.ems.controlModeOptions,
}) }),
}, runningHeadCards() {
data() { const sectionData = (this.runningDisplayData || []).filter(item => item.sectionName === '运行概览')
return { return sectionData.map((item, index) => ({
runningHeadData: [{ title: item.fieldName,
title: '实时有功功率（kW）', value: item.fieldValue,
bgColor: '#FFF2CB', img: this.getHeadCardImg(item, index)
attr: 'totalActivePower', }))
img: 'ssyggl' },
}, { filteredList() {
title: '实时无功功率（kVar）', if (!this.selectedPcsId) {
bgColor: '#CBD6FF', return this.list || []
attr: 'totalReactivePower', }
img: 'sswggl' return (this.list || []).filter(item => (item.deviceId || '') === this.selectedPcsId)
}, { }
title: '电池堆SOC', },
bgColor: '#DCCBFF', data() {
attr: 'soc', return {
img: 'soc' runningDisplayData: [],
}, { pcsDeviceList: [],
title: '电池堆SOH', selectedPcsId: '',
bgColor: '#FFD4CB', list: [],
attr: 'soh', siteId: '',
img: 'soh'
}, {
title: '今日充电量（kWh）',
bgColor: '#FFD6F8',
attr: 'dayChargedCap',
img: 'jrcdl'
}, {
title: '今日放电量（kWh）',
bgColor: '#E1FFCA',
attr: 'dayDisChargedCap',
img: 'jrfdl'
}],
runningHeadInfo: {},
list: [],
siteId: '',
infoData: [{ infoData: [{
label: "总交流有功功率", label: "总交流有功功率",
attr: "totalActivePower", attr: "totalActivePower",
@ -257,79 +266,228 @@
}, },
] ]
} }
}, },
methods: { methods: {
handleCardClass(item) { normalizeDictKey(value) {
const { const raw = String(value == null ? '' : value).trim()
workStatus = '' if (!raw) return ''
} = item if (/^-?\d+(\.0+)?$/.test(raw)) {
return workStatus === '1' || !Object.keys(this.PCSWorkStatusOptions).find(i => i === workStatus) ? return String(parseInt(raw, 10))
"timing-collapse-item" : workStatus === '2' ? 'warning-collapse-item' : 'running-collapse-item' }
}, return raw
}, },
onLoad(options) { formatDictValue(options, value, emptyText = '-') {
uni.showLoading() const dict = (options && typeof options === 'object') ? options : {}
this.siteId = options.siteId || '' const key = this.normalizeDictKey(value)
getRunningHeadInfo({ if (!key) return emptyText
siteId: this.siteId return dict[key] || key
}).then(response => { },
this.runningHeadInfo = response?.data || {} normalizeDeviceId(value) {
}) return String(value == null ? '' : value).trim().toUpperCase()
},
getPcsDetailInfo({ getModuleRows(menuCode, sectionName) {
siteId: this.siteId return (this.runningDisplayData || []).filter(item => item.menuCode === menuCode && item.sectionName === sectionName)
}).then(response => { },
this.list = response?.data || [] getFieldName(fieldCode) {
if (this.list.length > 0) { if (!fieldCode) {
this.$nextTick(() => { return ''
setTimeout(() => { }
this.$refs.collapse.resize() const index = fieldCode.lastIndexOf('__')
uni.hideLoading() return index >= 0 ? fieldCode.slice(index + 2) : fieldCode
}, 100) },
}) getFieldRowMap(rows = [], deviceId = '') {
} else { const map = {}
uni.hideLoading() const targetDeviceId = this.normalizeDeviceId(deviceId || '')
} rows.forEach(item => {
}).catch(() => { if (!item || !item.fieldCode) {
uni.hideLoading() return
}) }
} const itemDeviceId = this.normalizeDeviceId(item.deviceId || '')
if (itemDeviceId !== targetDeviceId) {
return
}
map[this.getFieldName(item.fieldCode)] = item
})
rows.forEach(item => {
if (!item || !item.fieldCode) {
return
}
const itemDeviceId = this.normalizeDeviceId(item.deviceId || '')
if (itemDeviceId !== '') {
return
}
const fieldName = this.getFieldName(item.fieldCode)
if (map[fieldName] === undefined || map[fieldName] === null || map[fieldName] === '') {
map[fieldName] = item
}
})
return map
},
getFieldMap(rows = [], deviceId = '') {
const rowMap = this.getFieldRowMap(rows, deviceId)
return Object.keys(rowMap).reduce((acc, fieldName) => {
const row = rowMap[fieldName] || {}
acc[fieldName] = row.fieldValue
return acc
}, {})
},
getLatestTime(menuCode) {
const times = (this.runningDisplayData || [])
.filter(item => item.menuCode === menuCode && item.valueTime)
.map(item => new Date(item.valueTime).getTime())
.filter(ts => !isNaN(ts))
if (times.length === 0) {
return '-'
}
const date = new Date(Math.max(...times))
const p = (n) => String(n).padStart(2, '0')
return `${date.getFullYear()}-${p(date.getMonth() + 1)}-${p(date.getDate())} ${p(date.getHours())}:${p(date.getMinutes())}:${p(date.getSeconds())}`
},
getPcsDeviceList() {
return getPcsNameList(this.siteId).then((response) => {
this.pcsDeviceList = response?.data || []
}).catch(() => {
this.pcsDeviceList = []
})
},
buildPcsList() {
const devices = this.pcsDeviceList || []
this.list = devices.map((device) => ({
...this.getFieldMap(this.getModuleRows('SBJK_PCS', '电参量'), device.deviceId || device.id || ''),
deviceId: device.deviceId || device.id || '',
deviceName: device.deviceName || device.name || device.deviceId || device.id || 'PCS',
...this.getFieldMap(this.getModuleRows('SBJK_PCS', '状态'), device.deviceId || device.id || ''),
dataUpdateTime: this.getLatestTime('SBJK_PCS'),
alarmNum: 0,
pcsBranchInfoList: [],
}))
},
getHeadCardImg(item, index) {
const imgMap = {
totalActivePower: 'ssyggl',
totalReactivePower: 'sswggl',
soc: 'soc',
soh: 'soh',
dayChargedCap: 'jrcdl',
dayChargedCap_rt: 'jrcdl',
dayDisChargedCap: 'jrfdl',
dayDisChargedCap_rt: 'jrfdl'
}
const defaultImgs = ['ssyggl', 'sswggl', 'soc', 'soh', 'jrcdl', 'jrfdl']
return imgMap[item.fieldCode] || defaultImgs[index % defaultImgs.length]
},
handleCardClass(item) {
const workStatus = this.normalizeDictKey((item && item.workStatus) || '')
const statusOptions = (this.PCSWorkStatusOptions && typeof this.PCSWorkStatusOptions === 'object')
? this.PCSWorkStatusOptions
: {}
const hasStatus = Object.prototype.hasOwnProperty.call(statusOptions, workStatus)
return workStatus === '1' || !hasStatus
? "timing-collapse-item"
: workStatus === '2'
? 'warning-collapse-item'
: 'running-collapse-item'
},
handleTagClick(deviceId) {
this.selectedPcsId = deviceId || ''
},
},
onLoad(options) {
uni.showLoading()
this.siteId = options.siteId || ''
Promise.all([
getProjectDisplayData(this.siteId),
this.getPcsDeviceList()
]).then(([displayResponse]) => {
this.runningDisplayData = displayResponse?.data || []
this.buildPcsList()
if (this.list.length > 0) {
this.$nextTick(() => {
setTimeout(() => {
this.$refs.collapse.resize()
uni.hideLoading()
}, 100)
})
} else {
uni.hideLoading()
}
}).catch(() => {
uni.hideLoading()
})
}
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.info-grid { .info-overview-scroll {
background: #fff; background: #fff;
padding: 0 20rpx; padding: 0 20rpx;
white-space: nowrap;
.uni-grid-item { }
padding: 20rpx;
.info-overview-row {
.grid-item-box { display: inline-flex;
box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.08); gap: 20rpx;
border-radius: 20rpx; padding: 20rpx 0;
}
.title {
color: #333; .info-overview-card {
margin-top: 10rpx; width: 280rpx;
} flex: 0 0 auto;
}
.text {
color: #000; .grid-item-box {
white-space: nowrap; box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.08);
text-overflow: ellipsis; border-radius: 20rpx;
width: 100%; padding: 20rpx;
overflow-x: hidden; background: #fff;
text-align: center; }
}
} .grid-item-box .title {
color: #333;
} margin-top: 10rpx;
}
.icon {
height: 100rpx; .grid-item-box .text {
width: 100rpx; color: #000;
display: block; white-space: nowrap;
border-radius: 20rpx; text-overflow: ellipsis;
} width: 100%;
} overflow-x: hidden;
</style> text-align: center;
}
.icon {
height: 100rpx;
width: 100rpx;
display: block;
border-radius: 20rpx;
}
.pcs-tags-scroll {
background: #fff;
padding: 0 20rpx 20rpx;
white-space: nowrap;
}
.pcs-tags-row {
display: inline-flex;
gap: 16rpx;
}
.pcs-tag-item {
flex: 0 0 auto;
padding: 8rpx 22rpx;
border-radius: 999rpx;
border: 1px solid #dcdfe6;
color: #606266;
font-size: 24rpx;
line-height: 1.4;
background: #fff;
}
.pcs-tag-item.active {
color: #fff;
background: #007aff;
border-color: #007aff;
}
</style>

242
pages/work/yl/index.vue Normal file
View File

@ -0,0 +1,242 @@
<template>
<view class="page-container">
<uni-collapse ref="collapse" accordion v-if="list.length > 0">
<uni-collapse-item
v-for="(item,index) in list"
:key="index + 'ylList'"
:open="index === 0"
class="common-collapse-item"
:class="handleCardClass(item)"
>
<template v-slot:title>
<view class="title-wrapper">
<view class="top">
<view class="status">{{ item.statusText }}</view>
<text class="name">{{ item.deviceName }}</text>
</view>
</view>
</template>
<view class="content">
<uni-group mode="card" class="data-card-group">
<uni-row
v-for="(field, fieldIndex) in (item.fieldConfigs || fallbackFieldConfigs)"
:key="fieldIndex + 'ylField'"
class="data-row"
>
<uni-col :span="8">
<view class="title">{{ field.name }}</view>
</uni-col>
<uni-col :span="16">
<view class="value">
{{ item[field.attr] | formatNumber }}
<text v-if="field.unit" v-html="field.unit"></text>
</view>
</uni-col>
</uni-row>
</uni-group>
</view>
</uni-collapse-item>
</uni-collapse>
<view class="no-data" v-else>
暂无数据
</view>
</view>
</template>
<script>
import {
getProjectDisplayData,
getDeviceList
} from '@/api/ems/site.js'
import {
mapState
} from 'vuex'
export default {
computed: {
...mapState({
deviceStatusOptions: (state) => state.ems.deviceStatusOptions,
}),
},
data() {
return {
siteId: '',
displayData: [],
coolingDeviceList: [],
list: [],
fallbackFieldConfigs: [{
name: '供水温度',
attr: 'gsTemp',
unit: '&#8451;'
}, {
name: '回水温度',
attr: 'hsTemp',
unit: '&#8451;'
}, {
name: '供水压力',
attr: 'gsPressure',
unit: 'MPa'
}, {
name: '回水压力',
attr: 'hsPressure',
unit: 'MPa'
}, {
name: '冷源水温度',
attr: 'lysTemp',
unit: '&#8451;'
}, {
name: 'VB01开度',
attr: 'vb01Kd',
unit: '%'
}, {
name: 'VB02开度',
attr: 'vb02Kd',
unit: '%'
}]
}
},
methods: {
normalizeDeviceId(value) {
return String(value == null ? '' : value).trim().toUpperCase()
},
getModuleRows(menuCode) {
return (this.displayData || []).filter((item) => item.menuCode === menuCode)
},
getFieldName(fieldCode) {
const raw = String(fieldCode || '').trim()
if (!raw) return ''
const index = raw.lastIndexOf('__')
return index >= 0 ? raw.slice(index + 2) : raw
},
getFieldUnit(attr) {
const field = (this.fallbackFieldConfigs || []).find((item) => item.attr === attr)
return field ? (field.unit || '') : ''
},
getFieldConfigs(rows = []) {
const result = []
const seen = {}
;(rows || []).forEach((item) => {
const attr = this.getFieldName(item?.fieldCode)
const name = String(item?.fieldName || '').trim()
if (!attr || !name || seen[name]) return
result.push({
name,
attr,
unit: this.getFieldUnit(attr),
})
seen[name] = true
})
return result.length > 0 ? result : this.fallbackFieldConfigs
},
getFieldRowMap(rows = [], deviceId = '') {
const map = {}
const targetDeviceId = this.normalizeDeviceId(deviceId || '')
rows.forEach((item) => {
if (!item || !item.fieldCode) return
const itemDeviceId = this.normalizeDeviceId(item.deviceId || '')
if (itemDeviceId !== targetDeviceId) return
map[this.getFieldName(item.fieldCode)] = item
})
rows.forEach((item) => {
if (!item || !item.fieldCode) return
const itemDeviceId = this.normalizeDeviceId(item.deviceId || '')
if (itemDeviceId !== '') return
const fieldName = this.getFieldName(item.fieldCode)
if (!map[fieldName]) {
map[fieldName] = item
}
})
return map
},
getLatestUpdateTime(rows = []) {
const times = (rows || [])
.map((item) => new Date(item?.valueTime).getTime())
.filter((ts) => !isNaN(ts))
if (times.length === 0) return '-'
const date = new Date(Math.max(...times))
const p = (n) => String(n).padStart(2, '0')
return `${date.getFullYear()}-${p(date.getMonth() + 1)}-${p(date.getDate())} ${p(date.getHours())}:${p(date.getMinutes())}:${p(date.getSeconds())}`
},
formatStatusText(statusValue) {
const key = String(statusValue == null ? '' : statusValue).trim()
if (!key) return '暂无数据'
return (this.deviceStatusOptions || {})[key] || key
},
handleCardClass(item) {
const key = String(item?.statusValue == null ? '' : item.statusValue).trim()
if (key === '1') return 'running-collapse-item'
if (key === '2') return 'warning-collapse-item'
return 'timing-collapse-item'
},
buildList() {
const rows = this.getModuleRows('SBJK_YL')
const fieldConfigs = this.getFieldConfigs(rows)
let devices = (this.coolingDeviceList || []).filter((item) => item.deviceCategory === 'COOLING')
if (devices.length === 0) {
const grouped = {}
rows.forEach((item) => {
const id = this.normalizeDeviceId(item?.deviceId || '')
if (!id || grouped[id]) return
grouped[id] = {
deviceId: id,
deviceName: item?.deviceName || id,
deviceStatus: ''
}
})
devices = Object.values(grouped)
}
if (devices.length === 0) {
devices = [{
deviceId: '',
deviceName: '冷却',
deviceStatus: ''
}]
}
this.list = devices.map((device) => {
const id = this.normalizeDeviceId(device.deviceId || device.id || '')
const fieldRowMap = this.getFieldRowMap(rows, id)
const values = {}
fieldConfigs.forEach((cfg) => {
values[cfg.attr] = fieldRowMap[cfg.attr]?.fieldValue
})
const statusField = Object.values(fieldRowMap).find((row) => String(row?.fieldName || '').includes('状态'))
const statusValue = statusField?.fieldValue || device.deviceStatus || ''
return {
...values,
deviceId: id,
deviceName: device.deviceName || device.name || id || '冷却',
statusValue: String(statusValue || ''),
statusText: this.formatStatusText(statusValue),
fieldConfigs,
dataUpdateTime: this.getLatestUpdateTime(Object.values(fieldRowMap)),
}
})
}
},
onLoad(options) {
uni.showLoading()
this.siteId = options.siteId || ''
Promise.all([
getProjectDisplayData(this.siteId),
getDeviceList(this.siteId)
]).then(([displayResponse, deviceResponse]) => {
this.displayData = displayResponse?.data || []
this.coolingDeviceList = deviceResponse?.data || []
this.buildList()
if (this.list.length > 0) {
this.$nextTick(() => {
setTimeout(() => {
this.$refs.collapse.resize()
uni.hideLoading()
}, 100)
})
} else {
uni.hideLoading()
}
}).catch(() => {
uni.hideLoading()
})
}
}
</script>

13
store/getters.js
View File

@ -2,9 +2,10 @@ const getters = {
token: state => state.user.token, token: state => state.user.token,
avatar: state => state.user.avatar, avatar: state => state.user.avatar,
id: state => state.user.id, id: state => state.user.id,
name: state => state.user.name, name: state => state.user.name,
roles: state => state.user.roles, roles: state => state.user.roles,
permissions: state => state.user.permissions, permissions: state => state.user.permissions,
belongSite: state => state.user.belongSite belongSite: state => state.user.belongSite,
} currentSiteId: state => state.user.currentSiteId
export default getters }
export default getters

109
store/modules/site.js Normal file
View File

@ -0,0 +1,109 @@
import { getAllSites } from '@/api/ems/site.js'
const createSiteTypeOptions = () => ([
{
text: '储能',
value: 'cn',
children: []
},
{
text: '光能',
value: 'gn',
children: []
},
{
text: '岸电',
value: 'ad',
children: []
}
])
const site = {
state: {
siteOptions: [],
siteTypeOptions: [],
currentSiteId: '',
loaded: false
},
mutations: {
SET_SITE_OPTIONS: (state, siteOptions) => {
state.siteOptions = siteOptions || []
},
SET_SITE_TYPE_OPTIONS: (state, siteTypeOptions) => {
state.siteTypeOptions = siteTypeOptions || createSiteTypeOptions()
},
SET_CURRENT_SITE_ID: (state, siteId) => {
state.currentSiteId = siteId || ''
},
SET_SITE_LOADED: (state, loaded) => {
state.loaded = !!loaded
}
},
actions: {
LoadSites({ state, rootState, commit }, payload = {}) {
const { force = false } = payload
if (state.loaded && !force) {
return Promise.resolve({
siteOptions: state.siteOptions,
siteTypeOptions: state.siteTypeOptions,
siteId: state.currentSiteId
})
}
return getAllSites().then(response => {
const belongSite = rootState?.user?.belongSite || []
const canAccessAll = !belongSite || belongSite.length === 0 || belongSite.includes('all')
const siteOptions = (response?.data || []).filter(item => {
const siteId = item.siteId || ''
return canAccessAll || belongSite.includes(siteId)
}).map(item => {
const siteId = item.siteId || ''
const siteType = (item.siteType || item.type || 'cn').toString().toLowerCase()
return {
text: item.siteName,
value: siteId,
id: item.id,
longitude: Number(item.longitude || 0),
latitude: Number(item.latitude || 0),
siteType
}
})
const siteTypeOptions = createSiteTypeOptions().map(typeItem => ({
...typeItem,
children: []
}))
siteOptions.forEach(item => {
const typeOption = siteTypeOptions.find(i => i.value === item.siteType) || siteTypeOptions.find(i => i.value === 'cn')
if (!typeOption) return
typeOption.children.push({
text: item.text,
value: item.value,
id: item.id
})
})
const filteredSiteTypeOptions = siteTypeOptions.filter(item => (item.children || []).length > 0)
const availableSite = siteOptions[0]
const keepCurrent = siteOptions.find(item => item.value === state.currentSiteId)
commit('SET_SITE_OPTIONS', siteOptions)
commit('SET_SITE_TYPE_OPTIONS', filteredSiteTypeOptions)
commit('SET_CURRENT_SITE_ID', keepCurrent ? keepCurrent.value : (availableSite?.value || ''))
commit('SET_SITE_LOADED', true)
return {
siteOptions,
siteTypeOptions: filteredSiteTypeOptions,
siteId: keepCurrent ? keepCurrent.value : (availableSite?.value || '')
}
})
},
SetCurrentSiteId({ commit }, siteId) {
commit('SET_CURRENT_SITE_ID', siteId)
},
ClearSiteState({ commit }) {
commit('SET_SITE_OPTIONS', [])
commit('SET_SITE_TYPE_OPTIONS', [])
commit('SET_CURRENT_SITE_ID', '')
commit('SET_SITE_LOADED', false)
}
}
}
export default site

27
store/modules/user.js
View File

@ -24,11 +24,12 @@ const user = {
token: getToken(), token: getToken(),
id: storage.get(constant.id), id: storage.get(constant.id),
name: storage.get(constant.name), name: storage.get(constant.name),
avatar: storage.get(constant.avatar), avatar: storage.get(constant.avatar),
roles: storage.get(constant.roles), roles: storage.get(constant.roles),
permissions: storage.get(constant.permissions), permissions: storage.get(constant.permissions),
belongSite: storage.get(constant.belongSite) belongSite: storage.get(constant.belongSite),
}, currentSiteId: storage.get(constant.currentSiteId)
},
mutations: { mutations: {
SET_TOKEN: (state, token) => { SET_TOKEN: (state, token) => {
@ -54,11 +55,15 @@ const user = {
state.permissions = permissions state.permissions = permissions
storage.set(constant.permissions, permissions) storage.set(constant.permissions, permissions)
}, },
SET_BELONGSITE: (state, belongSite = []) => { SET_BELONGSITE: (state, belongSite = []) => {
state.belongSite = belongSite || [] state.belongSite = belongSite || []
storage.set(constant.belongSite, belongSite || []) storage.set(constant.belongSite, belongSite || [])
} },
}, SET_CURRENTSITEID: (state, currentSiteId = '') => {
state.currentSiteId = currentSiteId || ''
storage.set(constant.currentSiteId, currentSiteId || '')
}
},
actions: { actions: {
// 登录 // 登录
@ -133,4 +138,4 @@ const user = {
} }
} }
export default user export default user

3
utils/constant.js
View File

@ -3,7 +3,8 @@ const constant = {
id: 'user_id', id: 'user_id',
name: 'user_name', name: 'user_name',
roles: 'user_roles', roles: 'user_roles',
permissions: 'user_permissions' permissions: 'user_permissions',
currentSiteId: 'current_site_id'
} }
export default constant export default constant

27
utils/request.js
View File

@ -21,16 +21,25 @@ const request = config => {
config.url = url config.url = url
} }
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
const requestUrl = config.baseUrl || baseUrl + config.url
const requestMethod = (config.method || 'get').toUpperCase()
uni.request({ uni.request({
method: config.method || 'get', method: config.method || 'get',
timeout: config.timeout || timeout, timeout: config.timeout || timeout,
url: config.baseUrl || baseUrl + config.url, url: requestUrl,
data: config.data, data: config.data,
header: config.header, header: config.header,
dataType: 'json' dataType: 'json'
}).then(response => { }).then(response => {
let [error, res] = response let [error, res] = response
if (error) { if (error) {
const errorType = error?.errMsg || error?.message || 'UNKNOWN_ERROR'
console.error('[request:error]', {
url: requestUrl,
method: requestMethod,
errorType,
rawError: error
})
toast('后端接口连接异常') toast('后端接口连接异常')
reject('后端接口连接异常') reject('后端接口连接异常')
return return
@ -57,6 +66,15 @@ const request = config => {
}) })
.catch(error => { .catch(error => {
let { message } = error let { message } = error
const rawMessage = message || ''
let errorType = 'UNKNOWN_ERROR'
if (rawMessage === 'Network Error') {
errorType = 'NETWORK_ERROR'
} else if (rawMessage.includes('timeout')) {
errorType = 'TIMEOUT'
} else if (rawMessage.includes('Request failed with status code')) {
errorType = 'HTTP_STATUS_ERROR'
}
if (message === 'Network Error') { if (message === 'Network Error') {
message = '后端接口连接异常' message = '后端接口连接异常'
} else if (message.includes('timeout')) { } else if (message.includes('timeout')) {
@ -64,6 +82,13 @@ const request = config => {
} else if (message.includes('Request failed with status code')) { } else if (message.includes('Request failed with status code')) {
message = '系统接口' + message.substr(message.length - 3) + '异常' message = '系统接口' + message.substr(message.length - 3) + '异常'
} }
console.error('[request:catch]', {
url: requestUrl,
method: requestMethod,
errorType,
message: rawMessage,
rawError: error
})
toast(message) toast(message)
reject(error) reject(error)
}) })