<template>
|
<flex-layout direction="row" class="page-real-time" :no-bg="true">
|
<content-box
|
style="margin-left: 4px; margin-right: 4px"
|
:title="battFullName"
|
>
|
<div class="flex-page-content">
|
<div class="page-content-tools">
|
<div>
|
<el-row :gutter="8">
|
<el-col :span="16" class="status-text"> 通讯状态: </el-col>
|
<el-col :span="8">
|
<hdw-light :type="allSignal"></hdw-light>
|
</el-col>
|
</el-row>
|
</div>
|
</div>
|
<el-tabs
|
type="border-card"
|
class="flex-layout noborder top-border"
|
v-model="acTabs"
|
@tab-click="tabsChange"
|
>
|
<el-tab-pane
|
label="交流配电柜遥测量"
|
name="acData"
|
v-if="powerData.info.isAcCabinet"
|
>
|
<el-button
|
type="primary"
|
size="mini"
|
class="btn-detail"
|
@click="details('ac')"
|
round
|
>详情</el-button
|
>
|
<div class="full-height">
|
<ggdmeasure
|
v-if="acTabs == 'acData'"
|
:recordTime="acTime"
|
:powerDeviceId="powerData.info.powerDeviceId"
|
></ggdmeasure>
|
</div>
|
</el-tab-pane>
|
<el-tab-pane
|
label="直流配电柜遥测量"
|
name="dcData"
|
v-if="powerData.info.isDcCabinet"
|
>
|
<el-button
|
type="primary"
|
size="mini"
|
class="btn-detail"
|
@click="details('dc')"
|
round
|
>详情</el-button
|
>
|
<div class="full-height">
|
<dcmeasure
|
v-if="acTabs == 'dcData'"
|
:recordTime="dcTime"
|
:powerDeviceId="powerData.info.powerDeviceId"
|
></dcmeasure>
|
</div>
|
</el-tab-pane>
|
<el-tab-pane
|
label="高频开关电源柜遥测量"
|
name="acDcData"
|
v-if="powerData.info.isHighfreqCabinet"
|
>
|
<el-button
|
type="primary"
|
size="mini"
|
class="btn-detail"
|
@click="details('acdc')"
|
round
|
>详情</el-button
|
>
|
<div class="full-height">
|
<hf-switch
|
v-if="acTabs == 'acDcData'"
|
:data="acDc"
|
:moduleCount="moduleInUseCount"
|
:moduleSwitchStatus="configs.acDc.moduleSwitchStatus"
|
:powerDeviceId="powerData.info.powerDeviceId"
|
></hf-switch>
|
</div>
|
</el-tab-pane>
|
</el-tabs>
|
</div>
|
</content-box>
|
<el-dialog
|
title="交流配电柜遥信量配置"
|
width="500px"
|
:visible.sync="acDialog"
|
:close-on-click-modal="false"
|
top="0"
|
class="dialog-center"
|
:modal-append-to-body="false"
|
:destroy-on-close="true"
|
>
|
<ac-config
|
:visible.sync="acDialog"
|
:batt="batt"
|
:info="configs.ac"
|
@success="getPowerACConfigById"
|
></ac-config>
|
</el-dialog>
|
<el-dialog
|
title="高频开关电源柜遥信量配置"
|
width="720px"
|
:visible.sync="acDcDialog"
|
:close-on-click-modal="false"
|
top="0"
|
class="dialog-center"
|
:modal-append-to-body="false"
|
:destroy-on-close="true"
|
>
|
<ac-dc-config
|
:visible.sync="acDcDialog"
|
:batt="batt"
|
:info="configs.acDc"
|
@success="getPowerACDCConfigById"
|
></ac-dc-config>
|
</el-dialog>
|
<el-dialog
|
title="直流配电柜遥信量配置"
|
width="500px"
|
:visible.sync="dcDialog"
|
:close-on-click-modal="false"
|
top="0"
|
class="dialog-center"
|
:modal-append-to-body="false"
|
:destroy-on-close="true"
|
>
|
<dc-config
|
:visible.sync="dcDialog"
|
:batt="batt"
|
:info="configs.dc"
|
@success="getPowerDCConfigById"
|
></dc-config>
|
</el-dialog>
|
<el-dialog
|
title="图表配置"
|
width="500px"
|
:visible.sync="chartDialog"
|
:close-on-click-modal="false"
|
top="0"
|
class="dialog-center"
|
:modal-append-to-body="false"
|
:destroy-on-close="true"
|
>
|
<chart-type-config
|
:visible.sync="chartDialog"
|
v-if="chartDialog"
|
:info="chartTypeConfig"
|
@success="changeChartTypeSuccess"
|
></chart-type-config>
|
</el-dialog>
|
<!-- 详情 -->
|
<el-dialog
|
:title="detailsTitle"
|
width="1280px"
|
:visible.sync="detailsVisible"
|
:close-on-click-modal="false"
|
top="0"
|
class="dialog-center"
|
:modal-append-to-body="false"
|
:destroy-on-close="true"
|
>
|
<div class="detail-content">
|
<template v-if="detailsType == 'ac'">
|
<power-box-component
|
title="交流配电柜遥测量"
|
:data="acData"
|
:length="1"
|
></power-box-component>
|
<power-box-component
|
title="交流配电柜遥信量"
|
:data="acSignalData"
|
:length="4"
|
>
|
<div slot="tools">
|
<i class="box-tools el-icon-s-tools" @click="acDialog = true"></i>
|
</div>
|
</power-box-component>
|
</template>
|
<template v-else-if="detailsType == 'acdc'">
|
<power-box-component
|
title="高频开关电源柜遥测量"
|
:data="acDcData"
|
:length="1"
|
></power-box-component>
|
<power-box-component
|
title="高频开关电源柜遥信量"
|
:data="acDcSignalData"
|
:length="4"
|
>
|
<div slot="tools">
|
<i
|
class="box-tools el-icon-s-tools"
|
@click="acDcDialog = true"
|
></i>
|
</div>
|
</power-box-component>
|
</template>
|
<template v-else>
|
<power-box-component
|
title="直流配电柜遥测量"
|
:data="dcData"
|
:length="1"
|
></power-box-component>
|
<power-box-component
|
title="直流配电柜遥信量"
|
:data="dcSignalData"
|
:length="4"
|
>
|
<div slot="tools">
|
<i class="box-tools el-icon-s-tools" @click="dcDialog = true"></i>
|
</div>
|
</power-box-component>
|
</template>
|
</div>
|
</el-dialog>
|
</flex-layout>
|
</template>
|
|
<script>
|
import ContentBox from "@/components/ContentBox";
|
import { getValByKey, Timeout } from "@/assets/js/tools";
|
import PowerBoxComponent from "./components/PowerBoxComponent";
|
import getAcData from "./movingRingSystem/const/getAcData";
|
import getAcDcData from "./movingRingSystem/const/getAcDcData";
|
import getDcData from "./movingRingSystem/const/getDcData";
|
import getAcSignalData from "./movingRingSystem/const/getAcSignalData";
|
import getAcDcSignalData from "./movingRingSystem/const/getAcDcSignalData";
|
import getDcSignalData from "./movingRingSystem/const/getDcSignalData";
|
import getPowerConfigData from "./movingRingSystem/const/getPowerConfigData";
|
import AcDcConfig from "./movingRingSystem/dialog/acDcConfig";
|
import AcConfig from "./movingRingSystem/dialog/acConfig";
|
import DcConfig from "./movingRingSystem/dialog/dcConfig";
|
import FlexBox from "@/components/FlexBox";
|
import EChartWrapper from "@/components/chart/EChartWrapper";
|
import getYMin from "@/components/chart/js/getYMin";
|
import getYMax from "@/components/chart/js/getYMax";
|
import getItemByKey from "@/assets/js/tools/getItemByKey";
|
import ChartTypeConfig from "./movingRingSystem/dialog/chartTypeConfig";
|
import HdwLight from "@/components/HdwLight";
|
import ggdmeasure from "./GGDmeasure.vue";
|
import dcmeasure from "./DCmeasure.vue";
|
import hfSwitch from "./hfSwitch.vue";
|
import getBinaryDigits from "@/assets/js/tools/getBinaryDigits";
|
import {
|
getPowerDisplayConfigList,
|
getPowerDCConfigById,
|
getPowerBoxData,
|
getPowerACDCConfigById,
|
getPowerACConfigById,
|
getInfoById,
|
} from "@/views/dataMager/js/power";
|
import createWs from "@/assets/js/websocket";
|
const WSMixin = createWs("RealTime");
|
import produceData from "@/assets/js/const/produceData";
|
export default {
|
name: "powerBox",
|
mixins: [WSMixin],
|
components: {
|
HdwLight,
|
ChartTypeConfig,
|
FlexBox,
|
DcConfig,
|
AcConfig,
|
AcDcConfig,
|
PowerBoxComponent,
|
ContentBox,
|
EChartWrapper,
|
ggdmeasure,
|
dcmeasure,
|
hfSwitch,
|
},
|
chartOpts(option) {
|
let opt = option ? option : {};
|
let unit = opt.unit ? option.unit : "";
|
let type = opt.type ? option.type : "bar";
|
return {
|
animation: false,
|
tooltip: {
|
trigger: "axis",
|
axisPointer: {
|
// 坐标轴指示器，坐标轴触发有效
|
type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
|
},
|
},
|
grid: {
|
top: "32px",
|
left: "1%",
|
right: "1%",
|
bottom: "18px",
|
containLabel: true,
|
},
|
xAxis: [
|
{
|
type: "category",
|
axisLabel: {
|
interval: 0,
|
},
|
},
|
],
|
yAxis: [
|
{
|
type: "value",
|
name: unit ? "Y(" + unit + ")" : "Y",
|
splitLine: {
|
show: true,
|
},
|
min: getYMin,
|
max: getYMax,
|
},
|
],
|
series: [
|
{
|
type: type,
|
label: {
|
show: true,
|
position: "top",
|
color: "#fff",
|
formatter: function (params) {
|
return params.value[1] + unit;
|
},
|
},
|
data: [],
|
},
|
],
|
};
|
},
|
data() {
|
let acData = getAcData();
|
let acDcData = getAcDcData();
|
let dcData = getDcData();
|
let acSignalData = getAcSignalData();
|
let acDcSignalData = getAcDcSignalData();
|
let dcSignalData = getDcSignalData();
|
return {
|
moduleInUseCount: 0,
|
titles: {
|
ac: "交流配电柜详情",
|
acdc: "高频开关电源柜详情",
|
dc: "直流配电柜详情",
|
},
|
detailsType: "",
|
detailsTitle: "",
|
detailsVisible: false,
|
acTime: "",
|
dcTime: "",
|
battFullName: "电池组全称",
|
layout: {
|
gutter: 16,
|
span: 8,
|
span2: 6,
|
},
|
// acTabs: "acData",
|
acTabs: this.$route.query.tab ? this.$route.query.tab : "",
|
allSignal: -1,
|
batt: {},
|
powerData: {
|
info: {
|
powerDeviceId: 0,
|
stationId: 0,
|
stationName: "",
|
stationName1: "",
|
stationName2: "",
|
stationName3: "",
|
stationName4: " ",
|
stationName5: "",
|
isAcCabinet: 0, // 交流配电柜
|
isDcCabinet: 0, // 直流配电柜
|
isHighfreqCabinet: 0, // 高频配电柜
|
},
|
realData: {},
|
},
|
acData,
|
ac: {},
|
acDcData,
|
acDc: {},
|
dcData,
|
dc: {},
|
acSignalData,
|
acDcSignalData,
|
dcSignalData,
|
acDialog: false,
|
acDcDialog: false,
|
dcDialog: false,
|
configs: {
|
ac: getPowerConfigData("ac"),
|
acDc: getPowerConfigData("acDc"),
|
dc: getPowerConfigData("dc"),
|
},
|
chartDialog: false,
|
chartTypeConfig: {
|
id: null,
|
name: "",
|
type: 0,
|
},
|
chartTypes: [],
|
};
|
},
|
watch: {
|
"$route.params.powerDeviceId"(powerDeviceId) {
|
this.$nextTick(() => {
|
this.getPowerInfo(powerDeviceId);
|
});
|
},
|
allSignal() {
|
let acTabs = this.acTabs;
|
this.acTabs = "";
|
this.$nextTick(() => {
|
this.acTabs = acTabs;
|
});
|
},
|
},
|
methods: {
|
getPowerACDCConfigById() {
|
let id = this.powerData.info.powerDeviceId;
|
this.acDcSignalData = getAcDcSignalData();
|
getPowerACDCConfigById(id)
|
.then((res) => {
|
res = res.data;
|
let moduleInUseCount = 0;
|
if (res.code) {
|
let data = res.data;
|
this.configs.acDc = {
|
powerDeviceId: id,
|
moduleCap: data.moduleCap,
|
moduleInUseCount: data.moduleInUseCount,
|
moduleSlotCount: data.moduleSlotCount,
|
moduleSwitchStatus: data.moduleSwitchStatus,
|
usePurPose: data.usePurPose,
|
};
|
moduleInUseCount = data.moduleInUseCount;
|
} else {
|
this.configs.acDc = getPowerConfigData("acDc");
|
}
|
this.moduleInUseCount = moduleInUseCount;
|
this.configs.acDc.powerDeviceId = id;
|
this.changeAcDcData(this.configs.acDc);
|
})
|
.catch((error) => {
|
this.configs.acDc = getPowerConfigData("acDc");
|
this.configs.acDc.powerDeviceId = id;
|
this.changeAcDcData(this.configs.acDc);
|
console.log(error);
|
});
|
},
|
changeAcDcData(config) {
|
let inUseCount = config.moduleInUseCount;
|
let moduleSwitchStatus = config.moduleSwitchStatus * 1;
|
const checkedList = getBinaryDigits(moduleSwitchStatus, inUseCount)
|
.map((v, i) => {
|
if (v) {
|
return i;
|
}
|
})
|
.filter((v) => v != undefined);
|
let list = {};
|
for (let i = 1; i <= inUseCount; i++) {
|
let flag = checkedList.some((v) => v + 1 == i) ? 1 : 0;
|
list["isAcdcmod" + i + "Off"] = flag;
|
list["isAcdcmod" + i + "Err"] = flag;
|
}
|
this.acDcSignalData.map((item) => {
|
if (item.inUse == 0) {
|
item.inUse = getValByKey(item.key, list, 0);
|
}
|
});
|
|
// 2024/4/7弃用插槽数 统一用模块个数
|
// let slotCount = config.moduleSlotCount;
|
let list2 = {};
|
for (let i = 1; i <= inUseCount; i++) {
|
list2["isAcdcmod" + i + "Off"] = 1;
|
list2["isAcdcmod" + i + "Err"] = 1;
|
}
|
|
// 更新插槽数 2024/4/7弃用插槽数 统一用模块个数
|
this.acDcSignalData = this.acDcSignalData.filter((item) => {
|
let pattern = /^isAcdcmod\d*(Off|Err)$/;
|
if (pattern.test(item.key)) {
|
return getValByKey(item.key, list2, 0) ? true : false;
|
} else {
|
return true;
|
}
|
});
|
|
// 更新遥测量中 模块个数
|
this.acDcData = getAcDcData().filter((v) => {
|
let pattern = /^m(\d*)Outcurr$/;
|
const match = v.key.match(pattern);
|
if (match) {
|
return match[1] > inUseCount ? false : true;
|
} else {
|
return true;
|
}
|
});
|
},
|
getPowerACConfigById() {
|
let id = this.powerData.info.powerDeviceId;
|
this.acSignalData = getAcSignalData();
|
getPowerACConfigById(id)
|
.then((res) => {
|
res = res.data;
|
if (res.code) {
|
let data = res.data;
|
this.configs.ac = {
|
powerDeviceId: data.powerDeviceId,
|
inputSWCount: data.inputSWCount,
|
outputSWCount: data.outputSWCount,
|
cap: data.cap,
|
usePurPose: data.usePurPose,
|
};
|
} else {
|
this.configs.ac = getPowerConfigData("ac");
|
}
|
this.configs.ac.powerDeviceId = id;
|
this.changeAcData(this.configs.ac);
|
})
|
.catch((error) => {
|
this.configs.ac = getPowerConfigData("ac");
|
this.configs.ac.powerDeviceId = id;
|
this.changeAcData(this.configs.ac);
|
console.log(error);
|
});
|
},
|
changeAcData(config) {
|
let outputSWCount = config.outputSWCount;
|
let list = {};
|
for (let i = 1; i <= outputSWCount; i++) {
|
list["isFsw1Sw" + i + "trip"] = 1;
|
list["isFsw2Sw" + i + "trip"] = 1;
|
}
|
this.acSignalData = this.acSignalData.filter((item) => {
|
let pattern = /^isFsw\d*Sw\d*trip$/;
|
if (pattern.test(item.key)) {
|
return getValByKey(item.key, list, 0) ? true : false;
|
} else {
|
return true;
|
}
|
});
|
},
|
getPowerDCConfigById() {
|
let id = this.powerData.info.powerDeviceId;
|
this.dcSignalData = getDcSignalData();
|
getPowerDCConfigById(id)
|
.then((res) => {
|
res = res.data;
|
if (res.code) {
|
let data = res.data;
|
this.configs.dc = {
|
powerDeviceId: data.powerDeviceId,
|
inputSWCount: data.inputSWCount,
|
outputSWCount: data.outputSWCount,
|
cap: data.cap,
|
usePurPose: data.usePurPose,
|
};
|
} else {
|
this.configs.dc = getPowerConfigData("dc");
|
}
|
this.configs.dc.powerDeviceId = id;
|
this.changeDcData(this.configs.dc);
|
})
|
.catch((error) => {
|
this.configs.dc = getPowerConfigData("dc");
|
this.configs.dc.powerDeviceId = id;
|
this.changeDcData(this.configs.dc);
|
console.log(error);
|
});
|
},
|
changeDcData(config) {
|
let outputSWCount = config.outputSWCount;
|
let list = {};
|
for (let i = 1; i <= outputSWCount; i++) {
|
list["isFsw1Sw" + i + "trip"] = 1;
|
list["isFsw2Sw" + i + "trip"] = 1;
|
}
|
this.dcSignalData = this.dcSignalData.filter((item) => {
|
let pattern = /^isFsw\d*Sw\d*trip$/;
|
if (pattern.test(item.key)) {
|
return getValByKey(item.key, list, 0) ? true : false;
|
} else {
|
return true;
|
}
|
});
|
},
|
getPowerConfig() {
|
this.$axios
|
.all([
|
this.getPowerACDCConfigById(),
|
this.getPowerACConfigById(),
|
this.getPowerDCConfigById(),
|
this.getPowerDisplayConfigList(),
|
])
|
.then(() => {
|
this.sendMessage();
|
})
|
.catch((error) => {
|
this.sendMessage();
|
});
|
},
|
onWSOpen() {
|
this.sendMessage();
|
},
|
sendMessage() {
|
let powerData = this.powerData;
|
// console.log(powerData, '=====powerData');
|
if (!this.isWSOpen || !powerData.info.powerDeviceId) {
|
return false;
|
}
|
let params = {
|
// battGroupId: batt.battGroupId,
|
devId: 0,
|
powerDeviceId: powerData.info.powerDeviceId,
|
pageType: "power1",
|
};
|
// console.log("====", params, JSON.stringify(params));
|
this.SOCKET.send(JSON.stringify(params));
|
},
|
onWSMessage(res) {
|
res = JSON.parse(res.data);
|
let data = res.data.data;
|
// console.log(data, "=====data");
|
this.getPowerBoxData(data.pwrdevInfo);
|
},
|
getPowerInfo(powerDeviceId) {
|
this.powerData.info.powerDeviceId = powerDeviceId;
|
getInfoById({
|
powerDeviceId: powerDeviceId,
|
})
|
.then((res) => {
|
res = res.data;
|
if (res.code && res.data.list.length) {
|
this.powerData.info = res.data.list[0];
|
//console.log(this.powerData.info);
|
let info = this.powerData.info;
|
// 根据配置与跳转激活选项卡
|
let tabList = [];
|
if (info.isAcCabinet) {
|
tabList.push("acData");
|
}
|
if (info.isHighfreqCabinet) {
|
tabList.push("acDcData");
|
}
|
if (info.isDcCabinet) {
|
tabList.push("dcData");
|
}
|
|
if (!tabList.includes(this.acTabs)) {
|
this.acTabs = tabList[0];
|
}
|
|
// let info = this.powerData.info;
|
// this.acTabs = info.isAcCabinet
|
// ? "acData"
|
// : info.isHighfreqCabinet
|
// ? "acDcData"
|
// : "dcData";
|
this.batt.stationName = this.powerData.info.stationName;
|
this.battFullName =
|
this.batt.stationName +
|
"-" +
|
this.powerData.info.powerDeviceName +
|
"-" +
|
"通信电源";
|
} else {
|
this.powerData.info = {
|
powerDeviceId: 0,
|
stationId: 0,
|
stationName: "",
|
stationName1: "",
|
stationName2: "",
|
stationName3: "",
|
stationName4: " ",
|
stationName5: "",
|
};
|
}
|
// 获取配置数据
|
this.getPowerConfig();
|
})
|
.catch((error) => {
|
console.log(error);
|
});
|
},
|
leafClick(data) {
|
this.batt = data;
|
},
|
getPowerBoxData(res) {
|
if (res) {
|
if (res.code && res.data) {
|
this.allSignal = 0;
|
let data = res.data2;
|
// 交流
|
if (data.ac.commStatus) {
|
this.setAcInfo(data.ac);
|
this.acTime = data.ac.recordDatetime;
|
} else {
|
this.setAcInfo({});
|
}
|
// 高频
|
if (data.acdc.commStatus) {
|
this.setAcDcInfo(data.acdc);
|
} else {
|
this.setAcDcInfo({});
|
}
|
// 直流
|
if (data.dc.commStatus) {
|
this.setDcInfo(data.dc);
|
this.dcTime = data.dc.recordDatetime;
|
} else {
|
this.setDcInfo({});
|
}
|
} else {
|
this.setAcInfo({});
|
this.setAcDcInfo(produceData.acdc);
|
this.setDcInfo({});
|
this.allSignal = 1;
|
}
|
}
|
},
|
setAcInfo(data) {
|
// 设置交流配电柜的值
|
let acTabs = this.acTabs;
|
if (acTabs == "acData") {
|
this.acData.map((item) => {
|
item.value = getValByKey(item.key, data, "???", 2);
|
});
|
|
if (acTabs == "acData") {
|
this.setAcChart(this.acData);
|
}
|
}
|
|
this.acSignalData.map((item) => {
|
item.value = getValByKey(item.key, data, -1);
|
});
|
},
|
setAcDcInfo(data) {
|
this.acDc = data;
|
// 设置高频开关电源柜的值
|
let acTabs = this.acTabs;
|
if (acTabs == "acDcData") {
|
this.acDcData.map((item) => {
|
item.value = getValByKey(item.key, data, "???", 2);
|
});
|
|
if (acTabs == "acDcData") {
|
this.setAcDcChart(this.acDcData);
|
}
|
}
|
this.acDcSignalData.map((item) => {
|
item.value = item.inUse == 0 ? -1 : getValByKey(item.key, data, -1);
|
});
|
},
|
setDcInfo(data) {
|
// 设置直流配电柜的值
|
let acTabs = this.acTabs;
|
if (acTabs == "dcData") {
|
this.dcData.map((item) => {
|
item.value = getValByKey(item.key, data, "???", 2);
|
});
|
if (acTabs == "dcData") {
|
this.setDcChart(this.dcData);
|
}
|
}
|
this.dcSignalData.map((item) => {
|
item.value = getValByKey(item.key, data, -1);
|
});
|
},
|
tabsChange() {
|
this.resize();
|
},
|
setOption() {
|
// 交流配电柜图表
|
this.$refs.acOneInputVol?.setOption(this.$options.chartOpts());
|
this.$refs.acOneInputCurr?.setOption(this.$options.chartOpts());
|
this.$refs.acTwoInputVol?.setOption(this.$options.chartOpts());
|
this.$refs.acTwoInputCurr?.setOption(this.$options.chartOpts());
|
this.$refs.acVolAlarmLimit?.setOption(this.$options.chartOpts());
|
this.$refs.acTemp?.setOption(this.$options.chartOpts());
|
|
// 高频交流电源柜图表
|
this.$refs.acDcInputVol?.setOption(this.$options.chartOpts());
|
this.$refs.acDcOutputVol?.setOption(this.$options.chartOpts());
|
this.$refs.acDcOutputCurr?.setOption(this.$options.chartOpts());
|
this.$refs.acDcCurr?.setOption(this.$options.chartOpts());
|
this.$refs.acDcVol?.setOption(this.$options.chartOpts());
|
this.$refs.acDcModuleOutputCurr?.setOption(this.$options.chartOpts());
|
this.$refs.acDcVolAlarmLimit?.setOption(this.$options.chartOpts());
|
this.$refs.acDcTemp?.setOption(this.$options.chartOpts());
|
|
// 直流配电柜
|
this.$refs.dcInputVol?.setOption(this.$options.chartOpts());
|
this.$refs.dcOutputVol?.setOption(this.$options.chartOpts());
|
this.$refs.dcOutputCurr?.setOption(this.$options.chartOpts());
|
this.$refs.dcVolLimit?.setOption(this.$options.chartOpts());
|
this.$refs.dcTemp?.setOption(this.$options.chartOpts());
|
|
// 重置大小
|
this.resize();
|
},
|
setAcChart(data) {
|
this.setChartOption(data, {
|
keys: ["acin1Vola", "acin1Volb", "acin1Volc"],
|
refs: this.$refs.acOneInputVol,
|
name: "acOneInputVol",
|
unit: "V",
|
});
|
this.setChartOption(data, {
|
keys: ["acin1CurrA", "acin1CurrB", "acin1CurrC"],
|
refs: this.$refs.acOneInputCurr,
|
name: "acOneInputCurr",
|
unit: "A",
|
});
|
this.setChartOption(data, {
|
keys: ["acin2Vola", "acin2Volb", "acin2Volc"],
|
refs: this.$refs.acTwoInputVol,
|
name: "acTwoInputVol",
|
unit: "V",
|
});
|
this.setChartOption(data, {
|
keys: ["acin2Curra", "acin2Currb", "acin2Currc"],
|
refs: this.$refs.acTwoInputCurr,
|
name: "acTwoInputCurr",
|
unit: "A",
|
});
|
|
this.setChartOption(data, {
|
keys: ["acVolHLimit", "acVolLLimit"],
|
refs: this.$refs.acVolAlarmLimit,
|
name: "acVolAlarmLimit",
|
unit: "V",
|
});
|
|
this.setChartOption(data, {
|
keys: ["temprature"],
|
refs: this.$refs.acTemp,
|
name: "acTemp",
|
unit: "℃",
|
});
|
},
|
setAcDcChart(data) {
|
this.setChartOption(data, {
|
keys: [
|
"acin1Vola",
|
"acin1Volb",
|
"acin1Volc",
|
"acin2Vola",
|
"acin2Volb",
|
"acin2Volc",
|
],
|
refs: this.$refs.acDcInputVol,
|
name: "acDcInputVol",
|
unit: "V",
|
});
|
this.setChartOption(data, {
|
keys: ["acoutVola", "acoutVolb", "acoutVolc"],
|
refs: this.$refs.acDcOutputVol,
|
name: "acDcOutputVol",
|
unit: "V",
|
});
|
this.setChartOption(data, {
|
keys: ["acoutCurra", "acoutCurrb", "acoutCurrc"],
|
refs: this.$refs.acDcOutputCurr,
|
name: "acDcOutputCurr",
|
unit: "A",
|
});
|
this.setChartOption(data, {
|
keys: [
|
"loaderCurr",
|
"chargLimitCurr",
|
"battgroup1Curr",
|
"battgroup2Curr",
|
],
|
refs: this.$refs.acDcCurr,
|
name: "acDcCurr",
|
unit: "A",
|
});
|
this.setChartOption(data, {
|
keys: [
|
"dcOutVol",
|
"junChargeVol",
|
"floatChargeVol",
|
"battgroup1Vol",
|
"battgroup2Vol",
|
],
|
refs: this.$refs.acDcVol,
|
name: "acDcVol",
|
unit: "V",
|
});
|
|
let modulesKeys = [];
|
for (let i = 1; i <= 16; i++) {
|
modulesKeys.push("m" + i + "OutCurr");
|
}
|
this.setChartOption(data, {
|
keys: modulesKeys,
|
refs: this.$refs.acDcModuleOutputCurr,
|
name: "acDcModuleOutputCurr",
|
unit: "A",
|
});
|
this.setChartOption(data, {
|
keys: [
|
"acVolHLimit",
|
"acVolLLimit",
|
"dcOutVolHLimit",
|
"dcOutVolLLimit",
|
],
|
refs: this.$refs.acDcVolAlarmLimit,
|
name: "acDcVolAlarmLimit",
|
unit: "V",
|
});
|
this.setChartOption(data, {
|
keys: ["acdcmTemp"],
|
refs: this.$refs.acDcTemp,
|
name: "acDcTemp",
|
unit: "℃",
|
});
|
},
|
setDcChart(data) {
|
this.setChartOption(data, {
|
keys: ["dcIn1Vol", "dcIn2Vol"],
|
refs: this.$refs.dcInputVol,
|
name: "dcInputVol",
|
unit: "V",
|
});
|
this.setChartOption(data, {
|
keys: ["dcOut1Vol", "dcOut2Vol"],
|
refs: this.$refs.dcOutputVol,
|
name: "dcOutputVol",
|
unit: "V",
|
});
|
this.setChartOption(data, {
|
keys: ["dcOut1Curr", "dcOut2Curr"],
|
refs: this.$refs.dcOutputCurr,
|
name: "dcOutputCurr",
|
unit: "A",
|
});
|
this.setChartOption(data, {
|
keys: ["acVolHLimit", "acVolLLimit"],
|
refs: this.$refs.dcVolLimit,
|
name: "dcVolLimit",
|
unit: "V",
|
});
|
this.setChartOption(data, {
|
keys: ["temprature"],
|
refs: this.$refs.dcTemp,
|
name: "dcTemp",
|
unit: "℃",
|
});
|
},
|
setChartOption(data, option) {
|
let opt = this.$options.chartOpts({
|
unit: option.unit,
|
});
|
let chartType = this.getItemByName(option.name, this.chartTypes);
|
opt.tooltip.axisPointer.type =
|
chartType == 0 ? "shadow" : chartType.type == 0 ? "shadow" : "line";
|
opt.series[0].type =
|
chartType == 0 ? "bar" : chartType.type == 0 ? "bar" : "line";
|
opt.series[0].data = option.keys.map((item) => {
|
let res = getItemByKey(item, data);
|
return res == 0 ? ["未知", 0] : [res.label1, res.value];
|
});
|
option.refs?.setOption(opt);
|
},
|
resize() {
|
this.$nextTick(() => {
|
// let acTabs = this.acTabs;
|
// 交流配电柜遥测量
|
// if(acTabs == "acData") {
|
// this.$refs.acOneInputVol.resize();
|
// this.$refs.acOneInputCurr.resize();
|
// this.$refs.acTwoInputVol.resize();
|
// this.$refs.acTwoInputCurr.resize();
|
// this.$refs.acVolAlarmLimit.resize();
|
// this.$refs.acTemp.resize();
|
// }
|
// // 高频交流电源柜
|
// if(acTabs == 'acDcData') {
|
// this.$refs.acDcInputVol.resize();
|
// this.$refs.acDcOutputVol.resize();
|
// this.$refs.acDcOutputCurr.resize();
|
// this.$refs.acDcCurr.resize();
|
// this.$refs.acDcVol.resize();
|
// this.$refs.acDcModuleOutputCurr.resize();
|
// this.$refs.acDcVolAlarmLimit.resize();
|
// this.$refs.acDcTemp.resize();
|
// }
|
// // 直流配电柜
|
// if(acTabs == 'dcData') {
|
// this.$refs.dcInputVol.resize();
|
// this.$refs.dcOutputVol.resize();
|
// this.$refs.dcOutputCurr.resize();
|
// this.$refs.dcVolLimit.resize();
|
// this.$refs.dcTemp.resize();
|
// }
|
});
|
},
|
getItemByName(name, list) {
|
let result = 0;
|
for (let i = 0; i < list.length; i++) {
|
let item = list[i];
|
if (item.name == name) {
|
result = item;
|
}
|
}
|
return result;
|
},
|
getPowerDisplayConfigList() {
|
getPowerDisplayConfigList()
|
.then((res) => {
|
res = res.data;
|
let data = [];
|
if (res.code) {
|
data = res.data.list;
|
}
|
this.chartTypes = data;
|
})
|
.catch((error) => {
|
this.chartTypes = [];
|
console.log(error);
|
});
|
},
|
showChartConfigDialog(name) {
|
let chartType = this.getItemByName(name, this.chartTypes);
|
this.chartTypeConfig = chartType
|
? chartType
|
: { id: null, name: name, type: 0 };
|
this.$nextTick(() => {
|
this.chartDialog = true;
|
});
|
},
|
changeChartTypeSuccess() {
|
this.getPowerDisplayConfigList();
|
},
|
details(type) {
|
this.detailsType = type;
|
this.detailsTitle = this.titles[type];
|
this.detailsVisible = true;
|
},
|
refreshFN() {
|
// acTab acData acDcData dcData
|
let acTabs = this.$route.query.tab;
|
if (acTabs) {
|
this.acTabs = acTabs;
|
// this.$nextTick(() => {
|
// });
|
}
|
},
|
},
|
computed: {
|
// battFullName() {
|
// let batt = this.batt;
|
// if (batt.stationName && batt.battGroupName) {
|
// return batt.stationName + "-" + "通信电源";
|
// }
|
// return "电池组全称";
|
// },
|
},
|
mounted() {
|
// 获取电源信息
|
let powerDeviceId = this.$route.params.powerDeviceId * 1;
|
if (powerDeviceId) {
|
this.getPowerInfo(powerDeviceId);
|
}
|
|
// 设置配置项
|
this.setOption();
|
// 添加窗口自动缩放
|
window.addEventListener("resize", this.resize);
|
},
|
destroyed() {
|
// 添加窗口自动缩放
|
window.removeEventListener("resize", this.resize);
|
},
|
};
|
</script>
|
|
<style scoped>
|
.flex-page-content {
|
padding: 4px;
|
box-sizing: border-box;
|
text-align: center;
|
}
|
.flex-layout.el-tabs {
|
display: flex;
|
flex-direction: column;
|
height: 100%;
|
}
|
.el-tab-pane-content {
|
position: relative;
|
width: 100%;
|
height: 100%;
|
}
|
.el-tab-pane-wrapper {
|
position: absolute;
|
top: 0;
|
left: 0;
|
right: 0;
|
bottom: 0;
|
width: 100%;
|
height: 100%;
|
}
|
|
.box-tools {
|
font-size: 22px;
|
margin-right: 8px;
|
cursor: pointer;
|
color: #00fefe !important;
|
}
|
.top-box,
|
.bottom-box {
|
box-sizing: border-box;
|
}
|
.top-box {
|
padding-bottom: 8px;
|
}
|
.bottom-box {
|
padding-top: 8px;
|
padding-bottom: 8px;
|
}
|
.flex-box-tools-icon {
|
font-size: 20px;
|
cursor: pointer;
|
}
|
.flex-box-tools-icon:active {
|
color: #ff0000;
|
}
|
.page-content-tools {
|
position: absolute;
|
top: 12px;
|
right: 12px;
|
z-index: 99;
|
}
|
.status-text {
|
line-height: 32px;
|
white-space: nowrap;
|
font-size: 14px;
|
}
|
.btn-detail {
|
position: absolute;
|
top: 10px;
|
right: 10px;
|
z-index: 1;
|
}
|
.detail-content {
|
color: #fff;
|
display: flex;
|
justify-content: center;
|
padding: 8px;
|
background: #00253f;
|
height: 600px;
|
}
|
</style>
|
