Добавлен столбец телеметрий

src/components/Views/TelemetryView.tsx

@@ -0,0 +1,34 @@
+import { memo } from 'react'
+import { Tooltip } from 'antd'
+import { TelemetryInfoDto } from '../../services/api'
+import { Grid, GridItem } from '../Grid'
+
+const lables: { [labelKey: string]: string } = {
+    timeZoneOffsetTotalHours: 'Сдвиг временной зоны',
+    drillingStartDate: 'Начало бурения',
+    deposit: 'Месторождение',
+    cluster: 'Куст',
+    well: 'Скважина',
+    customer: 'Заказчик',
+}
+
+export type TelemetryViewProps = {
+    info?: TelemetryInfoDto
+}
+
+export const TelemetryView = memo<TelemetryViewProps>(({ info }) => info ? (
+    <Tooltip title={
+        <Grid>
+            {(Object.keys(info) as Array<keyof TelemetryInfoDto>).map((key, i) => (
+                <>
+                    <GridItem row={i+1} col={1}>{lables[key] ?? key}:</GridItem>
+                    <GridItem row={i+1} col={2}>{info[key]}</GridItem>
+                </>
+            ))}
+        </Grid>
+    }>
+        {info.deposit}/{info.cluster}/{info.well}
+    </Tooltip>
+) : (
+    <Tooltip title={'нет данных'}>-</Tooltip>
+))

src/components/Views/index.ts

@@ -1,7 +1,9 @@
 export type { CompanyViewProps } from './CompanyView'
 export type { MarkViewProps } from './MarkView'
+export type { TelemetryViewProps } from './TelemetryView'
 export type { UserViewProps } from './UserView'
 
 export { CompanyView } from './CompanyView'
 export { MarkView } from './MarkView'
+export { TelemetryView } from './TelemetryView'
 export { UserView } from './UserView'

src/pages/AdminPanel/VisitLog.jsx

@@ -21,9 +21,7 @@ export const VisitLog = () => {
     useEffect(() => invokeWebApiWrapperAsync(
         async () => {
             const logData = await RequerstTrackerService.getUsersStat(1000)
-
             logData.forEach((log) => log.key = `${log.login}${log.ip}`)
-
             setLogData(logData)
         },
         setIsLoading,

src/pages/AdminPanel/WellController.jsx

@@ -1,18 +1,40 @@
-import { useEffect, useState } from 'react'
+import { Select } from 'antd'
-import { invokeWebApiWrapperAsync } from '../../components/factory'
+import { memo, useEffect, useState } from 'react'
+import { TelemetryView } from '../../components/Views'
 import LoaderPortal from '../../components/LoaderPortal'
+import { invokeWebApiWrapperAsync } from '../../components/factory'
 import { EditableTable, makeColumn, makeSelectColumn, makeActionHandler } from '../../components/Table'
-import { AdminClusterService, AdminWellService } from '../../services/api'
+import { AdminClusterService, AdminTelemetryService, AdminWellService } from '../../services/api'
 
 const wellTypes = [
     { value: 1, label: 'Наклонно-направленная' },
-    { value: 2, label: 'Горизонтальная' }
+    { value: 2, label: 'Горизонтальная' },
 ]
 
+const TelemetrySelect = memo(({ telemetry, value, onChange }) => {
+    const [options, setOptions] = useState([])
+
+    useEffect(() => {
+        const options = telemetry.map((row) => ({
+            value: row.id,
+            label: `${row.info.deposit}/${row.info.cluster}/${row.info.well}`
+        }))
+        setOptions(options)
+    }, [telemetry])
+
+    const onSelectChange = (id) => {
+        const value = telemetry.find((row) => row.id === id)
+        onChange?.(value)
+    }
+
+    return <Select options={options} value={value?.id} onChange={onSelectChange}/>
+})
+
 export default function WellController() {
     const [clusters, setClusters] = useState([])
     const [wells, setWells] = useState([])
     const [showLoader, setShowLoader] = useState(false)
+    const [telemetry, setTelemetry] = useState([])
 
     const wellColumns = [
         makeSelectColumn('Куст', 'idCluster', clusters, '--', { width: 200 , editable: true }),
@@ -20,7 +42,12 @@ export default function WellController() {
         makeSelectColumn('Тип', 'idWellType', wellTypes, '--', { width: 150, editable: true }),
         makeColumn('Широта', 'latitude', { width: 150, editable: true }),
         makeColumn('Долгота', 'longitude', { width: 150, editable: true }),
-        makeColumn('Телеметрия', 'telemetry', { width: 150, editable: true, render: (t) => t?.id, input: <div /> })
+        makeColumn('Телеметрия', 'telemetry', {
+            width: 150,
+            editable: true,
+            render: (telemetry) => <TelemetryView info={telemetry?.info} />,
+            input: <TelemetrySelect telemetry={telemetry}/>,
+        })
     ]
 
     const updateTable = () => invokeWebApiWrapperAsync(
@@ -34,6 +61,9 @@ export default function WellController() {
 
     useEffect(() => invokeWebApiWrapperAsync(
         async () => {
+            const telemetry = await AdminTelemetryService.getAll()
+            setTelemetry(telemetry)
+
             await updateTable()
             let clusters = await AdminClusterService.getAll()
             clusters = clusters?.map((cluster) => ({ value: cluster.id, label: cluster.caption }))

src/pages/AdminPanel/index.jsx

@@ -1,15 +1,15 @@
-import React, { Suspense } from 'react'
 import { Layout, Menu } from 'antd'
+import { lazy, Suspense } from 'react'
 import { Switch, Link, useParams, Redirect, Route } from 'react-router-dom'
 import { PrivateMenuItem, PrivateRoute } from '../../components/Private'
 
-const ClusterController = React.lazy(() => import('./ClusterController'))
+const ClusterController = lazy(() => import('./ClusterController'))
-const CompanyController = React.lazy(() => import('./CompanyController'))
+const CompanyController = lazy(() => import('./CompanyController'))
-const DepositController = React.lazy(() => import('./DepositController'))
+const DepositController = lazy(() => import('./DepositController'))
-const UserController = React.lazy(() => import('./UserController'))
+const UserController = lazy(() => import('./UserController'))
-const WellController = React.lazy(() => import('./WellController'))
+const WellController = lazy(() => import('./WellController'))
-const RoleController = React.lazy(() => import('./RoleController'))
+const RoleController = lazy(() => import('./RoleController'))
-const VisitLog = React.lazy(() => import('./VisitLog'))
+const VisitLog = lazy(() => import('./VisitLog'))
 
 export const AdminPanel = () => {
     const { tab } = useParams()