asb_cloud_front/src/pages/AdminPanel/ClusterController.jsx
2022-03-03 19:34:22 +05:00

90 lines
3.4 KiB
JavaScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

import { memo, useCallback, useEffect, useState } from 'react'
import {
EditableTable,
makeColumn,
makeSelectColumn,
makeActionHandler,
makeStringSorter,
defaultPagination,
makeTimezoneColumn
} from '@components/Table'
import LoaderPortal from '@components/LoaderPortal'
import { invokeWebApiWrapperAsync } from '@components/factory'
import { AdminClusterService, AdminDepositService } from '@api'
import { arrayOrDefault } from '@utils'
import { min1 } from '@utils/validationRules'
import { hasPermission } from '@utils/permissions'
import { coordsFixed } from './DepositController'
export const ClusterController = memo(() => {
const [deposits, setDeposits] = useState([])
const [clusters, setClusters] = useState([])
const [showLoader, setShowLoader] = useState(false)
const clusterColumns = [
makeSelectColumn('Месторождение', 'idDeposit', deposits, '--', {
width: 200,
editable: true,
sorter: makeStringSorter('idDeposit')
}),
makeColumn('Название', 'caption', {
width: 200,
editable: true,
sorter: makeStringSorter('caption'),
formItemRules: min1,
}),
makeColumn('Широта', 'latitude', { width: 150, editable: true, render: coordsFixed }),
makeColumn('Долгота', 'longitude', { width: 150, editable: true, render: coordsFixed }),
makeTimezoneColumn('Зона', 'timezone', null, true, { width: 150 }),
]
const updateTable = useCallback(() => invokeWebApiWrapperAsync(
async () => {
const clusters = await AdminClusterService.getAll()
setClusters(arrayOrDefault(clusters))
},
setShowLoader,
`Не удалось загрузить список кустов`,
'Получение списка кустов'
), [])
useEffect(() => invokeWebApiWrapperAsync(
async () => {
let deposits = arrayOrDefault(await AdminDepositService.getAll())
deposits = deposits.map((deposit) => ({ value: deposit.id, label: deposit.caption }))
setDeposits(deposits)
},
setShowLoader,
`Не удалось загрузить список месторождений`,
'Получение списка месторождений'
), [])
useEffect(updateTable, [updateTable])
const handlerProps = {
service: AdminClusterService,
setLoader: setShowLoader,
errorMsg: `Не удалось выполнить операцию`,
onComplete: updateTable,
}
return (
<LoaderPortal show={showLoader}>
<EditableTable
size={'small'}
bordered
dataSource={clusters}
columns={clusterColumns}
pagination={defaultPagination}
onRowAdd={hasPermission('AdminCluster.edit') && makeActionHandler('insert', handlerProps, null, 'Добавление куста')}
onRowEdit={hasPermission('AdminCluster.edit') && makeActionHandler('update', handlerProps, null, 'Редактирование куста')}
onRowDelete={hasPermission('AdminCluster.delete') && makeActionHandler('delete', handlerProps, null, 'Удаление куста')}
/>
</LoaderPortal>
)
})
export default ClusterController