added connect process for Overview Page of Sodistorehome thus they only show available historical S3 data in case of offline
This commit is contained in:
parent
b4a296fd8a
commit
cb61c2bd42
|
|
@ -34,6 +34,8 @@ interface OverviewProps {
|
||||||
s3Credentials: I_S3Credentials;
|
s3Credentials: I_S3Credentials;
|
||||||
id: number;
|
id: number;
|
||||||
device?: number;
|
device?: number;
|
||||||
|
connected?: boolean;
|
||||||
|
loading?: boolean;
|
||||||
}
|
}
|
||||||
|
|
||||||
const computeLast7Days = (): string[] => {
|
const computeLast7Days = (): string[] => {
|
||||||
|
|
@ -104,6 +106,12 @@ function Overview(props: OverviewProps) {
|
||||||
}
|
}
|
||||||
}, [isZooming, dailyDataArray]);
|
}, [isZooming, dailyDataArray]);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (props.connected === false) {
|
||||||
|
setErrorDateModalOpen(false);
|
||||||
|
}
|
||||||
|
}, [props.connected]);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const resultPromise: Promise<{
|
const resultPromise: Promise<{
|
||||||
chartData: chartDataInterface;
|
chartData: chartDataInterface;
|
||||||
|
|
@ -121,8 +129,6 @@ function Overview(props: OverviewProps) {
|
||||||
resultPromise
|
resultPromise
|
||||||
.then((result) => {
|
.then((result) => {
|
||||||
if (result.chartData.soc.data.length === 0) {
|
if (result.chartData.soc.data.length === 0) {
|
||||||
setDateSelectionError(intl.formatMessage({ id: 'noDataForDateRange' }));
|
|
||||||
setErrorDateModalOpen(true);
|
|
||||||
setLoading(false);
|
setLoading(false);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
@ -397,6 +403,23 @@ function Overview(props: OverviewProps) {
|
||||||
const renderGraphs = () => {
|
const renderGraphs = () => {
|
||||||
return (
|
return (
|
||||||
<Container maxWidth="xl">
|
<Container maxWidth="xl">
|
||||||
|
{!props.connected && !props.loading && (
|
||||||
|
<Typography
|
||||||
|
variant="body2"
|
||||||
|
sx={{
|
||||||
|
color: 'red',
|
||||||
|
fontWeight: 'bold',
|
||||||
|
textAlign: 'center',
|
||||||
|
marginTop: '10px',
|
||||||
|
marginBottom: '10px'
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<FormattedMessage
|
||||||
|
id="installationOffline"
|
||||||
|
defaultMessage="Installation is currently offline. Showing last available data."
|
||||||
|
/>
|
||||||
|
</Typography>
|
||||||
|
)}
|
||||||
{isErrorDateModalOpen && (
|
{isErrorDateModalOpen && (
|
||||||
<Modal open={isErrorDateModalOpen} onClose={() => {}}>
|
<Modal open={isErrorDateModalOpen} onClose={() => {}}>
|
||||||
<Box
|
<Box
|
||||||
|
|
@ -527,6 +550,7 @@ function Overview(props: OverviewProps) {
|
||||||
</LocalizationProvider>
|
</LocalizationProvider>
|
||||||
)}
|
)}
|
||||||
<Grid container>
|
<Grid container>
|
||||||
|
{!props.loading && (props.connected !== false || dailyDataArray.length > 0 || aggregatedDataArray.length > 0) && (<>
|
||||||
<Grid item xs={6} md={6}>
|
<Grid item xs={6} md={6}>
|
||||||
<Button
|
<Button
|
||||||
variant="contained"
|
variant="contained"
|
||||||
|
|
@ -618,6 +642,7 @@ function Overview(props: OverviewProps) {
|
||||||
<FormattedMessage id="goback" defaultMessage="Zoom in" />
|
<FormattedMessage id="goback" defaultMessage="Zoom in" />
|
||||||
</Button>
|
</Button>
|
||||||
</Grid>
|
</Grid>
|
||||||
|
</>)}
|
||||||
|
|
||||||
{loading && (
|
{loading && (
|
||||||
<Container
|
<Container
|
||||||
|
|
@ -1565,6 +1590,10 @@ function Overview(props: OverviewProps) {
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
if (props.loading) {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
return <>{renderGraphs()}</>;
|
return <>{renderGraphs()}</>;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -276,6 +276,7 @@ function SodioHomeInstallation(props: singleInstallationProps) {
|
||||||
currentTab == 'live' ||
|
currentTab == 'live' ||
|
||||||
currentTab == 'pvview' ||
|
currentTab == 'pvview' ||
|
||||||
currentTab == 'configuration' ||
|
currentTab == 'configuration' ||
|
||||||
|
currentTab == 'overview' ||
|
||||||
location.includes('batteryview')
|
location.includes('batteryview')
|
||||||
) {
|
) {
|
||||||
//Fetch periodically if the tab is live, pvview or batteryview
|
//Fetch periodically if the tab is live, pvview or batteryview
|
||||||
|
|
@ -293,6 +294,13 @@ function SodioHomeInstallation(props: singleInstallationProps) {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
// Fetch one time in overview tab to determine connectivity
|
||||||
|
if (currentTab == 'overview') {
|
||||||
|
fetchDataForOneTime();
|
||||||
|
return () => {
|
||||||
|
continueFetching.current = false;
|
||||||
|
};
|
||||||
|
}
|
||||||
// Fetch periodically in configuration tab to detect S3 config updates
|
// Fetch periodically in configuration tab to detect S3 config updates
|
||||||
if (currentTab == 'configuration') {
|
if (currentTab == 'configuration') {
|
||||||
fetchDataForOneTime();
|
fetchDataForOneTime();
|
||||||
|
|
@ -462,7 +470,6 @@ function SodioHomeInstallation(props: singleInstallationProps) {
|
||||||
</div>
|
</div>
|
||||||
{loading &&
|
{loading &&
|
||||||
currentTab != 'information' &&
|
currentTab != 'information' &&
|
||||||
currentTab != 'overview' &&
|
|
||||||
currentTab != 'manage' &&
|
currentTab != 'manage' &&
|
||||||
currentTab != 'history' &&
|
currentTab != 'history' &&
|
||||||
currentTab != 'log' &&
|
currentTab != 'log' &&
|
||||||
|
|
@ -594,6 +601,8 @@ function SodioHomeInstallation(props: singleInstallationProps) {
|
||||||
s3Credentials={s3Credentials}
|
s3Credentials={s3Credentials}
|
||||||
id={props.current_installation.id}
|
id={props.current_installation.id}
|
||||||
device={props.current_installation.device}
|
device={props.current_installation.device}
|
||||||
|
connected={connected}
|
||||||
|
loading={loading}
|
||||||
/>
|
/>
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
|
|
||||||
|
|
@ -425,6 +425,7 @@
|
||||||
"requiredOrderNumber": "Pflichtbestellnummer",
|
"requiredOrderNumber": "Pflichtbestellnummer",
|
||||||
"unableToCommunicate": "Kommunikation mit der Installation nicht möglich",
|
"unableToCommunicate": "Kommunikation mit der Installation nicht möglich",
|
||||||
"pleaseWaitOrRefresh": "Bitte warten oder Seite aktualisieren",
|
"pleaseWaitOrRefresh": "Bitte warten oder Seite aktualisieren",
|
||||||
|
"installationOffline": "Die Installation ist derzeit offline. Letzte verfügbare Daten werden angezeigt.",
|
||||||
"noDataForDateRange": "Keine Daten für den gewählten Zeitraum verfügbar. Bitte wählen Sie ein neueres Datum.",
|
"noDataForDateRange": "Keine Daten für den gewählten Zeitraum verfügbar. Bitte wählen Sie ein neueres Datum.",
|
||||||
"loginFailed": "Anmeldung fehlgeschlagen. Bitte versuchen Sie es erneut.",
|
"loginFailed": "Anmeldung fehlgeschlagen. Bitte versuchen Sie es erneut.",
|
||||||
"usernameWrong": "Benutzername ist falsch. Bitte versuchen Sie es erneut.",
|
"usernameWrong": "Benutzername ist falsch. Bitte versuchen Sie es erneut.",
|
||||||
|
|
|
||||||
|
|
@ -173,6 +173,7 @@
|
||||||
"demo_diagnose_button": "Diagnose",
|
"demo_diagnose_button": "Diagnose",
|
||||||
"unableToCommunicate": "Unable to communicate with the installation",
|
"unableToCommunicate": "Unable to communicate with the installation",
|
||||||
"pleaseWaitOrRefresh": "Please wait or refresh the page",
|
"pleaseWaitOrRefresh": "Please wait or refresh the page",
|
||||||
|
"installationOffline": "Installation is currently offline. Showing last available data.",
|
||||||
"noDataForDateRange": "No data available for the selected date range. Please choose a more recent date.",
|
"noDataForDateRange": "No data available for the selected date range. Please choose a more recent date.",
|
||||||
"loginFailed": "Login failed. Please try again.",
|
"loginFailed": "Login failed. Please try again.",
|
||||||
"usernameWrong": "Username is wrong. Please try again.",
|
"usernameWrong": "Username is wrong. Please try again.",
|
||||||
|
|
|
||||||
|
|
@ -425,6 +425,7 @@
|
||||||
"navigationTabs": "Navigation",
|
"navigationTabs": "Navigation",
|
||||||
"unableToCommunicate": "Impossible de communiquer avec l'installation",
|
"unableToCommunicate": "Impossible de communiquer avec l'installation",
|
||||||
"pleaseWaitOrRefresh": "Veuillez patienter ou actualiser la page",
|
"pleaseWaitOrRefresh": "Veuillez patienter ou actualiser la page",
|
||||||
|
"installationOffline": "L'installation est actuellement hors ligne. Affichage des dernières données disponibles.",
|
||||||
"noDataForDateRange": "Aucune donnée disponible pour la période sélectionnée. Veuillez choisir une date plus récente.",
|
"noDataForDateRange": "Aucune donnée disponible pour la période sélectionnée. Veuillez choisir une date plus récente.",
|
||||||
"loginFailed": "Échec de la connexion. Veuillez réessayer.",
|
"loginFailed": "Échec de la connexion. Veuillez réessayer.",
|
||||||
"usernameWrong": "Nom d'utilisateur incorrect. Veuillez réessayer.",
|
"usernameWrong": "Nom d'utilisateur incorrect. Veuillez réessayer.",
|
||||||
|
|
|
||||||
|
|
@ -425,6 +425,7 @@
|
||||||
"alarm_OffGridBusVoltageTooLow": "Tensione Bus Fuori Rete Troppo Bassa",
|
"alarm_OffGridBusVoltageTooLow": "Tensione Bus Fuori Rete Troppo Bassa",
|
||||||
"unableToCommunicate": "Impossibile comunicare con l'installazione",
|
"unableToCommunicate": "Impossibile comunicare con l'installazione",
|
||||||
"pleaseWaitOrRefresh": "Attendere o aggiornare la pagina",
|
"pleaseWaitOrRefresh": "Attendere o aggiornare la pagina",
|
||||||
|
"installationOffline": "L'installazione è attualmente offline. Vengono mostrati gli ultimi dati disponibili.",
|
||||||
"noDataForDateRange": "Nessun dato disponibile per il periodo selezionato. Scegliere una data più recente.",
|
"noDataForDateRange": "Nessun dato disponibile per il periodo selezionato. Scegliere una data più recente.",
|
||||||
"loginFailed": "Accesso fallito. Riprovare.",
|
"loginFailed": "Accesso fallito. Riprovare.",
|
||||||
"usernameWrong": "Nome utente errato. Riprovare.",
|
"usernameWrong": "Nome utente errato. Riprovare.",
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue