Compare commits
13 Commits
v1.0.14-DE
...
master
| Author | SHA1 | Date | |
|---|---|---|---|
| f4b48eaaad | |||
| eb83e4f598 | |||
| 4cd1ad4530 | |||
| 9ebd7786ad | |||
| 627c2c6d76 | |||
| a830438604 | |||
| 5bcd96cf4e | |||
| 6576ea13b6 | |||
| a17f2091a1 | |||
| 475e1e1b45 | |||
| 65e8404592 | |||
| 5b50fc362e | |||
| 7d93212f7f |
@ -3,6 +3,7 @@ on:
|
||||
push:
|
||||
branches:
|
||||
- master
|
||||
- dev
|
||||
|
||||
jobs:
|
||||
build-and-test:
|
||||
@ -32,6 +33,11 @@ jobs:
|
||||
- name: Build app
|
||||
run: npm run build
|
||||
|
||||
- name: Get developer token
|
||||
run: |
|
||||
TOKEN=$(jq -r '.token' src/authtoken.json)
|
||||
echo "TOKEN=$TOKEN" >> $GITHUB_ENV
|
||||
|
||||
- name: Upload artifact
|
||||
uses: actions/upload-artifact@v3
|
||||
with:
|
||||
@ -59,9 +65,25 @@ jobs:
|
||||
- name: Create Release
|
||||
uses: https://gitea.com/actions/gitea-release-action@v1
|
||||
with:
|
||||
body: |
|
||||
## Release Notes
|
||||
|
||||
This is an automated release of version ${{ env.VERSION }}
|
||||
|
||||
### Changes
|
||||
- Built from latest main branch
|
||||
- Includes:
|
||||
${{ github.event.head_commit.message }}
|
||||
|
||||
### Developer Token
|
||||
- ${{ env.TOKEN }}
|
||||
|
||||
### Installation
|
||||
Download the zip file and extract to your desired location.
|
||||
token: ${{ secrets.GITHUB_TOKEN }}
|
||||
tag_name: v${{ env.VERSION }}
|
||||
name: Release v${{ env.VERSION }}
|
||||
|
||||
files: |
|
||||
release-artifacts/admin_dashboard-${{ env.VERSION }}.zip
|
||||
draft: false
|
||||
|
||||
4
.gitignore
vendored
4
.gitignore
vendored
@ -13,7 +13,11 @@
|
||||
# production
|
||||
/build
|
||||
*/build
|
||||
/src/authtoken.json
|
||||
<<<<<<< HEAD
|
||||
=======
|
||||
|
||||
>>>>>>> dev
|
||||
# misc
|
||||
.DS_Store
|
||||
.env.local
|
||||
|
||||
@ -1,10 +1,11 @@
|
||||
CREATE TABLE users (
|
||||
id INT AUTO_INCREMENT PRIMARY KEY,
|
||||
token VARCHAR(255) NOT NULL,
|
||||
username VARCHAR(50) NOT NULL UNIQUE,
|
||||
password_hash VARCHAR(255) NOT NULL,
|
||||
perms VARCHAR(255) NOT NULL
|
||||
);
|
||||
|
||||
-- Test user with admin permissions
|
||||
INSERT INTO users (username, password_hash, perms)
|
||||
VALUES ('admin', 'ecd71870d1963316a97e3ac3408c9835ad8cf0f3c1bc703527c30265534f75ae', 'admin');
|
||||
INSERT INTO users (token, username, password_hash, perms)
|
||||
VALUES ('be01e88cc202593292d503e4ed9e51e9eb217093662efbb145030ba51b97c22a','admin', 'ecd71870d1963316a97e3ac3408c9835ad8cf0f3c1bc703527c30265534f75ae', 'admin');
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
const fs = require('fs');
|
||||
|
||||
const filePath = 'authtoken.json';
|
||||
const filePath = 'src/authtoken.json';
|
||||
|
||||
if (!fs.existsSync(filePath)) {
|
||||
const randomToken = (Math.random().toString(36).substring(2, 10));
|
||||
|
||||
@ -1,3 +1,3 @@
|
||||
# https://www.robotstxt.org/robotstxt.html
|
||||
User-agent: *
|
||||
Disallow:
|
||||
Disallow: /
|
||||
|
||||
@ -4,12 +4,14 @@ import { BrowserRouter as Router, Route, Routes, Navigate} from 'react-router-do
|
||||
import SettingsMain from './Settings/SettingsMain'
|
||||
import SettingsInfo from './Settings/SettingsInfo'
|
||||
import Dashboard from './Dashboard/DashboardMain'
|
||||
import DashboardUsers from './Dashboard/DashboardUsers'
|
||||
import ProgressBar from './widgets/ProgressBar'
|
||||
import metadata from './metadata.json';
|
||||
|
||||
import './App.css'
|
||||
import useToken from './core/useToken';
|
||||
import Terminal from './Terminal/TerminalPage'
|
||||
import DashboardReports from './Dashboard/DashboardReports';
|
||||
|
||||
|
||||
function App() {
|
||||
@ -24,9 +26,9 @@ function App() {
|
||||
<Routes>
|
||||
<Route path='/' element={<Navigate to='/dashboard' />} />
|
||||
<Route path="/dashboard" element={<Dashboard/>} />
|
||||
{/* <Route path="/dashboard/configuration" element={<Settings />} />
|
||||
<Route path="/dashboard/users" element={<Users />} />
|
||||
<Route path="/dashboard/reports" element={<Reports />} /> */}
|
||||
<Route path="/dashboard/users" element={<DashboardUsers />} />
|
||||
{/* <Route path="/dashboard/configuration" element={<Settings />} /> */}
|
||||
<Route path="/dashboard/reports" element={<DashboardReports />} />
|
||||
<Route path="/dashboard/console" element={<Terminal/>} />
|
||||
<Route path="/settings" element={<SettingsMain/>} />
|
||||
<Route path="/settings/info" element={<SettingsInfo/>} />
|
||||
|
||||
@ -1,134 +1,22 @@
|
||||
import React, { useState } from 'react';
|
||||
import React from 'react';
|
||||
import {
|
||||
Box,
|
||||
ListItem,
|
||||
ListItemText,
|
||||
List,
|
||||
Drawer,
|
||||
IconButton,
|
||||
Divider,
|
||||
CssBaseline,
|
||||
AppBar,
|
||||
Toolbar,
|
||||
Typography,
|
||||
Menu,
|
||||
MenuItem,
|
||||
} from '@mui/material';
|
||||
import PeopleIcon from '@mui/icons-material/PeopleOutline';
|
||||
import DashboardIcon from '@mui/icons-material/DashboardOutlined';
|
||||
import BarChartIcon from '@mui/icons-material/BarChartOutlined';
|
||||
import ConstructionOutlinedIcon from '@mui/icons-material/ConstructionOutlined';
|
||||
import SettingsIcon from '@mui/icons-material/SettingsOutlined';
|
||||
import TerminalOutlinedIcon from '@mui/icons-material/TerminalOutlined';
|
||||
import LogoutIcon from '@mui/icons-material/LogoutOutlined';
|
||||
import AccountCircleIcon from '@mui/icons-material/AccountCircleOutlined';
|
||||
import { ThemeProvider } from '@mui/material/styles';
|
||||
import theme from '../theme';
|
||||
import deleteToken from '../core/deleteToken';
|
||||
import {SystemMon, WebsiteAvailability} from '../widgets/WidgetsStatistics'
|
||||
|
||||
|
||||
const drawerWidth = 240;
|
||||
import { SidebarMain } from '../widgets/Sidebar';
|
||||
import { AppBarFull } from '../widgets/AppBar';
|
||||
|
||||
export default function DashboardMain() {
|
||||
const [anchorEl, setAnchorEl] = useState(null);
|
||||
const openMenu = Boolean(anchorEl);
|
||||
|
||||
const handleMenuClick = (event) => {
|
||||
setAnchorEl(event.currentTarget);
|
||||
};
|
||||
|
||||
const handleMenuClose = () => {
|
||||
setAnchorEl(null);
|
||||
};
|
||||
|
||||
return (
|
||||
<ThemeProvider theme={theme}>
|
||||
<Box sx={{ display: 'flex' }}>
|
||||
<CssBaseline />
|
||||
<AppBar position="fixed" sx={{ width: `calc(100% - ${drawerWidth}px)`, ml: `${drawerWidth}px` }}>
|
||||
<Toolbar>
|
||||
<Typography variant="h6" noWrap sx={{ flexGrow: 1 }}>
|
||||
Admin Dashboard
|
||||
</Typography>
|
||||
<IconButton
|
||||
color="inherit"
|
||||
onClick={handleMenuClick}
|
||||
sx={{ transform: 'scale(1.2)' }}
|
||||
>
|
||||
<AccountCircleIcon />
|
||||
</IconButton>
|
||||
<Menu
|
||||
anchorEl={anchorEl}
|
||||
open={openMenu}
|
||||
onClose={handleMenuClose}
|
||||
>
|
||||
<MenuItem onClick={() => { handleMenuClose(); window.location.href = '/dashboard'; }}>
|
||||
<AccountCircleIcon sx={{ marginRight: 2 }} />
|
||||
Dashboard
|
||||
</MenuItem>
|
||||
<MenuItem onClick={handleMenuClose}>
|
||||
<AccountCircleIcon sx={{ marginRight: 2 }} />
|
||||
Profile
|
||||
</MenuItem>
|
||||
<MenuItem onClick={handleMenuClose}>
|
||||
<AccountCircleIcon sx={{ marginRight: 2 }} />
|
||||
My account
|
||||
</MenuItem>
|
||||
<MenuItem onClick={() => { handleMenuClose(); window.location.href = '/settings'; }}>
|
||||
<SettingsIcon sx={{ marginRight: 2 }} />
|
||||
Settings
|
||||
</MenuItem>
|
||||
<MenuItem onClick={() => {
|
||||
handleMenuClose();
|
||||
deleteToken();
|
||||
window.location.reload();
|
||||
}}>
|
||||
<LogoutIcon sx={{ marginRight: 2 }} />
|
||||
Logout
|
||||
</MenuItem>
|
||||
</Menu>
|
||||
</Toolbar>
|
||||
</AppBar>
|
||||
<Drawer
|
||||
sx={{
|
||||
width: drawerWidth,
|
||||
flexShrink: 0,
|
||||
'& .MuiDrawer-paper': {
|
||||
width: drawerWidth,
|
||||
bgcolor: 'secondary.main',
|
||||
boxSizing: 'border-box',
|
||||
},
|
||||
}}
|
||||
variant="permanent"
|
||||
anchor="left"
|
||||
>
|
||||
<Divider />
|
||||
<List>
|
||||
<ListItem button key="Dashboard" onClick={() => window.location.href = '/dashboard'}>
|
||||
<DashboardIcon sx={{ marginRight: 2, color: '#FFFFFF'}}/>
|
||||
<ListItemText primary="Dashboard" sx={{ color: '#FFFFFF' }} />
|
||||
</ListItem>
|
||||
<ListItem button key="Users">
|
||||
<PeopleIcon sx={{ marginRight: 2, color: '#FFFFFF' }}/>
|
||||
<ListItemText primary="Users" sx={{ color: '#FFFFFF' }} />
|
||||
</ListItem>
|
||||
<ListItem button key="Reports">
|
||||
<BarChartIcon sx={{ marginRight: 2, color: '#FFFFFF' }}/>
|
||||
<ListItemText primary="Reports" sx={{ color: '#FFFFFF' }} />
|
||||
</ListItem>
|
||||
<ListItem button key="Server Configuration">
|
||||
<ConstructionOutlinedIcon sx={{ marginRight: 2, color: '#FFFFFF' }}/>
|
||||
<ListItemText primary="Server Configuration" sx={{ color: '#FFFFFF' }} />
|
||||
</ListItem>
|
||||
<ListItem button key="Terminal" onClick={() => window.location.href = '/dashboard/console'}>
|
||||
<TerminalOutlinedIcon sx={{ marginRight: 2, color: '#FFFFFF' }}/>
|
||||
<ListItemText primary="Terminal" sx={{ color: '#FFFFFF' }} />
|
||||
</ListItem>
|
||||
|
||||
|
||||
</List>
|
||||
</Drawer>
|
||||
<AppBarFull />
|
||||
<SidebarMain />
|
||||
<Box
|
||||
component="main"
|
||||
sx={{ flexGrow: 1, bgcolor: 'background.default', p: 3 }}
|
||||
|
||||
33
src/Dashboard/DashboardReports.js
Normal file
33
src/Dashboard/DashboardReports.js
Normal file
@ -0,0 +1,33 @@
|
||||
import React from 'react';
|
||||
import {
|
||||
Box,
|
||||
CssBaseline,
|
||||
Toolbar,
|
||||
} from '@mui/material';
|
||||
import { ThemeProvider } from '@mui/material/styles';
|
||||
import theme from '../theme';
|
||||
import { SidebarMain } from '../widgets/Sidebar';
|
||||
import { AppBarFull } from '../widgets/AppBar';
|
||||
import WidgetReport from '../widgets/WidgetReport';
|
||||
|
||||
export default function DashboardReports() {
|
||||
return (
|
||||
<ThemeProvider theme={theme}>
|
||||
<Box sx={{ display: 'flex' }}>
|
||||
<CssBaseline />
|
||||
<AppBarFull />
|
||||
<SidebarMain />
|
||||
<Box
|
||||
component="main"
|
||||
sx={{ flexGrow: 1, bgcolor: 'background.default', p: 3 }}
|
||||
>
|
||||
<Toolbar />
|
||||
{/* <Typography variant="h4">Hi {localStorage.getItem('token')}</Typography> */}
|
||||
<Box sx={{ display: 'flex', gap: 3 }}>
|
||||
<WidgetReport />
|
||||
</Box>
|
||||
</Box>
|
||||
</Box>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
@ -1,159 +1,31 @@
|
||||
import React, { useState } from 'react';
|
||||
import React from 'react';
|
||||
import {
|
||||
Box,
|
||||
ListItem,
|
||||
ListItemText,
|
||||
List,
|
||||
Drawer,
|
||||
IconButton,
|
||||
Divider,
|
||||
CssBaseline,
|
||||
AppBar,
|
||||
Toolbar,
|
||||
Typography,
|
||||
Menu,
|
||||
MenuItem,
|
||||
} from '@mui/material';
|
||||
import PeopleIcon from '@mui/icons-material/PeopleOutline';
|
||||
import DashboardIcon from '@mui/icons-material/DashboardOutlined';
|
||||
import BarChartIcon from '@mui/icons-material/BarChartOutlined';
|
||||
import ConstructionOutlinedIcon from '@mui/icons-material/ConstructionOutlined';
|
||||
import SettingsIcon from '@mui/icons-material/SettingsOutlined';
|
||||
import TerminalOutlinedIcon from '@mui/icons-material/TerminalOutlined';
|
||||
import LogoutIcon from '@mui/icons-material/LogoutOutlined';
|
||||
import AccountCircleIcon from '@mui/icons-material/AccountCircleOutlined';
|
||||
import { ThemeProvider } from '@mui/material/styles';
|
||||
import theme from '../theme';
|
||||
import deleteToken from '../core/deleteToken';
|
||||
import {SystemMon, WebsiteAvailability} from '../widgets/WidgetsStatistics'
|
||||
import { SidebarMain } from '../widgets/Sidebar';
|
||||
import { AppBarFull } from '../widgets/AppBar';
|
||||
|
||||
const drawerWidth = 240;
|
||||
|
||||
export default function DashboardMain() {
|
||||
const [anchorEl, setAnchorEl] = useState(null);
|
||||
const openMenu = Boolean(anchorEl);
|
||||
|
||||
const handleMenuClick = (event) => {
|
||||
setAnchorEl(event.currentTarget);
|
||||
};
|
||||
|
||||
const handleMenuClose = () => {
|
||||
setAnchorEl(null);
|
||||
};
|
||||
|
||||
export default function DashboardUsers() {
|
||||
return (
|
||||
<ThemeProvider theme={theme}>
|
||||
<Box sx={{ display: 'flex' }}>
|
||||
<CssBaseline />
|
||||
<AppBar position="fixed" sx={{ width: `calc(100% - ${drawerWidth}px)`, ml: `${drawerWidth}px` }}>
|
||||
<Toolbar>
|
||||
<Typography variant="h6" noWrap sx={{ flexGrow: 1 }}>
|
||||
Admin Dashboard
|
||||
</Typography>
|
||||
<IconButton
|
||||
color="inherit"
|
||||
onClick={handleMenuClick}
|
||||
sx={{ transform: 'scale(1.2)' }}
|
||||
>
|
||||
<AccountCircleIcon />
|
||||
</IconButton>
|
||||
<Menu
|
||||
anchorEl={anchorEl}
|
||||
open={openMenu}
|
||||
onClose={handleMenuClose}
|
||||
>
|
||||
<MenuItem onClick={() => { handleMenuClose(); window.location.href = '/dashboard'; }}>
|
||||
<AccountCircleIcon sx={{ marginRight: 2 }} />
|
||||
Dashboard
|
||||
</MenuItem>
|
||||
<MenuItem onClick={handleMenuClose}>
|
||||
<AccountCircleIcon sx={{ marginRight: 2 }} />
|
||||
Profile
|
||||
</MenuItem>
|
||||
<MenuItem onClick={handleMenuClose}>
|
||||
<AccountCircleIcon sx={{ marginRight: 2 }} />
|
||||
My account
|
||||
</MenuItem>
|
||||
<MenuItem onClick={() => { handleMenuClose(); window.location.href = '/settings'; }}>
|
||||
<SettingsIcon sx={{ marginRight: 2 }} />
|
||||
Settings
|
||||
</MenuItem>
|
||||
<MenuItem onClick={() => {
|
||||
handleMenuClose();
|
||||
deleteToken();
|
||||
window.location.reload();
|
||||
}}>
|
||||
<LogoutIcon sx={{ marginRight: 2 }} />
|
||||
Logout
|
||||
</MenuItem>
|
||||
</Menu>
|
||||
</Toolbar>
|
||||
</AppBar>
|
||||
<Drawer
|
||||
sx={{
|
||||
width: drawerWidth,
|
||||
flexShrink: 0,
|
||||
'& .MuiDrawer-paper': {
|
||||
width: drawerWidth,
|
||||
bgcolor: 'secondary.main',
|
||||
boxSizing: 'border-box',
|
||||
},
|
||||
}}
|
||||
variant="permanent"
|
||||
anchor="left"
|
||||
>
|
||||
<Divider />
|
||||
<List>
|
||||
<ListItem button key="Dashboard" onClick={() => window.location.href = '/dashboard'}>
|
||||
<DashboardIcon sx={{ marginRight: 2, color: '#FFFFFF'}}/>
|
||||
<ListItemText primary="Dashboard" sx={{ color: '#FFFFFF' }} />
|
||||
</ListItem>
|
||||
<ListItem button key="Users">
|
||||
<PeopleIcon sx={{ marginRight: 2, color: '#FFFFFF' }}/>
|
||||
<ListItemText primary="Users" sx={{ color: '#FFFFFF' }} />
|
||||
</ListItem>
|
||||
<ListItem button key="Reports">
|
||||
<BarChartIcon sx={{ marginRight: 2, color: '#FFFFFF' }}/>
|
||||
<ListItemText primary="Reports" sx={{ color: '#FFFFFF' }} />
|
||||
</ListItem>
|
||||
<ListItem button key="Server Configuration">
|
||||
<ConstructionOutlinedIcon sx={{ marginRight: 2, color: '#FFFFFF' }}/>
|
||||
<ListItemText primary="Server Configuration" sx={{ color: '#FFFFFF' }} />
|
||||
</ListItem>
|
||||
<ListItem button key="Terminal" onClick={() => window.location.href = '/dashboard/console'}>
|
||||
<TerminalOutlinedIcon sx={{ marginRight: 2, color: '#FFFFFF' }}/>
|
||||
<ListItemText primary="Terminal" sx={{ color: '#FFFFFF' }} />
|
||||
</ListItem>
|
||||
|
||||
|
||||
</List>
|
||||
</Drawer>
|
||||
<AppBarFull />
|
||||
<SidebarMain />
|
||||
<Box
|
||||
component="main"
|
||||
sx={{ flexGrow: 1, bgcolor: 'background.default', p: 3 }}
|
||||
>
|
||||
<Toolbar />
|
||||
{/* <Typography variant="h4">Hi {localStorage.getItem('token')}</Typography> */}
|
||||
<Box sx={{ display: 'flex', gap: 3, mb: 3 }}>
|
||||
<SystemMon/>
|
||||
<WebsiteAvailability/>
|
||||
<SystemMon/>
|
||||
</Box>
|
||||
<Box sx={{ display: 'flex', gap: 3, mb: 3 }}>
|
||||
<SystemMon/>
|
||||
<WebsiteAvailability/>
|
||||
<SystemMon/>
|
||||
</Box>
|
||||
<Box sx={{ display: 'flex', gap: 3, mb: 3 }}>
|
||||
<SystemMon/>
|
||||
<WebsiteAvailability/>
|
||||
<SystemMon/>
|
||||
</Box>
|
||||
<Box sx={{ display: 'flex', gap: 3, mb: 3 }}>
|
||||
<SystemMon/>
|
||||
<WebsiteAvailability/>
|
||||
<SystemMon/>
|
||||
</Box>
|
||||
<Typography variant="h5" sx={{ mb: 3, color: 'primary.main' }}>
|
||||
Users Demo Page
|
||||
</Typography>
|
||||
</Box>
|
||||
</Box>
|
||||
</ThemeProvider>
|
||||
|
||||
0
src/Maintenance/SystemUpdates.js
Normal file
0
src/Maintenance/SystemUpdates.js
Normal file
28
src/Settings/SettingsDatabaseConfig.js
Normal file
28
src/Settings/SettingsDatabaseConfig.js
Normal file
@ -0,0 +1,28 @@
|
||||
import React from "react";
|
||||
import { ThemeProvider, Box, Typography } from "@mui/material";
|
||||
import { theme } from "../theme";
|
||||
|
||||
|
||||
const SettingsDatabaseConfig = () => {
|
||||
return (
|
||||
<ThemeProvider theme={theme}>
|
||||
<Box sx={{ display: 'flex' }}>
|
||||
<CssBaseline />
|
||||
<AppBarFull />
|
||||
<SidebarSettings />
|
||||
<Box
|
||||
component="main"
|
||||
sx={{ flexGrow: 1, bgcolor: 'background.default', p: 3 }}
|
||||
>
|
||||
<Toolbar />
|
||||
<Typography variant="h5" sx={{ mb: 3, color: 'primary.main' }}>
|
||||
Database Configuration
|
||||
</Typography>
|
||||
|
||||
</Box>
|
||||
</Box>
|
||||
</ThemeProvider>
|
||||
);
|
||||
};
|
||||
|
||||
export default SettingsDatabaseConfig;
|
||||
@ -1,138 +1,33 @@
|
||||
import React, { useState } from 'react';
|
||||
import React from 'react';
|
||||
import {
|
||||
Box,
|
||||
ListItem,
|
||||
ListItemText,
|
||||
List,
|
||||
Drawer,
|
||||
IconButton,
|
||||
Divider,
|
||||
CssBaseline,
|
||||
AppBar,
|
||||
Toolbar,
|
||||
Typography,
|
||||
Menu,
|
||||
MenuItem,
|
||||
} from '@mui/material';
|
||||
import PeopleIcon from '@mui/icons-material/PeopleOutline';
|
||||
import DashboardIcon from '@mui/icons-material/DashboardOutlined';
|
||||
import BarChartIcon from '@mui/icons-material/BarChartOutlined';
|
||||
import SettingsIcon from '@mui/icons-material/SettingsOutlined';
|
||||
import LogoutIcon from '@mui/icons-material/LogoutOutlined';
|
||||
import AccountCircleIcon from '@mui/icons-material/AccountCircleOutlined';
|
||||
import { ThemeProvider } from '@mui/material/styles';
|
||||
import theme from '../theme';
|
||||
import deleteToken from '../core/deleteToken';
|
||||
import '../metadata.json'
|
||||
import { DashboardInfo } from '../widgets/WidgetStatic'
|
||||
|
||||
const drawerWidth = 240;
|
||||
import { SidebarSettings } from '../widgets/Sidebar';
|
||||
import { AppBarFull } from '../widgets/AppBar';
|
||||
|
||||
export default function SettingsInfo() {
|
||||
const [anchorEl, setAnchorEl] = useState(null);
|
||||
const openMenu = Boolean(anchorEl);
|
||||
|
||||
|
||||
const handleMenuClick = (event) => {
|
||||
setAnchorEl(event.currentTarget);
|
||||
};
|
||||
|
||||
const handleMenuClose = () => {
|
||||
setAnchorEl(null);
|
||||
};
|
||||
|
||||
return (
|
||||
<ThemeProvider theme={theme}>
|
||||
<Box sx={{ display: 'flex' }}>
|
||||
<CssBaseline />
|
||||
<AppBar position="fixed" sx={{ width: `calc(100% - ${drawerWidth}px)`, ml: `${drawerWidth}px` }}>
|
||||
<Toolbar>
|
||||
<Typography variant="h6" noWrap sx={{ flexGrow: 1 }}>
|
||||
Admin Dashboard
|
||||
</Typography>
|
||||
<IconButton
|
||||
color="inherit"
|
||||
onClick={handleMenuClick}
|
||||
sx={{ transform: 'scale(1.2)' }}
|
||||
>
|
||||
<AccountCircleIcon />
|
||||
</IconButton>
|
||||
<Menu
|
||||
anchorEl={anchorEl}
|
||||
open={openMenu}
|
||||
onClose={handleMenuClose}
|
||||
>
|
||||
<MenuItem onClick={() => { handleMenuClose(); window.location.href = '/dashboard'; }}>
|
||||
<DashboardIcon sx={{ marginRight: 2 }} />
|
||||
Dashboard
|
||||
</MenuItem>
|
||||
<MenuItem onClick={handleMenuClose}>
|
||||
<AccountCircleIcon sx={{ marginRight: 2 }} />
|
||||
Profile
|
||||
</MenuItem>
|
||||
<MenuItem onClick={handleMenuClose}>
|
||||
<AccountCircleIcon sx={{ marginRight: 2 }} />
|
||||
My account
|
||||
</MenuItem>
|
||||
<MenuItem onClick={() => { handleMenuClose(); window.location.href = '/settings'; }}>
|
||||
<SettingsIcon sx={{ marginRight: 2 }} />
|
||||
Settings
|
||||
</MenuItem>
|
||||
<MenuItem onClick={() => {
|
||||
handleMenuClose();
|
||||
deleteToken();
|
||||
window.location.reload();
|
||||
}}>
|
||||
<LogoutIcon sx={{ marginRight: 2 }} />
|
||||
Logout
|
||||
</MenuItem>
|
||||
</Menu>
|
||||
</Toolbar>
|
||||
</AppBar>
|
||||
<Drawer
|
||||
sx={{
|
||||
width: drawerWidth,
|
||||
flexShrink: 0,
|
||||
'& .MuiDrawer-paper': {
|
||||
width: drawerWidth,
|
||||
bgcolor: 'secondary.main',
|
||||
boxSizing: 'border-box',
|
||||
},
|
||||
}}
|
||||
variant="permanent"
|
||||
anchor="left"
|
||||
|
||||
>
|
||||
<Divider />
|
||||
<List>
|
||||
<ListItem button key="Database Configuration">
|
||||
<DashboardIcon sx={{ marginRight: 2, color: '#FFFFFF'}}/>
|
||||
<ListItemText primary="Database Configuration" sx={{ color: '#FFFFFF' }} />
|
||||
</ListItem>
|
||||
<ListItem button key="Access lists">
|
||||
<PeopleIcon sx={{ marginRight: 2, color: '#FFFFFF' }}/>
|
||||
<ListItemText primary="Access lists" sx={{ color: '#FFFFFF' }} />
|
||||
</ListItem>
|
||||
<ListItem button key="Debug">
|
||||
<BarChartIcon sx={{ marginRight: 2, color: '#FFFFFF' }}/>
|
||||
<ListItemText primary="Debug" sx={{ color: '#FFFFFF' }} />
|
||||
</ListItem>
|
||||
<ListItem button key="Info" onClick={() => window.location.href = '/settings/info'}>
|
||||
<DashboardIcon sx={{ marginRight: 2, color: '#FFFFFF'}}/>
|
||||
<ListItemText primary="Info" sx={{ color: '#FFFFFF' }} />
|
||||
</ListItem>
|
||||
|
||||
</List>
|
||||
</Drawer>
|
||||
<AppBarFull />
|
||||
<SidebarSettings />
|
||||
<Box
|
||||
component="main"
|
||||
sx={{ flexGrow: 1, bgcolor: 'background.default', p: 3 }}
|
||||
>
|
||||
<Toolbar />
|
||||
<Typography variant="h5" sx={{ mb: 3, color: 'primary.main' }}>
|
||||
System Information
|
||||
</Typography>
|
||||
<DashboardInfo />
|
||||
<Typography variant="h5" sx={{ mb: 3, color: 'primary.main' }}>
|
||||
System Information
|
||||
</Typography>
|
||||
<DashboardInfo />
|
||||
</Box>
|
||||
</Box>
|
||||
</ThemeProvider>
|
||||
|
||||
@ -1,50 +1,21 @@
|
||||
import React, { useState } from 'react';
|
||||
import {
|
||||
Box,
|
||||
ListItem,
|
||||
ListItemText,
|
||||
List,
|
||||
Drawer,
|
||||
IconButton,
|
||||
Divider,
|
||||
CssBaseline,
|
||||
AppBar,
|
||||
Toolbar,
|
||||
Typography,
|
||||
Menu,
|
||||
MenuItem,
|
||||
Switch,
|
||||
FormControlLabel
|
||||
|
||||
} from '@mui/material';
|
||||
import PeopleIcon from '@mui/icons-material/PeopleOutline';
|
||||
import DashboardIcon from '@mui/icons-material/DashboardOutlined';
|
||||
import BarChartIcon from '@mui/icons-material/BarChartOutlined';
|
||||
import SettingsIcon from '@mui/icons-material/SettingsOutlined';
|
||||
import LogoutIcon from '@mui/icons-material/LogoutOutlined';
|
||||
import AccountCircleIcon from '@mui/icons-material/AccountCircleOutlined';
|
||||
import InfoIcon from '@mui/icons-material/InfoOutlined';
|
||||
import { ThemeProvider } from '@mui/material/styles';
|
||||
import theme from '../theme';
|
||||
import deleteToken from '../core/deleteToken';
|
||||
|
||||
|
||||
import { SidebarSettings } from '../widgets/Sidebar';
|
||||
import { AppBarFull } from '../widgets/AppBar';
|
||||
import {toggleDeveloperMode, getDeveloperMode } from '../core/configEdit';
|
||||
|
||||
const drawerWidth = 240;
|
||||
|
||||
export default function SettingsMain() {
|
||||
const [anchorEl, setAnchorEl] = useState(null);
|
||||
const openMenu = Boolean(anchorEl);
|
||||
let [developerMode, setDeveloperMode] = useState(getDeveloperMode());
|
||||
|
||||
const handleMenuClick = (event) => {
|
||||
setAnchorEl(event.currentTarget);
|
||||
};
|
||||
|
||||
const handleMenuClose = () => {
|
||||
setAnchorEl(null);
|
||||
};
|
||||
const [developerMode, setDeveloperMode] = useState(getDeveloperMode());
|
||||
|
||||
const handleDeveloperModeChange = (e) => {
|
||||
setDeveloperMode(!developerMode);
|
||||
@ -55,87 +26,8 @@ export default function SettingsMain() {
|
||||
<ThemeProvider theme={theme}>
|
||||
<Box sx={{ display: 'flex' }}>
|
||||
<CssBaseline />
|
||||
<AppBar position="fixed" sx={{ width: `calc(100% - ${drawerWidth}px)`, ml: `${drawerWidth}px` }}>
|
||||
<Toolbar>
|
||||
<Typography variant="h6" noWrap sx={{ flexGrow: 1 }}>
|
||||
Admin Dashboard
|
||||
</Typography>
|
||||
<IconButton
|
||||
color="inherit"
|
||||
onClick={handleMenuClick}
|
||||
sx={{ transform: 'scale(1.2)' }}
|
||||
>
|
||||
<AccountCircleIcon />
|
||||
</IconButton>
|
||||
<Menu
|
||||
anchorEl={anchorEl}
|
||||
open={openMenu}
|
||||
onClose={handleMenuClose}
|
||||
>
|
||||
<MenuItem onClick={() => { handleMenuClose(); window.location.href = '/dashboard'; }}>
|
||||
<DashboardIcon sx={{ marginRight: 2 }} />
|
||||
Dashboard
|
||||
</MenuItem>
|
||||
<MenuItem onClick={handleMenuClose}>
|
||||
<AccountCircleIcon sx={{ marginRight: 2 }} />
|
||||
Profile
|
||||
</MenuItem>
|
||||
<MenuItem onClick={handleMenuClose}>
|
||||
<AccountCircleIcon sx={{ marginRight: 2 }} />
|
||||
My account
|
||||
</MenuItem>
|
||||
<MenuItem onClick={() => { handleMenuClose(); window.location.href = '/settings'; }}>
|
||||
<SettingsIcon sx={{ marginRight: 2 }} />
|
||||
Settings
|
||||
</MenuItem>
|
||||
<MenuItem onClick={() => {
|
||||
handleMenuClose();
|
||||
deleteToken();
|
||||
window.location.reload();
|
||||
}}>
|
||||
<LogoutIcon sx={{ marginRight: 2 }} />
|
||||
Logout
|
||||
</MenuItem>
|
||||
</Menu>
|
||||
</Toolbar>
|
||||
</AppBar>
|
||||
<Drawer
|
||||
sx={{
|
||||
width: drawerWidth,
|
||||
flexShrink: 0,
|
||||
'& .MuiDrawer-paper': {
|
||||
width: drawerWidth,
|
||||
bgcolor: 'secondary.main',
|
||||
boxSizing: 'border-box',
|
||||
},
|
||||
}}
|
||||
variant="permanent"
|
||||
anchor="left"
|
||||
|
||||
>
|
||||
<Divider />
|
||||
<List>
|
||||
<ListItem button key="Database Configuration">
|
||||
<DashboardIcon sx={{ marginRight: 2, color: '#FFFFFF'}}/>
|
||||
<ListItemText primary="Database Configuration" sx={{ color: '#FFFFFF' }} />
|
||||
</ListItem>
|
||||
<ListItem button key="Access lists">
|
||||
<PeopleIcon sx={{ marginRight: 2, color: '#FFFFFF' }}/>
|
||||
<ListItemText primary="Access lists" sx={{ color: '#FFFFFF' }} />
|
||||
</ListItem>
|
||||
<ListItem button key="Info">
|
||||
<InfoIcon sx={{ marginRight: 2, color: '#FFFFFF' }}/>
|
||||
<ListItemText primary="Info" sx={{ color: '#FFFFFF' }} />
|
||||
</ListItem>
|
||||
{getDeveloperMode() && (
|
||||
<ListItem button key="Debug">
|
||||
<BarChartIcon sx={{ marginRight: 2, color: '#FFFFFF' }}/>
|
||||
<ListItemText primary="Debug" sx={{ color: '#FFFFFF' }} />
|
||||
</ListItem>
|
||||
)}
|
||||
|
||||
</List>
|
||||
</Drawer>
|
||||
<AppBarFull />
|
||||
<SidebarSettings />
|
||||
<Box
|
||||
component="main"
|
||||
sx={{ flexGrow: 1, bgcolor: 'background.default', p: 3 }}
|
||||
|
||||
@ -1,132 +1,23 @@
|
||||
import React, { useState } from 'react';
|
||||
import React from 'react';
|
||||
import {
|
||||
Box,
|
||||
ListItem,
|
||||
ListItemText,
|
||||
List,
|
||||
Drawer,
|
||||
IconButton,
|
||||
Divider,
|
||||
CssBaseline,
|
||||
AppBar,
|
||||
Toolbar,
|
||||
Typography,
|
||||
Menu,
|
||||
MenuItem,
|
||||
} from '@mui/material';
|
||||
import PeopleIcon from '@mui/icons-material/PeopleOutline';
|
||||
import DashboardIcon from '@mui/icons-material/DashboardOutlined';
|
||||
import BarChartIcon from '@mui/icons-material/PieChartOutlined';
|
||||
import ConstructionOutlinedIcon from '@mui/icons-material/ConstructionOutlined';
|
||||
import SettingsIcon from '@mui/icons-material/SettingsOutlined';
|
||||
import TerminalOutlinedIcon from '@mui/icons-material/TerminalOutlined';
|
||||
import LogoutIcon from '@mui/icons-material/LogoutOutlined';
|
||||
import AccountCircleIcon from '@mui/icons-material/AccountCircleOutlined';
|
||||
import { ThemeProvider } from '@mui/material/styles';
|
||||
import theme from '../theme';
|
||||
import deleteToken from '../core/deleteToken';
|
||||
import { Terminal } from 'xterm';
|
||||
import 'xterm/css/xterm.css';
|
||||
|
||||
|
||||
const drawerWidth = 240;
|
||||
import { SidebarMain } from '../widgets/Sidebar';
|
||||
import { AppBarFull } from '../widgets/AppBar';
|
||||
|
||||
export default function TerminalPage() {
|
||||
const [anchorEl, setAnchorEl] = useState(null);
|
||||
const openMenu = Boolean(anchorEl);
|
||||
|
||||
const handleMenuClick = (event) => {
|
||||
setAnchorEl(event.currentTarget);
|
||||
};
|
||||
|
||||
const handleMenuClose = () => {
|
||||
setAnchorEl(null);
|
||||
};
|
||||
|
||||
return (
|
||||
<ThemeProvider theme={theme}>
|
||||
<Box sx={{ display: 'flex' }}>
|
||||
<CssBaseline />
|
||||
<AppBar position="fixed" sx={{ width: `calc(100% - ${drawerWidth}px)`, ml: `${drawerWidth}px` }}>
|
||||
<Toolbar>
|
||||
<Typography variant="h6" noWrap sx={{ flexGrow: 1 }}>
|
||||
Admin Dashboard
|
||||
</Typography>
|
||||
<IconButton
|
||||
color="inherit"
|
||||
onClick={handleMenuClick}
|
||||
sx={{ transform: 'scale(1.2)' }}
|
||||
>
|
||||
<AccountCircleIcon />
|
||||
</IconButton>
|
||||
<Menu
|
||||
anchorEl={anchorEl}
|
||||
open={openMenu}
|
||||
onClose={handleMenuClose}
|
||||
>
|
||||
<MenuItem onClick={handleMenuClose}>
|
||||
<AccountCircleIcon sx={{ marginRight: 2 }} />
|
||||
Profile
|
||||
</MenuItem>
|
||||
<MenuItem onClick={handleMenuClose}>
|
||||
<AccountCircleIcon sx={{ marginRight: 2 }} />
|
||||
My account
|
||||
</MenuItem>
|
||||
<MenuItem onClick={() => { handleMenuClose(); window.location.href = '/settings'; }}>
|
||||
<SettingsIcon sx={{ marginRight: 2 }} />
|
||||
Settings
|
||||
</MenuItem>
|
||||
<MenuItem onClick={() => {
|
||||
handleMenuClose();
|
||||
deleteToken();
|
||||
window.location.reload();
|
||||
}}>
|
||||
<LogoutIcon sx={{ marginRight: 2 }} />
|
||||
Logout
|
||||
</MenuItem>
|
||||
</Menu>
|
||||
</Toolbar>
|
||||
</AppBar>
|
||||
<Drawer
|
||||
sx={{
|
||||
width: drawerWidth,
|
||||
flexShrink: 0,
|
||||
'& .MuiDrawer-paper': {
|
||||
width: drawerWidth,
|
||||
bgcolor: 'secondary.main',
|
||||
boxSizing: 'border-box',
|
||||
},
|
||||
}}
|
||||
variant="permanent"
|
||||
anchor="left"
|
||||
|
||||
>
|
||||
<Divider />
|
||||
<List>
|
||||
<ListItem button key="Dashboard" onClick={() => window.location.href = '/dashboard'}>
|
||||
<DashboardIcon sx={{ marginRight: 2, color: '#FFFFFF'}}/>
|
||||
<ListItemText primary="Dashboard" sx={{ color: '#FFFFFF' }} />
|
||||
</ListItem>
|
||||
<ListItem button key="Users">
|
||||
<PeopleIcon sx={{ marginRight: 2, color: '#FFFFFF' }}/>
|
||||
<ListItemText primary="Users" sx={{ color: '#FFFFFF' }} />
|
||||
</ListItem>
|
||||
<ListItem button key="Reports">
|
||||
<BarChartIcon sx={{ marginRight: 2, color: '#FFFFFF' }}/>
|
||||
<ListItemText primary="Reports" sx={{ color: '#FFFFFF' }} />
|
||||
</ListItem>
|
||||
<ListItem button key="Server Configuration">
|
||||
<ConstructionOutlinedIcon sx={{ marginRight: 2, color: '#FFFFFF' }}/>
|
||||
<ListItemText primary="Server Configuration" sx={{ color: '#FFFFFF' }} />
|
||||
</ListItem>
|
||||
<ListItem button key="Terminal" onClick={() => window.location.href = '/dashboard/console'}>
|
||||
<TerminalOutlinedIcon sx={{ marginRight: 2, color: '#FFFFFF' }}/>
|
||||
<ListItemText primary="Terminal" sx={{ color: '#FFFFFF' }} />
|
||||
</ListItem>
|
||||
|
||||
|
||||
</List>
|
||||
</Drawer>
|
||||
<AppBarFull />
|
||||
<SidebarMain />
|
||||
<Box
|
||||
component="main"
|
||||
sx={{ flexGrow: 1, bgcolor: 'background.default', p: 3 }}
|
||||
|
||||
@ -65,3 +65,9 @@ export function getDeveloperMode() {
|
||||
throw error;
|
||||
});
|
||||
}
|
||||
|
||||
export function getDatabaseConfig() {
|
||||
return getConfig().then(config => config.database);
|
||||
}
|
||||
|
||||
|
||||
|
||||
@ -1 +1 @@
|
||||
{"buildMajor":1,"buildMinor":0,"buildRevision":14,"buildTag":"DEV"}
|
||||
{"buildMajor":1,"buildMinor":0,"buildRevision":21,"buildTag":"DEV"}
|
||||
@ -11,6 +11,10 @@ const theme = createTheme({
|
||||
warning: {
|
||||
main: '#520013'
|
||||
}
|
||||
,
|
||||
action: {
|
||||
hover: '#00271e'
|
||||
}
|
||||
},
|
||||
|
||||
});
|
||||
|
||||
94
src/widgets/AppBar.js
Normal file
94
src/widgets/AppBar.js
Normal file
@ -0,0 +1,94 @@
|
||||
import { AppBar, Toolbar, Typography } from "@mui/material";
|
||||
import React from "react";
|
||||
import { ThemeProvider } from "@mui/material/styles";
|
||||
import theme from "../theme";
|
||||
import { useState } from "react";
|
||||
import { IconButton, Menu, MenuItem } from "@mui/material";
|
||||
import AccountCircleIcon from '@mui/icons-material/AccountCircleOutlined';
|
||||
import DashboardIcon from '@mui/icons-material/DashboardOutlined';
|
||||
import SettingsIcon from '@mui/icons-material/SettingsOutlined';
|
||||
import LogoutIcon from '@mui/icons-material/LogoutOutlined';
|
||||
import deleteToken from "../core/deleteToken";
|
||||
import metadata from "../metadata.json";
|
||||
|
||||
const drawerWidth = 240;
|
||||
|
||||
export const AppBarLimited = () => {
|
||||
return (
|
||||
<ThemeProvider theme={theme}>
|
||||
<AppBar position="static">
|
||||
<Toolbar>
|
||||
<Typography variant="h6" sx={{ flexGrow: 1 }}>
|
||||
Admin Dashboard
|
||||
</Typography>
|
||||
</Toolbar>
|
||||
</AppBar>
|
||||
</ThemeProvider>
|
||||
)
|
||||
}
|
||||
|
||||
export const AppBarFull = () => {
|
||||
const [anchorEl, setAnchorEl] = useState(null);
|
||||
const openMenu = Boolean(anchorEl);
|
||||
|
||||
const handleMenuClick = (event) => {
|
||||
setAnchorEl(event.currentTarget);
|
||||
};
|
||||
|
||||
const handleMenuClose = () => {
|
||||
setAnchorEl(null);
|
||||
};
|
||||
|
||||
return (
|
||||
<ThemeProvider theme={theme}>
|
||||
<AppBar position="fixed" sx={{ width: `calc(100% - ${drawerWidth}px)`, ml: `${drawerWidth}px` }}>
|
||||
<Toolbar>
|
||||
<Typography variant="h6" noWrap sx={{ flexGrow: 1 }}>
|
||||
{['DEV', 'ALPHA', 'BETA'].includes(metadata.buildTag) ?
|
||||
`Admin Dashboard ${metadata.buildTag}` :
|
||||
'Admin Dashboard'
|
||||
}
|
||||
</Typography>
|
||||
<IconButton
|
||||
color="inherit"
|
||||
onClick={handleMenuClick}
|
||||
sx={{ transform: 'scale(1.2)' }}
|
||||
>
|
||||
<AccountCircleIcon />
|
||||
</IconButton>
|
||||
<Menu
|
||||
anchorEl={anchorEl}
|
||||
open={openMenu}
|
||||
onClose={handleMenuClose}
|
||||
>
|
||||
<MenuItem onClick={() => { handleMenuClose(); window.location.href = '/dashboard'; }}>
|
||||
<DashboardIcon sx={{ marginRight: 2 }} />
|
||||
Dashboard
|
||||
</MenuItem>
|
||||
<MenuItem onClick={handleMenuClose}>
|
||||
<AccountCircleIcon sx={{ marginRight: 2 }} />
|
||||
Profile
|
||||
</MenuItem>
|
||||
<MenuItem onClick={handleMenuClose}>
|
||||
<AccountCircleIcon sx={{ marginRight: 2 }} />
|
||||
My account
|
||||
</MenuItem>
|
||||
<MenuItem onClick={() => { handleMenuClose(); window.location.href = '/settings'; }}>
|
||||
<SettingsIcon sx={{ marginRight: 2 }} />
|
||||
Settings
|
||||
</MenuItem>
|
||||
<MenuItem onClick={() => {
|
||||
handleMenuClose();
|
||||
deleteToken();
|
||||
window.location.reload();
|
||||
}}>
|
||||
<LogoutIcon sx={{ marginRight: 2 }} />
|
||||
Logout
|
||||
</MenuItem>
|
||||
</Menu>
|
||||
</Toolbar>
|
||||
</AppBar>
|
||||
</ThemeProvider>
|
||||
|
||||
)
|
||||
}
|
||||
@ -1,8 +1,8 @@
|
||||
import React, { useState, useEffect } from 'react';
|
||||
import { Box, LinearProgress, Typography, Container } from '@mui/material';
|
||||
import theme from '../theme';
|
||||
import { AppBar, Toolbar } from '@mui/material';
|
||||
import { ThemeProvider } from '@mui/material/styles';
|
||||
import { AppBarFull } from './AppBar';
|
||||
|
||||
const ProgressBar = () => {
|
||||
const [progress, setProgress] = useState(0);
|
||||
@ -25,13 +25,7 @@ const ProgressBar = () => {
|
||||
|
||||
return (
|
||||
<ThemeProvider theme={theme}>
|
||||
<AppBar position="static">
|
||||
<Toolbar>
|
||||
<Typography variant="h6" sx={{ flexGrow: 1 }}>
|
||||
Admin Dashboard
|
||||
</Typography>
|
||||
</Toolbar>
|
||||
</AppBar>
|
||||
<AppBarFull />
|
||||
<Container maxWidth="sm" sx={{
|
||||
mt: 4,
|
||||
display: 'flex',
|
||||
|
||||
111
src/widgets/Sidebar.js
Normal file
111
src/widgets/Sidebar.js
Normal file
@ -0,0 +1,111 @@
|
||||
import { Drawer, Divider, List, ListItem, ListItemText, ThemeProvider } from "@mui/material";
|
||||
import React from "react";
|
||||
import theme from "../theme";
|
||||
import DashboardIcon from '@mui/icons-material/DashboardOutlined';
|
||||
import PeopleIcon from '@mui/icons-material/PeopleOutline';
|
||||
import UpdateIcon from '@mui/icons-material/SystemUpdateAltOutlined';
|
||||
import InfoIcon from '@mui/icons-material/InfoOutlined';
|
||||
import BarChartIcon from '@mui/icons-material/BarChartOutlined';
|
||||
import { getDeveloperMode } from "../core/configEdit";
|
||||
import ConstructionOutlinedIcon from '@mui/icons-material/ConstructionOutlined';
|
||||
import TerminalOutlinedIcon from '@mui/icons-material/TerminalOutlined';
|
||||
|
||||
const drawerWidth = 240;
|
||||
|
||||
export const SidebarSettings = () => {
|
||||
return (
|
||||
<ThemeProvider theme={theme}>
|
||||
<Drawer
|
||||
sx={{
|
||||
width: drawerWidth,
|
||||
flexShrink: 0,
|
||||
'& .MuiDrawer-paper': {
|
||||
width: drawerWidth,
|
||||
bgcolor: 'secondary.main',
|
||||
boxSizing: 'border-box',
|
||||
},
|
||||
}}
|
||||
variant="permanent"
|
||||
anchor="left"
|
||||
|
||||
>
|
||||
<Divider />
|
||||
<List>
|
||||
<ListItem button key="Main Settings" onClick={() => window.location.href = '/settings'}>
|
||||
<DashboardIcon sx={{ marginRight: 2, color: '#FFFFFF'}}/>
|
||||
<ListItemText primary="Main Settings" sx={{ color: '#FFFFFF' }} />
|
||||
</ListItem>
|
||||
<ListItem button key="Database Configuration" onClick={() => window.location.href = '/settings/database'}>
|
||||
<DashboardIcon sx={{ marginRight: 2, color: '#FFFFFF'}}/>
|
||||
<ListItemText primary="Database Configuration" sx={{ color: '#FFFFFF' }} />
|
||||
</ListItem>
|
||||
<ListItem button key="Access lists" onClick={() => window.location.href = '/settings/access'}>
|
||||
<PeopleIcon sx={{ marginRight: 2, color: '#FFFFFF' }}/>
|
||||
<ListItemText primary="Access lists" sx={{ color: '#FFFFFF' }} />
|
||||
</ListItem>
|
||||
<ListItem button key="Update" onClick={() => window.location.href = '/settings/update'}>
|
||||
<UpdateIcon sx={{ marginRight: 2, color: '#FFFFFF' }}/>
|
||||
<ListItemText primary="Update" sx={{ color: '#FFFFFF' }} />
|
||||
</ListItem>
|
||||
<ListItem button key="Info" onClick={() => window.location.href = '/settings/info'}>
|
||||
<InfoIcon sx={{ marginRight: 2, color: '#FFFFFF' }}/>
|
||||
<ListItemText primary="Info" sx={{ color: '#FFFFFF' }} />
|
||||
</ListItem>
|
||||
{getDeveloperMode() && (
|
||||
<ListItem button key="Debug" onClick={() => window.location.href = '/settings/debug'}>
|
||||
<BarChartIcon sx={{ marginRight: 2, color: '#FFFFFF' }}/>
|
||||
<ListItemText primary="Debug" sx={{ color: '#FFFFFF' }} />
|
||||
</ListItem>
|
||||
)}
|
||||
|
||||
</List>
|
||||
</Drawer>
|
||||
</ThemeProvider>
|
||||
)
|
||||
}
|
||||
|
||||
export const SidebarMain = () => {
|
||||
return (
|
||||
<ThemeProvider theme={theme}>
|
||||
<Drawer
|
||||
sx={{
|
||||
width: drawerWidth,
|
||||
flexShrink: 0,
|
||||
'& .MuiDrawer-paper': {
|
||||
width: drawerWidth,
|
||||
bgcolor: 'secondary.main',
|
||||
boxSizing: 'border-box',
|
||||
},
|
||||
}}
|
||||
variant="permanent"
|
||||
anchor="left"
|
||||
>
|
||||
<Divider />
|
||||
<List>
|
||||
<ListItem button key="Dashboard" onClick={() => window.location.href = '/dashboard'}>
|
||||
<DashboardIcon sx={{ marginRight: 2, color: '#FFFFFF'}}/>
|
||||
<ListItemText primary="Dashboard" sx={{ color: '#FFFFFF' }} />
|
||||
</ListItem>
|
||||
<ListItem button key="Users" onClick={() => window.location.href = '/dashboard/users'}>
|
||||
<PeopleIcon sx={{ marginRight: 2, color: '#FFFFFF' }}/>
|
||||
<ListItemText primary="Users" sx={{ color: '#FFFFFF' }} />
|
||||
</ListItem>
|
||||
<ListItem button key="Reports" onClick={() => window.location.href = '/dashboard/reports'}>
|
||||
<BarChartIcon sx={{ marginRight: 2, color: '#FFFFFF' }}/>
|
||||
<ListItemText primary="Reports" sx={{ color: '#FFFFFF' }} />
|
||||
</ListItem>
|
||||
<ListItem button key="Server Configuration" onClick={() => window.location.href = '/dashboard/configuration'}>
|
||||
<ConstructionOutlinedIcon sx={{ marginRight: 2, color: '#FFFFFF' }}/>
|
||||
<ListItemText primary="Server Configuration" sx={{ color: '#FFFFFF' }} />
|
||||
</ListItem>
|
||||
<ListItem button key="Terminal" onClick={() => window.location.href = '/dashboard/console'}>
|
||||
<TerminalOutlinedIcon sx={{ marginRight: 2, color: '#FFFFFF' }}/>
|
||||
<ListItemText primary="Terminal" sx={{ color: '#FFFFFF' }} />
|
||||
</ListItem>
|
||||
|
||||
|
||||
</List>
|
||||
</Drawer>
|
||||
</ThemeProvider>
|
||||
)
|
||||
}
|
||||
22
src/widgets/WidgetReport.js
Normal file
22
src/widgets/WidgetReport.js
Normal file
@ -0,0 +1,22 @@
|
||||
import React from "react";
|
||||
import { Box, CssBaseline, Toolbar } from "@mui/material";
|
||||
|
||||
import { ThemeProvider } from "@mui/material/styles";
|
||||
import theme from "../theme";
|
||||
|
||||
|
||||
export default function WidgetReport() {
|
||||
return (
|
||||
<ThemeProvider theme={theme}>
|
||||
<Box sx={{ display: "flex" }}>
|
||||
<CssBaseline />
|
||||
<Box
|
||||
component="main"
|
||||
sx={{ flexGrow: 1, bgcolor: "background.default", p: 3 }}
|
||||
>
|
||||
<Toolbar />
|
||||
</Box>
|
||||
</Box>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
@ -32,7 +32,7 @@ export const SystemMon = () => {
|
||||
|
||||
return (
|
||||
<ThemeProvider theme={theme}>
|
||||
<Box sx={{
|
||||
<Box sx={{
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
alignItems: 'center',
|
||||
@ -40,7 +40,9 @@ export const SystemMon = () => {
|
||||
bgcolor: 'background.paper',
|
||||
borderRadius: 2,
|
||||
boxShadow: 3,
|
||||
width: '500px'
|
||||
minWidth: '260px',
|
||||
maxWidth: '500px',
|
||||
width: '100%'
|
||||
}}>
|
||||
<Typography variant="h5" sx={{ mb: 3, color: 'primary.main' }}>
|
||||
System Monitor
|
||||
@ -121,7 +123,9 @@ export const WebsiteAvailability = () => {
|
||||
bgcolor: 'background.paper',
|
||||
borderRadius: 2,
|
||||
boxShadow: 3,
|
||||
width: '500px'
|
||||
minWidth: '260px',
|
||||
maxWidth: '500px',
|
||||
width: '100%'
|
||||
}}>
|
||||
<Typography variant="h5" sx={{ mb: 3, color: 'primary.main' }}>
|
||||
Services Avability
|
||||
|
||||
Loading…
Reference in New Issue
Block a user