add measured pv

src/components/DeviceSessionLog.vue

@@ -20,10 +20,10 @@
             class="border-b text-center odd:bg-surface even:bg-subgroup"
           >
             <td class="px-6 py-4">
-              {{ $d(new Date(entry.start), 'short') }}
+              {{ $d(new Date(entry.start + 'Z'), 'long') }}
             </td>
             <td class="px-6 py-4">
-              {{ $d(new Date(entry.end), 'short') }}
+              {{ $d(new Date(entry.end + 'Z'), 'long') }}
             </td>
             <td class="px-6 py-4">
               {{ entry.text }}

src/layouts/default/Default.vue

@@ -1,23 +1,15 @@
 <template>
   <v-app>
     <Footer />
-    <MainView v-if="!notConnected" />
-    <v-overlay v-model="notConnected" class="justify-center align-center">
-      <v-progress-circular indeterminate size="64" />
-    </v-overlay>
+    <MainView />
+
     <reload-prompt v-if="store.isInStandaloneMode" />
   </v-app>
 </template>
 
 <script lang="ts" setup>
-import { computed } from 'vue';
 import MainView from './MainView.vue';
 import Footer from './Footer.vue';
-import { devicesAPI } from '@/api/devices.api';
 import { store } from '@/plugins/store';
 import ReloadPrompt from './ReloadPrompt.vue';
-
-const notConnected = computed(() => {
-  return !devicesAPI.state.connected;
-});
 </script>

src/plugins/i18n.ts

@@ -16,6 +16,28 @@ const i18n = createI18n({
   fallbackWarn: false,
   silentTranslationWarn: true,
   messages,
+  datetimeFormats: {
+    en: {
+      long: {
+        year: 'numeric',
+        month: '2-digit',
+        day: '2-digit',
+        hour: '2-digit',
+        minute: '2-digit',
+        second: '2-digit',
+      },
+    },
+    de: {
+      long: {
+        year: 'numeric',
+        month: '2-digit',
+        day: '2-digit',
+        hour: '2-digit',
+        minute: '2-digit',
+        second: '2-digit',
+      },
+    },
+  },
 });
 
 // @ts-ignore

src/translations/de.json

@@ -35,9 +35,10 @@
     "end": "Ende",
     "text": "Text"
   },
-  "forecast":{
+  "forecast": {
     "pv": "PV",
-    "consumption": "Verbrauch"
+    "consumption": "Verbrauch",
+    "pv_forecast": "PV Vorhersage"
   },
   "power_mode": {
     "device_controlled": "Vom Gerät gesteuert",
@@ -48,6 +49,6 @@
     "optimized": "Optimiert"
   },
   "tooltip": {
-    "show_menu": "Menü anzeigen\/verbergen"
+    "show_menu": "Menü anzeigen/verbergen"
   }
-}
+}

src/translations/en.json

@@ -1,10 +1,10 @@
 {
   "app": {
     "energy_assistant": "Energy Assistant",
-    "home": "Home",    
+    "home": "Home",
     "live": "Live",
     "statistics": "Statistics",
-    "forecast": "Forecast",    
+    "forecast": "Forecast",
     "rawdata": "Data",
     "sessionlog": "Session Log",
     "settings": "Settings"
@@ -35,9 +35,10 @@
     "start": "Start",
     "text": "Text"
   },
-  "forecast":{
+  "forecast": {
     "pv": "PV",
-    "consumption": "Consumption"
+    "consumption": "Consumption",
+    "pv_forecast": "PV forecast"
   },
   "power_mode": {
     "device_controlled": "Device controlled",
@@ -48,6 +49,6 @@
     "optimized": "Optimized"
   },
   "tooltip": {
-    "show_menu": "Show\/hide menu"
+    "show_menu": "Show/hide menu"
   }
-}
+}

src/views/Forecast.vue

@@ -42,7 +42,6 @@ const colors = [
   'green',
   'light-green',
   'lime',
-  'yellow',
   'amber',
   'organe',
   'deep-orange',
@@ -65,6 +64,8 @@ function getDataSetColor(name: string) {
   switch (name) {
     case 'pv':
       return theme.current.value.colors['sun'];
+    case 'pv_forecast':
+      return 'yellow';
     case 'consumption':
       return theme.current.value.colors['grid'];
     default:
@@ -76,6 +77,8 @@ function getDataSetLabel(name: string) {
   switch (name) {
     case 'pv':
       return t('forecast.pv');
+    case 'pv_forecast':
+      return t('forecast.pv_forecast');
     case 'consumption':
       return t('forecast.consumption');
     default:
@@ -87,15 +90,19 @@ function getDataSets(forecast: IForecast) {
   if (forecast && forecast.series) {
     let colorIterator = new ColorIterator();
     return forecast.series.map((serie) => {
-      if (serie.name == 'pv' || serie.name == 'consumption') {
+      if (
+        serie.name == 'pv' ||
+        serie.name == 'pv_forecast' ||
+        serie.name == 'consumption'
+      ) {
         let color = getDataSetColor(serie.name);
         return {
           label: getDataSetLabel(serie.name),
           data: serie.data,
           fill: false,
           backgroundColor: color,
           borderColor: color,
-          pointStyle: false,
+          //pointStyle: false,
         };
       } else {
         let color = colorIterator.getNextColor();