Исправлена ошибка отображения конструкции секции при создании комп. скв.

src/pages/Analytics/WellCompositeEditor/NewParamsTable.jsx

@@ -0,0 +1,79 @@
+import { memo, useCallback, useEffect, useState } from 'react'
+import { Button, Modal, Popconfirm } from 'antd'
+
+import { Table } from '@components/Table'
+import LoaderPortal from '@components/LoaderPortal'
+import { invokeWebApiWrapperAsync } from '@components/factory'
+import { DrillParamsService } from '@api'
+
+import { getColumns } from '@pages/WellOperations/WellDrillParams'
+
+export const NewParamsTable = memo(({ idWell, selectedWellsKeys }) => {
+    const [params, setParams] = useState([])
+    const [paramsColumns, setParamsColumns] = useState([])
+    const [showParamsLoader, setShowParamsLoader] = useState(false)
+    const [isParamsModalVisible, setIsParamsModalVisible] = useState(false)
+
+    useEffect(() => invokeWebApiWrapperAsync(
+        async () => setParamsColumns(await getColumns(idWell))
+    ), [idWell])
+
+    useEffect(() => console.log(paramsColumns), [paramsColumns])
+
+    const onParamButtonClick = useCallback(() => invokeWebApiWrapperAsync(
+      async () => {
+        setIsParamsModalVisible(true)
+        const params = await DrillParamsService.getCompositeAll(idWell)
+        setParams(params)
+      },
+      setShowParamsLoader,
+      `Не удалось загрузить список режимов для скважины "${idWell}"`,
+      'Получение списка режимов скважины'
+    ), [idWell])
+
+    const onParamsAddClick = useCallback(() => invokeWebApiWrapperAsync(
+      async () => {
+        await DrillParamsService.save(idWell, params)
+        setIsParamsModalVisible(false)
+      },
+      setShowParamsLoader,
+      `Не удалось добавить режимы в список скважины "${idWell}"`,
+      'Добавление режима скважины'
+    ), [idWell, params])
+
+    return (
+        <>
+            <Button
+                size={'large'}
+                disabled={selectedWellsKeys.length <= 0}
+                onClick={onParamButtonClick}
+            >
+                Заполнить режимы текущей скважины
+            </Button>
+            <Modal
+                title={'Заполнить режимы текущей скважины'}
+                centered
+                visible={isParamsModalVisible}
+                onCancel={() => setIsParamsModalVisible(false)}
+                width={1700}
+                footer={(
+                    <Popconfirm title={'Заменить существующие режимы выбранными?'} onConfirm={onParamsAddClick}>
+                        <Button size={'large'} disabled={params.length <= 0}>Сохранить</Button>
+                    </Popconfirm>
+                )}
+            >
+                <LoaderPortal show={showParamsLoader}>
+                    <Table
+                        bordered
+                        size={'small'}
+                        columns={paramsColumns}
+                        dataSource={params}
+                        pagination={false}
+                    />
+                </LoaderPortal>
+            </Modal>
+        </>
+    )
+})
+
+export default NewParamsTable

src/pages/Analytics/WellCompositeEditor/WellCompositeSections.jsx

@@ -1,13 +1,13 @@
 import { Link, useLocation } from 'react-router-dom'
-import { useState, useEffect, memo, useCallback, useMemo } from 'react'
+import { useState, useEffect, memo, useMemo } from 'react'
 import { LineChartOutlined, ProfileOutlined } from '@ant-design/icons'
-import { Table, Tag, Button, Badge, Divider, Modal, Row, Col, Popconfirm } from 'antd'
+import { Table, Tag, Button, Badge, Divider, Modal, Row, Col } from 'antd'
 
 import { CompanyView } from '@components/views'
 import LoaderPortal from '@components/LoaderPortal'
 import { invokeWebApiWrapperAsync } from '@components/factory'
 import { makeTextColumn, makeNumericColumnPlanFact } from '@components/Table'
