updated files for correct data getting
This commit is contained in:
parent
fd98afafb6
commit
c355bc8f7d
|
@ -5,7 +5,7 @@
|
||||||
<v-expansion-panel>
|
<v-expansion-panel>
|
||||||
<v-expansion-panel-title>
|
<v-expansion-panel-title>
|
||||||
<div class="d-flex justify-content-between align-items-center">
|
<div class="d-flex justify-content-between align-items-center">
|
||||||
<div class="mr-3" v-if="sensorData?.voltage">
|
<div class="mr-3" v-if="latestSensorData?.voltage">
|
||||||
Name: {{ node.id }} (Status: online)
|
Name: {{ node.id }} (Status: online)
|
||||||
</div>
|
</div>
|
||||||
<div class="mr-3" v-else>
|
<div class="mr-3" v-else>
|
||||||
|
@ -22,15 +22,15 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="d-flex align-items-center mb-2">
|
<div class="d-flex align-items-center mb-2">
|
||||||
<span class="mr-2">Temperature:</span>
|
<span class="mr-2">Temperature:</span>
|
||||||
<span>{{ sensorData?.temperature !== undefined ? sensorData.temperature : 'NaN' }}°C</span>
|
<span>{{ latestSensorData?.temperature !== undefined ? latestSensorData.temperature : 'NaN' }}°C</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="d-flex align-items-center mb-2">
|
<div class="d-flex align-items-center mb-2">
|
||||||
<span class="mr-2">Battery Voltage:</span>
|
<span class="mr-2">Battery Voltage:</span>
|
||||||
<span>{{ sensorData?.voltage || 'N/A' }}V</span>
|
<span>{{ latestSensorData?.voltage || 'N/A' }}V</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="d-flex align-items-center mb-2">
|
<div class="d-flex align-items-center mb-2">
|
||||||
<span class="mr-2">Runtime:</span>
|
<span class="mr-2">Runtime:</span>
|
||||||
<span>{{ sensorData?.uptime ? (sensorData.uptime / 3600).toFixed(2) + ' hours' : 'N/A' }}</span>
|
<span>{{ latestSensorData?.uptime ? (latestSensorData.uptime / 3600).toFixed(2) + ' hours' : 'N/A' }}</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</v-expansion-panel-text>
|
</v-expansion-panel-text>
|
||||||
|
@ -42,13 +42,13 @@
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { Node, SensorData } from "@/types";
|
import { Node, SensorData } from "@/types";
|
||||||
import { ComputedRef, inject, ref, watch, onMounted } from "vue";
|
import { ComputedRef, inject, ref, watch, onMounted, computed } from "vue";
|
||||||
import { key } from "@/store";
|
import { key } from "@/store";
|
||||||
import axios from "axios";
|
import axios from "axios";
|
||||||
|
|
||||||
const props = defineProps<{ node: Node }>();
|
const props = defineProps<{ node: Node }>();
|
||||||
const visible = ref(true);
|
const visible = ref(true);
|
||||||
const sensorData = ref<SensorData | null>(null);
|
const sensorDataArray = ref<SensorData[]>([]);
|
||||||
|
|
||||||
const { searching, visibleIds } = inject(key) as {
|
const { searching, visibleIds } = inject(key) as {
|
||||||
searching: ComputedRef<boolean>;
|
searching: ComputedRef<boolean>;
|
||||||
|
@ -61,11 +61,18 @@ watch([searching, visibleIds], ([searching, visibleIds]) => {
|
||||||
|
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
try {
|
try {
|
||||||
const { data } = await axios.get<SensorData>(
|
const { data } = await axios.get<SensorData[]>(
|
||||||
`http://localhost:8080/api/v1/data?id=${props.node.id}`
|
`http://localhost:8080/api/v1/data?id=${props.node.id}`
|
||||||
);
|
);
|
||||||
sensorData.value = data;
|
sensorDataArray.value = data;
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error("Error fetching sensor data:", error);
|
console.error("Error fetching sensor data:", error);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
const latestSensorData = computed(() => {
|
||||||
|
return sensorDataArray.value.length > 0
|
||||||
|
? sensorDataArray.value[sensorDataArray.value.length - 1]
|
||||||
|
: null;
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
|
@ -16,8 +16,8 @@
|
||||||
<tr v-for="(node, index) in tableData" :key="index">
|
<tr v-for="(node, index) in tableData" :key="index">
|
||||||
<td>{{ node.id }}</td>
|
<td>{{ node.id }}</td>
|
||||||
<td>
|
<td>
|
||||||
<span :class="node.sensorData.voltage !== 'N/A' ? 'status-online' : 'status-offline'">
|
<span :class="getLastSensorData(node)?.voltage !== 'N/A' ? 'status-online' : 'status-offline'">
|
||||||
{{ node.sensorData.voltage !== 'N/A' ? 'ONLINE' : 'OFFLINE' }}
|
{{ getLastSensorData(node)?.voltage !== 'N/A' ? 'ONLINE' : 'OFFLINE' }}
|
||||||
</span>
|
</span>
|
||||||
</td>
|
</td>
|
||||||
<td
|
<td
|
||||||
|
@ -28,9 +28,9 @@
|
||||||
contenteditable="true"
|
contenteditable="true"
|
||||||
@blur="validateAndUpdateLatLng(node, 'coord_lo', $event)"
|
@blur="validateAndUpdateLatLng(node, 'coord_lo', $event)"
|
||||||
>{{ node.coord_lo }}</td>
|
>{{ node.coord_lo }}</td>
|
||||||
<td>{{ calculateBatteryPercentage(node.sensorData.voltage, node.battery_minimum, node.battery_maximum) }}%</td>
|
<td>{{ calculateBatteryPercentage(getLastSensorData(node)?.voltage, node.battery_minimum, node.battery_maximum) }}%</td>
|
||||||
<td>{{ node.sensorData.temperature }}°C</td>
|
<td>{{ getLastSensorData(node)?.temperature }}°C</td>
|
||||||
<td>{{ formatRuntime(node.sensorData.uptime) }}</td>
|
<td>{{ formatRuntime(getLastSensorData(node)?.uptime) }}</td>
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
|
@ -75,6 +75,11 @@ export default {
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error('Error fetching node or sensor data:', error);
|
console.error('Error fetching node or sensor data:', error);
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
getLastSensorData(node) {
|
||||||
|
return node.sensorData && node.sensorData.length > 0
|
||||||
|
? node.sensorData[node.sensorData.length - 1]
|
||||||
|
: { temperature: 'N/A', voltage: 'N/A', uptime: 'N/A'};
|
||||||
},
|
},
|
||||||
calculateBatteryPercentage(voltage, batteryMinimum, batteryMaximum) {
|
calculateBatteryPercentage(voltage, batteryMinimum, batteryMaximum) {
|
||||||
if (voltage <= batteryMinimum) {
|
if (voltage <= batteryMinimum) {
|
||||||
|
|
Loading…
Reference in a new issue