From 1752c2ddf938fe0d50357cb4b4c4edcb891a969a Mon Sep 17 00:00:00 2001
From: Yinyin Liu <liu@innov.energy>
Date: Wed, 12 Nov 2025 15:04:09 +0100
Subject: [PATCH] added Configuration Option for TimeChargeDischarge Mode on
 Sinexcel only Frontend

---
 .../src/content/dashboards/Log/graph.util.tsx |  10 ++
 .../SodistoreHomeConfiguration.tsx            | 115 +++++++++++++++++-
 2 files changed, 123 insertions(+), 2 deletions(-)

diff --git a/typescript/frontend-marios2/src/content/dashboards/Log/graph.util.tsx b/typescript/frontend-marios2/src/content/dashboards/Log/graph.util.tsx
index 4e385dc9f..06d0e6132 100644
--- a/typescript/frontend-marios2/src/content/dashboards/Log/graph.util.tsx
+++ b/typescript/frontend-marios2/src/content/dashboards/Log/graph.util.tsx
@@ -329,6 +329,11 @@ export interface JSONRecordData {
     MaximumDischargingCurrent: number;
     OperatingPriority: string;
     BatteriesCount: number;
+
+    //For Sinexcel: TimeChargeDischarge mode
+    TimeChargeDischargePower?: number;
+    TimeChargeDischargeTime?: string;
+    TimeChargeDischargeDate?: string;
   };
 
   DcDc: {
@@ -616,6 +621,11 @@ export type ConfigurationValues = {
   maximumChargingCurrent: number;
   operatingPriority: number;
   batteriesCount: number;
+
+  // For Sinexcel: TimeChargeDischarge mode
+  timeChargeDischargePower?: number;
+  timeChargeDischargeTime?: Date | string;
+  timeChargeDischargeDate?: Date | string;
 };
 //
 // export interface Pv {
diff --git a/typescript/frontend-marios2/src/content/dashboards/SodiohomeInstallations/SodistoreHomeConfiguration.tsx b/typescript/frontend-marios2/src/content/dashboards/SodiohomeInstallations/SodistoreHomeConfiguration.tsx
index 8970f7ea3..6667d0ad2 100644
--- a/typescript/frontend-marios2/src/content/dashboards/SodiohomeInstallations/SodistoreHomeConfiguration.tsx
+++ b/typescript/frontend-marios2/src/content/dashboards/SodiohomeInstallations/SodistoreHomeConfiguration.tsx
@@ -25,6 +25,10 @@ import axiosConfig from '../../../Resources/axiosConfig';
 import { UserContext } from '../../../contexts/userContext';
 import { ProductIdContext } from '../../../contexts/ProductIdContextProvider';
 import { I_Installation } from 'src/interfaces/InstallationTypes';
+import { LocalizationProvider } from '@mui/x-date-pickers';
+import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs';
+import { DatePicker, TimePicker } from '@mui/x-date-pickers';
+import dayjs from 'dayjs';
 
 interface SodistoreHomeConfigurationProps {
   values: JSONRecordData;
@@ -82,7 +86,27 @@ function SodistoreHomeConfiguration(props: SodistoreHomeConfigurationProps) {
     operatingPriority: OperatingPriorityOptions.indexOf(
       props.values.Config.OperatingPriority
     ),
-    batteriesCount: props.values.Config.BatteriesCount
+    // ...(props.installation.device === 4
+    //   ? {
+    //     timeChargeDischargePower:
+    //       props.values.Config?.TimeChargeDischargePower ?? 0,
+    //     timeChargeDischargeTime: props.values.Config?.TimeChargeDischargeTime
+    //       ? dayjs(props.values.Config.TimeChargeDischargeTime).toDate()
+    //       : dayjs().toDate(),
+    //     timeChargeDischargeDate: props.values.Config?.TimeChargeDischargeDate
+    //       ? dayjs(props.values.Config.TimeChargeDischargeDate).toDate()
+    //       : dayjs().toDate()
+    //   }
+    //   : {})
+
+    timeChargeDischargePower:
+      props.values.Config?.TimeChargeDischargePower ?? 0, // default 0 W
+    timeChargeDischargeTime: props.values.Config?.TimeChargeDischargeTime
+      ? dayjs(props.values.Config.TimeChargeDischargeTime).toDate()
+      : dayjs().hour(8).minute(0).second(0).toDate(), // default 08:00
+    timeChargeDischargeDate: props.values.Config?.TimeChargeDischargeDate
+      ? dayjs(props.values.Config.TimeChargeDischargeDate).toDate()
+      : dayjs().add(1, 'day').toDate() // default = tomorrow
   });
 
   const handleOperatingPriorityChange = (event) => {
@@ -101,7 +125,15 @@ function SodistoreHomeConfiguration(props: SodistoreHomeConfigurationProps) {
       maximumDischargingCurrent: formValues.maximumDischargingCurrent,
       maximumChargingCurrent: formValues.maximumChargingCurrent,
       operatingPriority: formValues.operatingPriority,
-      batteriesCount:formValues.batteriesCount
+      batteriesCount:formValues.batteriesCount,
+
+      // ...(device === 4 &&
+      //   OperatingPriorityOptions[formValues.operatingPriority] ===
+      //   'TimeChargeDischarge' && {
+      //     timeChargeDischargePower: formValues.timeChargeDischargePower,
+      //     timeChargeDischargeTime: formValues.timeChargeDischargeTime,
+      //     timeChargeDischargeDate: formValues.timeChargeDischargeDate
+      //   })
     };
 
     setLoading(true);
@@ -189,6 +221,13 @@ function SodistoreHomeConfiguration(props: SodistoreHomeConfigurationProps) {
     });
   };
 
+  const handleTimeChargeDischargeChange = (name: string, value: any) => {
+    setFormValues((prev) => ({
+      ...prev,
+      [name]: value
+    }));
+  };
+
   const handleOkOnErrorDateModal = () => {
     setErrorDateModalOpen(false);
   };
@@ -353,6 +392,78 @@ function SodistoreHomeConfiguration(props: SodistoreHomeConfigurationProps) {
                 </div>
               </>
 
+              {/* --- Extra fields for device=4 + TimeChargeDischarge --- */}
+              {device === 4 &&
+                OperatingPriorityOptions[formValues.operatingPriority] ===
+                'TimeChargeDischarge' && (
+                  <>
+                    {/* Power input */}
+                    <div style={{ marginBottom: '5px' }}>
+                      <TextField
+                        label="Power (W)"
+                        name="timeChargeDischargePower"
+                        value={formValues.timeChargeDischargePower}
+                        onChange={(e) =>
+                          handleTimeChargeDischargeChange(e.target.name, e.target.value)
+                        }
+                        helperText="Enter a positive or negative power value"
+                        fullWidth
+                      />
+                    </div>
+
+                    {/* Time picker */}
+                    <div style={{ marginBottom: '5px' }}>
+                      <LocalizationProvider dateAdapter={AdapterDayjs}>
+                        <TimePicker
+                          ampm={false}
+                          label="Time"
+                          value={dayjs(formValues.timeChargeDischargeTime)}
+                          onChange={(newTime) =>
+                            handleTimeChargeDischargeChange(
+                              'timeChargeDischargeTime',
+                              newTime?.toDate()
+                            )
+                          }
+                          renderInput={(params) => (
+                            <TextField
+                              {...params}
+                              sx={{
+                                marginTop: 2,
+                                width: '100%'
+                              }}
+                            />
+                          )}
+                        />
+                      </LocalizationProvider>
+                    </div>
+
+                    {/* Date picker */}
+                    <div style={{ marginBottom: '5px' }}>
+                      <LocalizationProvider dateAdapter={AdapterDayjs}>
+                        <DatePicker
+                          label="Date"
+                          value={dayjs(formValues.timeChargeDischargeDate)}
+                          onChange={(newDate) =>
+                            handleTimeChargeDischargeChange(
+                              'timeChargeDischargeDate',
+                              newDate?.toDate()
+                            )
+                          }
+                          renderInput={(params) => (
+                            <TextField
+                              {...params}
+                              sx={{
+                                marginTop: 2,
+                                width: '100%'
+                              }}
+                            />
+                          )}
+                        />
+                      </LocalizationProvider>
+                    </div>
+                  </>
+                )}
+
               <div
                 style={{
                   display: 'flex',