asb_cloud_front/src/pages/Measure/InclinometryTable.jsx

51 lines
1.4 KiB
JavaScript

import React, { useEffect, useState } from 'react'
import { Modal } from 'antd'
import { Table } from '../../components/Table'
import { formatDate } from './MeasureTable'
import { v } from './columnsCommon'
export const InclinometryTable = React.memo(({ group, visible, onClose }) => {
const [tableColumns, setTableColumns] = useState([])
const [tableData, setTableData] = useState([])
useEffect(() => {
setTableColumns([{
title: 'Дата',
key: 'date',
dataIndex: 'date',
render: (item) => formatDate(item),
fixed: 'left',
width: '8rem',
},
...(group?.columns?.map((column) => ({...column, title: v(column.title)})) ?? [])
])
}, [group?.columns])
useEffect(() => {
setTableData(group?.values?.map(row => ({ date: row.timestamp, ...row.data })))
}, [group?.values])
return !group?.columns ? null : (
<Modal
title={group?.title}
centered
visible={visible}
onCancel={onClose}
width={1900}
footer={null}
>
<Table
dataSource={tableData}
columns={tableColumns}
scroll={{
y: 400,
x: 1300
}}
bordered
/>
</Modal>
)
})
export default InclinometryTable