fix: auto-increment settings

This commit is contained in:
a.bouhuolia
2023-05-22 21:57:43 +02:00
parent d369f0bb17
commit 40ef02f215
22 changed files with 635 additions and 582 deletions

View File

@@ -118,7 +118,6 @@ function MakeJournalEntriesForm({
entries: R.compose(orderingLinesIndexes)(entries),
publish: submitPayload.publish,
};
// Handle the request error.
const handleError = ({
response: {
@@ -149,7 +148,6 @@ function MakeJournalEntriesForm({
resetForm();
}
};
if (isNewMode) {
createJournalMutate(form).then(handleSuccess).catch(handleError);
} else {

View File

@@ -6,14 +6,14 @@ import {
Position,
ControlGroup,
} from '@blueprintjs/core';
import { FastField, ErrorMessage } from 'formik';
import { FastField, ErrorMessage, useFormikContext } from 'formik';
import { DateInput } from '@blueprintjs/datetime';
import * as R from 'ramda';
import classNames from 'classnames';
import { CLASSES } from '@/constants/classes';
import {
momentFormatter,
compose,
inputIntent,
handleDateChange,
tansformDateValue,
@@ -34,37 +34,89 @@ import { currenciesFieldShouldUpdate } from './utils';
import withSettings from '@/containers/Settings/withSettings';
import withDialogActions from '@/containers/Dialog/withDialogActions';
/**
* Journal number field of make journal form.
*/
const MakeJournalTransactionNoField = R.compose(
withDialogActions,
withSettings(({ manualJournalsSettings }) => ({
journalAutoIncrement: manualJournalsSettings?.autoIncrement,
})),
)(
({
// #withDialog
openDialog,
// #withSettings
journalAutoIncrement,
}) => {
const { setFieldValue, values } = useFormikContext();
// Handle journal number change.
const handleJournalNumberChange = () => {
openDialog('journal-number-form');
};
// Handle journal number blur.
const handleJournalNoBlur = (event) => {
const newValue = event.target.value;
if (values.journal_number !== newValue && journalAutoIncrement) {
openDialog('journal-number-form', {
initialFormValues: {
onceManualNumber: newValue,
incrementMode: 'manual-transaction',
},
});
}
if (!journalAutoIncrement) {
setFieldValue('journal_number', newValue);
setFieldValue('journal_number_manually', newValue);
}
};
return (
<FormGroup
name={'journal_number'}
label={<T id={'journal_no'} />}
labelInfo={
<>
<FieldRequiredHint />
<FieldHint />
</>
}
fill={true}
inline={true}
>
<ControlGroup fill={true}>
<InputGroup
fill={true}
value={values.journal_number}
asyncControl={true}
onBlur={handleJournalNoBlur}
/>
<InputPrependButton
buttonProps={{
onClick: handleJournalNumberChange,
icon: <Icon icon={'settings-18'} />,
}}
tooltip={true}
tooltipProps={{
content: <T id={'setting_your_auto_generated_journal_number'} />,
position: Position.BOTTOM_LEFT,
}}
/>
</ControlGroup>
</FormGroup>
);
},
);
/**
* Make journal entries header.
*/
function MakeJournalEntriesHeader({
// #withDialog
openDialog,
// #withSettings
journalAutoIncrement,
}) {
export default function MakeJournalEntriesHeader({}) {
const { currencies } = useMakeJournalFormContext();
// Handle journal number change.
const handleJournalNumberChange = () => {
openDialog('journal-number-form');
};
// Handle journal number blur.
const handleJournalNoBlur = (form, field) => (event) => {
const newValue = event.target.value;
if (field.value !== newValue && journalAutoIncrement) {
openDialog('journal-number-form', {
initialFormValues: {
manualTransactionNo: newValue,
incrementMode: 'manual-transaction',
},
});
}
};
return (
<div className={classNames(CLASSES.PAGE_FORM_HEADER_FIELDS)}>
{/*------------ Posting date -----------*/}
@@ -98,46 +150,7 @@ function MakeJournalEntriesHeader({
</FastField>
{/*------------ Journal number -----------*/}
<FastField name={'journal_number'}>
{({ form, field, meta: { error, touched } }) => (
<FormGroup
label={<T id={'journal_no'} />}
labelInfo={
<>
<FieldRequiredHint />
<FieldHint />
</>
}
className={'form-group--journal-number'}
intent={inputIntent({ error, touched })}
helperText={<ErrorMessage name="journal_number" />}
fill={true}
inline={true}
>
<ControlGroup fill={true}>
<InputGroup
fill={true}
value={field.value}
asyncControl={true}
onBlur={handleJournalNoBlur(form, field)}
/>
<InputPrependButton
buttonProps={{
onClick: handleJournalNumberChange,
icon: <Icon icon={'settings-18'} />,
}}
tooltip={true}
tooltipProps={{
content: (
<T id={'setting_your_auto_generated_journal_number'} />
),
position: Position.BOTTOM_LEFT,
}}
/>
</ControlGroup>
</FormGroup>
)}
</FastField>
<MakeJournalTransactionNoField />
{/*------------ Reference -----------*/}
<FastField name={'reference'}>
@@ -211,10 +224,3 @@ function MakeJournalEntriesHeader({
</div>
);
}
export default compose(
withDialogActions,
withSettings(({ manualJournalsSettings }) => ({
journalAutoIncrement: manualJournalsSettings?.autoIncrement,
})),
)(MakeJournalEntriesHeader);

View File

@@ -10,9 +10,9 @@ export default function MakeJournalFormDialogs() {
const { setFieldValue } = useFormikContext();
// Update the form once the journal number form submit confirm.
const handleConfirm = ({ manually, incrementNumber }) => {
setFieldValue('journal_number', incrementNumber || '');
setFieldValue('journal_number_manually', manually);
const handleConfirm = (settings) => {
setFieldValue('journal_number', settings.transactionNumber);
setFieldValue('journal_number_manually', settings.transactionNumber);
};
return (

View File

@@ -65,7 +65,6 @@ function CreditNoteNumberDialogContent({
const handleChange = (values) => {
setReferenceFormValues(values);
};
// Description.
const description =
referenceFormValues?.incrementMode === 'auto'

View File

@@ -2,15 +2,29 @@
import React, { useMemo } from 'react';
import * as Yup from 'yup';
import { Formik, Form } from 'formik';
import { FormattedMessage as T } from '@/components';
import { Intent, Button, Classes } from '@blueprintjs/core';
import '@/style/pages/ReferenceNumber/ReferenceNumber.scss';
import { FormObserver } from '@/components';
import { FormattedMessage as T, FormObserver } from '@/components';
import ReferenceNumberFormContent from './ReferenceNumberFormContent';
import { transformValuesToForm } from './utils';
import { saveInvoke } from '@/utils';
import { saveInvoke, transformToForm } from '@/utils';
const initialFormValues = {
incrementMode: 'auto',
numberPrefix: '',
nextNumber: '',
onceManualNumber: '',
};
// Validation schema.
const validationSchema = Yup.object().shape({
incrementMode: Yup.string(),
numberPrefix: Yup.string(),
nextNumber: Yup.number(),
onceManualNumber: Yup.string(),
});
/**
* Reference number form.
@@ -22,29 +36,15 @@ export default function ReferenceNumberForm({
onClose,
onChange,
}) {
// Validation schema.
const validationSchema = Yup.object().shape({
incrementMode: Yup.string(),
numberPrefix: Yup.string(),
nextNumber: Yup.number(),
manualTransactionNo: Yup.string(),
});
// Initial values.
const formInitialValues = useMemo(
() => ({
...initialValues,
incrementMode:
initialValues.incrementMode === 'auto' &&
initialValues.manualTransactionNo
? 'manual-transaction'
: initialValues.incrementMode,
}),
[initialValues],
);
const formInitialValues = {
...initialFormValues,
...transformToForm(initialValues, initialFormValues),
};
// Handle the form submit.
const handleSubmit = (values, methods) => {
const parsed = transformValuesToForm(values);
saveInvoke(onSubmit, { ...parsed, ...values }, methods);
saveInvoke(onSubmit, { ...values, ...parsed }, methods);
};
return (

View File

@@ -1,17 +1,15 @@
// @ts-nocheck
import React from 'react';
import { FastField, useFormikContext } from 'formik';
import { FormattedMessage as T } from '@/components';
import { FormGroup, InputGroup, Radio } from '@blueprintjs/core';
import { If, Row, Col, ErrorMessage } from '@/components';
import { FormattedMessage as T, Row, Col, ErrorMessage } from '@/components';
import { inputIntent } from '@/utils';
/**
* Reference number form content.
*/
export default function ReferenceNumberFormContent() {
const { values } = useFormikContext();
return (
<>
{/* ------------- Auto increment mode ------------- */}
@@ -27,54 +25,13 @@ export default function ReferenceNumberFormContent() {
/>
)}
</FastField>
<If condition={values.incrementMode === 'auto'}>
<Row>
{/* ------------- Prefix ------------- */}
<Col xs={4}>
<FastField name={'numberPrefix'}>
{({ form, field, meta: { error, touched } }) => (
<FormGroup
label={<T id={'prefix'} />}
className={'form-group--'}
intent={inputIntent({ error, touched })}
helperText={<ErrorMessage name={'numberPrefix'} />}
>
<InputGroup
intent={inputIntent({ error, touched })}
{...field}
/>
</FormGroup>
)}
</FastField>
</Col>
{/* ------------- Next number ------------- */}
<Col xs={6}>
<FastField name={'nextNumber'}>
{({ form, field, meta: { error, touched } }) => (
<FormGroup
label={<T id={'next_number'} />}
className={'form-group--next-number'}
intent={inputIntent({ error, touched })}
helperText={<ErrorMessage name={'nextNumber'} />}
>
<InputGroup
intent={inputIntent({ error, touched })}
{...field}
/>
</FormGroup>
)}
</FastField>
</Col>
</Row>
</If>
<ReferenceNumberAutoIncrement />
{/* ------------- Manual increment mode ------------- */}
<FastField name={'incrementMode'}>
{({ form, field, meta: { error, touched } }) => (
<Radio
label={<T id={'auto_increment.field.manual_this_transaction'} />}
label={<T id={'auto_increment.field.manually'} />}
value="manual"
onChange={() => {
form.setFieldValue('incrementMode', 'manual');
@@ -85,20 +42,70 @@ export default function ReferenceNumberFormContent() {
</FastField>
{/* ------------- Transaction manual increment mode ------------- */}
<If condition={values.manualTransactionNo}>
<FastField name={'incrementMode'}>
{({ form, field, meta: { error, touched } }) => (
<Radio
label={<T id={'auto_increment.field.manually'} />}
value="manual"
onChange={() => {
form.setFieldValue('incrementMode', 'manual-transaction');
}}
checked={field.value === 'manual-transaction'}
/>
)}
</FastField>
</If>
<ReferenceNumberManualOnce />
</>
);
}
function ReferenceNumberAutoIncrement() {
const { values } = useFormikContext();
if (!values.incrementMode === 'auto') return null;
return (
<Row>
{/* ------------- Prefix ------------- */}
<Col xs={4}>
<FastField name={'numberPrefix'}>
{({ form, field, meta: { error, touched } }) => (
<FormGroup
label={<T id={'prefix'} />}
className={'form-group--'}
intent={inputIntent({ error, touched })}
helperText={<ErrorMessage name={'numberPrefix'} />}
>
<InputGroup intent={inputIntent({ error, touched })} {...field} />
</FormGroup>
)}
</FastField>
</Col>
{/* ------------- Next number ------------- */}
<Col xs={6}>
<FastField name={'nextNumber'}>
{({ form, field, meta: { error, touched } }) => (
<FormGroup
label={<T id={'next_number'} />}
className={'form-group--next-number'}
intent={inputIntent({ error, touched })}
helperText={<ErrorMessage name={'nextNumber'} />}
>
<InputGroup intent={inputIntent({ error, touched })} {...field} />
</FormGroup>
)}
</FastField>
</Col>
</Row>
);
}
function ReferenceNumberManualOnce() {
const { values } = useFormikContext();
// Do not show the field if the one manual transaction number is not presented.
if (!values.onceManualNumber) return null;
return (
<FastField name={'incrementMode'}>
{({ form, field, meta: { error, touched } }) => (
<Radio
label={<T id={'auto_increment.field.manual_this_transaction'} />}
value="manual"
onChange={() => {
form.setFieldValue('incrementMode', 'manual-transaction');
}}
checked={field.value === 'manual-transaction'}
/>
)}
</FastField>
);
}

View File

@@ -5,6 +5,7 @@ import {
transfromToSnakeCase,
transactionNumber,
} from '@/utils';
import { omit } from 'lodash';
export const defaultInvoiceNoSettings = {
nextNumber: '',
@@ -13,7 +14,7 @@ export const defaultInvoiceNoSettings = {
};
export const transformSettingsToForm = (settings) => ({
...settings,
...omit(settings, ['autoIncrement']),
incrementMode: settings.autoIncrement ? 'auto' : 'manual',
});
@@ -25,13 +26,21 @@ export const transformFormToSettings = (values, group) => {
return optionsMapToArray(options).map((option) => ({ ...option, group }));
};
/**
* Transaction number returns auto-increment if the increment mode is auto or
* returns empty string if the increment mode is manually or returns the entered
* manual text if the increment mode is manual once just in this transaction.
*/
export const transformValuesToForm = (values) => {
const incrementNumber =
const autoIncrementNumber = transactionNumber(
values.numberPrefix,
values.nextNumber,
);
const _transactionNumber =
values.incrementMode === 'auto'
? transactionNumber(values.numberPrefix, values.nextNumber)
: values.manualTransactionNo;
const manually = values.incrementMode === 'auto' ? false : true;
return { incrementNumber, manually };
? autoIncrementNumber
: values.incrementMode === 'manual-transaction'
? values.onceManualNumber
: '';
return { transactionNumber: _transactionNumber };
};

View File

@@ -1,25 +1,24 @@
// @ts-nocheck
import React from 'react';
import CreditNoteNumberDialog from '@/containers/Dialogs/CreditNoteNumberDialog';
import { useFormikContext } from 'formik';
import CreditNoteNumberDialog from '@/containers/Dialogs/CreditNoteNumberDialog';
/**
* Credit note form dialogs.
*/
export default function CreditNoteFormDialogs() {
const { setFieldValue } = useFormikContext();
// Update the form once the credit number form submit confirm.
const handleCreditNumberFormConfirm = ({ incrementNumber, manually }) => {
setFieldValue('credit_note_number', incrementNumber || '');
setFieldValue('credit_note_no_manually', manually);
const handleCreditNumberFormConfirm = (settings) => {
setFieldValue('credit_note_number', settings.transactionNumber);
setFieldValue('credit_note_no_manually', settings.transactionNumber);
};
const { setFieldValue } = useFormikContext();
return (
<React.Fragment>
<CreditNoteNumberDialog
dialogName={'credit-number-form'}
onConfirm={handleCreditNumberFormConfirm}
/>
</React.Fragment>
<CreditNoteNumberDialog
dialogName={'credit-number-form'}
onConfirm={handleCreditNumberFormConfirm}
/>
);
}

View File

@@ -1,5 +1,6 @@
// @ts-nocheck
import React from 'react';
import * as R from 'ramda';
import classNames from 'classnames';
import styled from 'styled-components';
import {
@@ -9,7 +10,8 @@ import {
ControlGroup,
} from '@blueprintjs/core';
import { DateInput } from '@blueprintjs/datetime';
import { FastField, Field, ErrorMessage } from 'formik';
import { FastField, Field, ErrorMessage, useFormikContext } from 'formik';
import { CLASSES } from '@/constants/classes';
import {
CustomerSelectField,
@@ -18,10 +20,9 @@ import {
Icon,
FormattedMessage as T,
CustomerDrawerLink,
FFormGroup,
} from '@/components';
import {
customerNameFieldShouldUpdate,
} from './utils';
import { customerNameFieldShouldUpdate } from './utils';
import { useCreditNoteFormContext } from './CreditNoteFormProvider';
import withSettings from '@/containers/Settings/withSettings';
@@ -29,44 +30,93 @@ import withDialogActions from '@/containers/Dialog/withDialogActions';
import { CreditNoteExchangeRateInputField } from './components';
import {
momentFormatter,
compose,
tansformDateValue,
inputIntent,
handleDateChange,
} from '@/utils';
/**
* Credit note transaction number field.
*/
const CreditNoteTransactionNoField = R.compose(
withDialogActions,
withSettings(({ creditNoteSettings }) => ({
creditAutoIncrement: creditNoteSettings?.autoIncrement,
creditNextNumber: creditNoteSettings?.nextNumber,
creditNumberPrefix: creditNoteSettings?.numberPrefix,
})),
)(
({
// #withDialogActions
openDialog,
// #withSettings
creditAutoIncrement,
}) => {
const { values, setFieldValue } = useFormikContext();
// Handle credit number changing.
const handleCreditNumberChange = () => {
openDialog('credit-number-form');
};
// Handle credit no. field blur.
const handleCreditNoBlur = (event) => {
const newValue = event.target.value;
if (values.credit_note_no !== newValue && creditAutoIncrement) {
openDialog('credit-number-form', {
initialFormValues: {
onceManualNumber: newValue,
incrementMode: 'manual-transaction',
},
});
}
if (!creditAutoIncrement) {
setFieldValue('credit_note_number', newValue);
setFieldValue('credit_note_number_manually', newValue);
}
};
return (
<FFormGroup
name={'credit_note_number'}
label={<T id={'credit_note.label_credit_note'} />}
labelInfo={<FieldRequiredHint />}
inline={true}
>
<ControlGroup fill={true}>
<InputGroup
minimal={true}
value={values.credit_note_number}
asyncControl={true}
onBlur={handleCreditNoBlur}
/>
<InputPrependButton
buttonProps={{
onClick: handleCreditNumberChange,
icon: <Icon icon={'settings-18'} />,
}}
tooltip={true}
tooltipProps={{
content: (
<T id={'setting_your_auto_generated_credit_note_number'} />
),
position: Position.BOTTOM_LEFT,
}}
/>
</ControlGroup>
</FFormGroup>
);
},
);
/**
* Credit note form header fields.
*/
function CreditNoteFormHeaderFields({
// #withDialogActions
openDialog,
// #withSettings
creditAutoIncrement,
}) {
export default function CreditNoteFormHeaderFields({}) {
// Credit note form context.
const { customers } = useCreditNoteFormContext();
// Handle credit number changing.
const handleCreditNumberChange = () => {
openDialog('credit-number-form');
};
// Handle credit no. field blur.
const handleCreditNoBlur = (form, field) => (event) => {
const newValue = event.target.value;
if (field.value !== newValue && creditAutoIncrement) {
openDialog('credit-number-form', {
initialFormValues: {
manualTransactionNo: newValue,
incrementMode: 'manual-transaction',
},
});
}
};
return (
<div className={classNames(CLASSES.PAGE_FORM_HEADER_FIELDS)}>
{/* ----------- Customer name ----------- */}
@@ -140,43 +190,8 @@ function CreditNoteFormHeaderFields({
)}
</FastField>
{/* ----------- Credit note # ----------- */}
<Field name={'credit_note_number'}>
{({ form, field, meta: { error, touched } }) => (
<FormGroup
label={<T id={'credit_note.label_credit_note'} />}
labelInfo={<FieldRequiredHint />}
inline={true}
className={classNames(
'form-group--credit_note_number',
CLASSES.FILL,
)}
intent={inputIntent({ error, touched })}
helperText={<ErrorMessage name="credit_note_number" />}
>
<ControlGroup fill={true}>
<InputGroup
minimal={true}
value={field.value}
asyncControl={true}
onBlur={handleCreditNoBlur(form, field)}
/>
<InputPrependButton
buttonProps={{
onClick: handleCreditNumberChange,
icon: <Icon icon={'settings-18'} />,
}}
tooltip={true}
tooltipProps={{
content: (
<T id={'setting_your_auto_generated_credit_note_number'} />
),
position: Position.BOTTOM_LEFT,
}}
/>
</ControlGroup>
</FormGroup>
)}
</Field>
<CreditNoteTransactionNoField />
{/* ----------- Reference ----------- */}
<FastField name={'reference_no'}>
{({ field, meta: { error, touched } }) => (
@@ -194,14 +209,6 @@ function CreditNoteFormHeaderFields({
</div>
);
}
export default compose(
withDialogActions,
withSettings(({ creditNoteSettings }) => ({
creditAutoIncrement: creditNoteSettings?.autoIncrement,
creditNextNumber: creditNoteSettings?.nextNumber,
creditNumberPrefix: creditNoteSettings?.numberPrefix,
})),
)(CreditNoteFormHeaderFields);
const CustomerButtonLink = styled(CustomerDrawerLink)`
font-size: 11px;

View File

@@ -161,7 +161,11 @@ function EstimateForm({
<EstimateItemsEntriesField />
<EstimateFormFooter />
<EstimateFloatingActions />
{/*------- Dialogs -------*/}
<EstimateFormDialogs />
{/*------- Effects -------*/}
<EstimateIncrementSyncSettingsToForm />
</Form>
</Formik>

View File

@@ -10,9 +10,9 @@ export default function EstimateFormDialogs() {
const { setFieldValue } = useFormikContext();
// Update the form once the invoice number form submit confirm.
const handleEstimateNumberFormConfirm = ({ incrementNumber, manually }) => {
setFieldValue('estimate_number', incrementNumber || '');
setFieldValue('estimate_number_manually', manually);
const handleEstimateNumberFormConfirm = (settings) => {
setFieldValue('estimate_number', settings.transactionNumber);
setFieldValue('estimate_number_manually', settings.transactionNumber);
};
return (

View File

@@ -10,12 +10,13 @@ import {
ControlGroup,
} from '@blueprintjs/core';
import { DateInput } from '@blueprintjs/datetime';
import * as R from 'ramda';
import { FastField, ErrorMessage, useFormikContext } from 'formik';
import { FeatureCan, FFormGroup, FormattedMessage as T } from '@/components';
import { FastField, Field, ErrorMessage } from 'formik';
import {
momentFormatter,
compose,
tansformDateValue,
inputIntent,
handleDateChange,
@@ -41,37 +42,79 @@ import {
import { useEstimateFormContext } from './EstimateFormProvider';
const EstimateFormEstimateNumberField = R.compose(
withDialogActions,
withSettings(({ estimatesSettings }) => ({
estimateNextNumber: estimatesSettings?.nextNumber,
estimateNumberPrefix: estimatesSettings?.numberPrefix,
estimateAutoIncrement: estimatesSettings?.autoIncrement,
})),
)(
({
// #withDialogActions
openDialog,
// #withSettings
estimateAutoIncrement,
}) => {
const { values, setFieldValue } = useFormikContext();
const handleEstimateNumberBtnClick = () => {
openDialog('estimate-number-form', {});
};
const handleEstimateNoBlur = (event) => {
const newValue = event.target.value;
if (values.estimate_number !== newValue && estimateAutoIncrement) {
openDialog('estimate-number-form', {
initialFormValues: {
onceManualNumber: newValue,
incrementMode: 'manual-transaction',
},
});
}
if (!estimateAutoIncrement) {
setFieldValue('estimate_number', newValue);
setFieldValue('estimate_number_manually', newValue);
}
};
return (
<FFormGroup
name={'estimate_number'}
label={<T id={'estimate'} />}
inline={true}
>
<ControlGroup fill={true}>
<InputGroup
minimal={true}
value={values.estimate_number}
asyncControl={true}
onBlur={handleEstimateNoBlur}
/>
<InputPrependButton
buttonProps={{
onClick: handleEstimateNumberBtnClick,
icon: <Icon icon={'settings-18'} />,
}}
tooltip={true}
tooltipProps={{
content: <T id={'setting_your_auto_generated_estimate_number'} />,
position: Position.BOTTOM_LEFT,
}}
/>
</ControlGroup>
</FFormGroup>
);
},
);
/**
* Estimate form header.
*/
function EstimateFormHeader({
// #withDialogActions
openDialog,
// #withSettings
estimateAutoIncrement,
estimateNumberPrefix,
estimateNextNumber,
}) {
export default function EstimateFormHeader() {
const { customers, projects } = useEstimateFormContext();
const handleEstimateNumberBtnClick = () => {
openDialog('estimate-number-form', {});
};
const handleEstimateNoBlur = (form, field) => (event) => {
const newValue = event.target.value;
if (field.value !== newValue && estimateAutoIncrement) {
openDialog('estimate-number-form', {
initialFormValues: {
manualTransactionNo: newValue,
incrementMode: 'manual-transaction',
},
});
}
};
return (
<div className={classNames(CLASSES.PAGE_FORM_HEADER_FIELDS)}>
{/* ----------- Customer name ----------- */}
@@ -174,40 +217,7 @@ function EstimateFormHeader({
</FastField>
{/* ----------- Estimate number ----------- */}
<Field name={'estimate_number'}>
{({ form, field, meta: { error, touched } }) => (
<FormGroup
label={<T id={'estimate'} />}
inline={true}
className={('form-group--estimate-number', CLASSES.FILL)}
labelInfo={<FieldRequiredHint />}
intent={inputIntent({ error, touched })}
helperText={<ErrorMessage name="estimate_number" />}
>
<ControlGroup fill={true}>
<InputGroup
minimal={true}
value={field.value}
asyncControl={true}
onBlur={handleEstimateNoBlur(form, field)}
/>
<InputPrependButton
buttonProps={{
onClick: handleEstimateNumberBtnClick,
icon: <Icon icon={'settings-18'} />,
}}
tooltip={true}
tooltipProps={{
content: (
<T id={'setting_your_auto_generated_estimate_number'} />
),
position: Position.BOTTOM_LEFT,
}}
/>
</ControlGroup>
</FormGroup>
)}
</Field>
<EstimateFormEstimateNumberField />
{/* ----------- Reference ----------- */}
<FastField name={'reference'}>
@@ -244,15 +254,6 @@ function EstimateFormHeader({
);
}
export default compose(
withDialogActions,
withSettings(({ estimatesSettings }) => ({
estimateNextNumber: estimatesSettings?.nextNumber,
estimateNumberPrefix: estimatesSettings?.numberPrefix,
estimateAutoIncrement: estimatesSettings?.autoIncrement,
})),
)(EstimateFormHeader);
const CustomerButtonLink = styled(CustomerDrawerLink)`
font-size: 11px;
margin-top: 6px;

View File

@@ -71,10 +71,10 @@ function InvoiceForm({
: {
...defaultInvoice,
...(invoiceIncrementMode && {
invoice_no: invoiceNumber,
}),
entries: orderingLinesIndexes(defaultInvoice.entries),
currency_code: base_currency,
invoice_no: invoiceNumber,
}),
entries: orderingLinesIndexes(defaultInvoice.entries),
currency_code: base_currency,
...newInvoice,
}),
};
@@ -140,7 +140,6 @@ function InvoiceForm({
createInvoiceMutate(form).then(onSuccess).catch(onError);
}
};
// Create invoice form schema.
const CreateInvoiceFormSchema = getCreateInvoiceFormSchema();
@@ -168,7 +167,11 @@ function InvoiceForm({
<InvoiceItemsEntriesEditorField />
<InvoiceFormFooter />
<InvoiceFloatingActions />
{/*---------- Dialogs ----------*/}
<InvoiceFormDialogs />
{/*---------- Effects ----------*/}
<InvoiceNoSyncSettingsToForm />
</Form>
</Formik>

View File

@@ -11,9 +11,9 @@ export default function InvoiceFormDialogs() {
const { setFieldValue } = useFormikContext();
// Update the form once the invoice number form submit confirm.
const handleInvoiceNumberFormConfirm = ({ incrementNumber, manually }) => {
setFieldValue('invoice_no', incrementNumber || '');
setFieldValue('invoice_no_manually', manually);
const handleInvoiceNumberFormConfirm = (settings) => {
setFieldValue('invoice_no', settings.transactionNumber);
setFieldValue('invoice_no_manually', settings.transactionNumber);
};
return (

View File

@@ -11,6 +11,7 @@ import {
} from '@blueprintjs/core';
import { DateInput } from '@blueprintjs/datetime';
import { FastField, Field, ErrorMessage, useFormikContext } from 'formik';
import * as R from 'ramda';
import {
FFormGroup,
@@ -23,13 +24,16 @@ import {
Icon,
InputPrependButton,
FeatureCan,
FInputGroup,
} from '@/components';
import { momentFormatter, compose, tansformDateValue } from '@/utils';
import { CLASSES } from '@/constants/classes';
import { inputIntent, handleDateChange } from '@/utils';
import {
customerNameFieldShouldUpdate,
} from './utils';
momentFormatter,
tansformDateValue,
inputIntent,
handleDateChange,
} from '@/utils';
import { CLASSES } from '@/constants/classes';
import { customerNameFieldShouldUpdate } from './utils';
import { useInvoiceFormContext } from './InvoiceFormProvider';
import {
@@ -46,40 +50,88 @@ import { DialogsName } from '@/constants/dialogs';
import withSettings from '@/containers/Settings/withSettings';
import withDialogActions from '@/containers/Dialog/withDialogActions';
/**
* Invoice number field of invoice form.
*/
const InvoiceFormInvoiceNumberField = R.compose(
withDialogActions,
withSettings(({ invoiceSettings }) => ({
invoiceAutoIncrement: invoiceSettings?.autoIncrement,
})),
)(
({
// #withDialogActions
openDialog,
// #withSettings
invoiceAutoIncrement,
}) => {
// Formik context.
const { values, setFieldValue } = useFormikContext();
// Handle invoice number changing.
const handleInvoiceNumberChange = () => {
openDialog(DialogsName.InvoiceNumberSettings);
};
// Handle invoice no. field blur.
const handleInvoiceNoBlur = (event) => {
const newValue = event.target.value;
if (values.invoice_no.value !== newValue && invoiceAutoIncrement) {
openDialog(DialogsName.InvoiceNumberSettings, {
initialFormValues: {
onceManualNumber: newValue,
incrementMode: 'manual-transaction',
},
});
}
if (!invoiceAutoIncrement) {
setFieldValue('invoice_no', newValue);
setFieldValue('invoice_no_manually', newValue);
}
};
return (
<FFormGroup
name={'invoice_no'}
label={<T id={'invoice_no'} />}
labelInfo={<FieldRequiredHint />}
inline={true}
fastField={true}
>
<ControlGroup fill={true}>
<FInputGroup
name={'invoice_no'}
minimal={true}
asyncControl={true}
onBlur={handleInvoiceNoBlur}
fastField={true}
/>
<InputPrependButton
buttonProps={{
onClick: handleInvoiceNumberChange,
icon: <Icon icon={'settings-18'} />,
}}
tooltip={true}
tooltipProps={{
content: <T id={'setting_your_auto_generated_invoice_number'} />,
position: Position.BOTTOM_LEFT,
}}
/>
</ControlGroup>
</FFormGroup>
);
},
);
/**
* Invoice form header fields.
*/
function InvoiceFormHeaderFields({
// #withDialogActions
openDialog,
// #withSettings
invoiceAutoIncrement,
}) {
export default function InvoiceFormHeaderFields() {
// Invoice form context.
const { customers, projects } = useInvoiceFormContext();
// Formik context.
const { values } = useFormikContext();
// Handle invoice number changing.
const handleInvoiceNumberChange = () => {
openDialog(DialogsName.InvoiceNumberSettings);
};
// Handle invoice no. field blur.
const handleInvoiceNoBlur = (form, field) => (event) => {
const newValue = event.target.value;
if (field.value !== newValue && invoiceAutoIncrement) {
openDialog(DialogsName.InvoiceNumberSettings, {
initialFormValues: {
manualTransactionNo: newValue,
incrementMode: 'manual-transaction',
},
});
}
};
return (
<div className={classNames(CLASSES.PAGE_FORM_HEADER_FIELDS)}>
{/* ----------- Customer name ----------- */}
@@ -185,40 +237,7 @@ function InvoiceFormHeaderFields({
</Row>
{/* ----------- Invoice number ----------- */}
<Field name={'invoice_no'}>
{({ form, field, meta: { error, touched } }) => (
<FormGroup
label={<T id={'invoice_no'} />}
labelInfo={<FieldRequiredHint />}
inline={true}
className={classNames('form-group--invoice-no', CLASSES.FILL)}
intent={inputIntent({ error, touched })}
helperText={<ErrorMessage name="invoice_no" />}
>
<ControlGroup fill={true}>
<InputGroup
minimal={true}
value={field.value}
asyncControl={true}
onBlur={handleInvoiceNoBlur(form, field)}
/>
<InputPrependButton
buttonProps={{
onClick: handleInvoiceNumberChange,
icon: <Icon icon={'settings-18'} />,
}}
tooltip={true}
tooltipProps={{
content: (
<T id={'setting_your_auto_generated_invoice_number'} />
),
position: Position.BOTTOM_LEFT,
}}
/>
</ControlGroup>
</FormGroup>
)}
</Field>
<InvoiceFormInvoiceNumberField />
{/* ----------- Reference ----------- */}
<FastField name={'reference_no'}>
@@ -260,13 +279,6 @@ function InvoiceFormHeaderFields({
);
}
export default compose(
withDialogActions,
withSettings(({ invoiceSettings }) => ({
invoiceAutoIncrement: invoiceSettings?.autoIncrement,
})),
)(InvoiceFormHeaderFields);
const CustomerButtonLink = styled(CustomerDrawerLink)`
font-size: 11px;
margin-top: 6px;

View File

@@ -177,6 +177,7 @@ function PaymentReceiveForm({
<PaymentReceiveFormFooter />
<PaymentReceiveFloatingActions />
{/* ------- Effects ------- */}
<PaymentReceiveSyncIncrementSettingsToForm />
{/* ------- Alerts & Dialogs ------- */}

View File

@@ -9,17 +9,15 @@ import PaymentReceiveNumberDialog from '@/containers/Dialogs/PaymentReceiveNumbe
export default function PaymentReceiveFormDialogs() {
const { setFieldValue } = useFormikContext();
const handleUpdatePaymentNumber = ({ incrementNumber, manually }) => {
setFieldValue('payment_receive_no', incrementNumber);
setFieldValue('payment_receive_no_manually', manually)
const handleUpdatePaymentNumber = (settings) => {
setFieldValue('payment_receive_no', settings.transactionNumber);
setFieldValue('payment_receive_no_manually', settings.transactionNumber);
};
return (
<>
<PaymentReceiveNumberDialog
dialogName={'payment-receive-number-form'}
onConfirm={handleUpdatePaymentNumber}
/>
</>
<PaymentReceiveNumberDialog
dialogName={'payment-receive-number-form'}
onConfirm={handleUpdatePaymentNumber}
/>
);
}

View File

@@ -12,13 +12,13 @@ import {
} from '@blueprintjs/core';
import { DateInput } from '@blueprintjs/datetime';
import { toSafeInteger } from 'lodash';
import { FeatureCan, FormattedMessage as T } from '@/components';
import { FastField, Field, useFormikContext, ErrorMessage } from 'formik';
import * as R from 'ramda';
import { FeatureCan, FormattedMessage as T } from '@/components';
import { useAutofocus } from '@/hooks';
import { CLASSES } from '@/constants/classes';
import {
compose,
safeSumBy,
momentFormatter,
tansformDateValue,
@@ -48,7 +48,6 @@ import {
import withDialogActions from '@/containers/Dialog/withDialogActions';
import withSettings from '@/containers/Settings/withSettings';
import withCurrentOrganization from '@/containers/Organization/withCurrentOrganization';
import {
amountPaymentEntries,
@@ -58,19 +57,86 @@ import {
} from './utils';
import { Features } from '@/constants';
/**
* Payment receive number field.
*/
const PaymentReceivePaymentNoField = R.compose(
withSettings(({ paymentReceiveSettings }) => ({
paymentReceiveAutoIncrement: paymentReceiveSettings?.autoIncrement,
})),
withDialogActions,
)(
({
// #withDialogActions
openDialog,
// #withSettings
paymentReceiveAutoIncrement,
}) => {
const { values, setFieldValue } = useFormikContext();
// Handle click open payment receive number dialog.
const handleClickOpenDialog = () => {
openDialog('payment-receive-number-form');
};
// Handle payment number field blur.
const handlePaymentNoBlur = (event) => {
const newValue = event.target.value;
if (
values.payment_receive_no !== newValue &&
paymentReceiveAutoIncrement
) {
openDialog('payment-receive-number-form', {
initialFormValues: {
onceManualNumber: newValue,
incrementMode: 'manual-transaction',
},
});
}
if (!paymentReceiveAutoIncrement) {
setFieldValue('payment_receive_no', newValue);
setFieldValue('payment_receive_no_manually', newValue);
}
};
return (
<FormGroup
name={'payment_receive_no'}
label={<T id={'payment_receive_no'} />}
inline={true}
labelInfo={<FieldRequiredHint />}
helperText={<ErrorMessage name="payment_receive_no" />}
>
<ControlGroup fill={true}>
<InputGroup
minimal={true}
value={values.payment_receive_no}
asyncControl={true}
onBlur={handlePaymentNoBlur}
/>
<InputPrependButton
buttonProps={{
onClick: handleClickOpenDialog,
icon: <Icon icon={'settings-18'} />,
}}
tooltip={true}
tooltipProps={{
content: (
<T id={'setting_your_auto_generated_payment_receive_number'} />
),
position: Position.BOTTOM_LEFT,
}}
/>
</ControlGroup>
</FormGroup>
);
},
);
/**
* Payment receive header fields.
*/
function PaymentReceiveHeaderFields({
// #withCurrentOrganization
organization: { base_currency },
// #withDialogActions
openDialog,
// #withSettings
paymentReceiveAutoIncrement,
}) {
export default function PaymentReceiveHeaderFields({}) {
// Payment receive form context.
const { customers, accounts, projects, isNewMode } =
usePaymentReceiveFormContext();
@@ -101,24 +167,6 @@ function PaymentReceiveHeaderFields({
const newEntries = amountPaymentEntries(toSafeInteger(value), entries);
setFieldValue('entries', newEntries);
};
// Handle click open payment receive number dialog.
const handleClickOpenDialog = () => {
openDialog('payment-receive-number-form');
};
// Handle payment number field blur.
const handlePaymentNoBlur = (form, field) => (event) => {
const newValue = event.target.value;
if (field.value !== newValue && paymentReceiveAutoIncrement) {
openDialog('payment-receive-number-form', {
initialFormValues: {
manualTransactionNo: newValue,
incrementMode: 'manual-transaction',
},
});
}
};
return (
<div className={classNames(CLASSES.PAGE_FORM_HEADER_FIELDS)}>
@@ -237,43 +285,7 @@ function PaymentReceiveHeaderFields({
</Field>
{/* ------------ Payment receive no. ------------ */}
<FastField name={'payment_receive_no'}>
{({ form, field, meta: { error, touched } }) => (
<FormGroup
label={<T id={'payment_receive_no'} />}
inline={true}
labelInfo={<FieldRequiredHint />}
className={('form-group--payment_receive_no', CLASSES.FILL)}
intent={inputIntent({ error, touched })}
helperText={<ErrorMessage name="payment_receive_no" />}
>
<ControlGroup fill={true}>
<InputGroup
intent={inputIntent({ error, touched })}
minimal={true}
value={field.value}
asyncControl={true}
onBlur={handlePaymentNoBlur(form, field)}
/>
<InputPrependButton
buttonProps={{
onClick: handleClickOpenDialog,
icon: <Icon icon={'settings-18'} />,
}}
tooltip={true}
tooltipProps={{
content: (
<T
id={'setting_your_auto_generated_payment_receive_number'}
/>
),
position: Position.BOTTOM_LEFT,
}}
/>
</ControlGroup>
</FormGroup>
)}
</FastField>
<PaymentReceivePaymentNoField />
{/* ------------ Deposit account ------------ */}
<FFormGroup
@@ -340,14 +352,6 @@ function PaymentReceiveHeaderFields({
);
}
export default compose(
withSettings(({ paymentReceiveSettings }) => ({
paymentReceiveAutoIncrement: paymentReceiveSettings?.autoIncrement,
})),
withDialogActions,
withCurrentOrganization(),
)(PaymentReceiveHeaderFields);
const CustomerButtonLink = styled(CustomerDrawerLink)`
font-size: 11px;
margin-top: 6px;

View File

@@ -165,7 +165,11 @@ function ReceiptForm({
<ReceiptItemsEntriesEditor />
<ReceiptFormFooter />
<ReceiptFormFloatingActions />
{/*---------- Dialogs ---------*/}
<ReceiptFormDialogs />
{/*---------- Effects ---------*/}
<ReceiptSyncIncrementSettingsToForm />
</Form>
</Formik>

View File

@@ -10,9 +10,9 @@ export default function ReceiptFormDialogs() {
const { setFieldValue } = useFormikContext();
// Update the form once the receipt number form submit confirm.
const handleReceiptNumberFormConfirm = ({ incrementNumber, manually }) => {
setFieldValue('receipt_number', incrementNumber || '');
setFieldValue('receipt_number_manually', manually);
const handleReceiptNumberFormConfirm = (settings) => {
setFieldValue('receipt_number', settings.transactionNumber);
setFieldValue('receipt_number_manually', settings.transactionNumber);
};
return (

View File

@@ -10,9 +10,10 @@ import {
ControlGroup,
} from '@blueprintjs/core';
import { DateInput } from '@blueprintjs/datetime';
import { FastField, ErrorMessage } from 'formik';
import { CLASSES } from '@/constants/classes';
import { FastField, ErrorMessage, useFormikContext } from 'formik';
import * as R from 'ramda';
import { CLASSES } from '@/constants/classes';
import {
FFormGroup,
AccountsSelect,
@@ -24,57 +25,102 @@ import {
FormattedMessage as T,
FeatureCan,
} from '@/components';
import withSettings from '@/containers/Settings/withSettings';
import withDialogActions from '@/containers/Dialog/withDialogActions';
import { ACCOUNT_TYPE } from '@/constants/accountTypes';
import { ProjectsSelect } from '@/containers/Projects/components';
import {
momentFormatter,
compose,
tansformDateValue,
handleDateChange,
inputIntent,
} from '@/utils';
import { useReceiptFormContext } from './ReceiptFormProvider';
import {
accountsFieldShouldUpdate,
customersFieldShouldUpdate,
} from './utils';
import { accountsFieldShouldUpdate, customersFieldShouldUpdate } from './utils';
import {
ReceiptExchangeRateInputField,
ReceiptProjectSelectButton,
} from './components';
import { Features } from '@/constants';
import withSettings from '@/containers/Settings/withSettings';
import withDialogActions from '@/containers/Dialog/withDialogActions';
const ReceiptFormReceiptNumberField = R.compose(
withDialogActions,
withSettings(({ receiptSettings }) => ({
receiptAutoIncrement: receiptSettings?.autoIncrement,
})),
)(
({
//#withDialogActions
openDialog,
// #withSettings
receiptAutoIncrement,
}) => {
const { values, setFieldValue } = useFormikContext();
const handleReceiptNumberChange = useCallback(() => {
openDialog('receipt-number-form', {});
}, [openDialog]);
const handleReceiptNoBlur = (event) => {
const newValue = event.target.value;
if (values.receipt_number !== newValue && receiptAutoIncrement) {
openDialog('receipt-number-form', {
initialFormValues: {
onceManualNumber: newValue,
incrementMode: 'manual-transaction',
},
});
}
if (!receiptAutoIncrement) {
setFieldValue('receipt_number', newValue);
setFieldValue('receipt_number_manually', newValue);
}
};
return (
<FFormGroup
name={'receipt_number'}
label={<T id={'receipt'} />}
inline={true}
labelInfo={<FieldRequiredHint />}
>
<ControlGroup fill={true}>
<InputGroup
minimal={true}
value={values.receipt_number}
asyncControl={true}
onBlur={handleReceiptNoBlur}
/>
<InputPrependButton
buttonProps={{
onClick: handleReceiptNumberChange,
icon: <Icon icon={'settings-18'} />,
}}
tooltip={true}
tooltipProps={{
content: (
<T id={'setting_your_auto_generated_payment_receive_number'} />
),
position: Position.BOTTOM_LEFT,
}}
inputProps={{
leftIcon: <Icon icon={'date-range'} />,
}}
/>
</ControlGroup>
</FFormGroup>
);
},
);
/**
* Receipt form header fields.
*/
function ReceiptFormHeader({
//#withDialogActions
openDialog,
// #withSettings
receiptAutoIncrement,
}) {
export default function ReceiptFormHeader() {
const { accounts, customers, projects } = useReceiptFormContext();
const handleReceiptNumberChange = useCallback(() => {
openDialog('receipt-number-form', {});
}, [openDialog]);
const handleReceiptNoBlur = (form, field) => (event) => {
const newValue = event.target.value;
if (field.value !== newValue && receiptAutoIncrement) {
openDialog('receipt-number-form', {
initialFormValues: {
manualTransactionNo: newValue,
incrementMode: 'manual-transaction',
},
});
}
};
return (
<div className={classNames(CLASSES.PAGE_FORM_HEADER_FIELDS)}>
{/* ----------- Customer name ----------- */}
@@ -170,45 +216,7 @@ function ReceiptFormHeader({
</FastField>
{/* ----------- Receipt number ----------- */}
<FastField name={'receipt_number'}>
{({ form, field, meta: { error, touched } }) => (
<FormGroup
label={<T id={'receipt'} />}
inline={true}
className={('form-group--receipt_number', CLASSES.FILL)}
labelInfo={<FieldRequiredHint />}
intent={inputIntent({ error, touched })}
helperText={<ErrorMessage name="receipt_number" />}
>
<ControlGroup fill={true}>
<InputGroup
minimal={true}
value={field.value}
asyncControl={true}
onBlur={handleReceiptNoBlur(form, field)}
/>
<InputPrependButton
buttonProps={{
onClick: handleReceiptNumberChange,
icon: <Icon icon={'settings-18'} />,
}}
tooltip={true}
tooltipProps={{
content: (
<T
id={'setting_your_auto_generated_payment_receive_number'}
/>
),
position: Position.BOTTOM_LEFT,
}}
inputProps={{
leftIcon: <Icon icon={'date-range'} />,
}}
/>
</ControlGroup>
</FormGroup>
)}
</FastField>
<ReceiptFormReceiptNumberField />
{/* ----------- Reference ----------- */}
<FastField name={'reference_no'}>
@@ -245,13 +253,6 @@ function ReceiptFormHeader({
);
}
export default compose(
withDialogActions,
withSettings(({ receiptSettings }) => ({
receiptAutoIncrement: receiptSettings?.autoIncrement,
})),
)(ReceiptFormHeader);
const CustomerButtonLink = styled(CustomerDrawerLink)`
font-size: 11px;
margin-top: 6px;

View File

@@ -1376,7 +1376,7 @@
"receipt.auto_increment.manually": "Your receipt numbers are set on manual mode. Are you sure chaning this settings?",
"payment_receive.auto_increment.auto": "Your payment numbers are set on auto-increment mode. Are you sure changing this setting?",
"payment_receive.auto_increment.manually": "Your payment numbers are set on manual mode. Are you sure chaning this settings?",
"auto_increment.field.manually": "I will enter them manually each time",
"auto_increment.field.manually": "I will enter them manually each time.",
"auto_increment.field.manual_this_transaction": "Manual entering for this transaction.",
"auto_increment.field.auto": "Auto-incrementing number.",
"date_formats": {