Fix: sales.

This commit is contained in:
elforjani13
2022-03-22 23:58:03 +02:00
parent 50f1979c9f
commit a913b84723
29 changed files with 131 additions and 263 deletions

View File

@@ -1,4 +1,5 @@
import React from 'react';
import intl from 'react-intl-universal';
import styled from 'styled-components';
import { FFormGroup, FEditableText, FormattedMessage as T } from 'components';
@@ -13,19 +14,19 @@ export function CreditNoteFormFooterLeft() {
>
<FEditableText
name={'note'}
placeholder={
<T id={'thanks_for_your_business_and_have_a_great_day'} />
}
placeholder={intl.get('credit_note.label_customer_note.placeholder')}
/>
</CreditNoteMsgFormGroup>
{/* --------- Terms and conditions --------- */}
<TermsConditsFormGroup
label={<T id={'terms_conditions'} />}
label={<T id={'credit_note.label_terms_conditions'} />}
name={'terms_conditions'}
>
<FEditableText
name={'terms_conditions'}
placeholder={<T id={'terms_and_conditions.placeholder'} />}
placeholder={
<T id={'credit_note.label_terms_and_conditions.placeholder'} />
}
/>
</TermsConditsFormGroup>
</React.Fragment>

View File

@@ -15,14 +15,13 @@ export function CreditNoteFormFooterRight() {
return (
<CreditNoteTotalLines labelColWidth={'180px'} amountColWidth={'180px'}>
<TotalLine
title={<T id={'credit_note.drawer.label_subtotal'} />}
title={<T id={'credit_note.label_subtotal'} />}
value={formattedSubtotal}
borderStyle={TotalLineBorderStyle.None}
/>
<TotalLine
title={<T id={'credit_note.drawer.label_total'} />}
title={<T id={'credit_note.label_total'} />}
value={formattedTotal}
// borderStyle={TotalLineBorderStyle.SingleDark}
textStyle={TotalLineTextStyle.Bold}
/>
</CreditNoteTotalLines>

View File

@@ -93,19 +93,17 @@ function CreditNoteFormHeaderFields({
intent={inputIntent({ error, touched })}
helperText={<ErrorMessage name={'customer_id'} />}
>
<ControlCustomerGroup>
<CustomerSelectField
contacts={customers}
selectedContactId={value}
defaultSelectText={<T id={'select_customer_account'} />}
onContactSelected={(customer) => {
form.setFieldValue('customer_id', customer.id);
form.setFieldValue('currency_code', customer?.currency_code);
}}
popoverFill={true}
allowCreate={true}
/>
</ControlCustomerGroup>
<CustomerSelectField
contacts={customers}
selectedContactId={value}
defaultSelectText={<T id={'select_customer_account'} />}
onContactSelected={(customer) => {
form.setFieldValue('customer_id', customer.id);
form.setFieldValue('currency_code', customer?.currency_code);
}}
popoverFill={true}
allowCreate={true}
/>
{value && (
<CustomerButtonLink customerId={value}>
<T id={'view_customer_details'} />
@@ -210,11 +208,6 @@ export default compose(
})),
)(CreditNoteFormHeaderFields);
const ControlCustomerGroup = styled(ControlGroup)`
display: flex;
align-items: center;
transform: none;
`;
const CustomerButtonLink = styled(CustomerDrawerLink)`
font-size: 11px;
margin-top: 6px;

View File

@@ -5,27 +5,17 @@ import '../../../../style/pages/CreditNote/PageForm.scss';
import CreditNoteForm from './CreditNoteForm';
import { CreditNoteFormProvider } from './CreditNoteFormProvider';
import withCurrentOrganization from 'containers/Organization/withCurrentOrganization';
import { compose } from 'utils';
/**
* Credit note form page.
*/
function CreditNoteFormPage({
// #withCurrentOrganization
organization: { base_currency },
}) {
export default function CreditNoteFormPage() {
const { id } = useParams();
const idAsInteger = parseInt(id, 10);
return (
<CreditNoteFormProvider
creditNoteId={idAsInteger}
baseCurrency={base_currency}
>
<CreditNoteFormProvider creditNoteId={idAsInteger}>
<CreditNoteForm />
</CreditNoteFormProvider>
);
}
export default compose(withCurrentOrganization())(CreditNoteFormPage);

View File

@@ -23,7 +23,7 @@ const CreditNoteFormContext = React.createContext();
/**
* Credit note data provider.
*/
function CreditNoteFormProvider({ creditNoteId, baseCurrency, ...props }) {
function CreditNoteFormProvider({ creditNoteId, ...props }) {
const { state } = useLocation();
const invoiceId = state?.invoiceId;
@@ -82,8 +82,6 @@ function CreditNoteFormProvider({ creditNoteId, baseCurrency, ...props }) {
// Form submit payload.
const [submitPayload, setSubmitPayload] = React.useState();
const [selectCustomer, setSelectCustomer] = React.useState(null);
// Determines whether the form in new mode.
const isNewMode = !creditNoteId;
@@ -96,10 +94,6 @@ function CreditNoteFormProvider({ creditNoteId, baseCurrency, ...props }) {
})
: [];
// Determines whether the foreign customer.
const isForeignCustomer =
!isEqual(selectCustomer?.currency_code, baseCurrency) &&
!isUndefined(selectCustomer?.currency_code);
// Provider payload.
const provider = {
@@ -108,13 +102,9 @@ function CreditNoteFormProvider({ creditNoteId, baseCurrency, ...props }) {
creditNote,
branches,
warehouses,
submitPayload,
baseCurrency,
selectCustomer,
setSelectCustomer,
submitPayload,
isNewMode,
newCreditNote,
isForeignCustomer,
isItemsLoading,
isCustomersLoading,

View File

@@ -94,7 +94,7 @@ function CreditFormSelectWarehouse() {
function CreditNoteWarehouseSelectButton({ label }) {
return (
<Button
text={intl.get('invoice.warehouse_button.label', { label })}
text={intl.get('credit_note.warehouse_button.label', { label })}
minimal={true}
small={true}
icon={<Icon icon={'warehouse-16'} iconSize={16} />}
@@ -105,7 +105,7 @@ function CreditNoteWarehouseSelectButton({ label }) {
function CreditNoteBranchSelectButton({ label }) {
return (
<Button
text={intl.get('invoice.branch_button.label', { label })}
text={intl.get('credit_note.branch_button.label', { label })}
minimal={true}
small={true}
icon={<Icon icon={'branch-16'} iconSize={16} />}

View File

@@ -1,4 +1,5 @@
import React from 'react';
import intl from 'react-intl-universal';
import styled from 'styled-components';
import { FFormGroup, FEditableText, FormattedMessage as T } from 'components';
@@ -8,25 +9,23 @@ export function EstimateFormFooterLeft() {
{/* --------- Customer Note --------- */}
<EstimateMsgFormGroup
name={'note'}
label={<T id={'customer_note'} />}
label={<T id={'estimate_form.label.customer_note'} />}
hintText={'Will be displayed on the invoice'}
>
<FEditableText
name={'note'}
placeholder={
<T id={'thanks_for_your_business_and_have_a_great_day'} />
}
placeholder={intl.get('estimate_form.customer_note.placeholder')}
/>
</EstimateMsgFormGroup>
{/* --------- Terms and conditions --------- */}
<TermsConditsFormGroup
label={<T id={'terms_conditions'} />}
label={<T id={'estimate_form.label.terms_conditions'} />}
name={'terms_conditions'}
>
<FEditableText
name={'terms_conditions'}
placeholder={<T id={'terms_and_conditions.placeholder'} />}
placeholder={intl.get('estimate_form.terms_and_conditions.placeholder')}
/>
</TermsConditsFormGroup>
</React.Fragment>

View File

@@ -10,20 +10,18 @@ import {
import { useEstimateTotals } from './utils';
export function EstimateFormFooterRight() {
const { formattedSubtotal, formattedTotal } = useEstimateTotals();
return (
<EstimateTotalLines labelColWidth={'180px'} amountColWidth={'180px'}>
<TotalLine
title={<T id={'estimate.details.subtotal'} />}
title={<T id={'estimate_form.label.subtotal'} />}
value={formattedSubtotal}
borderStyle={TotalLineBorderStyle.None}
/>
<TotalLine
title={<T id={'estimate.details.total'} />}
title={<T id={'estimate_form.label.total'} />}
value={formattedTotal}
// borderStyle={TotalLineBorderStyle.SingleDark}
textStyle={TotalLineTextStyle.Bold}
/>
</EstimateTotalLines>

View File

@@ -85,20 +85,19 @@ function EstimateFormHeader({
intent={inputIntent({ error, touched })}
helperText={<ErrorMessage name={'customer_id'} />}
>
<ControlCustomerGroup>
<CustomerSelectField
contacts={customers}
selectedContactId={value}
defaultSelectText={<T id={'select_customer_account'} />}
onContactSelected={(customer) => {
form.setFieldValue('customer_id', customer.id);
form.setFieldValue('currency_code', customer?.currency_code);
}}
popoverFill={true}
intent={inputIntent({ error, touched })}
allowCreate={true}
/>
</ControlCustomerGroup>
<CustomerSelectField
contacts={customers}
selectedContactId={value}
defaultSelectText={<T id={'select_customer_account'} />}
onContactSelected={(customer) => {
form.setFieldValue('customer_id', customer.id);
form.setFieldValue('currency_code', customer?.currency_code);
}}
popoverFill={true}
intent={inputIntent({ error, touched })}
allowCreate={true}
/>
{value && (
<CustomerButtonLink customerId={value}>
<T id={'view_customer_details'} />
@@ -233,12 +232,6 @@ export default compose(
})),
)(EstimateFormHeader);
const ControlCustomerGroup = styled(ControlGroup)`
display: flex;
align-items: center;
transform: none;
`;
const CustomerButtonLink = styled(CustomerDrawerLink)`
font-size: 11px;
margin-top: 6px;

View File

@@ -5,23 +5,17 @@ import 'style/pages/SaleEstimate/PageForm.scss';
import EstimateForm from './EstimateForm';
import { EstimateFormProvider } from './EstimateFormProvider';
import withCurrentOrganization from 'containers/Organization/withCurrentOrganization';
import { compose } from 'utils';
/**
* Estimate form page.
*/
function EstimateFormPage({
// #withCurrentOrganization
organization: { base_currency },
}) {
export default function EstimateFormPage() {
const { id } = useParams();
const idInteger = parseInt(id, 10);
return (
<EstimateFormProvider estimateId={idInteger} baseCurrency={base_currency}>
<EstimateFormProvider estimateId={idInteger}>
<EstimateForm />
</EstimateFormProvider>
);
}
export default compose(withCurrentOrganization())(EstimateFormPage);

View File

@@ -21,7 +21,7 @@ const EstimateFormContext = createContext();
/**
* Estimate form provider.
*/
function EstimateFormProvider({ query, estimateId, baseCurrency, ...props }) {
function EstimateFormProvider({ query, estimateId, ...props }) {
// Features guard.
const { featureCan } = useFeatureCan();
const isWarehouseFeatureCan = featureCan(Features.Warehouses);
@@ -69,7 +69,6 @@ function EstimateFormProvider({ query, estimateId, baseCurrency, ...props }) {
// Form submit payload.
const [submitPayload, setSubmitPayload] = React.useState({});
const [selectCustomer, setSelectCustomer] = React.useState(null);
// Create and edit estimate form.
const { mutateAsync: createEstimateMutate } = useCreateEstimate();
@@ -80,11 +79,6 @@ function EstimateFormProvider({ query, estimateId, baseCurrency, ...props }) {
// Determines whether the warehouse and branches are loading.
const isFeatureLoading = isWarehouesLoading || isBranchesLoading;
// Determines whether the foreign customer.
const isForeignCustomer =
!isEqual(selectCustomer?.currency_code, baseCurrency) &&
!isUndefined(selectCustomer?.currency_code);
// Provider payload.
const provider = {
estimateId,
@@ -104,12 +98,8 @@ function EstimateFormProvider({ query, estimateId, baseCurrency, ...props }) {
isFeatureLoading,
isBranchesSuccess,
isWarehousesSuccess,
isForeignCustomer,
submitPayload,
setSubmitPayload,
selectCustomer,
setSelectCustomer,
baseCurrency,
createEstimateMutate,
editEstimateMutate,

View File

@@ -95,7 +95,7 @@ function EstimateFormSelectWarehouse() {
function EstimateWarehouseSelectButton({ label }) {
return (
<Button
text={intl.get('invoice.warehouse_button.label', { label })}
text={intl.get('estimate.warehouse_button.label', { label })}
minimal={true}
small={true}
icon={<Icon icon={'warehouse-16'} iconSize={16} />}
@@ -106,7 +106,7 @@ function EstimateWarehouseSelectButton({ label }) {
function EstimateBranchSelectButton({ label }) {
return (
<Button
text={intl.get('invoice.branch_button.label', { label })}
text={intl.get('estimate.branch_button.label', { label })}
minimal={true}
small={true}
icon={<Icon icon={'branch-16'} iconSize={16} />}

View File

@@ -1,4 +1,5 @@
import React from 'react';
import intl from 'react-intl-universal';
import styled from 'styled-components';
import { FFormGroup, FEditableText, FormattedMessage as T } from 'components';
@@ -13,20 +14,20 @@ export function InvoiceFormFooterLeft() {
>
<FEditableText
name={'invoice_message'}
placeholder={
<T id={'thanks_for_your_business_and_have_a_great_day'} />
}
placeholder={intl.get('invoice_form.invoice_message.placeholder')}
/>
</InvoiceMsgFormGroup>
{/* --------- Terms and conditions --------- */}
<TermsConditsFormGroup
label={<T id={'terms_conditions'} />}
label={<T id={'invoice_form.label.invoice_message'} />}
name={'terms_conditions'}
>
<FEditableText
name={'terms_conditions'}
placeholder={<T id={'terms_and_conditions.placeholder'} />}
placeholder={intl.get(
'invoice_form.terms_and_conditions.placeholder',
)}
/>
</TermsConditsFormGroup>
</React.Fragment>

View File

@@ -22,23 +22,23 @@ export function InvoiceFormFooterRight() {
return (
<InvoiceTotalLines labelColWidth={'180px'} amountColWidth={'180px'}>
<TotalLine
title={<T id={'invoice.details.subtotal'} />}
title={<T id={'invoice_form.label.subtotal'} />}
value={formattedSubtotal}
borderStyle={TotalLineBorderStyle.None}
/>
<TotalLine
title={<T id={'invoice.details.total'} />}
title={<T id={'invoice_form.label.total'} />}
value={formattedTotal}
borderStyle={TotalLineBorderStyle.SingleDark}
textStyle={TotalLineTextStyle.Bold}
/>
<TotalLine
title={<T id={'invoice.details.payment_amount'} />}
title={<T id={'invoice_form.label.payment_amount'} />}
value={formattedPaymentTotal}
borderStyle={TotalLineBorderStyle.None}
/>
<TotalLine
title={<T id={'invoice.details.due_amount'} />}
title={<T id={'invoice_form.label.due_amount'} />}
value={formattedDueTotal}
textStyle={TotalLineTextStyle.Bold}
/>

View File

@@ -92,19 +92,18 @@ function InvoiceFormHeaderFields({
)}
labelInfo={<FieldRequiredHint />}
>
<ControlCustomerGroup>
<CustomerSelectField
contacts={customers}
selectedContactId={value}
defaultSelectText={<T id={'select_customer_account'} />}
onContactSelected={(customer) => {
form.setFieldValue('customer_id', customer.id);
form.setFieldValue('currency_code', customer?.currency_code);
}}
popoverFill={true}
allowCreate={true}
/>
</ControlCustomerGroup>
<CustomerSelectField
contacts={customers}
selectedContactId={value}
defaultSelectText={<T id={'select_customer_account'} />}
onContactSelected={(customer) => {
form.setFieldValue('customer_id', customer.id);
form.setFieldValue('currency_code', customer?.currency_code);
}}
popoverFill={true}
allowCreate={true}
/>
{value && (
<CustomerButtonLink customerId={value}>
<T id={'view_customer_details'} />
@@ -240,12 +239,6 @@ export default compose(
})),
)(InvoiceFormHeaderFields);
const ControlCustomerGroup = styled(ControlGroup)`
display: flex;
align-items: center;
transform: none;
`;
const CustomerButtonLink = styled(CustomerDrawerLink)`
font-size: 11px;
margin-top: 6px;

View File

@@ -5,23 +5,17 @@ import 'style/pages/SaleInvoice/PageForm.scss';
import InvoiceForm from './InvoiceForm';
import { InvoiceFormProvider } from './InvoiceFormProvider';
import withCurrentOrganization from 'containers/Organization/withCurrentOrganization';
import { compose } from 'utils';
/**
* Invoice form page.
*/
function InvoiceFormPage({
// #withCurrentOrganization
organization: { base_currency },
}) {
export default function InvoiceFormPage() {
const { id } = useParams();
const idAsInteger = parseInt(id, 10);
return (
<InvoiceFormProvider invoiceId={idAsInteger} baseCurrency={base_currency}>
<InvoiceFormProvider invoiceId={idAsInteger}>
<InvoiceForm />
</InvoiceFormProvider>
);
}
export default compose(withCurrentOrganization())(InvoiceFormPage);

View File

@@ -85,7 +85,6 @@ function InvoiceFormProvider({ invoiceId, baseCurrency, ...props }) {
// Form submit payload.
const [submitPayload, setSubmitPayload] = useState();
const [selectCustomer, setSelectCustomer] = useState(null);
// Detarmines whether the form in new mode.
const isNewMode = !invoiceId;
@@ -93,9 +92,6 @@ function InvoiceFormProvider({ invoiceId, baseCurrency, ...props }) {
// Determines whether the warehouse and branches are loading.
const isFeatureLoading = isWarehouesLoading || isBranchesLoading;
// Determines whether the foreign customer.
const isForeignCustomer = true;
const provider = {
invoice,
items,
@@ -104,8 +100,6 @@ function InvoiceFormProvider({ invoiceId, baseCurrency, ...props }) {
estimateId,
invoiceId,
submitPayload,
selectCustomer,
baseCurrency,
branches,
warehouses,
@@ -116,14 +110,12 @@ function InvoiceFormProvider({ invoiceId, baseCurrency, ...props }) {
isWarehouesLoading,
isBranchesLoading,
isFeatureLoading,
isForeignCustomer,
isBranchesSuccess,
isWarehousesSuccess,
createInvoiceMutate,
editInvoiceMutate,
setSubmitPayload,
setSelectCustomer,
isNewMode,
};

View File

@@ -1,4 +1,5 @@
import React from 'react';
import intl from 'react-intl-universal';
import styled from 'styled-components';
import { FFormGroup, FEditableText, FormattedMessage as T } from 'components';
@@ -8,14 +9,12 @@ export function PaymentReceiveFormFootetLeft() {
{/* --------- Statement--------- */}
<TermsConditsFormGroup
name={'statement'}
label={<T id={'statement'} />}
label={<T id={'payment_receive_form.label.statement'} />}
hintText={'Will be displayed on the Payment'}
>
<FEditableText
name={'statement'}
placeholder={
<T id={'thanks_for_your_business_and_have_a_great_day'} />
}
placeholder={intl.get('payment_receive_form.statement.placeholder')}
/>
</TermsConditsFormGroup>
</React.Fragment>

View File

@@ -15,14 +15,13 @@ export function PaymentReceiveFormFootetRight() {
return (
<PaymentReceiveTotalLines labelColWidth={'180px'} amountColWidth={'180px'}>
<TotalLine
title={<T id={'estimate.details.subtotal'} />}
title={<T id={'payment_receive_form.label.subtotal'} />}
value={formattedSubtotal}
borderStyle={TotalLineBorderStyle.None}
/>
<TotalLine
title={<T id={'estimate.details.total'} />}
title={<T id={'payment_receive_form.label.total'} />}
value={formattedTotal}
// borderStyle={TotalLineBorderStyle.SingleDark}
textStyle={TotalLineTextStyle.Bold}
/>
</PaymentReceiveTotalLines>

View File

@@ -3,25 +3,17 @@ import { useParams } from 'react-router-dom';
import { PaymentReceiveFormProvider } from './PaymentReceiveFormProvider';
import PaymentReceiveForm from './PaymentReceiveForm';
import withCurrentOrganization from 'containers/Organization/withCurrentOrganization';
import { compose } from 'utils';
/**
* Payment receive form page.
*/
function PaymentReceiveFormPage({
// #withCurrentOrganization
organization: { base_currency },
}) {
export default function PaymentReceiveFormPage() {
const { id: paymentReceiveId } = useParams();
const paymentReceiveIdInt = parseInt(paymentReceiveId, 10);
return (
<PaymentReceiveFormProvider
paymentReceiveId={paymentReceiveIdInt}
baseCurrency={base_currency}
>
<PaymentReceiveFormProvider paymentReceiveId={paymentReceiveIdInt}>
<PaymentReceiveForm paymentReceiveId={paymentReceiveIdInt} />
</PaymentReceiveFormProvider>
);
}
export default compose(withCurrentOrganization())(PaymentReceiveFormPage);

View File

@@ -1,5 +1,5 @@
import React, { createContext, useContext } from 'react';
import {isEqual, isUndefined } from 'lodash';
import { isEqual, isUndefined } from 'lodash';
import { Features } from 'common';
import { useFeatureCan } from 'hooks/state';
import { DashboardInsider } from 'components';
@@ -19,17 +19,10 @@ const PaymentReceiveFormContext = createContext();
/**
* Payment receive form provider.
*/
function PaymentReceiveFormProvider({
query,
paymentReceiveId,
baseCurrency,
...props
}) {
function PaymentReceiveFormProvider({ query, paymentReceiveId, ...props }) {
// Form state.
const [submitPayload, setSubmitPayload] = React.useState({});
const [selectCustomer, setSelectCustomer] = React.useState(null);
// Features guard.
const { featureCan } = useFeatureCan();
const isBranchFeatureCan = featureCan(Features.Branches);
@@ -73,11 +66,6 @@ function PaymentReceiveFormProvider({
const { mutateAsync: editPaymentReceiveMutate } = useEditPaymentReceive();
const { mutateAsync: createPaymentReceiveMutate } = useCreatePaymentReceive();
// Determines whether the foreign customer.
const isForeignCustomer =
!isEqual(selectCustomer?.currency_code, baseCurrency) &&
!isUndefined(selectCustomer?.currency_code);
// Provider payload.
const provider = {
paymentReceiveId,
@@ -86,7 +74,6 @@ function PaymentReceiveFormProvider({
accounts,
customers,
branches,
baseCurrency,
isPaymentLoading,
isAccountsLoading,
@@ -94,13 +81,10 @@ function PaymentReceiveFormProvider({
isCustomersLoading,
isFeatureLoading,
isBranchesSuccess,
isForeignCustomer,
isNewMode,
submitPayload,
setSubmitPayload,
selectCustomer,
setSelectCustomer,
editPaymentReceiveMutate,
createPaymentReceiveMutate,

View File

@@ -59,7 +59,7 @@ function PaymentReceiveFormSelectBranch() {
function PaymentReceiveBranchSelectButton({ label }) {
return (
<Button
text={intl.get('invoice.branch_button.label', { label })}
text={intl.get('payment_receive.branch_button.label', { label })}
minimal={true}
small={true}
icon={<Icon icon={'branch-16'} iconSize={16} />}

View File

@@ -138,24 +138,23 @@ function PaymentReceiveHeaderFields({
intent={inputIntent({ error, touched })}
helperText={<ErrorMessage name={'customer_id'} />}
>
<ControlCustomerGroup>
<CustomerSelectField
contacts={customers}
selectedContactId={value}
defaultSelectText={<T id={'select_customer_account'} />}
onContactSelected={(customer) => {
form.setFieldValue('customer_id', customer.id);
form.setFieldValue('full_amount', '');
form.setFieldValue('currency_code', customer?.currency_code);
}}
popoverFill={true}
disabled={!isNewMode}
buttonProps={{
elementRef: (ref) => (customerFieldRef.current = ref),
}}
allowCreate={true}
/>
</ControlCustomerGroup>
<CustomerSelectField
contacts={customers}
selectedContactId={value}
defaultSelectText={<T id={'select_customer_account'} />}
onContactSelected={(customer) => {
form.setFieldValue('customer_id', customer.id);
form.setFieldValue('full_amount', '');
form.setFieldValue('currency_code', customer?.currency_code);
}}
popoverFill={true}
disabled={!isNewMode}
buttonProps={{
elementRef: (ref) => (customerFieldRef.current = ref),
}}
allowCreate={true}
/>
{value && (
<CustomerButtonLink customerId={value}>
<T id={'view_customer_details'} />
@@ -346,12 +345,6 @@ export default compose(
withCurrentOrganization(),
)(PaymentReceiveHeaderFields);
const ControlCustomerGroup = styled(ControlGroup)`
display: flex;
align-items: center;
transform: none;
`;
const CustomerButtonLink = styled(CustomerDrawerLink)`
font-size: 11px;
margin-top: 6px;

View File

@@ -1,4 +1,5 @@
import React from 'react';
import intl from 'react-intl-universal';
import styled from 'styled-components';
import { FFormGroup, FEditableText, FormattedMessage as T } from 'components';
@@ -8,24 +9,23 @@ export function ReceiptFormFooterLeft() {
{/* --------- Receipt message --------- */}
<ReceiptMsgFormGroup
name={'receipt_message'}
label={<T id={'receipt_message'} />}
label={<T id={'receipt_form.label.receipt_message'} />}
hintText={'Will be displayed on the Receipt'}
>
<FEditableText
name={'receipt_message'}
placeholder={
<T id={'thanks_for_your_business_and_have_a_great_day'} />
}
placeholder={intl.get('receipt_form.receipt_message.placeholder')}
/>
</ReceiptMsgFormGroup>
{/* --------- Statement--------- */}
<StatementFormGroup label={<T id={'statement'} />} name={'statement'}>
<StatementFormGroup
label={<T id={'receipt_form.label.statement'} />}
name={'statement'}
>
<FEditableText
name={'statement'}
placeholder={
'Enter the terms and conditions of your business to be displayed in your transaction'
}
placeholder={intl.get('receipt_form.statement.placeholder')}
/>
</StatementFormGroup>
</React.Fragment>

View File

@@ -21,23 +21,23 @@ export function ReceiptFormFooterRight() {
return (
<ReceiptTotalLines labelColWidth={'180px'} amountColWidth={'180px'}>
<TotalLine
title={<T id={'receipt.details.subtotal'} />}
title={<T id={'receipt_form.label.subtotal'} />}
value={formattedSubtotal}
borderStyle={TotalLineBorderStyle.None}
/>
<TotalLine
title={<T id={'receipt.details.total'} />}
title={<T id={'receipt_form.label.total'} />}
value={formattedTotal}
borderStyle={TotalLineBorderStyle.SingleDark}
textStyle={TotalLineTextStyle.Bold}
/>
<TotalLine
title={<T id={'receipt.details.payment_amount'} />}
title={<T id={'receipt_form.label.payment_amount'} />}
value={formattedPaymentTotal}
borderStyle={TotalLineBorderStyle.None}
/>
<TotalLine
title={<T id={'receipt.details.due_amount'} />}
title={<T id={'receipt_form.label.due_amount'} />}
value={formattedDueTotal}
textStyle={TotalLineTextStyle.Bold}
/>

View File

@@ -90,19 +90,17 @@ function ReceiptFormHeader({
intent={inputIntent({ error, touched })}
helperText={<ErrorMessage name={'customer_id'} />}
>
<ControlCustomerGroup>
<CustomerSelectField
contacts={customers}
selectedContactId={value}
defaultSelectText={<T id={'select_customer_account'} />}
onContactSelected={(customer) => {
form.setFieldValue('customer_id', customer.id);
form.setFieldValue('currency_code', customer?.currency_code);
}}
popoverFill={true}
allowCreate={true}
/>
</ControlCustomerGroup>
<CustomerSelectField
contacts={customers}
selectedContactId={value}
defaultSelectText={<T id={'select_customer_account'} />}
onContactSelected={(customer) => {
form.setFieldValue('customer_id', customer.id);
form.setFieldValue('currency_code', customer?.currency_code);
}}
popoverFill={true}
allowCreate={true}
/>
{value && (
<CustomerButtonLink customerId={value}>
<T id={'view_customer_details'} />
@@ -245,12 +243,6 @@ export default compose(
})),
)(ReceiptFormHeader);
const ControlCustomerGroup = styled(ControlGroup)`
display: flex;
align-items: center;
transform: none;
`;
const CustomerButtonLink = styled(CustomerDrawerLink)`
font-size: 11px;
margin-top: 6px;

View File

@@ -4,25 +4,18 @@ import { useParams } from 'react-router-dom';
import 'style/pages/SaleReceipt/PageForm.scss';
import ReceiptFrom from './ReceiptForm';
import withCurrentOrganization from 'containers/Organization/withCurrentOrganization';
import { ReceiptFormProvider } from './ReceiptFormProvider';
import { compose } from 'utils';
/**
* Receipt form page.
*/
function ReceiptFormPage({
// #withCurrentOrganization
organization: { base_currency },
}) {
export default function ReceiptFormPage() {
const { id } = useParams();
const idInt = parseInt(id, 10);
return (
<ReceiptFormProvider receiptId={idInt} baseCurrency={base_currency}>
<ReceiptFormProvider receiptId={idInt}>
<ReceiptFrom />
</ReceiptFormProvider>
);
}
export default compose(withCurrentOrganization())(ReceiptFormPage);

View File

@@ -1,5 +1,5 @@
import React, { createContext, useState } from 'react';
import {isEqual, isUndefined } from 'lodash';
import { isEqual, isUndefined } from 'lodash';
import { Features } from 'common';
import { useFeatureCan } from 'hooks/state';
import DashboardInsider from 'components/Dashboard/DashboardInsider';
@@ -20,7 +20,7 @@ const ReceiptFormContext = createContext();
/**
* Receipt form provider.
*/
function ReceiptFormProvider({ receiptId, baseCurrency, ...props }) {
function ReceiptFormProvider({ receiptId, ...props }) {
// Features guard.
const { featureCan } = useFeatureCan();
const isWarehouseFeatureCan = featureCan(Features.Warehouses);
@@ -92,17 +92,10 @@ function ReceiptFormProvider({ receiptId, baseCurrency, ...props }) {
const [submitPayload, setSubmitPayload] = useState({});
const [selectCustomer, setSelectCustomer] = React.useState(null);
const isNewMode = !receiptId;
const isFeatureLoading = isWarehouesLoading || isBranchesLoading;
// Determines whether the foreign customer.
const isForeignCustomer =
!isEqual(selectCustomer?.currency_code, baseCurrency) &&
!isUndefined(selectCustomer?.currency_code);
const provider = {
receiptId,
receipt,
@@ -112,9 +105,6 @@ function ReceiptFormProvider({ receiptId, baseCurrency, ...props }) {
branches,
warehouses,
submitPayload,
baseCurrency,
selectCustomer,
setSelectCustomer,
isNewMode,
isReceiptLoading,
@@ -127,7 +117,6 @@ function ReceiptFormProvider({ receiptId, baseCurrency, ...props }) {
isSettingLoading,
isBranchesSuccess,
isWarehousesSuccess,
isForeignCustomer,
createReceiptMutate,
editReceiptMutate,

View File

@@ -104,7 +104,7 @@ function ReceiptFormSelectWarehouse() {
function ReceiptBranchSelectButton({ label }) {
return (
<Button
text={intl.get('invoice.branch_button.label', { label })}
text={intl.get('receipt.branch_button.label', { label })}
minimal={true}
small={true}
icon={<Icon icon={'branch-16'} iconSize={16} />}
@@ -115,7 +115,7 @@ function ReceiptBranchSelectButton({ label }) {
function ReceiptWarehouseSelectButton({ label }) {
return (
<Button
text={intl.get('invoice.warehouse_button.label', { label })}
text={intl.get('receipt.warehouse_button.label', { label })}
minimal={true}
small={true}
icon={<Icon icon={'warehouse-16'} iconSize={16} />}