feat(device/detail): update BinarySensors component, add Chart component for sensor data visualization and add update-iconfont.sh

This commit is contained in:
Tran Anh Tuan
2026-02-05 10:09:59 +07:00
parent 256ce06ea2
commit 8af31a0435
12 changed files with 871 additions and 24 deletions

View File

@@ -1,14 +1,6 @@
import IconFont from '@/components/IconFont';
import { StatisticCard } from '@ant-design/pro-components';
import {
Divider,
Flex,
GlobalToken,
Grid,
theme,
Tooltip,
Typography,
} from 'antd';
import { Flex, GlobalToken, Grid, theme, Tooltip, Typography } from 'antd';
const { Text } = Typography;
type BinarySensorsProps = {
nodeConfigs: MasterModel.NodeConfig[];
@@ -148,7 +140,6 @@ const BinarySensors = ({ nodeConfigs }: BinarySensorsProps) => {
return (
<Flex wrap="wrap" gap="middle">
<Divider orientation="left">Cảm biến</Divider>
{binarySensors.map((entity) => (
<div
key={entity.entityId}

View File

@@ -0,0 +1,610 @@
import '@/utils/chart';
import type { ChartData, ChartOptions } from 'chart.js';
import { Line } from 'react-chartjs-2';
type ChartComponentProps = {
message: MasterModel.SensorLogMessage[];
};
const exampleSensorLogMessages: MasterModel.SensorLogMessage[] = [
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770260026,
value: 76.3,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770259725,
value: 77.1,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770259424,
value: 75.6,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770259242,
value: 72.6,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770259142,
value: 69.6,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770258926,
value: 66.6,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770258877,
value: 69.6,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770258839,
value: 73,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770258678,
value: 76.1,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770258377,
value: 77.6,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770258077,
value: 77.8,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770257776,
value: 75.6,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770257596,
value: 72.5,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770257487,
value: 69.5,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770257412,
value: 66.4,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770257349,
value: 63.3,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770257117,
value: 60.3,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770256816,
value: 62.3,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770256625,
value: 65.3,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770256563,
value: 68.4,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770256529,
value: 71.4,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770256363,
value: 74.7,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770256062,
value: 75.2,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770255761,
value: 74.3,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770255590,
value: 71.2,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770255498,
value: 68.1,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770255436,
value: 64.9,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770255331,
value: 61.8,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770255111,
value: 64.8,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770255038,
value: 67.9,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770255002,
value: 71.1,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770254968,
value: 74.2,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770254688,
value: 77.4,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770254387,
value: 78.4,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770254086,
value: 77.9,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770253786,
value: 75,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770253631,
value: 72,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770253549,
value: 68.9,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770253481,
value: 65.8,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770253434,
value: 62.7,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770253364,
value: 59.6,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770253063,
value: 60.4,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770252763,
value: 62.5,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770252695,
value: 65.5,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770252657,
value: 68.6,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770252489,
value: 71.7,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770252188,
value: 71.2,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770251886,
value: 68.7,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770251585,
value: 65.9,
},
{
channel: 'c2552f8e-6e2f-4703-bdc2-681d2a0646d9',
subtopic: 'log.gmsv5.hum.0:20',
publisher: 'f4bd927c-f578-420d-9b63-ef7fb053d901',
protocol: 'mqtt',
name: 'urn:dev:mac:0038310555e4:0:20',
unit: '%',
time: 1770251469,
value: 68.9,
},
];
// Custom plugin để vẽ đường kẻ dọc khi hover
const verticalLinePlugin = {
id: 'verticalLine',
afterDraw: (chart: any) => {
if (chart.tooltip?._active?.length) {
const ctx = chart.ctx;
const x = chart.tooltip._active[0].element.x;
const topY = chart.scales.y.top;
const bottomY = chart.scales.y.bottom;
ctx.save();
ctx.beginPath();
ctx.moveTo(x, topY);
ctx.lineTo(x, bottomY);
ctx.lineWidth = 1;
ctx.strokeStyle = 'rgba(0, 0, 0, 0.3)';
ctx.stroke();
ctx.restore();
}
},
};
const ChartComponent = () => {
const data: ChartData<'line', number[], string> = {
labels: exampleSensorLogMessages.map((msg) =>
new Date(msg.time! * 1000).toLocaleTimeString(),
),
datasets: [
{
label: exampleSensorLogMessages[0]?.unit || '',
data: exampleSensorLogMessages.map((msg) => msg.value),
borderColor: 'rgba(75, 192, 192, 0.2)',
backgroundColor: 'rgba(75, 192, 192, 0.2)',
tension: 0.1,
fill: 'start',
pointRadius: 0,
},
],
};
const options: ChartOptions<'line'> = {
interaction: {
mode: 'index',
intersect: true,
},
scales: {
x: {
ticks: {
display: false,
},
grid: {
display: false,
},
},
y: {
display: false,
min: 0,
max: 100,
},
},
plugins: {
tooltip: {
enabled: true,
mode: 'index',
intersect: false,
callbacks: {
label: (context) => {
return `${context.parsed.y} ${
exampleSensorLogMessages[0]?.unit || ''
}`;
},
title: (context) => {
const index = context[0]?.dataIndex;
if (index !== undefined) {
const msg = exampleSensorLogMessages[index];
return new Date(msg.time! * 1000).toLocaleString();
}
return '';
},
},
},
legend: {
display: false,
},
},
};
return (
<Line
title="Nooo"
data={data}
options={options}
plugins={[verticalLinePlugin]}
/>
);
};
export default ChartComponent;

View File

@@ -3,11 +3,17 @@ import TooltipIconFontButton from '@/components/shared/TooltipIconFontButton';
import { ROUTER_HOME } from '@/constants/routes';
import { apiQueryNodeConfigMessage } from '@/services/master/MessageController';
import { apiGetThingDetail } from '@/services/master/ThingController';
import {
EditOutlined,
EllipsisOutlined,
SettingOutlined,
} from '@ant-design/icons';
import { PageContainer, ProCard } from '@ant-design/pro-components';
import { history, useIntl, useModel, useParams } from '@umijs/max';
import { Divider, Flex, Grid } from 'antd';
import { useEffect, useState } from 'react';
import BinarySensors from './components/BinarySensors';
import ChartComponent from './components/Chart';
import ThingTitle from './components/ThingTitle';
const DetailDevicePage = () => {
@@ -109,8 +115,21 @@ const DetailDevicePage = () => {
</ProCard>
<ProCard colSpan={{ xs: 24, sm: 24, md: 24, lg: 18, xl: 18 }}>
<Flex wrap gap="small">
<Divider orientation="left">Cảm biến</Divider>
<BinarySensors nodeConfigs={nodeConfigs} />
<Divider orientation="left">Trạng thái</Divider>
<ProCard
title="Mẫu 1"
bordered
style={{ maxWidth: 600 }}
actions={[
<SettingOutlined key="setting" />,
<EditOutlined key="edit" />,
<EllipsisOutlined key="ellipsis" />,
]}
>
<ChartComponent />
</ProCard>
</Flex>
</ProCard>
</ProCard>

View File

@@ -165,7 +165,6 @@ const ManagerDevicePage = () => {
'-'
),
},
{
key: 'type',
hideInSearch: true,

View File

@@ -211,3 +211,19 @@ export async function apiQueryConfigAlarm(
return resp;
}
export async function apiQuerySensorLogMessage(
dataChanelId: string,
authorization: string,
params: MasterModel.SearchMessagePaginationBody,
) {
return request<
MasterModel.MesageReaderResponse<MasterModel.SensorLogMessage[]>
>(`${API_READER}/${dataChanelId}/messages`, {
method: 'GET',
headers: {
Authorization: authorization,
},
params: params,
});
}

View File

@@ -6,6 +6,15 @@ declare namespace MasterModel {
subtopic?: string;
}
interface MessageBasicInfo {
channel?: string;
subtopic?: string;
publisher?: string;
protocol?: string;
name?: string;
time?: number;
}
type LogTypeRequest = 'user_logs' | undefined;
interface MesageReaderResponse<T = MessageDataType> {
@@ -27,13 +36,7 @@ declare namespace MasterModel {
type MessageDataType = NodeConfig[] | CameraV5 | CameraV6;
interface Message<T = MessageDataType> {
channel?: string;
subtopic?: string;
publisher?: string;
protocol?: string;
name?: string;
time?: number;
interface Message<T = MessageDataType> extends MessageBasicInfo {
string_value?: string;
string_value_parsed?: T;
}
@@ -69,4 +72,9 @@ declare namespace MasterModel {
type: Type;
name: string;
}
interface SensorLogMessage extends MessageBasicInfo {
unit: string;
value: number;
}
}

22
src/utils/chart.ts Normal file
View File

@@ -0,0 +1,22 @@
import {
BarElement,
CategoryScale,
Chart as ChartJS,
Filler,
Legend,
LinearScale,
LineElement,
PointElement,
Tooltip,
} from 'chart.js';
ChartJS.register(
CategoryScale,
LinearScale,
PointElement,
LineElement,
BarElement,
Filler,
Tooltip,
Legend,
);