ia.novokshanov/asb_cloud_front
1
0
Fork 0
forked from ddrilling/asb_cloud_front
Code Issues Pull Requests Packages Projects Releases Wiki Activity

* Изменена сигнатура функций makeNumericColumn и её обёрток

Browse Source 
* Улучшено отображение некоторых элементов
This commit is contained in:
Александр Сироткин 2022-12-13 18:28:30 +05:00
parent d235b01c80
commit f4adb528ca
37 changed files with 247 additions and 283 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
.vscode/settings.json vendored
View File

@ -1,6 +1,14 @@
{
"cSpell.words": [
"день"
"день",
"КНБК",
"САУБ",
"antd",
"Poprompt",
"saub",
"setpoint",
"Setpoints",
"usehooks"
],
"liveServer.settings.port": 5501
}

1
src/components/Table/Columns/date.tsx
View File

@ -24,6 +24,7 @@ export const makeDateColumn = <T extends unknown>(
other?: ColumnProps<T>,
pickerOther?: DatePickerWrapperProps,
) => makeColumn<T>(title, key, {
editable: true,
...other,
render: (date) => (
<div className={'text-align-r-container'}>

2
src/components/Table/Columns/index.ts
View File

@ -9,7 +9,6 @@ import { OmitExtends } from '@utils/types'
export * from './date'
export * from './time'
export * from './numeric'
export * from './plan_fact'
export * from './select'
export * from './tag'
export * from './text'
@ -45,6 +44,7 @@ export const makeColumn = <T = any>(title: ReactNode, key: Key, other?: ColumnPr
title: title,
key: key,
dataIndex: key,
render: (value: T) => value,
...other,
})

68
src/components/Table/Columns/numeric.tsx
View File

@ -1,4 +1,3 @@
import { ColumnFilterItem } from 'antd/lib/table/interface'
import { InputNumber } from 'antd'
import { Key, ReactNode } from 'react'
@ -46,18 +45,17 @@ export const makeNumericColumnOptions = <T extends number>(fixed?: number, sorte
export const makeNumericColumn = <T extends number>(
title: ReactNode,
key: Key,
filters?: ColumnFilterItem[],
filterDelegate?: FilterGenerator<T>,
renderDelegate?: RenderMethod<T>,
filterDelegate?: FilterGenerator<T>,
width?: string | number,
other?: ColumnProps<T>,
) => makeColumn(title, key, {
filters,
editable: true,
onFilter: filterDelegate ? filterDelegate(key) : undefined,
sorter: makeNumericSorter(key),
width,
input: <InputNumber style={{ width: '100%' }}/>,
render: renderDelegate ?? makeNumericRender<T>(2),
input: <InputNumber style={{ width: '100%' }} defaultValue={0} />,
render: renderDelegate || makeNumericRender<T>(2),
align: 'right',
...other
})
@ -65,54 +63,78 @@ export const makeNumericColumn = <T extends number>(
export const makeNumericColumnPlanFact = <T extends number>(
title: ReactNode,
key: Key,
filters?: ColumnFilterItem[],
filterDelegate?: FilterGenerator<T>,
renderDelegate?: RenderMethod<T>,
filterDelegate?: FilterGenerator<T>,
width?: string | number,
other?: ColumnProps<T>,
) => {
return {
title,
children: [
makeNumericColumn<T>('План', `${key}.plan`, renderDelegate, filterDelegate, width, other),
makeNumericColumn<T>('Факт', `${key}.fact`, renderDelegate, filterDelegate, width, other),
]
}
}
/**
* @deprecated Для значений типа план/факт появилась модель `PlanFactDto`, использование 2 полей с суффиксами неактуально
* @param title Заголовок столбца
* @param key Ключ столбца
* @param filters Список значений для фильтрации
* @param filterDelegate Метод фильтрации
* @param renderDelegate Render-метод отображения ячейки
* @param width Ширина столбца
* @param other Дополнительные опции
* @returns Объект-столбец для таблицы
*/
export const makeNumericColumnPlanFactOld = <T extends number>(
title: ReactNode,
key: Key,
renderDelegate?: RenderMethod<T>,
filterDelegate?: FilterGenerator<T>,
width?: string | number,
other?: ColumnProps<T>,
) => makeGroupColumn(title, [
makeNumericColumn<T>('п', key + 'Plan', filters, filterDelegate, renderDelegate, width, other),
makeNumericColumn<T>('ф', key + 'Fact', filters, filterDelegate, renderDelegate, width, other),
makeNumericColumn<T>('План', key + 'Plan', renderDelegate, filterDelegate, width, other),
makeNumericColumn<T>('Факт', key + 'Fact', renderDelegate, filterDelegate, width, other),
])
export const makeNumericStartEnd = <T extends number>(
title: ReactNode,
key: Key,
fixed: number,
filters?: ColumnFilterItem[],
filterDelegate?: FilterGenerator<T>,
renderDelegate?: RenderMethod<T>,
filterDelegate?: FilterGenerator<T>,
width?: string | number,
) => makeGroupColumn(title, [
makeNumericColumn<T>('старт', key + 'Start', filters, filterDelegate, renderDelegate, width, makeNumericColumnOptions(fixed, key + 'Start')),
makeNumericColumn<T>('конец', key + 'End', filters, filterDelegate, renderDelegate, width, makeNumericColumnOptions(fixed, key + 'End'))
makeNumericColumn<T>('старт', key + 'Start', renderDelegate, filterDelegate, width, makeNumericColumnOptions(fixed, key + 'Start')),
makeNumericColumn<T>('конец', key + 'End', renderDelegate, filterDelegate, width, makeNumericColumnOptions(fixed, key + 'End'))
])
export const makeNumericMinMax = <T extends number>(
title: ReactNode,
key: Key,
fixed: number,
filters?: ColumnFilterItem[],
filterDelegate?: FilterGenerator<T>,
renderDelegate?: RenderMethod<T>,
filterDelegate?: FilterGenerator<T>,
width?: string | number,
) => makeGroupColumn(title, [
makeNumericColumn<T>('мин', key + 'Min', filters, filterDelegate, renderDelegate, width, makeNumericColumnOptions(fixed, key + 'Min')),
makeNumericColumn<T>('макс', key + 'Max', filters, filterDelegate, renderDelegate, width, makeNumericColumnOptions(fixed, key + 'Max')),
makeNumericColumn<T>('мин', key + 'Min', renderDelegate, filterDelegate, width, makeNumericColumnOptions(fixed, key + 'Min')),
makeNumericColumn<T>('макс', key + 'Max', renderDelegate, filterDelegate, width, makeNumericColumnOptions(fixed, key + 'Max')),
])
export const makeNumericAvgRange = <T extends number>(
title: ReactNode,
key: Key,
fixed: number,
filters?: ColumnFilterItem[],
filterDelegate?: FilterGenerator<T>,
renderDelegate?: RenderMethod<T>,
filterDelegate?: FilterGenerator<T>,
width?: string | number,
) => makeGroupColumn(title, [
makeNumericColumn<T>('мин', `${key}.min`, filters, filterDelegate, renderDelegate, width, makeNumericColumnOptions(fixed, `${key}.min`)),
makeNumericColumn<T>('сред', `${key}.avg`, filters, filterDelegate, renderDelegate, width, makeNumericColumnOptions(fixed, `${key}.avg`)),
makeNumericColumn<T>('макс', `${key}.max`, filters, filterDelegate, renderDelegate, width, makeNumericColumnOptions(fixed, `${key}.max`)),
makeNumericColumn<T>('мин', `${key}.min`, renderDelegate, filterDelegate, width, makeNumericColumnOptions(fixed, `${key}.min`)),
makeNumericColumn<T>('сред', `${key}.avg`, renderDelegate, filterDelegate, width, makeNumericColumnOptions(fixed, `${key}.avg`)),
makeNumericColumn<T>('макс', `${key}.max`, renderDelegate, filterDelegate, width, makeNumericColumnOptions(fixed, `${key}.max`)),
])
export default makeNumericColumn

22
src/components/Table/Columns/plan_fact.tsx
View File

@ -1,22 +0,0 @@
import { Key, ReactNode } from 'react'
import { ColumnProps, makeColumn } from '.'
export const makeColumnsPlanFact = <T,>(
title: string | ReactNode,
key: Key | [Key, Key],
columsOther?: ColumnProps<T> | [ColumnProps<T>, ColumnProps<T>],
) => {
const keys = Array.isArray(key) ? key : [`${key}Plan`, `${key}Fact`]
const others = Array.isArray(columsOther) ? columsOther : [columsOther, columsOther]
return {
title,
children: [
makeColumn<T>('план', keys[0], others[0]),
makeColumn<T>('факт', keys[1], others[1]),
]
}
}
export default makeColumnsPlanFact

15
src/components/Table/Columns/select.tsx
View File

@ -1,9 +1,17 @@
import { Select, SelectProps } from 'antd'
import { DefaultOptionType, SelectValue } from 'antd/lib/select'
import { Key, ReactNode } from 'react'
import { Key, ReactNode, useMemo } from 'react'
import { ColumnProps, makeColumn } from '.'
const findOption = <T extends DefaultOptionType>(value: any, options: T[] | undefined) =>
options?.find((option) => String(option?.value) === String(value))
const SelectWrapper = ({ value, options, ...other }: SelectProps) => {
const selectValue = useMemo(() => findOption(value, options)?.label, [value, options])
return <Select value={selectValue} options={options} {...other} />
}
export const makeSelectColumn = <T extends DefaultOptionType>(
title: ReactNode,
key: Key,
@ -12,10 +20,11 @@ export const makeSelectColumn = <T extends DefaultOptionType>(
other?: ColumnProps<T>,
selectOther?: SelectProps<SelectValue>
) => makeColumn(title, key, {
editable: true,
...other,
input: <Select options={options} {...selectOther}/>,
input: <SelectWrapper options={options} {...selectOther}/>,
render: (value, dataset, index) => {
const item = options?.find(option => String(option?.value) === String(value))
const item = findOption(value, options)
return other?.render?.(item, dataset, index) ?? item?.label ?? defaultValue?.label ?? value?.label ?? '--'
}
})

1
src/components/Table/Columns/tag.tsx
View File

@ -65,6 +65,7 @@ export const makeTagColumn = <T extends DataType>(
const InputComponent = makeTagInput<T>(value_key, label_key)
return makeColumn(title, dataIndex, {
editable: true,
...other,
render: (item: T[] | undefined, dataset, index) => item?.map((elm: T) => <Tag key={elm[label_key]} color={'blue'}>{other?.render?.(elm, dataset, index) ?? elm[label_key]}</Tag>) ?? '-',
input: <InputComponent {...tagOther} options={options} />,

18
src/components/Table/Columns/text.tsx
View File

@ -1,3 +1,4 @@
import { Tooltip } from 'antd'
import { ColumnFilterItem } from 'antd/lib/table/interface'
import { Key, ReactNode } from 'react'
@ -15,6 +16,18 @@ export const makeStringSorter = <T extends string>(key: Key): SorterMethod<T> =>
return String(vA).localeCompare(String(vB))
}
export const makeTextRender = <T extends string>(def = '---', stringCutter?: (text: string) => string) => (value: T) => {
if (!value) return def
if (stringCutter) {
return (
<Tooltip title={value}>
{stringCutter(value)}
</Tooltip>
)
}
return value
}
export const makeFilterTextMatch = <T extends unknown>(key: keyof DataType<T>) =>
(filterValue: T, dataItem: DataType<T>) => dataItem[key] === filterValue
@ -26,10 +39,11 @@ export const makeTextColumn = <T extends unknown = any>(
render?: RenderMethod<T>,
other?: ColumnProps
) => makeColumn(title, key, {
editable: true,
filters,
onFilter: filters ? makeFilterTextMatch(key) : undefined,
sorter: sorter ?? makeStringSorter(key),
render: render,
sorter: sorter || makeStringSorter(key),
render: render || makeTextRender(),
...other
})

1
src/components/Table/Columns/time.tsx
View File

@ -24,6 +24,7 @@ export const makeTimeColumn = <T extends TimeDto>(
other?: ColumnProps,
pickerOther?: TimePickerWrapperProps,
) => makeColumn<T>(title, key, {
editable: true,
...other,
render: (time) => (
<div className={'text-align-r-container'}>

17
src/pages/AdminPanel/ClusterController.jsx
View File

@ -3,11 +3,12 @@ import { Input } from 'antd'
import {
EditableTable,
makeColumn,
makeSelectColumn,
makeStringSorter,
defaultPagination,
makeTimezoneColumn
makeTimezoneColumn,
makeNumericColumn,
makeTextColumn
} from '@components/Table'
import { invokeWebApiWrapperAsync } from '@components/factory'
import { AdminClusterService, AdminDepositService } from '@api'
@ -30,17 +31,11 @@ const ClusterController = memo(() => {
const clusterColumns = useMemo(() => [
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: coordsFormat }),
makeColumn('Долгота', 'longitude', { width: 150, editable: true, render: coordsFormat }),
makeTextColumn('Название', 'caption', undefined, undefined, undefined, { width: 200, formItemRules: min1 }),
makeNumericColumn('Широта', 'latitude', coordsFormat, undefined, 150),
makeNumericColumn('Долгота', 'longitude', coordsFormat, undefined, 150),
makeTimezoneColumn('Зона', 'timezone', null, true, { width: 150 }),
], [deposits])

17
src/pages/AdminPanel/CompanyController.jsx
View File

@ -3,10 +3,9 @@ import { Input } from 'antd'
import {
EditableTable,
makeColumn,
makeStringSorter,
makeSelectColumn,
defaultPagination
defaultPagination,
makeTextColumn
} from '@components/Table'
import { invokeWebApiWrapperAsync } from '@components/factory'
import { AdminCompanyService, AdminCompanyTypeService } from '@api'
@ -37,16 +36,8 @@ const CompanyController = memo(() => {
}))
setColumns([
makeColumn('Название', 'caption', {
width: 200,
editable: true,
sorter: makeStringSorter('caption'),
formItemRules: min1,
}),
makeSelectColumn('Тип компании', 'idCompanyType', companyTypes, null, {
width: 200,
editable: true
}),
makeTextColumn('Название', 'caption', undefined, undefined, undefined, { width: 200, formItemRules: min1 }),
makeSelectColumn('Тип компании', 'idCompanyType', companyTypes, null, { width: 200 }),
])
await updateTable()

9
src/pages/AdminPanel/CompanyTypeController.jsx
View File

@ -1,19 +1,14 @@
import { memo, useCallback, useEffect, useMemo, useState } from 'react'
import { Input } from 'antd'
import { EditableTable, makeColumn, makeStringSorter, defaultPagination } from '@components/Table'
import { EditableTable, defaultPagination, makeTextColumn } from '@components/Table'
import { invokeWebApiWrapperAsync } from '@components/factory'
import { arrayOrDefault, withPermissions } from '@utils'
import { min1 } from '@utils/validationRules'
import { AdminCompanyTypeService } from '@api'
const columns = [
makeColumn('Название', 'caption', {
width: 200,
editable: true,
sorter: makeStringSorter('caption'),
formItemRules: min1,
}),
makeTextColumn('Название', 'caption', undefined, undefined, undefined, { width: 200, formItemRules: min1 }),
]
const CompanyTypeController = memo(() => {

8
src/pages/AdminPanel/DepositController.jsx
View File

@ -2,15 +2,15 @@ import { memo, useCallback, useEffect, useMemo, useState } from 'react'
import { Input } from 'antd'
import { invokeWebApiWrapperAsync } from '@components/factory'
import { EditableTable, makeColumn, defaultPagination, makeTimezoneColumn } from '@components/Table'
import { EditableTable, defaultPagination, makeTimezoneColumn, makeTextColumn, makeNumericColumn } from '@components/Table'
import { arrayOrDefault, coordsFormat, withPermissions } from '@utils'
import { min1 } from '@utils/validationRules'
import { AdminDepositService } from '@api'
const depositColumns = [
makeColumn('Название', 'caption', { width: 200, editable: true, formItemRules: min1 }),
makeColumn('Широта', 'latitude', { width: 150, editable: true, render: coordsFormat }),
makeColumn('Долгота', 'longitude', { width: 150, editable: true, render: coordsFormat }),
makeTextColumn('Название', 'caption', undefined, undefined, undefined, { width: 200, formItemRules: min1 }),
makeNumericColumn('Широта', 'latitude', coordsFormat, undefined, 150),
makeNumericColumn('Долгота', 'longitude', coordsFormat, undefined, 150),
makeTimezoneColumn('Зона', 'timezone', null, true, { width: 150 }),
]

14
src/pages/AdminPanel/PermissionController.jsx
View File

@ -1,23 +1,15 @@
import { memo, useCallback, useEffect, useMemo, useState } from 'react'
import { Input } from 'antd'
import { EditableTable, makeColumn, makeStringSorter } from '@components/Table'
import { EditableTable, makeTextColumn } from '@components/Table'
import { invokeWebApiWrapperAsync } from '@components/factory'
import { arrayOrDefault, withPermissions } from '@utils'
import { min1 } from '@utils/validationRules'
import { AdminPermissionService } from '@api'
const columns = [
makeColumn('Название', 'name', {
editable: true,
sorter: makeStringSorter('name'),
isRequired: true,
formItemRules: min1,
}),
makeColumn('Описание', 'description', {
editable: true,
sorter: makeStringSorter('description'),
}),
makeTextColumn('Название', 'name', undefined, undefined, undefined, { isRequired: true, formItemRules: min1 }),
makeTextColumn('Описание', 'description'),
]
const PermissionController = memo(() => {

4
src/pages/AdminPanel/RoleController.jsx
View File

@ -19,15 +19,13 @@ const RoleController = memo(() => {
)), [roles, searchValue])
const columns = useMemo(() => [
makeTextColumn('Название', 'caption', null, null, null, { width: 100, editable: true, formItemRules: min1 }),
makeTextColumn('Название', 'caption', null, null, null, { width: 100, formItemRules: min1 }),
makeTagColumn('Включённые роли', 'roles', roles, 'id', 'caption', {
width: 400,
editable: true,
render: (role) => <RoleView role={role} />
}, { allowClear: true }),
makeTagColumn('Разрешения', 'permissions', permissions, 'id', 'name', {
width: 600,
editable: true,
render: (permission) => <PermissionView info={permission} />,
}),
], [roles, permissions])

2
src/pages/AdminPanel/Telemetry/TelemetryViewer.jsx
View File

@ -50,7 +50,7 @@ const TelemetryController = memo(() => {
const columns = useMemo(() => [
makeColumn('', 'hasParent', { render: mergeRender }),
makeNumericColumn('ID', 'id', null, null, makeNumericRender(0)),
makeNumericColumn('ID', 'id', makeNumericRender(0)),
makeTextColumn('UID', 'remoteUid'),
makeTextColumn('Назначена на скважину', 'realWell'),
makeDateColumn('Дата начала бурения', 'drillingStartDate'),

10
src/pages/AdminPanel/UserController/index.jsx
View File

@ -115,7 +115,6 @@ const UserController = memo(() => {
setColumns([
makeTextColumn('Логин', 'login', null, null, null, {
editable: true,
formItemRules: [
{ required: true },
...createLoginRules,
@ -130,41 +129,34 @@ const UserController = memo(() => {
],
}),
makeTextColumn('Фамилия', 'surname', filters.surname, null, null, {
editable: true,
formItemRules: [{ required: true }, ...nameRules],
filterSearch: true,
onFilter: makeTextOnFilter('surname'),
}),
makeTextColumn('Имя', 'name', filters.name, null, null, {
editable: true,
formItemRules: nameRules,
filterSearch: true,
onFilter: makeTextOnFilter('name'),
}),
makeTextColumn('Отчество', 'patronymic', filters.partonymic, null, null, {
editable: true,
formItemRules: nameRules,
filterSearch: true,
onFilter: makeTextOnFilter('patronymic'),
}),
makeTextColumn('E-mail', 'email', filters.email, null, null, {
editable: true,
formItemRules: [{ required: true }, ...emailRules],
filterSearch: true,
onFilter: makeTextOnFilter('email'),
}),
makeTextColumn('Номер телефона', 'phone', null, null, null, {
editable: true,
formItemRules: phoneRules,
}),
makeTextColumn('Должность', 'position', null, null, null, { editable: true }),
makeTextColumn('Должность', 'position', null, null, null),
makeTextColumn('Роли', 'roleNames', roleFilters, null, rolesRender, {
editable: true,
input: <RoleTag roles={roles} />,
onFilter: makeArrayOnFilter('roleNames'),
}),
makeSelectColumn('Компания', 'idCompany', companies, '--', {
editable: true,
sorter: makeNumericSorter('idCompany'),
})
])

26
src/pages/AdminPanel/WellController/index.jsx
View File

@ -12,11 +12,12 @@ import {
EditableTable,
makeColumn,
makeSelectColumn,
makeStringSorter,
makeNumericSorter,
makeTagColumn,
defaultPagination,
makeTimezoneColumn,
makeTextColumn,
makeNumericColumn,
} from '@components/Table'
import { invokeWebApiWrapperAsync } from '@components/factory'
import { TelemetryView, CompanyView } from '@components/views'
@ -81,23 +82,11 @@ const WellController = memo(() => {
}))
setColumns([
makeSelectColumn('Куст', 'idCluster', clusters, '--', {
width: '5rem',
editable: true,
sorter: makeNumericSorter('idCluster'),
}),
makeColumn('Название', 'caption', {
width: '5rem',
editable: true,
sorter: makeStringSorter('caption'),
}),
makeSelectColumn('Тип', 'idWellType', wellTypes, '--', {
width: 150,
editable: true,
sorter: makeNumericSorter('idWellType'),
}),
makeColumn('Широта', 'latitude', { width: 150, editable: true, render: coordsFormat }),
makeColumn('Долгота', 'longitude', { width: 150, editable: true, render: coordsFormat }),
makeSelectColumn('Куст', 'idCluster', clusters, '--', { width: '5rem', sorter: makeNumericSorter('idCluster') }),
makeTextColumn('Название', 'caption', undefined, undefined, undefined, { width: '5rem' }),
makeSelectColumn('Тип', 'idWellType', wellTypes, '--', { width: 150, sorter: makeNumericSorter('idWellType') }),
makeNumericColumn('Широта', 'latitude', coordsFormat, undefined, 150),
makeNumericColumn('Долгота', 'longitude', coordsFormat, undefined, 150),
makeColumn('Телеметрия', 'telemetry', {
editable: true,
render: (telemetry) => <TelemetryView telemetry={telemetry} />,
@ -105,7 +94,6 @@ const WellController = memo(() => {
}, ),
makeTimezoneColumn('Зона', 'timezone', null, true, { width: 170 }),
makeTagColumn('Компании', 'companies', companies, 'id', 'caption', {
editable: true,
render: (company) => <CompanyView company={company} />,
}),
])

15
src/pages/Cluster/ClusterWells.jsx
View File

@ -7,7 +7,7 @@ import {
makeTextColumn,
makeGroupColumn,
makeColumn,
makeNumericColumnPlanFact,
makeNumericColumnPlanFactOld,
Table,
makeNumericRender,
makeNumericColumn,
@ -117,7 +117,10 @@ const ClusterWells = memo(({ statsWells }) => {
const columns = useMemo(() => [
makeTextColumn('скв №', 'caption', null, null,
(_, item) => (
<Link to={{ pathname: `/well/${item.id}`, state: { from: location.pathname }}} style={{display: 'flex', alignItems: 'center'}}>
<Link
to={{ pathname: `/well/${item.id}`, state: { from: location.pathname }}}
style={{ display: 'flex', alignItems: 'center' }}
>
<PointerIcon
state={item.idState === 1 ? 'active' : 'unknown'}
width={32}
@ -133,10 +136,10 @@ const ClusterWells = memo(({ statsWells }) => {
makeDateColumn('начало', 'factStart'),
makeDateColumn('окончание', 'factEnd'),
]),
makeNumericColumnPlanFact('Продолжительность, сут', 'period', filtersMinMax, makeFilterMinMaxFunction, numericRender),
makeNumericColumnPlanFact('МСП, м/ч', 'rateOfPenetration', filtersMinMax, makeFilterMinMaxFunction, numericRender),
makeNumericColumnPlanFact('Рейсовая скорость, м/ч', 'routeSpeed', filtersMinMax, makeFilterMinMaxFunction, numericRender),
makeNumericColumn('НПВ, ч', 'notProductiveTimeFact', filtersMinMax, makeFilterMinMaxFunction, numericRender),
makeNumericColumnPlanFactOld('Продолжительность, сут', 'period', numericRender, makeFilterMinMaxFunction, { filters: filtersMinMax }),
makeNumericColumnPlanFactOld('МСП, м/ч', 'rateOfPenetration', numericRender, makeFilterMinMaxFunction, { filters: filtersMinMax }),
makeNumericColumnPlanFactOld('Рейсовая скорость, м/ч', 'routeSpeed', numericRender, makeFilterMinMaxFunction, { filters: filtersMinMax }),
makeNumericColumn('НПВ, ч', 'notProductiveTimeFact', numericRender, makeFilterMinMaxFunction, { filters: filtersMinMax }),
makeColumn('TVD', 'tvd', { align: 'center', render: (_, value) => (
<Button onClick={() => {
setSelectedWell(value)

8
src/pages/Cluster/WellOperationsTable.jsx
View File

@ -1,14 +1,14 @@
import { memo, useMemo } from 'react'
import { Table, makeTextColumn, makeNumericColumnPlanFact } from '@components/Table'
import { Table, makeTextColumn, makeNumericColumnPlanFactOld } from '@components/Table'
import { getPrecision } from '@utils/functions'
const columns = [
makeTextColumn('Конструкция секции', 'sectionType'),
makeTextColumn('Операция', 'operationName'),
makeNumericColumnPlanFact('Глубина забоя', 'depth', null, null, (number) => getPrecision(number)),
makeNumericColumnPlanFact('Часы', 'durationHours', null, null, (number) => getPrecision(number)),
makeNumericColumnPlanFact('Комментарий', 'comment', null, null, (text) => text ?? '-')
makeNumericColumnPlanFactOld('Глубина забоя', 'depth', (number) => getPrecision(number)),
makeNumericColumnPlanFactOld('Часы', 'durationHours', (number) => getPrecision(number)),
makeNumericColumnPlanFactOld('Комментарий', 'comment', (text) => text ?? '-'),
]
export const WellOperationsTable = memo(({ wellOperations }) => {

2
src/pages/Deposit/StatisticsADW.jsx
View File

@ -18,7 +18,7 @@ const columns = [
makeNumericColumn('Проходка, м', 'sumDepthInterval'),
makeNumericColumn('Время работы, ч', 'usedTimeHours'),
makeNumericColumn('Кол-во запусков', 'operationCount'),
makeNumericColumn('Коэф. использования, %', 'kUsage', undefined, undefined, (value) => numericRender(value * 100)),
makeNumericColumn('Коэф. использования, %', 'kUsage', (value) => numericRender(value * 100)),
]
const getSubsystemState = (subsystem) => {

8
src/pages/Well/Analytics/Statistics.jsx
View File

@ -21,13 +21,13 @@ const speedNumericRender = (section) => numericRender(section?.speed)
const makeSectionSorter = (key, name) => (a, b) => (a?.[key]?.[name] ?? 0) - (b?.[key]?.[name] ?? 0)
export const makeSectionColumn = (title, key, { speedRender } = {}) => makeGroupColumn(title, [
makeNumericColumn('Проходка', key, null, null, (section => numericRender(section?.depth)), 100, {
makeNumericColumn('Проходка', key, (section => numericRender(section?.depth)), undefined, 100, {
sorter: makeSectionSorter(key, 'depth'),
}),
makeNumericColumn('Время', key, null, null, (section => numericRender(section?.time)), 100, {
makeNumericColumn('Время', key, (section => numericRender(section?.time)), undefined, 100, {
sorter: makeSectionSorter(key, 'time'),
}),
makeNumericColumn((<>V<sub>рейсовая</sub></>), key, null, null, speedRender ?? speedNumericRender, 100, {
makeNumericColumn((<>V<sub>рейсовая</sub></>), key, speedRender ?? speedNumericRender, undefined, 100, {
sorter: makeSectionSorter(key, 'speed'),
}),
])
@ -37,7 +37,7 @@ export const defaultColumns = [
makeTextColumn('Скважина', 'caption', null, null, null, { fixed: 'left', width: 100 }),
]
const scrollSettings = { scrollToFirstRowOnChange: true, x: 100, y: 200 }
const scrollSettings = { scrollToFirstRowOnChange: true, x: 100, y: '25vh' }
const summaryColSpan = 1 /// TODO: Когда добавится куст изменить на 2
const getWellData = async (wellsList) => {

28
src/pages/Well/Analytics/WellCompositeEditor/WellCompositeSections.jsx
View File

@ -5,8 +5,9 @@ import { Button, Badge, Divider, Modal, Row, Col } from 'antd'
import { useWell } from '@asb/context'
import LoaderPortal from '@components/LoaderPortal'
import SuspenseFallback from '@components/SuspenseFallback'
import { invokeWebApiWrapperAsync } from '@components/factory'
import { Table, makeTextColumn, makeNumericColumnPlanFact, makeNumericColumn } from '@components/Table'
import { Table, makeTextColumn, makeNumericColumnPlanFactOld, makeNumericColumn } from '@components/Table'
import { WellCompositeService } from '@api'
import {
hasPermission,
@ -17,7 +18,6 @@ import {
} from '@utils'
import NewParamsTable from './NewParamsTable'
import SuspenseFallback from '@asb/components/SuspenseFallback'
const Tvd = lazy(() => import('@pages/Well/WellOperations/Tvd'))
const CompaniesTable = lazy(() => import('@pages/Cluster/CompaniesTable'))
@ -146,15 +146,15 @@ const WellCompositeSections = memo(({ statsWells, selectedSections }) => {
makeTextColumn('скв №', 'caption', null, null,
(text, item) => <Link to={{ pathname: `/well/${item?.id}`, state: { from: location.pathname }}}>{text ?? '-'}</Link>
),
makeTextColumn('Секция', 'sectionType', filtersSectionsType, sortBySectionId, (text) => text ?? '-'),
makeNumericColumnPlanFact('Глубина, м', 'sectionWellDepth', filtersMinMax, makeFilterMinMaxFunction),
makeNumericColumnPlanFact('Продолжительность, ч', 'sectionBuildDays', filtersMinMax, makeFilterMinMaxFunction),
makeNumericColumnPlanFact('МСП, м/ч', 'sectionRateOfPenetration', filtersMinMax, makeFilterMinMaxFunction),
makeNumericColumnPlanFact('Рейсовая скорость, м/ч', 'sectionRouteSpeed', filtersMinMax, makeFilterMinMaxFunction),
makeNumericColumnPlanFact('Спуск КНБК, м/ч', 'sectionBhaDownSpeed', filtersMinMax, makeFilterMinMaxFunction),
makeNumericColumnPlanFact('Подъем КНБК, м/ч', 'sectionBhaUpSpeed', filtersMinMax, makeFilterMinMaxFunction),
makeNumericColumnPlanFact('Скорость спуска ОК, м/ч', 'sectionCasingDownSpeed', filtersMinMax, makeFilterMinMaxFunction),
makeNumericColumn('НПВ, ч', 'nonProductiveHours', filtersMinMax, makeFilterMinMaxFunction, null, '80px'),
makeTextColumn('Секция', 'sectionType', filtersSectionsType, sortBySectionId, (text) => text ?? '-', { width: 100 }),
makeNumericColumnPlanFactOld('Глубина, м', 'sectionWellDepth', undefined, makeFilterMinMaxFunction, undefined, { filters: filtersMinMax }),
makeNumericColumnPlanFactOld('Продолжительность, ч', 'sectionBuildDays', undefined, makeFilterMinMaxFunction, undefined, { filters: filtersMinMax }),
makeNumericColumnPlanFactOld('МСП, м/ч', 'sectionRateOfPenetration', undefined, makeFilterMinMaxFunction, undefined, { filters: filtersMinMax }),
makeNumericColumnPlanFactOld('Рейсовая скорость, м/ч', 'sectionRouteSpeed', undefined, makeFilterMinMaxFunction, undefined, { filters: filtersMinMax }),
makeNumericColumnPlanFactOld('Спуск КНБК, м/ч', 'sectionBhaDownSpeed', undefined, makeFilterMinMaxFunction, undefined, { filters: filtersMinMax }),
makeNumericColumnPlanFactOld('Подъем КНБК, м/ч', 'sectionBhaUpSpeed', undefined, makeFilterMinMaxFunction, undefined, { filters: filtersMinMax }),
makeNumericColumnPlanFactOld('Скорость спуска ОК, м/ч', 'sectionCasingDownSpeed', undefined, makeFilterMinMaxFunction, undefined, { filters: filtersMinMax }),
makeNumericColumn('НПВ, ч', 'nonProductiveHours', undefined, makeFilterMinMaxFunction, '80px', { filters: filtersMinMax }),
{
title: 'TVD',
render: (value) => (
@ -200,11 +200,11 @@ const WellCompositeSections = memo(({ statsWells, selectedSections }) => {
dataSource={rows}
size={'small'}
bordered
scroll={{ x: true, y: 620 }}
scroll={{ x: true, y: '30vh' }}
rowSelection={rowSelection}
pagination={false}
/>
<Divider />
<Divider style={{ marginTop: 0 }} />
<Badge.Ribbon text={'комбинированная скважина'} color={'gray'}>
<h3>Выбранные секции</h3>
</Badge.Ribbon>
@ -214,7 +214,7 @@ const WellCompositeSections = memo(({ statsWells, selectedSections }) => {
rowSelection={rowSelection}
size={'small'}
bordered
scroll={{ x: true }}
scroll={{ x: true, y: '30vh' }}
pagination={false}
/>
<Row justify={'end'} style={{ margin: '1rem 0' }}>

2
src/pages/Well/Documents/DocumentsTemplate.jsx
View File

@ -40,7 +40,7 @@ export const DocumentsTemplate = ({ idCategory, well: givenWell, mimeTypes, head
),
},
makeDateColumn('Дата загрузки', 'uploadDate'),
makeNumericColumn('Размер', 'size', null, null, (value) => formatBytes(value)),
makeNumericColumn('Размер', 'size', (value) => formatBytes(value)),
makeColumn('Автор', 'author', { render: item => <UserView user={item}/> }),
makeColumn('Компания', 'company', { render: (_, record) => <CompanyView company={record?.author?.company}/> }),
...(customColumns ?? [])

4
src/pages/Well/Telemetry/Messages.jsx
View File

@ -29,7 +29,7 @@ const categoryDictionary = {
// Конфигурация таблицы
export const makeMessageColumns = (idWell) => [
makeDateColumn('Дата', 'date', undefined, undefined, { width: '120px' }),
makeNumericColumn('Глубина, м', 'wellDepth', null, null, (depth, item) => (
makeNumericColumn('Глубина, м', 'wellDepth', (depth, item) => (
<Tooltip title={'Нажмите для перехода в архив'}>
<Link
style={{ color: 'inherit'}}
@ -40,7 +40,7 @@ export const makeMessageColumns = (idWell) => [
{depth.toFixed(2)}
</Link>
</Tooltip>
), '7rem'),
), undefined, '7rem'),
makeColumn('Категория', 'categoryId', {
width: '8rem',
render: (_, item) => categoryDictionary[item.categoryId].title,

8
src/pages/Well/Telemetry/OperationTime/index.jsx
View File

@ -26,10 +26,10 @@ const tableColumns = [
<div className={'table_color'} style={{ backgroundColor }} />
)}),
makeTextColumn('Подсистема', 'subsystemName'),
makeNumericColumn('Использование, %', 'kUsage', undefined, undefined, val => (+val * 100).toFixed(2), 200),
makeNumericColumn('Проходка, м', 'sumDepthInterval', undefined, undefined, undefined, 200),
makeNumericColumn('Время работы, ч', 'usedTimeHours', undefined, undefined, undefined, 200),
makeNumericColumn('Кол-во запусков', 'operationCount', undefined, undefined, makeNumericRender(0), 200),
makeNumericColumn('Использование, %', 'kUsage', val => (+val * 100).toFixed(2), undefined, 200),
makeNumericColumn('Проходка, м', 'sumDepthInterval', undefined, undefined, 200),
makeNumericColumn('Время работы, ч', 'usedTimeHours', undefined, undefined, 200),
makeNumericColumn('Кол-во запусков', 'operationCount', makeNumericRender(0), undefined, 200),
]
// Выбор доступен только до текущей даты

3
src/pages/Well/Telemetry/Operations/DrillerList.jsx
View File

@ -5,14 +5,13 @@ import { EditableTable, makeTextColumn } from '@components/Table'
import { DrillerService } from '@api'
const columnOptions = {
editable: true,
formItemRules: [{ message: 'Обязательное поле!', required: true }]
}
const columns = [
makeTextColumn('Фамилия', 'surname', undefined, undefined, undefined, columnOptions),
makeTextColumn('Имя', 'name', undefined, undefined, undefined, columnOptions),
makeTextColumn('Отчество', 'patronymic', undefined, undefined, undefined, { editable: true }),
makeTextColumn('Отчество', 'patronymic'),
]
const rowClassName = (record) => record.has ? 'driller_list_active' : ''

1
src/pages/Well/Telemetry/Operations/DrillerSchedule.jsx
View File

@ -14,7 +14,6 @@ import { arrayOrDefault } from '@utils'
import { ScheduleService } from '@api'
const columnOptions = {
editable: true,
formItemRules: [{ message: 'Обязательное поле!', required: true }]
}

10
src/pages/Well/Telemetry/Operations/OperationsTable.jsx
View File

@ -24,11 +24,11 @@ const makeDrillerSorter = (key) => (a, b) => {
export const columns = [
makeTextColumn('Бурильщик', 'driller', null, makeDrillerSorter('driller'), drillerRender, { width: 200 }),
makeNumericColumn('Кол-во операций', 'count', null, null, (value) => parseInt(value), 150),
makeNumericColumn('Среднее по ключевому показателю', 'averageValue', null, null, numericRender, 150),
makeNumericColumn('Среднее целевого показателя', 'averageTargetValue', null, null, numericRender, 150),
makeNumericColumn('Эффективность (%)', 'efficiency', null, null, numericRender, 150),
makeNumericColumn('Коэффициент потерь', 'loss', null, null, numericRender, 100),
makeNumericColumn('Кол-во операций', 'count', (value) => parseInt(value), undefined, 150),
makeNumericColumn('Среднее по ключевому показателю', 'averageValue', numericRender, undefined, 150),
makeNumericColumn('Среднее целевого показателя', 'averageTargetValue', numericRender, undefined, 150),
makeNumericColumn('Эффективность (%)', 'efficiency', numericRender, undefined, 150),
makeNumericColumn('Коэффициент потерь', 'loss', numericRender, undefined, 100),
]
export const OperationsTable = memo(({ data, height, ...other }) => (

9
src/pages/Well/Telemetry/Operations/TargetEditor.jsx
View File

@ -8,7 +8,6 @@ import { DetectedOperationService, OperationValueService } from '@api'
import { arrayOrDefault } from '@utils'
const columnOptions = {
editable: true,
formItemRules: [{ message: 'Обязательное поле!', required: true }]
}
@ -72,11 +71,11 @@ export const TargetEditor = memo(({ loading, onChange }) => {
filterOption: (input, option) =>
String(option?.label ?? '').toLowerCase().indexOf(input.toLowerCase()) >= 0
}),
makeNumericColumn('Цель', 'targetValue', undefined, undefined, numericRender, 150, columnOptions),
makeNumericColumn('Норм.', 'standardValue', undefined, undefined, numericRender, 150, columnOptions),
makeNumericColumn('Цель', 'targetValue', numericRender, undefined, 150, columnOptions),
makeNumericColumn('Норм.', 'standardValue', numericRender, undefined, 150, columnOptions),
makeGroupColumn('Глубина, м', [
makeNumericColumn('Начало', 'depthStart', undefined, undefined, numericRender, 150, columnOptions),
makeNumericColumn('Окончание', 'depthEnd', undefined, undefined, numericRender, 150, columnOptions),
makeNumericColumn('Начало', 'depthStart', numericRender, undefined, 150, columnOptions),
makeNumericColumn('Окончание', 'depthEnd', numericRender, undefined, 150, columnOptions),
]),
])
},

24
src/pages/Well/Telemetry/TelemetryView/Setpoints/SetpointSender.jsx
View File

@ -1,11 +1,11 @@
import { memo, useCallback, useMemo, useState } from 'react'
import { Select, Modal, Input, InputNumber } from 'antd'
import { Modal, Input } from 'antd'
import { useWell } from '@asb/context'
import { Grid, GridItem } from '@components/Grid'
import LoaderPortal from '@components/LoaderPortal'
import { invokeWebApiWrapperAsync } from '@components/factory'
import { makeNumericRender, EditableTable } from '@components/Table'
import { makeNumericRender, EditableTable, makeSelectColumn, makeNumericColumn } from '@components/Table'
import { PeriodPicker, defaultPeriod } from '@components/selectors/PeriodPicker'
import { SetpointsService } from '@api'
@ -19,24 +19,8 @@ export const SetpointSender = memo(({ onClose, visible, setpointNames }) => {
const [well] = useWell()
const addingColumns = useMemo(() => [
{
title: 'Наименование уставки',
dataIndex: 'name',
editable: true,
isRequired: true,
width: 200,
input: <Select options={setpointNames} />,
render: (val) => setpointNames.find((name) => name.value === val)?.label
}, {
title: 'Значение',
dataIndex: 'value',
editable: true,
isRequired: true,
width: 125,
input: <InputNumber style={{ width: '100%' }} formatter={value => `${value}`.replace(',', '.')}/>,
render: makeNumericRender(1),
align: 'right'
}
makeSelectColumn('Наименование уставки', 'name', setpointNames, undefined, { width: 200, isRequired: true }),
makeNumericColumn('Значение', 'value', makeNumericRender(1), undefined, 125, { isRequired: true, align: 'right' }),
], [setpointNames])
const onAdd = useCallback(async (sp) => setSetpoints((prevSp) => {

10
src/pages/Well/Telemetry/TelemetryView/cursorRender.jsx
View File

@ -5,9 +5,9 @@ import { Grid, GridItem } from '@components/Grid'
import { getChartIcon, makeDisplayValue } from '@utils'
import moment from 'moment'
const defaultFormater = makeDisplayValue({ def: '---', fixed: 2 })
const defaultFormatter = makeDisplayValue({ def: '---', fixed: 2 })
const defaultValueRender = (v, unit) => (
<>{defaultFormater(v)} {unit ?? ''}</>
<>{defaultFormatter(v)} {unit ?? ''}</>
)
export const cursorRender = (group, data, flowData) => {
@ -17,7 +17,7 @@ export const cursorRender = (group, data, flowData) => {
const firstChart = group.charts[0]
const y = firstChart.y(d)
const yDate = moment(y)
const flow = flowData.filter((row) => yDate.isBetween(row.dateStart, row.dateEnd, 's', '[]'))
const flow = flowData?.filter((row) => yDate.isBetween(row.dateStart, row.dateEnd, 's', '[]'))
const yValue = firstChart.yAxis.format?.(y) ?? defaultValueRender(y, firstChart.yAxis.unit)
const xFormat = (chart) => {
const v = chart.x(d)
@ -42,13 +42,13 @@ export const cursorRender = (group, data, flowData) => {
{group.charts.filter((chart) => chart.type === 'rect_area').map((chart, i) => {
const minX = getByAccessor(chart.minXAccessor)
const maxX = getByAccessor(chart.maxXAccessor)
const value = (row) => <span>{defaultFormater(minX(row))} - {defaultFormater(maxX(row))}</span>
const value = (row) => <span>{defaultFormatter(minX(row))} - {defaultFormatter(maxX(row))}</span>
return (
<Fragment key={chart.key}>
<GridItem row={i+2} col={1} style={{ padding: '2px 0' }}>{getChartIcon(chart)}</GridItem>
<GridItem row={i+2} col={2}>{chart.shortLabel || chart.label}</GridItem>
{flow.map((row, j) => (
{flow?.map((row, j) => (
<GridItem key={`${j}`} row={i+2+(j++)} col={3} style={{ paddingRight: 0, textAlign: 'end' }}>
{chart.xAxis.format?.(row) ?? value(row)}
</GridItem>

22
src/pages/Well/WellOperations/OperationEditor/WellOperationsEditor.jsx
View File

@ -31,26 +31,20 @@ const dayWithoutNptRender = (_, row) => dayRender((row.day ?? 0) - (row.nptHours
const generateColumns = (showNpt = false, categories = [], sectionTypes = []) => [
makeSelectColumn('Конструкция секции', 'idWellSectionType', sectionTypes, undefined, {
sorter: makeNumericSorter('idWellSectionType'),
editable: true,
width: 160,
}),
makeSelectColumn('Операция', 'idCategory', categories, undefined, {
sorter: makeNumericSorter('idCategory'),
editable: true,
width: 200,
}),
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: 170,
initialValue: moment().format(),
}),
makeNumericColumn('День', 'day', null, null, dayRender, 80),
showNpt && makeNumericColumn('День без НПВ', 'dayWithoutNpt', null, null, dayWithoutNptRender, 80),
makeColumn('Часы', 'durationHours', { ...makeNumericColumnOptions(2, 'durationHours'), width: 70 }),
makeTextColumn('Комментарий', 'comment', null, null, null, { editable: true, input: <TextArea/> }),
makeTextColumn('Доп. инфо', 'categoryInfo', null, null, null, { width: 300, input: <TextArea/> }),
makeNumericColumn('Глубина забоя на начало, м', 'depthStart'),
makeNumericColumn('Глубина забоя при завершении, м', 'depthEnd'),
makeDateColumn('Время начала', 'dateStart', undefined, undefined, { width: 170, initialValue: moment().format() }),
makeNumericColumn('День', 'day', dayRender, undefined, 80),
showNpt && makeNumericColumn('День без НПВ', 'dayWithoutNpt', dayWithoutNptRender, undefined, 80),
makeNumericColumn('Часы', 'durationHours', undefined, undefined, 70),
makeTextColumn('Комментарий', 'comment', null, null, null, { input: <TextArea /> }),
].filter(Boolean)
export const WellOperationsEditor = memo(({ idType, showNpt, ...other }) => {

6
src/pages/Well/WellOperations/Tvd/NptTable.jsx
View File

@ -4,15 +4,15 @@ import { FilterOutlined } from '@ant-design/icons'
import LoaderPortal from '@components/LoaderPortal'
import { invokeWebApiWrapperAsync } from '@components/factory'
import { makeDateColumn, makeNumericColumn, makeNumericRender, makeTextColumn, Table } from '@components/Table'
import { makeDateColumn, makeNumericColumn, makeTextColumn, Table } from '@components/Table'
import '@styles/pages/tvd.less'
export const columns = [
makeTextColumn('Конструкция секции', 'wellSectionTypeName', null, null, null, { width: 140 }),
makeNumericColumn('Глубина', 'depth', null, null, null, 80),
makeNumericColumn('Глубина', 'depth', undefined, undefined, 80),
makeDateColumn('Дата начала', 'date', false, undefined, { width: 90 }),
makeNumericColumn('Длительность (ч)', 'durationHours', null, null, makeNumericRender(2), 120),
makeNumericColumn('Длительность (ч)', 'durationHours', undefined, undefined, 120),
makeTextColumn('Доп. инфо', 'categoryInfo', null, null, null),
makeTextColumn('Комментарий', 'comment'),
]

6
src/pages/Well/WellOperations/Tvd/TLPie.jsx
View File

@ -18,9 +18,9 @@ const tableColumns = [
<div style={{ backgroundColor: d, padding: '5px 0' }} />
) }),
makeTextColumn('Название', 'category', undefined, undefined, undefined, { width: 300 }),
makeNumericColumn('Время, мин', 'minutesTotal', undefined, undefined, undefined, 100),
makeNumericColumn('Кол-во', 'count', undefined, undefined, (d) => d ? d.toString() : '---', 100),
makeNumericColumn('Процент, %', 'percent', undefined, undefined, (d) => d ? d.toFixed(2) : '---', 100)
makeNumericColumn('Время, мин', 'minutesTotal', undefined, undefined, 100),
makeNumericColumn('Кол-во', 'count', (d) => d ? d.toString() : '---', undefined, 100),
makeNumericColumn('Процент, %', 'percent', (d) => d ? d.toFixed(2) : '---', undefined, 100),
]
export const TLPie = memo(({ well }) => {

111
src/pages/Well/WellOperations/WellSectionsStat.jsx
View File

@ -3,76 +3,75 @@ import { useState, useEffect, memo } from 'react'
import { useWell } from '@asb/context'
import LoaderPortal from '@components/LoaderPortal'
import { invokeWebApiWrapperAsync } from '@components/factory'
import { Table, makeColumn, makeColumnsPlanFact, makeNumericRender } from '@components/Table'
import { Table, makeColumn, makeNumericRender, makeNumericColumnPlanFactOld } from '@components/Table'
import { calcDuration } from '@utils'
import { OperationStatService } from '@api'
const numericRender = makeNumericRender(2)
const columns = [
makeColumn('Тип секции', 'sectionType'),
makeColumnsPlanFact('Глубина, м' ,'wellDepth', { render: numericRender }),
makeColumnsPlanFact('Часы' ,'duration', { render: numericRender }),
makeColumnsPlanFact('МСП, м/ч' ,'rop', { render: numericRender }),
makeColumnsPlanFact('Рейсовая скорость, м/ч','routeSpeed', { render: numericRender }),
makeColumnsPlanFact('Подъем КНБК, м/ч' ,'bhaUpSpeed', { render: numericRender }),
makeColumnsPlanFact('Спуск КНБК, м/ч' ,'bhaDownSpeed', { render: numericRender }),
makeColumnsPlanFact('Спуск ОК, м/ч' ,'casingDownSpeed', { render: numericRender }),
makeColumn('Тип секции', 'sectionType'),
makeNumericColumnPlanFactOld('Глубина, м', 'wellDepth', numericRender),
makeNumericColumnPlanFactOld('Часы', 'duration', numericRender),
makeNumericColumnPlanFactOld('МСП, м/ч', 'rop', numericRender),
makeNumericColumnPlanFactOld('Рейсовая скорость, м/ч', 'routeSpeed', numericRender),
makeNumericColumnPlanFactOld('Подъем КНБК, м/ч', 'bhaUpSpeed', numericRender),
makeNumericColumnPlanFactOld('Спуск КНБК, м/ч', 'bhaDownSpeed', numericRender),
makeNumericColumnPlanFactOld('Спуск ОК, м/ч', 'casingDownSpeed', numericRender),
]
export const WellSectionsStat = memo(() => {
const [sections, setSections] = useState([])
const [showLoader, setShowLoader] = useState(false)
const [sections, setSections] = useState([])
const [showLoader, setShowLoader] = useState(false)
const [well] = useWell()
const [well] = useWell()
useEffect(() => {
invokeWebApiWrapperAsync(
async () => {
const sectionsResponse = await OperationStatService.getStatWell(well.id)
useEffect(() => {
invokeWebApiWrapperAsync(
async () => {
const sectionsResponse = await OperationStatService.getStatWell(well.id)
if(sectionsResponse?.sections){
const sections = sectionsResponse.sections.map(s => ({
key: s.id,
sectionType: s.caption,
wellDepthPlan: s.plan?.wellDepthEnd,
durationPlan: calcDuration(s.plan?.start, s.plan?.end),
ropPlan: s.plan?.rop,
routeSpeedPlan: s.plan?.routeSpeed,
bhaUpSpeedPlan: s.plan?.bhaUpSpeed,
bhaDownSpeedPlan: s.plan?.bhaDownSpeed,
casingDownSpeedPlan: s.plan?.casingDownSpeed,
if(sectionsResponse?.sections){
const sections = sectionsResponse.sections.map(s => ({
key: s.id,
sectionType: s.caption,
wellDepthPlan: s.plan?.wellDepthEnd,
durationPlan: calcDuration(s.plan?.start, s.plan?.end),
ropPlan: s.plan?.rop,
routeSpeedPlan: s.plan?.routeSpeed,
bhaUpSpeedPlan: s.plan?.bhaUpSpeed,
bhaDownSpeedPlan: s.plan?.bhaDownSpeed,
casingDownSpeedPlan: s.plan?.casingDownSpeed,
wellDepthFact: s.fact?.wellDepthEnd,
durationFact: calcDuration(s.fact?.start, s.fact?.end),
ropFact: s.fact?.rop,
routeSpeedFact: s.fact?.routeSpeed,
bhaUpSpeedFact: s.fact?.bhaUpSpeed,
bhaDownSpeedFact: s.fact?.bhaDownSpeed,
casingDownSpeedFact: s.fact?.casingDownSpeed,
}))
sections.sort((a,b) => a.wellDepthPlan - b.wellDepthPlan)
setSections(sections)
}
},
setShowLoader,
`Не удалось получить статистику по секциям`,
{ actionName: 'Получение статистики по секциям', well }
wellDepthFact: s.fact?.wellDepthEnd,
durationFact: calcDuration(s.fact?.start, s.fact?.end),
ropFact: s.fact?.rop,
routeSpeedFact: s.fact?.routeSpeed,
bhaUpSpeedFact: s.fact?.bhaUpSpeed,
bhaDownSpeedFact: s.fact?.bhaDownSpeed,
casingDownSpeedFact: s.fact?.casingDownSpeed,
}))
sections.sort((a,b) => a.wellDepthPlan - b.wellDepthPlan)
setSections(sections)
}
},
setShowLoader,
`Не удалось получить статистику по секциям`,
{ actionName: 'Получение статистики по секциям', well }
)
}, [well])
return (
<LoaderPortal show={showLoader}>
<Table
bordered
size={'small'}
columns={columns}
dataSource={sections}
tableName={'well_operations_sections'}
/>
</LoaderPortal>
)
}, [well])
return (
<LoaderPortal show={showLoader}>
<Table
bordered
size={'small'}
columns={columns}
dataSource={sections}
tableName={'well_operations_sections'}
/>
</LoaderPortal>
)
})
export default WellSectionsStat

8
src/styles/components/loader.css
View File

@ -39,6 +39,8 @@
}
.loader-content{
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
grid-column-start: 1;
@ -58,9 +60,9 @@
place-self: center;
align-self: center;
justify-self: center;
z-index: 1;
z-index: 1;
height: 80px;
width: 80px;
width: 80px;
border-radius: 40px;
}
@ -71,6 +73,6 @@
background-color: rgba(255, 255, 255, 0.4);
align-self: stretch;
justify-self: stretch;
z-index: 1;
z-index: 1;
box-shadow: 0px 0px 6px 5px rgba(255, 254, 254, 0.4);
}