Refactored all files, made a few new folders, corrected misleading names, removed unused stuff
This commit is contained in:
Sina Blattmann
parent
c8922c5e58
commit
04cf8c5cd1
|
|
@ -1,136 +0,0 @@
|
||||||
{
|
|
||||||
"Information": {
|
|
||||||
"defaultMessage": "Information"
|
|
||||||
},
|
|
||||||
"addNewChild": {
|
|
||||||
"defaultMessage": "Neues Kind hinzufügen"
|
|
||||||
},
|
|
||||||
"addNewDialogButton": {
|
|
||||||
"defaultMessage": "Neue Dialogschaltfläche hinzufügen"
|
|
||||||
},
|
|
||||||
"addUser": {
|
|
||||||
"defaultMessage": "Nutzer erstellen"
|
|
||||||
},
|
|
||||||
"alarms": {
|
|
||||||
"defaultMessage": "Alarme"
|
|
||||||
},
|
|
||||||
"applyChanges": {
|
|
||||||
"defaultMessage": "Änderungen speichern"
|
|
||||||
},
|
|
||||||
"country": {
|
|
||||||
"defaultMessage": "Land"
|
|
||||||
},
|
|
||||||
"createNewFolder": {
|
|
||||||
"defaultMessage": "Neuen Ordner erstellen"
|
|
||||||
},
|
|
||||||
"createNewUser": {
|
|
||||||
"defaultMessage": "Neuen Nutzer erstellen"
|
|
||||||
},
|
|
||||||
"customerName": {
|
|
||||||
"defaultMessage": "Kundenname"
|
|
||||||
},
|
|
||||||
"email": {
|
|
||||||
"defaultMessage": "Email"
|
|
||||||
},
|
|
||||||
"english": {
|
|
||||||
"defaultMessage": "Englisch"
|
|
||||||
},
|
|
||||||
"error": {
|
|
||||||
},
|
|
||||||
"folder": {
|
|
||||||
"defaultMessage": "Ordner"
|
|
||||||
},
|
|
||||||
"german": {
|
|
||||||
"defaultMessage": "Deutsch"
|
|
||||||
},
|
|
||||||
"groupTabs": {
|
|
||||||
"defaultMessage": "Gruppen"
|
|
||||||
},
|
|
||||||
"groupTree": {
|
|
||||||
"defaultMessage": "Gruppenbaum"
|
|
||||||
},
|
|
||||||
"information": {
|
|
||||||
"defaultMessage": "Information"
|
|
||||||
},
|
|
||||||
"inheritedAccess": {
|
|
||||||
"defaultMessage": "Vererbter Zugriff von"
|
|
||||||
},
|
|
||||||
"installation": {
|
|
||||||
"defaultMessage": "Installation"
|
|
||||||
},
|
|
||||||
"installationTabs": {
|
|
||||||
"defaultMessage": "Installationen"
|
|
||||||
},
|
|
||||||
"installations": {
|
|
||||||
"defaultMessage": "Installationen"
|
|
||||||
},
|
|
||||||
"lastWeek": {
|
|
||||||
"defaultMessage": "Letzte Woche"
|
|
||||||
},
|
|
||||||
"location": {
|
|
||||||
"defaultMessage": "Standort"
|
|
||||||
},
|
|
||||||
"log": {
|
|
||||||
"defaultMessage": "Logbuch"
|
|
||||||
},
|
|
||||||
"logout": {
|
|
||||||
"defaultMessage": "Abmelden"
|
|
||||||
},
|
|
||||||
"makeASelection": {
|
|
||||||
"defaultMessage": "Bitte wählen Sie links eine Auswahl"
|
|
||||||
},
|
|
||||||
"manageAccess": {
|
|
||||||
"defaultMessage": "Zugriff verwalten"
|
|
||||||
},
|
|
||||||
"move": {
|
|
||||||
"defaultMessage": "Verschieben"
|
|
||||||
},
|
|
||||||
"moveTo": {
|
|
||||||
"defaultMessage": "Verschieben zu"
|
|
||||||
},
|
|
||||||
"moveTree": {
|
|
||||||
"defaultMessage": "Baum verschieben"
|
|
||||||
},
|
|
||||||
"name": {
|
|
||||||
"defaultMessage": "Name"
|
|
||||||
},
|
|
||||||
"navigationTabs": {
|
|
||||||
"defaultMessage": "Navigation"
|
|
||||||
},
|
|
||||||
"orderNumbers": {
|
|
||||||
"defaultMessage": "Bestellnummer"
|
|
||||||
},
|
|
||||||
"region": {
|
|
||||||
"defaultMessage": "Region"
|
|
||||||
},
|
|
||||||
"requiredLocation": {
|
|
||||||
"defaultMessage": "Standort ist erforderlich"
|
|
||||||
},
|
|
||||||
"requiredName": {
|
|
||||||
"defaultMessage": "Name ist erforderlich"
|
|
||||||
},
|
|
||||||
"requiredRegion": {
|
|
||||||
"defaultMessage": "Region ist erforderlich"
|
|
||||||
},
|
|
||||||
"search": {
|
|
||||||
"defaultMessage": "Suche"
|
|
||||||
},
|
|
||||||
"submit": {
|
|
||||||
"defaultMessage": "Senden"
|
|
||||||
},
|
|
||||||
"updateFolderErrorMessage": {
|
|
||||||
"defaultMessage": "Fehler, Ordner kann nicht aktualisiert werden"
|
|
||||||
},
|
|
||||||
"updatedSuccessfully": {
|
|
||||||
"defaultMessage": "Erfolgreich aktualisiert"
|
|
||||||
},
|
|
||||||
"user": {
|
|
||||||
"defaultMessage": "Nutzer"
|
|
||||||
},
|
|
||||||
"userTabs": {
|
|
||||||
"defaultMessage": "Nutzer"
|
|
||||||
},
|
|
||||||
"users": {
|
|
||||||
"defaultMessage": "Nutzer"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
@ -1,47 +0,0 @@
|
||||||
{
|
|
||||||
"Information": "Information",
|
|
||||||
"addNewChild": "Add new child",
|
|
||||||
"addNewDialogButton": "Add new dialog button",
|
|
||||||
"addUser": "Create user",
|
|
||||||
"alarms": "Alarms",
|
|
||||||
"applyChanges": "Apply changes",
|
|
||||||
"country": "Country",
|
|
||||||
"createNewFolder": "Create new folder",
|
|
||||||
"createNewUser": "Create new user",
|
|
||||||
"customerName": "Customer",
|
|
||||||
"email": "Email",
|
|
||||||
"english": "English",
|
|
||||||
"error": {},
|
|
||||||
"folder": "Folder",
|
|
||||||
"german": "German",
|
|
||||||
"groupTabs": "Group tabs",
|
|
||||||
"groupTree": "Group tree",
|
|
||||||
"information": "Information",
|
|
||||||
"inheritedAccess": "Inherited access from",
|
|
||||||
"installation": "Installation",
|
|
||||||
"installationTabs": "Installation tabs",
|
|
||||||
"installations": "Installations",
|
|
||||||
"lastWeek": "Last week",
|
|
||||||
"location": "Location",
|
|
||||||
"log": "Log",
|
|
||||||
"logout": "Logout",
|
|
||||||
"makeASelection": "Please make a selection on the left",
|
|
||||||
"manageAccess": "Manage access",
|
|
||||||
"move": "Move",
|
|
||||||
"moveTo": "Move to",
|
|
||||||
"moveTree": "Move tree",
|
|
||||||
"name": "Name",
|
|
||||||
"navigationTabs": "Navigation tabs",
|
|
||||||
"orderNumbers": "Order number",
|
|
||||||
"region": "Region",
|
|
||||||
"requiredLocation": "Location is required",
|
|
||||||
"requiredName": "Name is required",
|
|
||||||
"requiredRegion": "Region is required",
|
|
||||||
"search": "Search",
|
|
||||||
"submit": "Submit",
|
|
||||||
"updateFolderErrorMessage": "Couldn't update folder, an error occured",
|
|
||||||
"updatedSuccessfully": "Updated successfully",
|
|
||||||
"user": "User",
|
|
||||||
"userTabs": "user tabs",
|
|
||||||
"users": "Users"
|
|
||||||
}
|
|
||||||
|
|
@ -1,136 +0,0 @@
|
||||||
{
|
|
||||||
"Information": {
|
|
||||||
"defaultMessage": "Informations"
|
|
||||||
},
|
|
||||||
"addNewChild": {
|
|
||||||
"defaultMessage": "Ajouter un nouvel enfant"
|
|
||||||
},
|
|
||||||
"addNewDialogButton": {
|
|
||||||
"defaultMessage": "Ajouter un nouveau bouton de dialogue"
|
|
||||||
},
|
|
||||||
"addUser": {
|
|
||||||
"defaultMessage": "Créer un utilisateur"
|
|
||||||
},
|
|
||||||
"alarms": {
|
|
||||||
"defaultMessage": "Alarmes"
|
|
||||||
},
|
|
||||||
"applyChanges": {
|
|
||||||
"defaultMessage": "Appliquer les modifications"
|
|
||||||
},
|
|
||||||
"country": {
|
|
||||||
"defaultMessage": "Pays"
|
|
||||||
},
|
|
||||||
"createNewFolder": {
|
|
||||||
"defaultMessage": "Créer un nouveau dossier"
|
|
||||||
},
|
|
||||||
"createNewUser": {
|
|
||||||
"defaultMessage": "Créer un nouvel utilisateur"
|
|
||||||
},
|
|
||||||
"customerName": {
|
|
||||||
"defaultMessage": "Nom du client"
|
|
||||||
},
|
|
||||||
"email": {
|
|
||||||
"defaultMessage": "E-mail"
|
|
||||||
},
|
|
||||||
"english": {
|
|
||||||
"defaultMessage": "Anglais"
|
|
||||||
},
|
|
||||||
"error": {
|
|
||||||
},
|
|
||||||
"folder": {
|
|
||||||
"defaultMessage": "Dossier"
|
|
||||||
},
|
|
||||||
"german": {
|
|
||||||
"defaultMessage": "Allemand"
|
|
||||||
},
|
|
||||||
"groupTabs": {
|
|
||||||
"defaultMessage": "Onglets de groupe"
|
|
||||||
},
|
|
||||||
"groupTree": {
|
|
||||||
"defaultMessage": "Arbre de groupe"
|
|
||||||
},
|
|
||||||
"information": {
|
|
||||||
"defaultMessage": "Informations"
|
|
||||||
},
|
|
||||||
"inheritedAccess": {
|
|
||||||
"defaultMessage": "Accès hérité de"
|
|
||||||
},
|
|
||||||
"installation": {
|
|
||||||
"defaultMessage": "Installation"
|
|
||||||
},
|
|
||||||
"installationTabs": {
|
|
||||||
"defaultMessage": "Onglets d'installation"
|
|
||||||
},
|
|
||||||
"installations": {
|
|
||||||
"defaultMessage": "Installations"
|
|
||||||
},
|
|
||||||
"lastWeek": {
|
|
||||||
"defaultMessage": "La semaine dernière"
|
|
||||||
},
|
|
||||||
"location": {
|
|
||||||
"defaultMessage": "Localisation"
|
|
||||||
},
|
|
||||||
"log": {
|
|
||||||
"defaultMessage": "Journal"
|
|
||||||
},
|
|
||||||
"logout": {
|
|
||||||
"defaultMessage": "Déconnexion"
|
|
||||||
},
|
|
||||||
"makeASelection": {
|
|
||||||
"defaultMessage": "Veuillez faire une sélection à gauche"
|
|
||||||
},
|
|
||||||
"manageAccess": {
|
|
||||||
"defaultMessage": "Gérer l'accès"
|
|
||||||
},
|
|
||||||
"move": {
|
|
||||||
"defaultMessage": "Déplacer"
|
|
||||||
},
|
|
||||||
"moveTo": {
|
|
||||||
"defaultMessage": "Déplacer à"
|
|
||||||
},
|
|
||||||
"moveTree": {
|
|
||||||
"defaultMessage": "Déplacer l'arbre"
|
|
||||||
},
|
|
||||||
"name": {
|
|
||||||
"defaultMessage": "Nom"
|
|
||||||
},
|
|
||||||
"navigationTabs": {
|
|
||||||
"defaultMessage": "Onglets de navigation"
|
|
||||||
},
|
|
||||||
"orderNumbers": {
|
|
||||||
"defaultMessage": "Numéro de commande"
|
|
||||||
},
|
|
||||||
"region": {
|
|
||||||
"defaultMessage": "Région"
|
|
||||||
},
|
|
||||||
"requiredLocation": {
|
|
||||||
"defaultMessage": "L'emplacement est requis"
|
|
||||||
},
|
|
||||||
"requiredName": {
|
|
||||||
"defaultMessage": "Le nom est obligatoire"
|
|
||||||
},
|
|
||||||
"requiredRegion": {
|
|
||||||
"defaultMessage": "La région est obligatoire"
|
|
||||||
},
|
|
||||||
"search": {
|
|
||||||
"defaultMessage": "Recherche"
|
|
||||||
},
|
|
||||||
"submit": {
|
|
||||||
"defaultMessage": "Soumettre"
|
|
||||||
},
|
|
||||||
"updateFolderErrorMessage": {
|
|
||||||
"defaultMessage": "Une erreur s'est produite, impossible de mettre à jour le dossier."
|
|
||||||
},
|
|
||||||
"updatedSuccessfully": {
|
|
||||||
"defaultMessage": "Mise à jour réussie"
|
|
||||||
},
|
|
||||||
"user": {
|
|
||||||
"defaultMessage": "Utilisateur"
|
|
||||||
},
|
|
||||||
"userTabs": {
|
|
||||||
"defaultMessage": "Onglets utilisateurs"
|
|
||||||
},
|
|
||||||
"users": {
|
|
||||||
"defaultMessage": "Utilisateurs"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
@ -1,39 +0,0 @@
|
||||||
.App {
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.App-logo {
|
|
||||||
height: 40vmin;
|
|
||||||
pointer-events: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (prefers-reduced-motion: no-preference) {
|
|
||||||
.App-logo {
|
|
||||||
animation: App-logo-spin infinite 20s linear;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.App-header {
|
|
||||||
background-color: #282c34;
|
|
||||||
min-height: 100vh;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
font-size: calc(10px + 2vmin);
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
|
|
||||||
.App-link {
|
|
||||||
color: #61dafb;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
@keyframes App-logo-spin {
|
|
||||||
from {
|
|
||||||
transform: rotate(0deg);
|
|
||||||
}
|
|
||||||
to {
|
|
||||||
transform: rotate(360deg);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
@ -1,9 +0,0 @@
|
||||||
import React from 'react';
|
|
||||||
import { render, screen } from '@testing-library/react';
|
|
||||||
import App from './App';
|
|
||||||
|
|
||||||
test('renders learn react link', () => {
|
|
||||||
render(<App />);
|
|
||||||
const linkElement = screen.getByText(/learn react/i);
|
|
||||||
expect(linkElement).toBeInTheDocument();
|
|
||||||
});
|
|
||||||
|
|
@ -4,7 +4,7 @@ import { BrowserRouter, Navigate, Route, Routes } from "react-router-dom";
|
||||||
|
|
||||||
import { Container, Grid, Box } from "@mui/material";
|
import { Container, Grid, Box } from "@mui/material";
|
||||||
import routes from "./routes.json";
|
import routes from "./routes.json";
|
||||||
import { IntlProvider, MessageFormatElement } from "react-intl";
|
import { IntlProvider } from "react-intl";
|
||||||
import { useContext, useState } from "react";
|
import { useContext, useState } from "react";
|
||||||
import en from "./lang/en.json";
|
import en from "./lang/en.json";
|
||||||
import de from "./lang/de.json";
|
import de from "./lang/de.json";
|
||||||
|
|
@ -28,9 +28,9 @@ const App = () => {
|
||||||
const getTranslations = () => {
|
const getTranslations = () => {
|
||||||
switch (language) {
|
switch (language) {
|
||||||
case "en":
|
case "en":
|
||||||
return de;
|
|
||||||
case "de":
|
|
||||||
return en;
|
return en;
|
||||||
|
case "de":
|
||||||
|
return de;
|
||||||
case "fr":
|
case "fr":
|
||||||
return fr;
|
return fr;
|
||||||
}
|
}
|
||||||
|
|
@ -78,7 +78,7 @@ const App = () => {
|
||||||
bgcolor={colors.greyLight}
|
bgcolor={colors.greyLight}
|
||||||
pt={3}
|
pt={3}
|
||||||
borderTop="2px solid"
|
borderTop="2px solid"
|
||||||
borderColor=" #a8b0be"
|
borderColor={colors.darkGrey}
|
||||||
flex="1 0 auto"
|
flex="1 0 auto"
|
||||||
>
|
>
|
||||||
<Container maxWidth="xl">
|
<Container maxWidth="xl">
|
||||||
|
|
|
||||||
|
|
@ -1,11 +1,5 @@
|
||||||
import React, { useContext, useState } from "react";
|
import React, { useContext, useState } from "react";
|
||||||
import {
|
import { Alert, CircularProgress, Grid, useTheme } from "@mui/material";
|
||||||
Alert,
|
|
||||||
CircularProgress,
|
|
||||||
Grid,
|
|
||||||
Typography,
|
|
||||||
useTheme,
|
|
||||||
} from "@mui/material";
|
|
||||||
import Container from "@mui/material/Container";
|
import Container from "@mui/material/Container";
|
||||||
import { axiosConfigWithoutToken } from "./config/axiosConfig";
|
import { axiosConfigWithoutToken } from "./config/axiosConfig";
|
||||||
import InnovenergyTextfield from "./components/Layout/InnovenergyTextfield";
|
import InnovenergyTextfield from "./components/Layout/InnovenergyTextfield";
|
||||||
|
|
|
||||||
|
|
@ -30,13 +30,6 @@ const S3CredentialsContextProvider = ({
|
||||||
const saveS3Credentials = (credentials: S3Credentials, id: string) => {
|
const saveS3Credentials = (credentials: S3Credentials, id: string) => {
|
||||||
const s3Bucket = id + "-3e5b3069-214a-43ee-8d85-57d72000c19d";
|
const s3Bucket = id + "-3e5b3069-214a-43ee-8d85-57d72000c19d";
|
||||||
setS3Credentials({ s3Bucket, ...credentials });
|
setS3Credentials({ s3Bucket, ...credentials });
|
||||||
/* setS3Credentials({
|
|
||||||
s3Region: "sos-ch-dk-2",
|
|
||||||
s3Provider: "exo.io",
|
|
||||||
s3Key: "EXO15c0bf710e158e9b83270f0a",
|
|
||||||
s3Secret: "Dd5jYSiZtt_Zt5Ba5mDmaiLCdASUaKLfduSKY-SU-lg",
|
|
||||||
s3Bucket: "saliomameiringen",
|
|
||||||
});*/
|
|
||||||
};
|
};
|
||||||
|
|
||||||
const fetchData = (timestamp: UnixTime): Promise<FetchResult<DataRecord>> => {
|
const fetchData = (timestamp: UnixTime): Promise<FetchResult<DataRecord>> => {
|
||||||
|
|
|
||||||
|
|
@ -1,7 +1,7 @@
|
||||||
import { Grid } from "@mui/material";
|
import { Grid } from "@mui/material";
|
||||||
import UsersContextProvider from "../../Context/UsersContextProvider";
|
import UsersContextProvider from "../../Context/UsersContextProvider";
|
||||||
import AvailableUserDialog from "./AvailableUserDialog";
|
import AvailableUserDialog from "./AvailableUserDialog";
|
||||||
import InnovenergyList from "./InnovenergyList";
|
import InnovenergyList from "../../Layout/InnovenergyList";
|
||||||
import UsersWithDirectAccess from "./UsersWithDirectAccess";
|
import UsersWithDirectAccess from "./UsersWithDirectAccess";
|
||||||
import UsersWithInheritedAccess from "./UsersWithInheritedAccess";
|
import UsersWithInheritedAccess from "./UsersWithInheritedAccess";
|
||||||
import { useContext } from "react";
|
import { useContext } from "react";
|
||||||
|
|
|
||||||
|
|
@ -4,7 +4,6 @@ import {
|
||||||
DialogContent,
|
DialogContent,
|
||||||
DialogTitle,
|
DialogTitle,
|
||||||
TextField,
|
TextField,
|
||||||
colors,
|
|
||||||
Alert,
|
Alert,
|
||||||
} from "@mui/material";
|
} from "@mui/material";
|
||||||
import DialogActions from "@mui/material/DialogActions";
|
import DialogActions from "@mui/material/DialogActions";
|
||||||
|
|
|
||||||
|
|
@ -18,11 +18,11 @@ import { UserContext } from "../../Context/UserContextProvider";
|
||||||
import { FormattedMessage } from "react-intl";
|
import { FormattedMessage } from "react-intl";
|
||||||
|
|
||||||
const UsersWithDirectAccess = () => {
|
const UsersWithDirectAccess = () => {
|
||||||
|
const { id } = useParams();
|
||||||
|
const [error, setError] = useState<any>();
|
||||||
const { fetchUsersWithDirectAccessForResource, directAccessUsers } =
|
const { fetchUsersWithDirectAccessForResource, directAccessUsers } =
|
||||||
useContext(UsersContext);
|
useContext(UsersContext);
|
||||||
const [error, setError] = useState<any>();
|
|
||||||
const { currentType } = useContext(GroupContext);
|
const { currentType } = useContext(GroupContext);
|
||||||
const { id } = useParams();
|
|
||||||
const { getCurrentUser } = useContext(UserContext);
|
const { getCurrentUser } = useContext(UserContext);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
|
|
|
||||||
|
|
@ -1,13 +1,10 @@
|
||||||
import { Dialog, DialogContent, DialogTitle, IconButton } from "@mui/material";
|
|
||||||
import { useState } from "react";
|
import { useState } from "react";
|
||||||
import { FormattedMessage, useIntl } from "react-intl";
|
import { FormattedMessage, useIntl } from "react-intl";
|
||||||
import axiosConfig from "../../config/axiosConfig";
|
import axiosConfig from "../../config/axiosConfig";
|
||||||
import { I_Folder, I_Installation } from "../../util/types";
|
import { I_Folder, I_Installation } from "../../util/types";
|
||||||
import FolderForm from "./FolderForm";
|
import FolderForm from "./Detail/FolderForm";
|
||||||
import CloseIcon from "@mui/icons-material/Close";
|
import InstallationForm from "../Installations/Detail/InstallationForm";
|
||||||
import InnovenergyButton from "../Layout/InnovenergyButton";
|
import AddNewDialog from "./AddNewDialog";
|
||||||
import InstallationForm from "../Installations/InstallationForm";
|
|
||||||
import AddNewDialog from "./AddNew";
|
|
||||||
|
|
||||||
interface AddNewDialogProps {
|
interface AddNewDialogProps {
|
||||||
values: I_Folder | I_Installation;
|
values: I_Folder | I_Installation;
|
||||||
|
|
@ -15,8 +12,6 @@ interface AddNewDialogProps {
|
||||||
}
|
}
|
||||||
|
|
||||||
const AddNewButtons = (props: AddNewDialogProps) => {
|
const AddNewButtons = (props: AddNewDialogProps) => {
|
||||||
const [open, setOpen] = useState(false);
|
|
||||||
|
|
||||||
const handleFolderSubmit = (data: I_Folder, childData: Partial<I_Folder>) => {
|
const handleFolderSubmit = (data: I_Folder, childData: Partial<I_Folder>) => {
|
||||||
return axiosConfig
|
return axiosConfig
|
||||||
.post("/CreateFolder", {
|
.post("/CreateFolder", {
|
||||||
|
|
@ -24,7 +19,6 @@ const AddNewButtons = (props: AddNewDialogProps) => {
|
||||||
parentId: data.id,
|
parentId: data.id,
|
||||||
})
|
})
|
||||||
.then((res) => {
|
.then((res) => {
|
||||||
setOpen(false);
|
|
||||||
return res;
|
return res;
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
@ -39,7 +33,6 @@ const AddNewButtons = (props: AddNewDialogProps) => {
|
||||||
parentId: data.id,
|
parentId: data.id,
|
||||||
})
|
})
|
||||||
.then((res) => {
|
.then((res) => {
|
||||||
setOpen(false);
|
|
||||||
return res;
|
return res;
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
|
||||||
|
|
@ -12,8 +12,8 @@ interface AddNewDialogProps {
|
||||||
}
|
}
|
||||||
|
|
||||||
const AddNewDialog = (props: AddNewDialogProps) => {
|
const AddNewDialog = (props: AddNewDialogProps) => {
|
||||||
const [open, setOpen] = useState(false);
|
|
||||||
const { form, id, message } = props;
|
const { form, id, message } = props;
|
||||||
|
const [open, setOpen] = useState(false);
|
||||||
const intl = useIntl();
|
const intl = useIntl();
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
|
|
@ -2,12 +2,11 @@ import { Box, CircularProgress, Alert, useTheme } from "@mui/material";
|
||||||
import { AxiosError } from "axios";
|
import { AxiosError } from "axios";
|
||||||
import { useState, useEffect } from "react";
|
import { useState, useEffect } from "react";
|
||||||
import { useParams } from "react-router-dom";
|
import { useParams } from "react-router-dom";
|
||||||
import axiosConfig from "../../config/axiosConfig";
|
import axiosConfig from "../../../config/axiosConfig";
|
||||||
import { I_Folder } from "../../util/types";
|
import { I_Folder } from "../../../util/types";
|
||||||
import AddNewButtons from "./AddNewButtons";
|
import AddNewButtons from "../AddNewButtons";
|
||||||
import FolderForm from "./FolderForm";
|
import FolderForm from "./FolderForm";
|
||||||
import MoveDialog from "./Tree/MoveDialog";
|
import MoveDialog from "./MoveDialog";
|
||||||
import { colors } from "index";
|
|
||||||
|
|
||||||
const Folder = () => {
|
const Folder = () => {
|
||||||
const { id } = useParams();
|
const { id } = useParams();
|
||||||
|
|
@ -43,7 +42,7 @@ const Folder = () => {
|
||||||
<Box
|
<Box
|
||||||
sx={{
|
sx={{
|
||||||
py: 3,
|
py: 3,
|
||||||
bgcolor: colors.greyDark,
|
bgcolor: theme.palette.primary.dark,
|
||||||
px: 1,
|
px: 1,
|
||||||
borderBottom: 2,
|
borderBottom: 2,
|
||||||
borderRight: 2,
|
borderRight: 2,
|
||||||
|
|
@ -3,15 +3,13 @@ import { AxiosResponse } from "axios";
|
||||||
import { useFormik } from "formik";
|
import { useFormik } from "formik";
|
||||||
import { ReactNode, useContext, useState } from "react";
|
import { ReactNode, useContext, useState } from "react";
|
||||||
import { FormattedMessage, useIntl } from "react-intl";
|
import { FormattedMessage, useIntl } from "react-intl";
|
||||||
import { I_Folder } from "../../util/types";
|
import { I_Folder } from "../../../util/types";
|
||||||
import { GroupContext } from "../Context/GroupContextProvider";
|
import { GroupContext } from "../../Context/GroupContextProvider";
|
||||||
import InnovenergySnackbar from "../InnovenergySnackbar";
|
import InnovenergySnackbar from "../../Layout/InnovenergySnackbar";
|
||||||
import InnovenergyButton from "../Layout/InnovenergyButton";
|
import InnovenergyButton from "../../Layout/InnovenergyButton";
|
||||||
import {
|
import { I_InnovenergyTextfieldProps } from "../../Layout/InnovenergyTextfield";
|
||||||
I_InnovenergyTextfieldProps,
|
import { UserContext } from "../../Context/UserContextProvider";
|
||||||
IePropertyGrid,
|
import InnovenergyPropertyGrid from "../../Layout/InnovenergyPropertyGrid";
|
||||||
} from "../Layout/InnovenergyTextfield";
|
|
||||||
import { UserContext } from "../Context/UserContextProvider";
|
|
||||||
|
|
||||||
interface I_CustomerFormProps {
|
interface I_CustomerFormProps {
|
||||||
values: I_Folder;
|
values: I_Folder;
|
||||||
|
|
@ -24,14 +22,16 @@ interface I_CustomerFormProps {
|
||||||
|
|
||||||
const FolderForm = (props: I_CustomerFormProps) => {
|
const FolderForm = (props: I_CustomerFormProps) => {
|
||||||
const { values, additionalButtons, handleSubmit } = props;
|
const { values, additionalButtons, handleSubmit } = props;
|
||||||
const intl = useIntl();
|
|
||||||
const { fetchData } = useContext(GroupContext);
|
|
||||||
const { getCurrentUser } = useContext(UserContext);
|
|
||||||
|
|
||||||
const [snackbarOpen, setSnackbarOpen] = useState(false);
|
const [snackbarOpen, setSnackbarOpen] = useState(false);
|
||||||
const [error, setError] = useState();
|
const [error, setError] = useState();
|
||||||
const [loading, setLoading] = useState(false);
|
const [loading, setLoading] = useState(false);
|
||||||
|
|
||||||
|
const intl = useIntl();
|
||||||
|
const theme = useTheme();
|
||||||
|
const { fetchData } = useContext(GroupContext);
|
||||||
|
const { getCurrentUser } = useContext(UserContext);
|
||||||
|
|
||||||
const readOnly = !getCurrentUser().hasWriteAccess;
|
const readOnly = !getCurrentUser().hasWriteAccess;
|
||||||
|
|
||||||
const formik = useFormik({
|
const formik = useFormik({
|
||||||
|
|
@ -55,7 +55,6 @@ const FolderForm = (props: I_CustomerFormProps) => {
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
const theme = useTheme();
|
|
||||||
|
|
||||||
const rows: I_InnovenergyTextfieldProps[] = [
|
const rows: I_InnovenergyTextfieldProps[] = [
|
||||||
{
|
{
|
||||||
|
|
@ -83,33 +82,31 @@ const FolderForm = (props: I_CustomerFormProps) => {
|
||||||
];
|
];
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<form onSubmit={formik.handleSubmit}>
|
||||||
<form onSubmit={formik.handleSubmit}>
|
<InnovenergyPropertyGrid rows={rows} />
|
||||||
<IePropertyGrid rows={rows} />
|
<Grid container justifyContent="flex-end" sx={{ pt: 1 }}>
|
||||||
<Grid container justifyContent="flex-end" sx={{ pt: 1 }}>
|
{loading && (
|
||||||
{loading && (
|
<CircularProgress sx={{ color: theme.palette.secondary.main }} />
|
||||||
<CircularProgress sx={{ color: theme.palette.secondary.main }} />
|
)}
|
||||||
)}
|
{!readOnly &&
|
||||||
{!readOnly &&
|
additionalButtons &&
|
||||||
additionalButtons &&
|
additionalButtons.map((button) => button)}
|
||||||
additionalButtons.map((button) => button)}
|
{!readOnly && (
|
||||||
{!readOnly && (
|
<InnovenergyButton
|
||||||
<InnovenergyButton
|
id="folder-form-submit-button"
|
||||||
id="folder-form-submit-button"
|
type="submit"
|
||||||
type="submit"
|
sx={{ ml: 2 }}
|
||||||
sx={{ ml: 2 }}
|
>
|
||||||
>
|
<FormattedMessage id="submit" defaultMessage="Submit" />
|
||||||
<FormattedMessage id="submit" defaultMessage="Submit" />
|
</InnovenergyButton>
|
||||||
</InnovenergyButton>
|
)}
|
||||||
)}
|
</Grid>
|
||||||
</Grid>
|
<InnovenergySnackbar
|
||||||
<InnovenergySnackbar
|
error={error}
|
||||||
error={error}
|
setOpen={setSnackbarOpen}
|
||||||
setOpen={setSnackbarOpen}
|
open={snackbarOpen}
|
||||||
open={snackbarOpen}
|
/>
|
||||||
/>
|
</form>
|
||||||
</form>
|
|
||||||
</>
|
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -17,13 +17,13 @@ const MoveDialog = (props: MoveDialogProps) => {
|
||||||
const { values } = props;
|
const { values } = props;
|
||||||
|
|
||||||
const [open, setOpen] = useState(false);
|
const [open, setOpen] = useState(false);
|
||||||
|
|
||||||
const [selectedParentId, setSelectedParentId] = useState<number>(
|
const [selectedParentId, setSelectedParentId] = useState<number>(
|
||||||
values.parentId
|
values.parentId
|
||||||
);
|
);
|
||||||
|
const [error, setError] = useState();
|
||||||
|
|
||||||
const { fetchData, currentType } = useContext(GroupContext);
|
const { fetchData, currentType } = useContext(GroupContext);
|
||||||
const { id } = useParams();
|
const { id } = useParams();
|
||||||
const [error, setError] = useState();
|
|
||||||
|
|
||||||
const handleMove = () => {
|
const handleMove = () => {
|
||||||
const route =
|
const route =
|
||||||
|
|
@ -6,7 +6,7 @@ import { I_Folder, I_Installation } from "../../../util/types";
|
||||||
import { GroupContext } from "../../Context/GroupContextProvider";
|
import { GroupContext } from "../../Context/GroupContextProvider";
|
||||||
import { instanceOfFolder } from "../../../util/group.util";
|
import { instanceOfFolder } from "../../../util/group.util";
|
||||||
import { useIntl } from "react-intl";
|
import { useIntl } from "react-intl";
|
||||||
import InnovEnergyTreeItem from "../../Layout/InnovEnergyTreeItem";
|
import InnovenergyTreeItem from "../../Layout/InnovenergyTreeItem";
|
||||||
|
|
||||||
interface MoveTreeProps {
|
interface MoveTreeProps {
|
||||||
setSelectedParentId: (value: number) => void;
|
setSelectedParentId: (value: number) => void;
|
||||||
|
|
@ -29,7 +29,7 @@ const MoveTree = (props: MoveTreeProps) => {
|
||||||
.filter((element) => element.type === "Folder")
|
.filter((element) => element.type === "Folder")
|
||||||
.map((element) => {
|
.map((element) => {
|
||||||
return (
|
return (
|
||||||
<InnovEnergyTreeItem
|
<InnovenergyTreeItem
|
||||||
id={"move-tree-item-" + element.id}
|
id={"move-tree-item-" + element.id}
|
||||||
key={"move-tree-item-" + element.id}
|
key={"move-tree-item-" + element.id}
|
||||||
nodeId={element.id.toString()}
|
nodeId={element.id.toString()}
|
||||||
|
|
@ -37,7 +37,7 @@ const MoveTree = (props: MoveTreeProps) => {
|
||||||
label={element.name}
|
label={element.name}
|
||||||
>
|
>
|
||||||
{getNodes(element)}
|
{getNodes(element)}
|
||||||
</InnovEnergyTreeItem>
|
</InnovenergyTreeItem>
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
@ -12,6 +12,8 @@ import { useTheme } from "@mui/material";
|
||||||
|
|
||||||
const GroupTabs = () => {
|
const GroupTabs = () => {
|
||||||
const theme = useTheme();
|
const theme = useTheme();
|
||||||
|
const intl = useIntl();
|
||||||
|
const { currentType } = useContext(GroupContext);
|
||||||
const routeMatch = useRouteMatch([
|
const routeMatch = useRouteMatch([
|
||||||
routes.installations + routes.tree + routes.folder + ":id",
|
routes.installations + routes.tree + routes.folder + ":id",
|
||||||
routes.installations + routes.tree + routes.manageAccess + ":id",
|
routes.installations + routes.tree + routes.manageAccess + ":id",
|
||||||
|
|
@ -19,8 +21,6 @@ const GroupTabs = () => {
|
||||||
]);
|
]);
|
||||||
|
|
||||||
const id = routeMatch?.params?.id;
|
const id = routeMatch?.params?.id;
|
||||||
const intl = useIntl();
|
|
||||||
const { currentType } = useContext(GroupContext);
|
|
||||||
|
|
||||||
if (id) {
|
if (id) {
|
||||||
return (
|
return (
|
||||||
|
|
@ -29,14 +29,15 @@ const GroupTabs = () => {
|
||||||
<InnovenergyTabs id="group-tabs" value={routeMatch?.pattern?.path}>
|
<InnovenergyTabs id="group-tabs" value={routeMatch?.pattern?.path}>
|
||||||
{currentType === "Folder" ? (
|
{currentType === "Folder" ? (
|
||||||
<InnovenergyTab
|
<InnovenergyTab
|
||||||
sx={{
|
sx={{
|
||||||
"&.Mui-selected": {
|
"&.Mui-selected": {
|
||||||
color: colors.black,
|
color: colors.black,
|
||||||
backgroundColor: theme.palette.primary.dark,
|
backgroundColor: theme.palette.primary.dark,
|
||||||
borderColor: theme.palette.text.disabled,
|
borderColor: theme.palette.text.disabled,
|
||||||
borderBottom: 0,
|
borderBottom: 0,
|
||||||
mb:-1/8,
|
mb: -1 / 8,
|
||||||
}}}
|
},
|
||||||
|
}}
|
||||||
id="styled-tab-folder"
|
id="styled-tab-folder"
|
||||||
label={intl.formatMessage({
|
label={intl.formatMessage({
|
||||||
id: "folder",
|
id: "folder",
|
||||||
|
|
@ -49,16 +50,16 @@ const GroupTabs = () => {
|
||||||
to={routes.folder + id}
|
to={routes.folder + id}
|
||||||
/>
|
/>
|
||||||
) : (
|
) : (
|
||||||
|
|
||||||
<InnovenergyTab
|
<InnovenergyTab
|
||||||
sx={{
|
sx={{
|
||||||
"&.Mui-selected": {
|
"&.Mui-selected": {
|
||||||
color: colors.black,
|
color: colors.black,
|
||||||
backgroundColor: theme.palette.primary.dark,
|
backgroundColor: theme.palette.primary.dark,
|
||||||
borderColor: theme.palette.text.disabled,
|
borderColor: theme.palette.text.disabled,
|
||||||
borderBottom: 0,
|
borderBottom: 0,
|
||||||
mb:-1/8,
|
mb: -1 / 8,
|
||||||
}}}
|
},
|
||||||
|
}}
|
||||||
id="styled-tab-installation"
|
id="styled-tab-installation"
|
||||||
label={intl.formatMessage({
|
label={intl.formatMessage({
|
||||||
id: "installation",
|
id: "installation",
|
||||||
|
|
@ -79,11 +80,12 @@ const GroupTabs = () => {
|
||||||
sx={{
|
sx={{
|
||||||
"&.Mui-selected": {
|
"&.Mui-selected": {
|
||||||
color: colors.black,
|
color: colors.black,
|
||||||
backgroundColor: theme.palette.primary.dark,
|
backgroundColor: theme.palette.primary.dark,
|
||||||
borderColor: theme.palette.text.disabled,
|
borderColor: theme.palette.text.disabled,
|
||||||
borderBottom: 0,
|
borderBottom: 0,
|
||||||
mb:-1/8,
|
mb: -1 / 8,
|
||||||
}}}
|
},
|
||||||
|
}}
|
||||||
id="styled-tab-manage-access"
|
id="styled-tab-manage-access"
|
||||||
label={intl.formatMessage({
|
label={intl.formatMessage({
|
||||||
id: "manageAccess",
|
id: "manageAccess",
|
||||||
|
|
|
||||||
|
|
@ -2,16 +2,15 @@ import TreeView from "@mui/lab/TreeView";
|
||||||
import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
|
import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
|
||||||
import ChevronRightIcon from "@mui/icons-material/ChevronRight";
|
import ChevronRightIcon from "@mui/icons-material/ChevronRight";
|
||||||
import { ReactNode, useContext, useEffect, useState } from "react";
|
import { ReactNode, useContext, useEffect, useState } from "react";
|
||||||
import { TreeItem } from "@mui/lab";
|
import { I_Folder, I_Installation } from "../../util/types";
|
||||||
import { I_Folder, I_Installation } from "../../../util/types";
|
|
||||||
import { Link } from "react-router-dom";
|
import { Link } from "react-router-dom";
|
||||||
import routes from "../../../routes.json";
|
import routes from "../../routes.json";
|
||||||
import { GroupContext } from "../../Context/GroupContextProvider";
|
import { GroupContext } from "../Context/GroupContextProvider";
|
||||||
import { instanceOfFolder } from "../../../util/group.util";
|
import { instanceOfFolder } from "../../util/group.util";
|
||||||
import { Grid, CircularProgress, useTheme } from "@mui/material";
|
import { Grid, CircularProgress, useTheme } from "@mui/material";
|
||||||
import { useIntl } from "react-intl";
|
import { useIntl } from "react-intl";
|
||||||
import { colors } from "../../..";
|
import InnovenergyTreeItem from "../Layout/InnovenergyTreeItem";
|
||||||
import InnovEnergyTreeItem from "../../Layout/InnovEnergyTreeItem";
|
import TypeIcon from "./TypeIcon";
|
||||||
|
|
||||||
const GroupTree = () => {
|
const GroupTree = () => {
|
||||||
const { setCurrentType, fetchData, data, loading } = useContext(GroupContext);
|
const { setCurrentType, fetchData, data, loading } = useContext(GroupContext);
|
||||||
|
|
@ -48,19 +47,24 @@ const GroupTree = () => {
|
||||||
}}
|
}}
|
||||||
draggable={false}
|
draggable={false}
|
||||||
>
|
>
|
||||||
<InnovEnergyTreeItem
|
<InnovenergyTreeItem
|
||||||
id={"group-tree-item-" + element.id}
|
id={"group-tree-item-" + element.id}
|
||||||
key={element.type + element.id}
|
key={element.type + element.id}
|
||||||
nodeId={element.type + element.id}
|
nodeId={element.type + element.id}
|
||||||
label={element.name}
|
label={
|
||||||
|
<>
|
||||||
|
<TypeIcon type={element.type} /> {element.name}
|
||||||
|
</>
|
||||||
|
}
|
||||||
onClick={() => setCurrentType(element.type)}
|
onClick={() => setCurrentType(element.type)}
|
||||||
>
|
>
|
||||||
{getNodes(element)}
|
{getNodes(element)}
|
||||||
</InnovEnergyTreeItem>
|
</InnovenergyTreeItem>
|
||||||
</Link>
|
</Link>
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
if (loading) {
|
if (loading) {
|
||||||
return (
|
return (
|
||||||
<Grid container justifyContent="center" width="100%">
|
<Grid container justifyContent="center" width="100%">
|
||||||
|
|
@ -1,12 +1,12 @@
|
||||||
import { Grid } from "@mui/material";
|
import { Grid } from "@mui/material";
|
||||||
import { Routes, Route } from "react-router";
|
import { Routes, Route } from "react-router";
|
||||||
import routes from "../../routes.json";
|
import routes from "../../routes.json";
|
||||||
import Folder from "./Folder";
|
import Folder from "./Detail/Folder";
|
||||||
import GroupTabs from "./GroupTabs";
|
import GroupTabs from "./GroupTabs";
|
||||||
import GroupContextProvider from "../Context/GroupContextProvider";
|
import GroupContextProvider from "../Context/GroupContextProvider";
|
||||||
import GroupTree from "./Tree/GroupTree";
|
import GroupTree from "./GroupTree";
|
||||||
import AccessManagement from "./AccessManagement/AccessManagement";
|
import AccessManagement from "./AccessManagement/AccessManagement";
|
||||||
import Installation from "../Installations/Installation";
|
import Installation from "../Installations/Detail/Installation";
|
||||||
import useRouteMatch from "../../hooks/useRouteMatch";
|
import useRouteMatch from "../../hooks/useRouteMatch";
|
||||||
import useInstallation from "../../hooks/useInstallation";
|
import useInstallation from "../../hooks/useInstallation";
|
||||||
import { useEffect } from "react";
|
import { useEffect } from "react";
|
||||||
|
|
@ -25,7 +25,6 @@ const Groups = () => {
|
||||||
const id = routeMatch?.params?.id;
|
const id = routeMatch?.params?.id;
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
// TODO remove if
|
|
||||||
getInstallation(id);
|
getInstallation(id);
|
||||||
}, [id]);
|
}, [id]);
|
||||||
return (
|
return (
|
||||||
|
|
|
||||||
|
|
@ -1,4 +0,0 @@
|
||||||
.groupTreeLink {
|
|
||||||
text-decoration: "none";
|
|
||||||
color: "red";
|
|
||||||
}
|
|
||||||
|
|
@ -4,11 +4,16 @@ import InsertDriveFileIcon from "@mui/icons-material/InsertDriveFile";
|
||||||
interface TypeIconProps {
|
interface TypeIconProps {
|
||||||
type: string | undefined;
|
type: string | undefined;
|
||||||
}
|
}
|
||||||
|
|
||||||
const TypeIcon = (props: TypeIconProps) => {
|
const TypeIcon = (props: TypeIconProps) => {
|
||||||
return (
|
return (
|
||||||
<div>
|
<>
|
||||||
{props.type === "Folder" ? <FolderIcon /> : <InsertDriveFileIcon />}
|
{props.type === "Folder" ? (
|
||||||
</div>
|
<FolderIcon sx={{ height: "20px", mt: "1px", mr: 1 }} />
|
||||||
|
) : (
|
||||||
|
<InsertDriveFileIcon sx={{ height: "20px", mt: "1px", mr: 1 }} />
|
||||||
|
)}
|
||||||
|
</>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -2,12 +2,12 @@ import { Alert, Box, CircularProgress, useTheme } from "@mui/material";
|
||||||
import { AxiosError } from "axios";
|
import { AxiosError } from "axios";
|
||||||
import { useContext, useEffect, useState } from "react";
|
import { useContext, useEffect, useState } from "react";
|
||||||
import { useParams } from "react-router-dom";
|
import { useParams } from "react-router-dom";
|
||||||
import axiosConfig from "../../config/axiosConfig";
|
import axiosConfig from "../../../config/axiosConfig";
|
||||||
import { I_Folder, I_Installation } from "../../util/types";
|
import { I_Folder, I_Installation } from "../../../util/types";
|
||||||
import InstallationForm from "./InstallationForm";
|
import InstallationForm from "./InstallationForm";
|
||||||
import { colors } from "../..";
|
import { colors } from "../../../index";
|
||||||
import { S3CredentialsContext } from "../Context/S3CredentialsContextProvider";
|
import { S3CredentialsContext } from "../../Context/S3CredentialsContextProvider";
|
||||||
import MoveDialog from "../Groups/Tree/MoveDialog";
|
import MoveDialog from "../../Groups/Detail/MoveDialog";
|
||||||
|
|
||||||
interface I_InstallationProps {
|
interface I_InstallationProps {
|
||||||
loading?: boolean;
|
loading?: boolean;
|
||||||
|
|
@ -31,7 +31,7 @@ const Installation = (props: I_InstallationProps) => {
|
||||||
<Box
|
<Box
|
||||||
sx={{
|
sx={{
|
||||||
py: 3,
|
py: 3,
|
||||||
bgcolor: colors.greyDark,
|
bgcolor: theme.palette.primary.dark,
|
||||||
px: 1,
|
px: 1,
|
||||||
borderLeft: 2,
|
borderLeft: 2,
|
||||||
borderRight: 2,
|
borderRight: 2,
|
||||||
|
|
@ -2,18 +2,14 @@ import { Alert, Grid, Snackbar } from "@mui/material";
|
||||||
import { useFormik } from "formik";
|
import { useFormik } from "formik";
|
||||||
import { ReactNode, useContext, useState } from "react";
|
import { ReactNode, useContext, useState } from "react";
|
||||||
import { FormattedMessage, useIntl } from "react-intl";
|
import { FormattedMessage, useIntl } from "react-intl";
|
||||||
import axiosConfig from "../../config/axiosConfig";
|
import { I_Installation } from "../../../util/types";
|
||||||
import { I_Folder, I_Installation } from "../../util/types";
|
import { InstallationsContext } from "../../Context/InstallationsContextProvider";
|
||||||
import { InstallationsContext } from "../Context/InstallationsContextProvider";
|
import InnovenergyButton from "../../Layout/InnovenergyButton";
|
||||||
import MoveDialog from "../Groups/Tree/MoveDialog";
|
import { I_InnovenergyTextfieldProps } from "../../Layout/InnovenergyTextfield";
|
||||||
import InnovenergyButton from "../Layout/InnovenergyButton";
|
import { UserContext } from "../../Context/UserContextProvider";
|
||||||
import InnovenergyTextfield, {
|
|
||||||
I_InnovenergyTextfieldProps,
|
|
||||||
IePropertyGrid,
|
|
||||||
} from "../Layout/InnovenergyTextfield";
|
|
||||||
import { UserContext } from "../Context/UserContextProvider";
|
|
||||||
import * as Yup from "yup";
|
import * as Yup from "yup";
|
||||||
import { AxiosResponse } from "axios";
|
import { AxiosResponse } from "axios";
|
||||||
|
import InnovenergyPropertyGrid from "../../Layout/InnovenergyPropertyGrid";
|
||||||
|
|
||||||
interface I_InstallationFormProps {
|
interface I_InstallationFormProps {
|
||||||
values: I_Installation;
|
values: I_Installation;
|
||||||
|
|
@ -150,7 +146,7 @@ const InstallationForm = (props: I_InstallationFormProps) => {
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<form onSubmit={formik.handleSubmit}>
|
<form onSubmit={formik.handleSubmit}>
|
||||||
<IePropertyGrid rows={rows} />
|
<InnovenergyPropertyGrid rows={rows} />
|
||||||
<Grid container justifyContent="flex-end" sx={{ pt: 1 }}>
|
<Grid container justifyContent="flex-end" sx={{ pt: 1 }}>
|
||||||
{/*{hasMoveButton && !readOnly && <MoveDialog values={values} />}*/}
|
{/*{hasMoveButton && !readOnly && <MoveDialog values={values} />}*/}
|
||||||
{!readOnly &&
|
{!readOnly &&
|
||||||
|
|
@ -1,492 +0,0 @@
|
||||||
import { I_GraphData } from "../../util/types";
|
|
||||||
|
|
||||||
export type Datum = string | number | boolean | Array<string>;
|
|
||||||
type LogData = Record<string, Datum>;
|
|
||||||
|
|
||||||
export type TimeSeries = Record<number, LogData>;
|
|
||||||
|
|
||||||
export const timeSeries: TimeSeries = {
|
|
||||||
1673427378: {
|
|
||||||
"TruConvertAc/Ac/Current": 124,
|
|
||||||
"TruConvertAc/Ac/Voltage": 200,
|
|
||||||
"TruConvertAc/Ac/Phi": 2.89,
|
|
||||||
"TruConvertAc/Frequency": 2.89,
|
|
||||||
},
|
|
||||||
1674427380: {
|
|
||||||
"TruConvertAc/Ac/Current": 150,
|
|
||||||
"TruConvertAc/Ac/Voltage": 120,
|
|
||||||
"TruConvertAc/Ac/Phi": 3.21,
|
|
||||||
"TruConvertAc/Frequency": 2.41,
|
|
||||||
},
|
|
||||||
1675427382: {
|
|
||||||
"TruConvertAc/Ac/Current": 153,
|
|
||||||
"TruConvertAc/Ac/Voltage": 140,
|
|
||||||
"TruConvertAc/Ac/Phi": 3.9,
|
|
||||||
"TruConvertAc/Frequency": 4.41,
|
|
||||||
},
|
|
||||||
};
|
|
||||||
|
|
||||||
const exampleLogData: I_GraphData[] = [
|
|
||||||
{
|
|
||||||
TimeStamp: "1673427378",
|
|
||||||
Devices: [
|
|
||||||
{
|
|
||||||
Name: "TruConvertAc",
|
|
||||||
Type: "Inverter",
|
|
||||||
Ac: [
|
|
||||||
{
|
|
||||||
Current: 2.85,
|
|
||||||
Voltage: 236.2,
|
|
||||||
Phi: 2.896,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Current: 2.87,
|
|
||||||
Voltage: 234.5,
|
|
||||||
Phi: 2.793,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Current: 2.65,
|
|
||||||
Voltage: 240.6,
|
|
||||||
Phi: 2.941,
|
|
||||||
},
|
|
||||||
],
|
|
||||||
Frequency: 50.02,
|
|
||||||
Dc: {
|
|
||||||
Current: -2.254,
|
|
||||||
Voltage: 869,
|
|
||||||
},
|
|
||||||
Alarms: [],
|
|
||||||
MainState: "Operation",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Name: "TruConvertDc",
|
|
||||||
Type: "DcDc",
|
|
||||||
Dc: {
|
|
||||||
Current: -2.017,
|
|
||||||
Voltage: 868,
|
|
||||||
},
|
|
||||||
Dc48: {
|
|
||||||
Current: -31,
|
|
||||||
Voltage: 55.9,
|
|
||||||
},
|
|
||||||
Warnings: [],
|
|
||||||
Alarms: [],
|
|
||||||
"DC Power": -1751,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Name: "EmuMeter",
|
|
||||||
Type: "Grid",
|
|
||||||
Ac: [
|
|
||||||
{
|
|
||||||
Current: 15.658,
|
|
||||||
Voltage: 236.3,
|
|
||||||
Phi: 0.318,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Current: 14.052,
|
|
||||||
Voltage: 234.8,
|
|
||||||
Phi: 0.2,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Current: 9.046,
|
|
||||||
Voltage: 240.4,
|
|
||||||
Phi: 0.142,
|
|
||||||
},
|
|
||||||
],
|
|
||||||
Frequency: 50,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Name: "EmuMeter",
|
|
||||||
Type: "AcInToAcOut",
|
|
||||||
Ac: [
|
|
||||||
{
|
|
||||||
Current: 15.658,
|
|
||||||
Voltage: 236.3,
|
|
||||||
Phi: 0.318,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Current: 14.052,
|
|
||||||
Voltage: 234.8,
|
|
||||||
Phi: 0.2,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Current: 9.046,
|
|
||||||
Voltage: 240.4,
|
|
||||||
Phi: 0.142,
|
|
||||||
},
|
|
||||||
],
|
|
||||||
Frequency: 50,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Name: "AMPT",
|
|
||||||
Type: "PvOnDc",
|
|
||||||
Dc: {
|
|
||||||
Current: 0.229,
|
|
||||||
Voltage: 921.855,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Name: "48TL Battery",
|
|
||||||
Type: "Battery",
|
|
||||||
Dc48: {
|
|
||||||
Current: 38.56,
|
|
||||||
Voltage: 53.29,
|
|
||||||
},
|
|
||||||
Alarms: [],
|
|
||||||
Warnings: [],
|
|
||||||
Soc: 21.6,
|
|
||||||
HeaterOn: true,
|
|
||||||
EocReached: false,
|
|
||||||
BatteryCold: false,
|
|
||||||
Temperature: 265.3,
|
|
||||||
},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
TimeStamp: "1673427380",
|
|
||||||
Devices: [
|
|
||||||
{
|
|
||||||
Name: "TruConvertAc",
|
|
||||||
Type: "Inverter",
|
|
||||||
Ac: [
|
|
||||||
{
|
|
||||||
Current: 3.01,
|
|
||||||
Voltage: 235.6,
|
|
||||||
Phi: 2.941,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Current: 3.04,
|
|
||||||
Voltage: 234.4,
|
|
||||||
Phi: 2.739,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Current: 2.48,
|
|
||||||
Voltage: 241.1,
|
|
||||||
Phi: 2.765,
|
|
||||||
},
|
|
||||||
],
|
|
||||||
Frequency: 50.02,
|
|
||||||
Dc: {
|
|
||||||
Current: -2.215,
|
|
||||||
Voltage: 868,
|
|
||||||
},
|
|
||||||
Alarms: [],
|
|
||||||
MainState: "Operation",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Name: "TruConvertDc",
|
|
||||||
Type: "DcDc",
|
|
||||||
Dc: {
|
|
||||||
Current: -1.953,
|
|
||||||
Voltage: 868,
|
|
||||||
},
|
|
||||||
Dc48: {
|
|
||||||
Current: -30,
|
|
||||||
Voltage: 55.9,
|
|
||||||
},
|
|
||||||
Warnings: [],
|
|
||||||
Alarms: [],
|
|
||||||
"DC Power": -1695,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Name: "EmuMeter",
|
|
||||||
Type: "Grid",
|
|
||||||
Ac: [
|
|
||||||
{
|
|
||||||
Current: 15.658,
|
|
||||||
Voltage: 236.3,
|
|
||||||
Phi: 0.318,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Current: 14.052,
|
|
||||||
Voltage: 234.8,
|
|
||||||
Phi: 0.2,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Current: 9.046,
|
|
||||||
Voltage: 240.4,
|
|
||||||
Phi: 0.142,
|
|
||||||
},
|
|
||||||
],
|
|
||||||
Frequency: 50,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Name: "EmuMeter",
|
|
||||||
Type: "AcInToAcOut",
|
|
||||||
Ac: [
|
|
||||||
{
|
|
||||||
Current: 15.658,
|
|
||||||
Voltage: 236.3,
|
|
||||||
Phi: 0.318,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Current: 14.052,
|
|
||||||
Voltage: 234.8,
|
|
||||||
Phi: 0.2,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Current: 9.046,
|
|
||||||
Voltage: 240.4,
|
|
||||||
Phi: 0.142,
|
|
||||||
},
|
|
||||||
],
|
|
||||||
Frequency: 50,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Name: "AMPT",
|
|
||||||
Type: "PvOnDc",
|
|
||||||
Dc: {
|
|
||||||
Current: 0.229,
|
|
||||||
Voltage: 921.855,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Name: "48TL Battery",
|
|
||||||
Type: "Battery",
|
|
||||||
Dc48: {
|
|
||||||
Current: 38.51,
|
|
||||||
Voltage: 53.29,
|
|
||||||
},
|
|
||||||
Alarms: [],
|
|
||||||
Warnings: [],
|
|
||||||
Soc: 21.6,
|
|
||||||
HeaterOn: true,
|
|
||||||
EocReached: false,
|
|
||||||
BatteryCold: false,
|
|
||||||
Temperature: 265.3,
|
|
||||||
},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
TimeStamp: "1673427381",
|
|
||||||
Devices: [
|
|
||||||
{
|
|
||||||
Name: "TruConvertAc",
|
|
||||||
Type: "Inverter",
|
|
||||||
Ac: [
|
|
||||||
{
|
|
||||||
Current: 0.4,
|
|
||||||
Voltage: 237.2,
|
|
||||||
Phi: 1.4,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Current: 0.55,
|
|
||||||
Voltage: 235.6,
|
|
||||||
Phi: 1.551,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Current: 0.44,
|
|
||||||
Voltage: 241.7,
|
|
||||||
Phi: 1.501,
|
|
||||||
},
|
|
||||||
],
|
|
||||||
Frequency: 50.02,
|
|
||||||
Dc: {
|
|
||||||
Current: 0.007,
|
|
||||||
Voltage: 849,
|
|
||||||
},
|
|
||||||
Alarms: [],
|
|
||||||
MainState: "Operation",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Name: "TruConvertDc",
|
|
||||||
Type: "DcDc",
|
|
||||||
Dc: {
|
|
||||||
Current: 0.153,
|
|
||||||
Voltage: 849,
|
|
||||||
},
|
|
||||||
Dc48: {
|
|
||||||
Current: 3,
|
|
||||||
Voltage: 52.0,
|
|
||||||
},
|
|
||||||
Warnings: [],
|
|
||||||
Alarms: [],
|
|
||||||
"DC Power": 130,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Name: "EmuMeter",
|
|
||||||
Type: "Grid",
|
|
||||||
Ac: [
|
|
||||||
{
|
|
||||||
Current: 15.658,
|
|
||||||
Voltage: 236.3,
|
|
||||||
Phi: 0.318,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Current: 14.052,
|
|
||||||
Voltage: 234.8,
|
|
||||||
Phi: 0.2,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Current: 9.046,
|
|
||||||
Voltage: 240.4,
|
|
||||||
Phi: 0.142,
|
|
||||||
},
|
|
||||||
],
|
|
||||||
Frequency: 50,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Name: "EmuMeter",
|
|
||||||
Type: "AcInToAcOut",
|
|
||||||
Ac: [
|
|
||||||
{
|
|
||||||
Current: 15.658,
|
|
||||||
Voltage: 236.3,
|
|
||||||
Phi: 0.318,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Current: 14.052,
|
|
||||||
Voltage: 234.8,
|
|
||||||
Phi: 0.2,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Current: 9.046,
|
|
||||||
Voltage: 240.4,
|
|
||||||
Phi: 0.142,
|
|
||||||
},
|
|
||||||
],
|
|
||||||
Frequency: 50,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Name: "AMPT",
|
|
||||||
Type: "PvOnDc",
|
|
||||||
Dc: {
|
|
||||||
Current: 0.229,
|
|
||||||
Voltage: 921.855,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Name: "48TL Battery",
|
|
||||||
Type: "Battery",
|
|
||||||
Dc48: {
|
|
||||||
Current: 6.14,
|
|
||||||
Voltage: 51.96,
|
|
||||||
},
|
|
||||||
Alarms: [],
|
|
||||||
Warnings: [],
|
|
||||||
Soc: 21.6,
|
|
||||||
HeaterOn: true,
|
|
||||||
EocReached: false,
|
|
||||||
BatteryCold: false,
|
|
||||||
Temperature: 265.3,
|
|
||||||
},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
TimeStamp: "1673427383",
|
|
||||||
Devices: [
|
|
||||||
{
|
|
||||||
Name: "TruConvertAc",
|
|
||||||
Type: "Inverter",
|
|
||||||
Ac: [
|
|
||||||
{
|
|
||||||
Current: 1.16,
|
|
||||||
Voltage: 237.7,
|
|
||||||
Phi: 0.376,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Current: 1.25,
|
|
||||||
Voltage: 236.0,
|
|
||||||
Phi: 0.707,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Current: 0.98,
|
|
||||||
Voltage: 242.1,
|
|
||||||
Phi: 0.246,
|
|
||||||
},
|
|
||||||
],
|
|
||||||
Frequency: 50.02,
|
|
||||||
Dc: {
|
|
||||||
Current: 0.847,
|
|
||||||
Voltage: 847,
|
|
||||||
},
|
|
||||||
Alarms: [],
|
|
||||||
MainState: "Operation",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Name: "TruConvertDc",
|
|
||||||
Type: "DcDc",
|
|
||||||
Dc: {
|
|
||||||
Current: 0.979,
|
|
||||||
Voltage: 846,
|
|
||||||
},
|
|
||||||
Dc48: {
|
|
||||||
Current: 18,
|
|
||||||
Voltage: 51.2,
|
|
||||||
},
|
|
||||||
Warnings: [],
|
|
||||||
Alarms: [],
|
|
||||||
"DC Power": 828,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Name: "EmuMeter",
|
|
||||||
Type: "Grid",
|
|
||||||
Ac: [
|
|
||||||
{
|
|
||||||
Current: 12.563,
|
|
||||||
Voltage: 237.2,
|
|
||||||
Phi: 0.376,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Current: 10.913,
|
|
||||||
Voltage: 235.6,
|
|
||||||
Phi: 0.246,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Current: 5.983,
|
|
||||||
Voltage: 241.2,
|
|
||||||
Phi: 0.142,
|
|
||||||
},
|
|
||||||
],
|
|
||||||
Frequency: 50,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Name: "EmuMeter",
|
|
||||||
Type: "AcInToAcOut",
|
|
||||||
Ac: [
|
|
||||||
{
|
|
||||||
Current: 12.563,
|
|
||||||
Voltage: 237.2,
|
|
||||||
Phi: 0.376,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Current: 10.913,
|
|
||||||
Voltage: 235.6,
|
|
||||||
Phi: 0.246,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Current: 5.983,
|
|
||||||
Voltage: 241.2,
|
|
||||||
Phi: 0.142,
|
|
||||||
},
|
|
||||||
],
|
|
||||||
Frequency: 50,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Name: "AMPT",
|
|
||||||
Type: "PvOnDc",
|
|
||||||
Dc: {
|
|
||||||
Current: 0.229,
|
|
||||||
Voltage: 921.855,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
{
|
|
||||||
Name: "48TL Battery",
|
|
||||||
Type: "Battery",
|
|
||||||
Dc48: {
|
|
||||||
Current: -7.99,
|
|
||||||
Voltage: 51.31,
|
|
||||||
},
|
|
||||||
Alarms: [],
|
|
||||||
Warnings: [],
|
|
||||||
Soc: 21.6,
|
|
||||||
HeaterOn: true,
|
|
||||||
EocReached: false,
|
|
||||||
BatteryCold: false,
|
|
||||||
Temperature: 265.3,
|
|
||||||
},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
];
|
|
||||||
|
|
||||||
export default exampleLogData;
|
|
||||||
|
|
@ -1,13 +1,7 @@
|
||||||
import List from "@mui/material/List";
|
import List from "@mui/material/List";
|
||||||
import ListItemButton from "@mui/material/ListItemButton";
|
import ListItemButton from "@mui/material/ListItemButton";
|
||||||
import ListItemText from "@mui/material/ListItemText";
|
import ListItemText from "@mui/material/ListItemText";
|
||||||
import {
|
import { Alert, CircularProgress, Grid, useTheme } from "@mui/material";
|
||||||
Alert,
|
|
||||||
CircularProgress,
|
|
||||||
Divider,
|
|
||||||
Grid,
|
|
||||||
useTheme,
|
|
||||||
} from "@mui/material";
|
|
||||||
import { Link } from "react-router-dom";
|
import { Link } from "react-router-dom";
|
||||||
import useRouteMatch from "../../hooks/useRouteMatch";
|
import useRouteMatch from "../../hooks/useRouteMatch";
|
||||||
import routes from "../../routes.json";
|
import routes from "../../routes.json";
|
||||||
|
|
@ -21,14 +15,6 @@ interface InstallationListProps {
|
||||||
searchQuery: string;
|
searchQuery: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
const getPathWithoutId = (path?: string) => {
|
|
||||||
if (path) {
|
|
||||||
const splitString = path.split(":");
|
|
||||||
return splitString[0];
|
|
||||||
}
|
|
||||||
return routes.installation;
|
|
||||||
};
|
|
||||||
|
|
||||||
const filterData = (
|
const filterData = (
|
||||||
searchQuery: string,
|
searchQuery: string,
|
||||||
data: I_Installation[] | undefined
|
data: I_Installation[] | undefined
|
||||||
|
|
@ -45,15 +31,12 @@ const filterData = (
|
||||||
|
|
||||||
const InstallationList = (props: InstallationListProps) => {
|
const InstallationList = (props: InstallationListProps) => {
|
||||||
const { fetchData, data, loading, error } = useContext(InstallationsContext);
|
const { fetchData, data, loading, error } = useContext(InstallationsContext);
|
||||||
|
|
||||||
const filteredData = filterData(props.searchQuery, data);
|
const filteredData = filterData(props.searchQuery, data);
|
||||||
|
|
||||||
const routeMatch = useRouteMatch([
|
const routeMatch = useRouteMatch([
|
||||||
routes.installations + routes.list + routes.installation + ":id",
|
routes.installations + routes.list + routes.installation + ":id",
|
||||||
routes.installations + routes.list + routes.liveView + ":id",
|
routes.installations + routes.list + routes.liveView + ":id",
|
||||||
routes.installations + routes.list + routes.log + ":id",
|
routes.installations + routes.list + routes.log + ":id",
|
||||||
]);
|
]);
|
||||||
|
|
||||||
const theme = useTheme();
|
const theme = useTheme();
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
|
|
@ -108,13 +91,13 @@ const InstallationList = (props: InstallationListProps) => {
|
||||||
borderStyle: "solid",
|
borderStyle: "solid",
|
||||||
backgroundColor: theme.palette.primary.dark,
|
backgroundColor: theme.palette.primary.dark,
|
||||||
"&.Mui-selected": {
|
"&.Mui-selected": {
|
||||||
backgroundColor: colors.orangeSelected,
|
backgroundColor: theme.palette.secondary.main,
|
||||||
},
|
},
|
||||||
":hover": {
|
":hover": {
|
||||||
backgroundColor: colors.orangeHover,
|
backgroundColor: theme.palette.secondary.light,
|
||||||
},
|
},
|
||||||
"&.Mui-selected:hover": {
|
"&.Mui-selected:hover": {
|
||||||
backgroundColor: colors.orangeSelected,
|
backgroundColor: theme.palette.secondary.main,
|
||||||
},
|
},
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
|
|
|
||||||
|
|
@ -5,14 +5,13 @@ import routes from "../../routes.json";
|
||||||
import useRouteMatch from "../../hooks/useRouteMatch";
|
import useRouteMatch from "../../hooks/useRouteMatch";
|
||||||
import { useIntl } from "react-intl";
|
import { useIntl } from "react-intl";
|
||||||
import InnovenergyTab from "../Layout/InnovenergyTab";
|
import InnovenergyTab from "../Layout/InnovenergyTab";
|
||||||
import InnovenergyTabBorder from "../Layout/InnovenergyTab";
|
|
||||||
import InnovenergyTabs from "components/Layout/InnovenergyTabs";
|
import InnovenergyTabs from "components/Layout/InnovenergyTabs";
|
||||||
import { useTheme } from "@mui/material";
|
import { useTheme } from "@mui/material";
|
||||||
import { red } from "@mui/material/colors";
|
|
||||||
import { colors } from "index";
|
import { colors } from "index";
|
||||||
|
|
||||||
const InstallationTabs = () => {
|
const InstallationTabs = () => {
|
||||||
const theme = useTheme();
|
const theme = useTheme();
|
||||||
|
const intl = useIntl();
|
||||||
const routeMatch = useRouteMatch([
|
const routeMatch = useRouteMatch([
|
||||||
routes.installations + routes.list + routes.installation + ":id",
|
routes.installations + routes.list + routes.installation + ":id",
|
||||||
routes.installations + routes.list + routes.liveView + ":id",
|
routes.installations + routes.list + routes.liveView + ":id",
|
||||||
|
|
@ -20,7 +19,6 @@ const InstallationTabs = () => {
|
||||||
]);
|
]);
|
||||||
|
|
||||||
const id = routeMatch?.params?.id;
|
const id = routeMatch?.params?.id;
|
||||||
const intl = useIntl();
|
|
||||||
|
|
||||||
if (id) {
|
if (id) {
|
||||||
return (
|
return (
|
||||||
|
|
|
||||||
|
|
@ -1,13 +1,13 @@
|
||||||
import { Grid, colors } from "@mui/material";
|
import { Grid, colors } from "@mui/material";
|
||||||
import { Routes, Route } from "react-router";
|
import { Routes, Route } from "react-router";
|
||||||
import LiveView from "./LiveView";
|
import LiveView from "./LiveView/LiveView";
|
||||||
import InstallationTabs from "./InstallationTabs";
|
import InstallationTabs from "./InstallationTabs";
|
||||||
import Log from "./Log/Log";
|
import Log from "./Log/Log";
|
||||||
import routes from "../../routes.json";
|
import routes from "../../routes.json";
|
||||||
import InstallationsContextProvider from "../Context/InstallationsContextProvider";
|
import InstallationsContextProvider from "../Context/InstallationsContextProvider";
|
||||||
import SearchSidebar from "../Layout/Search";
|
import SearchSidebar from "../Layout/Search";
|
||||||
import InstallationList from "./InstallationList";
|
import InstallationList from "./InstallationList";
|
||||||
import Installation from "./Installation";
|
import Installation from "./Detail/Installation";
|
||||||
import CheckboxTree from "./Log/CheckboxTree";
|
import CheckboxTree from "./Log/CheckboxTree";
|
||||||
import LogContextProvider from "../Context/LogContextProvider";
|
import LogContextProvider from "../Context/LogContextProvider";
|
||||||
import useRouteMatch from "../../hooks/useRouteMatch";
|
import useRouteMatch from "../../hooks/useRouteMatch";
|
||||||
|
|
@ -27,7 +27,6 @@ const Installations = () => {
|
||||||
const id = routeMatch?.params?.id;
|
const id = routeMatch?.params?.id;
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
// TODO remove if
|
|
||||||
getInstallation(id);
|
getInstallation(id);
|
||||||
}, [id]);
|
}, [id]);
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,6 @@
|
||||||
import TopologyView from "./Log/TopologyView";
|
import TopologyView from "./TopologyView";
|
||||||
import { Box, useTheme } from "@mui/material";
|
import { Box, useTheme } from "@mui/material";
|
||||||
import { colors } from "../../index";
|
import { colors } from "../../../index";
|
||||||
|
|
||||||
const LiveView = () => {
|
const LiveView = () => {
|
||||||
const theme = useTheme();
|
const theme = useTheme();
|
||||||
|
|
@ -8,7 +8,7 @@ const LiveView = () => {
|
||||||
<Box
|
<Box
|
||||||
sx={{
|
sx={{
|
||||||
py: 3,
|
py: 3,
|
||||||
bgcolor: colors.greyDark,
|
bgcolor: theme.palette.primary.dark,
|
||||||
px: 1,
|
px: 1,
|
||||||
borderLeft: 2,
|
borderLeft: 2,
|
||||||
borderRight: 2,
|
borderRight: 2,
|
||||||
|
|
@ -15,7 +15,6 @@ import { S3CredentialsContext } from "../../Context/S3CredentialsContextProvider
|
||||||
const TopologyView = () => {
|
const TopologyView = () => {
|
||||||
const [values, setValues] = useState<TopologyValues | null>(null);
|
const [values, setValues] = useState<TopologyValues | null>(null);
|
||||||
const { fetchData } = useContext(S3CredentialsContext);
|
const { fetchData } = useContext(S3CredentialsContext);
|
||||||
const theme = useTheme();
|
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const interval = setInterval(() => {
|
const interval = setInterval(() => {
|
||||||
|
|
@ -1,5 +1,5 @@
|
||||||
import { TreeItem, TreeView } from "@mui/lab";
|
import { TreeView } from "@mui/lab";
|
||||||
import { Checkbox, Divider, useTheme } from "@mui/material";
|
import { Checkbox } from "@mui/material";
|
||||||
import { useContext, ReactNode } from "react";
|
import { useContext, ReactNode } from "react";
|
||||||
import { LogContext } from "../../Context/LogContextProvider";
|
import { LogContext } from "../../Context/LogContextProvider";
|
||||||
import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
|
import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
|
||||||
|
|
@ -7,12 +7,7 @@ import ChevronRightIcon from "@mui/icons-material/ChevronRight";
|
||||||
import useRouteMatch from "../../../hooks/useRouteMatch";
|
import useRouteMatch from "../../../hooks/useRouteMatch";
|
||||||
import routes from "../../../routes.json";
|
import routes from "../../../routes.json";
|
||||||
import React from "react";
|
import React from "react";
|
||||||
import { colors } from "index";
|
import InnovenergyTreeItem from "../../Layout/InnovenergyTreeItem";
|
||||||
import InnovEnergyTreeItem from "../../Layout/InnovEnergyTreeItem";
|
|
||||||
|
|
||||||
export interface ToggleElement {
|
|
||||||
[key: string]: boolean;
|
|
||||||
}
|
|
||||||
|
|
||||||
export interface TreeElement {
|
export interface TreeElement {
|
||||||
id: string;
|
id: string;
|
||||||
|
|
@ -50,12 +45,13 @@ const CheckboxTree = () => {
|
||||||
) => {
|
) => {
|
||||||
event.stopPropagation();
|
event.stopPropagation();
|
||||||
};
|
};
|
||||||
|
|
||||||
const renderTree = (data: TreeElement[]): ReactNode => {
|
const renderTree = (data: TreeElement[]): ReactNode => {
|
||||||
return data.map((element) => {
|
return data.map((element) => {
|
||||||
const checked = checkedToggles.find((toggle) => element.id === toggle);
|
const checked = checkedToggles.find((toggle) => element.id === toggle);
|
||||||
const splitName = element.name.split("/");
|
const splitName = element.name.split("/");
|
||||||
return (
|
return (
|
||||||
<InnovEnergyTreeItem
|
<InnovenergyTreeItem
|
||||||
id={"checkbox-tree-" + element.name}
|
id={"checkbox-tree-" + element.name}
|
||||||
key={element.name}
|
key={element.name}
|
||||||
nodeId={element.name}
|
nodeId={element.name}
|
||||||
|
|
@ -77,7 +73,7 @@ const CheckboxTree = () => {
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
{getNodes(element)}
|
{getNodes(element)}
|
||||||
</InnovEnergyTreeItem>
|
</InnovenergyTreeItem>
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
|
||||||
|
|
@ -3,11 +3,11 @@ import { DatePicker, LocalizationProvider } from "@mui/x-date-pickers";
|
||||||
import { AdapterDayjs } from "@mui/x-date-pickers/AdapterDayjs";
|
import { AdapterDayjs } from "@mui/x-date-pickers/AdapterDayjs";
|
||||||
import dayjs from "dayjs";
|
import dayjs from "dayjs";
|
||||||
import { FormattedMessage } from "react-intl";
|
import { FormattedMessage } from "react-intl";
|
||||||
|
import { createTimes } from "../../../../util/graph.util";
|
||||||
|
import { TimeRange, UnixTime } from "../../../../dataCache/time";
|
||||||
|
import { useTheme } from "@mui/material";
|
||||||
|
import { colors } from "../../../../index";
|
||||||
import ShortcutButton from "./ShortcutButton";
|
import ShortcutButton from "./ShortcutButton";
|
||||||
import { createTimes } from "../../../util/graph.util";
|
|
||||||
import { TimeRange, UnixTime } from "../../../dataCache/time";
|
|
||||||
import { TextField, useTheme } from "@mui/material";
|
|
||||||
import { colors } from "../../..";
|
|
||||||
|
|
||||||
interface DateRangePickerProps {
|
interface DateRangePickerProps {
|
||||||
setRange: (value: Date[]) => void;
|
setRange: (value: Date[]) => void;
|
||||||
|
|
@ -16,8 +16,8 @@ interface DateRangePickerProps {
|
||||||
}
|
}
|
||||||
|
|
||||||
const DateRangePicker = (props: DateRangePickerProps) => {
|
const DateRangePicker = (props: DateRangePickerProps) => {
|
||||||
const theme = useTheme();
|
|
||||||
const { setRange, range, getCacheSeries } = props;
|
const { setRange, range, getCacheSeries } = props;
|
||||||
|
const theme = useTheme();
|
||||||
|
|
||||||
const handleChange = (fromDate: Date, toDate: Date) => {
|
const handleChange = (fromDate: Date, toDate: Date) => {
|
||||||
const timeRange = createTimes(
|
const timeRange = createTimes(
|
||||||
|
|
@ -1,8 +1,6 @@
|
||||||
import { colors } from "@mui/material";
|
import { UnixTime, TimeSpan } from "../../../../dataCache/time";
|
||||||
import { UnixTime, TimeSpan } from "../../../dataCache/time";
|
import { createTimes } from "../../../../util/graph.util";
|
||||||
import { createTimes } from "../../../util/graph.util";
|
import InnovenergyButton from "../../../Layout/InnovenergyButton";
|
||||||
import InnovenergyButton from "../../Layout/InnovenergyButton";
|
|
||||||
import { red } from "@mui/material/colors";
|
|
||||||
|
|
||||||
interface ShortcutButtonProps {
|
interface ShortcutButtonProps {
|
||||||
setRange: (value: Date[]) => void;
|
setRange: (value: Date[]) => void;
|
||||||
|
|
@ -1,25 +1,23 @@
|
||||||
import Plot from "react-plotly.js";
|
import Plot from "react-plotly.js";
|
||||||
import { DataRecord, RecordSeries } from "../../../dataCache/data";
|
import { RecordSeries } from "../../../dataCache/data";
|
||||||
import {
|
import {
|
||||||
GraphData,
|
GraphData,
|
||||||
createTimes,
|
createTimes,
|
||||||
getTreeElements,
|
getTreeElements,
|
||||||
isNumeric,
|
isNumeric,
|
||||||
parseCsv,
|
|
||||||
stringToColor,
|
stringToColor,
|
||||||
transformToBarGraphData,
|
transformToBarGraphData,
|
||||||
} from "../../../util/graph.util";
|
} from "../../../util/graph.util";
|
||||||
import { TimeRange, TimeSpan, UnixTime } from "../../../dataCache/time";
|
import { TimeRange, TimeSpan, UnixTime } from "../../../dataCache/time";
|
||||||
import { useCallback, useContext, useEffect, useMemo, useState } from "react";
|
import { useCallback, useContext, useEffect, useMemo, useState } from "react";
|
||||||
import { BehaviorSubject, startWith, throttleTime, withLatestFrom } from "rxjs";
|
import { BehaviorSubject, startWith, throttleTime, withLatestFrom } from "rxjs";
|
||||||
import { S3Access } from "../../../dataCache/S3/S3Access";
|
|
||||||
import DataCache, { FetchResult } from "../../../dataCache/dataCache";
|
import DataCache, { FetchResult } from "../../../dataCache/dataCache";
|
||||||
import { LogContext } from "../../Context/LogContextProvider";
|
import { LogContext } from "../../Context/LogContextProvider";
|
||||||
import { isDefined } from "../../../dataCache/utils/maybe";
|
import { isDefined } from "../../../dataCache/utils/maybe";
|
||||||
import { Data, Icons, Layout, PlotRelayoutEvent, relayout } from "plotly.js";
|
import { Data, Icons, Layout, PlotRelayoutEvent } from "plotly.js";
|
||||||
import { AdapterDayjs } from "@mui/x-date-pickers/AdapterDayjs";
|
import { AdapterDayjs } from "@mui/x-date-pickers/AdapterDayjs";
|
||||||
import { FormattedMessage } from "react-intl";
|
import { FormattedMessage } from "react-intl";
|
||||||
import DateRangePicker from "./DateRangePicker";
|
import DateRangePicker from "./DatePicker/DateRangePicker";
|
||||||
import { LocalizationProvider } from "@mui/x-date-pickers";
|
import { LocalizationProvider } from "@mui/x-date-pickers";
|
||||||
import { Alert, useTheme } from "@mui/material";
|
import { Alert, useTheme } from "@mui/material";
|
||||||
import { S3CredentialsContext } from "../../Context/S3CredentialsContextProvider";
|
import { S3CredentialsContext } from "../../Context/S3CredentialsContextProvider";
|
||||||
|
|
@ -28,23 +26,26 @@ const NUMBER_OF_NODES = 100;
|
||||||
|
|
||||||
const ScalarGraph = () => {
|
const ScalarGraph = () => {
|
||||||
const timeRange = createTimes(
|
const timeRange = createTimes(
|
||||||
UnixTime.now()
|
UnixTime.now().rangeBefore(TimeSpan.fromDays(1)),
|
||||||
/* .fromTicks(1682085650) */
|
|
||||||
.rangeBefore(TimeSpan.fromDays(1)),
|
|
||||||
NUMBER_OF_NODES
|
NUMBER_OF_NODES
|
||||||
);
|
);
|
||||||
|
|
||||||
const [timeSeries, setTimeSeries] = useState<RecordSeries>([]);
|
const [timeSeries, setTimeSeries] = useState<RecordSeries>([]);
|
||||||
|
const [plotTitles, setPlotTitles] = useState<string[]>([]);
|
||||||
const [range, setRange] = useState([
|
const [range, setRange] = useState([
|
||||||
timeRange[0].toDate(),
|
timeRange[0].toDate(),
|
||||||
timeRange[timeRange.length - 1].toDate(),
|
timeRange[timeRange.length - 1].toDate(),
|
||||||
]);
|
]);
|
||||||
const [plotTitles, setPlotTitles] = useState<string[]>([]);
|
|
||||||
|
|
||||||
const { toggles, setToggles, checkedToggles } = useContext(LogContext);
|
const { toggles, setToggles, checkedToggles } = useContext(LogContext);
|
||||||
const { fetchData } = useContext(S3CredentialsContext);
|
const { fetchData } = useContext(S3CredentialsContext);
|
||||||
|
|
||||||
const times$ = useMemo(() => new BehaviorSubject(timeRange), []);
|
const times$ = useMemo(() => new BehaviorSubject(timeRange), []);
|
||||||
|
|
||||||
|
const cache = useMemo(() => {
|
||||||
|
return new DataCache(fetchData, TimeSpan.fromSeconds(2));
|
||||||
|
}, []);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const subscription = cache.gotData
|
const subscription = cache.gotData
|
||||||
.pipe(
|
.pipe(
|
||||||
|
|
@ -57,8 +58,6 @@ const ScalarGraph = () => {
|
||||||
setTimeSeries(timeSeries);
|
setTimeSeries(timeSeries);
|
||||||
|
|
||||||
const toggleValues = timeSeries.find((timeStamp) => timeStamp.value);
|
const toggleValues = timeSeries.find((timeStamp) => timeStamp.value);
|
||||||
console.log("toggles", timeSeries, toggleValues);
|
|
||||||
|
|
||||||
if (toggles === null && toggleValues && toggleValues.value) {
|
if (toggles === null && toggleValues && toggleValues.value) {
|
||||||
const treeElements = getTreeElements(toggleValues.value);
|
const treeElements = getTreeElements(toggleValues.value);
|
||||||
setToggles(treeElements);
|
setToggles(treeElements);
|
||||||
|
|
@ -67,10 +66,6 @@ const ScalarGraph = () => {
|
||||||
return () => subscription.unsubscribe();
|
return () => subscription.unsubscribe();
|
||||||
}, [toggles]);
|
}, [toggles]);
|
||||||
|
|
||||||
const cache = useMemo(() => {
|
|
||||||
return new DataCache(fetchData, TimeSpan.fromSeconds(2));
|
|
||||||
}, []);
|
|
||||||
|
|
||||||
const transformToGraphData = (input: RecordSeries): GraphData => {
|
const transformToGraphData = (input: RecordSeries): GraphData => {
|
||||||
const transformedObject: any = {};
|
const transformedObject: any = {};
|
||||||
|
|
||||||
|
|
@ -95,6 +90,7 @@ const ScalarGraph = () => {
|
||||||
setPlotTitles(Object.keys(transformedObject));
|
setPlotTitles(Object.keys(transformedObject));
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
return Object.keys(transformedObject).length > 0
|
return Object.keys(transformedObject).length > 0
|
||||||
? transformedObject
|
? transformedObject
|
||||||
: plotTitles.reduce(
|
: plotTitles.reduce(
|
||||||
|
|
@ -138,9 +134,7 @@ const ScalarGraph = () => {
|
||||||
[getCacheSeries]
|
[getCacheSeries]
|
||||||
);
|
);
|
||||||
|
|
||||||
const theme = useTheme();
|
|
||||||
const renderGraphs = () => {
|
const renderGraphs = () => {
|
||||||
console.log("toggles", toggles);
|
|
||||||
if (checkedToggles.length > 0) {
|
if (checkedToggles.length > 0) {
|
||||||
const coordinateTimeSeries = transformToGraphData(timeSeries);
|
const coordinateTimeSeries = transformToGraphData(timeSeries);
|
||||||
const visibleGraphs = Object.keys(coordinateTimeSeries).filter((path) => {
|
const visibleGraphs = Object.keys(coordinateTimeSeries).filter((path) => {
|
||||||
|
|
|
||||||
|
|
@ -1,10 +0,0 @@
|
||||||
.topologyBoxTitle{
|
|
||||||
margin-block-start: "0";
|
|
||||||
margin-block-end: "0";
|
|
||||||
background-color: titleColor;
|
|
||||||
padding: "5px";
|
|
||||||
border-top-left-radius: "4px";
|
|
||||||
border-top-right-radius: "4px";
|
|
||||||
display: "flex";
|
|
||||||
justify-content: "center";
|
|
||||||
}
|
|
||||||
|
|
@ -1,60 +0,0 @@
|
||||||
import { Box, CircularProgress, Alert, useTheme } from "@mui/material";
|
|
||||||
import { AxiosError } from "axios";
|
|
||||||
import { useState, useEffect, FC } from "react";
|
|
||||||
import { useParams } from "react-router-dom";
|
|
||||||
import axiosConfig from "../../config/axiosConfig";
|
|
||||||
export interface I_FormProps<T> {
|
|
||||||
values: T;
|
|
||||||
id: string;
|
|
||||||
hasMoveButton?: boolean;
|
|
||||||
}
|
|
||||||
interface I_DetailProps<T> {
|
|
||||||
formComponent: FC<I_FormProps<T>>;
|
|
||||||
route: string;
|
|
||||||
hasMoveButton?: boolean;
|
|
||||||
}
|
|
||||||
const Detail = <T extends { id: number }>(props: I_DetailProps<T>) => {
|
|
||||||
const { id } = useParams();
|
|
||||||
const { formComponent: FormComponent, route, hasMoveButton } = props;
|
|
||||||
const [values, setValues] = useState<T>();
|
|
||||||
const [loading, setLoading] = useState(false);
|
|
||||||
const [error, setError] = useState<AxiosError>();
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
setLoading(true);
|
|
||||||
axiosConfig
|
|
||||||
.get(route + id)
|
|
||||||
.then((res) => {
|
|
||||||
setValues(res.data);
|
|
||||||
setLoading(false);
|
|
||||||
})
|
|
||||||
.catch((err: AxiosError) => {
|
|
||||||
setError(err);
|
|
||||||
setLoading(false);
|
|
||||||
});
|
|
||||||
}, [id, route]);
|
|
||||||
const theme = useTheme();
|
|
||||||
|
|
||||||
if (values && values.id && values.id.toString() === id) {
|
|
||||||
return (
|
|
||||||
<FormComponent values={values} id={id} hasMoveButton={hasMoveButton} />
|
|
||||||
);
|
|
||||||
} else if (loading) {
|
|
||||||
return (
|
|
||||||
<Box
|
|
||||||
sx={{ width: 1 / 2, justifyContent: "center", display: "flex", mt: 10 }}
|
|
||||||
>
|
|
||||||
<CircularProgress sx={{ m: 2, color: theme.palette.secondary.main }} />
|
|
||||||
</Box>
|
|
||||||
);
|
|
||||||
} else if (error) {
|
|
||||||
return (
|
|
||||||
<Alert severity="error" sx={{ mt: 1 }}>
|
|
||||||
{error.message}
|
|
||||||
</Alert>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
return null;
|
|
||||||
};
|
|
||||||
|
|
||||||
export default Detail;
|
|
||||||
|
|
@ -18,7 +18,6 @@ const InnovenergyList = (props: InnovenergyListProps) => {
|
||||||
pb: 0,
|
pb: 0,
|
||||||
}}
|
}}
|
||||||
component="nav"
|
component="nav"
|
||||||
aria-labelledby="nested-list-subheader"
|
|
||||||
>
|
>
|
||||||
{props.children}
|
{props.children}
|
||||||
</List>
|
</List>
|
||||||
|
|
@ -0,0 +1,68 @@
|
||||||
|
import { InputLabel, TextField } from "@mui/material";
|
||||||
|
import { colors } from "../../index";
|
||||||
|
import { I_InnovenergyTextfieldProps } from "./InnovenergyTextfield";
|
||||||
|
|
||||||
|
interface InnovenergyPropertyGridProps {
|
||||||
|
rows: I_InnovenergyTextfieldProps[];
|
||||||
|
}
|
||||||
|
|
||||||
|
export const InnovenergyPropertyGrid = (
|
||||||
|
props: InnovenergyPropertyGridProps
|
||||||
|
) => {
|
||||||
|
return (
|
||||||
|
<div style={{ display: "flex", flexDirection: "row" }}>
|
||||||
|
<div
|
||||||
|
style={{
|
||||||
|
display: "flex",
|
||||||
|
flexDirection: "column",
|
||||||
|
justifyContent: "space-around",
|
||||||
|
marginRight: "20px",
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{props.rows.map((prop) => (
|
||||||
|
<InputLabel key={prop.label}>{prop.label}</InputLabel>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
{props.rows.map((element) => {
|
||||||
|
return (
|
||||||
|
<TextField
|
||||||
|
key={element.label}
|
||||||
|
color="secondary"
|
||||||
|
id={element.id}
|
||||||
|
variant="outlined"
|
||||||
|
name={element.name}
|
||||||
|
type={element.type}
|
||||||
|
fullWidth
|
||||||
|
sx={{
|
||||||
|
input: {
|
||||||
|
bgcolor: "white",
|
||||||
|
border: 0.5,
|
||||||
|
borderRadius: 1,
|
||||||
|
height: 15,
|
||||||
|
},
|
||||||
|
my: 0.5,
|
||||||
|
".Mui-focused": {
|
||||||
|
borderRadius: 1,
|
||||||
|
},
|
||||||
|
"MuiInputLabel-root": {
|
||||||
|
color: colors.black,
|
||||||
|
},
|
||||||
|
}}
|
||||||
|
value={element.value || ""}
|
||||||
|
onChange={element.handleChange}
|
||||||
|
InputProps={{
|
||||||
|
readOnly: element.readOnly,
|
||||||
|
}}
|
||||||
|
disabled={element.disabled}
|
||||||
|
helperText={element.helperText}
|
||||||
|
error={element.error}
|
||||||
|
/>
|
||||||
|
);
|
||||||
|
})}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default InnovenergyPropertyGrid;
|
||||||
|
|
@ -1,4 +1,4 @@
|
||||||
import { SxProps, Tabs, Theme, useTheme } from "@mui/material";
|
import { SxProps, Tabs, useTheme } from "@mui/material";
|
||||||
import { ReactNode } from "react";
|
import { ReactNode } from "react";
|
||||||
import { colors } from "index";
|
import { colors } from "index";
|
||||||
|
|
||||||
|
|
@ -25,7 +25,6 @@ const InnovenergyTabs = (props: AntTabsProps) => {
|
||||||
"&.Mui-selected": {
|
"&.Mui-selected": {
|
||||||
color: colors.black,
|
color: colors.black,
|
||||||
backgroundColor: theme.palette.primary.light,
|
backgroundColor: theme.palette.primary.light,
|
||||||
borderColor: `#90A7c5 #90A7c5 #fff`,
|
|
||||||
},
|
},
|
||||||
"& .MuiTabs-indicator": {
|
"& .MuiTabs-indicator": {
|
||||||
display: "flex",
|
display: "flex",
|
||||||
|
|
|
||||||
|
|
@ -1,17 +1,4 @@
|
||||||
import {
|
import { Grid, InputLabel, TextField } from "@mui/material";
|
||||||
Grid,
|
|
||||||
InputLabel,
|
|
||||||
Paper,
|
|
||||||
Table,
|
|
||||||
TableBody,
|
|
||||||
TableCell,
|
|
||||||
TableContainer,
|
|
||||||
TableHead,
|
|
||||||
TableRow,
|
|
||||||
TextField,
|
|
||||||
useTheme,
|
|
||||||
} from "@mui/material";
|
|
||||||
import { colors } from "../../index";
|
|
||||||
|
|
||||||
export interface I_InnovenergyTextfieldProps {
|
export interface I_InnovenergyTextfieldProps {
|
||||||
id: string;
|
id: string;
|
||||||
|
|
@ -26,67 +13,7 @@ export interface I_InnovenergyTextfieldProps {
|
||||||
error?: boolean;
|
error?: boolean;
|
||||||
}
|
}
|
||||||
|
|
||||||
export const IePropertyGrid = (props: {
|
|
||||||
rows: I_InnovenergyTextfieldProps[];
|
|
||||||
}) => {
|
|
||||||
return (
|
|
||||||
<div style={{ display: "flex", flexDirection: "row" }}>
|
|
||||||
<div
|
|
||||||
style={{
|
|
||||||
display: "flex",
|
|
||||||
flexDirection: "column",
|
|
||||||
justifyContent: "space-around",
|
|
||||||
marginRight: "20px",
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{props.rows.map((prop) => (
|
|
||||||
<InputLabel key={prop.label}>{prop.label}</InputLabel>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
{props.rows.map((element) => {
|
|
||||||
return (
|
|
||||||
<TextField
|
|
||||||
key={element.label}
|
|
||||||
color="secondary"
|
|
||||||
id={element.id}
|
|
||||||
variant="outlined"
|
|
||||||
name={element.name}
|
|
||||||
type={element.type}
|
|
||||||
fullWidth
|
|
||||||
sx={{
|
|
||||||
input: {
|
|
||||||
bgcolor: "white",
|
|
||||||
border: 0.5,
|
|
||||||
borderRadius: 1,
|
|
||||||
height: 15,
|
|
||||||
},
|
|
||||||
my: 0.5,
|
|
||||||
".Mui-focused": {
|
|
||||||
borderRadius: 1,
|
|
||||||
},
|
|
||||||
"MuiInputLabel-root": {
|
|
||||||
color: colors.black,
|
|
||||||
},
|
|
||||||
}}
|
|
||||||
value={element.value || ""}
|
|
||||||
onChange={element.handleChange}
|
|
||||||
InputProps={{
|
|
||||||
readOnly: element.readOnly,
|
|
||||||
}}
|
|
||||||
disabled={element.disabled}
|
|
||||||
helperText={element.helperText}
|
|
||||||
error={element.error}
|
|
||||||
/>
|
|
||||||
);
|
|
||||||
})}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
const InnovenergyTextfield = (props: I_InnovenergyTextfieldProps) => {
|
const InnovenergyTextfield = (props: I_InnovenergyTextfieldProps) => {
|
||||||
const theme = useTheme();
|
|
||||||
return (
|
return (
|
||||||
<Grid container direction="row" alignItems="center" spacing={2}>
|
<Grid container direction="row" alignItems="center" spacing={2}>
|
||||||
<Grid item xs={3}>
|
<Grid item xs={3}>
|
||||||
|
|
@ -107,7 +34,6 @@ const InnovenergyTextfield = (props: I_InnovenergyTextfieldProps) => {
|
||||||
borderRadius: 1,
|
borderRadius: 1,
|
||||||
},
|
},
|
||||||
my: 0.5,
|
my: 0.5,
|
||||||
borderColor: "red",
|
|
||||||
}}
|
}}
|
||||||
value={props.value || ""}
|
value={props.value || ""}
|
||||||
onChange={props.handleChange}
|
onChange={props.handleChange}
|
||||||
|
|
|
||||||
|
|
@ -2,7 +2,7 @@ import { TreeItem, TreeItemProps } from "@mui/lab";
|
||||||
import { colors } from "../../index";
|
import { colors } from "../../index";
|
||||||
import { useTheme } from "@mui/material";
|
import { useTheme } from "@mui/material";
|
||||||
|
|
||||||
const InnovEnergyTreeItem = (props: TreeItemProps) => {
|
const InnovenergyTreeItem = (props: TreeItemProps) => {
|
||||||
const theme = useTheme();
|
const theme = useTheme();
|
||||||
return (
|
return (
|
||||||
<TreeItem
|
<TreeItem
|
||||||
|
|
@ -37,4 +37,4 @@ const InnovEnergyTreeItem = (props: TreeItemProps) => {
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
export default InnovEnergyTreeItem;
|
export default InnovenergyTreeItem;
|
||||||
|
|
@ -2,7 +2,7 @@ import { FormattedMessage } from "react-intl";
|
||||||
import { useNavigate } from "react-router-dom";
|
import { useNavigate } from "react-router-dom";
|
||||||
import axiosConfig from "../../config/axiosConfig";
|
import axiosConfig from "../../config/axiosConfig";
|
||||||
import InnovenergyButton from "./InnovenergyButton";
|
import InnovenergyButton from "./InnovenergyButton";
|
||||||
import { colors } from "index";
|
import { useTheme } from "@mui/material";
|
||||||
|
|
||||||
interface LogoutButtonProps {
|
interface LogoutButtonProps {
|
||||||
removeToken: () => void;
|
removeToken: () => void;
|
||||||
|
|
@ -10,6 +10,7 @@ interface LogoutButtonProps {
|
||||||
|
|
||||||
const LogoutButton = (props: LogoutButtonProps) => {
|
const LogoutButton = (props: LogoutButtonProps) => {
|
||||||
const navigate = useNavigate();
|
const navigate = useNavigate();
|
||||||
|
const theme = useTheme();
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<InnovenergyButton
|
<InnovenergyButton
|
||||||
|
|
@ -20,7 +21,11 @@ const LogoutButton = (props: LogoutButtonProps) => {
|
||||||
props.removeToken();
|
props.removeToken();
|
||||||
});
|
});
|
||||||
}}
|
}}
|
||||||
sx={{ mx: 1, bgcolor: colors.orangeSelected, textTransform: "none" }}
|
sx={{
|
||||||
|
mx: 1,
|
||||||
|
bgcolor: theme.palette.secondary.main,
|
||||||
|
textTransform: "none",
|
||||||
|
}}
|
||||||
>
|
>
|
||||||
<FormattedMessage id="logout" defaultMessage="Logout" />
|
<FormattedMessage id="logout" defaultMessage="Logout" />
|
||||||
</InnovenergyButton>
|
</InnovenergyButton>
|
||||||
|
|
|
||||||
|
|
@ -27,10 +27,14 @@ const ModeButtons = () => {
|
||||||
>
|
>
|
||||||
<ToggleButton
|
<ToggleButton
|
||||||
sx={{
|
sx={{
|
||||||
color: "#707071",
|
color: theme.palette.text.secondary,
|
||||||
"&.Mui-selected": {
|
"&.Mui-selected": {
|
||||||
bgcolor: theme.palette.primary.dark,
|
bgcolor: theme.palette.secondary.dark,
|
||||||
color: "#707071",
|
color: theme.palette.text.primary,
|
||||||
|
},
|
||||||
|
"&.Mui-selected:hover": {
|
||||||
|
bgcolor: theme.palette.secondary.dark,
|
||||||
|
color: theme.palette.text.primary,
|
||||||
},
|
},
|
||||||
}}
|
}}
|
||||||
id="mode-toggle-button-list"
|
id="mode-toggle-button-list"
|
||||||
|
|
@ -42,10 +46,14 @@ const ModeButtons = () => {
|
||||||
</ToggleButton>
|
</ToggleButton>
|
||||||
<ToggleButton
|
<ToggleButton
|
||||||
sx={{
|
sx={{
|
||||||
color: "#707071",
|
color: theme.palette.text.secondary,
|
||||||
"&.Mui-selected": {
|
"&.Mui-selected": {
|
||||||
bgcolor: theme.palette.primary.dark,
|
bgcolor: theme.palette.secondary.dark,
|
||||||
color: "#707071",
|
color: theme.palette.text.primary,
|
||||||
|
},
|
||||||
|
"&.Mui-selected:hover": {
|
||||||
|
bgcolor: theme.palette.secondary.dark,
|
||||||
|
color: theme.palette.text.primary,
|
||||||
},
|
},
|
||||||
}}
|
}}
|
||||||
id="mode-toggle-button-tree"
|
id="mode-toggle-button-tree"
|
||||||
|
|
|
||||||
|
|
@ -1,4 +1,10 @@
|
||||||
import { Dialog, DialogTitle, IconButton, DialogContent, colors } from "@mui/material";
|
import {
|
||||||
|
Dialog,
|
||||||
|
DialogTitle,
|
||||||
|
IconButton,
|
||||||
|
DialogContent,
|
||||||
|
colors,
|
||||||
|
} from "@mui/material";
|
||||||
import { useState } from "react";
|
import { useState } from "react";
|
||||||
import { FormattedMessage, useIntl } from "react-intl";
|
import { FormattedMessage, useIntl } from "react-intl";
|
||||||
import axiosConfig from "../../config/axiosConfig";
|
import axiosConfig from "../../config/axiosConfig";
|
||||||
|
|
@ -24,7 +30,7 @@ const AddUser = () => {
|
||||||
<>
|
<>
|
||||||
<InnovenergyButton
|
<InnovenergyButton
|
||||||
id="add-user-button"
|
id="add-user-button"
|
||||||
sx={{ my: 1, }}
|
sx={{ my: 1 }}
|
||||||
onClick={() => setOpen(true)}
|
onClick={() => setOpen(true)}
|
||||||
>
|
>
|
||||||
<FormattedMessage id="addUser" defaultMessage="Create user" />
|
<FormattedMessage id="addUser" defaultMessage="Create user" />
|
||||||
|
|
@ -37,7 +43,6 @@ const AddUser = () => {
|
||||||
".MuiDialogContent-root": { overflowX: "hidden" },
|
".MuiDialogContent-root": { overflowX: "hidden" },
|
||||||
maxHeight: 500,
|
maxHeight: 500,
|
||||||
}}
|
}}
|
||||||
scroll="paper"
|
|
||||||
fullWidth
|
fullWidth
|
||||||
maxWidth="sm"
|
maxWidth="sm"
|
||||||
>
|
>
|
||||||
|
|
|
||||||
|
|
@ -1,4 +1,10 @@
|
||||||
import { Box, CircularProgress, Alert, collapseClasses, useTheme } from "@mui/material";
|
import {
|
||||||
|
Box,
|
||||||
|
CircularProgress,
|
||||||
|
Alert,
|
||||||
|
collapseClasses,
|
||||||
|
useTheme,
|
||||||
|
} from "@mui/material";
|
||||||
import { AxiosError } from "axios";
|
import { AxiosError } from "axios";
|
||||||
import { useState, useEffect } from "react";
|
import { useState, useEffect } from "react";
|
||||||
import { useParams } from "react-router-dom";
|
import { useParams } from "react-router-dom";
|
||||||
|
|
@ -8,10 +14,11 @@ import UserForm from "./UserForm";
|
||||||
import { useIntl } from "react-intl";
|
import { useIntl } from "react-intl";
|
||||||
import { colors } from "../..";
|
import { colors } from "../..";
|
||||||
|
|
||||||
interface I_DetailProps {
|
interface I_UserProps {
|
||||||
hasMoveButton?: boolean;
|
hasMoveButton?: boolean;
|
||||||
}
|
}
|
||||||
const Detail = (props: I_DetailProps) => {
|
|
||||||
|
const User = (props: I_UserProps) => {
|
||||||
const { id } = useParams();
|
const { id } = useParams();
|
||||||
const { locale } = useIntl();
|
const { locale } = useIntl();
|
||||||
const [values, setValues] = useState<I_User>();
|
const [values, setValues] = useState<I_User>();
|
||||||
|
|
@ -56,7 +63,7 @@ const Detail = (props: I_DetailProps) => {
|
||||||
borderTopLeftRadius: 0,
|
borderTopLeftRadius: 0,
|
||||||
WebkitBorderTopRightRadius: 0,
|
WebkitBorderTopRightRadius: 0,
|
||||||
borderBottomLeftRadius: 4,
|
borderBottomLeftRadius: 4,
|
||||||
borderBottomRightRadius: 4,
|
borderBottomRightRadius: 4,
|
||||||
borderColor: theme.palette.text.disabled,
|
borderColor: theme.palette.text.disabled,
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
|
|
@ -68,7 +75,7 @@ const Detail = (props: I_DetailProps) => {
|
||||||
<Box
|
<Box
|
||||||
sx={{ width: 1 / 2, justifyContent: "center", display: "flex", mt: 10 }}
|
sx={{ width: 1 / 2, justifyContent: "center", display: "flex", mt: 10 }}
|
||||||
>
|
>
|
||||||
<CircularProgress sx={{ m: 2 ,color: theme.palette.secondary.main}} />
|
<CircularProgress sx={{ m: 2, color: theme.palette.secondary.main }} />
|
||||||
</Box>
|
</Box>
|
||||||
);
|
);
|
||||||
} else if (error) {
|
} else if (error) {
|
||||||
|
|
@ -81,4 +88,4 @@ const Detail = (props: I_DetailProps) => {
|
||||||
return null;
|
return null;
|
||||||
};
|
};
|
||||||
|
|
||||||
export default Detail;
|
export default User;
|
||||||
|
|
|
||||||
|
|
@ -11,17 +11,16 @@ import { useContext, useState } from "react";
|
||||||
import { FormattedMessage, useIntl } from "react-intl";
|
import { FormattedMessage, useIntl } from "react-intl";
|
||||||
import { I_User } from "../../util/user.util";
|
import { I_User } from "../../util/user.util";
|
||||||
import InnovenergyButton from "../Layout/InnovenergyButton";
|
import InnovenergyButton from "../Layout/InnovenergyButton";
|
||||||
import InnovenergyTextfield, {
|
import { I_InnovenergyTextfieldProps } from "../Layout/InnovenergyTextfield";
|
||||||
I_InnovenergyTextfieldProps,
|
|
||||||
IePropertyGrid,
|
|
||||||
} from "../Layout/InnovenergyTextfield";
|
|
||||||
import { UserContext } from "../Context/UserContextProvider";
|
import { UserContext } from "../Context/UserContextProvider";
|
||||||
import { UsersContext } from "../Context/UsersContextProvider";
|
import { UsersContext } from "../Context/UsersContextProvider";
|
||||||
|
import InnovenergyPropertyGrid from "../Layout/InnovenergyPropertyGrid";
|
||||||
|
|
||||||
interface I_UserFormProps {
|
interface I_UserFormProps {
|
||||||
handleSubmit: (formikValues: Partial<I_User>) => Promise<AxiosResponse>;
|
handleSubmit: (formikValues: Partial<I_User>) => Promise<AxiosResponse>;
|
||||||
values?: I_User;
|
values?: I_User;
|
||||||
}
|
}
|
||||||
|
|
||||||
const UserForm = (props: I_UserFormProps) => {
|
const UserForm = (props: I_UserFormProps) => {
|
||||||
const { values, handleSubmit } = props;
|
const { values, handleSubmit } = props;
|
||||||
const [open, setOpen] = useState(false);
|
const [open, setOpen] = useState(false);
|
||||||
|
|
@ -100,7 +99,7 @@ const UserForm = (props: I_UserFormProps) => {
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<form onSubmit={formik.handleSubmit}>
|
<form onSubmit={formik.handleSubmit}>
|
||||||
<IePropertyGrid rows={rows} />
|
<InnovenergyPropertyGrid rows={rows} />
|
||||||
<Grid container justifyContent="flex-end" sx={{ pt: 1 }}>
|
<Grid container justifyContent="flex-end" sx={{ pt: 1 }}>
|
||||||
{loading && (
|
{loading && (
|
||||||
<CircularProgress sx={{ color: theme.palette.secondary.main }} />
|
<CircularProgress sx={{ color: theme.palette.secondary.main }} />
|
||||||
|
|
@ -125,7 +124,6 @@ const UserForm = (props: I_UserFormProps) => {
|
||||||
severity={error ? "error" : "success"}
|
severity={error ? "error" : "success"}
|
||||||
sx={{ width: "100%" }}
|
sx={{ width: "100%" }}
|
||||||
>
|
>
|
||||||
{/* TODO how to handle err translation? */}
|
|
||||||
{error ? (
|
{error ? (
|
||||||
<FormattedMessage id="error" defaultMessage={error.message} />
|
<FormattedMessage id="error" defaultMessage={error.message} />
|
||||||
) : (
|
) : (
|
||||||
|
|
|
||||||
|
|
@ -44,7 +44,6 @@ const UserList = (props: UserListProps) => {
|
||||||
<List
|
<List
|
||||||
sx={{
|
sx={{
|
||||||
width: "100%",
|
width: "100%",
|
||||||
bgcolor: "background.paper",
|
|
||||||
position: "relative",
|
position: "relative",
|
||||||
overflow: "auto",
|
overflow: "auto",
|
||||||
py: 0,
|
py: 0,
|
||||||
|
|
|
||||||
|
|
@ -1,16 +0,0 @@
|
||||||
body {
|
|
||||||
margin: 0;
|
|
||||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
|
|
||||||
'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
|
|
||||||
sans-serif;
|
|
||||||
-webkit-font-smoothing: antialiased;
|
|
||||||
-moz-osx-font-smoothing: grayscale;
|
|
||||||
}
|
|
||||||
|
|
||||||
code {
|
|
||||||
font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
|
|
||||||
monospace;
|
|
||||||
}
|
|
||||||
body {
|
|
||||||
background-color: #f3f4f7;
|
|
||||||
}
|
|
||||||
|
|
@ -1,6 +1,5 @@
|
||||||
import React from "react";
|
import React from "react";
|
||||||
import ReactDOM from "react-dom/client";
|
import ReactDOM from "react-dom/client";
|
||||||
import "./index.css";
|
|
||||||
import App from "./App";
|
import App from "./App";
|
||||||
import reportWebVitals from "./reportWebVitals";
|
import reportWebVitals from "./reportWebVitals";
|
||||||
import { createTheme, ThemeProvider } from "@mui/material";
|
import { createTheme, ThemeProvider } from "@mui/material";
|
||||||
|
|
@ -12,6 +11,7 @@ const root = ReactDOM.createRoot(
|
||||||
|
|
||||||
export const colors = {
|
export const colors = {
|
||||||
black: "#000000",
|
black: "#000000",
|
||||||
|
darkGrey: "#707071",
|
||||||
blueBlack: "#2b3e54",
|
blueBlack: "#2b3e54",
|
||||||
borderColor: "#a8b0be",
|
borderColor: "#a8b0be",
|
||||||
|
|
||||||
|
|
@ -38,6 +38,7 @@ const theme = createTheme({
|
||||||
palette: {
|
palette: {
|
||||||
text: {
|
text: {
|
||||||
primary: colors.black,
|
primary: colors.black,
|
||||||
|
secondary: colors.darkGrey,
|
||||||
disabled: colors.borderColor,
|
disabled: colors.borderColor,
|
||||||
},
|
},
|
||||||
primary: {
|
primary: {
|
||||||
|
|
|
||||||
|
|
@ -1 +0,0 @@
|
||||||
$innovenergy-orange: #F59100;
|
|
||||||
|
|
@ -1 +0,0 @@
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 841.9 595.3"><g fill="#61DAFB"><path d="M666.3 296.5c0-32.5-40.7-63.3-103.1-82.4 14.4-63.6 8-114.2-20.2-130.4-6.5-3.8-14.1-5.6-22.4-5.6v22.3c4.6 0 8.3.9 11.4 2.6 13.6 7.8 19.5 37.5 14.9 75.7-1.1 9.4-2.9 19.3-5.1 29.4-19.6-4.8-41-8.5-63.5-10.9-13.5-18.5-27.5-35.3-41.6-50 32.6-30.3 63.2-46.9 84-46.9V78c-27.5 0-63.5 19.6-99.9 53.6-36.4-33.8-72.4-53.2-99.9-53.2v22.3c20.7 0 51.4 16.5 84 46.6-14 14.7-28 31.4-41.3 49.9-22.6 2.4-44 6.1-63.6 11-2.3-10-4-19.7-5.2-29-4.7-38.2 1.1-67.9 14.6-75.8 3-1.8 6.9-2.6 11.5-2.6V78.5c-8.4 0-16 1.8-22.6 5.6-28.1 16.2-34.4 66.7-19.9 130.1-62.2 19.2-102.7 49.9-102.7 82.3 0 32.5 40.7 63.3 103.1 82.4-14.4 63.6-8 114.2 20.2 130.4 6.5 3.8 14.1 5.6 22.5 5.6 27.5 0 63.5-19.6 99.9-53.6 36.4 33.8 72.4 53.2 99.9 53.2 8.4 0 16-1.8 22.6-5.6 28.1-16.2 34.4-66.7 19.9-130.1 62-19.1 102.5-49.9 102.5-82.3zm-130.2-66.7c-3.7 12.9-8.3 26.2-13.5 39.5-4.1-8-8.4-16-13.1-24-4.6-8-9.5-15.8-14.4-23.4 14.2 2.1 27.9 4.7 41 7.9zm-45.8 106.5c-7.8 13.5-15.8 26.3-24.1 38.2-14.9 1.3-30 2-45.2 2-15.1 0-30.2-.7-45-1.9-8.3-11.9-16.4-24.6-24.2-38-7.6-13.1-14.5-26.4-20.8-39.8 6.2-13.4 13.2-26.8 20.7-39.9 7.8-13.5 15.8-26.3 24.1-38.2 14.9-1.3 30-2 45.2-2 15.1 0 30.2.7 45 1.9 8.3 11.9 16.4 24.6 24.2 38 7.6 13.1 14.5 26.4 20.8 39.8-6.3 13.4-13.2 26.8-20.7 39.9zm32.3-13c5.4 13.4 10 26.8 13.8 39.8-13.1 3.2-26.9 5.9-41.2 8 4.9-7.7 9.8-15.6 14.4-23.7 4.6-8 8.9-16.1 13-24.1zM421.2 430c-9.3-9.6-18.6-20.3-27.8-32 9 .4 18.2.7 27.5.7 9.4 0 18.7-.2 27.8-.7-9 11.7-18.3 22.4-27.5 32zm-74.4-58.9c-14.2-2.1-27.9-4.7-41-7.9 3.7-12.9 8.3-26.2 13.5-39.5 4.1 8 8.4 16 13.1 24 4.7 8 9.5 15.8 14.4 23.4zM420.7 163c9.3 9.6 18.6 20.3 27.8 32-9-.4-18.2-.7-27.5-.7-9.4 0-18.7.2-27.8.7 9-11.7 18.3-22.4 27.5-32zm-74 58.9c-4.9 7.7-9.8 15.6-14.4 23.7-4.6 8-8.9 16-13 24-5.4-13.4-10-26.8-13.8-39.8 13.1-3.1 26.9-5.8 41.2-7.9zm-90.5 125.2c-35.4-15.1-58.3-34.9-58.3-50.6 0-15.7 22.9-35.6 58.3-50.6 8.6-3.7 18-7 27.7-10.1 5.7 19.6 13.2 40 22.5 60.9-9.2 20.8-16.6 41.1-22.2 60.6-9.9-3.1-19.3-6.5-28-10.2zM310 490c-13.6-7.8-19.5-37.5-14.9-75.7 1.1-9.4 2.9-19.3 5.1-29.4 19.6 4.8 41 8.5 63.5 10.9 13.5 18.5 27.5 35.3 41.6 50-32.6 30.3-63.2 46.9-84 46.9-4.5-.1-8.3-1-11.3-2.7zm237.2-76.2c4.7 38.2-1.1 67.9-14.6 75.8-3 1.8-6.9 2.6-11.5 2.6-20.7 0-51.4-16.5-84-46.6 14-14.7 28-31.4 41.3-49.9 22.6-2.4 44-6.1 63.6-11 2.3 10.1 4.1 19.8 5.2 29.1zm38.5-66.7c-8.6 3.7-18 7-27.7 10.1-5.7-19.6-13.2-40-22.5-60.9 9.2-20.8 16.6-41.1 22.2-60.6 9.9 3.1 19.3 6.5 28.1 10.2 35.4 15.1 58.3 34.9 58.3 50.6-.1 15.7-23 35.6-58.4 50.6zM320.8 78.4z"/><circle cx="420.9" cy="296.5" r="45.7"/><path d="M520.5 78.1z"/></g></svg>
|
|
||||||
|
Before Width: | Height: | Size: 2.6 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 12 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 12 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 50 KiB |
|
|
@ -6,7 +6,7 @@ import { isDefined } from "../dataCache/utils/maybe";
|
||||||
import {
|
import {
|
||||||
BoxData,
|
BoxData,
|
||||||
BoxDataValue,
|
BoxDataValue,
|
||||||
} from "../components/Installations/Log/TopologyBox";
|
} from "../components/Installations/LiveView/TopologyBox";
|
||||||
|
|
||||||
export interface GraphCoordinates {
|
export interface GraphCoordinates {
|
||||||
x: Datum[] | Datum[][] | TypedArray;
|
x: Datum[] | Datum[][] | TypedArray;
|
||||||
|
|
@ -146,6 +146,7 @@ export const extractTopologyValues = (
|
||||||
(topologyPath) => timeSeriesValue[topologyPath]
|
(topologyPath) => timeSeriesValue[topologyPath]
|
||||||
);
|
);
|
||||||
switch (topologyKey as keyof TopologyValues) {
|
switch (topologyKey as keyof TopologyValues) {
|
||||||
|
// special cases for certain connections should be extracted accordingly in this switch
|
||||||
case "gridToAcInConnection":
|
case "gridToAcInConnection":
|
||||||
topologyValues = [
|
topologyValues = [
|
||||||
values.reduce(
|
values.reduce(
|
||||||
|
|
@ -215,11 +216,6 @@ export const parseCsv = (text: string): DataRecord => {
|
||||||
});
|
});
|
||||||
return y
|
return y
|
||||||
.map((fields) => {
|
.map((fields) => {
|
||||||
if (fields[0].includes("LoadOnAcIsland")) {
|
|
||||||
console.log("fields", fields, {
|
|
||||||
[fields[0]]: { value: parseFloat(fields[1]), unit: fields[2] },
|
|
||||||
});
|
|
||||||
}
|
|
||||||
if (isNaN(Number(fields[1])) || fields[1] === "") {
|
if (isNaN(Number(fields[1])) || fields[1] === "") {
|
||||||
return { [fields[0]]: { value: fields[1], unit: fields[2] } };
|
return { [fields[0]]: { value: fields[1], unit: fields[2] } };
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue