Innovenergy
/
Innovenergy_trunk
2
1
Fork 0
Code Issues 1 Pull Requests Packages Projects Releases Wiki Activity

Compare commits

base: Innovenergy:8646790824becb3aa1ffb762865fce2cacf4ee1d
Branches Tags
Innovenergy:main
Innovenergy:v1.2
Innovenergy:v1.02
Innovenergy:v1.01
..
compare: Innovenergy:775c7a1785afa93f06a8d3a8fd5c4ad52c042edb
Branches Tags
Innovenergy:main
Innovenergy:v1.2
Innovenergy:v1.02
Innovenergy:v1.01

No commits in common. "8646790824becb3aa1ffb762865fce2cacf4ee1d" and "775c7a1785afa93f06a8d3a8fd5c4ad52c042edb" have entirely different histories.
8646790824 ... 775c7a1785

6 changed files with 410 additions and 327 deletions
Show Stats Expand all files Collapse all files

2
csharp/App/SaliMax/deploy_all_installations.sh
View File

@ -17,8 +17,6 @@ dotnet publish \
echo -e "\n============================ Deploy ============================\n" echo -e "\n============================ Deploy ============================\n"
ip_addresses=("10.2.3.115" "10.2.3.104" "10.2.4.33" "10.2.4.32" "10.2.4.36" "10.2.4.35" "10.2.4.154" "10.2.4.113" "10.2.4.29") ip_addresses=("10.2.3.115" "10.2.3.104" "10.2.4.33" "10.2.4.32" "10.2.4.36" "10.2.4.35" "10.2.4.154" "10.2.4.113" "10.2.4.29")
#ip_addresses=("10.2.4.154" "10.2.4.29")
for ip_address in "${ip_addresses[@]}"; do for ip_address in "${ip_addresses[@]}"; do
rsync -v \ rsync -v \

34
csharp/App/SaliMax/src/AggregationService/HourlyData.cs
View File

