Webinterface for battery
This commit is contained in:
MalteSchm
parent
59c84bcb85
commit
fa5b52210a
364
webapp/src/components/BatteryView.vue
Normal file
364
webapp/src/components/BatteryView.vue
Normal file
@ -0,0 +1,364 @@
|
|||||||
|
<template>
|
||||||
|
<div class="text-center" v-if="dataLoading">
|
||||||
|
<div class="spinner-border" role="status">
|
||||||
|
<span class="visually-hidden">Loading...</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<template v-else>
|
||||||
|
<div class="row gy-3">
|
||||||
|
<div class="tab-content col-sm-12 col-md-12" id="v-pills-tabContent">
|
||||||
|
<div class="card">
|
||||||
|
<div class="card-header d-flex justify-content-between align-items-center" :class="{
|
||||||
|
'text-bg-danger': batteryData.data_age > 20,
|
||||||
|
'text-bg-primary': batteryData.data_age < 20,
|
||||||
|
}">
|
||||||
|
<div class="p-1 flex-grow-1">
|
||||||
|
<div class="d-flex flex-wrap">
|
||||||
|
<div style="padding-right: 2em;">
|
||||||
|
{{ $t('battery.battery') }}: {{ batteryData.manufacturer }}
|
||||||
|
</div>
|
||||||
|
<div style="padding-right: 2em;">
|
||||||
|
{{ $t('battery.DataAge') }} {{ $t('battery.Seconds', { 'val': batteryData.data_age }) }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="card-body">
|
||||||
|
<div class="row flex-row flex-wrap align-items-start g-3">
|
||||||
|
<div class="col order-0">
|
||||||
|
<div class="card" :class="{ 'border-info': true }">
|
||||||
|
<div class="card-header bg-info">{{ $t('battery.Status') }}</div>
|
||||||
|
<div class="card-body">
|
||||||
|
<table class="table table-striped table-hover">
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<th scope="col">{{ $t('battery.Property') }}</th>
|
||||||
|
<th style="text-align: right" scope="col">{{ $t('battery.Value') }}</th>
|
||||||
|
<th scope="col">{{ $t('battery.Unit') }}</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
<tr>
|
||||||
|
<th scope="row">{{ $t('battery.stateOfCharge') }}</th>
|
||||||
|
<td style="text-align: right">{{ formatNumber(batteryData.stateOfCharge.v) }}</td>
|
||||||
|
<td>{{ batteryData.stateOfCharge.u }}</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<th scope="row">{{ $t('battery.stateOfHealth') }}</th>
|
||||||
|
<td style="text-align: right">{{ formatNumber(batteryData.stateOfHealth.v) }}</td>
|
||||||
|
<td>{{ batteryData.stateOfHealth.u }}</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<th scope="row">{{ $t('battery.voltage') }}</th>
|
||||||
|
<td style="text-align: right">{{ formatNumber(batteryData.voltage.v) }}</td>
|
||||||
|
<td>{{ batteryData.voltage.u }}</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<th scope="row">{{ $t('battery.current') }}</th>
|
||||||
|
<td style="text-align: right">{{ Math.round(batteryData.current.v) }}</td>
|
||||||
|
<td>{{ batteryData.current.u }}</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<th scope="row">{{ $t('battery.temperature') }}</th>
|
||||||
|
<td style="text-align: right">{{ batteryData.temperature.v }}</td>
|
||||||
|
<td>{{ batteryData.temperature.u }}</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<th scope="row">{{ $t('battery.chargeVoltage') }}</th>
|
||||||
|
<td style="text-align: right">{{ batteryData.chargeVoltage.v }}</td>
|
||||||
|
<td>{{ batteryData.chargeVoltage.u }}</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<th scope="row">{{ $t('battery.chargeCurrentLimitation') }}</th>
|
||||||
|
<td style="text-align: right">{{ batteryData.chargeCurrentLimitation.v }}</td>
|
||||||
|
<td>{{ batteryData.chargeCurrentLimitation.u }}</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<th scope="row">{{ $t('battery.dischargeCurrentLimitation') }}</th>
|
||||||
|
<td style="text-align: right">{{ batteryData.dischargeCurrentLimitation.v }}</td>
|
||||||
|
<td>{{ batteryData.dischargeCurrentLimitation.u }}</td>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col order-1">
|
||||||
|
<div class="card" :class="{ 'border-info': false }">
|
||||||
|
<div class="card-header bg-info">{{ $t('battery.warn_alarm') }}</div>
|
||||||
|
<div class="card-body">
|
||||||
|
<table class="table table-striped table-hover">
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<th scope="col">{{ $t('battery.Property') }}</th>
|
||||||
|
<th scope="col">{{ $t('battery.alarm') }}</th>
|
||||||
|
<th scope="col">{{ $t('battery.warning') }}</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
<tr>
|
||||||
|
<th scope="row">{{ $t('battery.dischargeCurrent') }}</th>
|
||||||
|
<td>
|
||||||
|
<span class="badge" :class="{
|
||||||
|
'text-bg-danger': batteryData.alarms.dischargeCurrent,
|
||||||
|
'text-bg-success': !batteryData.alarms.dischargeCurrent
|
||||||
|
}">
|
||||||
|
<template v-if="!batteryData.alarms.dischargeCurrent">{{ $t('battery.ok') }}</template>
|
||||||
|
<template v-else="batteryData.alarms.dischargeCurrent">{{ $t('battery.alarm') }}</template>
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
<td>
|
||||||
|
<span class="badge" :class="{
|
||||||
|
'text-bg-warning text-dark': batteryData.warnings.dischargeCurrent,
|
||||||
|
'text-bg-success': !batteryData.warnings.dischargeCurrent
|
||||||
|
}">
|
||||||
|
<template v-if="!batteryData.warnings.dischargeCurrent">{{ $t('battery.ok') }}</template>
|
||||||
|
<template v-else="batteryData.warnings.dischargeCurrent">{{ $t('battery.warning') }}</template>
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<th scope="row">{{ $t('battery.chargeCurrent') }}</th>
|
||||||
|
<td>
|
||||||
|
<span class="badge" :class="{
|
||||||
|
'text-bg-danger': batteryData.alarms.chargeCurrent,
|
||||||
|
'text-bg-success': !batteryData.alarms.chargeCurrent
|
||||||
|
}">
|
||||||
|
<template v-if="!batteryData.alarms.chargeCurrent">{{ $t('battery.ok') }}</template>
|
||||||
|
<template v-else="batteryData.alarms.chargeCurrent">{{ $t('battery.alarm') }}</template>
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
<td>
|
||||||
|
<span class="badge" :class="{
|
||||||
|
'text-bg-warning text-dark': batteryData.warnings.chargeCurrent,
|
||||||
|
'text-bg-success': !batteryData.warnings.chargeCurrent
|
||||||
|
}">
|
||||||
|
<template v-if="!batteryData.warnings.chargeCurrent">{{ $t('battery.ok') }}</template>
|
||||||
|
<template v-else="batteryData.warnings.chargeCurrent">{{ $t('battery.warning') }}</template>
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<th scope="row">{{ $t('battery.lowTemperature') }}</th>
|
||||||
|
<td>
|
||||||
|
<span class="badge" :class="{
|
||||||
|
'text-bg-danger': batteryData.alarms.lowTemperature,
|
||||||
|
'text-bg-success': !batteryData.alarms.lowTemperature
|
||||||
|
}">
|
||||||
|
<template v-if="!batteryData.alarms.lowTemperature">{{ $t('battery.ok') }}</template>
|
||||||
|
<template v-else="batteryData.alarms.lowTemperature">{{ $t('battery.alarm') }}</template>
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
<td>
|
||||||
|
<span class="badge" :class="{
|
||||||
|
'text-bg-warning text-dark': batteryData.warnings.lowTemperature,
|
||||||
|
'text-bg-success': !batteryData.warnings.lowTemperature
|
||||||
|
}">
|
||||||
|
<template v-if="!batteryData.warnings.lowTemperature">{{ $t('battery.ok') }}</template>
|
||||||
|
<template v-else="batteryData.warnings.lowTemperature">{{ $t('battery.warning') }}</template>
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<th scope="row">{{ $t('battery.highTemperature') }}</th>
|
||||||
|
<td>
|
||||||
|
<span class="badge" :class="{
|
||||||
|
'text-bg-danger': batteryData.alarms.highTemperature,
|
||||||
|
'text-bg-success': !batteryData.alarms.highTemperature
|
||||||
|
}">
|
||||||
|
<template v-if="!batteryData.alarms.highTemperature">{{ $t('battery.ok') }}</template>
|
||||||
|
<template v-else="batteryData.alarms.highTemperature">{{ $t('battery.alarm') }}</template>
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
<td>
|
||||||
|
<span class="badge" :class="{
|
||||||
|
'text-bg-warning text-dark': batteryData.warnings.highTemperature,
|
||||||
|
'text-bg-success': !batteryData.warnings.highTemperature
|
||||||
|
}">
|
||||||
|
<template v-if="!batteryData.warnings.highTemperature">{{ $t('battery.ok') }}</template>
|
||||||
|
<template v-else="batteryData.warnings.highTemperature">{{ $t('battery.warning') }}</template>
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<th scope="row">{{ $t('battery.lowVoltage') }}</th>
|
||||||
|
<td>
|
||||||
|
<span class="badge" :class="{
|
||||||
|
'text-bg-danger': batteryData.alarms.lowVoltage,
|
||||||
|
'text-bg-success': !batteryData.alarms.lowVoltage
|
||||||
|
}">
|
||||||
|
<template v-if="!batteryData.alarms.lowVoltage">{{ $t('battery.ok') }}</template>
|
||||||
|
<template v-else="batteryData.alarms.lowVoltage">{{ $t('battery.alarm') }}</template>
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
<td>
|
||||||
|
<span class="badge" :class="{
|
||||||
|
'text-bg-warning text-dark': batteryData.warnings.lowVoltage,
|
||||||
|
'text-bg-success': !batteryData.warnings.lowVoltage
|
||||||
|
}">
|
||||||
|
<template v-if="!batteryData.warnings.lowVoltage">{{ $t('battery.ok') }}</template>
|
||||||
|
<template v-else="batteryData.warnings.lowVoltage">{{ $t('battery.warning') }}</template>
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<th scope="row">{{ $t('battery.highVoltage') }}</th>
|
||||||
|
<td>
|
||||||
|
<span class="badge" :class="{
|
||||||
|
'text-bg-danger': batteryData.alarms.highVoltage,
|
||||||
|
'text-bg-success': !batteryData.alarms.highVoltage
|
||||||
|
}">
|
||||||
|
<template v-if="!batteryData.alarms.highVoltage">{{ $t('battery.ok') }}</template>
|
||||||
|
<template v-else="batteryData.alarms.highVoltage">{{ $t('battery.alarm') }}</template>
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
<td>
|
||||||
|
<span class="badge" :class="{
|
||||||
|
'text-bg-warning text-dark': batteryData.warnings.highVoltage,
|
||||||
|
'text-bg-success': !batteryData.warnings.highVoltage
|
||||||
|
}">
|
||||||
|
<template v-if="!batteryData.warnings.highVoltage">{{ $t('battery.ok') }}</template>
|
||||||
|
<template v-else="batteryData.warnings.highVoltage">{{ $t('battery.warning') }}</template>
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<th scope="row">{{ $t('battery.bmsInternal') }}</th>
|
||||||
|
<td>
|
||||||
|
<span class="badge" :class="{
|
||||||
|
'text-bg-danger': batteryData.alarms.bmsInternal,
|
||||||
|
'text-bg-success': !batteryData.alarms.bmsInternal
|
||||||
|
}">
|
||||||
|
<template v-if="!batteryData.alarms.bmsInternal">{{ $t('battery.ok') }}</template>
|
||||||
|
<template v-else="batteryData.alarms.bmsInternal">{{ $t('battery.alarm') }}</template>
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
<td>
|
||||||
|
<span class="badge" :class="{
|
||||||
|
'text-bg-warning text-dark': batteryData.warnings.bmsInternal,
|
||||||
|
'text-bg-success': !batteryData.warnings.bmsInternal
|
||||||
|
}">
|
||||||
|
<template v-if="!batteryData.warnings.bmsInternal">{{ $t('battery.ok') }}</template>
|
||||||
|
<template v-else="batteryData.warnings.bmsInternal">{{ $t('battery.warning') }}</template>
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</template>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script lang="ts">
|
||||||
|
import { defineComponent } from 'vue';
|
||||||
|
import type { Battery } from '@/types/BatteryDataStatus';
|
||||||
|
import { handleResponse, authHeader, authUrl } from '@/utils/authentication';
|
||||||
|
|
||||||
|
export default defineComponent({
|
||||||
|
components: {
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
socket: {} as WebSocket,
|
||||||
|
heartInterval: 0,
|
||||||
|
dataAgeInterval: 0,
|
||||||
|
dataLoading: true,
|
||||||
|
batteryData: {} as Battery,
|
||||||
|
isFirstFetchAfterConnect: true,
|
||||||
|
|
||||||
|
alertMessageLimit: "",
|
||||||
|
alertTypeLimit: "info",
|
||||||
|
showAlertLimit: false,
|
||||||
|
checked: false,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.getInitialData();
|
||||||
|
this.initSocket();
|
||||||
|
this.initDataAgeing();
|
||||||
|
},
|
||||||
|
unmounted() {
|
||||||
|
this.closeSocket();
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
getInitialData() {
|
||||||
|
console.log("Get initalData for Battery");
|
||||||
|
this.dataLoading = true;
|
||||||
|
|
||||||
|
fetch("/api/battery/livedata", { headers: authHeader() })
|
||||||
|
.then((response) => handleResponse(response, this.$emitter, this.$router))
|
||||||
|
.then((data) => {
|
||||||
|
this.batteryData = data;
|
||||||
|
this.dataLoading = false;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
initSocket() {
|
||||||
|
console.log("Starting connection to Battery WebSocket Server");
|
||||||
|
|
||||||
|
const { protocol, host } = location;
|
||||||
|
const authString = authUrl();
|
||||||
|
const webSocketUrl = `${protocol === "https:" ? "wss" : "ws"
|
||||||
|
}://${authString}${host}/batterylivedata`;
|
||||||
|
|
||||||
|
this.socket = new WebSocket(webSocketUrl);
|
||||||
|
|
||||||
|
this.socket.onmessage = (event) => {
|
||||||
|
console.log(event);
|
||||||
|
this.batteryData = JSON.parse(event.data);
|
||||||
|
this.dataLoading = false;
|
||||||
|
this.heartCheck(); // Reset heartbeat detection
|
||||||
|
};
|
||||||
|
|
||||||
|
this.socket.onopen = function (event) {
|
||||||
|
console.log(event);
|
||||||
|
console.log("Successfully connected to the Battery websocket server...");
|
||||||
|
};
|
||||||
|
|
||||||
|
// Listen to window events , When the window closes , Take the initiative to disconnect websocket Connect
|
||||||
|
window.onbeforeunload = () => {
|
||||||
|
this.closeSocket();
|
||||||
|
};
|
||||||
|
},
|
||||||
|
initDataAgeing() {
|
||||||
|
this.dataAgeInterval = setInterval(() => {
|
||||||
|
if (this.batteryData) {
|
||||||
|
this.batteryData.data_age++;
|
||||||
|
}
|
||||||
|
}, 1000);
|
||||||
|
},
|
||||||
|
// Send heartbeat packets regularly * 59s Send a heartbeat
|
||||||
|
heartCheck() {
|
||||||
|
this.heartInterval && clearTimeout(this.heartInterval);
|
||||||
|
this.heartInterval = setInterval(() => {
|
||||||
|
if (this.socket.readyState === 1) {
|
||||||
|
// Connection status
|
||||||
|
this.socket.send("ping");
|
||||||
|
} else {
|
||||||
|
this.initSocket(); // Breakpoint reconnection 5 Time
|
||||||
|
}
|
||||||
|
}, 59 * 1000);
|
||||||
|
},
|
||||||
|
/** To break off websocket Connect */
|
||||||
|
closeSocket() {
|
||||||
|
this.socket.close();
|
||||||
|
this.heartInterval && clearTimeout(this.heartInterval);
|
||||||
|
this.isFirstFetchAfterConnect = true;
|
||||||
|
},
|
||||||
|
formatNumber(num: number) {
|
||||||
|
return new Intl.NumberFormat(
|
||||||
|
undefined, { minimumFractionDigits: 2, maximumFractionDigits: 2 }
|
||||||
|
).format(num);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
});
|
||||||
|
</script>
|
||||||
@ -10,6 +10,7 @@
|
|||||||
"DTUSettings": "DTU",
|
"DTUSettings": "DTU",
|
||||||
"DeviceManager": "Hardware",
|
"DeviceManager": "Hardware",
|
||||||
"VedirectSettings": "Ve.direct",
|
"VedirectSettings": "Ve.direct",
|
||||||
|
"PowerMeterSettings": "Power Meter",
|
||||||
"BatterySettings": "Batterie",
|
"BatterySettings": "Batterie",
|
||||||
"AcChargerSettings": "AC Ladegerät",
|
"AcChargerSettings": "AC Ladegerät",
|
||||||
"ConfigManagement": "Konfigurationsverwaltung",
|
"ConfigManagement": "Konfigurationsverwaltung",
|
||||||
@ -666,5 +667,33 @@
|
|||||||
"EnableHuawei": "Huawei R4850G2 an CAN Bus Interface aktiv",
|
"EnableHuawei": "Huawei R4850G2 an CAN Bus Interface aktiv",
|
||||||
"Seconds": "@:dtuadmin.Seconds",
|
"Seconds": "@:dtuadmin.Seconds",
|
||||||
"Save": "@:dtuadmin.Save"
|
"Save": "@:dtuadmin.Save"
|
||||||
|
},
|
||||||
|
"battery": {
|
||||||
|
"battery": "Batterie",
|
||||||
|
"DataAge": "letzte Aktualisierung: ",
|
||||||
|
"Seconds": "vor {val} Sekunden",
|
||||||
|
"Status": "Status",
|
||||||
|
"Property": "Eigenschaft",
|
||||||
|
"Value": "Wert",
|
||||||
|
"Unit": "Einheit",
|
||||||
|
"stateOfCharge": "Ladezustand (SOC)",
|
||||||
|
"stateOfHealth": "Batteriezustand (SOH)",
|
||||||
|
"voltage": "Spannung",
|
||||||
|
"current": "Strom",
|
||||||
|
"temperature": "Temperatur",
|
||||||
|
"chargeVoltage": "Gewünschte Ladespannung (BMS)",
|
||||||
|
"chargeCurrentLimitation": "Ladestromlimit",
|
||||||
|
"dischargeCurrentLimitation": "Entladestromlimit",
|
||||||
|
"warn_alarm": "Warnungen und Alarme",
|
||||||
|
"ok": "OK",
|
||||||
|
"alarm": "Alarm",
|
||||||
|
"warning": "Warnung",
|
||||||
|
"dischargeCurrent": "Entladestrom",
|
||||||
|
"chargeCurrent": "Ladestrom",
|
||||||
|
"lowTemperature": "Temperatur niedrig",
|
||||||
|
"highTemperature": "Temperatur hoch",
|
||||||
|
"lowVoltage": "Spannung niedrig",
|
||||||
|
"highVoltage": "Spannung hoch",
|
||||||
|
"bmsInternal": "BMS intern"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -671,5 +671,33 @@
|
|||||||
"EnableHuawei": "Enable Huawei R4850G2 on CAN Bus Interface",
|
"EnableHuawei": "Enable Huawei R4850G2 on CAN Bus Interface",
|
||||||
"Seconds": "@:dtuadmin.Seconds",
|
"Seconds": "@:dtuadmin.Seconds",
|
||||||
"Save": "@:dtuadmin.Save"
|
"Save": "@:dtuadmin.Save"
|
||||||
|
},
|
||||||
|
"battery": {
|
||||||
|
"battery": "battery",
|
||||||
|
"DataAge": "Data Age: ",
|
||||||
|
"Seconds": " {val} seconds",
|
||||||
|
"Status": "Status",
|
||||||
|
"Property": "Property",
|
||||||
|
"Value": "Value",
|
||||||
|
"Unit": "Unit",
|
||||||
|
"stateOfCharge": "State of charge",
|
||||||
|
"stateOfHealth": "State of health",
|
||||||
|
"voltage": "Voltage",
|
||||||
|
"current": "Current",
|
||||||
|
"temperature": "Temperature",
|
||||||
|
"chargeVoltage": "Requested charge voltage",
|
||||||
|
"chargeCurrentLimitation": "Charge current limit",
|
||||||
|
"dischargeCurrentLimitation": "Discharge current limit",
|
||||||
|
"warn_alarm": "Alarms and warnings",
|
||||||
|
"ok": "OK",
|
||||||
|
"alarm": "Alarm",
|
||||||
|
"warning": "Warning",
|
||||||
|
"dischargeCurrent": "Discharge current",
|
||||||
|
"chargeCurrent": "Charge current",
|
||||||
|
"lowTemperature": "Low temperature",
|
||||||
|
"highTemperature": "High temperature",
|
||||||
|
"lowVoltage": "Low voltage",
|
||||||
|
"highVoltage": "High voltage",
|
||||||
|
"bmsInternal": "BMS internal"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -10,6 +10,7 @@
|
|||||||
"DTUSettings": "DTU",
|
"DTUSettings": "DTU",
|
||||||
"DeviceManager": "Périphériques",
|
"DeviceManager": "Périphériques",
|
||||||
"VedirectSettings": "Ve.direct",
|
"VedirectSettings": "Ve.direct",
|
||||||
|
"PowerMeterSettings": "Power Meter",
|
||||||
"BatterySettings": "Battery",
|
"BatterySettings": "Battery",
|
||||||
"AcChargerSettings": "AC Charger",
|
"AcChargerSettings": "AC Charger",
|
||||||
"ConfigManagement": "Gestion de la configuration",
|
"ConfigManagement": "Gestion de la configuration",
|
||||||
@ -608,5 +609,33 @@
|
|||||||
"EnableHuawei": "Enable Huawei R4850G2 on CAN Bus Interface",
|
"EnableHuawei": "Enable Huawei R4850G2 on CAN Bus Interface",
|
||||||
"Seconds": "@:dtuadmin.Seconds",
|
"Seconds": "@:dtuadmin.Seconds",
|
||||||
"Save": "@:dtuadmin.Save"
|
"Save": "@:dtuadmin.Save"
|
||||||
|
},
|
||||||
|
"battery": {
|
||||||
|
"battery": "battery",
|
||||||
|
"DataAge": "Data Age: ",
|
||||||
|
"Seconds": " {val} seconds",
|
||||||
|
"Status": "Status",
|
||||||
|
"Property": "Property",
|
||||||
|
"Value": "Value",
|
||||||
|
"Unit": "Unit",
|
||||||
|
"stateOfCharge": "State of charge",
|
||||||
|
"stateOfHealth": "State of health",
|
||||||
|
"voltage": "Voltage",
|
||||||
|
"current": "Current",
|
||||||
|
"temperature": "Temperature",
|
||||||
|
"chargeVoltage": "Requested charge voltage",
|
||||||
|
"chargeCurrentLimitation": "Charge current limit",
|
||||||
|
"dischargeCurrentLimitation": "Discharge current limit",
|
||||||
|
"warn_alarm": "Alarms and warnings",
|
||||||
|
"ok": "OK",
|
||||||
|
"alarm": "Alarm",
|
||||||
|
"warning": "Warning",
|
||||||
|
"dischargeCurrent": "Discharge current",
|
||||||
|
"chargeCurrent": "Charge current",
|
||||||
|
"lowTemperature": "Low temperature",
|
||||||
|
"highTemperature": "High temperature",
|
||||||
|
"lowVoltage": "Low voltage",
|
||||||
|
"highVoltage": "High voltage",
|
||||||
|
"bmsInternal": "BMS internal"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
32
webapp/src/types/BatteryDataStatus.ts
Normal file
32
webapp/src/types/BatteryDataStatus.ts
Normal file
@ -0,0 +1,32 @@
|
|||||||
|
import type { ValueObject } from '@/types/LiveDataStatus';
|
||||||
|
|
||||||
|
interface flags {
|
||||||
|
dischargeCurrent: boolean;
|
||||||
|
chargeCurrent: boolean;
|
||||||
|
lowTemperature: boolean;
|
||||||
|
highTemperature: boolean;
|
||||||
|
lowVoltage: boolean;
|
||||||
|
highVoltage: boolean;
|
||||||
|
bmsInternal: boolean;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// Battery
|
||||||
|
export interface Battery {
|
||||||
|
data_age: 0;
|
||||||
|
chargeVoltage: ValueObject;
|
||||||
|
chargeCurrentLimitation: ValueObject;
|
||||||
|
dischargeCurrentLimitation: ValueObject;
|
||||||
|
stateOfCharge: ValueObject;
|
||||||
|
stateOfChargeLastUpdate: ValueObject;
|
||||||
|
stateOfHealth: ValueObject;
|
||||||
|
voltage: ValueObject;
|
||||||
|
current: ValueObject;
|
||||||
|
temperature: ValueObject;
|
||||||
|
warnings: flags;
|
||||||
|
alarms: flags;
|
||||||
|
manufacturer: string;
|
||||||
|
chargeEnabled: boolean;
|
||||||
|
dischargeEnabled: boolean;
|
||||||
|
chargeImmediately: boolean;
|
||||||
|
}
|
||||||
@ -54,10 +54,15 @@ export interface Huawei {
|
|||||||
enabled: boolean;
|
enabled: boolean;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export interface Battery {
|
||||||
|
enabled: boolean;
|
||||||
|
}
|
||||||
|
|
||||||
export interface LiveData {
|
export interface LiveData {
|
||||||
inverters: Inverter[];
|
inverters: Inverter[];
|
||||||
total: Total;
|
total: Total;
|
||||||
hints: Hints;
|
hints: Hints;
|
||||||
vedirect: Vedirect;
|
vedirect: Vedirect;
|
||||||
huawei: Huawei;
|
huawei: Huawei;
|
||||||
|
battery: Battery;
|
||||||
}
|
}
|
||||||
|
|||||||
@ -114,6 +114,9 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<VedirectView v-show="liveData.vedirect.enabled" />
|
<VedirectView v-show="liveData.vedirect.enabled" />
|
||||||
|
<div v-show="liveData.battery.enabled" >
|
||||||
|
<BatteryView/>
|
||||||
|
</div>
|
||||||
<div v-show="liveData.huawei.enabled" >
|
<div v-show="liveData.huawei.enabled" >
|
||||||
<HuaweiView/>
|
<HuaweiView/>
|
||||||
</div>
|
</div>
|
||||||
@ -329,6 +332,7 @@ import InverterChannelInfo from "@/components/InverterChannelInfo.vue";
|
|||||||
import InverterTotalInfo from '@/components/InverterTotalInfo.vue';
|
import InverterTotalInfo from '@/components/InverterTotalInfo.vue';
|
||||||
import VedirectView from '@/components/VedirectView.vue';
|
import VedirectView from '@/components/VedirectView.vue';
|
||||||
import HuaweiView from '@/components/HuaweiView.vue'
|
import HuaweiView from '@/components/HuaweiView.vue'
|
||||||
|
import BatteryView from '@/components/BatteryView.vue'
|
||||||
import type { DevInfoStatus } from '@/types/DevInfoStatus';
|
import type { DevInfoStatus } from '@/types/DevInfoStatus';
|
||||||
import type { EventlogItems } from '@/types/EventlogStatus';
|
import type { EventlogItems } from '@/types/EventlogStatus';
|
||||||
import type { LimitConfig } from '@/types/LimitConfig';
|
import type { LimitConfig } from '@/types/LimitConfig';
|
||||||
@ -370,7 +374,8 @@ export default defineComponent({
|
|||||||
BIconToggleOn,
|
BIconToggleOn,
|
||||||
BIconXCircleFill,
|
BIconXCircleFill,
|
||||||
VedirectView,
|
VedirectView,
|
||||||
HuaweiView
|
HuaweiView,
|
||||||
|
BatteryView
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
|||||||
@ -52,20 +52,20 @@ export default defineConfig({
|
|||||||
server: {
|
server: {
|
||||||
proxy: {
|
proxy: {
|
||||||
'^/api': {
|
'^/api': {
|
||||||
target: 'http://192.168.178.78/'
|
target: 'http://192.168.178.151/'
|
||||||
},
|
},
|
||||||
'^/livedata': {
|
'^/livedata': {
|
||||||
target: 'ws://192.168.178.78/',
|
target: 'ws://192.168.178.151/',
|
||||||
ws: true,
|
ws: true,
|
||||||
changeOrigin: true
|
changeOrigin: true
|
||||||
},
|
},
|
||||||
'^/vedirectlivedata': {
|
'^/vedirectlivedata': {
|
||||||
target: 'ws://192.168.178.78/',
|
target: 'ws://192.168.178.151/',
|
||||||
ws: true,
|
ws: true,
|
||||||
changeOrigin: true
|
changeOrigin: true
|
||||||
},
|
},
|
||||||
'^/console': {
|
'^/console': {
|
||||||
target: 'ws://192.168.20.110/',
|
target: 'ws://192.168.178.151/',
|
||||||
ws: true,
|
ws: true,
|
||||||
changeOrigin: true
|
changeOrigin: true
|
||||||
}
|
}
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user