Refactor to decouple energy, room, and sensor stores

- Remove room and sensor logic from energy store - Update components to
use useRoomStore and useSensorStore directly - Fix sensor/room ID
mismatches and API response handling in room store - Update
AIOptimizationView to use useWebSocketStore for connection status -
Update SensorManagementView to use useRoomStore and useSensorStore
directly

src/components/cards/AirQualityCard.vue

@@ -70,12 +70,12 @@
 
 <script setup lang="ts">
 import { computed } from 'vue'
-import { useEnergyStore } from '@/stores/energy'
+import { useRoomStore } from '@/stores/room'
 
-const energyStore = useEnergyStore()
+const roomStore = useRoomStore()
 
 const roomsList = computed(() => {
-  return Array.from(energyStore.roomsData.values()).sort((a, b) => 
+  return Array.from(roomStore.roomsData.values()).sort((a, b) =>
     b.co2.current - a.co2.current // Sort by CO2 level descending
   )
 })
@@ -86,7 +86,7 @@ const overallCO2 = computed(() => {
 })
 
 const overallStatus = computed(() => {
-  return energyStore.getCO2Status(overallCO2.value)
+  return roomStore.getCO2Status(overallCO2.value)
 })
 
 const roomsWithGoodAir = computed(() => {

src/components/cards/DetailedSensorCard.vue

@@ -165,7 +165,6 @@
 
 <script setup lang="ts">
 import { computed } from 'vue'
-import { useEnergyStore } from '@/stores/energy'
 import { useSensorStore } from '@/stores/sensor'
 
 const props = defineProps<{
@@ -179,28 +178,25 @@ const emit = defineEmits<{
   executeAction: [sensor: any, action: any]
 }>()
 
-const energyStore = useEnergyStore()
 const sensorStore = useSensorStore()
 
 const getSensorValues = (sensor: any) => {
   const values = []
 
   // Get real-time sensor reading from store
-  const latestReading = energyStore.latestReadings.get(sensor.id)
+  const latestReading = sensorStore.latestReadings.get(sensor.id) || sensorStore.latestReadings.get(sensor.sensor_id)
   console.log(`[Detailed] Getting values for sensor ${sensor.id}, found reading:`, latestReading)
-  console.log('[Detailed] Available readings:', Array.from(energyStore.latestReadings.keys()))
+  console.log('[Detailed] Available readings:', Array.from(sensorStore.latestReadings.keys()))
   console.log(`[Detailed] Sensor capabilities:`, sensor.capabilities?.monitoring)
 
   // Only show energy if the sensor actually monitors energy
   if (sensor.capabilities?.monitoring?.includes('energy')) {
-    const energyValue = latestReading?.energy?.value?.toFixed(2) ||
-                       energyStore.latestMessage?.value?.toFixed(2) ||
-                       '0.00'
+    const energyValue = latestReading?.energy?.value?.toFixed(2) || '0.00'
     values.push({
       type: 'energy',
       label: 'Energy Consumption',
       value: energyValue,
-      unit: latestReading?.energy?.unit || energyStore.latestMessage?.unit || 'kWh'
+      unit: latestReading?.energy?.unit || 'kWh'
     })
   }
 

src/components/cards/RoomMetricsCard.vue

@@ -72,12 +72,12 @@
 
 <script setup lang="ts">
 import { computed } from 'vue'
-import { useEnergyStore } from '@/stores/energy'
+import { useRoomStore } from '@/stores/room'
 
-const energyStore = useEnergyStore()
+const roomStore = useRoomStore()
 
 const roomsList = computed(() => {
-  return Array.from(energyStore.roomsData.values()).sort((a, b) => 
+  return Array.from(roomStore.roomsData.values()).sort((a, b) =>
     a.room.localeCompare(b.room)
   )
 })