diff --git a/frontend/src/pages/devices/cwmp/[...id].js b/frontend/src/pages/devices/cwmp/[...id].js new file mode 100644 index 0000000..92959ea --- /dev/null +++ b/frontend/src/pages/devices/cwmp/[...id].js @@ -0,0 +1,81 @@ +import Head from 'next/head'; +import { Box, Stack, Typography, Container, Unstable_Grid2 as Grid, +Tab, +Tabs, +SvgIcon } from '@mui/material'; +import { Layout as DashboardLayout } from 'src/layouts/dashboard/layout'; +import { useRouter } from 'next/router'; +import { DevicesRPC } from 'src/sections/devices/devices-rpc'; +import { DevicesDiscovery } from 'src/sections/devices/devices-discovery'; +import EnvelopeIcon from '@heroicons/react/24/outline/EnvelopeIcon'; +import MagnifyingGlassIcon from '@heroicons/react/24/solid/MagnifyingGlassIcon'; +import WifiIcon from '@heroicons/react/24/solid/WifiIcon'; +import { useEffect, useState } from 'react'; +import { DevicesWiFi } from 'src/sections/devices/cwmp/devices-wifi'; + +const Page = () => { + const router = useRouter() + + const deviceID = router.query.id[0] + const section = router.query.id[1] + + const sectionHandler = () => { + switch(section){ + case "msg": + return + case "wifi": + return + default: + return

Hello World

+ } + } + + useEffect(()=>{ + console.log("deviceid:",deviceID) + }) + + return( + <> + + + Oktopus | TR-369 + + + + + + + + } iconPosition={"end"} label="Wi-Fi" onClick={()=>{router.push(`/devices/cwmp/${deviceID}/wifi`)}} value={"wifi"}/> + {/* {router.push(`/devices/cwmp/${deviceID}/discovery`)}} icon={} iconPosition={"end"} label="Discover Parameters" /> */} + {router.push(`/devices/cwmp/${deviceID}/msg`)}} icon={} iconPosition={"end"} label="Remote Messages" /> + + + + { + sectionHandler() + } + + + + + ); +}; + +Page.getLayout = (page) => ( + + {page} + +); + +export default Page; \ No newline at end of file diff --git a/frontend/src/pages/devices/[...id].js b/frontend/src/pages/devices/usp/[...id].js similarity index 80% rename from frontend/src/pages/devices/[...id].js rename to frontend/src/pages/devices/usp/[...id].js index 9708a09..715ab96 100644 --- a/frontend/src/pages/devices/[...id].js +++ b/frontend/src/pages/devices/usp/[...id].js @@ -11,6 +11,7 @@ import EnvelopeIcon from '@heroicons/react/24/outline/EnvelopeIcon'; import MagnifyingGlassIcon from '@heroicons/react/24/solid/MagnifyingGlassIcon'; import WifiIcon from '@heroicons/react/24/solid/WifiIcon'; import { useEffect, useState } from 'react'; +import { DevicesWiFi } from 'src/sections/devices/usp/devices-wifi'; const Page = () => { const router = useRouter() @@ -24,6 +25,8 @@ const Page = () => { return case "discovery": return + case "wifi": + return default: return

Hello World

} @@ -55,9 +58,9 @@ const Page = () => { }} mb={3}> - } iconPosition={"end"} label="Wi-Fi" /> - {router.push(`/devices/${deviceID}/discovery`)}} icon={} iconPosition={"end"} label="Discover Parameters" /> - {router.push(`/devices/${deviceID}/msg`)}} icon={} iconPosition={"end"} label="Remote Messages" /> + } iconPosition={"end"} label="Wi-Fi" onClick={()=>{router.push(`/devices/usp/${deviceID}/wifi`)}} value={"wifi"}/> + {router.push(`/devices/usp/${deviceID}/discovery`)}} icon={} iconPosition={"end"} label="Discover Parameters" /> + {router.push(`/devices/usp/${deviceID}/msg`)}} icon={} iconPosition={"end"} label="Remote Messages" /> diff --git a/frontend/src/sections/devices/cwmp/devices-wifi.js b/frontend/src/sections/devices/cwmp/devices-wifi.js new file mode 100644 index 0000000..c5f4389 --- /dev/null +++ b/frontend/src/sections/devices/cwmp/devices-wifi.js @@ -0,0 +1,326 @@ +import { useCallback, useEffect, useState } from 'react'; +import { + Button, + Card, + CardActions, + CardContent, + CardHeader, + Divider, + Stack, + TextField, + InputLabel, + MenuItem, + Select, + FormControl, + SvgIcon, + Dialog, + DialogTitle, + DialogContent, + DialogContentText, + DialogActions, + Box, + IconButton, + Icon, + Checkbox, + FormControlLabel +} from '@mui/material'; +import XMarkIcon from '@heroicons/react/24/outline/XMarkIcon'; +import PaperAirplane from '@heroicons/react/24/solid/PaperAirplaneIcon'; +import Check from '@heroicons/react/24/outline/CheckIcon' +import CircularProgress from '@mui/material/CircularProgress'; +import Backdrop from '@mui/material/Backdrop'; +import { useRouter } from 'next/router'; +import GlobeAltIcon from '@heroicons/react/24/outline/GlobeAltIcon'; + + +export const DevicesWiFi = () => { + + const router = useRouter() + + const [content, setContent] = useState( + [ + { + "path": "InternetGatewayDevice.LANDevice.1.WLANConfiguration.1.", + "name": { + "writable": false, + "value": "wl1" + }, + "ssid": { + "writable": true, + "value": "HUAWEI-TEST-1" + }, + "password": { + "writable": false, + "value": "" + }, + "security": { + "writable": false, + "value": "b/g/n" + }, + "enable": { + "writable": true, + "value": "0" + }, + "status": { + "writable": false, + "value": "Disabled" + } + }, + { + "path": "InternetGatewayDevice.LANDevice.1.WLANConfiguration.2.", + "name": { + "writable": false, + "value": "wl0" + }, + "ssid": { + "writable": true, + "value": "HUAWEI-TEST-1" + }, + "password": { + "writable": false, + "value": "" + }, + "security": { + "writable": false, + "value": "a/n/ac/ax" + }, + "enable": { + "writable": true, + "value": "1" + }, + "status": { + "writable": false, + "value": "Up" + } + }, + { + "path": "InternetGatewayDevice.LANDevice.2.WLANConfiguration.1.", + "name": { + "writable": false, + "value": "wl1.1" + }, + "ssid": { + "writable": true, + "value": "HUAWEI-1BLSP6_Guest" + }, + "password": { + "writable": false, + "value": "" + }, + "security": { + "writable": false, + "value": "b/g/n" + }, + "enable": { + "writable": true, + "value": "0" + }, + "status": { + "writable": false, + "value": "Disabled" + } + }, + { + "path": "InternetGatewayDevice.LANDevice.2.WLANConfiguration.2.", + "name": { + "writable": false, + "value": "wl0.1" + }, + "ssid": { + "writable": true, + "value": "Mobile WiFi" + }, + "password": { + "writable": false, + "value": "" + }, + "security": { + "writable": false, + "value": "a/n/ac/ax" + }, + "enable": { + "writable": true, + "value": "0" + }, + "status": { + "writable": false, + "value": "Disabled" + } + } + ]) + + const fetchWifiData = async () => { + + var myHeaders = new Headers(); + myHeaders.append("Content-Type", "application/json"); + myHeaders.append("Authorization", localStorage.getItem("token")); + + var requestOptions = { + method: 'GET', + headers: myHeaders, + redirect: 'follow' + }; + + fetch(`${process.env.NEXT_PUBLIC_REST_ENDPOINT}/device/${router.query.id[0]}/wifi`, requestOptions) + .then(response => response.text()) + .then(result => { + if (result.status === 401){ + router.push("/auth/login") + } + if (result.status === 404){ + //TODO: set device as offline + return + } + stepContentClasses(result) + }) + .catch(error => console.log('error', error)); + }; + + useEffect(()=>{ + // fetchWifiData() + },[]) + + return ( content && + + { + content.map((item, index) => { + return ( + + + + + } + /> + + + } label="Enabled" /> + + + + + + + + + + ) + }) + } + {/* + + + + } + /> + + + } label="Enabled" /> + + + + + + + + + + + } + /> + + + } label="Enabled" /> + + + Security + + + + + + + + + */} + + + ); +}; diff --git a/frontend/src/sections/devices/usp/devices-wifi.js b/frontend/src/sections/devices/usp/devices-wifi.js new file mode 100644 index 0000000..18d8d3c --- /dev/null +++ b/frontend/src/sections/devices/usp/devices-wifi.js @@ -0,0 +1,132 @@ +import { useCallback, useEffect, useState } from 'react'; +import { + Button, + Card, + CardActions, + CardContent, + CardHeader, + Divider, + Stack, + TextField, + InputLabel, + MenuItem, + Select, + FormControl, + SvgIcon, + Dialog, + DialogTitle, + DialogContent, + DialogContentText, + DialogActions, + Box, + IconButton, + Icon, + Checkbox, + FormControlLabel +} from '@mui/material'; +import XMarkIcon from '@heroicons/react/24/outline/XMarkIcon'; +import PaperAirplane from '@heroicons/react/24/solid/PaperAirplaneIcon'; +import Check from '@heroicons/react/24/outline/CheckIcon' +import CircularProgress from '@mui/material/CircularProgress'; +import Backdrop from '@mui/material/Backdrop'; +import { useRouter } from 'next/router'; +import GlobeAltIcon from '@heroicons/react/24/outline/GlobeAltIcon'; + + +export const DevicesWiFi = () => { + + return ( + + + + + + } + /> + + + } label="Enabled" /> + + + + + + + + + + + } + /> + + + } label="Enabled" /> + + + Security + + + + + + + + + + + + ); +}; diff --git a/frontend/src/sections/overview/overview-latest-orders.js b/frontend/src/sections/overview/overview-latest-orders.js index 4df6fb9..222cbda 100644 --- a/frontend/src/sections/overview/overview-latest-orders.js +++ b/frontend/src/sections/overview/overview-latest-orders.js @@ -38,6 +38,14 @@ const status = (s)=>{ } } +const getDeviceProtocol = (order) => { + if (order.Mqtt == 0 && order.Websockets == 0 && order.Stomp == 0) { + return "cwmp" + }else { + return "usp" + } +} + export const OverviewLatestOrders = (props) => { const { orders = [], sx } = props; @@ -97,17 +105,19 @@ export const OverviewLatestOrders = (props) => { - { order.Mqtt == 0 && order.Websockets == 0 && order.Stomp == 0 ? : } + + + + } );