diff --git a/frontend/src/layouts/dashboard/config.js b/frontend/src/layouts/dashboard/config.js index 0e7896a..b7ce7f5 100644 --- a/frontend/src/layouts/dashboard/config.js +++ b/frontend/src/layouts/dashboard/config.js @@ -5,6 +5,7 @@ import ShoppingBagIcon from '@heroicons/react/24/solid/ShoppingBagIcon'; import UserIcon from '@heroicons/react/24/solid/UserIcon'; import UserPlusIcon from '@heroicons/react/24/solid/UserPlusIcon'; import UsersIcon from '@heroicons/react/24/solid/UsersIcon'; +import CpuChip from '@heroicons/react/24/solid/CpuChipIcon'; import XCircleIcon from '@heroicons/react/24/solid/XCircleIcon'; import { SvgIcon } from '@mui/material'; @@ -19,29 +20,11 @@ export const items = [ ) }, { - title: 'Customers', - path: '/customers', + title: 'Devices', + path: '/devices', icon: ( - - - ) - }, - { - title: 'Companies', - path: '/companies', - icon: ( - - - - ) - }, - { - title: 'Account', - path: '/account', - icon: ( - - + ) }, @@ -54,12 +37,24 @@ export const items = [ ) }, +]; + +/* { - title: 'Login', - path: '/auth/login', + title: 'Customers', + path: '/customers', icon: ( - + + + ) + }, + { + title: 'Account', + path: '/account', + icon: ( + + ) }, @@ -72,6 +67,24 @@ export const items = [ ) }, + { + title: 'Login', + path: '/auth/login', + icon: ( + + + + ) + }, + { + title: 'Companies', + path: '/companies', + icon: ( + + + + ) + }, { title: 'Error', path: '/404', @@ -81,4 +94,4 @@ export const items = [ ) } -]; +*/ \ No newline at end of file diff --git a/frontend/src/layouts/dashboard/side-nav-item.js b/frontend/src/layouts/dashboard/side-nav-item.js index 560be19..1b4555e 100644 --- a/frontend/src/layouts/dashboard/side-nav-item.js +++ b/frontend/src/layouts/dashboard/side-nav-item.js @@ -50,7 +50,7 @@ export const SideNavItem = (props) => { justifyContent: 'center', mr: 2, ...(active && { - color: 'primary.main' + color: '#FFFFFF' }) }} > diff --git a/frontend/src/layouts/dashboard/top-nav.js b/frontend/src/layouts/dashboard/top-nav.js index d5a0623..fcd9f69 100644 --- a/frontend/src/layouts/dashboard/top-nav.js +++ b/frontend/src/layouts/dashboard/top-nav.js @@ -78,14 +78,14 @@ export const TopNav = (props) => { direction="row" spacing={2} > - + {/* - - + */} + {/* { - + */} { color="text.secondary" variant="body2" > - Não possui uma conta? + Don't have an account?   { underline="hover" variant="subtitle2" > - Registre-se + Register diff --git a/frontend/src/pages/devices.js b/frontend/src/pages/devices.js new file mode 100644 index 0000000..dc241ad --- /dev/null +++ b/frontend/src/pages/devices.js @@ -0,0 +1,234 @@ +import Head from 'next/head'; +import { subDays, subHours } from 'date-fns'; +import { Box, Container, Unstable_Grid2 as Grid } from '@mui/material'; +import { Layout as DashboardLayout } from 'src/layouts/dashboard/layout'; +import { OverviewBudget } from 'src/sections/overview/overview-budget'; +import { OverviewLatestOrders } from 'src/sections/overview/overview-latest-orders'; +import { OverviewLatestProducts } from 'src/sections/overview/overview-latest-products'; +import { OverviewSales } from 'src/sections/overview/overview-sales'; +import { OverviewTasksProgress } from 'src/sections/overview/overview-tasks-progress'; +import { OverviewTotalCustomers } from 'src/sections/overview/overview-total-customers'; +import { OverviewTotalProfit } from 'src/sections/overview/overview-total-profit'; +import { OverviewTraffic } from 'src/sections/overview/overview-traffic'; + +const now = new Date(); + +const Page = () => ( + <> + + + Oktopus | TR-369 + + + + + + + + + + +); + +Page.getLayout = (page) => ( + + {page} + +); + +export default Page; + +/* + + + + + +*/ diff --git a/frontend/src/pages/index.js b/frontend/src/pages/index.js index 553f184..57710db 100644 --- a/frontend/src/pages/index.js +++ b/frontend/src/pages/index.js @@ -37,12 +37,6 @@ const Page = () => ( sm={6} lg={3} > - ( sm={6} lg={3} > - + + + + + + + + + + + + + +); + +Page.getLayout = (page) => ( + + {page} + +); + +export default Page; + +/* ( ]} sx={{ height: '100%' }} /> - - - - - - ( ]} sx={{ height: '100%' }} /> - - - - - -); - -Page.getLayout = (page) => ( - - {page} - -); - -export default Page; +*/ diff --git a/frontend/src/pages/settings.js b/frontend/src/pages/settings.js index 6e8e24d..7dab58a 100644 --- a/frontend/src/pages/settings.js +++ b/frontend/src/pages/settings.js @@ -23,7 +23,7 @@ const Page = () => ( Settings - + {/**/} diff --git a/frontend/src/sections/overview/overview-latest-orders.js b/frontend/src/sections/overview/overview-latest-orders.js index 6d61d0d..2838f85 100644 --- a/frontend/src/sections/overview/overview-latest-orders.js +++ b/frontend/src/sections/overview/overview-latest-orders.js @@ -1,6 +1,7 @@ import { format } from 'date-fns'; import PropTypes from 'prop-types'; import ArrowRightIcon from '@heroicons/react/24/solid/ArrowRightIcon'; +import ArrowTopRightOnSquareIcon from '@heroicons/react/24/solid/ArrowTopRightOnSquareIcon'; import { Box, Button, @@ -19,9 +20,9 @@ import { Scrollbar } from 'src/components/scrollbar'; import { SeverityPill } from 'src/components/severity-pill'; const statusMap = { - pending: 'warning', - delivered: 'success', - refunded: 'error' + Associando: 'warning', + Online: 'success', + Offline: 'error' }; export const OverviewLatestOrders = (props) => { @@ -29,24 +30,27 @@ export const OverviewLatestOrders = (props) => { return ( - + - Order + Model Customer - Date + Vendor Status + + Acessar + @@ -72,6 +76,11 @@ export const OverviewLatestOrders = (props) => { {order.status} + + + + + ); })} @@ -79,21 +88,21 @@ export const OverviewLatestOrders = (props) => {
- - - - + {/* + + + */} ); }; diff --git a/frontend/src/sections/overview/overview-tasks-progress.js b/frontend/src/sections/overview/overview-tasks-progress.js index 955b7e0..6ad4708 100644 --- a/frontend/src/sections/overview/overview-tasks-progress.js +++ b/frontend/src/sections/overview/overview-tasks-progress.js @@ -1,5 +1,6 @@ import PropTypes from 'prop-types'; import ListBulletIcon from '@heroicons/react/24/solid/ListBulletIcon'; +import Signal from '@heroicons/react/24/solid/SignalIcon'; import { Avatar, Box, @@ -25,25 +26,25 @@ export const OverviewTasksProgress = (props) => { > - Task Progress + Conexão MQTT - {value}% + {value}ms - + diff --git a/frontend/src/sections/overview/overview-total-customers.js b/frontend/src/sections/overview/overview-total-customers.js index 10949c0..28d99c7 100644 --- a/frontend/src/sections/overview/overview-total-customers.js +++ b/frontend/src/sections/overview/overview-total-customers.js @@ -3,6 +3,7 @@ import ArrowDownIcon from '@heroicons/react/24/solid/ArrowDownIcon'; import ArrowUpIcon from '@heroicons/react/24/solid/ArrowUpIcon'; import UsersIcon from '@heroicons/react/24/solid/UsersIcon'; import { Avatar, Card, CardContent, Stack, SvgIcon, Typography } from '@mui/material'; +import CpuChipIcon from '@heroicons/react/24/solid/CpuChipIcon'; export const OverviewTotalCustomers = (props) => { const { difference, positive = false, sx, value } = props; @@ -21,7 +22,7 @@ export const OverviewTotalCustomers = (props) => { color="text.secondary" variant="overline" > - Total Customers + Total Devices {value} @@ -29,13 +30,13 @@ export const OverviewTotalCustomers = (props) => { - + diff --git a/frontend/src/sections/overview/overview-traffic.js b/frontend/src/sections/overview/overview-traffic.js index 98f0973..7e03824 100644 --- a/frontend/src/sections/overview/overview-traffic.js +++ b/frontend/src/sections/overview/overview-traffic.js @@ -14,18 +14,12 @@ import { } from '@mui/material'; import { Chart } from 'src/components/chart'; -const useChartOptions = (labels) => { +const useChartOptions = (labels,title) => { const theme = useTheme(); - - return { + let options = { chart: { background: 'transparent' }, - colors: [ - theme.palette.primary.main, - theme.palette.success.main, - theme.palette.warning.main - ], dataLabels: { enabled: false }, @@ -60,6 +54,19 @@ const useChartOptions = (labels) => { fillSeriesColor: false } }; + if(title === "Status"){ + options.colors = [ + theme.palette.success.main, + theme.palette.error.main, + ] + }else{ + options.colors = [ + theme.palette.primary.main, + theme.palette.info.main, + theme.palette.warning.main + ] + } + return options }; const iconMap = { @@ -81,12 +88,14 @@ const iconMap = { }; export const OverviewTraffic = (props) => { - const { chartSeries, labels, sx } = props; - const chartOptions = useChartOptions(labels); + const { chartSeries, labels, sx, title } = props; + const chartOptions = useChartOptions(labels,title); return ( - +
+ +
{ {iconMap[label]} {label} diff --git a/frontend/src/theme/colors.js b/frontend/src/theme/colors.js index 94f89e8..e3b59fa 100644 --- a/frontend/src/theme/colors.js +++ b/frontend/src/theme/colors.js @@ -12,7 +12,7 @@ const withAlphas = (color) => { }; export const neutral = { - 50: '#F8F9FA', + 50: '#306d6f', 100: '#F3F4F6', 200: '#E5E7EB', 300: '#D2D6DB',