-import { DrillParamsService, WellCompositeService } from '@api'
+import { WellCompositeService } from '@api'
 import { hasPermission } from '@utils/permissions'
 import {
   calcAndUpdateStatsBySections,
@@ -16,9 +16,8 @@ import {
 } from '@utils/functions'
 
 import { Tvd } from '@pages/WellOperations/Tvd'
-import { getColumns } from '@pages/WellOperations/WellDrillParams'
 import WellOperationsTable from '@pages/Cluster/WellOperationsTable'
-
+import NewParamsTable from './NewParamsTable'
 
 const filtersMinMax = [
   { text: 'min', value: 'min' },
@@ -31,17 +30,13 @@ const filtersSectionsType = []
 const DAY_IN_MS = 1000 * 60 * 60 * 24
 
 export const WellCompositeSections = memo(({ idWell, statsWells, selectedSections }) => {
-  const [params, setParams] = useState([])
   const [selectedWells, setSelectedWells] = useState([])
   const [wellOperations, setWellOperations] = useState([])
   const [selectedWellsKeys, setSelectedWellsKeys] = useState([])
   const [selectedWellId, setSelectedWellId] = useState(0)
   const [showLoader, setShowLoader] = useState(false)
-  const [showParamsLoader, setShowParamsLoader] = useState(false)
   const [isTVDModalVisible, setIsTVDModalVisible] = useState(false)
   const [isOpsModalVisible, setIsOpsModalVisible] = useState(false)
-  const [isParamsModalVisible, setIsParamsModalVisible] = useState(false)
-  const [paramsColumns, setParamsColumns] = useState([])
 
   const location = useLocation()
 
@@ -103,10 +98,6 @@ export const WellCompositeSections = memo(({ idWell, statsWells, selectedSection
     return rows
   }, [statsWells])
 
-  useEffect(() => invokeWebApiWrapperAsync(
-    async () => setParamsColumns(await getColumns(idWell))
-  ), [idWell])
-
   useEffect(() => {
     if (isOpsModalVisible || selectedWellId <= 0) return
     invokeWebApiWrapperAsync(
@@ -128,6 +119,22 @@ export const WellCompositeSections = memo(({ idWell, statsWells, selectedSection
     setSelectedWellsKeys(selected.map((row) => row.key))
   }, [rows, selectedSections])
 
+  const rowSelection = useMemo(() => hasPermission('WellOperation.edit') && {
+    selectedRowKeys: selectedWellsKeys,
+    onChange: (keys, items) => invokeWebApiWrapperAsync(
+        async () => {
+            const selectedSections = items.map((row) => ({idWell, idWellSrc: row.id, idWellSectionType: row.sectionId}))
+            await WellCompositeService.save(idWell, selectedSections)
+
+            setSelectedWells(items)
+            setSelectedWellsKeys(keys)
+        },
+        setShowLoader,
+        `Не удалось сохранить изменения выбранных секций для композитной скважины "${idWell}"`,
+        'Изменение выбранных секций скважины'
+    )
+  }, [idWell, selectedWellsKeys])
+
   const columns = useMemo(() => [
     makeTextColumn('скв №', 'caption', null, null,
       (text, item) => <Link to={{ pathname: `/well/${item?.id}`, state: { from: location.pathname }}}>{text ?? '-'}</Link>
@@ -176,43 +183,6 @@ export const WellCompositeSections = memo(({ idWell, statsWells, selectedSection
     },
   ], [location.pathname])
 
-  const rowSelection = useMemo(() => hasPermission('WellOperation.edit') && {
-    selectedRowKeys: selectedWellsKeys,
-    onChange: (keys, items) => invokeWebApiWrapperAsync(
-      async () => {
-        const selectedSections = items.map((row) => ({idWell, idWellSrc: row.id, idWellSectionType: row.sectionId}))
-        await WellCompositeService.save(idWell, selectedSections)
-
-        setSelectedWells(items)
-        setSelectedWellsKeys(keys)
-      },
-      setShowParamsLoader,
-      `Не удалось сохранить изменения выбранных секций для композитной скважины "${idWell}"`,
-      'Изменение выбранных секций скважины'
-    )
-  }, [idWell, selectedWellsKeys])
-
-  const onParamButtonClick = useCallback(() => invokeWebApiWrapperAsync(
-    async () => {
-      setIsParamsModalVisible(true)
-      const params = await DrillParamsService.getCompositeAll(idWell)
-      setParams(params)
-    },
-    setShowParamsLoader,
-    `Не удалось загрузить список режимов для скважины "${idWell}"`,
-    'Получение списка режимов скважины'
-  ), [idWell])
-
-  const onParamsAddClick = useCallback(() => invokeWebApiWrapperAsync(
-    async () => {
-      await DrillParamsService.save(idWell, params)
-      setIsParamsModalVisible(false)
-    },
-    setShowLoader,
-    `Не удалось добавить режимы в список скважины "${idWell}"`,
-    'Добавление режима скважины'
-  ), [idWell, params])
-
   return (
     <>
       <Table
@@ -239,13 +209,7 @@ export const WellCompositeSections = memo(({ idWell, statsWells, selectedSection
       />
       <Row justify={'end'} style={{ margin: '1rem 0' }}>
         <Col>
-          <Button
-            size={'large'}
-            disabled={selectedWells.length <= 0}
-            onClick={onParamButtonClick}
-          >
-            Заполнить режимы текущей скважины
-          </Button>
+          <NewParamsTable idWell={idWell} selectedWellsKeys={selectedWellsKeys} />
         </Col>
       </Row>
 
@@ -272,29 +236,6 @@ export const WellCompositeSections = memo(({ idWell, statsWells, selectedSection
           <WellOperationsTable wellOperations={wellOperations} />
         </LoaderPortal>
       </Modal>
-
-      <Modal
-        title={'Заполнить режимы текущей скважины'}
-        centered
-        visible={isParamsModalVisible}
-        onCancel={() => setIsParamsModalVisible(false)}
-        width={1700}
-        footer={(
-          <Popconfirm title={'Заменить существующие режимы выбранными?'} onConfirm={onParamsAddClick}>
-            <Button size={'large'} disabled={params.length <= 0}>Сохранить</Button>
-          </Popconfirm>
-        )}
-      >
-        <LoaderPortal show={showParamsLoader}>
-          <Table
-            size={'small'}
-            bordered
-            columns={paramsColumns}
-            dataSource={params}
-            pagination={false}
-          />
-        </LoaderPortal>
-      </Modal>
     </>
   )
 })

src/pages/WellOperations/WellDrillParams.jsx

@@ -5,6 +5,7 @@ import {
     makeSelectColumn,
     makeActionHandler,
     makeNumericAvgRange,
+    makeNumericSorter,
 } from '@components/Table'
 import LoaderPortal from '@components/LoaderPortal'
 import { invokeWebApiWrapperAsync } from '@components/factory'
@@ -14,15 +15,16 @@ 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,
+    sectionTypes = Object.entries(sectionTypes).map(([id, value]) => ({
+        label: value,
+        value: parseInt(id),
     }))
 
     return [
         makeSelectColumn('Конструкция секции','idWellSectionType', sectionTypes, null, {
             editable: true,
             width: 160,
+            sorter: makeNumericSorter('idWellSectionType'),
         }),
         makeNumericAvgRange('Нагрузка, т', 'axialLoad', 1),
         makeNumericAvgRange('Давление, атм', 'pressure', 1),