QT/bigcapital
1
0
Fork 0
mirror of https://github.com/bigcapitalhq/bigcapital.git synced 2026-02-18 05:40:31 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(customer & vendor): add branch.

Browse Source
This commit is contained in:
elforjani13
2022-03-09 22:03:21 +02:00
parent 37f8662cc5
commit c1ad349f6b
9 changed files with 144 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

45
src/containers/Customers/CustomerForm/CustomerFinancialPanel.js
View File

@@ -3,32 +3,33 @@ import classNames from 'classnames';
import { FormGroup, Position, Classes, ControlGroup } from '@blueprintjs/core';
import { DateInput } from '@blueprintjs/datetime';
import { FastField, ErrorMessage } from 'formik';
import { FFormGroup } from '../../../components/Forms';
import moment from 'moment';
import { Features } from 'common';
import {
MoneyInputGroup,
InputPrependText,
CurrencySelectList,
BranchSelect,
BranchSelectButton,
FeatureCan,
Row,
Col,
} from 'components';
import { FormattedMessage as T } from 'components';
import { useCustomerFormContext } from './CustomerFormProvider';
import {
momentFormatter,
tansformDateValue,
inputIntent,
} from 'utils';
import { useSetPrimaryBranchToForm } from './utils';
import { momentFormatter, tansformDateValue, inputIntent } from 'utils';
/**
* Customer financial panel.
*/
export default function CustomerFinancialPanel() {
const {
currencies,
customerId
} = useCustomerFormContext();
const { currencies, customerId, branches } = useCustomerFormContext();
// Sets the primary branch to form.
useSetPrimaryBranchToForm();
return (
<div className={'tab-panel--financial'}>
@@ -62,12 +63,7 @@ export default function CustomerFinancialPanel() {
{/*------------ Opening balance -----------*/}
<FastField name={'opening_balance'}>
{({
form,
field,
field: { value },
meta: { error, touched },
}) => (
{({ form, field, field: { value }, meta: { error, touched } }) => (
<FormGroup
label={<T id={'opening_balance'} />}
className={classNames(
@@ -92,6 +88,23 @@ export default function CustomerFinancialPanel() {
)}
</FastField>
{/*------------ Opening branch -----------*/}
<FeatureCan feature={Features.Branches}>
<FFormGroup
label={<T id={'customer.label.opening_branch'} />}
name={'opening_balance_branch_id'}
inline={true}
className={classNames('form-group--select-list', Classes.FILL)}
>
<BranchSelect
name={'opening_balance_branch_id'}
branches={branches}
input={BranchSelectButton}
popoverProps={{ minimal: true }}
/>
</FFormGroup>
</FeatureCan>
{/*------------ Currency -----------*/}
<FastField name={'currency_code'}>
{({ form, field: { value }, meta: { error, touched } }) => (

1
src/containers/Customers/CustomerForm/CustomerForm.schema.js
View File

@@ -42,6 +42,7 @@ const Schema = Yup.object().shape({
opening_balance: Yup.number().nullable(),
currency_code: Yup.string(),
opening_balance_at: Yup.date(),
opening_balance_branch_id: Yup.string(),
});
export const CreateCustomerForm = Schema;

21
src/containers/Customers/CustomerForm/CustomerFormProvider.js
View File

@@ -6,15 +6,21 @@ import {
useCreateCustomer,
useEditCustomer,
useContact,
useBranches,
} from 'hooks/query';
import { Features } from 'common';
import { useFeatureCan } from 'hooks/state';
const CustomerFormContext = createContext();
function CustomerFormProvider({ customerId, ...props }) {
function CustomerFormProvider({ query, customerId, ...props }) {
const { state } = useLocation();
const contactId = state?.action;
// Features guard.
const { featureCan } = useFeatureCan();
const isBranchFeatureCan = featureCan(Features.Branches);
// Handle fetch customer details.
const { data: customer, isLoading: isCustomerLoading } = useCustomer(
customerId,
@@ -28,6 +34,13 @@ function CustomerFormProvider({ customerId, ...props }) {
// Handle fetch Currencies data table
const { data: currencies, isLoading: isCurrenciesLoading } = useCurrencies();
// Fetches the branches list.
const {
data: branches,
isLoading: isBranchesLoading,
isSuccess: isBranchesSuccess,
} = useBranches(query, { enabled: isBranchFeatureCan });
// Form submit payload.
const [submitPayload, setSubmitPayload] = useState({});
@@ -38,18 +51,20 @@ function CustomerFormProvider({ customerId, ...props }) {
const isNewMode = contactId || !customerId;
const isFormLoading =
isCustomerLoading || isCurrenciesLoading || isContactLoading;
isCustomerLoading || isCurrenciesLoading || isBranchesLoading;
const provider = {
customerId,
customer,
currencies,
branches,
contactDuplicate,
submitPayload,
isNewMode,
isCustomerLoading,
isCurrenciesLoading,
isBranchesSuccess,
isFormLoading,
setSubmitPayload,

20
src/containers/Customers/CustomerForm/utils.js
View File

@@ -1,5 +1,9 @@
import React from 'react';
import moment from 'moment';
import { useFormikContext } from 'formik';
import { first } from 'lodash';
import { useCustomerFormContext } from './CustomerFormProvider';
export const defaultInitialValues = {
customer_type: 'business',
@@ -35,4 +39,20 @@ export const defaultInitialValues = {
opening_balance: '',
currency_code: '',
opening_balance_at: moment(new Date()).format('YYYY-MM-DD'),
opening_balance_branch_id: '',
};
export const useSetPrimaryBranchToForm = () => {
const { setFieldValue } = useFormikContext();
const { branches, isBranchesSuccess } = useCustomerFormContext();
React.useEffect(() => {
if (isBranchesSuccess) {
const primaryBranch = branches.find((b) => b.primary) || first(branches);
if (primaryBranch) {
setFieldValue('opening_balance_branch_id', primaryBranch.id);
}
}
}, [isBranchesSuccess, setFieldValue, branches]);
};

30
src/containers/Vendors/VendorForm/VendorFinanicalPanelTab.js
View File

@@ -1,17 +1,23 @@
import React from 'react';
import moment from 'moment';
import classNames from 'classnames';
import { FormGroup, ControlGroup, Position, Classes } from '@blueprintjs/core';
import { DateInput } from '@blueprintjs/datetime';
import { FastField, ErrorMessage } from 'formik';
import moment from 'moment';
import { FFormGroup } from '../../../components/Forms';
import { Features } from 'common';
import {
MoneyInputGroup,
InputPrependText,
CurrencySelectList,
BranchSelect,
BranchSelectButton,
FeatureCan,
Row,
Col,
} from 'components';
import { FormattedMessage as T } from 'components';
import { useSetPrimaryBranchToForm } from './utils';
import { momentFormatter, tansformDateValue, inputIntent } from 'utils';
import { useVendorFormContext } from './VendorFormProvider';
@@ -19,7 +25,10 @@ import { useVendorFormContext } from './VendorFormProvider';
* Vendor Finaniceal Panel Tab.
*/
export default function VendorFinanicalPanelTab() {
const { vendorId, currencies } = useVendorFormContext();
const { vendorId, currencies, branches } = useVendorFormContext();
// Sets the primary branch to form.
useSetPrimaryBranchToForm();
return (
<div className={'tab-panel--financial'}>
@@ -80,6 +89,23 @@ export default function VendorFinanicalPanelTab() {
)}
</FastField>
{/*------------ Opening branch -----------*/}
<FeatureCan feature={Features.Branches}>
<FFormGroup
label={<T id={'vendor.label.opening_branch'} />}
name={'opening_balance_branch_id'}
inline={true}
className={classNames('form-group--select-list', Classes.FILL)}
>
<BranchSelect
name={'opening_balance_branch_id'}
branches={branches}
input={BranchSelectButton}
popoverProps={{ minimal: true }}
/>
</FFormGroup>
</FeatureCan>
{/*------------ Currency -----------*/}
<FastField name={'currency_code'}>
{({ form, field: { value }, meta: { error, touched } }) => (

6
src/containers/Vendors/VendorForm/VendorForm.schema.js
View File

@@ -6,10 +6,7 @@ const Schema = Yup.object().shape({
first_name: Yup.string().trim(),
last_name: Yup.string().trim(),
company_name: Yup.string().trim(),
display_name: Yup.string()
.trim()
.required()
.label(intl.get('display_name_')),
display_name: Yup.string().trim().required().label(intl.get('display_name_')),
email: Yup.string().email().nullable(),
work_phone: Yup.number(),
@@ -38,6 +35,7 @@ const Schema = Yup.object().shape({
opening_balance: Yup.number().nullable(),
currency_code: Yup.string(),
opening_balance_at: Yup.date(),
opening_balance_branch_id: Yup.string(),
});
export const CreateVendorFormSchema = Schema;

25
src/containers/Vendors/VendorForm/VendorFormProvider.js
View File

@@ -8,18 +8,24 @@ import {
useCurrencies,
useCreateVendor,
useEditVendor,
useBranches,
} from 'hooks/query';
import { Features } from 'common';
import { useFeatureCan } from 'hooks/state';
const VendorFormContext = createContext();
/**
* Vendor form provider.
*/
function VendorFormProvider({ vendorId, ...props }) {
function VendorFormProvider({ query, vendorId, ...props }) {
const { state } = useLocation();
const contactId = state?.action;
// Features guard.
const { featureCan } = useFeatureCan();
const isBranchFeatureCan = featureCan(Features.Branches);
// Handle fetch Currencies data table
const { data: currencies, isLoading: isCurrenciesLoading } = useCurrencies();
@@ -33,6 +39,14 @@ function VendorFormProvider({ vendorId, ...props }) {
contactId,
{ enabled: !!contactId },
);
// Fetches the branches list.
const {
data: branches,
isLoading: isBranchesLoading,
isSuccess: isBranchesSuccess,
} = useBranches(query, { enabled: isBranchFeatureCan });
// Create and edit vendor mutations.
const { mutateAsync: createVendorMutate } = useCreateVendor();
const { mutateAsync: editVendorMutate } = useEditVendor();
@@ -44,17 +58,22 @@ function VendorFormProvider({ vendorId, ...props }) {
const isNewMode = contactId || !vendorId;
const isFormLoading =
isVendorLoading || isContactLoading || isCurrenciesLoading;
isVendorLoading ||
isContactLoading ||
isCurrenciesLoading ||
isBranchesLoading;
const provider = {
vendorId,
currencies,
vendor,
branches,
contactDuplicate: { ...omit(contactDuplicate, ['opening_balance_at']) },
submitPayload,
isNewMode,
isFormLoading,
isBranchesSuccess,
createVendorMutate,
editVendorMutate,

21
src/containers/Vendors/VendorForm/utils.js
View File

@@ -1,4 +1,9 @@
import React from 'react';
import moment from 'moment';
import { useFormikContext } from 'formik';
import { first } from 'lodash';
import { useVendorFormContext } from './VendorFormProvider';
export const defaultInitialValues = {
salutation: '',
@@ -33,4 +38,20 @@ export const defaultInitialValues = {
opening_balance: '',
currency_code: '',
opening_balance_at: moment(new Date()).format('YYYY-MM-DD'),
opening_balance_branch_id: '',
};
export const useSetPrimaryBranchToForm = () => {
const { setFieldValue } = useFormikContext();
const { branches, isBranchesSuccess } = useVendorFormContext();
React.useEffect(() => {
if (isBranchesSuccess) {
const primaryBranch = branches.find((b) => b.primary) || first(branches);
if (primaryBranch) {
setFieldValue('opening_balance_branch_id', primaryBranch.id);
}
}
}, [isBranchesSuccess, setFieldValue, branches]);
};

4
src/lang/en/index.json
View File

@@ -1895,5 +1895,7 @@
"vendor_opening_balance.success_message": "The opening balance of the given vendor has been changed successfully.",
"vendor_opening_balance.label": "Edit Vendor Opening Balance",
"vendor_opening_balance.label.opening_balance": "Opening balance",
"vendor_opening_balance.label.opening_balance_at": "Opening balance at"
"vendor_opening_balance.label.opening_balance_at": "Opening balance at",
"customer.label.opening_branch": "Opening Balance Branch",
"vendor.label.opening_branch": "Opening Balance Branch"
}