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

2026-02-19 14:20:31 +00:00 · 2022-02-23 14:47:12 +02:00
parent e6a7c7bc58
commit 22eb7a1cc1
17 changed files with 83 additions and 106 deletions
--- a/src/containers/Sales/CreditNotes/CreditNoteForm/CreditNoteFormHeader.js
+++ b/src/containers/Sales/CreditNotes/CreditNoteForm/CreditNoteFormHeader.js
@@ -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;
--- a/src/containers/Sales/CreditNotes/CreditNoteForm/CreditNoteFormHeaderFields.js
+++ b/src/containers/Sales/CreditNotes/CreditNoteForm/CreditNoteFormHeaderFields.js
@@ -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}
--- a/src/containers/Sales/Estimates/EstimateForm/EstimateFormHeader.js
+++ b/src/containers/Sales/Estimates/EstimateForm/EstimateFormHeader.js
@@ -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;
--- a/src/containers/Sales/Estimates/EstimateForm/EstimateFormHeaderFields.js
+++ b/src/containers/Sales/Estimates/EstimateForm/EstimateFormHeaderFields.js
@@ -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}
--- a/src/containers/Sales/Invoices/InvoiceForm/InvoiceFormHeader.js
+++ b/src/containers/Sales/Invoices/InvoiceForm/InvoiceFormHeader.js
@@ -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;
--- a/src/containers/Sales/Invoices/InvoiceForm/InvoiceFormHeaderFields.js
+++ b/src/containers/Sales/Invoices/InvoiceForm/InvoiceFormHeaderFields.js
@@ -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}
--- a/src/containers/Sales/Invoices/InvoiceForm/InvoiceFormProvider.js
+++ b/src/containers/Sales/Invoices/InvoiceForm/InvoiceFormProvider.js
@@ -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,
--- a/src/containers/Sales/PaymentReceives/PaymentReceiveForm/PaymentReceiveFormHeader.js
+++ b/src/containers/Sales/PaymentReceives/PaymentReceiveForm/PaymentReceiveFormHeader.js
@@ -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;
--- a/src/containers/Sales/PaymentReceives/PaymentReceiveForm/PaymentReceiveHeaderFields.js
+++ b/src/containers/Sales/PaymentReceives/PaymentReceiveForm/PaymentReceiveHeaderFields.js
@@ -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>
        )}
--- a/src/containers/Sales/Receipts/ReceiptForm/ReceiptFormHeader.js
+++ b/src/containers/Sales/Receipts/ReceiptForm/ReceiptFormHeader.js
@@ -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;
--- a/src/containers/Sales/Receipts/ReceiptForm/ReceiptFormHeaderFields.js
+++ b/src/containers/Sales/Receipts/ReceiptForm/ReceiptFormHeaderFields.js
@@ -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}