feat(Sales & Purchases ): add currency in header & entries.

This commit is contained in:
elforjani13
2022-02-23 14:47:12 +02:00
parent e6a7c7bc58
commit 22eb7a1cc1
17 changed files with 83 additions and 106 deletions

View File

@@ -8,24 +8,17 @@ import { CLASSES } from 'common/classes';
import BillFormHeaderFields from './BillFormHeaderFields';
import { PageFormBigNumber } from 'components';
import withCurrentOrganization from 'containers/Organization/withCurrentOrganization';
import { compose } from 'redux';
/**
* Fill form header.
*/
function BillFormHeader({
// #withCurrentOrganization
organization: { base_currency },
}) {
const { values } = useFormikContext();
function BillFormHeader() {
const {
values: { currency_code, entries },
} = useFormikContext();
// Calculate the total due amount of bill entries.
const totalDueAmount = useMemo(
() => sumBy(values.entries, 'amount'),
[values.entries],
);
const totalDueAmount = useMemo(() => sumBy(entries, 'amount'), [entries]);
return (
<div className={classNames(CLASSES.PAGE_FORM_HEADER)}>
@@ -33,9 +26,9 @@ function BillFormHeader({
<PageFormBigNumber
label={intl.get('due_amount')}
amount={totalDueAmount}
currencyCode={base_currency}
currencyCode={currency_code}
/>
</div>
);
}
export default compose(withCurrentOrganization())(BillFormHeader);
export default BillFormHeader;

View File

@@ -70,6 +70,7 @@ function BillFormHeader() {
onContactSelected={(contact) => {
form.setFieldValue('vendor_id', contact.id);
form.setFieldValue('exchange_rate', '');
form.setFieldValue('currency_code', contact?.currency_code);
setSelectVendor(contact);
}}
popoverFill={true}

View File

@@ -8,23 +8,17 @@ import VendorCreditNoteFormHeaderFields from './VendorCreditNoteFormHeaderFields
import { getEntriesTotal } from 'containers/Entries/utils';
import { PageFormBigNumber } from 'components';
import withCurrentOrganization from 'containers/Organization/withCurrentOrganization';
import { compose } from 'utils';
/**
* Vendor Credit note header.
*/
function VendorCreditNoteFormHeader({
// #withCurrentOrganization
organization: { base_currency },
}) {
const { values } = useFormikContext();
function VendorCreditNoteFormHeader() {
const { values:{entries ,currency_code} } = useFormikContext();
// Calculate the total amount.
const totalAmount = React.useMemo(
() => getEntriesTotal(values.entries),
[values.entries],
() => getEntriesTotal(entries),
[entries],
);
return (
@@ -33,10 +27,10 @@ function VendorCreditNoteFormHeader({
<PageFormBigNumber
label={intl.get('vendor_credits.label.amount_to_credit')}
amount={totalAmount}
currencyCode={base_currency}
currencyCode={currency_code}
/>
</div>
);
}
export default compose(withCurrentOrganization())(VendorCreditNoteFormHeader);
export default VendorCreditNoteFormHeader;

View File

@@ -108,6 +108,7 @@ function VendorCreditNoteFormHeaderFields({
onContactSelected={(contact) => {
form.setFieldValue('vendor_id', contact.id);
form.setFieldValue('exchange_rate', '');
form.setFieldValue('currency_code', contact?.currency_code);
setSelectVendor(contact);
}}
popoverFill={true}

View File

@@ -3,23 +3,18 @@ import classNames from 'classnames';
import { useFormikContext } from 'formik';
import { sumBy } from 'lodash';
import { CLASSES } from 'common/classes';
import { compose } from 'utils';
import { Money } from 'components';
import { FormattedMessage as T } from 'components';
import PaymentMadeFormHeaderFields from './PaymentMadeFormHeaderFields';
import withCurrentOrganization from 'containers/Organization/withCurrentOrganization';
/**
* Payment made header form.
*/
function PaymentMadeFormHeader({
// #withCurrentOrganization
organization: { base_currency },
}) {
function PaymentMadeFormHeader() {
// Formik form context.
const {
values: { entries },
values: { entries, currency_code },
} = useFormikContext();
// Calculate the payment amount of the entries.
@@ -36,7 +31,7 @@ function PaymentMadeFormHeader({
<T id={'amount_received'} />
</span>
<h1 class="big-amount__number">
<Money amount={amountPaid} currency={base_currency} />
<Money amount={amountPaid} currency={currency_code} />
</h1>
</div>
</div>
@@ -45,4 +40,4 @@ function PaymentMadeFormHeader({
);
}
export default compose(withCurrentOrganization())(PaymentMadeFormHeader);
export default PaymentMadeFormHeader;

View File

@@ -111,6 +111,7 @@ function PaymentMadeFormHeaderFields({ organization: { base_currency } }) {
onContactSelected={(contact) => {
form.setFieldValue('vendor_id', contact.id);
form.setFieldValue('exchange_rate', '');
form.setFieldValue('currency_code', contact?.currency_code);
setPaymentVendorId(contact.id);
setSelectVendor(contact);
}}
@@ -162,7 +163,13 @@ function PaymentMadeFormHeaderFields({ organization: { base_currency } }) {
{/* ------------ Full amount ------------ */}
<Field name={'full_amount'}>
{({ form, field: { value }, meta: { error, touched } }) => (
{({
form: {
values: { currency_code },
},
field: { value },
meta: { error, touched },
}) => (
<FormGroup
label={<T id={'full_amount'} />}
inline={true}
@@ -172,7 +179,7 @@ function PaymentMadeFormHeaderFields({ organization: { base_currency } }) {
helperText={<ErrorMessage name="full_amount" />}
>
<ControlGroup>
<InputPrependText text={base_currency} />
<InputPrependText text={currency_code} />
<MoneyInputGroup
value={value}
onChange={(value) => {
@@ -189,7 +196,7 @@ function PaymentMadeFormHeaderFields({ organization: { base_currency } }) {
minimal={true}
>
<T id={'receive_full_amount'} /> (
<Money amount={payableFullAmount} currency={base_currency} />)
<Money amount={payableFullAmount} currency={currency_code} />)
</Button>
</FormGroup>
)}

View File

@@ -8,24 +8,16 @@ import CreditNoteFormHeaderFields from './CreditNoteFormHeaderFields';
import { getEntriesTotal } from 'containers/Entries/utils';
import { PageFormBigNumber } from 'components';
import withCurrentOrganization from 'containers/Organization/withCurrentOrganization';
import { compose } from 'utils';
/**
* Credit note header.
*/
function CreditNoteFormHeader({
// #withCurrentOrganization
organization: { base_currency },
}) {
const { values } = useFormikContext();
function CreditNoteFormHeader() {
const {
values: { entries, currency_code },
} = useFormikContext();
// Calculate the total amount.
const totalAmount = React.useMemo(
() => getEntriesTotal(values.entries),
[values.entries],
);
const totalAmount = React.useMemo(() => getEntriesTotal(entries), [entries]);
return (
<div className={classNames(CLASSES.PAGE_FORM_HEADER)}>
@@ -33,10 +25,10 @@ function CreditNoteFormHeader({
<PageFormBigNumber
label={intl.get('credit_note.label_amount_to_credit')}
amount={totalAmount}
currencyCode={base_currency}
currencyCode={currency_code}
/>
</div>
);
}
export default compose(withCurrentOrganization())(CreditNoteFormHeader);
export default CreditNoteFormHeader;

View File

@@ -108,6 +108,7 @@ function CreditNoteFormHeaderFields({
onContactSelected={(customer) => {
form.setFieldValue('customer_id', customer.id);
form.setFieldValue('exchange_rate', '');
form.setFieldValue('currency_code', customer?.currency_code);
setSelectCustomer(customer);
}}
popoverFill={true}

View File

@@ -6,23 +6,20 @@ import intl from 'react-intl-universal';
import { CLASSES } from 'common/classes';
import EstimateFormHeaderFields from './EstimateFormHeaderFields';
import withCurrentOrganization from 'containers/Organization/withCurrentOrganization';
import { getEntriesTotal } from 'containers/Entries/utils';
import { PageFormBigNumber } from 'components';
import { compose } from 'utils';
// Estimate form top header.
function EstimateFormHeader({
// #withCurrentOrganization
organization: { base_currency },
}) {
const { values } = useFormikContext();
function EstimateFormHeader() {
const {
values: { entries, currency_code },
} = useFormikContext();
// Calculate the total due amount of bill entries.
const totalDueAmount = useMemo(
() => getEntriesTotal(values.entries),
[values.entries],
() => getEntriesTotal(entries),
[entries],
);
return (
@@ -32,10 +29,10 @@ function EstimateFormHeader({
<PageFormBigNumber
label={intl.get('amount')}
amount={totalDueAmount}
currencyCode={base_currency}
currencyCode={currency_code}
/>
</div>
);
}
export default compose(withCurrentOrganization())(EstimateFormHeader);
export default EstimateFormHeader;

View File

@@ -100,6 +100,7 @@ function EstimateFormHeader({
onContactSelected={(customer) => {
form.setFieldValue('customer_id', customer.id);
form.setFieldValue('exchange_rate', '');
form.setFieldValue('currency_code', customer?.currency_code);
setSelectCustomer(customer);
}}
popoverFill={true}

View File

@@ -9,24 +9,16 @@ import InvoiceFormHeaderFields from './InvoiceFormHeaderFields';
import { getEntriesTotal } from 'containers/Entries/utils';
import { PageFormBigNumber } from 'components';
import withCurrentOrganization from 'containers/Organization/withCurrentOrganization';
import { compose } from 'redux';
/**
* Invoice form header section.
*/
function InvoiceFormHeader({
// #withCurrentOrganization
organization: { base_currency },
}) {
const { values } = useFormikContext();
function InvoiceFormHeader() {
const {
values: { currency_code, entries },
} = useFormikContext();
// Calculate the total due amount of invoice entries.
const totalDueAmount = useMemo(
() => getEntriesTotal(values.entries),
[values.entries],
);
const totalDueAmount = useMemo(() => getEntriesTotal(entries), [entries]);
return (
<div className={classNames(CLASSES.PAGE_FORM_HEADER)}>
@@ -34,9 +26,9 @@ function InvoiceFormHeader({
<PageFormBigNumber
label={intl.get('due_amount')}
amount={totalDueAmount}
currencyCode={base_currency}
currencyCode={currency_code}
/>
</div>
);
}
export default compose(withCurrentOrganization())(InvoiceFormHeader);
export default InvoiceFormHeader;

View File

@@ -116,6 +116,7 @@ function InvoiceFormHeaderFields({
onContactSelected={(customer) => {
form.setFieldValue('customer_id', customer.id);
form.setFieldValue('exchange_rate', '');
form.setFieldValue('currency_code', customer?.currency_code);
setSelectCustomer(customer);
}}
popoverFill={true}

View File

@@ -91,6 +91,10 @@ function InvoiceFormProvider({ invoiceId, baseCurrency, ...props }) {
!isEqual(selectCustomer?.currency_code, baseCurrency) &&
!isUndefined(selectCustomer?.currency_code);
const currencyCode = isForeignCustomer
? selectCustomer?.currency_code
: baseCurrency;
const provider = {
invoice,
items,
@@ -103,6 +107,7 @@ function InvoiceFormProvider({ invoiceId, baseCurrency, ...props }) {
baseCurrency,
branches,
warehouses,
currencyCode,
isInvoiceLoading,
isItemsLoading,

View File

@@ -7,24 +7,21 @@ import { FormattedMessage as T } from 'components';
import { CLASSES } from 'common/classes';
import PaymentReceiveHeaderFields from './PaymentReceiveHeaderFields';
import withCurrentOrganization from 'containers/Organization/withCurrentOrganization';
import { compose } from 'utils';
/**
* Payment receive form header.
*/
function PaymentReceiveFormHeader({
// #withCurrentOrganization
organization: { base_currency },
}) {
function PaymentReceiveFormHeader() {
// Formik form context.
const { values } = useFormikContext();
const {
values: { currency_code, entries },
} = useFormikContext();
// Calculates the total payment amount from due amount.
const paymentFullAmount = useMemo(
() => sumBy(values.entries, 'payment_amount'),
[values.entries],
() => sumBy(entries, 'payment_amount'),
[entries],
);
return (
@@ -38,7 +35,7 @@ function PaymentReceiveFormHeader({
<T id={'amount_received'} />
</span>
<h1 class="big-amount__number">
<Money amount={paymentFullAmount} currency={base_currency} />
<Money amount={paymentFullAmount} currency={currency_code} />
</h1>
</div>
</div>
@@ -47,4 +44,4 @@ function PaymentReceiveFormHeader({
);
}
export default compose(withCurrentOrganization())(PaymentReceiveFormHeader);
export default PaymentReceiveFormHeader;

View File

@@ -153,6 +153,8 @@ function PaymentReceiveHeaderFields({
onContactSelected={(customer) => {
form.setFieldValue('customer_id', customer.id);
form.setFieldValue('full_amount', '');
form.setFieldValue('exchange_rate', '');
form.setFieldValue('currency_code', customer?.currency_code);
setSelectCustomer(customer);
}}
popoverFill={true}
@@ -207,7 +209,10 @@ function PaymentReceiveHeaderFields({
{/* ------------ Full amount ------------ */}
<Field name={'full_amount'}>
{({
form: { setFieldValue },
form: {
setFieldValue,
values: { currency_code },
},
field: { value, onChange },
meta: { error, touched },
}) => (
@@ -220,7 +225,7 @@ function PaymentReceiveHeaderFields({
helperText={<ErrorMessage name="full_amount" />}
>
<ControlGroup>
<InputPrependText text={base_currency} />
<InputPrependText text={currency_code} />
<MoneyInputGroup
value={value}
onChange={(value) => {
@@ -237,7 +242,7 @@ function PaymentReceiveHeaderFields({
minimal={true}
>
<T id={'receive_full_amount'} /> (
<Money amount={totalDueAmount} currency={base_currency} />)
<Money amount={totalDueAmount} currency={currency_code} />)
</Button>
</FormGroup>
)}

View File

@@ -7,10 +7,7 @@ import { CLASSES } from 'common/classes';
import { PageFormBigNumber } from 'components';
import ReceiptFormHeaderFields from './ReceiptFormHeaderFields';
import withCurrentOrganization from 'containers/Organization/withCurrentOrganization';
import { getEntriesTotal } from 'containers/Entries/utils';
import { compose } from 'redux';
/**
* Receipt form header section.
@@ -18,16 +15,13 @@ import { compose } from 'redux';
function ReceiptFormHeader({
// #ownProps
onReceiptNumberChanged,
// #withCurrentOrganization
organization: { base_currency },
}) {
const { values } = useFormikContext();
const {
values: { currency_code, entries },
} = useFormikContext();
// Calculate the total due amount of bill entries.
const totalDueAmount = useMemo(
() => getEntriesTotal(values.entries),
[values.entries],
);
const totalDueAmount = useMemo(() => getEntriesTotal(entries), [entries]);
return (
<div className={classNames(CLASSES.PAGE_FORM_HEADER)}>
@@ -37,10 +31,10 @@ function ReceiptFormHeader({
<PageFormBigNumber
label={intl.get('due_amount')}
amount={totalDueAmount}
currencyCode={base_currency}
currencyCode={currency_code}
/>
</div>
);
}
export default compose(withCurrentOrganization())(ReceiptFormHeader);
export default ReceiptFormHeader;

View File

@@ -108,6 +108,7 @@ function ReceiptFormHeader({
onContactSelected={(customer) => {
form.setFieldValue('customer_id', customer.id);
form.setFieldValue('exchange_rate', '');
form.setFieldValue('currency_code', customer?.currency_code);
setSelectCustomer(customer);
}}
popoverFill={true}