mirror of
https://github.com/bigcapitalhq/bigcapital.git
synced 2026-02-20 23:00:34 +00:00
feat(invoice ): add foreign customer.
This commit is contained in:
@@ -7,7 +7,7 @@ import {
|
|||||||
} from '@blueprintjs/core';
|
} from '@blueprintjs/core';
|
||||||
import { DateInput } from '@blueprintjs/datetime';
|
import { DateInput } from '@blueprintjs/datetime';
|
||||||
import { FastField, Field, ErrorMessage } from 'formik';
|
import { FastField, Field, ErrorMessage } from 'formik';
|
||||||
import { FormattedMessage as T, Col, Row } from 'components';
|
import { FormattedMessage as T, Col, Row, If } from 'components';
|
||||||
import { momentFormatter, compose, tansformDateValue } from 'utils';
|
import { momentFormatter, compose, tansformDateValue } from 'utils';
|
||||||
import { upperCase } from 'lodash';
|
import { upperCase } from 'lodash';
|
||||||
|
|
||||||
@@ -59,7 +59,7 @@ function InvoiceFormHeaderFields({
|
|||||||
invoiceNextNumber,
|
invoiceNextNumber,
|
||||||
}) {
|
}) {
|
||||||
// Invoice form context.
|
// Invoice form context.
|
||||||
const { customers } = useInvoiceFormContext();
|
const { customers, isForeignCustomer } = useInvoiceFormContext();
|
||||||
|
|
||||||
// Handle invoice number changing.
|
// Handle invoice number changing.
|
||||||
const handleInvoiceNumberChange = () => {
|
const handleInvoiceNumberChange = () => {
|
||||||
@@ -86,7 +86,6 @@ function InvoiceFormHeaderFields({
|
|||||||
return (
|
return (
|
||||||
<div className={classNames(CLASSES.PAGE_FORM_HEADER_FIELDS)}>
|
<div className={classNames(CLASSES.PAGE_FORM_HEADER_FIELDS)}>
|
||||||
{/* ----------- Customer name ----------- */}
|
{/* ----------- Customer name ----------- */}
|
||||||
<CustomerName>
|
|
||||||
<FastField
|
<FastField
|
||||||
name={'customer_id'}
|
name={'customer_id'}
|
||||||
customers={customers}
|
customers={customers}
|
||||||
@@ -105,6 +104,7 @@ function InvoiceFormHeaderFields({
|
|||||||
intent={inputIntent({ error, touched })}
|
intent={inputIntent({ error, touched })}
|
||||||
helperText={<ErrorMessage name={'customer_id'} />}
|
helperText={<ErrorMessage name={'customer_id'} />}
|
||||||
>
|
>
|
||||||
|
<ControlGroup>
|
||||||
<CustomerSelectField
|
<CustomerSelectField
|
||||||
contacts={customers}
|
contacts={customers}
|
||||||
selectedContactId={value}
|
selectedContactId={value}
|
||||||
@@ -115,17 +115,14 @@ function InvoiceFormHeaderFields({
|
|||||||
popoverFill={true}
|
popoverFill={true}
|
||||||
allowCreate={true}
|
allowCreate={true}
|
||||||
/>
|
/>
|
||||||
|
<BaseCurrency isForeignCustomer={isForeignCustomer} />
|
||||||
|
</ControlGroup>
|
||||||
</FormGroup>
|
</FormGroup>
|
||||||
)}
|
)}
|
||||||
</FastField>
|
</FastField>
|
||||||
<BaseCurrency />
|
|
||||||
</CustomerName>
|
|
||||||
<ExchangeWrapp>
|
|
||||||
<ExchangeLable>
|
|
||||||
<FlagTag flage={'US'} /> 1 USD =
|
|
||||||
</ExchangeLable>
|
|
||||||
|
|
||||||
{/* ----------- Exchange reate ----------- */}
|
{/* ----------- Exchange reate ----------- */}
|
||||||
|
<ExchangeRateField>
|
||||||
<Field name={'exchange_rate'}>
|
<Field name={'exchange_rate'}>
|
||||||
{({
|
{({
|
||||||
form: { values, setFieldValue },
|
form: { values, setFieldValue },
|
||||||
@@ -138,6 +135,10 @@ function InvoiceFormHeaderFields({
|
|||||||
className={'form-group--exchange_rate'}
|
className={'form-group--exchange_rate'}
|
||||||
helperText={<ErrorMessage name="exchange_rate" />}
|
helperText={<ErrorMessage name="exchange_rate" />}
|
||||||
>
|
>
|
||||||
|
<ControlGroup>
|
||||||
|
<ExchangeRateTag>
|
||||||
|
<FlagTag flage={'US'} /> 1 USD =
|
||||||
|
</ExchangeRateTag>
|
||||||
<MoneyInputGroup
|
<MoneyInputGroup
|
||||||
value={field.value}
|
value={field.value}
|
||||||
allowDecimals={false}
|
allowDecimals={false}
|
||||||
@@ -147,13 +148,15 @@ function InvoiceFormHeaderFields({
|
|||||||
}}
|
}}
|
||||||
intent={inputIntent({ error, touched })}
|
intent={inputIntent({ error, touched })}
|
||||||
/>
|
/>
|
||||||
|
<ExchangeRateTag>
|
||||||
|
<FlagTag flage={'LY'} /> LYD
|
||||||
|
</ExchangeRateTag>
|
||||||
|
</ControlGroup>
|
||||||
</FormGroup>
|
</FormGroup>
|
||||||
)}
|
)}
|
||||||
</Field>
|
</Field>
|
||||||
<ExchangeLable>
|
</ExchangeRateField>
|
||||||
<FlagTag flage={'LY'} /> LYD
|
|
||||||
</ExchangeLable>
|
|
||||||
</ExchangeWrapp>
|
|
||||||
<Row>
|
<Row>
|
||||||
<Col xs={6}>
|
<Col xs={6}>
|
||||||
{/* ----------- Invoice date ----------- */}
|
{/* ----------- Invoice date ----------- */}
|
||||||
@@ -240,6 +243,7 @@ function InvoiceFormHeaderFields({
|
|||||||
</FastField>
|
</FastField>
|
||||||
</Col>
|
</Col>
|
||||||
</Row>
|
</Row>
|
||||||
|
|
||||||
{/* ----------- Invoice number ----------- */}
|
{/* ----------- Invoice number ----------- */}
|
||||||
<Field name={'invoice_no'}>
|
<Field name={'invoice_no'}>
|
||||||
{({ form, field, meta: { error, touched } }) => (
|
{({ form, field, meta: { error, touched } }) => (
|
||||||
@@ -303,27 +307,21 @@ export default compose(
|
|||||||
})),
|
})),
|
||||||
)(InvoiceFormHeaderFields);
|
)(InvoiceFormHeaderFields);
|
||||||
|
|
||||||
const CustomerName = styled.div`
|
const ExchangeRateField = styled.div`
|
||||||
display: flex;
|
|
||||||
align-items: baseline;
|
|
||||||
`;
|
|
||||||
|
|
||||||
const ExchangeWrapp = styled.div`
|
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: flex-end;
|
justify-content: flex-end;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
max-width: 370px;
|
max-width: 366px;
|
||||||
.bp3-form-group.bp3-inline {
|
.bp3-input-group .bp3-input {
|
||||||
width: 88px;
|
width: 88px;
|
||||||
|
margin: 0 5px;
|
||||||
}
|
}
|
||||||
`;
|
`;
|
||||||
|
|
||||||
const ExchangeLable = styled.div`
|
const ExchangeRateTag = styled.div`
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
margin-right: 5px;
|
|
||||||
font-size: 10px;
|
font-size: 10px;
|
||||||
line-height: 1.6;
|
line-height: 1.6;
|
||||||
padding-bottom: calc(1rem + 1px);
|
|
||||||
`;
|
`;
|
||||||
|
|||||||
@@ -74,6 +74,12 @@ function InvoiceFormProvider({ invoiceId, ...props }) {
|
|||||||
// Detarmines whether the form in new mode.
|
// Detarmines whether the form in new mode.
|
||||||
const isNewMode = !invoiceId;
|
const isNewMode = !invoiceId;
|
||||||
|
|
||||||
|
// Determines whether the warehouse and branches are loading.
|
||||||
|
const isFeatureLoading = isWarehouesLoading || isBranchesLoading;
|
||||||
|
|
||||||
|
// Determines whether the foreign customer.
|
||||||
|
const isForeignCustomer = true;
|
||||||
|
|
||||||
// Provider payload.
|
// Provider payload.
|
||||||
const provider = {
|
const provider = {
|
||||||
invoice,
|
invoice,
|
||||||
@@ -90,6 +96,10 @@ function InvoiceFormProvider({ invoiceId, ...props }) {
|
|||||||
isItemsLoading,
|
isItemsLoading,
|
||||||
isCustomersLoading,
|
isCustomersLoading,
|
||||||
isSettingsLoading,
|
isSettingsLoading,
|
||||||
|
isWarehouesLoading,
|
||||||
|
isBranchesLoading,
|
||||||
|
isFeatureLoading,
|
||||||
|
isForeignCustomer,
|
||||||
|
|
||||||
createInvoiceMutate,
|
createInvoiceMutate,
|
||||||
editInvoiceMutate,
|
editInvoiceMutate,
|
||||||
@@ -104,8 +114,6 @@ function InvoiceFormProvider({ invoiceId, ...props }) {
|
|||||||
isItemsLoading ||
|
isItemsLoading ||
|
||||||
isCustomersLoading ||
|
isCustomersLoading ||
|
||||||
isEstimateLoading ||
|
isEstimateLoading ||
|
||||||
isWarehouesLoading ||
|
|
||||||
isBranchesLoading ||
|
|
||||||
isSettingsLoading
|
isSettingsLoading
|
||||||
}
|
}
|
||||||
name={'invoice-form'}
|
name={'invoice-form'}
|
||||||
|
|||||||
Reference in New Issue
Block a user