xzzn/emsfront
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

单体电池点位接口参数更新

Browse Source
This commit is contained in:
白菜
2026-01-23 20:51:12 +08:00
parent 8cb6fbee3e
commit e96bb2b07e
1 changed files with 104 additions and 88 deletions
Download Patch File Download Diff File Expand all files Collapse all files

192
src/views/ems/dzjk/sbjk/dtdc/index.vue
View File

@ -1,8 +1,8 @@
<template> <template>
<el-card <el-card
v-loading="loading" v-loading="loading"
shadow="always" shadow="always"
class="sbjk-card-container common-card-container-no-title-bg running-card-container" class="sbjk-card-container common-card-container-no-title-bg running-card-container"
> >
<div slot="header"> <div slot="header">
<span class="large-title">单体电池实时数据</span> <span class="large-title">单体电池实时数据</span>
@ -11,49 +11,50 @@
<el-form :inline="true" class="select-container"> <el-form :inline="true" class="select-container">
<el-form-item label="编号"> <el-form-item label="编号">
<el-input <el-input
v-model="search.batteryId" v-model="search.batteryId"
placeholder="请输入" placeholder="请输入"
clearable clearable
style="width: 150px" style="width: 150px"
/> />
</el-form-item> </el-form-item>
<el-form-item label="电池堆"> <el-form-item label="电池堆">
<el-select <el-select
v-model="search.stackId" v-model="search.stackId"
placeholder="请选择" placeholder="请选择"
@change="changeStackId" @change="changeStackId"
> >
<el-option <el-option
:label="item.deviceName" :label="item.deviceName"
:value="item.id" :value="item.id"
v-for="(item, index) in stackOptions" v-for="(item, index) in stackOptions"
:key="index + 'stackOptions'" :key="index + 'stackOptions'"
></el-option> ></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="电池簇"> <el-form-item label="电池簇">
<el-select <el-select
v-model="search.clusterId" v-model="search.clusterId"
:no-data-text=" :no-data-text="
!search.stackId && stackOptions.length > 0 !search.stackId && stackOptions.length > 0
? '请先选择电池堆' ? '请先选择电池堆'
: '无数据' : '无数据'
" "
placeholder="请选择" placeholder="请选择"
:loading="clusterloading" :loading="clusterloading"
loading-text="正在加载数据" loading-text="正在加载数据"
> >
<el-option <el-option
:label="item.deviceName" :label="item.deviceName"
:value="item.id" :value="item.id"
v-for="(item, index) in clusterOptions" v-for="(item, index) in clusterOptions"
:key="index + 'clusterOptions'" :key="index + 'clusterOptions'"
></el-option> ></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button type="primary" @click="onSearch" native-type="button" <el-button type="primary" @click="onSearch" native-type="button"
>搜索</el-button >搜索
</el-button
> >
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
@ -71,57 +72,56 @@
</div> </div>
<el-button-group class="ems-btns-group"> <el-button-group class="ems-btns-group">
<el-button <el-button
:class="{ activeBtn: activeBtn === 'table' }" :class="{ activeBtn: activeBtn === 'table' }"
@click="changeMenu('table')" @click="changeMenu('table')"
>图表</el-button >图表
</el-button
> >
<el-button <el-button
:class="{ activeBtn: activeBtn === 'list' }" :class="{ activeBtn: activeBtn === 'list' }"
@click="changeMenu('list')" @click="changeMenu('list')"
>图形</el-button >图形
</el-button
> >
</el-button-group> </el-button-group>
</div> </div>
<component <component
:is="activeBtn === 'table' ? 'DtdcTable' : 'DtdcList'" :is="activeBtn === 'table' ? 'DtdcTable' : 'DtdcList'"
:tableData="tableData" :tableData="tableData"
:totalSize="totalSize" :totalSize="totalSize"
:pointIdList="pointIdList" :pointIdList="pointIdList"
@chart="chartDetail" @chart="chartDetail"
@pointDetail="pointDetail" @pointDetail="pointDetail"
></component> ></component>
<el-pagination <el-pagination
v-show="tableData.length > 0" v-show="tableData.length > 0"
background background
@size-change="handleSizeChange" @size-change="handleSizeChange"
@current-change="handleCurrentChange" @current-change="handleCurrentChange"
:current-page="pageNum" :current-page="pageNum"
:page-size="pageSize" :page-size="pageSize"
:page-sizes="[10, 20, 30, 40]" :page-sizes="[10, 20, 30, 40]"
layout="total, sizes, prev, pager, next, jumper" layout="total, sizes, prev, pager, next, jumper"
:total="totalSize" :total="totalSize"
style="margin-top: 15px; text-align: center" style="margin-top: 15px; text-align: center"
> >
</el-pagination> </el-pagination>
<chart-detail ref="chartDetail" /> <chart-detail ref="chartDetail"/>
<point-chart ref="pointChart" :site-id="siteId" /> <point-chart ref="pointChart" :site-id="siteId"/>
<point-table ref="pointTable"/> <point-table ref="pointTable"/>
</el-card> </el-card>
</template> </template>
<script> <script>
import BarChart from "./BarChart"; import BarChart from "./BarChart";
import { import {getClusterDataInfoList, getClusterNameList, getStackNameList,} from "@/api/ems/dzjk";
getStackNameList,
getClusterNameList,
getClusterDataInfoList,
} from "@/api/ems/dzjk";
import getQuerySiteId from "@/mixins/ems/getQuerySiteId"; import getQuerySiteId from "@/mixins/ems/getQuerySiteId";
import ChartDetail from "./ChartDetail.vue"; import ChartDetail from "./ChartDetail.vue";
import Table from "./Table.vue"; import Table from "./Table.vue";
import List from "./List.vue"; import List from "./List.vue";
import pointChart from "./../PointChart.vue"; import pointChart from "./../PointChart.vue";
import PointTable from "@/views/ems/site/sblb/PointTable.vue"; import PointTable from "@/views/ems/site/sblb/PointTable.vue";
export default { export default {
name: "DzjkSbjkDtdc", name: "DzjkSbjkDtdc",
mixins: [getQuerySiteId], mixins: [getQuerySiteId],
@ -157,7 +157,7 @@ export default {
return { return {
loading: false, loading: false,
clusterloading: false, clusterloading: false,
search: { stackId: "", clusterId: "", batteryId: "" }, search: {stackId: "", clusterId: "", batteryId: ""},
stackOptions: [], //{id:'',deviceName:''} stackOptions: [], //{id:'',deviceName:''}
clusterOptions: [], //{id:'',deviceName:''} clusterOptions: [], //{id:'',deviceName:''}
tableData: [], tableData: [],
@ -170,23 +170,28 @@ export default {
}, },
methods: { methods: {
// 查看设备电位表格 // 查看设备电位表格
pointDetail(row,dataType){ pointDetail(row, dataType) {
const {deviceId,clusterDeviceId} = row const {deviceId, clusterDeviceId} = row
this.$refs.pointTable.showTable({siteId:this.siteId,deviceId,deviceCategory:'BATTERY',parentId:clusterDeviceId},dataType) this.$refs.pointTable.showTable({
siteId: this.siteId,
deviceId: deviceId + clusterDeviceId,
deviceCategory: 'BATTERY',
parentId: clusterDeviceId
}, dataType)
}, },
changeMenu(menu) { changeMenu(menu) {
const { activeBtn } = this; const {activeBtn} = this;
activeBtn !== menu && (this.activeBtn = menu); activeBtn !== menu && (this.activeBtn = menu);
}, },
//查看表格行图表 //查看表格行图表
chartDetail({ deviceId, clusterDeviceId, dataType = "" }) { chartDetail({deviceId, clusterDeviceId, dataType = ""}) {
dataType && dataType &&
this.$refs.pointChart.showChart({ this.$refs.pointChart.showChart({
pointName: dataType, pointName: dataType,
deviceCategory:'BATTERY', deviceCategory: 'BATTERY',
deviceId: clusterDeviceId, deviceId: clusterDeviceId,
child: [deviceId], child: [deviceId],
}); });
}, },
// 分页 // 分页
handleSizeChange(val) { handleSizeChange(val) {
@ -210,7 +215,7 @@ export default {
// 清空搜索栏选中数据 // 清空搜索栏选中数据
// 清空电池簇列表，保留电池堆列表 // 清空电池簇列表，保留电池堆列表
onReset() { onReset() {
this.search = { stackId: "", clusterId: "", batteryId: "" }; this.search = {stackId: "", clusterId: "", batteryId: ""};
this.clusterOptions = []; this.clusterOptions = [];
this.pageNum = 1; this.pageNum = 1;
this.getTableData(); this.getTableData();
@ -218,9 +223,9 @@ export default {
changeStackId(val) { changeStackId(val) {
if (val) { if (val) {
console.log( console.log(
"选择了电池堆，需要获取对应的电池簇", "选择了电池堆，需要获取对应的电池簇",
val, val,
this.search.stackId this.search.stackId
); );
this.search.clusterId = ""; this.search.clusterId = "";
this.getClusterList(); this.getClusterList();
@ -234,7 +239,7 @@ export default {
clusterId: clusterDeviceId, clusterId: clusterDeviceId,
batteryId, batteryId,
} = this.search; } = this.search;
const { siteId, pageNum, pageSize } = this; const {siteId, pageNum, pageSize} = this;
getClusterDataInfoList({ getClusterDataInfoList({
stackDeviceId, stackDeviceId,
clusterDeviceId, clusterDeviceId,
@ -243,14 +248,14 @@ export default {
pageNum, pageNum,
pageSize, pageSize,
}) })
.then((response) => { .then((response) => {
this.tableData = response?.rows?.[0]?.batteryList || []; //todo check this.tableData = response?.rows?.[0]?.batteryList || []; //todo check
this.pointData = response?.rows?.[0]?.clusterList || []; //todo check this.pointData = response?.rows?.[0]?.clusterList || []; //todo check
this.totalSize = response?.total || 0; this.totalSize = response?.total || 0;
}) })
.finally(() => { .finally(() => {
this.loading = false; this.loading = false;
}); });
}, },
getStackList() { getStackList() {
getStackNameList(this.siteId).then((response) => { getStackNameList(this.siteId).then((response) => {
@ -263,18 +268,18 @@ export default {
stackDeviceId: this.search.stackId, stackDeviceId: this.search.stackId,
siteId: this.siteId, siteId: this.siteId,
}) })
.then((response) => { .then((response) => {
this.clusterOptions = JSON.parse( this.clusterOptions = JSON.parse(
JSON.stringify(response?.data || []) JSON.stringify(response?.data || [])
); );
}) })
.finally(() => { .finally(() => {
this.clusterloading = false; this.clusterloading = false;
}); });
}, },
init() { init() {
// 只有页面初次加载或切换站点的时候调用电池堆列表，其他情况不需要 // 只有页面初次加载或切换站点的时候调用电池堆列表，其他情况不需要
this.search = { stackId: "", clusterId: "", batteryId: "" }; //保证切换站点时，清空选择项 this.search = {stackId: "", clusterId: "", batteryId: ""}; //保证切换站点时，清空选择项
this.clusterOptions = []; this.clusterOptions = [];
this.pageNum = 1; this.pageNum = 1;
this.totalSize = 0; this.totalSize = 0;
@ -282,13 +287,13 @@ export default {
this.getTableData(); this.getTableData();
}, },
}, },
mounted() {},
}; };
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.tip-container { .tip-container {
text-align: right; text-align: right;
position: relative; position: relative;
.color-tip { .color-tip {
position: absolute; position: absolute;
top: 50%; top: 50%;
@ -297,9 +302,11 @@ export default {
font-size: 11px; font-size: 11px;
line-height: 12px; line-height: 12px;
color: #333; color: #333;
.tip { .tip {
padding-left: 30px; padding-left: 30px;
position: relative; position: relative;
&::before { &::before {
display: block; display: block;
content: ""; content: "";
@ -311,32 +318,41 @@ export default {
height: 8px; height: 8px;
border-radius: 50%; border-radius: 50%;
} }
&.minwd { &.minwd {
color: #3794ff; color: #3794ff;
&::before { &::before {
background: #3794ff; background: #3794ff;
} }
} }
&.maxwd { &.maxwd {
color: #ff3a3b; color: #ff3a3b;
&::before { &::before {
background: #ff3a3b; background: #ff3a3b;
} }
} }
&.mindy { &.mindy {
color: #de6902; color: #de6902;
&::before { &::before {
background: #de6902; background: #de6902;
} }
} }
&.maxdy { &.maxdy {
color: #ffb521; color: #ffb521;
&::before { &::before {
background: #ffb521; background: #ffb521;
} }
} }
} }
} }
::v-deep { ::v-deep {
.el-button-group.ems-btns-group { .el-button-group.ems-btns-group {
& > .el-button { & > .el-button {