summaryrefslogtreecommitdiff
path: root/src/containers
diff options
context:
space:
mode:
Diffstat (limited to 'src/containers')
-rw-r--r--src/containers/ContractorForm.tsx51
-rw-r--r--src/containers/Contractors.tsx33
-rw-r--r--src/containers/ProductForm.tsx48
-rw-r--r--src/containers/Products.tsx32
-rw-r--r--src/containers/Service/Service.tsx19
-rw-r--r--src/containers/Service/ServiceContext.tsx20
-rw-r--r--src/containers/Service/ServiceForm.tsx45
-rw-r--r--src/containers/Service/ServiceList.tsx28
8 files changed, 127 insertions, 149 deletions
diff --git a/src/containers/ContractorForm.tsx b/src/containers/ContractorForm.tsx
index 7f0d660..a67eabe 100644
--- a/src/containers/ContractorForm.tsx
+++ b/src/containers/ContractorForm.tsx
@@ -1,51 +1,16 @@
import React from 'react';
-import { useParams, useHistory } from 'react-router-dom';
-import { Formik, Form, Field } from 'formik';
-import Page, { Action } from './Page';
+import { Form, Field } from 'formik';
import Input from '../components/Input';
-import { useContractor } from '../hooks/useAPIClient';
-import { post, patch } from '../requests';
-
-interface Params {
- id: string;
-}
-
-const actions: Action[] = [
- { name: 'Назад', variant: 'outlined', route: '..' },
- { name: 'Сохранить', type: 'submit', form: 'contractorForm' },
-];
const ContractorForm: React.FC = () => {
- const history = useHistory();
- const { id } = useParams<Params>();
- const { data: contractor } = useContractor(id);
-
- const onSubmit = (values: any) => {
- const promise = id
- ? patch(`/contractors/${id}`, values)
- : post('/contractors', values);
- return promise.then(() => history.push('/contractors'));
- };
-
return (
- <Page title={id ? contractor?.name : 'Новый контрагент'} actions={actions}>
- {(!id || contractor) && (
- <Formik
- initialValues={contractor || { name: '', debt: '', vatId: '' }}
- onSubmit={onSubmit}
- >
- {() => (
- <Form id="contractorForm">
- <div className="max-w-lg">
- <Field name="name" label="Название" as={Input} />
- <Field name="vatId" label="УНП" as={Input} />
- <Field name="debt" type="number" label="Долг ($)" as={Input} />
- </div>
- </Form>
- )}
- </Formik>
- )}
- </Page>
+ <Form id="form">
+ <div className="max-w-lg">
+ <Field name="name" label="Название" as={Input} />
+ <Field name="vatId" label="УНП" as={Input} />
+ <Field name="debt" type="number" label="Долг ($)" as={Input} />
+ </div>
+ </Form>
);
};
diff --git a/src/containers/Contractors.tsx b/src/containers/Contractors.tsx
deleted file mode 100644
index 5d589ea..0000000
--- a/src/containers/Contractors.tsx
+++ /dev/null
@@ -1,33 +0,0 @@
-import React from 'react';
-import { useHistory } from 'react-router-dom';
-import Page from './Page';
-import ListTable from '../components/ListTable';
-import { useContractors } from '../hooks/useAPIClient';
-
-const fields = [
- { key: 'vatId', label: 'УНП' },
- { key: 'name', label: 'Название' },
- { key: 'debt', label: 'Долг' },
-];
-
-const actions = [
- { name: 'Добавить', route: 'contractors/add' },
-];
-
-const Contractors: React.FC = () => {
- const history = useHistory();
- const { data: contractors } = useContractors();
-
- const handleRowClick = (index: number) => {
- const contractor = contractors && contractors[index];
- history.push(`/contractors/edit/${contractor?._id}`);
- };
-
- return (
- <Page title="Контрагенты" actions={actions}>
- <ListTable items={contractors} fields={fields} handleRowClick={handleRowClick} />
- </Page>
- );
-};
-
-export default Contractors;
diff --git a/src/containers/ProductForm.tsx b/src/containers/ProductForm.tsx
index 0d21df9..4d01881 100644
--- a/src/containers/ProductForm.tsx
+++ b/src/containers/ProductForm.tsx
@@ -1,50 +1,16 @@
import React from 'react';
-import { useParams, useHistory } from 'react-router-dom';
-import { Formik, Form, Field } from 'formik';
-import Page, { Action } from './Page';
+import { Form, Field } from 'formik';
import Input from '../components/Input';
-import { useProduct } from '../hooks/useAPIClient';
-import { post, patch } from '../requests';
-interface Params {
- id: string;
-}
-
-const actions: Action[] = [
- { name: 'Назад', variant: 'outlined', route: '..' },
- { name: 'Сохранить', type: 'submit', form: 'productForm' },
-];
const ProductForm: React.FC = () => {
- const history = useHistory();
- const { id } = useParams<Params>();
- const { data: product } = useProduct(id);
-
- const onSubmit = (values: any) => {
- const promise = id
- ? patch(`/products/${id}`, values)
- : post('/products', values);
- return promise.then(() => history.push('/products'));
- };
-
return (
- <Page title={id ? product?.name : 'Новый товар'} actions={actions}>
- {(!id || product) && (
- <Formik
- initialValues={product || { name: '', price: '' }}
- onSubmit={onSubmit}
- >
- {() => (
- <Form id="productForm">
- <div className="max-w-lg">
- <Field name="name" label="Название" as={Input} />
- <Field name="price" type="number" label="Цена ($)" as={Input} />
- </div>
- </Form>
- )}
- </Formik>
- )}
- </Page>
+ <Form id="form">
+ <div className="max-w-lg">
+ <Field name="name" label="Название" as={Input} />
+ <Field name="price" type="number" label="Цена ($)" as={Input} />
+ </div>
+ </Form>
);
};
diff --git a/src/containers/Products.tsx b/src/containers/Products.tsx
deleted file mode 100644
index 0b6ea70..0000000
--- a/src/containers/Products.tsx
+++ /dev/null
@@ -1,32 +0,0 @@
-import React from 'react';
-import { useHistory } from 'react-router-dom';
-import Page from './Page';
-import ListTable from '../components/ListTable';
-import { useProducts } from '../hooks/useAPIClient';
-
-const fields = [
- { key: 'name', label: 'Название' },
- { key: 'price', label: 'Цена' },
-];
-
-const actions = [
- { name: 'Добавить', route: 'products/add' },
-];
-
-const Products: React.FC = () => {
- const history = useHistory();
- const { data: products } = useProducts();
-
- const handleRowClick = (index: number) => {
- const product = products && products[index];
- history.push(`/products/edit/${product?._id}`);
- };
-
- return (
- <Page title="Товары" actions={actions}>
- <ListTable items={products} fields={fields} handleRowClick={handleRowClick} />
- </Page>
- );
-};
-
-export default Products;
diff --git a/src/containers/Service/Service.tsx b/src/containers/Service/Service.tsx
new file mode 100644
index 0000000..3a7cbee
--- /dev/null
+++ b/src/containers/Service/Service.tsx
@@ -0,0 +1,19 @@
+import React from 'react';
+import { Route, Switch, useRouteMatch } from 'react-router-dom';
+import ServiceList from './ServiceList';
+import ServiceForm from './ServiceForm';
+
+
+const Service: React.FC = () => {
+ const { path } = useRouteMatch();
+
+ return (
+ <Switch>
+ <Route exact path={path} component={ServiceList} />
+ <Route path={`${path}/add`} component={ServiceForm} />
+ <Route path={`${path}/edit/:id`} component={ServiceForm} />
+ </Switch>
+ );
+};
+
+export default Service;
diff --git a/src/containers/Service/ServiceContext.tsx b/src/containers/Service/ServiceContext.tsx
new file mode 100644
index 0000000..2602936
--- /dev/null
+++ b/src/containers/Service/ServiceContext.tsx
@@ -0,0 +1,20 @@
+import React from 'react';
+
+export interface ServiceParams {
+ route: string;
+ name: string;
+ nameSingular: string;
+ tableFields: any[];
+ Form: React.FC<any>;
+}
+
+const ServiceContext = React.createContext<ServiceParams>({
+ route: '',
+ name: '',
+ nameSingular: '',
+ tableFields: [],
+ Form: () => null,
+});
+
+export const ServiceProvider = ServiceContext.Provider;
+export default ServiceContext;
diff --git a/src/containers/Service/ServiceForm.tsx b/src/containers/Service/ServiceForm.tsx
new file mode 100644
index 0000000..273f5bd
--- /dev/null
+++ b/src/containers/Service/ServiceForm.tsx
@@ -0,0 +1,45 @@
+import React, { useContext } from 'react';
+import { useParams, useHistory } from 'react-router-dom';
+import { Formik } from 'formik';
+import Page, { Action } from '../Page';
+import hooks from '../../hooks/useAPIClient';
+import { post, patch } from '../../requests';
+import ServiceContext from './ServiceContext';
+
+interface Params {
+ id: string;
+}
+
+const actions: Action[] = [
+ { name: 'Назад', variant: 'outlined', route: '..' },
+ { name: 'Сохранить', type: 'submit', form: 'form' },
+];
+
+const ServiceForm: React.FC = () => {
+ const service = useContext(ServiceContext);
+ const history = useHistory();
+ const { id } = useParams<Params>();
+ const { data: item } = hooks[service.route].useItem(id);
+
+ const onSubmit = (values: any) => {
+ const promise = id
+ ? patch(`/${service.route}/${id}`, values)
+ : post(`/${service.route}`, values);
+ return promise.then(() => history.push(`/${service.route}`));
+ };
+
+ return (
+ <Page title={id ? item?.name : `Новый ${service.nameSingular}`} actions={actions}>
+ {(!id || item) && (
+ <Formik
+ initialValues={item || { name: '', debt: '', vatId: '' }}
+ onSubmit={onSubmit}
+ >
+ <service.Form />
+ </Formik>
+ )}
+ </Page>
+ );
+};
+
+export default ServiceForm;
diff --git a/src/containers/Service/ServiceList.tsx b/src/containers/Service/ServiceList.tsx
new file mode 100644
index 0000000..6af2d1b
--- /dev/null
+++ b/src/containers/Service/ServiceList.tsx
@@ -0,0 +1,28 @@
+import React, { useContext } from 'react';
+import { useHistory } from 'react-router-dom';
+import Page from '../Page';
+import ListTable from '../../components/ListTable';
+import hooks from '../../hooks/useAPIClient';
+import ServiceContext from './ServiceContext';
+
+
+const ServiceList: React.FC = () => {
+ const service = useContext(ServiceContext);
+ const history = useHistory();
+ const { data } = hooks[service.route].useList();
+
+ const actions = [{ name: 'Добавить', route: `/${service.route}/add` }];
+
+ const handleRowClick = (index: number) => {
+ const item = data && data[index];
+ history.push(`/${service.route}/edit/${item?._id}`);
+ };
+
+ return (
+ <Page title={service.name} actions={actions}>
+ <ListTable items={data} fields={service.tableFields} handleRowClick={handleRowClick} />
+ </Page>
+ );
+};
+
+export default ServiceList;