yogiedigital/cod-fe
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

integration api history alarm and event alarm

Browse Source
This commit is contained in:
Fachba
2025-10-25 23:54:22 +07:00
parent a86795fdf6
commit 5a8e2dee2f
3 changed files with 86 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
src/api/history-value.jsx Normal file
View File

@@ -0,0 +1,21 @@
import { SendRequest } from '../components/Global/ApiRequest';
const getAllHistoryAlarm = async (queryParams) => {
const response = await SendRequest({
method: 'get',
prefix: `history/alarm?${queryParams.toString()}`,
});
return response.data;
};
const getAllHistoryEvent = async (queryParams) => {
const response = await SendRequest({
method: 'get',
prefix: `history/event?${queryParams.toString()}`,
});
return response.data;
};
export { getAllHistoryAlarm, getAllHistoryEvent };

60
src/pages/history/alarm/component/ListHistoryAlarm.jsx
View File

@@ -2,6 +2,7 @@ import React, { memo, useState, useEffect } from 'react';
import { Button, Row, Col, Card, Input } from 'antd';
import { SearchOutlined } from '@ant-design/icons';
import TableList from '../../../../components/Global/TableList';
import { getAllHistoryAlarm } from '../../../../api/history-value';
const ListHistoryAlarm = memo(function ListHistoryAlarm(props) {
const columns = [
@@ -16,7 +17,8 @@ const ListHistoryAlarm = memo(function ListHistoryAlarm(props) {
title: 'Datetime',
dataIndex: 'datetime',
key: 'datetime',
width: '10%',
width: '15%',
// render: (_, record) => toAppDateTimezoneFormatter(record.datetime),
},
{
title: 'Tag Name',
@@ -26,50 +28,78 @@ const ListHistoryAlarm = memo(function ListHistoryAlarm(props) {
},
{
title: 'Value',
dataIndex: 'stat',
key: 'stat',
dataIndex: 'new_val',
key: 'new_val',
width: '10%',
render: (_, record) => Number(record.new_val).toFixed(4),
},
{
title: 'Threshold',
dataIndex: 'threshold',
key: 'threshold',
width: '10%',
render: (_, record) => {
switch (record.status) {
case 1:
return (
<span>
{record.lim_low + 1} : {record.lim_high - 1}
</span>
);
case 2:
return <span>{`< ${record.lim_low_crash}`}</span>;
case 3:
return (
<span>
{record.lim_low_crash + 1} : {record.lim_low - 1}
</span>
);
case 4:
return (
<span>
{record.lim_high + 1} : {record.lim_high_crash - 1}
</span>
);
case 5:
return <span>{`> ${record.lim_high_crash}`}</span>;
default:
return <span>Undefined</span>;
}
},
},
{
title: 'Condition',
dataIndex: 'condition',
key: 'condition',
width: '20%',
render: (_, record) => (
<Button type="text" style={{ backgroundColor: record.status_color, width: '100%' }}>
{record.condition}
</Button>
),
},
{
title: 'Stat',
dataIndex: 'stat',
key: 'stat',
dataIndex: 'status',
key: 'status',
width: '5%',
},
];
const [trigerFilter, setTrigerFilter] = useState(false);
const defaultFilter = { search: '' };
const defaultFilter = { criteria: '' };
const [formDataFilter, setFormDataFilter] = useState(defaultFilter);
const [searchValue, setSearchValue] = useState('');
const getAllEventAlarm = async (params) => {
return {
data: [],
};
};
const handleSearch = () => {
setFormDataFilter({ search: searchValue });
setFormDataFilter({ criteria: searchValue });
setTrigerFilter((prev) => !prev);
};
const handleSearchClear = () => {
setSearchValue('');
setFormDataFilter({ search: '' });
setFormDataFilter({ criteria: '' });
setTrigerFilter((prev) => !prev);
};
@@ -113,7 +143,7 @@ const ListHistoryAlarm = memo(function ListHistoryAlarm(props) {
</Col>
<Col xs={24} sm={24} md={24} lg={24} xl={24} style={{ marginTop: '16px' }}>
<TableList
getData={getAllEventAlarm}
getData={getAllHistoryAlarm}
queryParams={formDataFilter}
columns={columns}
triger={trigerFilter}

39
src/pages/history/event/component/ListHistoryEvent.jsx
View File

@@ -2,6 +2,7 @@ import React, { memo, useState, useEffect } from 'react';
import { Button, Row, Col, Card, Input } from 'antd';
import { SearchOutlined } from '@ant-design/icons';
import TableList from '../../../../components/Global/TableList';
import { getAllHistoryEvent } from '../../../../api/history-value';
const ListHistoryEvent = memo(function ListHistoryEvent(props) {
const columns = [
@@ -16,7 +17,8 @@ const ListHistoryEvent = memo(function ListHistoryEvent(props) {
title: 'Datetime',
dataIndex: 'datetime',
key: 'datetime',
width: '10%',
width: '15%',
// render: (_, record) => toAppDateTimezoneFormatter(record.datetime),
},
{
title: 'Tag Name',
@@ -25,39 +27,38 @@ const ListHistoryEvent = memo(function ListHistoryEvent(props) {
width: '40%',
},
{
title: 'Stat',
dataIndex: 'stat',
key: 'stat',
width: '5%',
title: 'Description',
dataIndex: 'condition',
key: 'condition',
width: '20%',
render: (_, record) => (
<Button type="text" style={{ backgroundColor: record.status_color, width: '100%' }}>
{record.condition}
</Button>
),
},
{
title: 'Description',
dataIndex: 'description',
key: 'description',
width: '15%',
title: 'Stat',
dataIndex: 'status',
key: 'status',
width: '5%',
},
];
const [trigerFilter, setTrigerFilter] = useState(false);
const defaultFilter = { search: '' };
const defaultFilter = { criteria: '' };
const [formDataFilter, setFormDataFilter] = useState(defaultFilter);
const [searchValue, setSearchValue] = useState('');
const getAllEventAlarm = async (params) => {
return {
data: [],
};
};
const handleSearch = () => {
setFormDataFilter({ search: searchValue });
setFormDataFilter({ criteria: searchValue });
setTrigerFilter((prev) => !prev);
};
const handleSearchClear = () => {
setSearchValue('');
setFormDataFilter({ search: '' });
setFormDataFilter({ criteria: '' });
setTrigerFilter((prev) => !prev);
};
@@ -101,7 +102,7 @@ const ListHistoryEvent = memo(function ListHistoryEvent(props) {
</Col>
<Col xs={24} sm={24} md={24} lg={24} xl={24} style={{ marginTop: '16px' }}>
<TableList
getData={getAllEventAlarm}
getData={getAllHistoryEvent}
queryParams={formDataFilter}
columns={columns}
triger={trigerFilter}