forked from ddrilling/asb_cloud_front
109 lines
3.6 KiB
JavaScript
109 lines
3.6 KiB
JavaScript
import { Button, Layout } from 'antd'
|
||
import { FileWordOutlined } from '@ant-design/icons'
|
||
import { memo, useCallback, useEffect, useState } from 'react'
|
||
|
||
import { Flex } from '@components/Grid'
|
||
import LoaderPortal from '@components/LoaderPortal'
|
||
import { invokeWebApiWrapperAsync } from '@components/factory'
|
||
import { arrayOrDefault, formatDate } from '@utils'
|
||
import { DrillingProgramService } from '@api'
|
||
|
||
import CategoryAdder from './CategoryAdder'
|
||
import CategoryRender from './CategoryRender'
|
||
import CategoryEditor from './CategoryEditor'
|
||
import CategoryHistory from './CategoryHistory'
|
||
|
||
import '@styles/drilling_program.less'
|
||
|
||
export const DrillingProgram = memo(({ idWell }) => {
|
||
const [selectedCategory, setSelectedCategory] = useState()
|
||
const [historyVisible, setHistoryVisible] = useState(false)
|
||
const [editorVisible, setEditorVisible] = useState(false)
|
||
const [showLoader, setShowLoader] = useState(false)
|
||
const [categories, setCategories] = useState([])
|
||
const [data, setData] = useState({})
|
||
|
||
const updateData = useCallback(async () => await invokeWebApiWrapperAsync(
|
||
async () => {
|
||
const data = await DrillingProgramService.getState(idWell)
|
||
const categories = arrayOrDefault(await DrillingProgramService.getCategories(idWell))
|
||
setData(data)
|
||
setCategories(categories.filter(cat => {
|
||
if (cat?.id && (cat.name || cat.shortName))
|
||
if (data?.parts.findIndex((val) => val.idFileCategory === cat.id) < 0)
|
||
return true
|
||
return false
|
||
}))
|
||
},
|
||
setShowLoader,
|
||
`Не удалось загрузить название скважины "${idWell}"`
|
||
), [idWell])
|
||
|
||
useEffect(() => updateData(), [updateData])
|
||
|
||
const onCategoryEdit = (catId) => {
|
||
setSelectedCategory(catId)
|
||
setEditorVisible(!!catId)
|
||
}
|
||
|
||
const onCategoryHistory = (catId) => {
|
||
setSelectedCategory(catId)
|
||
setHistoryVisible(!!catId)
|
||
}
|
||
|
||
const onEditorClosed = useCallback(() => {
|
||
setEditorVisible(false)
|
||
updateData()
|
||
}, [updateData])
|
||
|
||
return (
|
||
<LoaderPortal show={showLoader}>
|
||
<Layout>
|
||
{data && (
|
||
<div style={{ border: '1px solid #BEBEBE' }}>
|
||
<div style={{ padding: '5px 10px', backgroundColor: '#F3F3F3', borderBottom: '1px solid #BEBEBE' }}>Программа бурения</div>
|
||
<Flex style={{ justifyContent: 'flex-start', alignItems: 'center', backgroundColor: 'white' }}>
|
||
<Button type={'link'} icon={<FileWordOutlined />} style={{ marginLeft: '10px' }}>{data.name}</Button>
|
||
<div style={{ margin: '10px' }}>Размер: {data.size}</div>
|
||
<div style={{ margin: '10px' }}>Загружен: {formatDate(data.uploadDate)}</div>
|
||
</Flex>
|
||
</div>
|
||
)}
|
||
|
||
{data?.parts?.map?.((part, idx) => part && (
|
||
<CategoryRender
|
||
key={`${idx}`}
|
||
idWell={idWell}
|
||
partData={part}
|
||
onEdit={onCategoryEdit}
|
||
onUpdate={updateData}
|
||
onHistory={onCategoryHistory}
|
||
/>
|
||
))}
|
||
|
||
<CategoryAdder
|
||
idWell={idWell}
|
||
categories={categories}
|
||
onUpdate={updateData}
|
||
/>
|
||
|
||
<CategoryEditor
|
||
idWell={idWell}
|
||
visible={editorVisible}
|
||
onClosed={onEditorClosed}
|
||
category={data?.parts?.find((part) => part.idFileCategory === selectedCategory) ?? {}}
|
||
/>
|
||
|
||
<CategoryHistory
|
||
idWell={idWell}
|
||
idCategory={selectedCategory}
|
||
onClose={() => setHistoryVisible(false)}
|
||
visible={historyVisible}
|
||
/>
|
||
</Layout>
|
||
</LoaderPortal>
|
||
)
|
||
})
|
||
|
||
export default DrillingProgram
|