From 062f10a25d43b875d187cf582b2ecf96d075ec26 Mon Sep 17 00:00:00 2001 From: eug-vs Date: Thu, 25 Mar 2021 23:09:49 +0300 Subject: refactor: move services to separate folder --- src/containers/ContractorForm.tsx | 14 ---- src/containers/ContractorPanel.tsx | 34 --------- src/containers/Page.tsx | 2 +- src/containers/ProductForm.tsx | 15 ---- src/containers/Service/ServiceContext.tsx | 9 +-- src/containers/TransferForm.tsx | 44 ------------ src/containers/TransfersUpload.tsx | 41 ----------- src/containers/WaybillForm.tsx | 86 ---------------------- src/containers/WaybillPanel.tsx | 42 ----------- src/hooks/useAPIClient.ts | 15 ++-- src/hooks/useOptions.ts | 30 -------- src/index.tsx | 16 ----- src/services.js | 104 --------------------------- src/services/account/index.ts | 17 +++++ src/services/constants.ts | 11 +++ src/services/contractors/ContractorForm.tsx | 14 ++++ src/services/contractors/ContractorPanel.tsx | 34 +++++++++ src/services/contractors/index.ts | 22 ++++++ src/services/index.ts | 20 ++++++ src/services/products/ProductForm.tsx | 15 ++++ src/services/products/index.ts | 20 ++++++ src/services/transfers/TransferForm.tsx | 44 ++++++++++++ src/services/transfers/TransfersUpload.tsx | 44 ++++++++++++ src/services/transfers/index.ts | 35 +++++++++ src/services/waybills/WaybillForm.tsx | 86 ++++++++++++++++++++++ src/services/waybills/WaybillPanel.tsx | 42 +++++++++++ src/services/waybills/index.ts | 27 +++++++ 27 files changed, 443 insertions(+), 440 deletions(-) delete mode 100644 src/containers/ContractorForm.tsx delete mode 100644 src/containers/ContractorPanel.tsx delete mode 100644 src/containers/ProductForm.tsx delete mode 100644 src/containers/TransferForm.tsx delete mode 100644 src/containers/TransfersUpload.tsx delete mode 100644 src/containers/WaybillForm.tsx delete mode 100644 src/containers/WaybillPanel.tsx delete mode 100644 src/hooks/useOptions.ts delete mode 100644 src/services.js create mode 100644 src/services/account/index.ts create mode 100644 src/services/constants.ts create mode 100644 src/services/contractors/ContractorForm.tsx create mode 100644 src/services/contractors/ContractorPanel.tsx create mode 100644 src/services/contractors/index.ts create mode 100644 src/services/index.ts create mode 100644 src/services/products/ProductForm.tsx create mode 100644 src/services/products/index.ts create mode 100644 src/services/transfers/TransferForm.tsx create mode 100644 src/services/transfers/TransfersUpload.tsx create mode 100644 src/services/transfers/index.ts create mode 100644 src/services/waybills/WaybillForm.tsx create mode 100644 src/services/waybills/WaybillPanel.tsx create mode 100644 src/services/waybills/index.ts diff --git a/src/containers/ContractorForm.tsx b/src/containers/ContractorForm.tsx deleted file mode 100644 index 56d38be..0000000 --- a/src/containers/ContractorForm.tsx +++ /dev/null @@ -1,14 +0,0 @@ -import React from 'react'; -import { Form } from 'formik'; -import Input from '../components/Input'; - -const ContractorForm: React.FC = () => { - return ( -
- - -
- ); -}; - -export default ContractorForm; diff --git a/src/containers/ContractorPanel.tsx b/src/containers/ContractorPanel.tsx deleted file mode 100644 index 6a209c3..0000000 --- a/src/containers/ContractorPanel.tsx +++ /dev/null @@ -1,34 +0,0 @@ -import React from 'react'; -import { useHistory } from 'react-router-dom'; -import Button from '../components/Button'; -import { patch, baseURL } from '../requests'; -import { PanelProps } from './Service/ServiceContext'; - - -const ContractorPanel: React.FC = ({ item, mutate }) => { - const history = useHistory(); - - return ( -
- - Долг контрагента: {item.debt} - -
- - - - -
-
- ); -}; - -export default ContractorPanel; diff --git a/src/containers/Page.tsx b/src/containers/Page.tsx index c4d4efd..d3a087a 100644 --- a/src/containers/Page.tsx +++ b/src/containers/Page.tsx @@ -16,7 +16,7 @@ const style = 'mb-2 flex justify-between md:flex-row md:items-center'; const Page: React.FC = ({ title, actions, className, children }) => ( -
1 ? 'flex-col items-start' : 'flex-row items-center'}`}> +
1 ? 'flex-col items-start' : 'flex-row items-center'}`}> {title}
{actions?.map(action => ())} diff --git a/src/containers/ProductForm.tsx b/src/containers/ProductForm.tsx deleted file mode 100644 index 6957916..0000000 --- a/src/containers/ProductForm.tsx +++ /dev/null @@ -1,15 +0,0 @@ -import React from 'react'; -import { Form } from 'formik'; -import Input from '../components/Input'; - - -const ProductForm: React.FC = () => { - return ( -
- - -
- ); -}; - -export default ProductForm; diff --git a/src/containers/Service/ServiceContext.tsx b/src/containers/Service/ServiceContext.tsx index 68ff907..75ac0fb 100644 --- a/src/containers/Service/ServiceContext.tsx +++ b/src/containers/Service/ServiceContext.tsx @@ -1,21 +1,22 @@ import React from 'react'; import { FormikProps } from 'formik'; +import { Action } from '../Page'; export interface PanelProps { item: any; mutate: (item: any) => void; } -type Route = Record; - export interface ServiceParams { route: string; name: string; nameSingular: string; tableFields: any[]; default: Record; - routes?: Route[]; - Form?: React.FC; + routes?: Record; + actions?: Action[]; + rowLink?: (item: any) => string; + Form?: React.FC>; Panel?: React.FC; } diff --git a/src/containers/TransferForm.tsx b/src/containers/TransferForm.tsx deleted file mode 100644 index 801150e..0000000 --- a/src/containers/TransferForm.tsx +++ /dev/null @@ -1,44 +0,0 @@ -import React from 'react'; -import { Form, FormikProps } from 'formik'; -import moment from 'moment'; -import Input from '../components/Input'; -import Select from '../components/Select'; -import hooks from '../hooks/useAPIClient'; - - -const mapper = (item: any) => ({ key: item._id, label: item.name }); - - -const TransferForm: React.FC = ({ setFieldValue, values }) => { - const { data: contractors } = hooks.contractors.useList(); - - if (!values.date) setFieldValue('date', moment().format('YYYY-MM-DD')); - if (!values.contractorId && contractors?.length) setFieldValue('contractorId', contractors[0]._id); - - return ( -
-
- -
-
- -
-
- ); -}; - -export default TransferForm; diff --git a/src/containers/TransfersUpload.tsx b/src/containers/TransfersUpload.tsx deleted file mode 100644 index bddd0ad..0000000 --- a/src/containers/TransfersUpload.tsx +++ /dev/null @@ -1,41 +0,0 @@ -import React from 'react'; -import { useHistory } from 'react-router-dom'; -import { Form, Formik } from 'formik'; -import Button from '../components/Button'; -import Input from '../components/Input'; -import Page, { Action } from './Page'; -import { post } from '../requests'; - -const TransfersUpload: React.FC = () => { - const history = useHistory(); - - const handleSubmitFile = () => { - const reader = new FileReader(); - const file = document.getElementById('file').files[0]; - reader.readAsDataURL(file); - reader.onload = (e: any) => { - const uri = e.target.result; - post('/uploads', { uri }).then(history.goBack); - }; - }; - - const actions: Action[] = [ - { name: 'Назад', variant: 'outlined', onClick: history.goBack }, - { name: 'Загрузить', type: 'submit', form: 'form' }, - ]; - - return ( - - -
- -
- - - ); -}; - -export default TransfersUpload; diff --git a/src/containers/WaybillForm.tsx b/src/containers/WaybillForm.tsx deleted file mode 100644 index a924cc5..0000000 --- a/src/containers/WaybillForm.tsx +++ /dev/null @@ -1,86 +0,0 @@ -import React from 'react'; -import { Form, FormikProps } from 'formik'; -import _ from 'lodash'; -import moment from 'moment'; -import Input from '../components/Input'; -import Button from '../components/Button'; -import Select from '../components/Select'; -import Paper from '../components/Paper'; -import hooks from '../hooks/useAPIClient'; - - -const mapper = (item: any) => ({ key: item._id, label: item.name }); - - -const WaybillForm: React.FC = ({ setFieldValue, values }) => { - const { data: products } = hooks.products.useList(); - const { data: contractors } = hooks.contractors.useList(); - - if (!values.date) setFieldValue('date', moment().format('YYYY-MM-DD')); - if (!values.contractorId && contractors?.length) setFieldValue('contractorId', contractors[0]._id); - - const handleAddRecord = () => setFieldValue('records', [...values.records, { - productId: _.map(products, '_id').reduce((acc, id) => { - return acc || (!_.map(values.records, 'productId').includes(id) && id); - }, false), - price: '', - quantity: 1, - }]); - - const handleRemoveRecord = (index: number) => () => { - const records = [...values.records]; - records.splice(index, 1); - setFieldValue('records', records); - }; - - return ( -
- - -
- {values.records.map((record, index) => ( - - - -
- -
-
- - ))} - - - ); -}; - -export default WaybillForm; diff --git a/src/containers/WaybillPanel.tsx b/src/containers/WaybillPanel.tsx deleted file mode 100644 index b90447e..0000000 --- a/src/containers/WaybillPanel.tsx +++ /dev/null @@ -1,42 +0,0 @@ -import React from 'react'; -import { useHistory } from 'react-router-dom'; -import Button from '../components/Button'; -import { patch, baseURL } from '../requests'; -import { PanelProps } from './Service/ServiceContext'; - - -const WaybillPanel: React.FC = ({ item, mutate }) => { - const history = useHistory(); - - const handleChangeStatus = status => patch(`/waybills/${item._id}`, { status }) - .then(() => { - history.push('/waybills'); - mutate({ ...item, status }); - }); - - const handlePrint = () => window.open(`${baseURL}/spreadsheets/${item._id}`, '_blank'); - - const handleExecute = () => handleChangeStatus('executed'); - const handleCancel = () => handleChangeStatus('cancelled'); - - const executed = item.status === 'executed'; - - return ( -
-
- - - Итоговая сумма: ${item.total} - -
-
- ); -}; - -export default WaybillPanel; diff --git a/src/hooks/useAPIClient.ts b/src/hooks/useAPIClient.ts index 1fa9896..adb6d3f 100644 --- a/src/hooks/useAPIClient.ts +++ b/src/hooks/useAPIClient.ts @@ -1,13 +1,14 @@ import useSWR, { responseInterface } from 'swr'; import _ from 'lodash'; import { get } from '../requests'; -import services from '../services'; type Response = responseInterface; const fetcher = (endpoint: string) => get(endpoint).then(response => response.data); -const createServiceHooks = (service: string) => { +const hooks: any = {}; + +const registerServiceHooks = (service: string) => { const useList = (query = '', options = {}): Response => { return useSWR(`/${service}${query}`, fetcher, options); }; @@ -24,7 +25,7 @@ const createServiceHooks = (service: string) => { return result; }; - return { useItem, useList }; + hooks[service] = { useItem, useList }; }; // Products @@ -49,11 +50,6 @@ export interface Contractor { debt: number; } -const hooks = services.reduce((acc, { route }) => { - return _.set(acc, route, createServiceHooks(route)); -}, {}); - - hooks.account = { useList: () => { const { data: transfers } = useSWR('/transfers', fetcher); @@ -70,4 +66,5 @@ hooks.account = { }; -export default hooks as any; +export { registerServiceHooks }; +export default hooks; diff --git a/src/hooks/useOptions.ts b/src/hooks/useOptions.ts deleted file mode 100644 index 2a5aee6..0000000 --- a/src/hooks/useOptions.ts +++ /dev/null @@ -1,30 +0,0 @@ -import { useEffect } from 'react'; -import _ from 'lodash'; -import { Option } from '../components/Select'; -import hooks from './useAPIClient'; - -// Load service entities and map them into select options -// setting the default value in formik -const useOptions = ( - service: string, - fields: string[], - values: Record, - setFieldValue: (any) => void, - mapper = item => ({ key: item._id, label: item.name }), -): Option[] => { - const { data: items } = hooks[service].useList(); - - const options = items?.map(mapper); - - useEffect(() => { - // Initialize all empty fields - if (items?.length) fields.forEach(field => { - if (!_.get(values, field)) setFieldValue(field, items[0]._id); - }); - }, [items, values, setFieldValue]); - - return options; -}; - - -export default useOptions; diff --git a/src/index.tsx b/src/index.tsx index ffc7ae4..1005a9d 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -11,22 +11,6 @@ import Home from './containers/Home'; import Service from './containers/Service/Service'; import { ServiceProvider } from './containers/Service/ServiceContext'; import services from './services'; -import WaybillForm from './containers/WaybillForm'; -import WaybillPanel from './containers/WaybillPanel'; -import ContractorForm from './containers/ContractorForm'; -import ContractorPanel from './containers/ContractorPanel'; -import ProductForm from './containers/ProductForm'; -import TransferForm from './containers/TransferForm'; -import TransfersUpload from './containers/TransfersUpload'; - -services[0].Form = ProductForm; -services[1].Form = ContractorForm; -services[1].Panel = ContractorPanel; -services[2].Form = WaybillForm; -services[2].Panel = WaybillPanel; -services[3].Form = TransferForm; -services[3].routes = { upload: TransfersUpload }; - const navigation = [ { name: 'Главная', route: '/' }, diff --git a/src/services.js b/src/services.js deleted file mode 100644 index dfb166e..0000000 --- a/src/services.js +++ /dev/null @@ -1,104 +0,0 @@ -import { ServiceParams } from './containers/Service/ServiceContext'; - - -const waybillStatusNames = { - waiting: 'Ожидание', - executed: 'Проведена', - cancelled: 'Отменена', -}; - -const operationNames = { - in: 'Приход', - out: 'Расход', -}; - -const services: ServiceParams[] = [ - { - route: 'products', - name: 'Товары', - nameSingular: 'Товар', - tableFields: [ - { key: 'name', label: 'Название' }, - { key: 'price', label: 'Цена' }, - { key: 'quantity', label: 'На складе' }, - ], - default: { - name: '', - price: '', - quantity: 0, - }, - }, - { - route: 'contractors', - name: 'Контрагенты', - nameSingular: 'Контрагент', - tableFields: [ - { key: 'vatId', label: 'УНП' }, - { key: 'name', label: 'Название' }, - { key: 'debt', label: 'Долг' }, - ], - default: { - name: '', - vatId: '', - debt: 0, - }, - }, - { - route: 'waybills', - name: 'Накладные', - nameSingular: 'Накладная', - tableFields: [ - { key: 'status', label: 'Статус', transform: status => waybillStatusNames[status] }, - { key: 'operation', label: 'Операция', transform: op => operationNames[op] }, - { key: 'total', label: 'Сумма' }, - { key: 'contractor.name', label: 'Контрагент' }, - ], - default: { - operation: 'in', - records: [], - }, - }, - { - route: 'transfers', - name: 'Переводы', - nameSingular: 'Перевод', - tableFields: [ - { key: 'date', label: 'Дата', transform: date => new Date(date).toLocaleDateString() }, - { key: 'contractor.name', label: 'Контрагент' }, - { key: 'operation', label: 'Операция', transform: op => operationNames[op] }, - { key: 'amount', label: 'Сумма' }, - ], - actions: [ - { - name: 'Загрузить выписку', - route: '/transfers/upload', - variant: 'outlined', - }, - { - name: 'Добавить', - route: '/transfers/add', - }, - ], - default: { - operation: 'in', - records: [], - }, - }, - { - route: 'account', - name: 'Рассчётный счёт', - tableFields: [ - { key: 'date', label: 'Дата', transform: date => new Date(date).toLocaleDateString() }, - { key: 'amount', label: 'Сумма' }, - ], - actions: [ - { - name: 'Загрузить выписку', - route: '/transfers/upload', - }, - ], - rowLink: item => `/transfers?date=${item.date}`, - }, -]; - -export default services; diff --git a/src/services/account/index.ts b/src/services/account/index.ts new file mode 100644 index 0000000..5b5eb10 --- /dev/null +++ b/src/services/account/index.ts @@ -0,0 +1,17 @@ +const service = { + route: 'account', + name: 'Рассчётный счёт', + tableFields: [ + { key: 'date', label: 'Дата', transform: (date: string) => new Date(date).toLocaleDateString() }, + { key: 'amount', label: 'Сумма' }, + ], + actions: [ + { + name: 'Загрузить выписку', + route: '/transfers/upload', + }, + ], + rowLink: (item: any) => `/transfers?date=${item.date}`, +}; + +export default service; diff --git a/src/services/constants.ts b/src/services/constants.ts new file mode 100644 index 0000000..1461d9c --- /dev/null +++ b/src/services/constants.ts @@ -0,0 +1,11 @@ +export const operationNames = { + in: 'Приход', + out: 'Расход', +}; + +export const waybillStatusNames = { + waiting: 'Ожидание', + executed: 'Проведена', + cancelled: 'Отменена', +}; + diff --git a/src/services/contractors/ContractorForm.tsx b/src/services/contractors/ContractorForm.tsx new file mode 100644 index 0000000..d300efc --- /dev/null +++ b/src/services/contractors/ContractorForm.tsx @@ -0,0 +1,14 @@ +import React from 'react'; +import { Form } from 'formik'; +import Input from '../../components/Input'; + +const ContractorForm: React.FC = () => { + return ( +
+ + +
+ ); +}; + +export default ContractorForm; diff --git a/src/services/contractors/ContractorPanel.tsx b/src/services/contractors/ContractorPanel.tsx new file mode 100644 index 0000000..ce94c48 --- /dev/null +++ b/src/services/contractors/ContractorPanel.tsx @@ -0,0 +1,34 @@ +import React from 'react'; +import { useHistory } from 'react-router-dom'; +import Button from '../../components/Button'; +import { patch, baseURL } from '../../requests'; +import { PanelProps } from '../../containers/Service/ServiceContext'; + + +const ContractorPanel: React.FC = ({ item, mutate }) => { + const history = useHistory(); + + return ( +
+ + Долг контрагента: {item.debt} + +
+ + + + +
+
+ ); +}; + +export default ContractorPanel; diff --git a/src/services/contractors/index.ts b/src/services/contractors/index.ts new file mode 100644 index 0000000..124e338 --- /dev/null +++ b/src/services/contractors/index.ts @@ -0,0 +1,22 @@ +import Form from './ContractorForm'; +import Panel from './ContractorPanel'; + +const service = { + route: 'contractors', + name: 'Контрагенты', + nameSingular: 'Контрагент', + tableFields: [ + { key: 'vatId', label: 'УНП' }, + { key: 'name', label: 'Название' }, + { key: 'debt', label: 'Долг' }, + ], + default: { + name: '', + vatId: '', + debt: 0, + }, + Form, + Panel, +}; + +export default service; diff --git a/src/services/index.ts b/src/services/index.ts new file mode 100644 index 0000000..7f559f2 --- /dev/null +++ b/src/services/index.ts @@ -0,0 +1,20 @@ +import contractors from './contractors'; +import waybills from './waybills'; +import transfers from './transfers'; +import products from './products'; +import account from './account'; +import { registerServiceHooks } from '../hooks/useAPIClient'; +import { ServiceParams } from '../containers/Service/ServiceContext'; + +const services = [ + contractors, + products, + waybills, + transfers, + account, +] as ServiceParams[]; + +services.forEach((service: any) => registerServiceHooks(service.route)); + +export default services; + diff --git a/src/services/products/ProductForm.tsx b/src/services/products/ProductForm.tsx new file mode 100644 index 0000000..62f0e70 --- /dev/null +++ b/src/services/products/ProductForm.tsx @@ -0,0 +1,15 @@ +import React from 'react'; +import { Form } from 'formik'; +import Input from '../../components/Input'; + + +const ProductForm: React.FC = () => { + return ( +
+ + +
+ ); +}; + +export default ProductForm; diff --git a/src/services/products/index.ts b/src/services/products/index.ts new file mode 100644 index 0000000..7e1509a --- /dev/null +++ b/src/services/products/index.ts @@ -0,0 +1,20 @@ +import Form from './ProductForm'; + +const service = { + route: 'products', + name: 'Товары', + nameSingular: 'Товар', + tableFields: [ + { key: 'name', label: 'Название' }, + { key: 'price', label: 'Цена' }, + { key: 'quantity', label: 'На складе' }, + ], + default: { + name: '', + price: '', + quantity: 0, + }, + Form, +}; + +export default service; diff --git a/src/services/transfers/TransferForm.tsx b/src/services/transfers/TransferForm.tsx new file mode 100644 index 0000000..3502609 --- /dev/null +++ b/src/services/transfers/TransferForm.tsx @@ -0,0 +1,44 @@ +import React from 'react'; +import { Form, FormikProps } from 'formik'; +import moment from 'moment'; +import Input from '../../components/Input'; +import Select from '../../components/Select'; +import hooks from '../../hooks/useAPIClient'; + + +const mapper = (item: any) => ({ key: item._id, label: item.name }); + + +const TransferForm: React.FC> = ({ setFieldValue, values }) => { + const { data: contractors } = hooks.contractors.useList(); + + if (!values.date) setFieldValue('date', moment().format('YYYY-MM-DD')); + if (!values.contractorId && contractors?.length) setFieldValue('contractorId', contractors[0]._id); + + return ( +
+
+ +
+
+ +
+
+ ); +}; + +export default TransferForm; diff --git a/src/services/transfers/TransfersUpload.tsx b/src/services/transfers/TransfersUpload.tsx new file mode 100644 index 0000000..1c81b08 --- /dev/null +++ b/src/services/transfers/TransfersUpload.tsx @@ -0,0 +1,44 @@ +import React from 'react'; +import { useHistory } from 'react-router-dom'; +import { Form, Formik } from 'formik'; +import Button from '../../components/Button'; +import Input from '../../components/Input'; +import Page, { Action } from '../../containers/Page'; +import { post } from '../../requests'; + +const TransfersUpload: React.FC = () => { + const history = useHistory(); + + const handleSubmitFile = () => { + const reader = new FileReader(); + const element = document.getElementById('file') as HTMLInputElement; + const file = element?.files?.[0]; + if (file) { + reader.readAsDataURL(file); + reader.onload = (e: any) => { + const uri = e.target.result; + post('/uploads', { uri }).then(history.goBack); + }; + } + }; + + const actions: Action[] = [ + { name: 'Назад', variant: 'outlined', onClick: history.goBack }, + { name: 'Загрузить', type: 'submit', form: 'form' }, + ]; + + return ( + + +
+ +
+ + + ); +}; + +export default TransfersUpload; diff --git a/src/services/transfers/index.ts b/src/services/transfers/index.ts new file mode 100644 index 0000000..09f6e04 --- /dev/null +++ b/src/services/transfers/index.ts @@ -0,0 +1,35 @@ +import Form from './TransferForm'; +import UploadPage from './TransfersUpload'; + +import { operationNames } from '../constants'; + +const service = { + route: 'transfers', + name: 'Переводы', + nameSingular: 'Перевод', + tableFields: [ + { key: 'date', label: 'Дата', transform: (date: string) => new Date(date).toLocaleDateString() }, + { key: 'contractor.name', label: 'Контрагент' }, + { key: 'operation', label: 'Операция', transform: (op: 'in' | 'out') => operationNames[op] }, + { key: 'amount', label: 'Сумма' }, + ], + actions: [ + { + name: 'Загрузить выписку', + route: '/transfers/upload', + variant: 'outlined', + }, + { + name: 'Добавить', + route: '/transfers/add', + }, + ], + default: { + operation: 'in', + records: [], + }, + routes: { upload: UploadPage }, + Form, +}; + +export default service; diff --git a/src/services/waybills/WaybillForm.tsx b/src/services/waybills/WaybillForm.tsx new file mode 100644 index 0000000..c11ab9e --- /dev/null +++ b/src/services/waybills/WaybillForm.tsx @@ -0,0 +1,86 @@ +import React from 'react'; +import { Form, FormikProps } from 'formik'; +import _ from 'lodash'; +import moment from 'moment'; +import Input from '../../components/Input'; +import Button from '../../components/Button'; +import Select from '../../components/Select'; +import Paper from '../../components/Paper'; +import hooks from '../../hooks/useAPIClient'; + + +const mapper = (item: any) => ({ key: item._id, label: item.name }); + + +const WaybillForm: React.FC> = ({ setFieldValue, values }) => { + const { data: products } = hooks.products.useList(); + const { data: contractors } = hooks.contractors.useList(); + + if (!values.date) setFieldValue('date', moment().format('YYYY-MM-DD')); + if (!values.contractorId && contractors?.length) setFieldValue('contractorId', contractors[0]._id); + + const handleAddRecord = () => setFieldValue('records', [...values.records, { + productId: _.map(products, '_id').reduce((acc, id) => { + return acc || (!_.map(values.records, 'productId').includes(id) && id); + }, false), + price: '', + quantity: 1, + }]); + + const handleRemoveRecord = (index: number) => () => { + const records = [...values.records]; + records.splice(index, 1); + setFieldValue('records', records); + }; + + return ( +
+ + +
+ {values.records.map((record: any, index: number) => ( + + + +
+ +
+ + + ))} + + + ); +}; + +export default WaybillForm; diff --git a/src/services/waybills/WaybillPanel.tsx b/src/services/waybills/WaybillPanel.tsx new file mode 100644 index 0000000..101a871 --- /dev/null +++ b/src/services/waybills/WaybillPanel.tsx @@ -0,0 +1,42 @@ +import React from 'react'; +import { useHistory } from 'react-router-dom'; +import Button from '../../components/Button'; +import { patch, baseURL } from '../../requests'; +import { PanelProps } from '../../containers/Service/ServiceContext'; + + +const WaybillPanel: React.FC = ({ item, mutate }) => { + const history = useHistory(); + + const handleChangeStatus = (status: any) => patch(`/waybills/${item._id}`, { status }) + .then(() => { + history.push('/waybills'); + mutate({ ...item, status }); + }); + + const handlePrint = () => window.open(`${baseURL}/spreadsheets/${item._id}`, '_blank'); + + const handleExecute = () => handleChangeStatus('executed'); + const handleCancel = () => handleChangeStatus('cancelled'); + + const executed = item.status === 'executed'; + + return ( +
+
+ + + Итоговая сумма: ${item.total} + +
+
+ ); +}; + +export default WaybillPanel; diff --git a/src/services/waybills/index.ts b/src/services/waybills/index.ts new file mode 100644 index 0000000..f8a4be6 --- /dev/null +++ b/src/services/waybills/index.ts @@ -0,0 +1,27 @@ +import Form from './WaybillForm'; +import Panel from './WaybillPanel'; +import { waybillStatusNames, operationNames } from '../constants'; + +const service = { + route: 'waybills', + name: 'Накладные', + nameSingular: 'Накладная', + tableFields: [ + { + key: 'status', + label: 'Статус', + transform: (status: 'waiting' | 'executed' | 'cancelled') => waybillStatusNames[status], + }, + { key: 'operation', label: 'Операция', transform: (op: 'in' | 'out') => operationNames[op] }, + { key: 'total', label: 'Сумма' }, + { key: 'contractor.name', label: 'Контрагент' }, + ], + default: { + operation: 'in', + records: [], + }, + Form, + Panel, +}; + +export default service; -- cgit v1.2.3