Добавлены стольцы с нарастающим таймингом на план и факт

src/pages/WellOperations/Tvd/NptTable.jsx

@@ -6,6 +6,8 @@ import LoaderPortal from '@components/LoaderPortal'
 import { invokeWebApiWrapperAsync } from '@components/factory'
 import { makeDateColumn, makeNumericColumn, makeTextColumn, Table } from '@components/Table'
 
+import '@styles/tvd.less'
+
 export const columns = [
     makeTextColumn('Конструкция секции', 'wellSectionTypeName', null, null, null, { width: 140 }),
     makeNumericColumn('Глубина', 'depth', null, null, null, 80),

src/pages/WellOperations/WellOperationsEditor.jsx

@@ -10,6 +10,10 @@ import {
   makeSelectColumn,
   makeActionHandler,
   makeDateColumn,
+  makeNumericColumn,
+  makeNumericRender,
+  makeNumericSorter,
+  makeTextColumn,
 } from '@components/Table'
 import LoaderPortal from '@components/LoaderPortal'
 import { invokeWebApiWrapperAsync } from '@components/factory'
@@ -20,6 +24,8 @@ import { WellOperationService } from '@api'
 const { TextArea } = Input
 
 const basePageSize = 160
+const dayRender = makeNumericRender(2)
+const dayWithoutNptRender = (_, row) => dayRender((row.day ?? 0) - (row.nptHours ?? 0) / 24)
 
 const defaultColumns = [
   makeSelectColumn('Конструкция секции', 'idWellSectionType', [], undefined, {
@@ -34,19 +40,20 @@ const defaultColumns = [
     })],
   }),
   makeSelectColumn('Операция', 'idCategory', [], undefined, { editable: true, width: 200 }),
-  makeColumn('Доп. инфо', 'categoryInfo', { editable: true, width: 300, input: <TextArea/> }),
+  makeTextColumn('Доп. инфо', 'categoryInfo', null, null, null, { editable: true, width: 300, input: <TextArea/> }),
   makeColumn('Глубина забоя на начало, м', 'depthStart', makeNumericColumnOptions(2, 'depthStart')),
   makeColumn('Глубина забоя при завершении, м', 'depthEnd', makeNumericColumnOptions(2, 'depthEnd')),
   makeDateColumn('Время начала', 'dateStart', undefined, undefined, {
     editable: true,
-    width: 200,
+    width: 170,
     initialValue: moment().format(),
   }),
-  makeColumn('Часы', 'durationHours', makeNumericColumnOptions(2, 'durationHours')),
+  makeNumericColumn('День', 'day', null, null, dayRender, 80),
-  makeColumn('Комментарий', 'comment', { editable: true, input: <TextArea/> }),
+  makeColumn('Часы', 'durationHours', { ...makeNumericColumnOptions(2, 'durationHours'), width: 70 }),
+  makeTextColumn('Комментарий', 'comment', null, null, null, { editable: true, input: <TextArea/> }),
 ]
 
-export const WellOperationsEditor = memo(({ idWell, idType, ...other }) => {
+export const WellOperationsEditor = memo(({ idWell, idType, showNpt, ...other }) => {
   const [pageNumAndPageSize, setPageNumAndPageSize] = useState({ current: 1, pageSize: basePageSize })
   const [paginationTotal, setPaginationTotal] = useState(0)
   const [operations, setOperations] = useState([])
@@ -59,6 +66,10 @@ export const WellOperationsEditor = memo(({ idWell, idType, ...other }) => {
     return arrayOrDefault(query.get('selectedId')?.split(',')?.map(parseInt))
   }, [location])
 
+  // useEffect(() => {
+  //   setColumns((preColumns) => preColumns.find(()))
+  // }, [showNpt])
+
   useEffect(() => invokeWebApiWrapperAsync(
     async () => {
       let categories = arrayOrDefault(await WellOperationService.getCategories(idWell))
@@ -68,8 +79,16 @@ export const WellOperationsEditor = memo(({ idWell, idType, ...other }) => {
       sectionTypes = Object.entries(sectionTypes).map(([id, label]) => ({ value: parseInt(id), label }))
 
       setColumns(preColumns => [
-        makeSelectColumn('Конструкция секции', 'idWellSectionType', sectionTypes, undefined, { editable: true, width: 160 }),
+        makeSelectColumn('Конструкция секции', 'idWellSectionType', sectionTypes, undefined, {
-        makeSelectColumn('Операция', 'idCategory', categories, undefined, { editable: true, width: 200 }),
+          editable: true,
+          width: 160,
+          sorter: makeNumericSorter('idWellSectionType'),
+        }),
+        makeSelectColumn('Операция', 'idCategory', categories, undefined, {
+          editable: true,
+          width: 200,
+          sorter: makeNumericSorter('idCategory'),
+        }),
         ...preColumns.slice(2),
       ])
     },
@@ -78,7 +97,26 @@ export const WellOperationsEditor = memo(({ idWell, idType, ...other }) => {
     'Получение списка операций по скважине'
   ), [idWell])
 
-  const updateOperations = () => invokeWebApiWrapperAsync(
+  useEffect(() => invokeWebApiWrapperAsync(
+    async() => {
+      setColumns((preColumns) => {
+        if (!!preColumns.find((col) => col.key === 'dayWithoutNpt') === showNpt)
+          return preColumns
+        const newColumns = preColumns.slice(0, 7)
+        if (showNpt)
+          newColumns.push(
+            makeNumericColumn('День без НПВ', 'dayWithoutNpt', null, null, dayWithoutNptRender, 80),
+            ...preColumns.slice(7)
+          )
+        else newColumns.push(...preColumns.slice(8))
+        return newColumns
+      })
+    },
+    setShowLoader,
+    'Не удалось добавить стоблец "День без НПВ"'
+  ), [showNpt])
+
+  const updateOperations = useCallback(() => invokeWebApiWrapperAsync(
     async () => {
       const skip = ((pageNumAndPageSize.current - 1) * pageNumAndPageSize.pageSize) || 0
       const take = pageNumAndPageSize.pageSize
@@ -93,9 +131,9 @@ export const WellOperationsEditor = memo(({ idWell, idType, ...other }) => {
     setShowLoader,
     'Не удалось загрузить список операций по скважине',
     'Получение списка операций по скважине'
-  )
+  ), [idWell, idType, pageNumAndPageSize])
 
-  useEffect(updateOperations, [idWell, idType, pageNumAndPageSize])
+  useEffect(updateOperations, [updateOperations])
 
   const handlerProps = {
     service: WellOperationService,

src/pages/WellOperations/index.jsx

@@ -59,7 +59,7 @@ export const WellOperations = memo(({ idWell }) => {
               <WellOperationsEditor idWell={idWell} idType={0} tableName={'well_operations_plan'}/>
             </PrivateRoute>
             <PrivateRoute path={`${rootPath}/fact`}>
-              <WellOperationsEditor idWell={idWell} idType={1} tableName={'well_operations_fact'}/>
+              <WellOperationsEditor idWell={idWell} idType={1} showNpt tableName={'well_operations_fact'}/>
             </PrivateRoute>
             <PrivateRoute path={`${rootPath}/drillProcessFlow`}>
               <DrillProcessFlow idWell={idWell} />