Fixed Configuration Tab on frontend.

Fixed time axis on overview tab and main-stats (battery view tab).
2024-04-10 16:31:59 +02:00 · 2024-04-10 16:31:59 +02:00 · 1338a5ecf3
parent fcbd85db7f
commit 1338a5ecf3
4 changed files with 67 additions and 49 deletions
--- a/csharp/App/SaliMax/src/Ess/Controller.cs
+++ b/csharp/App/SaliMax/src/Ess/Controller.cs
@ -195,6 +195,8 @@ public static class Controller
        var mustDoCalibrationCharge           =  calibrationChargeForced  == CalibrationChargeType.ChargePermanently || 
                                                 (calibrationChargeForced == CalibrationChargeType.AdditionallyOnce  && additionalCalibrationRequired) || 
                                                 (calibrationChargeForced == CalibrationChargeType.RepetitivelyEvery && repetitiveCalibrationRequired);
+        Console.WriteLine("Next Repetitive calibration charge date is "+statusRecord.Config.DayAndTimeForRepetitiveCalibration);
+        Console.WriteLine("Next Additional calibration charge date is "+statusRecord.Config.DayAndTimeForAdditionalCalibration);
        
        if (statusRecord.Battery is not null)
        {
@ -204,7 +206,7 @@ public static class Controller
                _hasAdditionalCalibrationChargeChecked = false;
                
            }
