Telecominfraproject/wlan-cloud-ui
1
0
Fork 0
mirror of https://github.com/Telecominfraproject/wlan-cloud-ui.git synced 2026-03-21 19:39:28 +00:00
Code Issues Packages Projects Releases 7 Wiki Activity

Device History Chart

Browse Source
This commit is contained in:
Sean Macfarlane
2020-06-11 18:57:41 -04:00
parent a30a861d3c
commit 3781e0890d
3 changed files with 86 additions and 196 deletions
Download Patch File Download Diff File Expand all files Collapse all files

219
app/constants/index.js
View File

@@ -3,201 +3,38 @@ export const COMPANY = 'Telecom Infra Project';
export const IS_RADIO_TYPE_5GHZ = 'is5GHz';
export const IS_RADIO_TYPE_2DOT4GHZ = 'is2dot4GHz';
export const CLIENT_DEVICES_TABLE_DATA = [
export const METRICS_DATA = [
{
key: 0,
name: 'Laptop',
mac: 'DO:C6:37:69:3E:FD',
osModelMfr: 'Linux',
ip: '100.115.92.2',
hostName: 'LAPTOP-714LRTP6',
accessPoint: 'AP100',
ssid: 'TestUs',
band: '5Ghz',
signal: '-43 dBm',
status: '39h 41m 25s Connected',
locationId: 3,
model_type: 'ServiceMetric',
customerId: 2,
equipmentId: 51,
clientMac: 211771154934121,
dataType: 'Client',
createdTimestamp: 1591891071746,
txBytes: 485035578,
rxBytes: 33484840,
rssi: -45,
},
{
key: 1,
name: 'Laptop',
mac: 'DO:C6:37:69:3E:FD',
osModelMfr: 'Linux',
ip: '100.115.92.2',
hostName: 'LAPTOP-714LRTP6',
accessPoint: 'AP100',
ssid: 'TestUs',
band: '5Ghz',
signal: '-43 dBm',
status: '39h 41m 25s Connected',
locationId: 7,
model_type: 'ServiceMetric',
customerId: 2,
equipmentId: 51,
clientMac: 9786249446603,
dataType: 'Client',
createdTimestamp: 1591893111581,
rssi: -50,
rxBytes: 226475,
txBytes: 3736481,
},
{
key: 2,
name: 'Laptop',
mac: 'DO:C6:37:69:3E:FD',
osModelMfr: 'Linux',
ip: '100.115.92.2',
hostName: 'LAPTOP-714LRTP6',
accessPoint: 'AP100',
ssid: 'TestUs',
band: '5Ghz',
signal: '-43 dBm',
status: '39h 41m 25s Connected',
locationId: 2,
},
{
key: 3,
name: 'Laptop',
mac: 'DO:C6:37:69:3E:FD',
osModelMfr: 'Linux',
ip: '100.115.92.2',
hostName: 'LAPTOP-714LRTP6',
accessPoint: 'AP100',
ssid: 'TestUs',
band: '5Ghz',
signal: '-43 dBm',
status: '39h 41m 25s Connected',
locationId: 2,
},
{
key: 4,
name: 'Laptop',
mac: 'DO:C6:37:69:3E:FD',
osModelMfr: 'Linux',
ip: '100.115.92.2',
hostName: 'LAPTOP-714LRTP6',
accessPoint: 'AP100',
ssid: 'TestUs',
band: '5Ghz',
signal: '-43 dBm',
status: '39h 41m 25s Connected',
locationId: 2,
},
{
key: 5,
name: 'Laptop',
mac: 'DO:C6:37:69:3E:FD',
osModelMfr: 'Linux',
ip: '100.115.92.2',
hostName: 'LAPTOP-714LRTP6',
accessPoint: 'AP100',
ssid: 'TestUs',
band: '5Ghz',
signal: '-43 dBm',
status: '39h 41m 25s Connected',
locationId: 2,
},
{
key: 6,
name: 'Laptop',
mac: 'DO:C6:37:69:3E:FD',
osModelMfr: 'Linux',
ip: '100.115.92.2',
hostName: 'LAPTOP-714LRTP6',
accessPoint: 'AP100',
ssid: 'TestUs',
band: '5Ghz',
signal: '-43 dBm',
status: '39h 41m 25s Connected',
locationId: 8,
},
{
key: 7,
name: 'Laptop',
mac: 'DO:C6:37:69:3E:FD',
osModelMfr: 'Linux',
ip: '100.115.92.2',
hostName: 'LAPTOP-714LRTP6',
accessPoint: 'AP100',
ssid: 'TestUs',
band: '5Ghz',
signal: '-43 dBm',
status: '39h 41m 25s Connected',
locationId: 8,
},
{
key: 8,
name: 'Laptop',
mac: 'DO:C6:37:69:3E:FD',
osModelMfr: 'Linux',
ip: '100.115.92.2',
hostName: 'LAPTOP-714LRTP6',
accessPoint: 'AP100',
ssid: 'TestUs',
band: '5Ghz',
signal: '-43 dBm',
status: '39h 41m 25s Connected',
locationId: 8,
},
{
key: 9,
name: 'Laptop',
mac: 'DO:C6:37:69:3E:FD',
osModelMfr: 'Linux',
ip: '100.115.92.2',
hostName: 'LAPTOP-714LRTP6',
accessPoint: 'AP100',
ssid: 'TestUs',
band: '5Ghz',
signal: '-43 dBm',
status: '39h 41m 25s Connected',
locationId: 8,
},
{
key: 10,
name: 'Laptop',
mac: 'DO:C6:37:69:3E:FD',
osModelMfr: 'Linux',
ip: '100.115.92.2',
hostName: 'LAPTOP-714LRTP6',
accessPoint: 'AP100',
ssid: 'TestUs',
band: '5Ghz',
signal: '-43 dBm',
status: '39h 41m 25s Connected',
locationId: 8,
},
{
key: 11,
name: 'Laptop',
mac: 'DO:C6:37:69:3E:FD',
osModelMfr: 'Linux',
ip: '100.115.92.2',
hostName: 'LAPTOP-714LRTP6',
accessPoint: 'AP100',
ssid: 'TestUs',
band: '5Ghz',
signal: '-43 dBm',
status: '39h 41m 25s Connected',
locationId: 8,
},
{
key: 12,
name: 'Laptop',
mac: 'DO:C6:37:69:3E:FD',
osModelMfr: 'Linux',
ip: '100.115.92.2',
hostName: 'LAPTOP-714LRTP6',
accessPoint: 'AP100',
ssid: 'TestUs',
band: '5Ghz',
signal: '-43 dBm',
status: '39h 41m 25s Connected',
locationId: 8,
},
{
key: 13,
name: 'Laptop',
mac: 'DO:C6:37:69:3E:FD',
osModelMfr: 'Linux',
ip: '100.115.92.2',
hostName: 'LAPTOP-714LRTP6',
accessPoint: 'AP100',
ssid: 'TestUs',
band: '5Ghz',
signal: '-43 dBm',
status: '39h 41m 25s Connected',
locationId: 8,
model_type: 'ServiceMetric',
customerId: 2,
equipmentId: 51,
clientMac: 9786249446603,
dataType: 'Client',
createdTimestamp: 1591893171581,
rssi: -47,
rxBytes: 334224030,
txBytes: 1489212837,
},
];

31
app/containers/Network/containers/ClientDeviceDetails/index.js
View File

@@ -2,18 +2,33 @@ import React, { useContext } from 'react';
import { useParams } from 'react-router-dom';
import { useQuery } from '@apollo/react-hooks';
import { Alert } from 'antd';
import { Loading } from '@tip-wlan/wlan-cloud-ui-library';
import moment from 'moment';
import { Loading, DeviceHistory } from '@tip-wlan/wlan-cloud-ui-library';
import { METRICS_DATA } from 'constants/index';
import UserContext from 'contexts/UserContext';
import { GET_CLIENT_SESSION } from 'graphql/queries';
import { GET_CLIENT_SESSION, FILTER_SERVICE_METRICS } from 'graphql/queries';
const ClientDeviceDetails = () => {
const toTime = moment();
const fromTime = toTime.subtract(4, 'hours');
const { id } = useParams();
const { customerId } = useContext(UserContext);
const { loading, error, data } = useQuery(GET_CLIENT_SESSION, {
variables: { customerId, macAddress: id },
});
const { loading: metricsLoading, error: metricsError } = useQuery(FILTER_SERVICE_METRICS, {
variables: {
customerId,
fromTime: fromTime.unix(),
toTime: toTime.unix(),
clientMacs: [id],
dataTypes: ['Client'],
},
});
if (loading) {
return <Loading />;
}
@@ -24,8 +39,6 @@ const ClientDeviceDetails = () => {
);
}
const { macAddress } = data.getClientSession[0];
/*
const {
macAddress,
@@ -62,7 +75,15 @@ const ClientDeviceDetails = () => {
*/
return <h1>Client Device Details: {macAddress}</h1>;
return (
<>
<h1>Client Device Details: {data.getClientSession[0].macAddress}</h1>
{metricsError && (
<Alert message="Error" description="Failed to load History˝." type="error" showIcon />
)}
<DeviceHistory loading={metricsLoading} historyDate={toTime} data={METRICS_DATA} />
</>
);
};
export default ClientDeviceDetails;

32
app/graphql/queries.js
View File

@@ -102,3 +102,35 @@ export const GET_CLIENT_SESSION = gql`
}
}
`;
export const FILTER_SERVICE_METRICS = gql`
query FilterServiceMetrics(
$customerId: Int!
$cursor: String
$fromTime: Int!
$toTime: Int!
$clientMacs: [String]
$dataTypes: [String]
) {
filterServiceMetrics(
customerId: $customerId
cursor: $cursor
fromTime: $fromTime
toTime: $toTime
clientMacs: $clientMacs
dataTypes: $dataTypes
) {
items {
dataType
createdTimestamp
rssi
rxBytes
txBytes
}
context {
lastPage
cursor
}
}
}
`;