blob: a10630a5dbce957030bdf1bb2a607a1eb56453a8 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
|
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';
import { Contractor, Transfer } from '../types';
const mapper = (item: Contractor) => ({ key: item._id, label: item.name });
const TransferForm: React.FC<FormikProps<Transfer>> = ({ setFieldValue, values }) => {
const { data: contractors } = hooks.contractors.useList();
const { data: accounts } = hooks.accounts.useList();
if (!values.date) setFieldValue('date', moment().format('YYYY-MM-DD'));
if (!values.contractorId && contractors?.length) setFieldValue('contractorId', contractors[0]._id);
return (
<Form id="form">
<Input name="date" type="date" label="Дата" required />
<div className="grid grid-cols-2">
<Select
name="accountId"
label="Счёт"
options={accounts?.map(mapper)}
required
/>
<Select
name="contractorId"
label="Контрагент"
options={contractors?.map(mapper)}
required
/>
</div>
<div className="grid grid-cols-2">
<Select
name="operation"
label="Операция"
options={[
{ key: 'in', label: 'Приход' },
{ key: 'out', label: 'Расход' },
]}
/>
<Input name="amount" type="number" label="Сумма" required />
</div>
</Form>
);
};
export default TransferForm;
|
