asb_cloud_front/src/pages/WellOperations/WellDrillParams.jsx

import { useState, useEffect, useCallback, memo } from 'react'

import {
    EditableTable,
    makeSelectColumn,
    makeActionHandler,
    makeNumericAvgRange,
} from '@components/Table'
import LoaderPortal from '@components/LoaderPortal'
import { invokeWebApiWrapperAsync } from '@components/factory'
import { DrillParamsService, WellOperationService } from '@api'
import { hasPermission } from '@utils/permissions'
import { arrayOrDefault } from '@utils'

export const getColumns = async (idWell) => {
    let sectionTypes = await WellOperationService.getSectionTypes(idWell)
    sectionTypes = Object.keys(sectionTypes).map((id) => ({
        label: sectionTypes[id],
        value: id,
    }))

    return [
        makeSelectColumn('Конструкция секции','idWellSectionType', sectionTypes, null, {
            editable: true,
            width: 160,
        }),
        makeNumericAvgRange('Нагрузка, т', 'axialLoad', 1),
        makeNumericAvgRange('Давление, атм', 'pressure', 1),
        makeNumericAvgRange('Момент на ВСП, кН·м', 'rotorTorque', 1),
        makeNumericAvgRange('Обороты на ВСП, об/мин', 'rotorSpeed', 1),
        makeNumericAvgRange('Расход, л/с', 'flow', 1),
    ]
}

export const WellDrillParams = memo(({ idWell }) => {
    const [params, setParams] = useState([])
    const [showLoader, setShowLoader] = useState(false)
    const [columns, setColumns] = useState([])

    const updateParams = useCallback(async () => await invokeWebApiWrapperAsync(
        async () => {
            const params = arrayOrDefault(await DrillParamsService.getAll(idWell))
            // Typescript против использования числа в качестве типа значения select
            params.forEach((param) => param.idWellSectionType = `${param.idWellSectionType}`)
            setParams(params)
        },
        setShowLoader,
        'Не удалось загрузить список режимов бурения скважины',
        'Получение списка режимов бурения скважины'
    ), [idWell])

    useEffect(() => (async () => {
        setColumns(await getColumns(idWell))
        await updateParams()
    })(), [idWell, updateParams])

    const handlerProps = {
        service: DrillParamsService,
        setLoader: setShowLoader,
        errorMsg: `Не удалось выполнить операцию`,
        onComplete: updateParams,
        idWell
    }

    const recordParser = (record) => ({ ...record, idWell })

    return (
        <LoaderPortal show={showLoader}>
            <EditableTable
                size={'small'}
                bordered
                columns={columns}
                dataSource={params}
                tableName={'well_drill_params'}
                onRowAdd={hasPermission('DrillParams.edit') && makeActionHandler('insert', handlerProps, recordParser, 'Добавление режима бурения')}
                onRowEdit={hasPermission('DrillParams.edit') && makeActionHandler('update', handlerProps, recordParser, 'Редактирование режима бурения')}
                onRowDelete={hasPermission('DrillParams.delete') && makeActionHandler('delete', handlerProps, recordParser, 'Удаление режима бурения')}
                pagination={false}
            />
        </LoaderPortal>
    )
})

export default WellDrillParams