u
This commit is contained in:
@@ -1,15 +1,11 @@
|
|||||||
import React, { Component } from 'react';
|
import React, { Component } from 'react';
|
||||||
import { BrowserRouter, Routes, Route, Link, Navigate } from 'react-router-dom';
|
import { BrowserRouter, Routes, Route, Link, Navigate } from 'react-router-dom';
|
||||||
import { AppBar, Toolbar, Typography, Button, Box, IconButton, CssBaseline } from '@mui/material';
|
import { AppBar, Toolbar, Typography, Button, Box, CssBaseline } from '@mui/material';
|
||||||
import { ThemeProvider, createTheme } from '@mui/material/styles';
|
import { ThemeProvider, createTheme } from '@mui/material/styles';
|
||||||
import SettingsIcon from '@mui/icons-material/Settings';
|
|
||||||
import ShowChartIcon from '@mui/icons-material/ShowChart';
|
|
||||||
import DashboardIcon from '@mui/icons-material/Dashboard';
|
import DashboardIcon from '@mui/icons-material/Dashboard';
|
||||||
import RuleIcon from '@mui/icons-material/Rule';
|
import RuleIcon from '@mui/icons-material/Rule';
|
||||||
import SettingsInputComponentIcon from '@mui/icons-material/SettingsInputComponent';
|
import SettingsInputComponentIcon from '@mui/icons-material/SettingsInputComponent';
|
||||||
|
|
||||||
import Settings from './components/Settings';
|
|
||||||
import Chart from './components/Chart';
|
|
||||||
import Login from './components/Login';
|
import Login from './components/Login';
|
||||||
import ViewManager from './components/ViewManager';
|
import ViewManager from './components/ViewManager';
|
||||||
import ViewDisplay from './components/ViewDisplay';
|
import ViewDisplay from './components/ViewDisplay';
|
||||||
@@ -36,23 +32,12 @@ export default class App extends Component {
|
|||||||
constructor(props) {
|
constructor(props) {
|
||||||
super(props);
|
super(props);
|
||||||
this.state = {
|
this.state = {
|
||||||
selectedChannels: [],
|
|
||||||
user: null, // { username, role, token }
|
user: null, // { username, role, token }
|
||||||
loading: true
|
loading: true
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
componentDidMount() {
|
componentDidMount() {
|
||||||
// Load selection from local storage
|
|
||||||
const saved = localStorage.getItem('selectedChannels');
|
|
||||||
if (saved) {
|
|
||||||
try {
|
|
||||||
this.setState({ selectedChannels: JSON.parse(saved) });
|
|
||||||
} catch (e) {
|
|
||||||
console.error("Failed to parse saved channels");
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// Check for existing token
|
// Check for existing token
|
||||||
const token = localStorage.getItem('authToken');
|
const token = localStorage.getItem('authToken');
|
||||||
const username = localStorage.getItem('authUser');
|
const username = localStorage.getItem('authUser');
|
||||||
@@ -65,11 +50,6 @@ export default class App extends Component {
|
|||||||
this.setState({ loading: false });
|
this.setState({ loading: false });
|
||||||
}
|
}
|
||||||
|
|
||||||
handleSelectionChange = (newSelection) => {
|
|
||||||
this.setState({ selectedChannels: newSelection });
|
|
||||||
localStorage.setItem('selectedChannels', JSON.stringify(newSelection));
|
|
||||||
};
|
|
||||||
|
|
||||||
handleLogin = (userData) => {
|
handleLogin = (userData) => {
|
||||||
this.setState({ user: userData });
|
this.setState({ user: userData });
|
||||||
localStorage.setItem('authToken', userData.token);
|
localStorage.setItem('authToken', userData.token);
|
||||||
@@ -85,7 +65,7 @@ export default class App extends Component {
|
|||||||
};
|
};
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
const { selectedChannels, user, loading } = this.state;
|
const { user } = this.state;
|
||||||
|
|
||||||
// While checking auth, we could show loader, but it's sync here mostly.
|
// While checking auth, we could show loader, but it's sync here mostly.
|
||||||
|
|
||||||
@@ -101,20 +81,12 @@ export default class App extends Component {
|
|||||||
</Typography>
|
</Typography>
|
||||||
|
|
||||||
<Button color="inherit" component={Link} to="/" startIcon={<DashboardIcon />}>Views</Button>
|
<Button color="inherit" component={Link} to="/" startIcon={<DashboardIcon />}>Views</Button>
|
||||||
{user && (
|
|
||||||
<>
|
|
||||||
<Button color="inherit" component={Link} to="/live" startIcon={<ShowChartIcon />}>Live</Button>
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
{user && user.role === 'admin' && (
|
{user && user.role === 'admin' && (
|
||||||
<>
|
<>
|
||||||
<Button color="inherit" component={Link} to="/rules" startIcon={<RuleIcon />}>Rules</Button>
|
<Button color="inherit" component={Link} to="/rules" startIcon={<RuleIcon />}>Rules</Button>
|
||||||
<Button color="inherit" component={Link} to="/outputs" startIcon={<SettingsInputComponentIcon />}>Outputs</Button>
|
<Button color="inherit" component={Link} to="/outputs" startIcon={<SettingsInputComponentIcon />}>Outputs</Button>
|
||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
{user && (
|
|
||||||
<Button color="inherit" component={Link} to="/settings" startIcon={<SettingsIcon />}>Settings</Button>
|
|
||||||
)}
|
|
||||||
|
|
||||||
{user ? (
|
{user ? (
|
||||||
<Button color="inherit" onClick={this.handleLogout}>Logout ({user.username})</Button>
|
<Button color="inherit" onClick={this.handleLogout}>Logout ({user.username})</Button>
|
||||||
@@ -129,17 +101,6 @@ export default class App extends Component {
|
|||||||
<Route path="/views/:id" element={<ViewDisplay />} />
|
<Route path="/views/:id" element={<ViewDisplay />} />
|
||||||
<Route path="/rules" element={<RuleEditor user={user} />} />
|
<Route path="/rules" element={<RuleEditor user={user} />} />
|
||||||
<Route path="/outputs" element={<OutputConfigEditor user={user} />} />
|
<Route path="/outputs" element={<OutputConfigEditor user={user} />} />
|
||||||
<Route path="/live" element={
|
|
||||||
<Chart
|
|
||||||
selectedChannels={selectedChannels}
|
|
||||||
/>
|
|
||||||
} />
|
|
||||||
<Route path="/settings" element={
|
|
||||||
<Settings
|
|
||||||
selectedChannels={selectedChannels}
|
|
||||||
onSelectionChange={this.handleSelectionChange}
|
|
||||||
/>
|
|
||||||
} />
|
|
||||||
<Route path="/login" element={<Login onLogin={this.handleLogin} />} />
|
<Route path="/login" element={<Login onLogin={this.handleLogin} />} />
|
||||||
<Route path="*" element={<Navigate to="/" replace />} />
|
<Route path="*" element={<Navigate to="/" replace />} />
|
||||||
</Routes>
|
</Routes>
|
||||||
|
|||||||
@@ -178,15 +178,7 @@ class ViewManager extends Component {
|
|||||||
|
|
||||||
// Emoji for rule based on action channel
|
// Emoji for rule based on action channel
|
||||||
getRuleEmoji = (rule) => {
|
getRuleEmoji = (rule) => {
|
||||||
const channel = rule.action?.channel || '';
|
return '⚡';
|
||||||
const emojis = {
|
|
||||||
'CircFanLevel': '🌀',
|
|
||||||
'CO2Valve': '🫧',
|
|
||||||
'BigDehumid': '💧',
|
|
||||||
'TentExhaust': '💨',
|
|
||||||
'RoomExhaust': '🌬️'
|
|
||||||
};
|
|
||||||
return emojis[channel] || '⚡';
|
|
||||||
};
|
};
|
||||||
|
|
||||||
// Format conditions for display - returns React components with visual grouping
|
// Format conditions for display - returns React components with visual grouping
|
||||||
@@ -304,14 +296,7 @@ class ViewManager extends Component {
|
|||||||
// Format action for display
|
// Format action for display
|
||||||
formatRuleAction = (action) => {
|
formatRuleAction = (action) => {
|
||||||
if (!action?.channel) return '?';
|
if (!action?.channel) return '?';
|
||||||
const channelNames = {
|
const name = action.channel;
|
||||||
'CircFanLevel': '🌀 Circ Fan',
|
|
||||||
'CO2Valve': '🫧 CO2',
|
|
||||||
'BigDehumid': '💧 Big Dehumid',
|
|
||||||
'TentExhaust': '💨 Tent Exhaust Fan',
|
|
||||||
'RoomExhaust': '🌬️ Room Exhaust'
|
|
||||||
};
|
|
||||||
const name = channelNames[action.channel] || action.channel;
|
|
||||||
|
|
||||||
if (action.value && action.value.type === 'calculated') {
|
if (action.value && action.value.type === 'calculated') {
|
||||||
return `${name} = (${action.value.sensorA} - ${action.value.sensorB || '0'}) * ${action.value.factor} + ${action.value.offset}`;
|
return `${name} = (${action.value.sensorA} - ${action.value.sensorB || '0'}) * ${action.value.factor} + ${action.value.offset}`;
|
||||||
|
|||||||
Reference in New Issue
Block a user