diff --git a/typescript/frontend-marios2/src/content/dashboards/Information/InformationSodistoreHome.tsx b/typescript/frontend-marios2/src/content/dashboards/Information/InformationSodistoreHome.tsx index ce2f2afa3..662907a18 100644 --- a/typescript/frontend-marios2/src/content/dashboards/Information/InformationSodistoreHome.tsx +++ b/typescript/frontend-marios2/src/content/dashboards/Information/InformationSodistoreHome.tsx @@ -7,6 +7,7 @@ import { FormControl, Grid, IconButton, + InputAdornment, InputLabel, MenuItem, Modal, @@ -18,7 +19,7 @@ import { import { FormattedMessage } from 'react-intl'; import Button from '@mui/material/Button'; import { Close as CloseIcon } from '@mui/icons-material'; -import React, { useContext, useState } from 'react'; +import React, { useContext, useState, useEffect } from 'react'; import { I_S3Credentials } from '../../../interfaces/S3Types'; import { I_Installation } from '../../../interfaces/InstallationTypes'; import { InstallationsContext } from '../../../contexts/InstallationsContextProvider'; @@ -46,12 +47,38 @@ function InformationSodistorehome(props: InformationSodistorehomeProps) { const [openModalDeleteInstallation, setOpenModalDeleteInstallation] = useState(false); const navigate = useNavigate(); + const [batteryNumber, setBatteryNumber] = useState(0); + const [batterySerialNumbers, setBatterySerialNumbers] = useState( + [] + ); const DeviceTypes = [ { id: 3, name: 'Growatt' }, { id: 4, name: 'Sinexcel' } ]; + const BATTERY_SN_PREFIX = 'PNR020125101'; + const BATTERY_SN_SUFFIX_LENGTH = 4; + + // Initialize battery data from props + useEffect(() => { + if (props.values.batteryNumber) { + setBatteryNumber(props.values.batteryNumber); + } + if (props.values.batterySerialNumbers) { + const serialNumbers = props.values.batterySerialNumbers + .split(',') + .filter((sn) => sn.trim() !== '') + .map((sn) => { + // If it has the prefix, extract only the suffix + if (sn.startsWith(BATTERY_SN_PREFIX)) { + return sn.substring(BATTERY_SN_PREFIX.length); + } + return sn; + }); + setBatterySerialNumbers(serialNumbers); + } + }, []); const installationContext = useContext(InstallationsContext); const { @@ -72,6 +99,49 @@ function InformationSodistorehome(props: InformationSodistorehomeProps) { [name]: value }); }; + + const handleBatteryNumberChange = (e) => { + const inputValue = e.target.value; + // Only allow numeric input + if (inputValue === '' || /^\d+$/.test(inputValue)) { + const value = inputValue === '' ? 0 : parseInt(inputValue); + setBatteryNumber(value); + + // Preserve existing serial numbers and adjust array size + const newSerialNumbers = Array.from({ length: value }, (_, index) => { + // Keep existing serial number if it exists, otherwise use empty string + return batterySerialNumbers[index] || ''; + }); + setBatterySerialNumbers(newSerialNumbers); + + // Update formValues with preserved serial numbers + const fullSerialNumbers = newSerialNumbers + .map((suffix) => (suffix ? BATTERY_SN_PREFIX + suffix : '')) + .filter((sn) => sn !== ''); + + setFormValues({ + ...formValues, + batteryNumber: value, + batterySerialNumbers: fullSerialNumbers.join(',') + }); + } + }; + + const handleBatterySerialNumberChange = (index: number, value: string) => { + // Only allow digits and limit to 3 characters + const sanitizedValue = value.replace(/\D/g, '').substring(0, BATTERY_SN_SUFFIX_LENGTH); + const updatedSerialNumbers = [...batterySerialNumbers]; + updatedSerialNumbers[index] = sanitizedValue; + setBatterySerialNumbers(updatedSerialNumbers); + // Update formValues for persistence with full serial numbers (prefix + suffix) + const fullSerialNumbers = updatedSerialNumbers + .map((suffix) => (suffix ? BATTERY_SN_PREFIX + suffix : '')) + .filter((sn) => sn !== ''); + setFormValues({ + ...formValues, + batterySerialNumbers: fullSerialNumbers.join(',') + }); + }; const handleSubmit = () => { setLoading(true); setError(false); @@ -186,7 +256,7 @@ function InformationSodistorehome(props: InformationSodistorehomeProps) { alignItems="stretch" spacing={3} > - + +
+ + } + name="batteryNumber" + type="text" + value={batteryNumber === 0 ? '' : batteryNumber} + onChange={handleBatteryNumberChange} + variant="outlined" + fullWidth + placeholder="Enter number of batteries" + /> +
+ + {batteryNumber > 0 && + batterySerialNumbers.map((serialNumber, index) => ( +
+ + handleBatterySerialNumberChange(index, e.target.value) + } + variant="outlined" + fullWidth + InputProps={{ + startAdornment: ( + + {BATTERY_SN_PREFIX} + + ) + }} + inputProps={{ + maxLength: BATTERY_SN_SUFFIX_LENGTH, + placeholder: '0000' + }} + helperText={`Enter ${BATTERY_SN_SUFFIX_LENGTH} digits`} + /> +
+ ))} +