mirror of
https://github.com/bigcapitalhq/bigcapital.git
synced 2026-02-18 13:50:31 +00:00
fix: items entries total calculation.
This commit is contained in:
@@ -75,7 +75,7 @@ export function QuantityTotalFooterCell({ rows }) {
|
||||
* Total footer cell.
|
||||
*/
|
||||
export function TotalFooterCell({ payload: { currencyCode }, rows }) {
|
||||
const total = safeSumBy(rows, 'original.total');
|
||||
const total = safeSumBy(rows, 'original.amount');
|
||||
return <span>{formattedAmount(total, currencyCode)}</span>;
|
||||
}
|
||||
|
||||
@@ -168,7 +168,7 @@ export function useEditableItemsEntriesColumns({ landedCost }) {
|
||||
{
|
||||
Header: intl.get('total'),
|
||||
Footer: TotalFooterCell,
|
||||
accessor: 'total',
|
||||
accessor: 'amount',
|
||||
Cell: TotalCell,
|
||||
disableSortBy: true,
|
||||
width: 100,
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import { sumBy } from 'lodash';
|
||||
import { toSafeNumber } from 'utils';
|
||||
|
||||
/**
|
||||
@@ -21,7 +22,7 @@ export const calcItemEntryTotal = (discount, quantity, rate) => {
|
||||
export function updateItemsEntriesTotal(rows) {
|
||||
return rows.map((row) => ({
|
||||
...row,
|
||||
total: calcItemEntryTotal(row.discount, row.quantity, row.rate),
|
||||
amount: calcItemEntryTotal(row.discount, row.quantity, row.rate),
|
||||
}));
|
||||
}
|
||||
|
||||
@@ -29,3 +30,10 @@ export const ITEM_TYPE = {
|
||||
SELLABLE: 'SELLABLE',
|
||||
PURCHASABLE: 'PURCHASABLE',
|
||||
};
|
||||
|
||||
/**
|
||||
* Retrieve total of the given items entries.
|
||||
*/
|
||||
export function getEntriesTotal(entries) {
|
||||
return sumBy(entries, 'amount');
|
||||
}
|
||||
@@ -21,7 +21,7 @@ function BillFormHeader({
|
||||
const { values } = useFormikContext();
|
||||
|
||||
// Calculate the total due amount of bill entries.
|
||||
const totalDueAmount = useMemo(() => sumBy(values.entries, 'total'), [
|
||||
const totalDueAmount = useMemo(() => sumBy(values.entries, 'amount'), [
|
||||
values.entries,
|
||||
]);
|
||||
|
||||
|
||||
@@ -17,6 +17,7 @@ export const defaultBillEntry = {
|
||||
discount: '',
|
||||
quantity: '',
|
||||
description: '',
|
||||
amount: '',
|
||||
landed_cost: false,
|
||||
};
|
||||
|
||||
|
||||
@@ -89,6 +89,7 @@ function EstimateForm({
|
||||
);
|
||||
const totalQuantity = sumBy(entries, (entry) => parseInt(entry.quantity));
|
||||
|
||||
// Validate the entries quantity should be bigger than zero.
|
||||
if (totalQuantity === 0) {
|
||||
AppToaster.show({
|
||||
message: intl.get('quantity_cannot_be_zero_or_empty'),
|
||||
|
||||
@@ -1,14 +1,15 @@
|
||||
import React, { useMemo } from 'react';
|
||||
import classNames from 'classnames';
|
||||
import { sumBy } from 'lodash';
|
||||
import { useFormikContext } from 'formik';
|
||||
import intl from 'react-intl-universal';
|
||||
|
||||
import { CLASSES } from 'common/classes';
|
||||
|
||||
import EstimateFormHeaderFields from './EstimateFormHeaderFields';
|
||||
import { PageFormBigNumber } from 'components';
|
||||
|
||||
import withSettings from 'containers/Settings/withSettings';
|
||||
|
||||
import { getEntriesTotal } from 'containers/Entries/utils';
|
||||
import { PageFormBigNumber } from 'components';
|
||||
import { compose } from 'utils';
|
||||
|
||||
// Estimate form top header.
|
||||
@@ -20,7 +21,7 @@ function EstimateFormHeader({
|
||||
|
||||
// Calculate the total due amount of bill entries.
|
||||
const totalDueAmount = useMemo(
|
||||
() => sumBy(values.entries, 'total'),
|
||||
() => getEntriesTotal(values.entries),
|
||||
[values.entries],
|
||||
);
|
||||
|
||||
|
||||
@@ -8,6 +8,7 @@ import {
|
||||
useCreateEstimate,
|
||||
useEditEstimate,
|
||||
} from 'hooks/query';
|
||||
import { ITEMS_FILTER_ROLES } from './utils';
|
||||
|
||||
const EstimateFormContext = createContext();
|
||||
|
||||
@@ -18,31 +19,24 @@ function EstimateFormProvider({ estimateId, ...props }) {
|
||||
const {
|
||||
data: estimate,
|
||||
isFetching: isEstimateFetching,
|
||||
isLoading: isEstimateLoading,
|
||||
} = useEstimate(estimateId, { enabled: !!estimateId });
|
||||
|
||||
// Filter all sellable items only.
|
||||
const stringifiedFilterRoles = React.useMemo(
|
||||
() =>
|
||||
JSON.stringify([
|
||||
{ index: 1, fieldKey: 'sellable', value: true, condition: '&&', comparator: 'equals', },
|
||||
{ index: 2, fieldKey: 'active', value: true, condition: '&&', comparator: 'equals' },
|
||||
]),
|
||||
[],
|
||||
);
|
||||
|
||||
// Handle fetch Items data table or list
|
||||
const {
|
||||
data: { items },
|
||||
isFetching: isItemsFetching,
|
||||
isLoading: isItemsLoading,
|
||||
} = useItems({
|
||||
page_size: 10000,
|
||||
stringified_filter_roles: stringifiedFilterRoles,
|
||||
stringified_filter_roles: ITEMS_FILTER_ROLES,
|
||||
});
|
||||
|
||||
// Handle fetch customers data table or list
|
||||
const {
|
||||
data: { customers },
|
||||
isFetch: isCustomersFetching,
|
||||
isLoading: isCustomersLoading,
|
||||
} = useCustomers({ page_size: 10000 });
|
||||
|
||||
// Handle fetch settings.
|
||||
@@ -68,6 +62,10 @@ function EstimateFormProvider({ estimateId, ...props }) {
|
||||
isItemsFetching,
|
||||
isEstimateFetching,
|
||||
|
||||
isCustomersLoading,
|
||||
isItemsLoading,
|
||||
isEstimateLoading,
|
||||
|
||||
submitPayload,
|
||||
setSubmitPayload,
|
||||
|
||||
@@ -77,7 +75,7 @@ function EstimateFormProvider({ estimateId, ...props }) {
|
||||
|
||||
return (
|
||||
<DashboardInsider
|
||||
loading={isCustomersFetching || isItemsFetching || isEstimateFetching}
|
||||
loading={isCustomersLoading || isItemsLoading || isEstimateLoading}
|
||||
name={'estimate-form'}
|
||||
>
|
||||
<EstimateFormContext.Provider value={provider} {...props} />
|
||||
|
||||
@@ -17,6 +17,7 @@ export const defaultEstimateEntry = {
|
||||
discount: '',
|
||||
quantity: '',
|
||||
description: '',
|
||||
amount: '',
|
||||
};
|
||||
|
||||
export const defaultEstimate = {
|
||||
@@ -55,7 +56,7 @@ export const useObserveEstimateNoSettings = (prefix, nextNumber) => {
|
||||
setFieldValue('estimate_number', estimateNo);
|
||||
}, [setFieldValue, prefix, nextNumber]);
|
||||
};
|
||||
|
||||
|
||||
/**
|
||||
* Detarmines customers fast field when update.
|
||||
*/
|
||||
@@ -75,3 +76,20 @@ export const entriesFieldShouldUpdate = (newProps, oldProps) => {
|
||||
defaultFastFieldShouldUpdate(newProps, oldProps)
|
||||
);
|
||||
};
|
||||
|
||||
export const ITEMS_FILTER_ROLES = JSON.stringify([
|
||||
{
|
||||
index: 1,
|
||||
fieldKey: 'sellable',
|
||||
value: true,
|
||||
condition: '&&',
|
||||
comparator: 'equals',
|
||||
},
|
||||
{
|
||||
index: 2,
|
||||
fieldKey: 'active',
|
||||
value: true,
|
||||
condition: '&&',
|
||||
comparator: 'equals',
|
||||
},
|
||||
]);
|
||||
|
||||
@@ -1,13 +1,14 @@
|
||||
import React, { useMemo } from 'react';
|
||||
import classNames from 'classnames';
|
||||
import { sumBy } from 'lodash';
|
||||
import { useFormikContext } from 'formik';
|
||||
import intl from 'react-intl-universal';
|
||||
|
||||
import { CLASSES } from 'common/classes';
|
||||
import InvoiceFormHeaderFields from './InvoiceFormHeaderFields';
|
||||
|
||||
import { getEntriesTotal } from 'containers/Entries/utils';
|
||||
import { PageFormBigNumber } from 'components';
|
||||
|
||||
import withSettings from 'containers/Settings/withSettings';
|
||||
|
||||
import { compose } from 'redux';
|
||||
@@ -23,7 +24,7 @@ function InvoiceFormHeader({
|
||||
|
||||
// Calculate the total due amount of invoice entries.
|
||||
const totalDueAmount = useMemo(
|
||||
() => sumBy(values.entries, 'total'),
|
||||
() => getEntriesTotal(values.entries),
|
||||
[values.entries],
|
||||
);
|
||||
|
||||
|
||||
@@ -2,7 +2,7 @@ import React, { createContext, useState } from 'react';
|
||||
import { isEmpty, pick } from 'lodash';
|
||||
import { useLocation } from 'react-router-dom';
|
||||
import DashboardInsider from 'components/Dashboard/DashboardInsider';
|
||||
import { transformToEditForm } from './utils';
|
||||
import { transformToEditForm, ITEMS_FILTER_ROLES_QUERY } from './utils';
|
||||
import {
|
||||
useInvoice,
|
||||
useItems,
|
||||
@@ -27,10 +27,10 @@ function InvoiceFormProvider({ invoiceId, ...props }) {
|
||||
});
|
||||
|
||||
// Fetches the estimate by the given id.
|
||||
const {
|
||||
data: estimate,
|
||||
isLoading: isEstimateLoading,
|
||||
} = useEstimate(estimateId, { enabled: !!estimateId });
|
||||
const { data: estimate, isLoading: isEstimateLoading } = useEstimate(
|
||||
estimateId,
|
||||
{ enabled: !!estimateId },
|
||||
);
|
||||
|
||||
const newInvoice = !isEmpty(estimate)
|
||||
? transformToEditForm({
|
||||
@@ -38,23 +38,13 @@ function InvoiceFormProvider({ invoiceId, ...props }) {
|
||||
})
|
||||
: [];
|
||||
|
||||
// Filter all sellable items only.
|
||||
const stringifiedFilterRoles = React.useMemo(
|
||||
() =>
|
||||
JSON.stringify([
|
||||
{ index: 1, fieldKey: 'sellable', value: true, condition: '&&', comparator: 'equals', },
|
||||
{ index: 2, fieldKey: 'active', value: true, condition: '&&', comparator: 'equals' },
|
||||
]),
|
||||
[],
|
||||
);
|
||||
|
||||
// Handle fetching the items table based on the given query.
|
||||
const {
|
||||
data: { items },
|
||||
isLoading: isItemsLoading,
|
||||
} = useItems({
|
||||
page_size: 10000,
|
||||
stringified_filter_roles: stringifiedFilterRoles,
|
||||
stringified_filter_roles: ITEMS_FILTER_ROLES_QUERY,
|
||||
});
|
||||
|
||||
// Handle fetch customers data table or list
|
||||
|
||||
@@ -26,7 +26,7 @@ export const defaultInvoiceEntry = {
|
||||
discount: '',
|
||||
quantity: '',
|
||||
description: '',
|
||||
total: 0,
|
||||
amount: '',
|
||||
};
|
||||
|
||||
// Default invoice object.
|
||||
@@ -63,6 +63,9 @@ export function transformToEditForm(invoice) {
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Transformes the response errors types.
|
||||
*/
|
||||
export const transformErrors = (errors, { setErrors }) => {
|
||||
if (errors.some((e) => e.type === ERROR.SALE_INVOICE_NUMBER_IS_EXISTS)) {
|
||||
setErrors({
|
||||
@@ -102,6 +105,9 @@ export const useObserveInvoiceNoSettings = (prefix, nextNumber) => {
|
||||
}, [setFieldValue, prefix, nextNumber]);
|
||||
};
|
||||
|
||||
/**
|
||||
* Detarmines customer name field when should update.
|
||||
*/
|
||||
export const customerNameFieldShouldUpdate = (newProps, oldProps) => {
|
||||
return (
|
||||
newProps.customers !== oldProps.customers ||
|
||||
@@ -109,9 +115,29 @@ export const customerNameFieldShouldUpdate = (newProps, oldProps) => {
|
||||
);
|
||||
};
|
||||
|
||||
/**
|
||||
* Detarmines invoice entries field when should update.
|
||||
*/
|
||||
export const entriesFieldShouldUpdate = (newProps, oldProps) => {
|
||||
return (
|
||||
newProps.items !== oldProps.items ||
|
||||
defaultFastFieldShouldUpdate(newProps, oldProps)
|
||||
);
|
||||
};
|
||||
|
||||
export const ITEMS_FILTER_ROLES_QUERY = JSON.stringify([
|
||||
{
|
||||
index: 1,
|
||||
fieldKey: 'sellable',
|
||||
value: true,
|
||||
condition: '&&',
|
||||
comparator: 'equals',
|
||||
},
|
||||
{
|
||||
index: 2,
|
||||
fieldKey: 'active',
|
||||
value: true,
|
||||
condition: '&&',
|
||||
comparator: 'equals',
|
||||
},
|
||||
]);
|
||||
|
||||
@@ -1,15 +1,15 @@
|
||||
import React, { useMemo } from 'react';
|
||||
import classNames from 'classnames';
|
||||
import { sumBy } from 'lodash';
|
||||
import { useFormikContext } from 'formik';
|
||||
|
||||
import { CLASSES } from 'common/classes';
|
||||
import ReceiptFormHeaderFields from './ReceiptFormHeaderFields';
|
||||
|
||||
import { PageFormBigNumber } from 'components';
|
||||
import intl from 'react-intl-universal';
|
||||
|
||||
import { CLASSES } from 'common/classes';
|
||||
import { PageFormBigNumber } from 'components';
|
||||
import ReceiptFormHeaderFields from './ReceiptFormHeaderFields';
|
||||
|
||||
import withSettings from 'containers/Settings/withSettings';
|
||||
|
||||
import { getEntriesTotal } from 'containers/Entries/utils';
|
||||
import { compose } from 'redux';
|
||||
|
||||
/**
|
||||
@@ -25,7 +25,7 @@ function ReceiptFormHeader({
|
||||
|
||||
// Calculate the total due amount of bill entries.
|
||||
const totalDueAmount = useMemo(
|
||||
() => sumBy(values.entries, 'total'),
|
||||
() => getEntriesTotal(values.entries),
|
||||
[values.entries],
|
||||
);
|
||||
|
||||
|
||||
@@ -17,6 +17,7 @@ export const defaultReceiptEntry = {
|
||||
discount: '',
|
||||
quantity: '',
|
||||
description: '',
|
||||
amount: '',
|
||||
};
|
||||
|
||||
export const defaultReceipt = {
|
||||
|
||||
@@ -26,6 +26,7 @@
|
||||
@import 'components/PageForm';
|
||||
@import 'components/Tooltip';
|
||||
@import 'components/Postbox';
|
||||
@import 'components/SidebarOverlay';
|
||||
|
||||
// Pages
|
||||
@import 'pages/view-form';
|
||||
@@ -201,134 +202,6 @@ html[lang^="ar"] {
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.sidebar-overlay {
|
||||
background: #fff;
|
||||
height: 100%;
|
||||
width: 225px;
|
||||
outline: 0;
|
||||
box-shadow: 0 0 2px rgba(0, 0, 0, 0.1);
|
||||
|
||||
&__scroll-wrapper {
|
||||
height: 100%
|
||||
}
|
||||
|
||||
.ScrollbarsCustom-Track {
|
||||
|
||||
&.ScrollbarsCustom-TrackY,
|
||||
&.ScrollbarsCustom-TrackX {
|
||||
background: rgba(0, 0, 0, 0);
|
||||
}
|
||||
}
|
||||
|
||||
.ScrollbarsCustom-Thumb {
|
||||
|
||||
&.ScrollbarsCustom-ThumbX,
|
||||
&.ScrollbarsCustom-ThumbY {
|
||||
background: rgba(0, 0, 0, 0);
|
||||
}
|
||||
}
|
||||
|
||||
.ScrollbarsCustom-Content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
.ScrollbarsCustom-Thumb {
|
||||
|
||||
&.ScrollbarsCustom-ThumbX,
|
||||
&.ScrollbarsCustom-ThumbY {
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&__menu {
|
||||
margin: 16px 0;
|
||||
}
|
||||
|
||||
&__item {
|
||||
font-size: 15px;
|
||||
color: #00102b;
|
||||
|
||||
a {
|
||||
color: inherit;
|
||||
display: block;
|
||||
padding: 10px 22px;
|
||||
text-decoration: none;
|
||||
|
||||
&:hover,
|
||||
&:focus{
|
||||
background: #f3f3f3;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&__divider {
|
||||
height: 1px;
|
||||
margin: 6px 0;
|
||||
background: #e2e5ec;
|
||||
}
|
||||
|
||||
&__label{
|
||||
text-transform: uppercase;
|
||||
font-size: 12px;
|
||||
padding: 14px 20px 10px;
|
||||
letter-spacing: 1px;
|
||||
color: #707a85;
|
||||
|
||||
html[lang^="ar"] & {
|
||||
font-size: 13px;
|
||||
letter-spacing: 0;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
|
||||
&__label + .sidebar-overlay__divider{
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar-overlay-transition {
|
||||
transform: translateX(-100%);
|
||||
|
||||
&.bp3-overlay{
|
||||
&-appear,
|
||||
&-enter {
|
||||
transform: translateX(-100%)
|
||||
}
|
||||
|
||||
&-appear-active,
|
||||
&-enter-active {
|
||||
transform: translateX(0) !important;
|
||||
transition: all 100ms ease-in-out;
|
||||
}
|
||||
|
||||
&-appear-done,
|
||||
&-enter-done {
|
||||
transform: translateX(0) !important;
|
||||
}
|
||||
|
||||
&-exit {
|
||||
transform: translateX(0) !important;
|
||||
}
|
||||
&-exit-active {
|
||||
transform: translateX(-100%) !important;
|
||||
transition: all 100ms ease-in-out;
|
||||
}
|
||||
&-exit-done{
|
||||
transform: translateX(-100%) !important;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
.sidebar-overlay-backdrop{
|
||||
background-color: rgba(0, 10, 30, 0.15);
|
||||
}
|
||||
|
||||
|
||||
.bp3-popover2{
|
||||
box-shadow: 0 0 0;
|
||||
}
|
||||
|
||||
129
client/src/style/components/SidebarOverlay.scss
Normal file
129
client/src/style/components/SidebarOverlay.scss
Normal file
@@ -0,0 +1,129 @@
|
||||
|
||||
|
||||
.sidebar-overlay {
|
||||
background: #fff;
|
||||
height: 100%;
|
||||
width: 225px;
|
||||
outline: 0;
|
||||
box-shadow: 0 0 2px rgba(0, 0, 0, 0.1);
|
||||
|
||||
&__scroll-wrapper {
|
||||
height: 100%
|
||||
}
|
||||
|
||||
.ScrollbarsCustom-Track {
|
||||
|
||||
&.ScrollbarsCustom-TrackY,
|
||||
&.ScrollbarsCustom-TrackX {
|
||||
background: rgba(0, 0, 0, 0);
|
||||
}
|
||||
}
|
||||
|
||||
.ScrollbarsCustom-Thumb {
|
||||
|
||||
&.ScrollbarsCustom-ThumbX,
|
||||
&.ScrollbarsCustom-ThumbY {
|
||||
background: rgba(0, 0, 0, 0);
|
||||
}
|
||||
}
|
||||
|
||||
.ScrollbarsCustom-Content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
.ScrollbarsCustom-Thumb {
|
||||
|
||||
&.ScrollbarsCustom-ThumbX,
|
||||
&.ScrollbarsCustom-ThumbY {
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&__menu {
|
||||
margin: 16px 0;
|
||||
}
|
||||
|
||||
&__item {
|
||||
font-size: 15px;
|
||||
color: #00102b;
|
||||
|
||||
a {
|
||||
color: inherit;
|
||||
display: block;
|
||||
padding: 10px 22px;
|
||||
text-decoration: none;
|
||||
|
||||
&:hover,
|
||||
&:focus{
|
||||
background: #f3f3f3;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&__divider {
|
||||
height: 1px;
|
||||
margin: 6px 0;
|
||||
background: #e2e5ec;
|
||||
}
|
||||
|
||||
&__label{
|
||||
text-transform: uppercase;
|
||||
font-size: 12px;
|
||||
padding: 14px 20px 10px;
|
||||
letter-spacing: 1px;
|
||||
color: #707a85;
|
||||
|
||||
html[lang^="ar"] & {
|
||||
font-size: 13px;
|
||||
letter-spacing: 0;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
|
||||
&__label + .sidebar-overlay__divider{
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar-overlay-transition {
|
||||
transform: translateX(-100%);
|
||||
|
||||
&.bp3-overlay{
|
||||
&-appear,
|
||||
&-enter {
|
||||
transform: translateX(-100%)
|
||||
}
|
||||
|
||||
&-appear-active,
|
||||
&-enter-active {
|
||||
transform: translateX(0) !important;
|
||||
transition: all 100ms ease-in-out;
|
||||
}
|
||||
|
||||
&-appear-done,
|
||||
&-enter-done {
|
||||
transform: translateX(0) !important;
|
||||
}
|
||||
|
||||
&-exit {
|
||||
transform: translateX(0) !important;
|
||||
}
|
||||
&-exit-active {
|
||||
transform: translateX(-100%) !important;
|
||||
transition: all 100ms ease-in-out;
|
||||
}
|
||||
&-exit-done{
|
||||
transform: translateX(-100%) !important;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
.sidebar-overlay-backdrop{
|
||||
background-color: rgba(0, 10, 30, 0.15);
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user