diff --git a/webapp/frontend/src/components/NodeInfo.vue b/webapp/frontend/src/components/NodeInfo.vue
index 8cc9479..8ba60a5 100644
--- a/webapp/frontend/src/components/NodeInfo.vue
+++ b/webapp/frontend/src/components/NodeInfo.vue
@@ -4,20 +4,24 @@ import moment from 'moment';
import { Chart } from 'chart.js';
import 'chartjs-adapter-moment';
import { onMounted, useTemplateRef, ref, watch } from 'vue';
-import { state } from '../store.js';
-import { environmentMetricsTimeRange, powerMetricsTimeRange, deviceMetricsTimeRange } from '../config.js';
-import DeviceMetricsChart from './NodeInfo/DeviceMetricsChart.vue';
-import PowerMetricsChart from './NodeInfo/PowerMetricsChart.vue';
-import EnvironmentMetricsChart from './NodeInfo/EnvironmentMetricsChart.vue';
-import LoraConfig from './NodeInfo/LoraConfig.vue';
-import NodeDetails from './NodeInfo/NodeDetails.vue';
-import MqttHistory from './NodeInfo/MqttHistory.vue';
-import OtherInfo from './NodeInfo/OtherInfo.vue';
-import Share from './NodeInfo/Share.vue';
-import Traceroutes from './NodeInfo/Traceroutes.vue';
-import Position from './NodeInfo/Position.vue';
-import { getNodeColor, getNodeTextColor, copyShareLinkForNode, getTimeSpan, buildPath } from '../utils.js';
+import { state } from '@/store';
+import DeviceMetricsChart from '@/components/NodeInfo/DeviceMetricsChart.vue';
+import PowerMetricsChart from '@/components/NodeInfo/PowerMetricsChart.vue';
+import EnvironmentMetricsChart from '@/components/NodeInfo/EnvironmentMetricsChart.vue';
+import LoraConfig from '@/components/NodeInfo/LoraConfig.vue';
+import NodeDetails from '@/components/NodeInfo/NodeDetails.vue';
+import MqttHistory from '@/components/NodeInfo/MqttHistory.vue';
+import OtherInfo from '@/components/NodeInfo/OtherInfo.vue';
+import Share from '@/components/NodeInfo/Share.vue';
+import Traceroutes from '@/components/NodeInfo/Traceroutes.vue';
+import Position from '@/components/NodeInfo/Position.vue';
+import { useMapStore } from '@/stores/mapStore';
+import { copyShareLinkForNode, getTimeSpan, buildPath } from '@/utils';
+import { useConfigStore } from '@/stores/configStore';
+
+const configStore = useConfigStore();
const emit = defineEmits(['showPositionHistory']);
+const mapData = useMapStore();
function showPositionHistory(id) {
emit('showPositionHistory', id);
@@ -28,11 +32,6 @@ function showTraceRoute(traceroute) {
state.selectedTraceRoute = traceroute;
}
-// find node marker by id
-function findNodeMarkerById(id) {
- return state.nodeMarkers[id] ?? null;
-}
-
function loadNode(nodeId) {
loadNodeMqttMetrics(nodeId);
loadNodeTraceroutes(nodeId);
@@ -64,7 +63,7 @@ function loadNodeTraceroutes(nodeId) {
}
function loadNodeDeviceMetrics(nodeId) {
- const time = getTimeSpan(deviceMetricsTimeRange.value).amount
+ const time = getTimeSpan(configStore.deviceMetricsTimeRange).amount
const timeFrom = new Date().getTime() - (time * 1000);
axios.get(buildPath(`/api/v1/nodes/${nodeId}/device-metrics`), {
params: {
@@ -79,7 +78,7 @@ function loadNodeDeviceMetrics(nodeId) {
}
function loadNodeEnvironmentMetrics(nodeId) {
- const time = getTimeSpan(environmentMetricsTimeRange.value).amount
+ const time = getTimeSpan(configStore.environmentMetricsTimeRange).amount
const timeFrom = new Date().getTime() - (time * 1000);
axios.get(buildPath(`/api/v1/nodes/${nodeId}/environment-metrics`), {
params: {
@@ -94,7 +93,7 @@ function loadNodeEnvironmentMetrics(nodeId) {
}
function loadNodePowerMetrics(nodeId) {
- const time = getTimeSpan(powerMetricsTimeRange.value).amount
+ const time = getTimeSpan(configStore.powerMetricsTimeRange).amount
const timeFrom = new Date().getTime() - (time * 1000);
axios.get(buildPath(`/api/v1/nodes/${nodeId}/power-metrics`), {
params: {
@@ -118,25 +117,28 @@ watch(
)
watch(
- () => deviceMetricsTimeRange.value,
+ () => configStore.deviceMetricsTimeRange,
(newValue) => {
loadNodeDeviceMetrics(state.selectedNode.node_id)
}
)
watch(
- () => powerMetricsTimeRange.value,
+ () => configStore.powerMetricsTimeRange,
(newValue) => {
loadNodePowerMetrics(state.selectedNode.node_id)
}
)
watch(
- () => environmentMetricsTimeRange.value,
- (newValue) => {
- loadNodeEnvironmentMetrics(state.selectedNode.node_id)
+ () => configStore.environmentMetricsTimeRange,
+ (newValue) => {
+ if (state.selectedNode?.node_id) {
+ loadNodeEnvironmentMetrics(state.selectedNode.node_id);
}
-)
+ }
+);
+