lavoce #2
@@ -1,29 +1,71 @@
|
|||||||
import React, { memo, useEffect } from 'react';
|
import React, { memo, useState, useEffect } from 'react';
|
||||||
import { useNavigate } from 'react-router-dom';
|
import { useNavigate } from 'react-router-dom';
|
||||||
import { useBreadcrumb } from '../../layout/LayoutBreadcrumb';
|
import { useBreadcrumb } from '../../layout/LayoutBreadcrumb';
|
||||||
import { Typography } from 'antd';
|
import { Form, Typography } from 'antd';
|
||||||
|
import ListEventAlarm from './component/ListEventAlarm';
|
||||||
|
import DetailEventAlarm from './component/DetailEventAlarm';
|
||||||
|
|
||||||
const { Text } = Typography;
|
const { Text } = Typography;
|
||||||
|
|
||||||
const IndexEventAlarm = memo(function IndexEventAlarm() {
|
const IndexEventAlarm = memo(function IndexEventAlarm() {
|
||||||
const navigate = useNavigate();
|
const navigate = useNavigate();
|
||||||
const { setBreadcrumbItems } = useBreadcrumb();
|
const { setBreadcrumbItems } = useBreadcrumb();
|
||||||
|
const [form] = Form.useForm();
|
||||||
|
|
||||||
|
const [actionMode, setActionMode] = useState('list');
|
||||||
|
const [selectedData, setSelectedData] = useState(null);
|
||||||
|
const [isModalVisible, setIsModalVisible] = useState(false);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const token = localStorage.getItem('token');
|
const token = localStorage.getItem('token');
|
||||||
if (token) {
|
if (token) {
|
||||||
setBreadcrumbItems([
|
setBreadcrumbItems([
|
||||||
{ title: <Text strong style={{ fontSize: '14px' }}>• Event Alarm</Text> }
|
{
|
||||||
|
title: (
|
||||||
|
<Text strong style={{ fontSize: '14px' }}>
|
||||||
|
• Event Alarm
|
||||||
|
</Text>
|
||||||
|
),
|
||||||
|
},
|
||||||
]);
|
]);
|
||||||
} else {
|
} else {
|
||||||
navigate('/signin');
|
navigate('/signin');
|
||||||
}
|
}
|
||||||
}, []);
|
}, [navigate, setBreadcrumbItems]);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (actionMode === 'preview') {
|
||||||
|
setIsModalVisible(true);
|
||||||
|
if (selectedData) {
|
||||||
|
form.setFieldsValue(selectedData);
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
setIsModalVisible(false);
|
||||||
|
form.resetFields();
|
||||||
|
}
|
||||||
|
}, [actionMode, selectedData, form]);
|
||||||
|
|
||||||
|
const handleCancel = () => {
|
||||||
|
setActionMode('list');
|
||||||
|
setSelectedData(null);
|
||||||
|
form.resetFields();
|
||||||
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div>
|
<React.Fragment>
|
||||||
<h1>Event Alarm Page</h1>
|
<ListEventAlarm
|
||||||
</div>
|
actionMode={actionMode}
|
||||||
|
setActionMode={setActionMode}
|
||||||
|
selectedData={selectedData}
|
||||||
|
setSelectedData={setSelectedData}
|
||||||
|
/>
|
||||||
|
<DetailEventAlarm
|
||||||
|
visible={isModalVisible}
|
||||||
|
onCancel={handleCancel}
|
||||||
|
form={form}
|
||||||
|
selectedData={selectedData}
|
||||||
|
/>
|
||||||
|
</React.Fragment>
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
247
src/pages/eventAlarm/component/DetailEventAlarm.jsx
Normal file
247
src/pages/eventAlarm/component/DetailEventAlarm.jsx
Normal file
@@ -0,0 +1,247 @@
|
|||||||
|
import React, { memo, useState, useEffect } from 'react';
|
||||||
|
import { Button, Row, Col, Card, Input } from 'antd';
|
||||||
|
import { SearchOutlined } from '@ant-design/icons';
|
||||||
|
import { useNavigate } from 'react-router-dom';
|
||||||
|
import TableList from '../../../components/Global/TableList';
|
||||||
|
|
||||||
|
// Dummy data untuk riwayat alarm
|
||||||
|
const initialAlarmsData = [
|
||||||
|
{
|
||||||
|
alarm_id: 1,
|
||||||
|
tanggal: '2025-01-15 08:30:00',
|
||||||
|
plant_sub_section: 'Plant A - Section 1',
|
||||||
|
device: 'Device 001',
|
||||||
|
tag: 'TEMP-001',
|
||||||
|
engineer: 'Pras',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
alarm_id: 2,
|
||||||
|
tanggal: '2025-01-15 09:15:00',
|
||||||
|
plant_sub_section: 'Plant B - Section 2',
|
||||||
|
device: 'Device 002',
|
||||||
|
tag: 'PRESS-002',
|
||||||
|
engineer: 'Bagus',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
alarm_id: 3,
|
||||||
|
tanggal: '2025-01-15 10:00:00',
|
||||||
|
plant_sub_section: 'Plant A - Section 3',
|
||||||
|
device: 'Device 003',
|
||||||
|
tag: 'FLOW-003',
|
||||||
|
engineer: 'iqbal',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
alarm_id: 4,
|
||||||
|
tanggal: '2025-01-15 11:45:00',
|
||||||
|
plant_sub_section: 'Plant C - Section 1',
|
||||||
|
device: 'Device 004',
|
||||||
|
tag: 'LEVEL-004',
|
||||||
|
engineer: 'riski',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
alarm_id: 5,
|
||||||
|
tanggal: '2025-01-15 13:20:00',
|
||||||
|
plant_sub_section: 'Plant B - Section 3',
|
||||||
|
device: 'Device 005',
|
||||||
|
tag: 'TEMP-005',
|
||||||
|
engineer: 'anton',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
alarm_id: 6,
|
||||||
|
tanggal: '2025-01-15 14:00:00',
|
||||||
|
plant_sub_section: 'Plant A - Section 2',
|
||||||
|
device: 'Device 006',
|
||||||
|
tag: 'PRESS-006',
|
||||||
|
engineer: 'kurniawan',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
alarm_id: 7,
|
||||||
|
tanggal: '2025-01-15 15:30:00',
|
||||||
|
plant_sub_section: 'Plant C - Section 2',
|
||||||
|
device: 'Device 007',
|
||||||
|
tag: 'FLOW-007',
|
||||||
|
engineer: 'wawan',
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
const columns = [
|
||||||
|
{
|
||||||
|
title: 'No',
|
||||||
|
key: 'no',
|
||||||
|
width: '5%',
|
||||||
|
align: 'center',
|
||||||
|
render: (_, __, index) => index + 1,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: 'Tanggal',
|
||||||
|
dataIndex: 'tanggal',
|
||||||
|
key: 'tanggal',
|
||||||
|
width: '15%',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: 'Plant Sub Section',
|
||||||
|
dataIndex: 'plant_sub_section',
|
||||||
|
key: 'plant_sub_section',
|
||||||
|
width: '20%',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: 'Device',
|
||||||
|
dataIndex: 'device',
|
||||||
|
key: 'device',
|
||||||
|
width: '15%',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: 'Tag',
|
||||||
|
dataIndex: 'tag',
|
||||||
|
key: 'tag',
|
||||||
|
width: '15%',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: 'Engineer',
|
||||||
|
dataIndex: 'engineer',
|
||||||
|
key: 'engineer',
|
||||||
|
width: '15%',
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
const ListEventAlarm = memo(function ListEventAlarm(props) {
|
||||||
|
const [trigerFilter, setTrigerFilter] = useState(false);
|
||||||
|
const [alarmsData] = useState(initialAlarmsData);
|
||||||
|
|
||||||
|
const defaultFilter = { search: '' };
|
||||||
|
const [formDataFilter, setFormDataFilter] = useState(defaultFilter);
|
||||||
|
const [searchValue, setSearchValue] = useState('');
|
||||||
|
|
||||||
|
const navigate = useNavigate();
|
||||||
|
|
||||||
|
// Dummy data function to simulate API call
|
||||||
|
const getAllEventAlarm = async (params) => {
|
||||||
|
// Simulate API delay
|
||||||
|
await new Promise((resolve) => setTimeout(resolve, 300));
|
||||||
|
|
||||||
|
// Extract URLSearchParams
|
||||||
|
const searchParam = params.get('search') || '';
|
||||||
|
const page = parseInt(params.get('page')) || 1;
|
||||||
|
const limit = parseInt(params.get('limit')) || 10;
|
||||||
|
|
||||||
|
console.log('getAllEventAlarm called with:', { searchParam, page, limit });
|
||||||
|
|
||||||
|
// Filter by search
|
||||||
|
let filteredAlarms = alarmsData;
|
||||||
|
if (searchParam) {
|
||||||
|
const searchLower = searchParam.toLowerCase();
|
||||||
|
filteredAlarms = alarmsData.filter(
|
||||||
|
(alarm) =>
|
||||||
|
alarm.tanggal.toLowerCase().includes(searchLower) ||
|
||||||
|
alarm.plant_sub_section.toLowerCase().includes(searchLower) ||
|
||||||
|
alarm.device.toLowerCase().includes(searchLower) ||
|
||||||
|
alarm.tag.toLowerCase().includes(searchLower) ||
|
||||||
|
alarm.engineer.toLowerCase().includes(searchLower)
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Pagination logic
|
||||||
|
const totalData = filteredAlarms.length;
|
||||||
|
const totalPages = Math.ceil(totalData / limit);
|
||||||
|
const startIndex = (page - 1) * limit;
|
||||||
|
const endIndex = startIndex + limit;
|
||||||
|
const paginatedData = filteredAlarms.slice(startIndex, endIndex);
|
||||||
|
|
||||||
|
return {
|
||||||
|
status: 200,
|
||||||
|
statusCode: 200,
|
||||||
|
data: {
|
||||||
|
data: paginatedData,
|
||||||
|
total: totalData,
|
||||||
|
paging: {
|
||||||
|
page: page,
|
||||||
|
limit: limit,
|
||||||
|
total: totalData,
|
||||||
|
page_total: totalPages,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
};
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
const token = localStorage.getItem('token');
|
||||||
|
if (token) {
|
||||||
|
if (props.actionMode == 'list') {
|
||||||
|
setFormDataFilter(defaultFilter);
|
||||||
|
doFilter();
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
navigate('/signin');
|
||||||
|
}
|
||||||
|
}, [props.actionMode, alarmsData]);
|
||||||
|
|
||||||
|
const doFilter = () => {
|
||||||
|
setTrigerFilter((prev) => !prev);
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleSearch = () => {
|
||||||
|
setFormDataFilter({ search: searchValue });
|
||||||
|
setTrigerFilter((prev) => !prev);
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleSearchClear = () => {
|
||||||
|
setSearchValue('');
|
||||||
|
setFormDataFilter({ search: '' });
|
||||||
|
setTrigerFilter((prev) => !prev);
|
||||||
|
};
|
||||||
|
|
||||||
|
return (
|
||||||
|
<React.Fragment>
|
||||||
|
<Card>
|
||||||
|
<Row>
|
||||||
|
<Col xs={24}>
|
||||||
|
<Row justify="space-between" align="middle" gutter={[8, 8]}>
|
||||||
|
<Col xs={24} sm={24} md={12} lg={12}>
|
||||||
|
<Input.Search
|
||||||
|
placeholder="Search alarm by tanggal, plant, device, tag, engineer..."
|
||||||
|
value={searchValue}
|
||||||
|
onChange={(e) => {
|
||||||
|
const value = e.target.value;
|
||||||
|
setSearchValue(value);
|
||||||
|
// Auto search when clearing by backspace/delete
|
||||||
|
if (value === '') {
|
||||||
|
setFormDataFilter({ search: '' });
|
||||||
|
setTrigerFilter((prev) => !prev);
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
onSearch={handleSearch}
|
||||||
|
allowClear={{
|
||||||
|
clearIcon: <span onClick={handleSearchClear}>✕</span>,
|
||||||
|
}}
|
||||||
|
enterButton={
|
||||||
|
<Button
|
||||||
|
type="primary"
|
||||||
|
icon={<SearchOutlined />}
|
||||||
|
style={{
|
||||||
|
backgroundColor: '#23A55A',
|
||||||
|
borderColor: '#23A55A',
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
Search
|
||||||
|
</Button>
|
||||||
|
}
|
||||||
|
size="large"
|
||||||
|
/>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
</Col>
|
||||||
|
<Col xs={24} sm={24} md={24} lg={24} xl={24} style={{ marginTop: '16px' }}>
|
||||||
|
<TableList
|
||||||
|
getData={getAllEventAlarm}
|
||||||
|
queryParams={formDataFilter}
|
||||||
|
columns={columns}
|
||||||
|
triger={trigerFilter}
|
||||||
|
/>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
</Card>
|
||||||
|
</React.Fragment>
|
||||||
|
);
|
||||||
|
});
|
||||||
|
|
||||||
|
export default ListEventAlarm;
|
||||||
247
src/pages/eventAlarm/component/ListEventAlarm.jsx
Normal file
247
src/pages/eventAlarm/component/ListEventAlarm.jsx
Normal file
@@ -0,0 +1,247 @@
|
|||||||
|
import React, { memo, useState, useEffect } from 'react';
|
||||||
|
import { Button, Row, Col, Card, Input } from 'antd';
|
||||||
|
import { SearchOutlined } from '@ant-design/icons';
|
||||||
|
import { useNavigate } from 'react-router-dom';
|
||||||
|
import TableList from '../../../components/Global/TableList';
|
||||||
|
|
||||||
|
// Dummy data untuk riwayat alarm
|
||||||
|
const initialAlarmsData = [
|
||||||
|
{
|
||||||
|
alarm_id: 1,
|
||||||
|
tanggal: '2025-01-15 08:30:00',
|
||||||
|
plant_sub_section: 'Plant A - Section 1',
|
||||||
|
device: 'Device 001',
|
||||||
|
tag: 'TEMP-001',
|
||||||
|
engineer: 'Pras',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
alarm_id: 2,
|
||||||
|
tanggal: '2025-01-15 09:15:00',
|
||||||
|
plant_sub_section: 'Plant B - Section 2',
|
||||||
|
device: 'Device 002',
|
||||||
|
tag: 'PRESS-002',
|
||||||
|
engineer: 'Bagus',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
alarm_id: 3,
|
||||||
|
tanggal: '2025-01-15 10:00:00',
|
||||||
|
plant_sub_section: 'Plant A - Section 3',
|
||||||
|
device: 'Device 003',
|
||||||
|
tag: 'FLOW-003',
|
||||||
|
engineer: 'iqbal',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
alarm_id: 4,
|
||||||
|
tanggal: '2025-01-15 11:45:00',
|
||||||
|
plant_sub_section: 'Plant C - Section 1',
|
||||||
|
device: 'Device 004',
|
||||||
|
tag: 'LEVEL-004',
|
||||||
|
engineer: 'riski',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
alarm_id: 5,
|
||||||
|
tanggal: '2025-01-15 13:20:00',
|
||||||
|
plant_sub_section: 'Plant B - Section 3',
|
||||||
|
device: 'Device 005',
|
||||||
|
tag: 'TEMP-005',
|
||||||
|
engineer: 'anton',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
alarm_id: 6,
|
||||||
|
tanggal: '2025-01-15 14:00:00',
|
||||||
|
plant_sub_section: 'Plant A - Section 2',
|
||||||
|
device: 'Device 006',
|
||||||
|
tag: 'PRESS-006',
|
||||||
|
engineer: 'kurniawan',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
alarm_id: 7,
|
||||||
|
tanggal: '2025-01-15 15:30:00',
|
||||||
|
plant_sub_section: 'Plant C - Section 2',
|
||||||
|
device: 'Device 007',
|
||||||
|
tag: 'FLOW-007',
|
||||||
|
engineer: 'wawan',
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
const columns = [
|
||||||
|
{
|
||||||
|
title: 'No',
|
||||||
|
key: 'no',
|
||||||
|
width: '5%',
|
||||||
|
align: 'center',
|
||||||
|
render: (_, __, index) => index + 1,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: 'Tanggal',
|
||||||
|
dataIndex: 'tanggal',
|
||||||
|
key: 'tanggal',
|
||||||
|
width: '15%',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: 'Plant Sub Section',
|
||||||
|
dataIndex: 'plant_sub_section',
|
||||||
|
key: 'plant_sub_section',
|
||||||
|
width: '20%',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: 'Device',
|
||||||
|
dataIndex: 'device',
|
||||||
|
key: 'device',
|
||||||
|
width: '15%',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: 'Tag',
|
||||||
|
dataIndex: 'tag',
|
||||||
|
key: 'tag',
|
||||||
|
width: '15%',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: 'Engineer',
|
||||||
|
dataIndex: 'engineer',
|
||||||
|
key: 'engineer',
|
||||||
|
width: '15%',
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
const ListEventAlarm = memo(function ListEventAlarm(props) {
|
||||||
|
const [trigerFilter, setTrigerFilter] = useState(false);
|
||||||
|
const [alarmsData] = useState(initialAlarmsData);
|
||||||
|
|
||||||
|
const defaultFilter = { search: '' };
|
||||||
|
const [formDataFilter, setFormDataFilter] = useState(defaultFilter);
|
||||||
|
const [searchValue, setSearchValue] = useState('');
|
||||||
|
|
||||||
|
const navigate = useNavigate();
|
||||||
|
|
||||||
|
// Dummy data function to simulate API call
|
||||||
|
const getAllEventAlarm = async (params) => {
|
||||||
|
// Simulate API delay
|
||||||
|
await new Promise((resolve) => setTimeout(resolve, 300));
|
||||||
|
|
||||||
|
// Extract URLSearchParams
|
||||||
|
const searchParam = params.get('search') || '';
|
||||||
|
const page = parseInt(params.get('page')) || 1;
|
||||||
|
const limit = parseInt(params.get('limit')) || 10;
|
||||||
|
|
||||||
|
console.log('getAllEventAlarm called with:', { searchParam, page, limit });
|
||||||
|
|
||||||
|
// Filter by search
|
||||||
|
let filteredAlarms = alarmsData;
|
||||||
|
if (searchParam) {
|
||||||
|
const searchLower = searchParam.toLowerCase();
|
||||||
|
filteredAlarms = alarmsData.filter(
|
||||||
|
(alarm) =>
|
||||||
|
alarm.tanggal.toLowerCase().includes(searchLower) ||
|
||||||
|
alarm.plant_sub_section.toLowerCase().includes(searchLower) ||
|
||||||
|
alarm.device.toLowerCase().includes(searchLower) ||
|
||||||
|
alarm.tag.toLowerCase().includes(searchLower) ||
|
||||||
|
alarm.engineer.toLowerCase().includes(searchLower)
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Pagination logic
|
||||||
|
const totalData = filteredAlarms.length;
|
||||||
|
const totalPages = Math.ceil(totalData / limit);
|
||||||
|
const startIndex = (page - 1) * limit;
|
||||||
|
const endIndex = startIndex + limit;
|
||||||
|
const paginatedData = filteredAlarms.slice(startIndex, endIndex);
|
||||||
|
|
||||||
|
return {
|
||||||
|
status: 200,
|
||||||
|
statusCode: 200,
|
||||||
|
data: {
|
||||||
|
data: paginatedData,
|
||||||
|
total: totalData,
|
||||||
|
paging: {
|
||||||
|
page: page,
|
||||||
|
limit: limit,
|
||||||
|
total: totalData,
|
||||||
|
page_total: totalPages,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
};
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
const token = localStorage.getItem('token');
|
||||||
|
if (token) {
|
||||||
|
if (props.actionMode == 'list') {
|
||||||
|
setFormDataFilter(defaultFilter);
|
||||||
|
doFilter();
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
navigate('/signin');
|
||||||
|
}
|
||||||
|
}, [props.actionMode, alarmsData]);
|
||||||
|
|
||||||
|
const doFilter = () => {
|
||||||
|
setTrigerFilter((prev) => !prev);
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleSearch = () => {
|
||||||
|
setFormDataFilter({ search: searchValue });
|
||||||
|
setTrigerFilter((prev) => !prev);
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleSearchClear = () => {
|
||||||
|
setSearchValue('');
|
||||||
|
setFormDataFilter({ search: '' });
|
||||||
|
setTrigerFilter((prev) => !prev);
|
||||||
|
};
|
||||||
|
|
||||||
|
return (
|
||||||
|
<React.Fragment>
|
||||||
|
<Card>
|
||||||
|
<Row>
|
||||||
|
<Col xs={24}>
|
||||||
|
<Row justify="space-between" align="middle" gutter={[8, 8]}>
|
||||||
|
<Col xs={24} sm={24} md={12} lg={12}>
|
||||||
|
<Input.Search
|
||||||
|
placeholder="Search alarm by tanggal, plant, device, tag, engineer..."
|
||||||
|
value={searchValue}
|
||||||
|
onChange={(e) => {
|
||||||
|
const value = e.target.value;
|
||||||
|
setSearchValue(value);
|
||||||
|
// Auto search when clearing by backspace/delete
|
||||||
|
if (value === '') {
|
||||||
|
setFormDataFilter({ search: '' });
|
||||||
|
setTrigerFilter((prev) => !prev);
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
onSearch={handleSearch}
|
||||||
|
allowClear={{
|
||||||
|
clearIcon: <span onClick={handleSearchClear}>✕</span>,
|
||||||
|
}}
|
||||||
|
enterButton={
|
||||||
|
<Button
|
||||||
|
type="primary"
|
||||||
|
icon={<SearchOutlined />}
|
||||||
|
style={{
|
||||||
|
backgroundColor: '#23A55A',
|
||||||
|
borderColor: '#23A55A',
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
Search
|
||||||
|
</Button>
|
||||||
|
}
|
||||||
|
size="large"
|
||||||
|
/>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
</Col>
|
||||||
|
<Col xs={24} sm={24} md={24} lg={24} xl={24} style={{ marginTop: '16px' }}>
|
||||||
|
<TableList
|
||||||
|
getData={getAllEventAlarm}
|
||||||
|
queryParams={formDataFilter}
|
||||||
|
columns={columns}
|
||||||
|
triger={trigerFilter}
|
||||||
|
/>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
</Card>
|
||||||
|
</React.Fragment>
|
||||||
|
);
|
||||||
|
});
|
||||||
|
|
||||||
|
export default ListEventAlarm;
|
||||||
Reference in New Issue
Block a user