-            else if (calibrationChargeForced == CalibrationChargeType.RepetitivelyEvery && statusRecord.Battery.Eoc)
+            else if (calibrationChargeForced == CalibrationChargeType.RepetitivelyEvery && statusRecord.Battery.Eoc )
            {
                statusRecord.Config.DayAndTimeForRepetitiveCalibration = statusRecord.Config.DayAndTimeForRepetitiveCalibration.AddDays(7);
                _hasRepetitiveCalibrationChargeChecked = false;
--- a/typescript/frontend-marios2/src/content/dashboards/Configuration/Configuration.tsx
+++ b/typescript/frontend-marios2/src/content/dashboards/Configuration/Configuration.tsx
@ -18,7 +18,6 @@ import {
 import React, { useState } from 'react';
 import { FormattedMessage } from 'react-intl';
 import Button from '@mui/material/Button';
-import axiosConfig from '../../../Resources/axiosConfig';
 import { Close as CloseIcon } from '@mui/icons-material';
 import MenuItem from '@mui/material/MenuItem';
 import {
@ -28,6 +27,8 @@ import {
 } from '@mui/x-date-pickers';
 import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs';
 import dayjs from 'dayjs';
+import axiosConfig from '../../../Resources/axiosConfig';
+import utc from 'dayjs/plugin/utc';

 interface ConfigurationProps {
  values: TopologyValues;
@ -61,6 +62,9 @@ function Configuration(props: ConfigurationProps) {
    'Saturday'
  ];

+  dayjs.extend(utc);
+  const localOffset = dayjs().utcOffset();
+
  const [errors, setErrors] = useState({
    minimumSoC: false,
    gridSetPoint: false
@ -89,35 +93,43 @@ function Configuration(props: ConfigurationProps) {
      CalibrationChargeOptionsController.indexOf(
        props.values.calibrationChargeState[0].value.toString()
      ) == 0
-        ? dayjs(props.values.repetitiveCalibrationChargeDate[0].value).toDate()
-        : dayjs(props.values.additionalCalibrationChargeDate[0].value).toDate()
+        ? dayjs
+            .utc(props.values.repetitiveCalibrationChargeDate[0].value)
+            .add(localOffset, 'minute')
+            .toDate()
+        : dayjs
+            .utc(props.values.additionalCalibrationChargeDate[0].value)
+            .add(localOffset, 'minute')
+            .toDate()
  });

  const handleSubmit = async (e) => {
    if (
-      props.values.mode[0].value === 'CalibrationCharge' &&
-      formValues.CalibrationChargeState == 0
+      CalibrationChargeOptionsController.indexOf(
+        props.values.calibrationChargeState[0].value.toString()
+      ) != 2 &&
+      props.values.mode[0].value === 'CalibrationCharge'
    ) {
      setDateSelectionError(
        'You cannot change the date while the installation is in Calibration Charge Mode'
      );
      setErrorDateModalOpen(true);
      return;
-    } else if (dayjs(formValues.calibrationChargeDate).isBefore(dayjs())) {
-      console.log(dayjs());
-      console.log('asked for', dayjs(formValues.calibrationChargeDate));
+    } else if (
+      formValues.CalibrationChargeState != 2 &&
+      dayjs(formValues.calibrationChargeDate).isBefore(dayjs())
+    ) {
+      //console.log('asked for', dayjs(formValues.calibrationChargeDate));
      setDateSelectionError('You must specify a future date');
      setErrorDateModalOpen(true);
      return;
    } else {
-      console.log('asked for', dayjs(formValues.calibrationChargeDate));
+      //console.log('asked for', dayjs(formValues.calibrationChargeDate));
      const configurationToSend: ConfigurationValues = {
        minimumSoC: formValues.minimumSoC,
        gridSetPoint: formValues.gridSetPoint,
        CalibrationChargeState: formValues.CalibrationChargeState,
-        calibrationChargeDate: dayjs(formValues.calibrationChargeDate)
-          .add(2, 'hours')
-          .toDate()
+        calibrationChargeDate: dayjs(formValues.calibrationChargeDate).toDate()
      };

      setLoading(true);
@ -147,7 +159,7 @@ function Configuration(props: ConfigurationProps) {
  const handleConfirm = (newDate) => {
    setFormValues({
      ...formValues,
-      ['calibrationChargeDate']: dayjs(newDate).toDate()
+      ['calibrationChargeDate']: dayjs.utc(newDate).toDate()
    });
  };

@ -159,7 +171,6 @@ function Configuration(props: ConfigurationProps) {
      difference += 7;
    }
    const adjustedDate = currentDate.add(difference, 'day');
-
    setFormValues({
      ...formValues,
      ['calibrationChargeDate']: adjustedDate.toDate()
@ -174,12 +185,14 @@ function Configuration(props: ConfigurationProps) {
      ),
      ['calibrationChargeDate']:
        CalibrationChargeOptions.indexOf(event.target.value) == 0
-          ? dayjs(
-              props.values.repetitiveCalibrationChargeDate[0].value
-            ).toDate()
-          : dayjs(
-              props.values.additionalCalibrationChargeDate[0].value
-            ).toDate()
+          ? dayjs
+              .utc(props.values.repetitiveCalibrationChargeDate[0].value)
+              .add(localOffset, 'minute')
+              .toDate()
+          : dayjs
+              .utc(props.values.additionalCalibrationChargeDate[0].value)
+              .add(localOffset, 'minute')
+              .toDate()
    });
  };

@ -320,9 +333,6 @@ function Configuration(props: ConfigurationProps) {
                      ]
                    }
                    onChange={handleSelectedCalibrationChargeChange}
-                    //open={openForcedCalibrationCharge}
-                    //onClose={handleCloseForcedCalibrationCharge}
-                    //onOpen={handleOpenForcedCalibrationCharge}
                  >
                    {CalibrationChargeOptions.map((option) => (
                      <MenuItem key={option} value={option}>
@ -336,8 +346,10 @@ function Configuration(props: ConfigurationProps) {
                <div>
                  <LocalizationProvider dateAdapter={AdapterDayjs}>
                    <DateTimePicker
+                      format="DD/MM/YYYY HH:mm"
+                      ampm={false}
                      label="Select Next Calibration Charge Date"
-                      value={dayjs(formValues.calibrationChargeDate)}
+                      value={dayjs.utc(formValues.calibrationChargeDate)}
                      onChange={handleConfirm}
                      sx={{
                        marginTop: 2
@ -370,9 +382,6 @@ function Configuration(props: ConfigurationProps) {
                          daysInWeek[formValues.calibrationChargeDate.getDay()]
                        }
                        onChange={handleSelectedCalibrationChargeDay}
-                        // open={openForcedCalibrationCharge}
-                        // onClose={handleCloseForcedCalibrationCharge}
-                        // onOpen={handleOpenForcedCalibrationCharge}
                      >
                        {daysInWeek.map((day) => (
                          <MenuItem key={day} value={day}>
@ -386,8 +395,9 @@ function Configuration(props: ConfigurationProps) {
                  <div style={{ marginBottom: '5px', marginTop: '10px' }}>
                    <LocalizationProvider dateAdapter={AdapterDayjs}>
                      <TimePicker
+                        ampm={false}
                        label="Calibration Charge Hour"
-                        value={dayjs(formValues.calibrationChargeDate)}
+                        value={dayjs.utc(formValues.calibrationChargeDate)}
                        onChange={handleConfirm}
                      />
                    </LocalizationProvider>
--- a/typescript/frontend-marios2/src/content/dashboards/Information/Information.tsx
+++ b/typescript/frontend-marios2/src/content/dashboards/Information/Information.tsx
@ -282,25 +282,25 @@ function Information(props: InformationProps) {
                      />
                    </div>

-                    <div>
-                      <TextField
-                        label="S3 Write Key"
-                        name="s3writekey"
-                        value={formValues.s3WriteKey}
-                        variant="outlined"
-                        fullWidth
-                      />
-                    </div>
+                    {/*<div>*/}
+                    {/*  <TextField*/}
+                    {/*    label="S3 Write Key"*/}
+                    {/*    name="s3writekey"*/}
+                    {/*    value={formValues.s3WriteKey}*/}
+                    {/*    variant="outlined"*/}
+                    {/*    fullWidth*/}
+                    {/*  />*/}
+                    {/*</div>*/}

-                    <div>
-                      <TextField
-                        label="S3 Write Secret Key"
-                        name="s3writesecretkey"
-                        value={formValues.s3WriteSecret}
-                        variant="outlined"
-                        fullWidth
-                      />
-                    </div>
+                    {/*<div>*/}
+                    {/*  <TextField*/}
+                    {/*    label="S3 Write Secret Key"*/}
+                    {/*    name="s3writesecretkey"*/}
+                    {/*    value={formValues.s3WriteSecret}*/}
+                    {/*    variant="outlined"*/}
+                    {/*    fullWidth*/}
+                    {/*  />*/}
+                    {/*</div>*/}

                    <div>
                      <TextField
--- a/typescript/frontend-marios2/src/interfaces/Chart.tsx
+++ b/typescript/frontend-marios2/src/interfaces/Chart.tsx
@ -143,7 +143,9 @@ export const transformInputToBatteryViewData = async (
      startUnixTime = UnixTime.fromTicks(startUnixTime.ticks + 1);
    }
    const adjustedTimestamp = new Date(startUnixTime.ticks * 1000);
-    adjustedTimestamp.setHours(adjustedTimestamp.getHours() + 1);
+    adjustedTimestamp.setHours(
+      adjustedTimestamp.getHours() - adjustedTimestamp.getTimezoneOffset() / 60
+    );
    adjustedTimestampArray.push(adjustedTimestamp);
  }

@ -326,7 +328,11 @@ export const transformInputToDailyData = async (
      startUnixTime = UnixTime.fromTicks(startUnixTime.ticks + 1);
    }
    const adjustedTimestamp = new Date(startUnixTime.ticks * 1000);
-    adjustedTimestamp.setHours(adjustedTimestamp.getHours() + 1);
+    //Timezone offset is negative, so we convert the timestamp to the current zone by subtracting the corresponding offset
+    adjustedTimestamp.setHours(
+      adjustedTimestamp.getHours() - adjustedTimestamp.getTimezoneOffset() / 60
+    );
+
    adjustedTimestampArray.push(adjustedTimestamp);
  }