diff --git a/src/components/Table/EditableTable.jsx b/src/components/Table/EditableTable.jsx index 68544be..4d9fdd8 100644 --- a/src/components/Table/EditableTable.jsx +++ b/src/components/Table/EditableTable.jsx @@ -2,9 +2,26 @@ import { Form, Table, Button, Popconfirm } from "antd" import { EditOutlined, SaveOutlined, PlusOutlined, CloseCircleOutlined, DeleteOutlined } from '@ant-design/icons' import { useState, useEffect } from "react"; import { EditableCell } from './EditableCell' +import { invokeWebApiWrapperAsync } from "../factory"; const newRowKeyValue = 'newRow' +export const makeActionHandler = (action, { service, setLoader, errorMsg, onComplete }) => service && action && ((record) => invokeWebApiWrapperAsync( + async () => { + if (action === 'insert') { + await service.insert(record) + } else if (record.id) { + if (action === 'update') + await service.delete(record.id) + else if (action === 'delete') + await service.put(record.id, record) + } + onComplete?.() + }, + setLoader, + errorMsg +)) + export const tryAddKeys = (items) => { if(!items?.length || !items[0]) return [] diff --git a/src/pages/AdminPanel/ClusterController.jsx b/src/pages/AdminPanel/ClusterController.jsx index a6227ed..9af3da9 100644 --- a/src/pages/AdminPanel/ClusterController.jsx +++ b/src/pages/AdminPanel/ClusterController.jsx @@ -1,10 +1,10 @@ import { useEffect, useState } from 'react' import { invokeWebApiWrapperAsync } from '../../components/factory' import LoaderPortal from '../../components/LoaderPortal' -import { EditableTable, makeColumn, makeSelectColumn } from '../../components/Table' +import { EditableTable, makeColumn, makeSelectColumn, makeActionHandler } from '../../components/Table' import { AdminClusterService, AdminDepositService } from '../../services/api' -export const ClusterController = () => { +export default function ClusterController() { const [deposits, setDeposits] = useState([]) const [clusters, setClusters] = useState([]) const [showLoader, setShowLoader] = useState(false) @@ -19,8 +19,6 @@ export const ClusterController = () => { const updateTable = () => invokeWebApiWrapperAsync( async () => { const clusters = await AdminClusterService.getAll() - if (!clusters) - throw Error(`Не удалось загрузить список кустов`) setClusters(clusters) }, setShowLoader, @@ -39,21 +37,11 @@ export const ClusterController = () => { useEffect(updateTable, []) - const onAdd = async (cluster) => { - await AdminClusterService.insert(cluster) - updateTable() - } - - const onEdit = async (cluster) => { - if (!cluster.id) return - await AdminClusterService.put(cluster.id, cluster) - updateTable() - } - - const onDelete = async (cluster) => { - if (!cluster.id) return - await AdminClusterService.delete(cluster.id) - updateTable() + const handlerProps = { + service: AdminClusterService, + setLoader: setShowLoader, + errorMsg: `Не удалось выполнить операцию`, + onComplete: updateTable, } return ( @@ -63,9 +51,9 @@ export const ClusterController = () => { bordered columns={clusterColumns} dataSource={clusters} - onRowAdd={onAdd} - onRowEdit={onEdit} - onRowDelete={onDelete} + onRowAdd={makeActionHandler('insert', handlerProps)} + onRowEdit={makeActionHandler('update', handlerProps)} + onRowDelete={makeActionHandler('delete', handlerProps)} /> ) diff --git a/src/pages/AdminPanel/CompanyController.jsx b/src/pages/AdminPanel/CompanyController.jsx index 0412c5a..2f1e07d 100644 --- a/src/pages/AdminPanel/CompanyController.jsx +++ b/src/pages/AdminPanel/CompanyController.jsx @@ -1,7 +1,7 @@ import { useEffect, useState } from 'react' import { invokeWebApiWrapperAsync } from '../../components/factory' import LoaderPortal from '../../components/LoaderPortal' -import { EditableTable, makeColumn } from '../../components/Table' +import { EditableTable, makeColumn, makeActionHandler } from '../../components/Table' import { AdminCompanyService } from '../../services/api' const companyColumns = [ @@ -9,14 +9,13 @@ const companyColumns = [ makeColumn('Тип компании', 'companyTypeCaption', { width: 200, editable: true }) ] -export const CompanyController = () => { +export default function CompanyController() { const [companies, setCompanies] = useState([]) const [showLoader, setShowLoader] = useState(false) const updateTable = () => invokeWebApiWrapperAsync( async() => { const companies = await AdminCompanyService.getAll() - if (!companies) throw Error(`Не удалось загрузить список кустов`) setCompanies(companies) }, setShowLoader, @@ -25,21 +24,11 @@ export const CompanyController = () => { useEffect(updateTable, []) - const onAdd = async (company) => { - await AdminCompanyService.insert(company) - updateTable() - } - - const onEdit = async (company) => { - if(!company.id) return - await AdminCompanyService.put(company.id, company) - updateTable() - } - - const onDelete = async (company) => { - if(!company.id) return - await AdminCompanyService.delete(company.id) - updateTable() + const handlerProps = { + service: AdminCompanyService, + setLoader: setShowLoader, + errorMsg: `Не удалось выполнить операцию`, + onComplete: updateTable, } return ( @@ -49,9 +38,9 @@ export const CompanyController = () => { bordered columns={companyColumns} dataSource={companies} - onRowAdd={onAdd} - onRowEdit={onEdit} - onRowDelete={onDelete} + onRowAdd={makeActionHandler('insert', handlerProps)} + onRowEdit={makeActionHandler('update', handlerProps)} + onRowDelete={makeActionHandler('delete', handlerProps)} /> ) diff --git a/src/pages/AdminPanel/DepositController.jsx b/src/pages/AdminPanel/DepositController.jsx index a4687bf..8e537bb 100644 --- a/src/pages/AdminPanel/DepositController.jsx +++ b/src/pages/AdminPanel/DepositController.jsx @@ -1,7 +1,7 @@ import { useEffect, useState } from 'react' import { invokeWebApiWrapperAsync } from '../../components/factory' import LoaderPortal from '../../components/LoaderPortal' -import { EditableTable, makeColumn } from '../../components/Table' +import { EditableTable, makeColumn, makeActionHandler } from '../../components/Table' import { AdminDepositService } from '../../services/api' const depositColumns = [ @@ -10,14 +10,13 @@ const depositColumns = [ makeColumn('Долгота', 'longitude', { width: 150, editable: true }) ] -export const DepositController = () => { +export default function DepositController() { const [deposits, setDeposits] = useState([]) const [showLoader, setShowLoader] = useState(false) const updateTable = () => invokeWebApiWrapperAsync( async() => { const deposits = await AdminDepositService.getAll() - if (!deposits) throw Error(`Не удалось загрузить список месторождении`) setDeposits(deposits) }, setShowLoader, @@ -26,21 +25,11 @@ export const DepositController = () => { useEffect(updateTable, []) - const onAdd = async (deposit) => { - await AdminDepositService.insert(deposit) - updateTable() - } - - const onEdit = async (deposit) => { - if(!deposit.id) return - await AdminDepositService.put(deposit.id, deposit) - updateTable() - } - - const onDelete = async (deposit) => { - if(!deposit.id) return - await AdminDepositService.delete(deposit.id) - updateTable() + const handlerProps = { + service: AdminDepositService, + setLoader: setShowLoader, + errorMsg: `Не удалось выполнить операцию`, + onComplete: updateTable, } return ( @@ -50,9 +39,9 @@ export const DepositController = () => { bordered columns={depositColumns} dataSource={deposits} - onRowAdd={onAdd} - onRowEdit={onEdit} - onRowDelete={onDelete} + onRowAdd={makeActionHandler('insert', handlerProps)} + onRowEdit={makeActionHandler('update', handlerProps)} + onRowDelete={makeActionHandler('delete', handlerProps)} /> ) diff --git a/src/pages/AdminPanel/UserController.jsx b/src/pages/AdminPanel/UserController.jsx index 52ce350..8e61277 100644 --- a/src/pages/AdminPanel/UserController.jsx +++ b/src/pages/AdminPanel/UserController.jsx @@ -1,11 +1,11 @@ import { useEffect, useState } from 'react' import { invokeWebApiWrapperAsync } from '../../components/factory' import LoaderPortal from '../../components/LoaderPortal' -import { EditableTable, makeColumn, makeSelectColumn } from '../../components/Table' +import { EditableTable, makeColumn, makeSelectColumn, makeActionHandler } from '../../components/Table' import { AdminCompanyService, AdminUserService } from '../../services/api' -import { loginRules, nameRules, phoneRules, emailRules } from '../../utils/validationRules' +import { createLoginRules, nameRules, phoneRules, emailRules } from '../../utils/validationRules' -export const UserController = () => { +export default function UserController() { const [companies, setCompanies] = useState([]) const [users, setUsers] = useState([]) const [showLoader, setShowLoader] = useState(false) @@ -13,7 +13,7 @@ export const UserController = () => { const userColumns = [ makeColumn('Логин', 'login', { editable: true, - formItemRules: [{ required: true }, ...loginRules] + formItemRules: [{ required: true }, ...createLoginRules] }), makeColumn('Фамилия', 'surname', { editable: true, @@ -33,7 +33,6 @@ export const UserController = () => { const updateTable = () => invokeWebApiWrapperAsync( async() => { const users = await AdminUserService.getAll() - if (!users) throw Error(`Не удалось загрузить список пользователей`) setUsers(users) }, setShowLoader, @@ -52,21 +51,11 @@ export const UserController = () => { useEffect(updateTable, []) - const onAdd = async (user) => { - await AdminUserService.insert(user) - updateTable() - } - - const onEdit = async (user) => { - if(!user.id) return - await AdminUserService.put(user.id, user) - updateTable() - } - - const onDelete = async (user) => { - if(!user.id) return - await AdminUserService.delete(user.id) - updateTable() + const handlerProps = { + service: AdminUserService, + setLoader: setShowLoader, + errorMsg: `Не удалось выполнить операцию`, + onComplete: updateTable } return ( @@ -76,9 +65,9 @@ export const UserController = () => { bordered columns={userColumns} dataSource={users} - onRowAdd={onAdd} - onRowEdit={onEdit} - onRowDelete={onDelete} + onRowAdd={makeActionHandler('insert', handlerProps)} + onRowEdit={makeActionHandler('update', handlerProps)} + onRowDelete={makeActionHandler('delete', handlerProps)} /> ) diff --git a/src/pages/AdminPanel/WellController.jsx b/src/pages/AdminPanel/WellController.jsx index 1157325..bad3fa9 100644 --- a/src/pages/AdminPanel/WellController.jsx +++ b/src/pages/AdminPanel/WellController.jsx @@ -1,7 +1,7 @@ import { useEffect, useState } from 'react' import { invokeWebApiWrapperAsync } from '../../components/factory' import LoaderPortal from '../../components/LoaderPortal' -import { EditableTable, makeColumn, makeSelectColumn } from '../../components/Table' +import { EditableTable, makeColumn, makeSelectColumn, makeActionHandler } from '../../components/Table' import { AdminClusterService, AdminWellService } from '../../services/api' const wellTypes = [ @@ -9,7 +9,7 @@ const wellTypes = [ { value: 2, label: 'Горизонтальная' } ] -export const WellController = () => { +export default function WellController() { const [clusters, setClusters] = useState([]) const [wells, setWells] = useState([]) const [showLoader, setShowLoader] = useState(false) @@ -26,7 +26,6 @@ export const WellController = () => { const updateTable = () => invokeWebApiWrapperAsync( async () => { const wells = await AdminWellService.getAll() - if (!wells) throw Error(`Не удалось загрузить список скважин`) setWells(wells) }, setShowLoader, @@ -45,21 +44,11 @@ export const WellController = () => { useEffect(updateTable, []) - const onAdd = async (well) => { - await AdminWellService.insert(well) - updateTable() - } - - const onEdit = async (well) => { - if (!well.id) return - await AdminWellService.put(well.id, well) - updateTable() - } - - const onDelete = async (well) => { - if (!well.id) return - await AdminWellService.delete(well.id) - updateTable() + const handlerProps = { + service: AdminWellService, + setLoader: setShowLoader, + errorMsg: `Не удалось выполнить операцию`, + onComplete: updateTable } return ( @@ -69,9 +58,9 @@ export const WellController = () => { bordered columns={wellColumns} dataSource={wells} - onRowAdd={onAdd} - onRowEdit={onEdit} - onRowDelete={onDelete} + onRowAdd={makeActionHandler('insert', handlerProps)} + onRowEdit={makeActionHandler('update', handlerProps)} + onRowDelete={makeActionHandler('delete', handlerProps)} /> )