From f27ef2c9b0243dcd80783270d513b92640cd42cc Mon Sep 17 00:00:00 2001 From: "a.bouhuolia" Date: Sun, 13 Feb 2022 17:17:09 +0200 Subject: [PATCH 01/14] fix: style of vendor/customer balance summary. --- .../CustomersBalanceSummaryTable.js | 30 +++++++++++++++++-- .../CustomersBalanceSummary/components.js | 9 +++++- .../VendorsBalanceSummary.js | 1 + .../VendorsBalanceSummaryTable.js | 4 ++- .../VendorsBalanceSummary/components.js | 6 ++-- 5 files changed, 44 insertions(+), 6 deletions(-) diff --git a/src/containers/FinancialStatements/CustomersBalanceSummary/CustomersBalanceSummaryTable.js b/src/containers/FinancialStatements/CustomersBalanceSummary/CustomersBalanceSummaryTable.js index 207be4344..893519bb5 100644 --- a/src/containers/FinancialStatements/CustomersBalanceSummary/CustomersBalanceSummaryTable.js +++ b/src/containers/FinancialStatements/CustomersBalanceSummary/CustomersBalanceSummaryTable.js @@ -1,15 +1,17 @@ import React from 'react'; import intl from 'react-intl-universal'; +import styled from 'styled-components'; import { DataTable, FinancialSheet } from 'components'; import { useCustomersBalanceSummaryContext } from './CustomersBalanceSummaryProvider'; import { useCustomersSummaryColumns } from './components'; +import { TableStyle } from 'common'; import { tableRowTypesToClassnames } from 'utils'; /** - * customers balance summary table. + * Customers balance summary table. */ export default function CustomersBalanceSummaryTable({ // #ownProps @@ -27,12 +29,36 @@ export default function CustomersBalanceSummaryTable({ sheetType={intl.get('customers_balance_summary')} asDate={new Date()} > - ); } + +const CustomerBalanceDataTable = styled(DataTable)` + .table { + .tbody { + .tr:not(.no-results) { + .td { + border-bottom: 0; + padding-top: 0.4rem; + padding-bottom: 0.4rem; + } + + &.row_type--TOTAL { + font-weight: 500; + + .td { + border-top: 1px solid #bbb; + border-bottom: 3px double #333; + } + } + } + } + } +`; diff --git a/src/containers/FinancialStatements/CustomersBalanceSummary/components.js b/src/containers/FinancialStatements/CustomersBalanceSummary/components.js index 0ee163664..7efb9b95f 100644 --- a/src/containers/FinancialStatements/CustomersBalanceSummary/components.js +++ b/src/containers/FinancialStatements/CustomersBalanceSummary/components.js @@ -6,6 +6,8 @@ import { If } from 'components'; import FinancialLoadingBar from '../FinancialLoadingBar'; import { useCustomersBalanceSummaryContext } from './CustomersBalanceSummaryProvider'; +import { Align } from 'common'; + /** * Retrieve customers balance summary columns. */ @@ -37,6 +39,7 @@ const totalColumnAccessor = () => ({ accessor: 'cells[1].value', className: 'total', width: 140, + align: Align.Right, }); /** @@ -47,6 +50,7 @@ const percentageColumnAccessor = () => ({ accessor: 'cells[2].value', className: 'total', width: 140, + align: Align.Right, }); const dynamicColumns = (columns) => { @@ -54,7 +58,10 @@ const dynamicColumns = (columns) => { R.compose( R.when(R.pathEq(['key'], 'name'), accountNameColumnAccessor), R.when(R.pathEq(['key'], 'total'), totalColumnAccessor), - R.when(R.pathEq(['key'], 'percentage_of_column'), percentageColumnAccessor), + R.when( + R.pathEq(['key'], 'percentage_of_column'), + percentageColumnAccessor, + ), ), )(columns); }; diff --git a/src/containers/FinancialStatements/VendorsBalanceSummary/VendorsBalanceSummary.js b/src/containers/FinancialStatements/VendorsBalanceSummary/VendorsBalanceSummary.js index 6ae38960f..208fb9a39 100644 --- a/src/containers/FinancialStatements/VendorsBalanceSummary/VendorsBalanceSummary.js +++ b/src/containers/FinancialStatements/VendorsBalanceSummary/VendorsBalanceSummary.js @@ -13,6 +13,7 @@ import { VendorBalanceSummaryBody } from './VendorsBalanceSummaryBody'; import withVendorsBalanceSummaryActions from './withVendorsBalanceSummaryActions'; +import { TableStyle } from 'common'; import { getDefaultVendorsBalanceQuery } from './utils'; import { compose } from 'utils'; diff --git a/src/containers/FinancialStatements/VendorsBalanceSummary/VendorsBalanceSummaryTable.js b/src/containers/FinancialStatements/VendorsBalanceSummary/VendorsBalanceSummaryTable.js index 6bc4431c9..f5e6f708f 100644 --- a/src/containers/FinancialStatements/VendorsBalanceSummary/VendorsBalanceSummaryTable.js +++ b/src/containers/FinancialStatements/VendorsBalanceSummary/VendorsBalanceSummaryTable.js @@ -7,6 +7,7 @@ import { DataTable, FinancialSheet } from 'components'; import { useVendorsBalanceColumns } from './components'; import { useVendorsBalanceSummaryContext } from './VendorsBalanceSummaryProvider'; +import { TableStyle } from 'common'; import { tableRowTypesToClassnames } from 'utils'; /** @@ -34,6 +35,7 @@ export default function VendorsBalanceSummaryTable({ data={table.data} rowClassNames={tableRowTypesToClassnames} noInitialFetch={true} + styleName={TableStyle.Constrant} /> ); @@ -51,7 +53,7 @@ const VendorBalanceDataTable = styled(DataTable)` padding-bottom: 0.4rem; } - &.row-type--TOTAL { + &.row_type--TOTAL { font-weight: 500; .td { diff --git a/src/containers/FinancialStatements/VendorsBalanceSummary/components.js b/src/containers/FinancialStatements/VendorsBalanceSummary/components.js index 6075ada08..fcf4e5aed 100644 --- a/src/containers/FinancialStatements/VendorsBalanceSummary/components.js +++ b/src/containers/FinancialStatements/VendorsBalanceSummary/components.js @@ -6,6 +6,8 @@ import { If } from 'components'; import FinancialLoadingBar from '../FinancialLoadingBar'; import { useVendorsBalanceSummaryContext } from './VendorsBalanceSummaryProvider'; +import { Align } from 'common'; + /** * Retrieve vendors balance summary columns. */ @@ -39,8 +41,8 @@ const percentageColumnAccessor = () => ({ accessor: 'cells[2].value', className: 'total', width: 140, - align: 'right', textOverview: true, + align: Align.Right, }); /** @@ -51,8 +53,8 @@ const totalColumnAccessor = () => ({ accessor: 'cells[1].value', className: 'total', width: 140, - align: 'right', textOverview: true, + align: Align.Right, }); /** From 673808ccebf7548977f90575acb736d118969d15 Mon Sep 17 00:00:00 2001 From: "a.bouhuolia" Date: Sun, 13 Feb 2022 17:22:29 +0200 Subject: [PATCH 02/14] feat: add sticky table head to specific item transactions table. --- .../ItemPaymentTransactions/BillPaymentTransactions/index.js | 1 + .../ItemPaymentTransactions/EstimatePaymentTransactions/index.js | 1 + .../ItemPaymentTransactions/InvoicePaymentTransactions/index.js | 1 + .../ItemPaymentTransactions/ReceiptPaymentTransactions/index.js | 1 + 4 files changed, 4 insertions(+) diff --git a/src/containers/Drawers/ItemDetailDrawer/ItemPaymentTransactions/BillPaymentTransactions/index.js b/src/containers/Drawers/ItemDetailDrawer/ItemPaymentTransactions/BillPaymentTransactions/index.js index 92b0250fb..5e1a2b78a 100644 --- a/src/containers/Drawers/ItemDetailDrawer/ItemPaymentTransactions/BillPaymentTransactions/index.js +++ b/src/containers/Drawers/ItemDetailDrawer/ItemPaymentTransactions/BillPaymentTransactions/index.js @@ -64,6 +64,7 @@ function BillPaymentTransactions({ }} styleName={TableStyle.Constrant} TableLoadingRenderer={TableSkeletonRows} + sticky={true} /> ); } diff --git a/src/containers/Drawers/ItemDetailDrawer/ItemPaymentTransactions/EstimatePaymentTransactions/index.js b/src/containers/Drawers/ItemDetailDrawer/ItemPaymentTransactions/EstimatePaymentTransactions/index.js index b21c05384..3da3046f6 100644 --- a/src/containers/Drawers/ItemDetailDrawer/ItemPaymentTransactions/EstimatePaymentTransactions/index.js +++ b/src/containers/Drawers/ItemDetailDrawer/ItemPaymentTransactions/EstimatePaymentTransactions/index.js @@ -66,6 +66,7 @@ function EstimatePaymentTransactions({ }} styleName={TableStyle.Constrant} TableLoadingRenderer={TableSkeletonRows} + sticky={true} /> ); } diff --git a/src/containers/Drawers/ItemDetailDrawer/ItemPaymentTransactions/InvoicePaymentTransactions/index.js b/src/containers/Drawers/ItemDetailDrawer/ItemPaymentTransactions/InvoicePaymentTransactions/index.js index 28e4fb3ee..df55f7aac 100644 --- a/src/containers/Drawers/ItemDetailDrawer/ItemPaymentTransactions/InvoicePaymentTransactions/index.js +++ b/src/containers/Drawers/ItemDetailDrawer/ItemPaymentTransactions/InvoicePaymentTransactions/index.js @@ -68,6 +68,7 @@ function InvoicePaymentTransactions({ }} styleName={TableStyle.Constrant} TableLoadingRenderer={TableSkeletonRows} + sticky={true} /> ); } diff --git a/src/containers/Drawers/ItemDetailDrawer/ItemPaymentTransactions/ReceiptPaymentTransactions/index.js b/src/containers/Drawers/ItemDetailDrawer/ItemPaymentTransactions/ReceiptPaymentTransactions/index.js index d9d96e705..19786940b 100644 --- a/src/containers/Drawers/ItemDetailDrawer/ItemPaymentTransactions/ReceiptPaymentTransactions/index.js +++ b/src/containers/Drawers/ItemDetailDrawer/ItemPaymentTransactions/ReceiptPaymentTransactions/index.js @@ -66,6 +66,7 @@ function ReceiptPaymentTransactions({ }} styleName={TableStyle.Constrant} TableLoadingRenderer={TableSkeletonRows} + sticky={true} /> ); } From 7eacaa06608884e4df65472c434673b698d56b2e Mon Sep 17 00:00:00 2001 From: "a.bouhuolia" Date: Mon, 14 Feb 2022 14:09:17 +0200 Subject: [PATCH 03/14] fix: financial report data tables. --- .../APAgingSummary/APAgingSummaryTable.js | 1 - .../CashFlowStatement/dynamicColumns.js | 1 + .../CustomersBalanceSummaryTable.js | 1 + .../CustomersTransactionsTable.js | 11 +++-- .../CustomersTransactions/components.js | 14 +----- .../GeneralLedger/GeneralLedgerTable.js | 9 ++-- .../GeneralLedger/components.js | 9 +--- .../InventoryItemDetailsTable.js | 27 +++++------ .../InventoryItemDetails/utils.js | 48 ++++++++++++++++--- .../VendorsTransactions/components.js | 16 ++----- 10 files changed, 75 insertions(+), 62 deletions(-) diff --git a/src/containers/FinancialStatements/APAgingSummary/APAgingSummaryTable.js b/src/containers/FinancialStatements/APAgingSummary/APAgingSummaryTable.js index e2ab82bec..c284793ec 100644 --- a/src/containers/FinancialStatements/APAgingSummary/APAgingSummaryTable.js +++ b/src/containers/FinancialStatements/APAgingSummary/APAgingSummaryTable.js @@ -29,7 +29,6 @@ export default function APAgingSummaryTable({ return ( ({ textOverview: true, width: 400, disableSortBy: true, + sticky: Align.Left, }); /** diff --git a/src/containers/FinancialStatements/CustomersBalanceSummary/CustomersBalanceSummaryTable.js b/src/containers/FinancialStatements/CustomersBalanceSummary/CustomersBalanceSummaryTable.js index 893519bb5..e18c2139f 100644 --- a/src/containers/FinancialStatements/CustomersBalanceSummary/CustomersBalanceSummaryTable.js +++ b/src/containers/FinancialStatements/CustomersBalanceSummary/CustomersBalanceSummaryTable.js @@ -21,6 +21,7 @@ export default function CustomersBalanceSummaryTable({ CustomerBalanceSummary: { table }, } = useCustomersBalanceSummaryContext(); + // Retrieves the customers summary columns. const columns = useCustomersSummaryColumns(); return ( diff --git a/src/containers/FinancialStatements/CustomersTransactions/CustomersTransactionsTable.js b/src/containers/FinancialStatements/CustomersTransactions/CustomersTransactionsTable.js index be8143f0f..6c3d50689 100644 --- a/src/containers/FinancialStatements/CustomersTransactions/CustomersTransactionsTable.js +++ b/src/containers/FinancialStatements/CustomersTransactions/CustomersTransactionsTable.js @@ -58,10 +58,10 @@ const CustomersTransactionsDataTable = styled(DataTable)` .table { .tbody { .tr .td { - padding-top: 0.2rem; - padding-bottom: 0.2rem; + padding-top: 0.36rem; + padding-bottom: 0.36rem; } - .tr:not(.no-results) .td { + .tr:not(.no-results) .td:not(:first-of-type) { border-left: 1px solid #ececec; } .tr:last-child .td { @@ -73,6 +73,11 @@ const CustomersTransactionsDataTable = styled(DataTable)` .td { &.customer_name { font-weight: 500; + + .cell-inner { + white-space: nowrap; + position: relative; + } } } &:not(:first-child).is-expanded .td { diff --git a/src/containers/FinancialStatements/CustomersTransactions/components.js b/src/containers/FinancialStatements/CustomersTransactions/components.js index 9b7ec89ee..a1f85ba0a 100644 --- a/src/containers/FinancialStatements/CustomersTransactions/components.js +++ b/src/containers/FinancialStatements/CustomersTransactions/components.js @@ -3,14 +3,13 @@ import intl from 'react-intl-universal'; import { If } from 'components'; import { useCustomersTransactionsContext } from './CustomersTransactionsProvider'; import FinancialLoadingBar from '../FinancialLoadingBar'; -import { getForceWidth, getColumnWidth } from 'utils'; +import { getColumnWidth } from 'utils'; import { Align } from 'common'; /** * Retrieve customers transactions columns. */ - export const useCustomersTransactionsColumns = () => { const { customersTransactions: { tableRows }, @@ -20,16 +19,7 @@ export const useCustomersTransactionsColumns = () => { () => [ { Header: intl.get('customer_name'), - accessor: ({ cells }) => { - return ( - - {cells[0].value} - - ); - }, + accessor: 'cells[0].value', className: 'customer_name', }, { diff --git a/src/containers/FinancialStatements/GeneralLedger/GeneralLedgerTable.js b/src/containers/FinancialStatements/GeneralLedger/GeneralLedgerTable.js index 4b6eed676..57482841c 100644 --- a/src/containers/FinancialStatements/GeneralLedger/GeneralLedgerTable.js +++ b/src/containers/FinancialStatements/GeneralLedger/GeneralLedgerTable.js @@ -78,7 +78,7 @@ const GeneralLedgerDataTable = styled(DataTable)` } } - .tr:not(.no-results) .td { + .tr:not(.no-results) .td:not(:first-of-type) { border-left: 1px solid #ececec; } .tr:last-child .td { @@ -90,10 +90,11 @@ const GeneralLedgerDataTable = styled(DataTable)` .td { &.date { font-weight: 500; - } - &.name { - border-left-color: transparent; + .cell-inner{ + white-space: nowrap; + position: relative; + } } } diff --git a/src/containers/FinancialStatements/GeneralLedger/components.js b/src/containers/FinancialStatements/GeneralLedger/components.js index 45f4e6e88..7fe7e5c33 100644 --- a/src/containers/FinancialStatements/GeneralLedger/components.js +++ b/src/containers/FinancialStatements/GeneralLedger/components.js @@ -2,7 +2,7 @@ import React from 'react'; import intl from 'react-intl-universal'; import { Button } from '@blueprintjs/core'; import { Icon, If } from 'components'; -import { ForceWidth, FormattedMessage as T } from 'components'; +import { FormattedMessage as T } from 'components'; import { getColumnWidth } from 'utils'; import { useGeneralLedgerContext } from './GeneralLedgerProvider'; @@ -23,12 +23,7 @@ export function useGeneralLedgerTableColumns() { () => [ { Header: intl.get('date'), - accessor: (row) => { - if (row.rowType === 'ACCOUNT_ROW') { - return ; - } - return row.date; - }, + accessor: 'date', className: 'date', width: 120, }, diff --git a/src/containers/FinancialStatements/InventoryItemDetails/InventoryItemDetailsTable.js b/src/containers/FinancialStatements/InventoryItemDetails/InventoryItemDetailsTable.js index 05d44b4bf..deeb51796 100644 --- a/src/containers/FinancialStatements/InventoryItemDetails/InventoryItemDetailsTable.js +++ b/src/containers/FinancialStatements/InventoryItemDetails/InventoryItemDetailsTable.js @@ -37,6 +37,7 @@ export function InventoryItemDetailsTable({ loading={isInventoryItemDetailsLoading} fromDate={query.from_date} toDate={query.to_date} + fullWidth={true} > div { - display: flex; - } - - span.force-width { - position: relative; - } - } + padding-top: 0.3rem; + padding-bottom: 0.3rem; } - .tr:not(.no-results) .td { + .tr:not(.no-results) .td:not(:first-of-type) { border-left: 1px solid #ececec; } @@ -87,8 +76,14 @@ const InventoryItemDetailsDataTable = styled(DataTable)` &.transaction_type { border-left-color: transparent; } - } + &.date { + .cell-inner { + white-space: nowrap; + position: relative; + } + } + } &:not(:first-child).is-expanded .td { border-top: 1px solid #ddd; } diff --git a/src/containers/FinancialStatements/InventoryItemDetails/utils.js b/src/containers/FinancialStatements/InventoryItemDetails/utils.js index cffc6058f..8e59352ea 100644 --- a/src/containers/FinancialStatements/InventoryItemDetails/utils.js +++ b/src/containers/FinancialStatements/InventoryItemDetails/utils.js @@ -1,17 +1,43 @@ import * as R from 'ramda'; + import { getColumnWidth } from 'utils'; -import { CellForceWidth } from '../../../components'; +import { Align } from 'common'; + +const itemNameOrDateColumn = R.curry((data, index, column) => ({ + id: column.key, + key: column.key, + Header: column.label, + accessor: `cells[${index}].value`, + className: column.key, + width: getColumnWidth(data, `cells.${index}.key`, { + minWidth: 130, + magicSpacing: 10, + }), + disableSortBy: true, +})); + +const numericColumn = R.curry((data, index, column) => ({ + id: column.key, + key: column.key, + Header: column.label, + accessor: `cells[${index}].value`, + className: column.key, + width: getColumnWidth(data, `cells.${index}.key`, { + minWidth: 130, + magicSpacing: 10, + }), + disableSortBy: true, + align: Align.Right, +})); /** * columns mapper. */ -const columnsMapper = (data, index, column) => ({ +const columnsMapper = R.curry((data, index, column) => ({ id: column.key, key: column.key, Header: column.label, - Cell: CellForceWidth, accessor: `cells[${index}].value`, - forceWidthAccess: `cells[0].value`, className: column.key, width: getColumnWidth(data, `cells.${index}.key`, { minWidth: 130, @@ -19,7 +45,7 @@ const columnsMapper = (data, index, column) => ({ }), disableSortBy: true, textOverview: true, -}); +})); /** * Inventory item details columns. @@ -27,7 +53,17 @@ const columnsMapper = (data, index, column) => ({ export const dynamicColumns = (columns, data) => { const mapper = (column, index) => { return R.compose( - R.when(R.pathEq(['key']), R.curry(columnsMapper)(data, index)), + R.cond([ + [R.pathEq(['key'], 'date'), itemNameOrDateColumn(data, index)], + [R.pathEq(['key'], 'running_quantity'), numericColumn(data, index)], + [R.pathEq(['key'], 'profit_margin'), numericColumn(data, index)], + [R.pathEq(['key'], 'running_value'), numericColumn(data, index)], + [R.pathEq(['key'], 'quantity'), numericColumn(data, index)], + [R.pathEq(['key'], 'rate'), numericColumn(data, index)], + [R.pathEq(['key'], 'total'), numericColumn(data, index)], + [R.pathEq(['key'], 'value'), numericColumn(data, index)], + [R.T, columnsMapper(data, index)], + ]), )(column); }; return columns.map(mapper); diff --git a/src/containers/FinancialStatements/VendorsTransactions/components.js b/src/containers/FinancialStatements/VendorsTransactions/components.js index bfb8e0fe5..cfc6586d2 100644 --- a/src/containers/FinancialStatements/VendorsTransactions/components.js +++ b/src/containers/FinancialStatements/VendorsTransactions/components.js @@ -1,9 +1,10 @@ import React from 'react'; import intl from 'react-intl-universal'; + import { If } from 'components'; import { useVendorsTransactionsContext } from './VendorsTransactionsProvider'; import FinancialLoadingBar from '../FinancialLoadingBar'; -import { getColumnWidth, getForceWidth } from 'utils'; +import { getColumnWidth } from 'utils'; /** * Retrieve vendors transactions columns. @@ -17,19 +18,8 @@ export const useVendorsTransactionsColumns = () => { () => [ { Header: intl.get('vendor_name'), - accessor: ({ cells }) => { - return ( - - {cells[0].value} - - ); - }, + accessor: 'cells[1].value', className: 'vendor_name', - // textOverview: true, - // width: 240, }, { Header: intl.get('account_name'), From e6fcbfeea694000ed3163a9f887fae0fbaeda2c7 Mon Sep 17 00:00:00 2001 From: "a.bouhuolia" Date: Wed, 16 Feb 2022 17:49:28 +0200 Subject: [PATCH 04/14] fix: control report drawer header. --- .../APAgingSummary/APAgingSummaryHeader.js | 13 +++++-- .../ARAgingSummary/ARAgingSummaryHeader.js | 13 +++++-- .../BalanceSheet/BalanceSheetHeader.js | 18 +++++++-- .../CustomersBalanceSummaryHeader.js | 15 ++++--- .../CustomersTransactionsHeader.js | 11 +++++- .../FinancialStatementHeader.js | 6 +++ .../GeneralLedger/GeneralLedgerHeader.js | 12 +++++- .../InventoryItemDetailsHeader.js | 39 ++++++++++++------- .../InventoryValuationHeader.js | 27 +++++++++---- .../Journal/JournalHeader.js | 12 +++++- .../ProfitLossSheet/ProfitLossSheetHeader.js | 13 +++++-- .../PurchasesByItemsHeader.js | 15 +++++-- .../SalesByItems/SalesByItemsHeader.js | 14 +++++-- .../TrialBalanceSheet/TrialBalanceSheet.js | 4 -- .../TrialBalanceSheetHeader.js | 24 +++++++++--- .../VendorsBalanceSummaryHeader.js | 12 +++++- 16 files changed, 181 insertions(+), 67 deletions(-) diff --git a/src/containers/FinancialStatements/APAgingSummary/APAgingSummaryHeader.js b/src/containers/FinancialStatements/APAgingSummary/APAgingSummaryHeader.js index ae95f55ac..a952c9a75 100644 --- a/src/containers/FinancialStatements/APAgingSummary/APAgingSummaryHeader.js +++ b/src/containers/FinancialStatements/APAgingSummary/APAgingSummaryHeader.js @@ -4,6 +4,7 @@ import { Formik, Form } from 'formik'; import * as Yup from 'yup'; import moment from 'moment'; import { Tabs, Tab, Button, Intent } from '@blueprintjs/core'; +import styled from 'styled-components'; import FinancialStatementHeader from 'containers/FinancialStatements/FinancialStatementHeader'; import APAgingSummaryHeaderGeneral from './APAgingSummaryHeaderGeneral'; @@ -11,8 +12,8 @@ import APAgingSummaryHeaderGeneral from './APAgingSummaryHeaderGeneral'; import withAPAgingSummary from './withAPAgingSummary'; import withAPAgingSummaryActions from './withAPAgingSummaryActions'; -import { compose } from 'utils'; import { transformToForm } from '../../../utils'; +import { compose } from 'utils'; /** * AP Aging Summary Report - Drawer Header. @@ -72,7 +73,7 @@ function APAgingSummaryHeader({ }; return ( - @@ -99,7 +100,7 @@ function APAgingSummaryHeader({ - + ); } @@ -109,3 +110,9 @@ export default compose( isFilterDrawerOpen: APAgingSummaryFilterDrawer, })), )(APAgingSummaryHeader); + +const APAgingDrawerHeader = styled(FinancialStatementHeader)` + .bp3-drawer { + max-height: 520px; + } +`; diff --git a/src/containers/FinancialStatements/ARAgingSummary/ARAgingSummaryHeader.js b/src/containers/FinancialStatements/ARAgingSummary/ARAgingSummaryHeader.js index b8ea2fa97..124bf3b45 100644 --- a/src/containers/FinancialStatements/ARAgingSummary/ARAgingSummaryHeader.js +++ b/src/containers/FinancialStatements/ARAgingSummary/ARAgingSummaryHeader.js @@ -4,6 +4,7 @@ import { Formik, Form } from 'formik'; import * as Yup from 'yup'; import moment from 'moment'; import { Tabs, Tab, Button, Intent } from '@blueprintjs/core'; +import styled from 'styled-components'; import FinancialStatementHeader from 'containers/FinancialStatements/FinancialStatementHeader'; import ARAgingSummaryHeaderGeneral from './ARAgingSummaryHeaderGeneral'; @@ -57,14 +58,12 @@ function ARAgingSummaryHeader({ }, defaultValues, ); - // Handle form submit. const handleSubmit = (values, { setSubmitting }) => { onSubmitFilter(values); toggleFilterDrawerDisplay(false); setSubmitting(false); }; - // Handle cancel button click. const handleCancelClick = () => { toggleFilterDrawerDisplay(false); @@ -75,7 +74,7 @@ function ARAgingSummaryHeader({ }; return ( - @@ -103,7 +102,7 @@ function ARAgingSummaryHeader({ - + ); } @@ -113,3 +112,9 @@ export default compose( isFilterDrawerOpen: ARAgingSummaryFilterDrawer, })), )(ARAgingSummaryHeader); + +const ARAgingDrawerHeader = styled(FinancialStatementHeader)` + .bp3-drawer { + max-height: 520px; + } +`; diff --git a/src/containers/FinancialStatements/BalanceSheet/BalanceSheetHeader.js b/src/containers/FinancialStatements/BalanceSheet/BalanceSheetHeader.js index c576adceb..05724c988 100644 --- a/src/containers/FinancialStatements/BalanceSheet/BalanceSheetHeader.js +++ b/src/containers/FinancialStatements/BalanceSheet/BalanceSheetHeader.js @@ -1,8 +1,10 @@ import React from 'react'; import { Tabs, Tab, Button, Intent } from '@blueprintjs/core'; -import { FormattedMessage as T } from 'components'; import moment from 'moment'; import { Formik, Form } from 'formik'; +import styled from 'styled-components'; + +import { FormattedMessage as T } from 'components'; import withBalanceSheet from './withBalanceSheet'; import withBalanceSheetActions from './withBalanceSheetActions'; @@ -64,9 +66,11 @@ function BalanceSheetHeader({ }; return ( - - + ); } @@ -107,3 +111,9 @@ export default compose( })), withBalanceSheetActions, )(BalanceSheetHeader); + +const BalanceSheetFinancialHeader = styled(FinancialStatementHeader)` + .bp3-drawer { + max-height: 520px; + } +`; diff --git a/src/containers/FinancialStatements/CustomersBalanceSummary/CustomersBalanceSummaryHeader.js b/src/containers/FinancialStatements/CustomersBalanceSummary/CustomersBalanceSummaryHeader.js index 8f74bc42b..79764b292 100644 --- a/src/containers/FinancialStatements/CustomersBalanceSummary/CustomersBalanceSummaryHeader.js +++ b/src/containers/FinancialStatements/CustomersBalanceSummary/CustomersBalanceSummaryHeader.js @@ -3,6 +3,8 @@ import * as Yup from 'yup'; import { Formik, Form } from 'formik'; import moment from 'moment'; import { Tabs, Tab, Button, Intent } from '@blueprintjs/core'; +import styled from 'styled-components'; + import { FormattedMessage as T } from 'components'; import FinancialStatementHeader from 'containers/FinancialStatements/FinancialStatementHeader'; @@ -30,7 +32,6 @@ function CustomersBalanceSummaryHeader({ const validationSchema = Yup.object().shape({ asDate: Yup.date().required().label('asDate'), }); - // Default form values. const defaultValues = { ...pageFilter, @@ -47,21 +48,19 @@ function CustomersBalanceSummaryHeader({ }, defaultValues, ); - // handle form submit. const handleSubmit = (values, { setSubmitting }) => { onSubmitFilter(values); toggleCustomerBalanceFilterDrawer(false); setSubmitting(false); }; - // handle close drawer. const handleDrawerClose = () => { toggleCustomerBalanceFilterDrawer(false); }; return ( - @@ -89,7 +88,7 @@ function CustomersBalanceSummaryHeader({ - + ); } @@ -99,3 +98,9 @@ export default compose( })), withCustomersBalanceSummaryActions, )(CustomersBalanceSummaryHeader); + +const CustomerBalanceDrawerHeader = styled(FinancialStatementHeader)` + .bp3-drawer { + max-height: 450px; + } +`; diff --git a/src/containers/FinancialStatements/CustomersTransactions/CustomersTransactionsHeader.js b/src/containers/FinancialStatements/CustomersTransactions/CustomersTransactionsHeader.js index bcfd1774e..1cb24fe08 100644 --- a/src/containers/FinancialStatements/CustomersTransactions/CustomersTransactionsHeader.js +++ b/src/containers/FinancialStatements/CustomersTransactions/CustomersTransactionsHeader.js @@ -5,6 +5,7 @@ import intl from 'react-intl-universal'; import moment from 'moment'; import * as Yup from 'yup'; import { Formik, Form } from 'formik'; +import styled from 'styled-components'; import FinancialStatementHeader from 'containers/FinancialStatements/FinancialStatementHeader'; import CustomersTransactionsHeaderGeneralPanel from './CustomersTransactionsHeaderGeneralPanel'; @@ -67,7 +68,7 @@ function CustomersTransactionsHeader({ }; return ( - @@ -95,7 +96,7 @@ function CustomersTransactionsHeader({ - + ); } @@ -105,3 +106,9 @@ export default compose( })), withCustomersTransactionsActions, )(CustomersTransactionsHeader); + +const CustomerTransactionsDrawerHeader = styled(FinancialStatementHeader)` + .bp3-drawer { + max-height: 450px; + } +`; diff --git a/src/containers/FinancialStatements/FinancialStatementHeader.js b/src/containers/FinancialStatements/FinancialStatementHeader.js index a1c66bfc5..44c5f2097 100644 --- a/src/containers/FinancialStatements/FinancialStatementHeader.js +++ b/src/containers/FinancialStatements/FinancialStatementHeader.js @@ -3,10 +3,15 @@ import classNames from 'classnames'; import { Position, Drawer } from '@blueprintjs/core'; import 'style/containers/FinancialStatements/DrawerHeader.scss'; +/** + * Financial statement header. + * @returns {JSX.Element} + */ export default function FinancialStatementHeader({ children, isOpen, drawerProps, + className, }) { const timeoutRef = React.useRef(); const [isDrawerOpen, setIsDrawerOpen] = useState(false); @@ -42,6 +47,7 @@ export default function FinancialStatementHeader({ { 'is-hidden': !isDrawerOpen, }, + className, )} > @@ -97,7 +99,7 @@ function GeneralLedgerHeader({ - + ); } @@ -107,3 +109,9 @@ export default compose( })), withGeneralLedgerActions, )(GeneralLedgerHeader); + +const GeneralLedgerDrawerHeader = styled(FinancialStatementHeader)` + .bp3-drawer { + max-height: 520px; + } +`; diff --git a/src/containers/FinancialStatements/InventoryItemDetails/InventoryItemDetailsHeader.js b/src/containers/FinancialStatements/InventoryItemDetails/InventoryItemDetailsHeader.js index 5f7a2d2a2..b230913f0 100644 --- a/src/containers/FinancialStatements/InventoryItemDetails/InventoryItemDetailsHeader.js +++ b/src/containers/FinancialStatements/InventoryItemDetails/InventoryItemDetailsHeader.js @@ -3,8 +3,10 @@ import * as Yup from 'yup'; import moment from 'moment'; import { Formik, Form } from 'formik'; import { Tabs, Tab, Button, Intent } from '@blueprintjs/core'; -import { FormattedMessage as T } from 'components'; import intl from 'react-intl-universal'; +import styled from 'styled-components'; + +import { FormattedMessage as T } from 'components'; import FinancialStatementHeader from 'containers/FinancialStatements/FinancialStatementHeader'; import InventoryItemDetailsHeaderGeneralPanel from './InventoryItemDetailsHeaderGeneralPanel'; @@ -35,24 +37,23 @@ function InventoryItemDetailsHeader({ }; // Filter form initial values. - const initialValues = transformToForm({ - ...pageFilter, - fromDate: moment(pageFilter.fromDate).toDate(), - toDate: moment(pageFilter.toDate).toDate(), - }, defaultValues); + const initialValues = transformToForm( + { + ...pageFilter, + fromDate: moment(pageFilter.fromDate).toDate(), + toDate: moment(pageFilter.toDate).toDate(), + }, + defaultValues, + ); // Validation schema. const validationSchema = Yup.object().shape({ - fromDate: Yup.date() - .required() - .label(intl.get('fromDate')), + fromDate: Yup.date().required().label(intl.get('fromDate')), toDate: Yup.date() .min(Yup.ref('fromDate')) .required() .label(intl.get('toDate')), }); -; - // Handle form submit. const handleSubmit = (values, { setSubmitting }) => { onSubmitFilter(values); @@ -61,10 +62,12 @@ function InventoryItemDetailsHeader({ }; // Handle drawer close action. - const handleDrawerClose = () => { toggleFilterDrawer(false); }; - + const handleDrawerClose = () => { + toggleFilterDrawer(false); + }; + return ( - @@ -91,7 +94,7 @@ function InventoryItemDetailsHeader({ - + ); } @@ -101,3 +104,9 @@ export default compose( })), withInventoryItemDetailsActions, )(InventoryItemDetailsHeader); + +const InventoryItemDetailsDrawerHeader = styled(FinancialStatementHeader)` + .bp3-drawer { + max-height: 400px; + } +`; diff --git a/src/containers/FinancialStatements/InventoryValuation/InventoryValuationHeader.js b/src/containers/FinancialStatements/InventoryValuation/InventoryValuationHeader.js index dfdfbf964..9aee81b30 100644 --- a/src/containers/FinancialStatements/InventoryValuation/InventoryValuationHeader.js +++ b/src/containers/FinancialStatements/InventoryValuation/InventoryValuationHeader.js @@ -1,9 +1,11 @@ import React from 'react'; import * as Yup from 'yup'; import moment from 'moment'; -import { FormattedMessage as T } from 'components'; import { Formik, Form } from 'formik'; import { Tabs, Tab, Button, Intent } from '@blueprintjs/core'; +import styled from 'styled-components'; + +import { FormattedMessage as T } from 'components'; import FinancialStatementHeader from 'containers/FinancialStatements/FinancialStatementHeader'; import InventoryValuationHeaderGeneralPanel from './InventoryValuationHeaderGeneralPanel'; @@ -38,11 +40,14 @@ function InventoryValuationHeader({ itemsIds: [], }; // Initial values. - const initialValues = transformToForm({ - ...pageFilter, - ...defaultValues, - asDate: moment(pageFilter.asDate).toDate(), - }, defaultValues); + const initialValues = transformToForm( + { + ...pageFilter, + ...defaultValues, + asDate: moment(pageFilter.asDate).toDate(), + }, + defaultValues, + ); // Handle the form of header submit. const handleSubmit = (values, { setSubmitting }) => { @@ -62,7 +67,7 @@ function InventoryValuationHeader({ }; return ( - @@ -89,7 +94,7 @@ function InventoryValuationHeader({ - + ); } @@ -99,3 +104,9 @@ export default compose( })), withInventoryValuationActions, )(InventoryValuationHeader); + +const InventoryValuationDrawerHeader = styled(FinancialStatementHeader)` + .bp3-drawer { + max-height: 450px; + } +`; diff --git a/src/containers/FinancialStatements/Journal/JournalHeader.js b/src/containers/FinancialStatements/Journal/JournalHeader.js index 6549d001f..5ec5472f2 100644 --- a/src/containers/FinancialStatements/Journal/JournalHeader.js +++ b/src/containers/FinancialStatements/Journal/JournalHeader.js @@ -3,6 +3,8 @@ import moment from 'moment'; import { Formik, Form } from 'formik'; import { Tab, Tabs, Button, Intent } from '@blueprintjs/core'; import * as Yup from 'yup'; +import styled from 'styled-components'; + import { FormattedMessage as T } from 'components'; import JournalSheetHeaderGeneral from './JournalSheetHeaderGeneral'; @@ -55,7 +57,7 @@ function JournalHeader({ }; return ( - @@ -83,7 +85,7 @@ function JournalHeader({ - + ); } @@ -93,3 +95,9 @@ export default compose( })), withJournalActions, )(JournalHeader); + +const JournalDrawerHeader = styled(FinancialStatementHeader)` + .bp3-drawer { + max-height: 350px; + } +`; diff --git a/src/containers/FinancialStatements/ProfitLossSheet/ProfitLossSheetHeader.js b/src/containers/FinancialStatements/ProfitLossSheet/ProfitLossSheetHeader.js index b94abca64..fc7b6dd82 100644 --- a/src/containers/FinancialStatements/ProfitLossSheet/ProfitLossSheetHeader.js +++ b/src/containers/FinancialStatements/ProfitLossSheet/ProfitLossSheetHeader.js @@ -3,6 +3,7 @@ import moment from 'moment'; import { Formik, Form } from 'formik'; import * as R from 'ramda'; import { Tabs, Tab, Button, Intent } from '@blueprintjs/core'; +import styled from 'styled-components'; import { FormattedMessage as T } from 'components'; import FinancialStatementHeader from 'containers/FinancialStatements/FinancialStatementHeader'; @@ -52,8 +53,8 @@ function ProfitLossHeader({ toggleFilterDrawer(false); }; - return ( - @@ -86,7 +87,7 @@ function ProfitLossHeader({ - + ); } @@ -96,3 +97,9 @@ export default R.compose( })), withProfitLossActions, )(ProfitLossHeader); + +const ProfitLossSheetHeader = styled(FinancialStatementHeader)` + .bp3-drawer { + max-height: 520px; + } +`; diff --git a/src/containers/FinancialStatements/PurchasesByItems/PurchasesByItemsHeader.js b/src/containers/FinancialStatements/PurchasesByItems/PurchasesByItemsHeader.js index 0ada94130..a5cedbd48 100644 --- a/src/containers/FinancialStatements/PurchasesByItems/PurchasesByItemsHeader.js +++ b/src/containers/FinancialStatements/PurchasesByItems/PurchasesByItemsHeader.js @@ -1,10 +1,12 @@ import React from 'react'; import * as Yup from 'yup'; import moment from 'moment'; -import { FormattedMessage as T } from 'components'; import intl from 'react-intl-universal'; import { Formik, Form } from 'formik'; import { Tabs, Tab, Button, Intent } from '@blueprintjs/core'; +import styled from 'styled-components'; + +import { FormattedMessage as T } from 'components'; import FinancialStatementHeader from 'containers/FinancialStatements/FinancialStatementHeader'; import PurchasesByItemsGeneralPanel from './PurchasesByItemsGeneralPanel'; @@ -36,7 +38,6 @@ function PurchasesByItemsHeader({ .required() .label(intl.get('to_date')), }); - // Default form values. const defaultValues = { ...pageFilter, @@ -68,7 +69,7 @@ function PurchasesByItemsHeader({ }; return ( - @@ -95,7 +96,7 @@ function PurchasesByItemsHeader({ - + ); } @@ -105,3 +106,9 @@ export default compose( })), withPurchasesByItemsActions, )(PurchasesByItemsHeader); + +const PurchasesByItemsDrawerHeader = styled(FinancialStatementHeader)` + .bp3-drawer { + max-height: 450px; + } +`; diff --git a/src/containers/FinancialStatements/SalesByItems/SalesByItemsHeader.js b/src/containers/FinancialStatements/SalesByItems/SalesByItemsHeader.js index 059de708c..2e500ed5e 100644 --- a/src/containers/FinancialStatements/SalesByItems/SalesByItemsHeader.js +++ b/src/containers/FinancialStatements/SalesByItems/SalesByItemsHeader.js @@ -1,10 +1,12 @@ import React from 'react'; import * as Yup from 'yup'; import moment from 'moment'; -import { FormattedMessage as T } from 'components'; import intl from 'react-intl-universal'; import { Formik, Form } from 'formik'; import { Tabs, Tab, Button, Intent } from '@blueprintjs/core'; +import styled from 'styled-components'; + +import { FormattedMessage as T } from 'components'; import FinancialStatementHeader from 'containers/FinancialStatements/FinancialStatementHeader'; import SalesByItemsHeaderGeneralPanel from './SalesByItemsHeaderGeneralPanel'; @@ -61,7 +63,7 @@ function SalesByItemsHeader({ }; return ( - @@ -88,7 +90,7 @@ function SalesByItemsHeader({ - + ); } @@ -98,3 +100,9 @@ export default compose( })), withSalesByItemsActions, )(SalesByItemsHeader); + +const SalesByItemsDrawerHeader = styled(FinancialStatementHeader)` + .bp3-drawer { + max-height: 450px; + } +`; diff --git a/src/containers/FinancialStatements/TrialBalanceSheet/TrialBalanceSheet.js b/src/containers/FinancialStatements/TrialBalanceSheet/TrialBalanceSheet.js index 891b8e925..2dcd1d27a 100644 --- a/src/containers/FinancialStatements/TrialBalanceSheet/TrialBalanceSheet.js +++ b/src/containers/FinancialStatements/TrialBalanceSheet/TrialBalanceSheet.js @@ -22,9 +22,6 @@ import { compose } from 'utils'; * Trial balance sheet. */ function TrialBalanceSheet({ - // #withPreferences - organizationName, - // #withTrialBalanceSheetActions toggleTrialBalanceFilterDrawer: toggleFilterDrawer, }) { @@ -44,7 +41,6 @@ function TrialBalanceSheet({ }, [setFilter], ); - // Handle numebr format form submit. const handleNumberFormatSubmit = (numberFormat) => { setFilter({ diff --git a/src/containers/FinancialStatements/TrialBalanceSheet/TrialBalanceSheetHeader.js b/src/containers/FinancialStatements/TrialBalanceSheet/TrialBalanceSheetHeader.js index 77e993c85..83550e3ca 100644 --- a/src/containers/FinancialStatements/TrialBalanceSheet/TrialBalanceSheetHeader.js +++ b/src/containers/FinancialStatements/TrialBalanceSheet/TrialBalanceSheetHeader.js @@ -1,10 +1,12 @@ import React from 'react'; import * as Yup from 'yup'; import moment from 'moment'; -import { FormattedMessage as T } from 'components'; -import intl from 'react-intl-universal'; import { Formik, Form } from 'formik'; +import intl from 'react-intl-universal'; import { Tabs, Tab, Button, Intent } from '@blueprintjs/core'; +import styled from 'styled-components'; + +import { FormattedMessage as T } from 'components'; import FinancialStatementHeader from 'containers/FinancialStatements/FinancialStatementHeader'; import TrialBalanceSheetHeaderGeneralPanel from './TrialBalanceSheetHeaderGeneralPanel'; @@ -59,13 +61,17 @@ function TrialBalanceSheetHeader({ toggleFilterDrawer(false); }; // Handle drawer close action. - const handleDrawerClose = () => { toggleFilterDrawer(false); }; + const handleDrawerClose = () => { + toggleFilterDrawer(false); + }; // Handle cancel button click. - const handleCancelClick = () => { toggleFilterDrawer(false); }; + const handleCancelClick = () => { + toggleFilterDrawer(false); + }; return ( - @@ -93,7 +99,7 @@ function TrialBalanceSheetHeader({ - + ); } @@ -103,3 +109,9 @@ export default compose( })), withTrialBalanceActions, )(TrialBalanceSheetHeader); + +const TrialBalanceSheetDrawerHeader = styled(FinancialStatementHeader)` + .bp3-drawer { + max-height: 450px; + } +`; diff --git a/src/containers/FinancialStatements/VendorsBalanceSummary/VendorsBalanceSummaryHeader.js b/src/containers/FinancialStatements/VendorsBalanceSummary/VendorsBalanceSummaryHeader.js index 4dbbf10c1..057241099 100644 --- a/src/containers/FinancialStatements/VendorsBalanceSummary/VendorsBalanceSummaryHeader.js +++ b/src/containers/FinancialStatements/VendorsBalanceSummary/VendorsBalanceSummaryHeader.js @@ -3,6 +3,8 @@ import * as Yup from 'yup'; import { Formik, Form } from 'formik'; import moment from 'moment'; import { Tabs, Tab, Button, Intent } from '@blueprintjs/core'; +import styled from 'styled-components'; + import { FormattedMessage as T } from 'components'; import FinancialStatementHeader from 'containers/FinancialStatements/FinancialStatementHeader'; @@ -61,7 +63,7 @@ function VendorsBalanceSummaryHeader({ }; return ( - @@ -88,7 +90,7 @@ function VendorsBalanceSummaryHeader({ - + ); } @@ -98,3 +100,9 @@ export default compose( })), withVendorsBalanceSummaryActions, )(VendorsBalanceSummaryHeader); + +const VendorBalanceDrawerHeader = styled(FinancialStatementHeader)` + .bp3-drawer { + max-height: 450px; + } +`; From 79144ad4a57753a700f31b32eca038355c7ba5a5 Mon Sep 17 00:00:00 2001 From: "a.bouhuolia" Date: Wed, 16 Feb 2022 18:44:10 +0200 Subject: [PATCH 05/14] fix: re-structure the system tables reports. --- src/components/FinancialSheet/ReportDataTable.js | 9 +++++++++ src/components/FinancialSheet/index.js | 3 ++- .../APAgingSummary/APAgingSummaryTable.js | 4 ++-- .../ARAgingSummary/ARAgingSummaryTable.js | 5 ++--- .../BalanceSheet/BalanceSheetTable.js | 6 +++--- .../CustomersBalanceSummaryTable.js | 4 ++-- .../GeneralLedger/GeneralLedgerTable.js | 8 +++----- .../InventoryItemDetails/InventoryItemDetailsTable.js | 5 ++--- .../InventoryValuation/InventoryValuationTable.js | 4 ++-- .../FinancialStatements/Journal/JournalTable.js | 4 ++-- .../ProfitLossSheet/ProfitLossSheetTable.js | 8 ++++++-- .../PurchasesByItems/PurchasesByItemsTable.js | 4 ++-- .../SalesByItems/SalesByItemsTable.js | 4 ++-- .../TrialBalanceSheet/TrialBalanceSheetTable.js | 4 ++-- .../VendorsBalanceSummary/VendorsBalanceSummaryTable.js | 4 ++-- 15 files changed, 43 insertions(+), 33 deletions(-) create mode 100644 src/components/FinancialSheet/ReportDataTable.js diff --git a/src/components/FinancialSheet/ReportDataTable.js b/src/components/FinancialSheet/ReportDataTable.js new file mode 100644 index 000000000..b242ae8e7 --- /dev/null +++ b/src/components/FinancialSheet/ReportDataTable.js @@ -0,0 +1,9 @@ +import styled from 'styled-components'; + +import { DataTable } from 'components'; + +export const ReportDataTable = styled(DataTable)` + .table .tbody .tr.no-results:last-of-type .td { + border-bottom: 1px solid #ddd; + } +`; diff --git a/src/components/FinancialSheet/index.js b/src/components/FinancialSheet/index.js index ca17c27c5..6a366b26f 100644 --- a/src/components/FinancialSheet/index.js +++ b/src/components/FinancialSheet/index.js @@ -1,2 +1,3 @@ export * from './FinancialSheet'; -export * from './FinancialSheetSkeleton'; \ No newline at end of file +export * from './FinancialSheetSkeleton'; +export * from './ReportDataTable'; \ No newline at end of file diff --git a/src/containers/FinancialStatements/APAgingSummary/APAgingSummaryTable.js b/src/containers/FinancialStatements/APAgingSummary/APAgingSummaryTable.js index c284793ec..be7b4588e 100644 --- a/src/containers/FinancialStatements/APAgingSummary/APAgingSummaryTable.js +++ b/src/containers/FinancialStatements/APAgingSummary/APAgingSummaryTable.js @@ -2,7 +2,7 @@ import React from 'react'; import intl from 'react-intl-universal'; import styled from 'styled-components'; -import { DataTable, FinancialSheet } from 'components'; +import { ReportDataTable, FinancialSheet } from 'components'; import { TableStyle } from 'common'; import { useAPAgingSummaryContext } from './APAgingSummaryProvider'; @@ -45,7 +45,7 @@ export default function APAgingSummaryTable({ ); } -const APAgingSummaryDataTable = styled(DataTable)` +const APAgingSummaryDataTable = styled(ReportDataTable)` .table { .tbody .tr { .td { diff --git a/src/containers/FinancialStatements/ARAgingSummary/ARAgingSummaryTable.js b/src/containers/FinancialStatements/ARAgingSummary/ARAgingSummaryTable.js index 15de59206..608981c0f 100644 --- a/src/containers/FinancialStatements/ARAgingSummary/ARAgingSummaryTable.js +++ b/src/containers/FinancialStatements/ARAgingSummary/ARAgingSummaryTable.js @@ -2,7 +2,7 @@ import React from 'react'; import intl from 'react-intl-universal'; import styled from 'styled-components'; -import { DataTable, FinancialSheet } from 'components'; +import { ReportDataTable, FinancialSheet } from 'components'; import { TableStyle } from 'common'; import { useARAgingSummaryContext } from './ARAgingSummaryProvider'; @@ -26,7 +26,6 @@ export default function ReceivableAgingSummaryTable({ return ( Date: Wed, 16 Feb 2022 18:47:36 +0200 Subject: [PATCH 06/14] fix(VendorTransaction): column accessor/id. --- .../FinancialStatements/VendorsTransactions/components.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/containers/FinancialStatements/VendorsTransactions/components.js b/src/containers/FinancialStatements/VendorsTransactions/components.js index cfc6586d2..3fb882d7a 100644 --- a/src/containers/FinancialStatements/VendorsTransactions/components.js +++ b/src/containers/FinancialStatements/VendorsTransactions/components.js @@ -18,7 +18,7 @@ export const useVendorsTransactionsColumns = () => { () => [ { Header: intl.get('vendor_name'), - accessor: 'cells[1].value', + accessor: 'cells[0].value', className: 'vendor_name', }, { From 030be9652c3f7ce32d2dc622c5ca58fa0b8c4bb6 Mon Sep 17 00:00:00 2001 From: "a.bouhuolia" Date: Thu, 17 Feb 2022 11:40:40 +0200 Subject: [PATCH 07/14] feat: add BS and PL reports to page of financial reports list. --- src/config/financialReportsMenu.js | 14 ++++++++++++++ src/lang/ar/index.json | 8 +++++++- src/lang/en/index.json | 8 +++++++- 3 files changed, 28 insertions(+), 2 deletions(-) diff --git a/src/config/financialReportsMenu.js b/src/config/financialReportsMenu.js index 83e6ffd25..62240ab64 100644 --- a/src/config/financialReportsMenu.js +++ b/src/config/financialReportsMenu.js @@ -70,6 +70,20 @@ export const financialReportMenus = [ subject: AbilitySubject.Report, ability: ReportsAction.READ_AP_AGING_SUMMARY, }, + { + title: , + desc: , + link: 'financial-reports/balance-sheet?previousYear=true&previousYearAmountChange=true&previousYearPercentageChange=true', + subject: AbilitySubject.Report, + ability: ReportsAction.READ_BALANCE_SHEET, + }, + { + title: , + desc: , + link: '/financial-reports/profit-loss-sheet?previousYear=true&previousYearAmountChange=true&previousYearPercentageChange=true', + subject: AbilitySubject.Report, + ability: ReportsAction.READ_PROFIT_LOSS, + }, ], }, ]; diff --git a/src/lang/ar/index.json b/src/lang/ar/index.json index dc9e10edc..04cbb2200 100644 --- a/src/lang/ar/index.json +++ b/src/lang/ar/index.json @@ -1782,5 +1782,11 @@ "profit_loss_sheet.percentage_of_column": "% التغير العمودي", "profit_loss_sheet.percentage_of_row": "% التغير الأفقي", "profit_loss_sheet.percentage_of_expense": "% التغير في المصاريف", - "profit_loss_sheet.percentage_of_income": "% التغير الإيرادات" + "profit_loss_sheet.percentage_of_income": "% التغير الإيرادات", + + "report.balance_sheet_comparison.title": "مقارنة الميزانية العمومية", + "report.balance_sheet_comparison.desc": "يعرض أصول الشركة والتزاماتها وحقوق المساهمين في نقطة زمنية محددة مقارنة بالسنة الماضية.", + + "report.profit_loss_sheet_comparison.title": "مقارنة قائمة الدخل", + "report.profit_loss_sheet_comparison.desc": "يعرض الإيرادات والتكاليف والمصاريف المتكبدة في نقطة محددة ومقارنة بالعام السابق." } \ No newline at end of file diff --git a/src/lang/en/index.json b/src/lang/en/index.json index 342564fe0..28720544b 100644 --- a/src/lang/en/index.json +++ b/src/lang/en/index.json @@ -1769,5 +1769,11 @@ "customer.alert.are_you_sure_want_to_inactivate_this_customer": "Are you sure want to inactivate this customer? You will to able to activate it later.", "credit_note_preview.dialog.title": "Credit Note PDF Preview", - "payment_receive_preview.dialog.title": "Payment Receive PDF Preview" + "payment_receive_preview.dialog.title": "Payment Receive PDF Preview", + + "report.balance_sheet_comparison.title": "Balance Sheet Comparison", + "report.balance_sheet_comparison.desc": "Reports a company's assets, liabilities and shareholders' equity compared to previous year.", + + "report.profit_loss_sheet_comparison.title": "Profit/Loss Comparison", + "report.profit_loss_sheet_comparison.desc": "Reports the revenues, costs and expenses incurred at a specific point and compared to previous year." } \ No newline at end of file From e3f2c82a381824e73777cbbf6355d737bdc26e7c Mon Sep 17 00:00:00 2001 From: "a.bouhuolia" Date: Fri, 18 Feb 2022 19:29:12 +0200 Subject: [PATCH 08/14] fix: try to comment `FinancialSkeletonTable` component. --- .../FinancialSheet/FinancialSheetSkeleton.js | 12 ++---------- 1 file changed, 2 insertions(+), 10 deletions(-) diff --git a/src/components/FinancialSheet/FinancialSheetSkeleton.js b/src/components/FinancialSheet/FinancialSheetSkeleton.js index 8feb034b5..b6d6aac1e 100644 --- a/src/components/FinancialSheet/FinancialSheetSkeleton.js +++ b/src/components/FinancialSheet/FinancialSheetSkeleton.js @@ -42,7 +42,7 @@ export function FinancialSheetSkeleton({ - Date: Fri, 18 Feb 2022 19:52:37 +0200 Subject: [PATCH 09/14] fix: styled-components components. --- src/components/Button/index.js | 2 -- src/components/Customers/CustomerDrawerLink.js | 2 +- src/components/FinancialSheet/FinancialSheet.js | 3 ++- src/components/FinancialSheet/ReportDataTable.js | 2 +- src/components/Vendors/VendorDrawerLink.js | 2 +- 5 files changed, 5 insertions(+), 6 deletions(-) diff --git a/src/components/Button/index.js b/src/components/Button/index.js index f7960939a..28fb263e6 100644 --- a/src/components/Button/index.js +++ b/src/components/Button/index.js @@ -1,3 +1 @@ - - export * from './ButtonLink'; \ No newline at end of file diff --git a/src/components/Customers/CustomerDrawerLink.js b/src/components/Customers/CustomerDrawerLink.js index e99c20244..a5b075fa9 100644 --- a/src/components/Customers/CustomerDrawerLink.js +++ b/src/components/Customers/CustomerDrawerLink.js @@ -1,7 +1,7 @@ import React from 'react'; import * as R from 'ramda'; -import { ButtonLink } from 'components'; +import { ButtonLink } from '../Button'; import withDrawerActions from 'containers/Drawer/withDrawerActions'; function CustomerDrawerLinkComponent({ diff --git a/src/components/FinancialSheet/FinancialSheet.js b/src/components/FinancialSheet/FinancialSheet.js index f7eb905ec..951e06a85 100644 --- a/src/components/FinancialSheet/FinancialSheet.js +++ b/src/components/FinancialSheet/FinancialSheet.js @@ -2,7 +2,8 @@ import React, { useMemo, useCallback } from 'react'; import moment from 'moment'; import intl from 'react-intl-universal'; -import { If, FormattedMessage as T } from 'components'; +import If from '../Utils/If'; +import { FormattedMessage as T } from '../FormattedMessage'; import { FinancialSheetRoot, FinancialSheetFooterCurrentTime, diff --git a/src/components/FinancialSheet/ReportDataTable.js b/src/components/FinancialSheet/ReportDataTable.js index b242ae8e7..2d8677cf4 100644 --- a/src/components/FinancialSheet/ReportDataTable.js +++ b/src/components/FinancialSheet/ReportDataTable.js @@ -1,6 +1,6 @@ import styled from 'styled-components'; -import { DataTable } from 'components'; +import DataTable from '../DataTable'; export const ReportDataTable = styled(DataTable)` .table .tbody .tr.no-results:last-of-type .td { diff --git a/src/components/Vendors/VendorDrawerLink.js b/src/components/Vendors/VendorDrawerLink.js index 91b528e6f..de5dbcf50 100644 --- a/src/components/Vendors/VendorDrawerLink.js +++ b/src/components/Vendors/VendorDrawerLink.js @@ -1,7 +1,7 @@ import React from 'react'; import * as R from 'ramda'; -import { ButtonLink } from 'components'; +import { ButtonLink } from '../Button'; import withDrawerActions from 'containers/Drawer/withDrawerActions'; function VendorDrawerLinkComponent({ From 60d37e3424d9867f8d43880262ce683cb08a5131 Mon Sep 17 00:00:00 2001 From: "a.bouhuolia" Date: Fri, 18 Feb 2022 20:10:53 +0200 Subject: [PATCH 10/14] Revert "fix: try to comment `FinancialSkeletonTable` component." This reverts commit e3f2c82a381824e73777cbbf6355d737bdc26e7c. --- .../FinancialSheet/FinancialSheetSkeleton.js | 12 ++++++++++-- 1 file changed, 10 insertions(+), 2 deletions(-) diff --git a/src/components/FinancialSheet/FinancialSheetSkeleton.js b/src/components/FinancialSheet/FinancialSheetSkeleton.js index b6d6aac1e..8feb034b5 100644 --- a/src/components/FinancialSheet/FinancialSheetSkeleton.js +++ b/src/components/FinancialSheet/FinancialSheetSkeleton.js @@ -42,7 +42,7 @@ export function FinancialSheetSkeleton({ - Date: Fri, 18 Feb 2022 20:32:21 +0200 Subject: [PATCH 11/14] fix: try to fix `styled-components`. --- src/components/FinancialSheet/FinancialSheetSkeleton.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/components/FinancialSheet/FinancialSheetSkeleton.js b/src/components/FinancialSheet/FinancialSheetSkeleton.js index 8feb034b5..d542ceb73 100644 --- a/src/components/FinancialSheet/FinancialSheetSkeleton.js +++ b/src/components/FinancialSheet/FinancialSheetSkeleton.js @@ -2,7 +2,8 @@ import React from 'react'; import styled from 'styled-components'; import { Align } from 'common'; -import { SkeletonText, DataTable } from 'components'; +import { SkeletonText } from 'components'; +import DataTable from '../../components/DataTable' import TableSkeletonRows from 'components/Datatable/TableSkeletonRows'; import TableSkeletonHeader from 'components/Datatable/TableHeaderSkeleton'; From 8e6b0b496fde264c51fc1026dd4778477230222f Mon Sep 17 00:00:00 2001 From: "a.bouhuolia" Date: Mon, 21 Feb 2022 14:38:41 +0200 Subject: [PATCH 12/14] fix: `BIG-337` Display billing page once the organization subscription is inactive. --- .../Dashboard/DashboardAbilityProvider.js | 7 +++--- src/components/Dashboard/DashboardBoot.js | 20 ++++++++-------- src/components/Dashboard/DashboardProvider.js | 4 ++-- src/hooks/state/subscriptions.js | 24 ++++++++++++++++++- 4 files changed, 39 insertions(+), 16 deletions(-) diff --git a/src/components/Dashboard/DashboardAbilityProvider.js b/src/components/Dashboard/DashboardAbilityProvider.js index 37de0ced2..8fc9dfe8d 100644 --- a/src/components/Dashboard/DashboardAbilityProvider.js +++ b/src/components/Dashboard/DashboardAbilityProvider.js @@ -1,7 +1,8 @@ import React from 'react'; import { Ability } from '@casl/ability'; import { createContextualCan } from '@casl/react'; -import { useDashboardMeta } from '../../hooks/query'; + +import { useDashboardMetaBoot } from './DashboardBoot'; export const AbilityContext = React.createContext(); export const Can = createContextualCan(AbilityContext.Consumer); @@ -11,8 +12,8 @@ export const Can = createContextualCan(AbilityContext.Consumer); */ export function DashboardAbilityProvider({ children }) { const { - data: { abilities }, - } = useDashboardMeta(); + meta: { abilities }, + } = useDashboardMetaBoot(); // Ability instance. const ability = new Ability(abilities); diff --git a/src/components/Dashboard/DashboardBoot.js b/src/components/Dashboard/DashboardBoot.js index 6e3d967fb..6e6f45448 100644 --- a/src/components/Dashboard/DashboardBoot.js +++ b/src/components/Dashboard/DashboardBoot.js @@ -6,18 +6,26 @@ import { } from '../../hooks/query'; import { useSplashLoading } from '../../hooks/state'; import { useWatch, useWatchImmediate, useWhen } from '../../hooks'; +import { useSubscription } from '../../hooks/state'; import { setCookie, getCookie } from '../../utils'; /** * Dashboard meta async booting. + * - Fetches the dashboard meta only if the organization subscribe is active. + * - Once the dashboard meta query is loading display dashboard splash screen. */ export function useDashboardMetaBoot() { + const { isSubscriptionActive } = useSubscription(); + const { data: dashboardMeta, isLoading: isDashboardMetaLoading, isSuccess: isDashboardMetaSuccess, } = useDashboardMeta({ keepPreviousData: true, + + // Avoid run the query if the organization subscription is not active. + enabled: isSubscriptionActive, }); const [startLoading, stopLoading] = useSplashLoading(); @@ -30,20 +38,12 @@ export function useDashboardMetaBoot() { }, isDashboardMetaSuccess); return { + meta: dashboardMeta, isLoading: isDashboardMetaLoading, + isSuccess: isDashboardMetaSuccess }; } -/** - * Dashboard async booting. - * @returns {{ isLoading: boolean }} - */ -export function useDashboardBoot() { - const { isLoading } = useDashboardMetaBoot(); - - return { isLoading }; -} - /** * Application async booting. */ diff --git a/src/components/Dashboard/DashboardProvider.js b/src/components/Dashboard/DashboardProvider.js index 68c8e5654..7e05fb00c 100644 --- a/src/components/Dashboard/DashboardProvider.js +++ b/src/components/Dashboard/DashboardProvider.js @@ -1,12 +1,12 @@ import React from 'react'; import { DashboardAbilityProvider } from '../../components'; -import { useDashboardBoot } from './DashboardBoot'; +import { useDashboardMetaBoot } from './DashboardBoot'; /** * Dashboard provider. */ export default function DashboardProvider({ children }) { - const { isLoading } = useDashboardBoot(); + const { isLoading } = useDashboardMetaBoot(); // Avoid display any dashboard component before complete booting. if (isLoading) { diff --git a/src/hooks/state/subscriptions.js b/src/hooks/state/subscriptions.js index 95f2cdd4d..42a9c3f54 100644 --- a/src/hooks/state/subscriptions.js +++ b/src/hooks/state/subscriptions.js @@ -1,6 +1,11 @@ import { useCallback } from "react" -import { useDispatch } from "react-redux"; +import { useDispatch, useSelector } from "react-redux"; import { setSubscriptions } from 'store/subscription/subscription.actions'; +import { + isSubscriptionOnTrialFactory, + isSubscriptionInactiveFactory, + isSubscriptionActiveFactory, +} from 'store/subscription/subscription.selectors'; /** * Sets subscriptions. @@ -12,3 +17,20 @@ export const useSetSubscriptions = () => { dispatch(setSubscriptions(subscriptions)); }, [dispatch]); } + +/** + * The organization subscription selector. + * @param {string} slug + * @returns {} + */ +export const useSubscription = (slug = 'main') => { + const isSubscriptionOnTrial = useSelector(isSubscriptionOnTrialFactory(slug)); + const isSubscriptionInactive = useSelector(isSubscriptionInactiveFactory(slug)); + const isSubscriptionActive = useSelector(isSubscriptionActiveFactory(slug)); + + return { + isSubscriptionActive, + isSubscriptionInactive, + isSubscriptionOnTrial + } +} \ No newline at end of file From aa39aab93aaf8cdae165c815a0bc18888bc9ff0f Mon Sep 17 00:00:00 2001 From: "a.bouhuolia" Date: Mon, 21 Feb 2022 14:56:55 +0200 Subject: [PATCH 13/14] fix(Billing): display payment methods only if subscription is not active. --- .../Subscriptions/BillingPaymentMethod.js | 15 ++++++++++++ .../Subscriptions/BillingPlansForm.js | 24 +++++++++++++++++-- 2 files changed, 37 insertions(+), 2 deletions(-) create mode 100644 src/containers/Subscriptions/BillingPaymentMethod.js diff --git a/src/containers/Subscriptions/BillingPaymentMethod.js b/src/containers/Subscriptions/BillingPaymentMethod.js new file mode 100644 index 000000000..5c180cf38 --- /dev/null +++ b/src/containers/Subscriptions/BillingPaymentMethod.js @@ -0,0 +1,15 @@ +import React from 'react'; + +import { T } from 'components'; +import { PaymentMethodTabs } from './SubscriptionTabs'; + +export default ({ formik, title, description }) => { + return ( +
+

+

+ + +
+ ); +}; diff --git a/src/containers/Subscriptions/BillingPlansForm.js b/src/containers/Subscriptions/BillingPlansForm.js index 6eed7a77c..b26cfc89e 100644 --- a/src/containers/Subscriptions/BillingPlansForm.js +++ b/src/containers/Subscriptions/BillingPlansForm.js @@ -1,10 +1,13 @@ import React from 'react'; +import * as R from 'ramda'; import 'style/pages/Subscription/BillingPlans.scss'; import BillingPlansInput from './BillingPlansInput'; import BillingPeriodsInput from './BillingPeriodsInput'; -// import BillingPaymentMethod from './BillingPaymentMethod'; +import BillingPaymentMethod from './BillingPaymentMethod'; + +import withSubscriptions from './withSubscriptions'; /** * Billing plans form. @@ -14,7 +17,24 @@ export default function BillingPlansForm() {
- {/* */} +
); } + +/** + * Billing payment methods when subscription is inactive. + * @returns {JSX.Element} + */ +function BillingPaymentMethodWhenSubscriptionInactiveJSX({ + // # withSubscriptions + isSubscriptionActive, + + ...props +}) { + return !isSubscriptionActive ? : null; +} + +const BillingPaymentMethodWhenSubscriptionInactive = R.compose( + withSubscriptions(({ isSubscriptionActive }) => ({ isSubscriptionActive })), +)(BillingPaymentMethodWhenSubscriptionInactiveJSX); From c7673f57cd724b3d015fbd93460f716f202dc98e Mon Sep 17 00:00:00 2001 From: "a.bouhuolia" Date: Mon, 21 Feb 2022 15:02:08 +0200 Subject: [PATCH 14/14] dump v1.6.3. --- CHANGELOG.md | 20 ++++++++++++++++++++ package.json | 2 +- 2 files changed, 21 insertions(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 9f9a76ef1..03f5da752 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -2,6 +2,26 @@ All notable changes to Bigcapital server-side will be in this file. +## [1.6.3] - 21-02-2022 + +### Fixed + - `BIG-337` Display billing page once the organization subscription is inactive. + +## [1.6.2] - 19-02-2022 + +### Fixed + - fix syled components dependency with imported as default components. + +## [1.6.0] - 18-02-2022 + +### Added +- Balance sheet comparison of previous period (PP). +- Balance sheet comparison of previous year (PY). +- Balance sheet percentage analysis columns and rows basis. +- Profit & loss sheet comparison of preivous period (PP). +- Profit & loss sheet comparison of previous year (PY). +- Profit & loss sheet percentage analysis columns, rows, income and expenses basis. + ## [1.5.8] - 13-01-2022 ### Added diff --git a/package.json b/package.json index 77cf277f3..76def75d8 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "bigcapital-client", - "version": "1.5.8", + "version": "1.6.3", "private": true, "dependencies": { "@babel/core": "7.8.4",