webapp: create interface for LimitStatus

This commit is contained in:
Thomas Basler 2022-10-18 22:18:43 +02:00
parent fede8e21cb
commit 03f73796d2
2 changed files with 27 additions and 17 deletions

View File

@ -0,0 +1,5 @@
export interface LimitStatus {
limit_relative: number,
max_power: number,
limit_set_status: string,
}

View File

@ -179,12 +179,12 @@
<div class="col-sm-4"> <div class="col-sm-4">
<div class="input-group"> <div class="input-group">
<input type="number" class="form-control" id="inputCurrentLimit" <input type="number" class="form-control" id="inputCurrentLimit"
aria-describedby="currentLimitType" v-model="currentLimit" disabled /> aria-describedby="currentLimitType" v-model="currentLimitRelative" disabled />
<span class="input-group-text" id="currentLimitType">%</span> <span class="input-group-text" id="currentLimitType">%</span>
</div> </div>
</div> </div>
<div class="col-sm-4" v-if="maxPower > 0"> <div class="col-sm-4" v-if="currentLimitList.max_power > 0">
<div class="input-group"> <div class="input-group">
<input type="number" class="form-control" id="inputCurrentLimitAbsolute" <input type="number" class="form-control" id="inputCurrentLimitAbsolute"
aria-describedby="currentLimitTypeAbsolute" v-model="currentLimitAbsolute" aria-describedby="currentLimitTypeAbsolute" v-model="currentLimitAbsolute"
@ -199,12 +199,12 @@
Status:</label> Status:</label>
<div class="col-sm-9"> <div class="col-sm-9">
<span class="badge" :class="{ <span class="badge" :class="{
'bg-danger': successCommandLimit == 'Failure', 'bg-danger': currentLimitList.limit_set_status == 'Failure',
'bg-warning': successCommandLimit == 'Pending', 'bg-warning': currentLimitList.limit_set_status == 'Pending',
'bg-success': successCommandLimit == 'Ok', 'bg-success': currentLimitList.limit_set_status == 'Ok',
'bg-secondary': successCommandLimit == 'Unknown', 'bg-secondary': currentLimitList.limit_set_status == 'Unknown',
}"> }">
{{ successCommandLimit }} {{ currentLimitList.limit_set_status }}
</span> </span>
</div> </div>
</div> </div>
@ -331,6 +331,7 @@ import InverterChannelInfo from "@/components/InverterChannelInfo.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 { Inverters } from '@/types/LiveDataStatus'; import type { Inverters } from '@/types/LiveDataStatus';
import type { LimitStatus } from '@/types/LimitStatus';
export default defineComponent({ export default defineComponent({
components: { components: {
@ -369,10 +370,8 @@ export default defineComponent({
limitSettingSerial: 0, limitSettingSerial: 0,
limitSettingLoading: true, limitSettingLoading: true,
currentLimit: 0, currentLimitList: {} as LimitStatus,
currentLimitAbsolute: 0,
successCommandLimit: "",
maxPower: 0,
targetLimit: 0, targetLimit: 0,
targetLimitMin: 10, targetLimitMin: 10,
targetLimitMax: 100, targetLimitMax: 100,
@ -424,6 +423,17 @@ export default defineComponent({
} }
} }
}, },
computed: {
currentLimitAbsolute(): number {
if (this.currentLimitList.max_power > 0) {
return Number((this.currentLimitList.limit_relative * this.currentLimitList.max_power / 100).toFixed(1));
}
return 0;
},
currentLimitRelative(): number {
return Number((this.currentLimitList.limit_relative).toFixed(1));
}
},
methods: { methods: {
getInitialData() { getInitialData() {
this.dataLoading = true; this.dataLoading = true;
@ -525,12 +535,7 @@ export default defineComponent({
fetch("/api/limit/status") fetch("/api/limit/status")
.then((response) => response.json()) .then((response) => response.json())
.then((data) => { .then((data) => {
this.maxPower = data[serial].max_power; this.currentLimitList = data[serial];
this.currentLimit = Number((data[serial].limit_relative).toFixed(1));
if (this.maxPower > 0) {
this.currentLimitAbsolute = Number((this.currentLimit * this.maxPower / 100).toFixed(1));
}
this.successCommandLimit = data[serial].limit_set_status;
this.limitSettingSerial = serial; this.limitSettingSerial = serial;
this.limitSettingLoading = false; this.limitSettingLoading = false;
}); });