scottk/OptimCloud-gw-ui
1
0
Fork 0
mirror of https://github.com/optim-enterprises-bv/OptimCloud-gw-ui.git synced 2025-10-29 17:32:20 +00:00
Code Issues Packages Projects Releases Wiki Activity

Changed from using .env file to config

Browse Source
This commit is contained in:
bourquecharles
2021-04-27 10:45:32 -04:00
parent 9107e9529a
commit 0f35154eeb
6 changed files with 174 additions and 65 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
.env
View File

@@ -1 +0,0 @@
REACT_APP_BASE_URL=https://localhost:16001/api/v1

4
src/App.js
View File

@@ -11,8 +11,6 @@ const loading = (
const TheLayout = React.lazy(() => import('./containers/TheLayout'));
const Login = React.lazy(() => import('./views/pages/Login'));
const Page404 = React.lazy(() => import('./views/pages/Page404'));
const Page500 = React.lazy(() => import('./views/pages/Page500'));
const App = () => {
const isLoggedIn = useSelector(state => state.connected);
@@ -29,8 +27,6 @@ const App = () => {
<HashRouter>
<React.Suspense fallback={loading}>
<Switch>
<Route exact path="/404" name="Page 404" render={props => <Page404 {...props}/>} />
<Route exact path="/500" name="Page 500" render={props => <Page500 {...props}/>} />
<Route path="/" name="Devices" render={props => isLoggedIn ? <TheLayout {...props}/> : <Login {...props}/>} />
</Switch>
</React.Suspense>

60
src/components/DeviceConfiguration.js
View File

@@ -146,62 +146,4 @@ const DeviceConfiguration = () => {
);
}
export default DeviceConfiguration
/*
location ????
configuration
log
_log_hostname
_log_ip
_log_port
_log_proto
_log_size
network (is a list)
cfg
proto
OROROROR
peeraddr
vid
OROROROR
dhcp
leasetime
limit
start
ip6assign
ipaddr
leases (is a list)
hostname
ip
mac
mtu
netmask
proto
mode
vlan (sometimes)
ntp
enable_server
enabled
server (list of strings)
*/
export default DeviceConfiguration

168
src/components/DeviceStatus.js Normal file
View File

@@ -0,0 +1,168 @@
import React from 'react'
import {
CCard,
CCardHeader,
CCardBody,
CFormGroup,
CCol,
CLabel,
CForm,
CInput,
CCollapse,
CCardFooter,
CButton
} from '@coreui/react'
import { useSelector } from 'react-redux';
const DeviceStatus = () => {
let device = useSelector(state => state.selectedDevice);
if(device){
let barColor = device.connected ? 'gradient-success' : 'gradient-warning';
return (
<CWidgetProgressIcon
header={sanityLevel ? `${sanityLevel}%` : 'Unknown'}
text="Device Health"
value={sanityLevel ?? 100}
color={barColor}
inverse
>
<CDropdown>
{/* Need inline styling because CDropdownToggle does not take into account the
parent's inverse value*/}
<CDropdownToggle style={{color: 'white'}}>
<CIcon content={cilSettings}/>
</CDropdownToggle>
<CDropdownMenu placement="bottom-end">
<CDropdownItem>View Logs</CDropdownItem>
</CDropdownMenu>
</CDropdown>
</CWidgetProgressIcon>
);
}
if(device){
return (
<CCard>
<CCardHeader>
Device #{device.serialNumber} Configuration
</CCardHeader>
<CCardBody>
<CForm action="" method="post" encType="multipart/form-data" className="form-horizontal">
<CFormGroup row>
<CCol md="3">
<CLabel>UUID : </CLabel>
</CCol>
<CCol xs="12" md="9">
{device.UUID }
</CCol>
</CFormGroup>
<CFormGroup row>
<CCol md="3">
<CLabel>Serial Number : </CLabel>
</CCol>
<CCol xs="12" md="9">
{device.serialNumber }
</CCol>
</CFormGroup>
<CFormGroup row>
<CCol md="3">
<CLabel>Device Type : </CLabel>
</CCol>
<CCol xs="12" md="9">
{ device.deviceType }
</CCol>
</CFormGroup>
<CFormGroup row>
<CCol md="3">
<CLabel>Last Configuration Change : </CLabel>
</CCol>
<CCol xs="12" md="9">
{cleanTimestamp(device.lastConfigurationChange) }
</CCol>
</CFormGroup>
<CFormGroup row>
<CCol md="3">
<CLabel>MAC address :</CLabel>
</CCol>
<CCol xs="12" md="9">
{ device.macAddress }
</CCol>
</CFormGroup>
<CCollapse show={collapse}>
<CFormGroup row>
<CCol md="3">
<CLabel>Created : </CLabel>
</CCol>
<CCol xs="12" md="9">
{ cleanTimestamp(device.createdTimestamp) }
</CCol>
</CFormGroup>
<CFormGroup row>
<CCol md="3">
<CLabel>Last Configuration Download : </CLabel>
</CCol>
<CCol xs="12" md="9">
{cleanTimestamp(device.lastConfigurationDownload) }
</CCol>
</CFormGroup>
<CFormGroup row>
<CCol md="3">
<CLabel>Manufacturer :</CLabel>
</CCol>
<CCol xs="12" md="9">
{ device.manufacturer }
</CCol>
</CFormGroup>
<CFormGroup row>
<CCol md="3">
<CLabel htmlFor="text-input">Notes :</CLabel>
</CCol>
<CCol xs="12" md="9">
<CInput id="text-input" name="text-input" placeholder={device.notes} />
</CCol>
</CFormGroup>
<CFormGroup row>
<CCol md="3">
<CLabel>Owner :</CLabel>
</CCol>
<CCol xs="12" md="9">
{ device.owner }
</CCol>
</CFormGroup>
<CFormGroup row>
<CCol md="3">
<CLabel>Location :</CLabel>
</CCol>
<CCol xs="12" md="9">
{ device.location }
</CCol>
</CFormGroup>
</CCollapse>
<CCardFooter>
<CButton
color="primary"
onClick={toggle}
className={'mb-1'}
>More details</CButton>
</CCardFooter>
</CForm>
</CCardBody>
</CCard>
);
}
return (
<CCard>
<CCardHeader>
Device Configuration
</CCardHeader>
<CCardBody>
</CCardBody>
</CCard>
);
}
export default DeviceStatus;

3
src/config.json Normal file
View File

@@ -0,0 +1,3 @@
{
"REACT_APP_BASE_URL" : "https://ucentral.dpaas.arilia.com:16001/api/v1"
}

3
src/utils/axiosInstance.js
View File

@@ -1,8 +1,9 @@
import * as axios from 'axios';
import axiosRetry from 'axios-retry';
import configData from "../config.json";
const axiosInstance = axios.create({
baseURL: `${process.env.REACT_APP_BASE_URL}`
baseURL: `${configData.REACT_APP_BASE_URL}`
});
axiosRetry(axiosInstance , {