From d98e2234686b54ebe9a81b4302e93251dae43837 Mon Sep 17 00:00:00 2001 From: goodm2ice Date: Fri, 18 Mar 2022 17:37:05 +0500 Subject: [PATCH] =?UTF-8?q?=D0=94=D0=BE=D0=B1=D0=B0=D0=B2=D0=BB=D0=B5?= =?UTF-8?q?=D0=BD=D1=8B=20=D1=84=D0=B8=D0=BB=D1=8C=D1=82=D1=80=D1=8B=20?= =?UTF-8?q?=D0=BD=D0=B0=20=D1=81=D1=82=D1=80=D0=B0=D0=BD=D0=B8=D1=86=D1=83?= =?UTF-8?q?=20=D0=B0=D0=B4=D0=BC=D0=B8=D0=BD=D0=BA=D0=B8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/AdminPanel/ClusterController.jsx | 38 ++++++++++---- src/pages/AdminPanel/CompanyController.jsx | 32 +++++++++--- .../AdminPanel/CompanyTypeController.jsx | 30 ++++++++--- src/pages/AdminPanel/DepositController.jsx | 40 +++++++++++---- src/pages/AdminPanel/PermissionController.jsx | 33 +++++++++--- src/pages/AdminPanel/RoleController.jsx | 34 +++++++++---- src/pages/AdminPanel/TelemetryController.jsx | 41 ++++++++++++--- .../AdminPanel/UserController/RoleTag.jsx | 16 +++--- src/pages/AdminPanel/UserController/index.jsx | 50 +++++++------------ src/pages/AdminPanel/VisitLog.jsx | 31 +++++++++--- src/pages/AdminPanel/WellController/index.jsx | 44 +++++++++++----- src/pages/WellOperations/Tvd/NptTable.jsx | 4 +- 12 files changed, 269 insertions(+), 124 deletions(-) diff --git a/src/pages/AdminPanel/ClusterController.jsx b/src/pages/AdminPanel/ClusterController.jsx index d513d9d..dc8117d 100644 --- a/src/pages/AdminPanel/ClusterController.jsx +++ b/src/pages/AdminPanel/ClusterController.jsx @@ -1,4 +1,5 @@ -import { memo, useCallback, useEffect, useState } from 'react' +import { memo, useCallback, useEffect, useMemo, useState } from 'react' +import { Input } from 'antd' import { EditableTable, @@ -9,7 +10,6 @@ import { defaultPagination, makeTimezoneColumn } from '@components/Table' -import LoaderPortal from '@components/LoaderPortal' import { invokeWebApiWrapperAsync } from '@components/factory' import { AdminClusterService, AdminDepositService } from '@api' import { arrayOrDefault } from '@utils' @@ -21,9 +21,11 @@ import { coordsFixed } from './DepositController' export const ClusterController = memo(() => { const [deposits, setDeposits] = useState([]) const [clusters, setClusters] = useState([]) + const [filteredClusters, setFilteredClusters] = useState([]) const [showLoader, setShowLoader] = useState(false) + const [searchValue, setSearchValue] = useState('') - const clusterColumns = [ + const clusterColumns = useMemo(() => [ makeSelectColumn('Месторождение', 'idDeposit', deposits, '--', { width: 200, editable: true, @@ -38,7 +40,7 @@ export const ClusterController = memo(() => { makeColumn('Широта', 'latitude', { width: 150, editable: true, render: coordsFixed }), makeColumn('Долгота', 'longitude', { width: 150, editable: true, render: coordsFixed }), makeTimezoneColumn('Зона', 'timezone', null, true, { width: 150 }), - ] + ], [deposits]) const updateTable = useCallback(() => invokeWebApiWrapperAsync( async () => { @@ -63,27 +65,43 @@ export const ClusterController = memo(() => { useEffect(updateTable, [updateTable]) - const handlerProps = { + useEffect(() => { + setFilteredClusters(clusters.filter((cluster) => cluster && (!searchValue || [ + cluster.caption ?? '', + cluster.latitude?.toString ?? '', + cluster.longitude?.toString() ?? '', + ].join(' ').toLowerCase().includes(searchValue.toLowerCase())))) + }, [clusters, searchValue]) + + const handlerProps = useMemo(() => ({ service: AdminClusterService, setLoader: setShowLoader, errorMsg: `Не удалось выполнить операцию`, onComplete: updateTable, - } + }), [updateTable]) return ( - + <> + setSearchValue(e.target.value)} + value={searchValue} + loading={showLoader} + /> - + ) }) diff --git a/src/pages/AdminPanel/CompanyController.jsx b/src/pages/AdminPanel/CompanyController.jsx index 9973496..c2c5923 100644 --- a/src/pages/AdminPanel/CompanyController.jsx +++ b/src/pages/AdminPanel/CompanyController.jsx @@ -1,4 +1,5 @@ -import { memo, useCallback, useEffect, useState } from 'react' +import { memo, useCallback, useEffect, useMemo, useState } from 'react' +import { Input } from 'antd' import { EditableTable, @@ -8,7 +9,6 @@ import { makeSelectColumn, defaultPagination } from '@components/Table' -import LoaderPortal from '@components/LoaderPortal' import { invokeWebApiWrapperAsync } from '@components/factory' import { AdminCompanyService, AdminCompanyTypeService } from '@api' import { arrayOrDefault } from '@utils' @@ -19,7 +19,9 @@ import { hasPermission } from '@utils/permissions' export const CompanyController = memo(() => { const [columns, setColumns] = useState([]) const [companies, setCompanies] = useState([]) + const [filteredCompanies, setFilteredCompanies] = useState([]) const [showLoader, setShowLoader] = useState(false) + const [searchValue, setSearchValue] = useState('') const updateTable = useCallback(async () => { const companies = await AdminCompanyService.getAll() @@ -53,7 +55,13 @@ export const CompanyController = memo(() => { 'Получение списка типов команд' ), [updateTable]) - const handlerProps = { + useEffect(() => { + setFilteredCompanies(companies.filter((company) => company && (!searchValue || + company.caption?.toLowerCase()?.includes(searchValue.toLowerCase()) + ))) + }, [companies, searchValue]) + + const handlerProps = useMemo(() => ({ service: AdminCompanyService, setLoader: setShowLoader, errorMsg: `Не удалось выполнить операцию`, @@ -63,22 +71,30 @@ export const CompanyController = memo(() => { `Не удалось обновить список компаний`, 'Получение списка компаний' ), - } + }), [updateTable]) return ( - + <> + setSearchValue(e.target.value)} + value={searchValue} + loading={showLoader} + /> - + ) }) diff --git a/src/pages/AdminPanel/CompanyTypeController.jsx b/src/pages/AdminPanel/CompanyTypeController.jsx index af55a6a..7e117f6 100644 --- a/src/pages/AdminPanel/CompanyTypeController.jsx +++ b/src/pages/AdminPanel/CompanyTypeController.jsx @@ -1,4 +1,5 @@ -import { memo, useCallback, useEffect, useState } from 'react' +import { memo, useCallback, useEffect, useMemo, useState } from 'react' +import { Input } from 'antd' import { EditableTable, @@ -7,7 +8,6 @@ import { makeStringSorter, defaultPagination } from '@components/Table' -import LoaderPortal from '@components/LoaderPortal' import { invokeWebApiWrapperAsync } from '@components/factory' import { AdminCompanyTypeService } from '@api' import { arrayOrDefault } from '@utils' @@ -25,7 +25,9 @@ const columns = [ export const CompanyTypeController = memo(() => { const [companyTypes, setCompanyTypes] = useState([]) + const [filteredCompanyTypes, setFilteredCompanyTypes] = useState([]) const [showLoader, setShowLoader] = useState(false) + const [searchValue, setSearchValue] = useState('') const updateTable = useCallback(() => invokeWebApiWrapperAsync( async() => { @@ -39,27 +41,41 @@ export const CompanyTypeController = memo(() => { useEffect(updateTable, [updateTable]) - const handlerProps = { + useEffect(() => { + setFilteredCompanyTypes(companyTypes.filter((companyType) => companyType && (!searchValue || + companyType.caption?.toLowerCase()?.includes(searchValue.toLowerCase()) + ))) + }, [companyTypes, searchValue]) + + const handlerProps = useMemo(() => ({ service: AdminCompanyTypeService, setLoader: setShowLoader, errorMsg: `Не удалось выполнить операцию`, onComplete: updateTable, - } + }), [updateTable]) return ( - + <> + setSearchValue(e.target.value)} + value={searchValue} + loading={showLoader} + /> - + ) }) diff --git a/src/pages/AdminPanel/DepositController.jsx b/src/pages/AdminPanel/DepositController.jsx index d033753..30e9209 100644 --- a/src/pages/AdminPanel/DepositController.jsx +++ b/src/pages/AdminPanel/DepositController.jsx @@ -1,12 +1,12 @@ -import { memo, useCallback, useEffect, useState } from 'react' +import { memo, useCallback, useEffect, useMemo, useState } from 'react' +import { Input } from 'antd' -import LoaderPortal from '@components/LoaderPortal' import { invokeWebApiWrapperAsync } from '@components/factory' import { EditableTable, makeColumn, makeActionHandler, defaultPagination, makeTimezoneColumn } from '@components/Table' -import { AdminDepositService } from '@api' -import { arrayOrDefault } from '@utils' -import { min1 } from '@utils/validationRules' import { hasPermission } from '@utils/permissions' +import { min1 } from '@utils/validationRules' +import { arrayOrDefault } from '@utils' +import { AdminDepositService } from '@api' export const coordsFixed = (coords) => coords && isFinite(coords) ? (+coords).toPrecision(10) : '-' @@ -19,7 +19,9 @@ const depositColumns = [ export const DepositController = memo(() => { const [deposits, setDeposits] = useState([]) + const [filteredDeposits, setFilteredDeposits] = useState([]) const [showLoader, setShowLoader] = useState(false) + const [searchValue, setSearchValue] = useState('') const updateTable = useCallback(() => invokeWebApiWrapperAsync( async() => { @@ -33,27 +35,43 @@ export const DepositController = memo(() => { useEffect(updateTable, [updateTable]) - const handlerProps = { + useEffect(() => { + setFilteredDeposits(deposits.filter((deposit) => deposit && (!searchValue || [ + deposit.caption ?? '', + deposit.latitude?.toString() ?? '', + deposit.longitude?.toString() ?? '', + ].join(' ').toLowerCase().includes(searchValue.toLowerCase())))) + }, [deposits, searchValue]) + + const handlerProps = useMemo(() => ({ service: AdminDepositService, setLoader: setShowLoader, errorMsg: `Не удалось выполнить операцию`, onComplete: updateTable, - } + }), [updateTable]) return ( - + <> + setSearchValue(e.target.value)} + value={searchValue} + loading={showLoader} + /> - + ) }) diff --git a/src/pages/AdminPanel/PermissionController.jsx b/src/pages/AdminPanel/PermissionController.jsx index a094e60..d555995 100644 --- a/src/pages/AdminPanel/PermissionController.jsx +++ b/src/pages/AdminPanel/PermissionController.jsx @@ -1,4 +1,5 @@ -import { memo, useCallback, useEffect, useState } from 'react' +import { memo, useCallback, useEffect, useMemo, useState } from 'react' +import { Input } from 'antd' import { EditableTable, @@ -6,7 +7,6 @@ import { makeColumn, makeStringSorter } from '@components/Table' -import LoaderPortal from '@components/LoaderPortal' import { invokeWebApiWrapperAsync } from '@components/factory' import { AdminPermissionService } from '@api' import { arrayOrDefault } from '@utils' @@ -27,8 +27,10 @@ const columns = [ ] export const PermissionController = memo(() => { - const [showLoader, setShowLoader] = useState(false) const [permissions, setPermissions] = useState([]) + const [filteredPermissions, setFilteredPermissions] = useState([]) + const [showLoader, setShowLoader] = useState(false) + const [searchValue, setSearchValue] = useState('') const updateTable = useCallback(async () => invokeWebApiWrapperAsync( async () => { @@ -42,27 +44,42 @@ export const PermissionController = memo(() => { useEffect(() => updateTable(), [updateTable]) - const handlerProps = { + useEffect(() => { + setFilteredPermissions(permissions.filter((permission) => permission && (!searchValue || [ + permission.name ?? '', + permission.description ?? '', + ].join(' ').includes(searchValue.toLowerCase())))) + }, [permissions, searchValue]) + + const handlerProps = useMemo(() => ({ service: AdminPermissionService, setLoader: setShowLoader, errorMsg: `Не удалось выполнить операцию`, onComplete: updateTable - } + }), [updateTable]) return ( - + <> + setSearchValue(e.target.value)} + value={searchValue} + loading={showLoader} + /> - + ) }) diff --git a/src/pages/AdminPanel/RoleController.jsx b/src/pages/AdminPanel/RoleController.jsx index 63e2d5b..13fd47d 100644 --- a/src/pages/AdminPanel/RoleController.jsx +++ b/src/pages/AdminPanel/RoleController.jsx @@ -1,9 +1,9 @@ -import { memo, useCallback, useEffect, useState } from 'react' +import { memo, useCallback, useEffect, useMemo, useState } from 'react' +import { Input } from 'antd' -import LoaderPortal from '@components/LoaderPortal' import { PermissionView, RoleView } from '@components/views' import { invokeWebApiWrapperAsync } from '@components/factory' -import { EditableTable, makeActionHandler, makeColumn, makeTagColumn } from '@components/Table' +import { EditableTable, makeActionHandler, makeTagColumn, makeTextColumn } from '@components/Table' import { AdminPermissionService, AdminUserRoleService } from '@api' import { arrayOrDefault } from '@utils' import { min1 } from '@utils/validationRules' @@ -12,7 +12,9 @@ import { hasPermission } from '@utils/permissions' export const RoleController = memo(() => { const [permissions, setPermissions] = useState([]) const [roles, setRoles] = useState([]) + const [filteredRoles, setFilteredRoles] = useState([]) const [showLoader, setShowLoader] = useState(false) + const [searchValue, setSearchValue] = useState('') const [columns, setColumns] = useState([]) const loadRoles = useCallback(async () => { @@ -22,7 +24,7 @@ export const RoleController = memo(() => { useEffect(() => { setColumns([ - makeColumn('Название', 'caption', { width: 100, editable: true, formItemRules: min1 }), + makeTextColumn('Название', 'caption', null, null, null, { width: 100, editable: true, formItemRules: min1 }), makeTagColumn('Включённые роли', 'roles', roles, 'id', 'caption', { width: 400, editable: true, @@ -47,7 +49,13 @@ export const RoleController = memo(() => { 'Получение списка ролей' ), [loadRoles]) - const handlerProps = { + useEffect(() => { + setFilteredRoles(roles.filter((role) => role && (!searchValue || + role.caption?.toLowerCase()?.includes(searchValue.toLowerCase()) + ))) + }, [roles, searchValue]) + + const handlerProps = useMemo(() => ({ service: AdminUserRoleService, setLoader: setShowLoader, errorMsg: `Не удалось выполнить операцию`, @@ -57,21 +65,29 @@ export const RoleController = memo(() => { `Не удалось загрузить список ролей`, 'Получение списка ролей' ) - } + }), [loadRoles]) return ( - + <> + setSearchValue(e.target.value)} + value={searchValue} + loading={showLoader} + /> - + ) }) diff --git a/src/pages/AdminPanel/TelemetryController.jsx b/src/pages/AdminPanel/TelemetryController.jsx index 7621ce9..23283be 100644 --- a/src/pages/AdminPanel/TelemetryController.jsx +++ b/src/pages/AdminPanel/TelemetryController.jsx @@ -1,4 +1,5 @@ import { memo, useEffect, useState } from 'react' +import { Input } from 'antd' import { defaultPagination, @@ -8,7 +9,6 @@ import { makeTextColumn, Table } from '@components/Table' -import LoaderPortal from '@components/LoaderPortal' import { invokeWebApiWrapperAsync } from '@components/factory' import { AdminTelemetryService } from '@api' import { arrayOrDefault } from '@utils' @@ -31,7 +31,10 @@ const columns = [ export const TelemetryController = memo(() => { const [telemetryData, setTelemetryData] = useState([]) - const [isLoading, setIsLoading] = useState(false) + const [filteredTelemetryData, setFilteredTelemetryData] = useState([]) + const [showLoader, setShowLoader] = useState(false) + const [searchValue, setSearchValue] = useState('') + useEffect(() => invokeWebApiWrapperAsync( async () => { @@ -43,22 +46,46 @@ export const TelemetryController = memo(() => { realWell: telemetry?.well?.caption, }))) }, - setIsLoading, + setShowLoader, `Не удалось загрузить список телеметрии скважин`, 'Полученик списка телеметрии скважин' ), []) + useEffect(() => { + setFilteredTelemetryData(telemetryData.filter((telemetry) => telemetry && (!searchValue || [ + telemetry.remoteUid ?? '', + telemetry.realWell ?? '', + telemetry.drillingStartDate ?? '', + telemetry.well ?? '', + telemetry.cluster ?? '', + telemetry.deposit ?? '', + telemetry.customer ?? '', + telemetry.comment ?? '', + telemetry.hmiVersion ?? '', + telemetry.saubPlcVersion ?? '', + telemetry.spinPlcVersion ?? '', + ].join(' ').toLowerCase().includes(searchValue.toLowerCase())))) + }, [telemetryData, searchValue]) + return ( - + <> + setSearchValue(e.target.value)} + value={searchValue} + loading={showLoader} + /> - + ) }) diff --git a/src/pages/AdminPanel/UserController/RoleTag.jsx b/src/pages/AdminPanel/UserController/RoleTag.jsx index c67aa26..a88c7ce 100644 --- a/src/pages/AdminPanel/UserController/RoleTag.jsx +++ b/src/pages/AdminPanel/UserController/RoleTag.jsx @@ -1,16 +1,12 @@ import { Select } from 'antd' -import { memo, useEffect, useState } from 'react' +import { memo, useMemo } from 'react' export const RoleTag = memo(({ roles, value, onChange }) => { - const [options, setOptions] = useState([]) - - useEffect(() => { - setOptions(roles.map((elm) => ({ - key: Date.now(), - value: `${elm.caption}`, - label: elm.caption - }))) - }, [roles]) + const options = useMemo(() => roles.map((elm) => ({ + key: Date.now(), + value: `${elm.caption}`, + label: elm.caption + })), [roles]) return (
- + ) }) diff --git a/src/pages/AdminPanel/WellController/index.jsx b/src/pages/AdminPanel/WellController/index.jsx index 97eda0c..852a232 100644 --- a/src/pages/AdminPanel/WellController/index.jsx +++ b/src/pages/AdminPanel/WellController/index.jsx @@ -1,6 +1,6 @@ -import { Button } from 'antd' +import { Button, Input } from 'antd' import { CopyOutlined } from '@ant-design/icons' -import { memo, useEffect, useState } from 'react' +import { memo, useCallback, useEffect, useMemo, useState } from 'react' import { AdminClusterService, @@ -19,7 +19,6 @@ import { defaultPagination, makeTimezoneColumn, } from '@components/Table' -import LoaderPortal from '@components/LoaderPortal' import { invokeWebApiWrapperAsync } from '@components/factory' import { TelemetryView, CompanyView } from '@components/views' import { hasPermission } from '@utils/permissions' @@ -43,9 +42,12 @@ const recordParser = (record) => ({ export const WellController = memo(() => { const [columns, setColumns] = useState([]) const [wells, setWells] = useState([]) + const [filteredWells, setFilteredWells] = useState([]) const [showLoader, setShowLoader] = useState(false) + const [searchValue, setSearchValue] = useState('') - const updateTable = async () => invokeWebApiWrapperAsync( + + const updateTable = useCallback(async () => invokeWebApiWrapperAsync( async () => { const wells = await AdminWellService.getAll() setWells(arrayOrDefault(wells)) @@ -53,11 +55,11 @@ export const WellController = memo(() => { setShowLoader, `Не удалось загрузить список скважин`, 'Получение списка скважин' - ) + ), []) - const duplicateWell = (well) => { + const duplicateWell = useCallback((well) => { // TODO: Метод дубликации скважины - } + }, []) const addititonalButtons = memo((record, editingKey) => (