QT/bigcapital
1
0
Fork 0
mirror of https://github.com/bigcapitalhq/bigcapital.git synced 2026-02-16 04:40:32 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: add auto increment/ money in.

Browse Source
This commit is contained in:
elforjani13
2021-10-24 20:01:10 +02:00
parent 26080889df
commit 9ecc7f58e7
7 changed files with 283 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
src/containers/Dialogs/MoneyInDialog/MoneyInForm.js
View File

@@ -14,10 +14,11 @@ import { CreateMoneyInFormSchema } from './MoneyInForm.schema';
import { useMoneyInDailogContext } from './MoneyInDialogProvider';
import withSettings from 'containers/Settings/withSettings';
import withDialogActions from 'containers/Dialog/withDialogActions';
import withCurrentOrganization from 'containers/Organization/withCurrentOrganization';
import { compose } from 'utils';
import { compose, transactionNumber } from 'utils';
const defaultInitialValues = {
date: moment(new Date()).format('YYYY-MM-DD'),
@@ -37,6 +38,11 @@ function MoneyInForm({
// #withCurrentOrganization
organization: { base_currency },
// #withSettings
transactionNextNumber,
transactionNumberPrefix,
transactionIncrementMode,
}) {
const {
dialogName,
@@ -46,11 +52,20 @@ function MoneyInForm({
submitPayload,
} = useMoneyInDailogContext();
// transaction number.
const transactionNo = transactionNumber(
transactionNumberPrefix,
transactionNextNumber,
);
// Initial form values.
const initialValues = {
...defaultInitialValues,
currency_code: base_currency,
transaction_type: accountType,
...(transactionIncrementMode && {
transaction_number: transactionNo,
}),
cashflow_account_id: accountId,
};
@@ -91,4 +106,9 @@ function MoneyInForm({
export default compose(
withDialogActions,
withCurrentOrganization(),
withSettings(({ cashflowSetting }) => ({
transactionNextNumber: cashflowSetting?.nextNumber,
transactionNumberPrefix: cashflowSetting?.numberPrefix,
transactionIncrementMode: cashflowSetting?.autoIncrement,
})),
)(MoneyInForm);

2
src/containers/Dialogs/MoneyInDialog/MoneyInFormContent.js
View File

@@ -2,6 +2,7 @@ import React from 'react';
import { Form } from 'formik';
import MoneyInFormFields from './MoneyInFormFields';
import MoneyInFormDialog from './MoneyInFormDialog';
import MoneyInFloatingActions from './MoneyInFloatingActions';
/**
@@ -11,6 +12,7 @@ export default function MoneyInFormContent() {
return (
<Form>
<MoneyInFormFields />
<MoneyInFormDialog />
<MoneyInFloatingActions />
</Form>
);

28
src/containers/Dialogs/MoneyInDialog/MoneyInFormDialog.js Normal file
View File

@@ -0,0 +1,28 @@
import React from 'react';
import { useFormikContext } from 'formik';
import TransactionNumberDialog from '../../Dialogs/TransactionNumberDialog';
/**
* Moneny in / transaction number form dialog.
*/
export default function MoneyInFormDialog() {
const { setFieldValue } = useFormikContext();
// Update the form once the transaction number form submit confirm.
const handleTransactionNumberFormConfirm = ({
incrementNumber,
manually,
}) => {
setFieldValue('transaction_number', incrementNumber || '');
setFieldValue('transaction_number_manually', manually);
};
return (
<React.Fragment>
<TransactionNumberDialog
dialogName={'transaction-number-form'}
onConfirm={handleTransactionNumberFormConfirm}
/>
</React.Fragment>
);
}

79
src/containers/Dialogs/MoneyInDialog/OtherIncome/OtherIncomeFormFields.js
View File

@@ -15,8 +15,10 @@ import {
InputPrependText,
MoneyInputGroup,
FieldRequiredHint,
Icon,
Col,
Row,
InputPrependButton,
} from 'components';
import { DateInput } from '@blueprintjs/datetime';
import { useAutofocus } from 'hooks';
@@ -27,19 +29,56 @@ import {
momentFormatter,
tansformDateValue,
handleDateChange,
compose,
} from 'utils';
import { CLASSES } from 'common/classes';
import { useMoneyInDailogContext } from '../MoneyInDialogProvider';
import { useObserveTransactionNoSettings } from '../utils';
import withSettings from 'containers/Settings/withSettings';
import withDialogActions from 'containers/Dialog/withDialogActions';
/**
* Other income form fields.
*/
function OtherIncomeFormFields() {
function OtherIncomeFormFields({
// #withDialogActions
openDialog,
// #withSettings
transactionAutoIncrement,
transactionNumberPrefix,
transactionNextNumber,
}) {
// Money in dialog context.
const { accounts } = useMoneyInDailogContext();
const amountFieldRef = useAutofocus();
// Handle tranaction number changing.
const handleTransactionNumberChange = () => {
openDialog('transaction-number-form');
};
// Handle transaction no. field blur.
const handleTransactionNoBlur = (form, field) => (event) => {
const newValue = event.target.value;
if (field.value !== newValue && transactionAutoIncrement) {
openDialog('transaction-number-form', {
initialFormValues: {
manualTransactionNo: newValue,
incrementMode: 'manual-transaction',
},
});
}
};
// Syncs transaction number settings with form.
useObserveTransactionNoSettings(
transactionNumberPrefix,
transactionNextNumber,
);
return (
<React.Fragment>
<Row>
@@ -81,10 +120,31 @@ function OtherIncomeFormFields() {
helperText={<ErrorMessage name="transaction_number" />}
className={'form-group--transaction_number'}
>
<InputGroup
intent={inputIntent({ error, touched })}
{...field}
/>
<ControlGroup fill={true}>
<InputGroup
minimal={true}
value={field.value}
asyncControl={true}
onBlur={handleTransactionNoBlur(form, field)}
/>
<InputPrependButton
buttonProps={{
onClick: handleTransactionNumberChange,
icon: <Icon icon={'settings-18'} />,
}}
tooltip={true}
tooltipProps={{
content: (
<T
id={
'cash_flow.setting_your_auto_generated_transaction_number'
}
/>
),
position: Position.BOTTOM_LEFT,
}}
/>
</ControlGroup>
</FormGroup>
)}
</FastField>
@@ -191,4 +251,11 @@ function OtherIncomeFormFields() {
);
}
export default OtherIncomeFormFields;
export default compose(
withDialogActions,
withSettings(({ cashflowSetting }) => ({
transactionAutoIncrement: cashflowSetting?.autoIncrement,
transactionNextNumber: cashflowSetting?.nextNumber,
transactionNumberPrefix: cashflowSetting?.numberPrefix,
})),
)(OtherIncomeFormFields);

81
src/containers/Dialogs/MoneyInDialog/OwnerContribution/OwnerContributionFormFields.js
View File

@@ -15,8 +15,10 @@ import {
InputPrependText,
MoneyInputGroup,
FieldRequiredHint,
Icon,
Col,
Row,
InputPrependButton,
} from 'components';
import { DateInput } from '@blueprintjs/datetime';
import { useAutofocus } from 'hooks';
@@ -26,18 +28,57 @@ import {
momentFormatter,
tansformDateValue,
handleDateChange,
compose
} from 'utils';
import { CLASSES } from 'common/classes';
import { useMoneyInDailogContext } from '../MoneyInDialogProvider';
import { useObserveTransactionNoSettings } from '../utils';
import withSettings from 'containers/Settings/withSettings';
import withDialogActions from 'containers/Dialog/withDialogActions';
/**
/**
* Owner contribution form fields.
*/
function OwnerContributionFormFields() {
function OwnerContributionFormFields({
// #withDialogActions
openDialog,
// #withSettings
transactionAutoIncrement,
transactionNumberPrefix,
transactionNextNumber,
}) {
// Money in dialog context.
const { accounts } = useMoneyInDailogContext();
const amountFieldRef = useAutofocus();
// Handle tranaction number changing.
const handleTransactionNumberChange = () => {
openDialog('transaction-number-form');
};
// Handle transaction no. field blur.
const handleTransactionNoBlur = (form, field) => (event) => {
const newValue = event.target.value;
if (field.value !== newValue && transactionAutoIncrement) {
openDialog('transaction-number-form', {
initialFormValues: {
manualTransactionNo: newValue,
incrementMode: 'manual-transaction',
},
});
}
};
// Syncs transaction number settings with form.
useObserveTransactionNoSettings(
transactionNumberPrefix,
transactionNextNumber,
);
return (
<React.Fragment>
<Row>
@@ -79,10 +120,31 @@ function OwnerContributionFormFields() {
helperText={<ErrorMessage name="transaction_number" />}
className={'form-group--transaction_number'}
>
<InputGroup
intent={inputIntent({ error, touched })}
{...field}
/>
<ControlGroup fill={true}>
<InputGroup
minimal={true}
value={field.value}
asyncControl={true}
onBlur={handleTransactionNoBlur(form, field)}
/>
<InputPrependButton
buttonProps={{
onClick: handleTransactionNumberChange,
icon: <Icon icon={'settings-18'} />,
}}
tooltip={true}
tooltipProps={{
content: (
<T
id={
'cash_flow.setting_your_auto_generated_transaction_number'
}
/>
),
position: Position.BOTTOM_LEFT,
}}
/>
</ControlGroup>
</FormGroup>
)}
</FastField>
@@ -187,4 +249,11 @@ function OwnerContributionFormFields() {
);
}
export default OwnerContributionFormFields;
export default compose(
withDialogActions,
withSettings(({ cashflowSetting }) => ({
transactionAutoIncrement: cashflowSetting?.autoIncrement,
transactionNextNumber: cashflowSetting?.nextNumber,
transactionNumberPrefix: cashflowSetting?.numberPrefix,
})),
)(OwnerContributionFormFields);

78
src/containers/Dialogs/MoneyInDialog/TransferFromAccount/TransferFromAccountFormFields.js
View File

@@ -15,8 +15,10 @@ import {
InputPrependText,
MoneyInputGroup,
FieldRequiredHint,
Icon,
Col,
Row,
InputPrependButton,
} from 'components';
import { DateInput } from '@blueprintjs/datetime';
import { useAutofocus } from 'hooks';
@@ -27,19 +29,55 @@ import {
momentFormatter,
tansformDateValue,
handleDateChange,
compose,
} from 'utils';
import { CLASSES } from 'common/classes';
import { useMoneyInDailogContext } from '../MoneyInDialogProvider';
import { useObserveTransactionNoSettings } from '../utils';
import withSettings from 'containers/Settings/withSettings';
import withDialogActions from 'containers/Dialog/withDialogActions';
/**
* Transfer from account form fields.
*/
function TransferFromAccountFormFields() {
function TransferFromAccountFormFields({
// #withDialogActions
openDialog,
// #withSettings
transactionAutoIncrement,
transactionNumberPrefix,
transactionNextNumber,
}) {
// Money in dialog context.
const { accounts } = useMoneyInDailogContext();
const amountFieldRef = useAutofocus();
// Handle tranaction number changing.
const handleTransactionNumberChange = () => {
openDialog('transaction-number-form');
};
// Handle transaction no. field blur.
const handleTransactionNoBlur = (form, field) => (event) => {
const newValue = event.target.value;
if (field.value !== newValue && transactionAutoIncrement) {
openDialog('transaction-number-form', {
initialFormValues: {
manualTransactionNo: newValue,
incrementMode: 'manual-transaction',
},
});
}
};
// Syncs transaction number settings with form.
useObserveTransactionNoSettings(
transactionNumberPrefix,
transactionNextNumber,
);
return (
<React.Fragment>
<Row>
@@ -81,10 +119,31 @@ function TransferFromAccountFormFields() {
helperText={<ErrorMessage name="transaction_number" />}
className={'form-group--transaction_number'}
>
<InputGroup
intent={inputIntent({ error, touched })}
{...field}
/>
<ControlGroup fill={true}>
<InputGroup
minimal={true}
value={field.value}
asyncControl={true}
onBlur={handleTransactionNoBlur(form, field)}
/>
<InputPrependButton
buttonProps={{
onClick: handleTransactionNumberChange,
icon: <Icon icon={'settings-18'} />,
}}
tooltip={true}
tooltipProps={{
content: (
<T
id={
'cash_flow.setting_your_auto_generated_transaction_number'
}
/>
),
position: Position.BOTTOM_LEFT,
}}
/>
</ControlGroup>
</FormGroup>
)}
</FastField>
@@ -194,4 +253,11 @@ function TransferFromAccountFormFields() {
);
}
export default TransferFromAccountFormFields;
export default compose(
withDialogActions,
withSettings(({ cashflowSetting }) => ({
transactionAutoIncrement: cashflowSetting?.autoIncrement,
transactionNextNumber: cashflowSetting?.nextNumber,
transactionNumberPrefix: cashflowSetting?.numberPrefix,
})),
)(TransferFromAccountFormFields);

12
src/containers/Dialogs/MoneyInDialog/utils.js Normal file
View File

@@ -0,0 +1,12 @@
import React from 'react';
import { useFormikContext } from 'formik';
import { transactionNumber } from 'utils';
export const useObserveTransactionNoSettings = (prefix, nextNumber) => {
const { setFieldValue } = useFormikContext();
React.useEffect(() => {
const TransactionNo = transactionNumber(prefix, nextNumber);
setFieldValue('transacttion_numner', TransactionNo);
}, [setFieldValue, prefix, nextNumber]);
};