mirror of
https://github.com/bigcapitalhq/bigcapital.git
synced 2026-02-17 13:20:31 +00:00
feat: Bad Debt.
This commit is contained in:
121
src/containers/Dialogs/BadDebtDialog/BadDebtFormFields.js
Normal file
121
src/containers/Dialogs/BadDebtDialog/BadDebtFormFields.js
Normal file
@@ -0,0 +1,121 @@
|
||||
import React from 'react';
|
||||
import { FastField, ErrorMessage } from 'formik';
|
||||
import { FormattedMessage as T } from 'components';
|
||||
|
||||
import { useAutofocus } from 'hooks';
|
||||
import {
|
||||
Classes,
|
||||
FormGroup,
|
||||
TextArea,
|
||||
ControlGroup,
|
||||
Callout,
|
||||
Intent,
|
||||
} from '@blueprintjs/core';
|
||||
import classNames from 'classnames';
|
||||
import { CLASSES } from 'common/classes';
|
||||
import { ACCOUNT_TYPE } from 'common/accountTypes';
|
||||
import { inputIntent } from 'utils';
|
||||
import {
|
||||
AccountsSuggestField,
|
||||
InputPrependText,
|
||||
MoneyInputGroup,
|
||||
FieldRequiredHint,
|
||||
} from 'components';
|
||||
|
||||
import { useBadDebtContext } from './BadDebtFormProvider';
|
||||
|
||||
/**
|
||||
* Bad debt form fields.
|
||||
*/
|
||||
function BadDebtFormFields() {
|
||||
const amountfieldRef = useAutofocus();
|
||||
|
||||
const { accounts } = useBadDebtContext();
|
||||
|
||||
return (
|
||||
<div className={Classes.DIALOG_BODY}>
|
||||
<Callout intent={Intent.PRIMARY}>
|
||||
<p>
|
||||
<T id={'badDebt_the_seller_can_charge_the_amount_of_an_invoice'} />
|
||||
</p>
|
||||
</Callout>
|
||||
|
||||
{/*------------ Written-off amount -----------*/}
|
||||
<FastField name={'amount'}>
|
||||
{({
|
||||
form: { values, setFieldValue },
|
||||
field: { value },
|
||||
meta: { error, touched },
|
||||
}) => (
|
||||
<FormGroup
|
||||
label={<T id={'badDebt.label_written_off_amount'} />}
|
||||
labelInfo={<FieldRequiredHint />}
|
||||
className={classNames('form-group--amount', CLASSES.FILL)}
|
||||
intent={inputIntent({ error, touched })}
|
||||
helperText={<ErrorMessage name="amount" />}
|
||||
>
|
||||
<ControlGroup>
|
||||
<InputPrependText text={values.currency_code} />
|
||||
|
||||
<MoneyInputGroup
|
||||
value={value}
|
||||
minimal={true}
|
||||
onChange={(amount) => {
|
||||
setFieldValue('amount', amount);
|
||||
}}
|
||||
intent={inputIntent({ error, touched })}
|
||||
disabled={amountfieldRef}
|
||||
/>
|
||||
</ControlGroup>
|
||||
</FormGroup>
|
||||
)}
|
||||
</FastField>
|
||||
{/*------------ Expense account -----------*/}
|
||||
<FastField name={'expense_account_id'}>
|
||||
{({ form, field: { value }, meta: { error, touched } }) => (
|
||||
<FormGroup
|
||||
label={<T id={'expense_account_id'} />}
|
||||
className={classNames(
|
||||
'form-group--expense_account_id',
|
||||
'form-group--select-list',
|
||||
CLASSES.FILL,
|
||||
)}
|
||||
labelInfo={<FieldRequiredHint />}
|
||||
intent={inputIntent({ error, touched })}
|
||||
helperText={<ErrorMessage name={'expense_account_id'} />}
|
||||
>
|
||||
<AccountsSuggestField
|
||||
selectedAccountId={value}
|
||||
accounts={accounts}
|
||||
onAccountSelected={({ id }) =>
|
||||
form.setFieldValue('expense_account_id', id)
|
||||
}
|
||||
filterByTypes={[ACCOUNT_TYPE.EXPENSE]}
|
||||
/>
|
||||
</FormGroup>
|
||||
)}
|
||||
</FastField>
|
||||
{/*------------ reason -----------*/}
|
||||
<FastField name={'reason'}>
|
||||
{({ field, meta: { error, touched } }) => (
|
||||
<FormGroup
|
||||
label={<T id={'reason'} />}
|
||||
labelInfo={<FieldRequiredHint />}
|
||||
className={'form-group--reason'}
|
||||
intent={inputIntent({ error, touched })}
|
||||
helperText={<ErrorMessage name={'reason'} />}
|
||||
>
|
||||
<TextArea
|
||||
growVertically={true}
|
||||
large={true}
|
||||
intent={inputIntent({ error, touched })}
|
||||
{...field}
|
||||
/>
|
||||
</FormGroup>
|
||||
)}
|
||||
</FastField>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default BadDebtFormFields;
|
||||
Reference in New Issue
Block a user