68 lines
1.4 KiB
JavaScript
68 lines
1.4 KiB
JavaScript
import Alert from 'Elements/Alert';
|
|
import Table from 'Elements/Table';
|
|
import { toJS } from 'mobx';
|
|
import { observer } from 'mobx-react-lite';
|
|
import { useStore } from 'stores/hooks';
|
|
import styled from 'styled-components';
|
|
import { Flex } from 'UIKit/grid';
|
|
import { columns } from './config';
|
|
|
|
const Grid = styled(Flex)`
|
|
flex-direction: column;
|
|
`;
|
|
|
|
const Validation = observer(() => {
|
|
const store = useStore();
|
|
|
|
const messages = store.$tables.fingap.validation.getMessages();
|
|
|
|
if (messages?.length) {
|
|
return <Alert type="error" banner message={messages[0]} />;
|
|
}
|
|
|
|
return null;
|
|
});
|
|
|
|
const FinGAPTable = observer(() => {
|
|
const { $tables } = useStore();
|
|
const { fingap } = $tables;
|
|
|
|
const dataSource = toJS(fingap.risks);
|
|
const selectedRowKeys = [...toJS(fingap.selectedKeys)];
|
|
|
|
return (
|
|
<Table
|
|
columns={columns}
|
|
dataSource={dataSource}
|
|
rowSelection={{
|
|
type: 'checkbox',
|
|
onChange: (_, selectedRows) => {
|
|
const selectedKeys = selectedRows.reduce((acc, row) => {
|
|
acc.push(row.key);
|
|
if (row.keys) return [...acc, ...row.keys];
|
|
|
|
return acc;
|
|
}, []);
|
|
|
|
fingap.setSelectedKeys(selectedKeys);
|
|
},
|
|
selectedRowKeys,
|
|
}}
|
|
pagination={false}
|
|
size="small"
|
|
scroll={{
|
|
x: true,
|
|
}}
|
|
/>
|
|
);
|
|
});
|
|
|
|
export default function () {
|
|
return (
|
|
<Grid>
|
|
<Validation />
|
|
<FinGAPTable />
|
|
</Grid>
|
|
);
|
|
}
|