<template>
|
<flex-layout direction="row" class="page-real-time" :no-bg="true">
|
<content-box
|
style="margin-left: 4px; margin-right: 4px"
|
:title="battFullName">
|
<flex-layout :no-bg="true">
|
<div class="page-content">
|
<div class="page-content-tools" v-if="control.show && isCanTest">
|
<el-popover placement="bottom" trigger="hover">
|
<div class="hdw-menu-list">
|
<ul>
|
<li class="hdw-menu-item" v-if="control.data.startTest.show">
|
<a href="javascript:void(0);" @click="dischargeParamsDialog=true">启动测试</a>
|
</li>
|
<li class="hdw-menu-item" v-if="control.data.stopTest.show">
|
<a href="javascript:void(0);" @click="stopTest">停止测试</a>
|
</li>
|
<li class="hdw-menu-item" v-if="control.data.setSystemParams.show">
|
<a href="javascript:void(0);">系统参数设置</a>
|
</li>
|
</ul>
|
</div>
|
<button class="hdw-btn transparentBtn" slot="reference">
|
<span class="light-color">远程管理</span>
|
<i class="hdw-icon el-icon-caret-bottom"></i>
|
</button>
|
</el-popover>
|
</div>
|
<el-tabs v-model="acTabs" type="border-card" class="flex-layout noborder" @tab-click="tabClick">
|
<el-tab-pane key="eleLine" label="电路拓扑图" class="tab-eleLine" name="eleLine" v-if="pageConfig.eleLine">
|
<layout-container>
|
<div slot="left" class="left-tools">
|
<science-box
|
style="position: relative"
|
no-header>
|
<div class="hdw-state-list table-layout">
|
<div class="table-row">
|
<div class="table-cell text-right">{{ acVolAlarm.label }}:</div>
|
<div class="table-cell">
|
{{acVolAlarm.text}}
|
</div>
|
</div>
|
</div>
|
</science-box>
|
<div class="mgt8">
|
<science-box
|
style="position: relative"
|
no-header>
|
<div class="hdw-state-list table-layout">
|
<div class="table-row" v-for="item in alarmLights" :key="item.key">
|
<div class="table-cell text-right">{{ item.label }}:</div>
|
<div class="table-cell">
|
<hdw-light :type="item.state"></hdw-light>
|
</div>
|
</div>
|
</div>
|
</science-box>
|
</div>
|
<div class="mgt8" v-for="(item, index) in alarmText" :key="'key'+index">
|
<science-box
|
style="position: relative"
|
no-header>
|
<div class="hdw-state-list table-layout">
|
<div class="table-row">
|
<div class="table-cell text-right">{{ item[0].label }}:</div>
|
<div class="table-cell" :class="{'warn-text': item[0].warn}">
|
{{ item[0].text }}
|
</div>
|
</div>
|
<div class="table-row">
|
<div class="table-cell text-right">{{ item[1].label }}:</div>
|
<div class="table-cell" :class="{'warn-text': item[1].warn}">
|
{{ item[1].text }}
|
</div>
|
</div>
|
</div>
|
</science-box>
|
</div>
|
</div>
|
<pei-wang
|
:batt="batt"
|
:update="diagram.update"
|
:data-change-flag="diagram.dataChangeFlag"
|
:list="diagram.data"></pei-wang>
|
<div class="diagram-mask" v-if="diagram.data.workState === -1"></div>
|
</layout-container>
|
</el-tab-pane>
|
</el-tabs>
|
</div>
|
</flex-layout>
|
</content-box>
|
<!-- 放电参数设置 -->
|
<el-dialog
|
title="放电参数设置"
|
width="auto"
|
:visible.sync="dischargeParamsDialog"
|
:close-on-click-modal="false"
|
top="0"
|
class="dialog-center"
|
:modal-append-to-body="false">
|
<discharge-params :work-state="diagram.data.workState" :batt="batt" :visible.sync="dischargeParamsDialog" v-if="dischargeParamsDialog"></discharge-params>
|
</el-dialog>
|
</flex-layout>
|
</template>
|
|
<script>
|
import ContentBox from "@/components/ContentBox.vue";
|
import HomeList from "@/views/dataTest/movingRingSystem/HomeList.vue";
|
import {getBattGroupInfo} from "@/views/dataMager/js/battGroupMager";
|
import LayoutContainer from "@/components/LayoutContainer.vue";
|
import PeiWang from "@/views/dataTest/components/diagrams/peiWang/index.vue";
|
import ScienceBox from "@/components/ScienceBox.vue";
|
import HdwLight from "@/components/HdwLight.vue";
|
import createWs from "@/assets/js/websocket";
|
import {isHasPermit} from "@/assets/js/tools";
|
const WSMixin = createWs("RealTime");
|
import {searchInfo} from "./js/realTime";
|
import dischargeParams from "./components/peiWang/dischargeParams.vue";
|
import {stop} from "@/views/dataTest/js/peiWang";
|
|
export default {
|
name: "movingRingSysteRrealTime",
|
mixins: [WSMixin],
|
components: {
|
HdwLight,
|
ScienceBox,
|
LayoutContainer,
|
HomeList,
|
ContentBox,
|
PeiWang,
|
dischargeParams
|
},
|
tblData: [],
|
data() {
|
let pageConfig = this.$store.getters["user/realTabsConfig"];
|
let permits = this.$store.state.user.permits;
|
let isCanTest = isHasPermit("batt_test_op_permit", permits);
|
return {
|
dischargeParamsDialog: false,
|
homeListShow: true,
|
acTabs: "eleLine",
|
pageConfig,
|
batt: {},
|
isCanTest,
|
acVolAlarm: {
|
label: "交流输入电压",
|
key: "alarmAcInputvol",
|
warn: false,
|
text: "无告警"
|
},
|
alarmLights: [
|
{
|
label: "交流输入失电",
|
key: "alarmAcInputdown",
|
state: -1
|
},
|
{
|
label: "升压模块故障",
|
key: "alarmBoostdcdcFault",
|
state: -1
|
},
|
{
|
label: "降压模块故障",
|
key: "alarmBuckdcdcFault",
|
state: -1
|
},
|
{
|
label: "逆变模块通信故障",
|
key: "alarmNibiancommfault",
|
state: -1
|
},
|
{
|
label: "电源故障",
|
key: "alarmAcdcFault",
|
state: -1
|
},
|
{
|
label: "散热器温度",
|
key: "alarmCoolert",
|
state: -1
|
},
|
{
|
label: "内部温度",
|
key: "alarmInnertemp",
|
state: -1
|
},
|
],
|
alarmText: [
|
[
|
{
|
label: "组1容量",
|
key: "alarmCap1",
|
warn: false,
|
text: "无告警"
|
},
|
{
|
label: "组1组端电压",
|
key: "alarmGroupvol1",
|
warn: false,
|
text: "无告警"
|
},
|
],
|
[
|
{
|
label: "组2容量",
|
key: "alarmCap2",
|
warn: false,
|
text: "无告警"
|
},
|
{
|
label: "组2组端电压",
|
key: "alarmGroupvol2",
|
warn: false,
|
text: "无告警"
|
},
|
],
|
[
|
{
|
label: "组3容量",
|
key: "alarmCap3",
|
warn: false,
|
text: "无告警"
|
},
|
{
|
label: "组3组端电压",
|
key: "alarmGroupvol3",
|
warn: false,
|
text: "无告警"
|
},
|
],
|
[
|
{
|
label: "组4容量",
|
key: "alarmCap4",
|
warn: false,
|
text: "无告警"
|
},
|
{
|
label: "组4组端电压",
|
key: "alarmGroupvol4",
|
warn: false,
|
text: "无告警"
|
},
|
]
|
],
|
diagram: {
|
update: true,
|
dataChangeFlag: 0,
|
data: {
|
eleSwitch: 1, // 市电开关
|
busVo: 0, // 母线电压
|
busVd: 0, // 放电母线电压
|
busVc: 0, // 充电母线电压
|
group1Vol: 0, // 电池组1电压
|
group1Curr: 0, // 电池组1电流
|
group2Vol: 0, // 电池组2电压
|
group2Curr: 0, // 电池组2电流
|
group3Vol: 0, // 电池组3电压
|
group3Curr: 0, // 电池组3电流
|
group4Vol: 0, // 电池组4电压
|
group4Curr: 0, // 电池组4电流
|
dischargeOnOff: false, // 放电模块开关
|
chargeOnOff: false, // 充电模块开关
|
loadOnOff1: true, // 用户负载1开关
|
loadOnOff2: true, // 用户负载2开关
|
loadOnOff3: true, // 用户负载3开关
|
loadOnOff4: true, // 用户负载4开关
|
loadOnOff5: true, // 用户负载5开关
|
group1Pos: false, // 电池组1正极开关
|
group1Neg: false, // 电池组1负极开关
|
group2Pos: false, // 电池组2正极开关
|
group2Neg: false, // 电池组2负极开关
|
group3Pos: false, // 电池组3正极开关
|
group3Neg: false, // 电池组3负极开关
|
group4Pos: false, // 电池组4正极开关
|
group4Neg: false, // 电池组4负极开关
|
group1State: -1, // 电池组1状态
|
group2State: -1, // 电池组2状态
|
group3State: -1, // 电池组3状态
|
group4State: -1, // 电池组4状态
|
workState: -1,
|
updateTime: "2023-05-11 00:00:00"
|
}
|
},
|
control: {
|
show: false,
|
data: {
|
startTest: {
|
// 启动核容测试
|
show: true,
|
typeShow: false,
|
id: 11,
|
},
|
stopTest: {
|
// 停止测试
|
show: true,
|
typeShow: false,
|
id: 12,
|
},
|
setSystemParams: {
|
// 系统参数设置
|
show: true,
|
typeShow: false,
|
id: 13,
|
},
|
},
|
},
|
}
|
},
|
methods: {
|
onWSOpen() {
|
this.$nextTick(() => {
|
this.sendMessage();
|
});
|
},
|
sendMessage() {
|
let batt = this.batt;
|
console.log(
|
this.isWSOpen,
|
"websocket status",
|
this.SOCKET ? this.SOCKET.readyState : "socket为null"
|
);
|
if (!batt.battGroupId || !this.isWSOpen) {
|
return false;
|
}
|
let params = {
|
battGroupId: batt.battGroupId,
|
devId: batt.fbsdeviceId,
|
powerDeviceId: 0,
|
groupNum: batt.groupIndexInFBSDevice,
|
pageType: "inverter5100",
|
};
|
console.log("=====9=", params, JSON.stringify(params));
|
this.SOCKET.send(JSON.stringify(params));
|
},
|
onWSMessage(res) {
|
res = JSON.parse(res.data);
|
let data = res.data.data;
|
let diagramData = this.diagram.data;
|
// console.log(data, "=====111data");
|
|
// 判断系统状态
|
let f9100state = data.f9100state;
|
if(f9100state.code === 1 && f9100state.data) {
|
let list = f9100state.data2;
|
// 判断是否超时
|
let outTime = 2 * 60; //设备超时时间(2分钟)
|
let nowTime = new Date(list.note).getTime(); //当前时间
|
let record = new Date(list.recordDatetime).getTime();
|
let state = -1;
|
if (Math.abs(nowTime - record) / 1000 > outTime) {
|
state = -1;
|
} else {
|
state = list.devWorkstate;
|
}
|
diagramData.workState = state;
|
}else {
|
diagramData.workState = -1;
|
}
|
|
// 设置数据
|
let stateRes = data.f5100stateRes;
|
if(stateRes.code == 1 && stateRes.data) {
|
let list = stateRes.data2;
|
diagramData.eleSwitch = list.alarmAcInputdown?false:true;
|
diagramData.busVo = list.muxianvol;
|
diagramData.busVd = list.muxianvolDischarge;
|
diagramData.busVc = list.muxianvolCharge;
|
diagramData.group1Vol = list.groupVol1;
|
diagramData.group1Curr = list.battCurr1;
|
diagramData.group2Vol = list.groupVol2;
|
diagramData.group2Curr = list.battCurr2;
|
diagramData.group3Vol = list.groupVol3;
|
diagramData.group3Curr = list.battCurr3;
|
diagramData.group4Vol = list.groupVol4;
|
diagramData.group4Curr = list.battCurr4;
|
diagramData.dischargeOnOff = !list.dissumoutUp;
|
diagramData.chargeOnOff = !list.chgsumIn;
|
diagramData.loadOnOff1= !list.loader1;
|
diagramData.loadOnOff2= !list.loader2;
|
diagramData.loadOnOff3= !list.loader3;
|
diagramData.loadOnOff4= !list.loader4;
|
diagramData.loadOnOff5= !list.loader5;
|
diagramData.group1Pos = !list.battdisUp1;
|
diagramData.group1Neg = !list.battchg1;
|
diagramData.group2Pos = !list.battdisUp2;
|
diagramData.group2Neg = !list.battchg2;
|
diagramData.group3Pos = !list.battdisUp3;
|
diagramData.group3Neg = !list.battchg3;
|
diagramData.group4Pos = !list.battdisUp4;
|
diagramData.group4Neg = !list.battchg4;
|
diagramData.group1State = list.battState1;
|
diagramData.group2State = list.battState2;
|
diagramData.group3State = list.battState3;
|
diagramData.group4State = list.battState4;
|
diagramData.updateTime = list.recordTime;
|
this.acVolAlarm.text = list.alarmAcInputvol === 1?"高告警":list.alarmAcInputvol===2?"低告警":"无告警";
|
this.setAlarmLights(list);
|
this.setAlarmText(list);
|
this.diagram.dataChangeFlag = Math.random(); // 数据更新
|
}
|
},
|
setAlarmLights(data) {
|
let alarmLights = this.alarmLights;
|
alarmLights.forEach(item=>{
|
item.state = data[item.key] === 1?1:0;
|
});
|
},
|
setAlarmText(data) {
|
let alarmText = this.alarmText;
|
alarmText.forEach(items=>{
|
items.forEach(item=>{
|
let value = data[item.key];
|
item.text = value===1?"上限告警":value===2?"下限告警":"无告警";
|
item.warn = value !== 0;
|
});
|
});
|
},
|
getBattGroupInfo(battGroupId) {
|
this.homeListShow = false;
|
getBattGroupInfo(battGroupId)
|
.then((res) => {
|
res = res.data;
|
if (res.code) {
|
this.leafClick(res.data[0]);
|
} else {
|
this.$layer.msg("未获取到电池组的信息");
|
}
|
})
|
.catch((error) => {
|
console.log(error);
|
});
|
},
|
leafClick(data) {
|
this.batt = data;
|
this.$nextTick(()=>{
|
this.sendMessage();
|
});
|
},
|
toggleChange() {
|
this.resize();
|
},
|
tabClick(tab) {
|
this.acTabs = tab.name;
|
// 根据tab更新电路图
|
this.diagram.update = this.acTabs === "eleLine";
|
// 更新图表
|
this.setChart();
|
|
// 重置图表的大小
|
this.$nextTick(() => {
|
this.resize();
|
// 设置表格的数据
|
if (this.acTabs === "tblData") {
|
this.table.datas = this.$options.tblData;
|
}
|
});
|
},
|
setChart() {
|
|
},
|
// 停止测试
|
stopTest() {
|
this.$layer.confirm("停止测试", {icon: 3,}, (index) => {
|
// 关闭询问层
|
this.$layer.close(index);
|
// 开启等待框
|
let loading = this.$layer.loading(1);
|
// 请求后台
|
stop(this.batt.fbsdeviceId).then((res) => {
|
console.log(res);
|
res = res.data;
|
console.log(res);
|
if (res.code) {
|
// 提示信息
|
this.$layer.msg("停止测试成功");
|
} else {
|
// 提示信息
|
this.$layer.msg("停止测试失败！");
|
}
|
// 关闭等待框
|
this.$layer.close(loading);
|
})
|
.catch((error) => {
|
console.log(error);
|
// 关闭等待框
|
this.$layer.close(loading);
|
// 提示信息
|
this.$layer.msg("停止测试失败，停止测试请求异常！");
|
});
|
});
|
},
|
resize() {
|
const acTabs = this.acTabs;
|
this.acTabs = "";
|
this.$nextTick(() => {
|
this.acTabs = acTabs;
|
});
|
},
|
// 查询控制按钮的内容
|
searchControl() {
|
searchInfo({ categoryId: 2 })
|
.then((res) => {
|
res = res.data;
|
let control = false; // 控制整体的显示
|
if (res.code) {
|
let data = res.data.list;
|
Object.keys(this.control.data).forEach((key) => {
|
let item = this.control.data[key];
|
item.show = this.getStateById(item.id, data); // 根据id设置按钮的状态
|
// 存在控制
|
if (item.show) {
|
control = item.show;
|
}
|
});
|
}
|
this.control.show = control; // 设置整体显示的状态
|
})
|
.catch((error) => {
|
console.log(error);
|
});
|
},
|
getStateById(id, list) {
|
let result = true;
|
for (let i = 0; i < list.length; i++) {
|
let item = list[i];
|
if (id == item.id) {
|
result = item.status ? true : false;
|
break;
|
}
|
}
|
return result;
|
},
|
},
|
computed:{
|
battFullName() {
|
let batt = this.batt;
|
if (batt.stationName && batt.battGroupName) {
|
return batt.stationName + "-" + batt.battGroupName;
|
}
|
return "电池组全称";
|
},
|
},
|
mounted() {
|
let battGroupId = this.$route.params.battGroupId;
|
// console.log("mounted======", battGroupId);
|
if (battGroupId) {
|
this.getBattGroupInfo(battGroupId);
|
}
|
// 查询远程控制状态
|
this.searchControl();
|
}
|
}
|
</script>
|
|
<style scoped>
|
.page-content {
|
position: relative;
|
padding-top: 8px;
|
padding-bottom: 2px;
|
box-sizing: border-box;
|
height: 100%;
|
}
|
.left-tools {
|
padding: 4px 8px;
|
}
|
.table-cell.text-right {
|
vertical-align: middle;
|
}
|
.table-cell.warn-text {
|
color: #ffe329;
|
}
|
|
.page-content-tools {
|
position: absolute;
|
top: 14px;
|
right: 8px;
|
z-index: 99;
|
}
|
.hdw-btn {
|
display: inline-block;
|
color: #fff;
|
background-color: #409eff;
|
border-color: #409eff;
|
line-height: 1;
|
white-space: nowrap;
|
cursor: pointer;
|
-webkit-appearance: none;
|
text-align: center;
|
box-sizing: border-box;
|
outline: none;
|
margin: 0;
|
transition: 0.1s;
|
font-weight: 500;
|
-webkit-user-select: none;
|
-moz-user-select: none;
|
-ms-user-select: none;
|
user-select: none;
|
padding: 6px 10px;
|
font-size: 14px;
|
border-radius: 4px;
|
}
|
|
.hdw-btn:hover {
|
background-color: #3c91e6;
|
}
|
|
.hdw-menu-list {
|
border: 1px solid #409eff;
|
}
|
|
.hdw-menu-list .hdw-menu-item {
|
border-top: 1px solid #0e5194;
|
}
|
|
.hdw-menu-list .hdw-menu-item:first-child {
|
border-top: none;
|
}
|
|
.hdw-menu-item a {
|
display: block;
|
text-align: center;
|
padding: 8px;
|
color: #ffffff;
|
cursor: pointer;
|
background-color: rgba(30, 125, 219, 0.767);
|
}
|
|
.hdw-menu-item a:hover {
|
background-color: rgb(60, 135, 211);
|
}
|
|
.hdw-menu-item a:active {
|
background-color: rgb(34, 100, 167);
|
}
|
.diagram-mask {
|
position: absolute;
|
top: 0;
|
bottom: 0;
|
left: 0;
|
right: 0;
|
background-color: rgba(97, 97, 98, 0.8);
|
z-index: 10;
|
}
|
</style>
|