@ -1,5 +1,3 @@
using System.IO.Compression;
using System.Text;
using System.Text.Json; using System.Text.Json;
using Flurl.Http; using Flurl.Http;
using InnovEnergy.App.SaliMax.Devices; using InnovEnergy.App.SaliMax.Devices;
@ -70,37 +68,7 @@ public class AggregatedData
var s3Path = DateTime.Now.AddDays(-1).ToString("yyyy-MM-dd") + ".csv"; var s3Path = DateTime.Now.AddDays(-1).ToString("yyyy-MM-dd") + ".csv";
var request = _S3Config.CreatePutRequest(s3Path); var request = _S3Config.CreatePutRequest(s3Path);
var response = await request.PutAsync(new StringContent(csv));
// Compress CSV data to a byte array
byte[] compressedBytes;
using (var memoryStream = new MemoryStream())
{
//Create a zip directory and put the compressed file inside
using (var archive = new ZipArchive(memoryStream, ZipArchiveMode.Create, true))
{
var entry = archive.CreateEntry("data.csv", CompressionLevel.SmallestSize); // Add CSV data to the ZIP archive
using (var entryStream = entry.Open())
using (var writer = new StreamWriter(entryStream))
{
writer.Write(csv);
}
}
compressedBytes = memoryStream.ToArray();
}
// Encode the compressed byte array as a Base64 string
string base64String = Convert.ToBase64String(compressedBytes);
// Create StringContent from Base64 string
var stringContent = new StringContent(base64String, Encoding.UTF8, "application/base64");
// Upload the compressed data (ZIP archive) to S3
var response = await request.PutAsync(stringContent);
//
// var request = _S3Config.CreatePutRequest(s3Path);
// var response = await request.PutAsync(new StringContent(csv));
if (response.StatusCode != 200) if (response.StatusCode != 200)
{ {

17
typescript/frontend-marios2/src/content/dashboards/Installations/FlatInstallationView.tsx
View File

@ -31,21 +31,6 @@ const FlatInstallationView = (props: FlatInstallationViewProps) => {
const [selectedInstallation, setSelectedInstallation] = useState<number>(-1); const [selectedInstallation, setSelectedInstallation] = useState<number>(-1);
const currentLocation = useLocation(); const currentLocation = useLocation();
const sortedInstallations = [...props.installations].sort((a, b) => {
// Compare the status field of each installation and sort them based on the status.
//Installations with alarms go first
let a_status = getStatus(a.id);
let b_status = getStatus(b.id);
if (a_status > b_status) {
return -1;
}
if (a_status < b_status) {
return 1;
}
return 0;
});
const handleSelectOneInstallation = (installationID: number): void => { const handleSelectOneInstallation = (installationID: number): void => {
if (selectedInstallation != installationID) { if (selectedInstallation != installationID) {
setSelectedInstallation(installationID); setSelectedInstallation(installationID);
@ -115,7 +100,7 @@ const FlatInstallationView = (props: FlatInstallationViewProps) => {
</TableRow> </TableRow>
</TableHead> </TableHead>
<TableBody> <TableBody>
{sortedInstallations.map((installation) => { {props.installations.map((installation) => {
const isInstallationSelected = const isInstallationSelected =
installation.s3BucketId === selectedInstallation; installation.s3BucketId === selectedInstallation;

15
typescript/frontend-marios2/src/content/dashboards/Installations/fetchData.tsx
View File

@ -58,24 +58,15 @@ export const fetchData = (
if (r.status === 404) { if (r.status === 404) {
return Promise.resolve(FetchResult.notAvailable); return Promise.resolve(FetchResult.notAvailable);
} else if (r.status === 200) { } else if (r.status === 200) {
const csvtext = await r.text(); // Assuming the server returns the Base64 encoded ZIP file as text const base64String = await r.text(); // Assuming the server returns the Base64 encoded ZIP file as text
const byteArray = Uint8Array.from(atob(base64String), (c) =>
//const response = await fetch(url); // Fetch the resource from the server
const contentEncoding = r.headers.get('content-type');
if (contentEncoding != 'application/base64; charset=utf-8') {
return parseCsv(csvtext);
}
const byteArray = Uint8Array.from(atob(csvtext), (c) =>
c.charCodeAt(0) c.charCodeAt(0)
); );
//Decompress the byte array using JSZip // Decompress the byte array using JSZip
const zip = await JSZip.loadAsync(byteArray); const zip = await JSZip.loadAsync(byteArray);
// Assuming the CSV file is named "data.csv" inside the ZIP archive // Assuming the CSV file is named "data.csv" inside the ZIP archive
const csvContent = await zip.file('data.csv').async('text'); const csvContent = await zip.file('data.csv').async('text');
return parseCsv(csvContent); return parseCsv(csvContent);
} else { } else {
return Promise.resolve(FetchResult.notAvailable); return Promise.resolve(FetchResult.notAvailable);

652
typescript/frontend-marios2/src/content/dashboards/Overview/overview.tsx
View File

@ -45,10 +45,14 @@ function Overview(props: OverviewProps) {
const { currentUser } = context; const { currentUser } = context;
const [dailyData, setDailyData] = useState(true); const [dailyData, setDailyData] = useState(true);
const [aggregatedData, setAggregatedData] = useState(false); const [weeklyData, setWeeklyData] = useState(false);
const [weeklybalance, setWeeklyBalance] = useState([]);
const [monthlybalance, setMonthlyBalance] = useState([]);
const [monthlyData, setMonthlyData] = useState(false);
const [loading, setLoading] = useState(true); const [loading, setLoading] = useState(true);
const [chartState, setChartState] = useState(0); const [chartState, setChartState] = useState(0);
const [aggregatedChartState, setAggregatedChartState] = useState(0); const [monthlyDateList, setMonthlyDateList] = useState([]);
const [weeklyDateList, setWeeklyDateList] = useState([]);
const [isDateModalOpen, setIsDateModalOpen] = useState(false); const [isDateModalOpen, setIsDateModalOpen] = useState(false);
const [isErrorDateModalOpen, setErrorDateModalOpen] = useState(false); const [isErrorDateModalOpen, setErrorDateModalOpen] = useState(false);
const [dateSelectionError, setDateSelectionError] = useState(''); const [dateSelectionError, setDateSelectionError] = useState('');
@ -60,18 +64,19 @@ function Overview(props: OverviewProps) {
}[] }[]
>([]); >([]);
const [aggregatedDataArray, setAggregatedDataArray] = useState<
{
chartData: chartAggregatedDataInterface;
chartOverview: overviewInterface;
datelist: any[];
netbalance: any[];
}[]
>([]);
const [startDate, setStartDate] = useState(dayjs().add(-1, 'day')); const [startDate, setStartDate] = useState(dayjs().add(-1, 'day'));
const [endDate, setEndDate] = useState(dayjs()); const [endDate, setEndDate] = useState(dayjs());
const [weeklyDataArray, setWeeklyDataArray] = useState<{
chartData: chartAggregatedDataInterface;
chartOverview: overviewInterface;
}>({ chartData: null, chartOverview: null });
const [monthlyDataArray, setMonthlyDataArray] = useState<{
chartData: chartAggregatedDataInterface;
chartOverview: overviewInterface;
}>({ chartData: null, chartOverview: null });
useEffect(() => { useEffect(() => {
const resultPromise: Promise<{ const resultPromise: Promise<{
chartData: chartDataInterface; chartData: chartDataInterface;
@ -130,19 +135,17 @@ function Overview(props: OverviewProps) {
const handle24HourData = () => { const handle24HourData = () => {
setDailyData(true); setDailyData(true);
setAggregatedData(false); setWeeklyData(false);
setMonthlyData(false);
setChartState(0); setChartState(0);
}; };
const handleWeekData = () => { const handleWeekData = () => {
setDailyData(false); setDailyData(false);
setAggregatedData(true); setWeeklyData(true);
setAggregatedChartState(0); setMonthlyData(false);
if ( if (weeklyDataArray.chartData != null) {
aggregatedDataArray[aggregatedChartState] &&
aggregatedDataArray[aggregatedChartState].chartData != null
) {
return; return;
} }
setLoading(true); setLoading(true);
@ -150,15 +153,15 @@ function Overview(props: OverviewProps) {
const resultPromise: Promise<{ const resultPromise: Promise<{
chartAggregatedData: chartAggregatedDataInterface; chartAggregatedData: chartAggregatedDataInterface;
chartOverview: overviewInterface; chartOverview: overviewInterface;
}> = transformInputToAggregatedData( }> = transformInputToAggregatedData(props.s3Credentials, 'weekly');
props.s3Credentials,
dayjs().subtract(1, 'week'),
dayjs()
);
resultPromise resultPromise
.then((result) => { .then((result) => {
setWeeklyDataArray({
chartData: result.chartAggregatedData,
chartOverview: result.chartOverview
});
const powerDifference = []; const powerDifference = [];
for ( for (
let i = 0; let i = 0;
@ -171,16 +174,8 @@ function Overview(props: OverviewProps) {
); );
} }
setAggregatedDataArray((prevData) => setWeeklyBalance(powerDifference);
prevData.concat({ setWeeklyDateList(computeLast7Days());
chartData: result.chartAggregatedData,
chartOverview: result.chartOverview,
datelist: computeLast7Days(),
netbalance: powerDifference
})
);
setAggregatedChartState(aggregatedDataArray.length);
setLoading(false); setLoading(false);
}) })
.catch((error) => { .catch((error) => {
@ -217,100 +212,88 @@ function Overview(props: OverviewProps) {
} }
setLoading(true); setLoading(true);
const resultPromise: Promise<{
chartData: chartDataInterface;
chartOverview: overviewInterface;
}> = transformInputToDailyData(
props.s3Credentials,
UnixTime.fromTicks(startDate.unix()),
UnixTime.fromTicks(endDate.unix())
);
if (dailyData) { resultPromise
const resultPromise: Promise<{ .then((result) => {
chartData: chartDataInterface; setDailyDataArray((prevData) =>
chartOverview: overviewInterface; prevData.concat({
}> = transformInputToDailyData( chartData: result.chartData,
props.s3Credentials, chartOverview: result.chartOverview
UnixTime.fromTicks(startDate.unix()), })
UnixTime.fromTicks(endDate.unix()) );
);
resultPromise setLoading(false);
.then((result) => { setChartState(dailyDataArray.length);
setDailyDataArray((prevData) => })
prevData.concat({ .catch((error) => {
chartData: result.chartData, console.error('Error:', error);
chartOverview: result.chartOverview });
})
);
setLoading(false);
setChartState(dailyDataArray.length);
})
.catch((error) => {
console.error('Error:', error);
});
} else {
setDailyData(false);
setAggregatedData(true);
setLoading(true);
const resultPromise: Promise<{
chartAggregatedData: chartAggregatedDataInterface;
chartOverview: overviewInterface;
dateList: string[];
}> = transformInputToAggregatedData(
props.s3Credentials,
startDate,
endDate
);
resultPromise
.then((result) => {
const powerDifference = [];
for (
let i = 0;
i < result.chartAggregatedData.gridImportPower.data.length;
i++
) {
powerDifference.push(
result.chartAggregatedData.gridImportPower.data[i] -
Math.abs(result.chartAggregatedData.gridExportPower.data[i])
);
}
setAggregatedDataArray((prevData) =>
prevData.concat({
chartData: result.chartAggregatedData,
chartOverview: result.chartOverview,
datelist: result.dateList,
netbalance: powerDifference
})
);
setAggregatedChartState(aggregatedDataArray.length);
setLoading(false);
})
.catch((error) => {
console.error('Error:', error);
});
}
}; };
const handleGoBack = () => { const handleGoBack = () => {
if (dailyData && chartState > 0) { if (chartState > 0) {
setChartState(chartState - 1); setChartState(chartState - 1);
} }
if (aggregatedData && aggregatedChartState > 0) {
setAggregatedChartState(aggregatedChartState - 1);
}
}; };
const handleGoForward = () => { const handleGoForward = () => {
if (dailyData && chartState + 1 < dailyDataArray.length) { if (chartState + 1 < dailyDataArray.length) {
setChartState(chartState + 1); setChartState(chartState + 1);
} }
if ( };
aggregatedData &&
aggregatedChartState + 1 < aggregatedDataArray.length const handleMonthData = () => {
) { setDailyData(false);
setAggregatedChartState(aggregatedChartState + 1); setWeeklyData(false);
setMonthlyData(true);
if (monthlyDataArray.chartData != null) {
return;
} }
setLoading(true);
const resultPromise: Promise<{
chartAggregatedData: chartAggregatedDataInterface;
chartOverview: overviewInterface;
dateList: string[];
}> = transformInputToAggregatedData(props.s3Credentials, 'monthly');
resultPromise
.then((result) => {
setMonthlyDataArray({
chartData: result.chartAggregatedData,
chartOverview: result.chartOverview
});
const powerDifference = [];
for (
let i = 0;
i < result.chartAggregatedData.gridImportPower.data.length;
i++
) {
powerDifference.push(
result.chartAggregatedData.gridImportPower.data[i] -
Math.abs(result.chartAggregatedData.gridExportPower.data[i])
);
}
setMonthlyBalance(powerDifference);
setMonthlyDateList(result.dateList);
setLoading(false);
})
.catch((error) => {
console.error('Error:', error);
});
}; };
const renderGraphs = () => { const renderGraphs = () => {
@ -455,74 +438,86 @@ function Overview(props: OverviewProps) {
sx={{ sx={{
marginTop: '20px', marginTop: '20px',
marginLeft: '10px', marginLeft: '10px',
backgroundColor: aggregatedData ? '#808080' : '#ffc04d', backgroundColor: weeklyData ? '#808080' : '#ffc04d',
color: '#000000', color: '#000000',
'&:hover': { bgcolor: '#f7b34d' } '&:hover': { bgcolor: '#f7b34d' }
}} }}
> >
<FormattedMessage id="lastweek" defaultMessage="Last week" /> <FormattedMessage id="lastweek" defaultMessage="Last week" />
</Button> </Button>
{/*<Button*/}
<Button {/* variant="contained"*/}
variant="contained" {/* onClick={handleMonthData}*/}
onClick={handleSetDate} {/* disabled={loading}*/}
disabled={loading} {/* sx={{*/}
sx={{ {/* marginTop: '20px',*/}
marginTop: '20px', {/* marginLeft: '10px',*/}
marginLeft: '10px', {/* backgroundColor: monthlyData ? '#808080' : '#ffc04d',*/}
backgroundColor: dateOpen ? '#808080' : '#ffc04d', {/* color: '#000000',*/}
color: '#000000', {/* '&:hover': { bgcolor: '#f7b34d' }*/}
'&:hover': { bgcolor: '#f7b34d' } {/* }}*/}
}} {/*>*/}
> {/* <FormattedMessage id="lastmonth" defaultMessage="Last Month" />*/}
<FormattedMessage id="lastmonth" defaultMessage="Set Date" /> {/*</Button>*/}
</Button> {dailyData && (
<>
<Button
variant="contained"
onClick={handleSetDate}
disabled={loading}
sx={{
marginTop: '20px',
marginLeft: '10px',
backgroundColor: dateOpen ? '#808080' : '#ffc04d',
color: '#000000',
'&:hover': { bgcolor: '#f7b34d' }
}}
>
<FormattedMessage id="lastmonth" defaultMessage="Set Date" />
</Button>
</>
)}
</Grid> </Grid>
{dailyData && (
<Grid <Grid
container container
justifyContent="flex-end" justifyContent="flex-end"
alignItems="center" alignItems="center"
item item
xs={6} xs={6}
md={6} md={6}
>
<Button
variant="contained"
disabled={
dailyData ? !(chartState > 0) : !(aggregatedChartState > 0)
}
onClick={handleGoBack}
sx={{
marginTop: '20px',
marginLeft: '10px',
backgroundColor: '#ffc04d',
color: '#000000',
'&:hover': { bgcolor: '#f7b34d' }
}}
> >
<FormattedMessage id="goback" defaultMessage="Zoom out" /> <Button
</Button> variant="contained"
disabled={!(chartState > 0)}
onClick={handleGoBack}
sx={{
marginTop: '20px',
marginLeft: '10px',
backgroundColor: '#ffc04d',
color: '#000000',
'&:hover': { bgcolor: '#f7b34d' }
}}
>
<FormattedMessage id="goback" defaultMessage="Zoom out" />
</Button>
<Button <Button
variant="contained" variant="contained"
disabled={ disabled={!(chartState < dailyDataArray.length - 1)}
dailyData onClick={handleGoForward}
? !(chartState < dailyDataArray.length - 1) sx={{
: !(aggregatedChartState < aggregatedDataArray.length - 1) marginTop: '20px',
} marginLeft: '10px',
onClick={handleGoForward} backgroundColor: '#ffc04d',
sx={{ color: '#000000',
marginTop: '20px', '&:hover': { bgcolor: '#f7b34d' }
marginLeft: '10px', }}
backgroundColor: '#ffc04d', >
color: '#000000', <FormattedMessage id="goback" defaultMessage="Zoom in" />
'&:hover': { bgcolor: '#f7b34d' } </Button>
}} </Grid>
> )}
<FormattedMessage id="goback" defaultMessage="Zoom in" />
</Button>
</Grid>
{loading && ( {loading && (
<Container <Container
@ -624,7 +619,7 @@ function Overview(props: OverviewProps) {
</Grid> </Grid>
)} )}
{aggregatedData && ( {(weeklyData || monthlyData) && (
<Grid <Grid
container container
direction="row" direction="row"
@ -665,46 +660,81 @@ function Overview(props: OverviewProps) {
></Box> ></Box>
</Box> </Box>
<ReactApexChart {weeklyData && (
options={{ <ReactApexChart
...getChartOptions( options={{
aggregatedDataArray[aggregatedChartState] ...getChartOptions(
.chartOverview.overview, weeklyDataArray.chartOverview.overview,
'overview', 'overview',
aggregatedDataArray[aggregatedChartState].datelist, weeklyDateList,
true true
) )
}} }}
series={[ series={[
{ {
...aggregatedDataArray[aggregatedChartState] ...weeklyDataArray.chartData.gridImportPower,
.chartData.gridImportPower, color: '#b30000',
color: '#b30000', type: 'bar'
type: 'bar' },
}, {
{ ...weeklyDataArray.chartData.gridExportPower,
...aggregatedDataArray[aggregatedChartState] color: '#ff3333',
.chartData.gridExportPower, type: 'bar'
color: '#ff3333', },
type: 'bar' {
}, ...weeklyDataArray.chartData.pvProduction,
{ type: 'bar',
...aggregatedDataArray[aggregatedChartState] color: '#ff9900'
.chartData.pvProduction, },
type: 'bar', {
color: '#ff9900' name: 'Net Energy',
}, color: '#ff3333',
{ type: 'line',
name: 'Net Energy', data: weeklybalance
color: '#ff3333', }
type: 'line', ]}
data: aggregatedDataArray[aggregatedChartState] height={400}
.netbalance type={'bar'}
} />
]} )}
height={400}
type={'bar'} {monthlyData && (
/> <ReactApexChart
options={{
...getChartOptions(
monthlyDataArray.chartOverview.overview,
'overview',
monthlyDateList,
true
)
}}
series={[
{
...monthlyDataArray.chartData.gridImportPower,
color: '#b30000',
type: 'bar'
},
{
...monthlyDataArray.chartData.gridExportPower,
color: '#ff3333',
type: 'bar'
},
{
...monthlyDataArray.chartData.pvProduction,
color: '#ff9900',
type: 'bar'
},
{
name: 'Net Energy',
type: 'line',
data: monthlybalance,
color: '#666666'
}
]}
height={400}
type={'bar'}
/>
)}
</Card> </Card>
</Grid> </Grid>
</Grid> </Grid>
@ -776,26 +806,48 @@ function Overview(props: OverviewProps) {
/> />
)} )}
{aggregatedData && ( {weeklyData && (
<ReactApexChart <ReactApexChart
options={{ options={{
...getChartOptions( ...getChartOptions(
aggregatedDataArray[aggregatedChartState] weeklyDataArray.chartOverview.soc,
.chartOverview.soc,
'weekly', 'weekly',
aggregatedDataArray[aggregatedChartState].datelist, weeklyDateList,
true true
) )
}} }}
series={[ series={[
{ {
...aggregatedDataArray[aggregatedChartState] ...weeklyDataArray.chartData.minsoc,
.chartData.minsoc,
color: '#69d2e7' color: '#69d2e7'
}, },
{ {
...aggregatedDataArray[aggregatedChartState] ...weeklyDataArray.chartData.maxsoc,
.chartData.maxsoc, color: '#008FFB'
}
]}
type="bar"
height={400}
/>
)}
{monthlyData && (
<ReactApexChart
options={{
...getChartOptions(
monthlyDataArray.chartOverview.soc,
'monthly',
monthlyDateList,
true
)
}}
series={[
{
...monthlyDataArray.chartData.minsoc,
color: '#69d2e7'
},
{
...monthlyDataArray.chartData.maxsoc,
color: '#008FFB' color: '#008FFB'
} }
]} ]}
@ -866,31 +918,27 @@ function Overview(props: OverviewProps) {
/> />
)} )}
{aggregatedData && currentUser.userType == UserType.admin && ( {weeklyData && currentUser.userType == UserType.admin && (
<ReactApexChart <ReactApexChart
options={{ options={{
...getChartOptions( ...getChartOptions(
aggregatedDataArray[aggregatedChartState] weeklyDataArray.chartOverview.dcPower,
.chartOverview.dcPower,
'weekly', 'weekly',
aggregatedDataArray[aggregatedChartState].datelist, weeklyDateList,
false false
) )
}} }}
series={[ series={[
{ {
...aggregatedDataArray[aggregatedChartState] ...weeklyDataArray.chartData.dcChargingPower,
.chartData.dcChargingPower,
color: '#008FFB' color: '#008FFB'
}, },
{ {
...aggregatedDataArray[aggregatedChartState] ...weeklyDataArray.chartData.heatingPower,
.chartData.heatingPower,
color: '#ff9900' color: '#ff9900'
}, },
{ {
...aggregatedDataArray[aggregatedChartState] ...weeklyDataArray.chartData.dcDischargingPower,
.chartData.dcDischargingPower,
color: '#69d2e7' color: '#69d2e7'
} }
]} ]}
@ -899,27 +947,80 @@ function Overview(props: OverviewProps) {
/> />
)} )}
{aggregatedData && currentUser.userType == UserType.client && ( {weeklyData && currentUser.userType == UserType.client && (
<ReactApexChart <ReactApexChart
options={{ options={{
...getChartOptions( ...getChartOptions(
aggregatedDataArray[aggregatedChartState] weeklyDataArray.chartOverview.dcPowerWithoutHeating,
.chartOverview.dcPowerWithoutHeating,
'weekly', 'weekly',
aggregatedDataArray[aggregatedChartState].datelist, weeklyDateList,
true true
) )
}} }}
series={[ series={[
{ {
...aggregatedDataArray[aggregatedChartState] ...weeklyDataArray.chartData.dcChargingPower,
.chartData.dcChargingPower,
color: '#008FFB' color: '#008FFB'
}, },
{ {
...aggregatedDataArray[aggregatedChartState] ...weeklyDataArray.chartData.dcDischargingPower,
.chartData.dcDischargingPower, color: '#69d2e7'
}
]}
type="bar"
height={400}
/>
)}
{monthlyData && currentUser.userType == UserType.admin && (
<ReactApexChart
options={{
...getChartOptions(
monthlyDataArray.chartOverview.dcPower,
'monthly',
monthlyDateList,
false
)
}}
series={[
{
...monthlyDataArray.chartData.dcChargingPower,
color: '#008FFB'
},
{
...weeklyDataArray.chartData.heatingPower,
color: '#ff9900'
},
{
...monthlyDataArray.chartData.dcDischargingPower,
color: '#69d2e7'
}
]}
type="bar"
height={400}
/>
)}
{monthlyData && currentUser.userType == UserType.client && (
<ReactApexChart
options={{
...getChartOptions(
monthlyDataArray.chartOverview
.dcPowerWithoutHeating,
'monthly',
monthlyDateList,
true
)
}}
series={[
{
...monthlyDataArray.chartData.dcChargingPower,
color: '#008FFB'
},
{
...monthlyDataArray.chartData.dcDischargingPower,
color: '#69d2e7' color: '#69d2e7'
} }
]} ]}
@ -1127,21 +1228,40 @@ function Overview(props: OverviewProps) {
/> />
)} )}
{aggregatedData && ( {weeklyData && (
<ReactApexChart <ReactApexChart
options={{ options={{
...getChartOptions( ...getChartOptions(
aggregatedDataArray[aggregatedChartState] weeklyDataArray.chartOverview.pvProduction,
.chartOverview.pvProduction,
'weekly', 'weekly',
aggregatedDataArray[aggregatedChartState].datelist, weeklyDateList,
true true
) )
}} }}
series={[ series={[
{ {
...aggregatedDataArray[aggregatedChartState] ...weeklyDataArray.chartData.pvProduction,
.chartData.pvProduction, color: '#ff9900'
}
]}
type="bar"
height={400}
/>
)}
{monthlyData && (
<ReactApexChart
options={{
...getChartOptions(
monthlyDataArray.chartOverview.pvProduction,
'monthly',
monthlyDateList,
true
)
}}
series={[
{
...monthlyDataArray.chartData.pvProduction,
color: '#ff9900' color: '#ff9900'
} }
]} ]}
@ -1210,27 +1330,49 @@ function Overview(props: OverviewProps) {
height={400} height={400}
/> />
)} )}
{aggregatedData && ( {weeklyData && (
<ReactApexChart <ReactApexChart
options={{ options={{
...getChartOptions( ...getChartOptions(
aggregatedDataArray[aggregatedChartState] weeklyDataArray.chartOverview.gridPower,
.chartOverview.gridPower,
'weekly', 'weekly',
aggregatedDataArray[aggregatedChartState].datelist, weeklyDateList,
true true
) )
}} }}
series={[ series={[
{ {
...aggregatedDataArray[aggregatedChartState] ...weeklyDataArray.chartData.gridImportPower,
.chartData.gridImportPower,
color: '#b30000' color: '#b30000'
}, },
{ {
...aggregatedDataArray[aggregatedChartState] ...weeklyDataArray.chartData.gridExportPower,
.chartData.gridExportPower, color: '#ff3333'
}
]}
type="bar"
height={400}
/>
)}
{monthlyData && (
<ReactApexChart
options={{
...getChartOptions(
monthlyDataArray.chartOverview.gridPower,
'monthly',
monthlyDateList,
true
)
}}
series={[
{
...monthlyDataArray.chartData.gridImportPower,
color: '#b30000'
},
{
...monthlyDataArray.chartData.gridExportPower,
color: '#ff3333' color: '#ff3333'
} }
]} ]}

17
typescript/frontend-marios2/src/interfaces/Chart.tsx
View File

@ -424,8 +424,7 @@ export const transformInputToDailyData = async (
export const transformInputToAggregatedData = async ( export const transformInputToAggregatedData = async (
s3Credentials: I_S3Credentials, s3Credentials: I_S3Credentials,
start_date: dayjs.Dayjs, type: string
end_date: dayjs.Dayjs
): Promise<{ ): Promise<{
chartAggregatedData: chartAggregatedDataInterface; chartAggregatedData: chartAggregatedDataInterface;
chartOverview: overviewInterface; chartOverview: overviewInterface;
@ -436,11 +435,11 @@ export const transformInputToAggregatedData = async (
const MAX_NUMBER = 9999999; const MAX_NUMBER = 9999999;
const dateList = []; const dateList = [];
//let currentDate = dayjs(); let currentDate = dayjs();
let currentDay = start_date; let currentDay =
// type === 'weekly' type === 'weekly'
// ? currentDate.subtract(1, 'week') ? currentDate.subtract(1, 'week')
// : currentDate.subtract(1, 'month'); : currentDate.subtract(1, 'month');
const pathsToSearch = [ const pathsToSearch = [
'/MinSoc', '/MinSoc',
@ -498,7 +497,7 @@ export const transformInputToAggregatedData = async (
const timestampPromises = []; const timestampPromises = [];
while (currentDay.isBefore(end_date)) { while (currentDay.isBefore(currentDate)) {
timestampPromises.push( timestampPromises.push(
fetchDailyData(currentDay.format('YYYY-MM-DD'), s3Credentials) fetchDailyData(currentDay.format('YYYY-MM-DD'), s3Credentials)
); );
@ -506,7 +505,7 @@ export const transformInputToAggregatedData = async (
} }
const results = await Promise.all(timestampPromises); const results = await Promise.all(timestampPromises);
currentDay = start_date; currentDay = currentDate.subtract(1, 'month');
for (let i = 0; i < results.length; i++) { for (let i = 0; i < results.length; i++) {
const result = results[i]; const result = results[i];