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

Merge branch 'master' of https://github.com/abouolia/Bigcapital

Browse Source
This commit is contained in:
elforjani3
2020-11-16 18:24:28 +02:00
parent bfaf41fe67 4ea6f7af85
commit 765d6bdd16
76 changed files with 1160 additions and 1315 deletions
Download Patch File Download Diff File Expand all files Collapse all files

108
client/src/containers/Accounting/ManualJournalsDataTable.js
View File

@@ -15,13 +15,22 @@ import { withRouter, useParams } from 'react-router-dom';
import { FormattedMessage as T, useIntl } from 'react-intl';
import moment from 'moment';
import { DataTable, If, Money, Choose, Icon } from 'components';
import { compose } from 'utils';
import {
DataTable,
If,
Money,
Choose,
Icon,
LoadingIndicator,
} from 'components';
import { useIsValuePassed } from 'hooks';
import withDialogActions from 'containers/Dialog/withDialogActions';
import withManualJournals from 'containers/Accounting/withManualJournals';
import withManualJournalsActions from 'containers/Accounting/withManualJournalsActions';
import { compose, saveInvoke } from 'utils';
/**
* Status column accessor.
*/
@@ -68,44 +77,36 @@ function ManualJournalsDataTable({
manualJournalsPagination,
manualJournalsTableQuery,
onFetchData,
// #withManualJournalsActions
addManualJournalsTableQueries,
// #ownProps
onEditJournal,
onDeleteJournal,
onPublishJournal,
onSelectedRowsChange,
}) {
const [isMounted, setIsMounted] = useState(false);
const { custom_view_id: customViewId } = useParams();
const { formatMessage } = useIntl();
useEffect(() => {
setIsMounted(false);
}, [customViewId]);
useEffect(() => {
if (!manualJournalsLoading) {
setIsMounted(true);
}
}, [manualJournalsLoading, setIsMounted]);
const isLoadedBefore = useIsValuePassed(manualJournalsLoading, false);
const handlePublishJournal = useCallback(
(journal) => () => {
onPublishJournal && onPublishJournal(journal);
saveInvoke(onPublishJournal, journal);
},
[onPublishJournal],
);
const handleEditJournal = useCallback(
(journal) => () => {
onEditJournal && onEditJournal(journal);
saveInvoke(onEditJournal, journal);
},
[onEditJournal],
);
const handleDeleteJournal = useCallback(
(journal) => () => {
onDeleteJournal && onDeleteJournal(journal);
saveInvoke(onDeleteJournal, journal);
},
[onDeleteJournal],
);
@@ -115,7 +116,8 @@ function ManualJournalsDataTable({
<Menu>
<MenuItem
icon={<Icon icon="reader-18" />}
text={formatMessage({ id: 'view_details' })} />
text={formatMessage({ id: 'view_details' })}
/>
<MenuDivider />
<If condition={!journal.status}>
<MenuItem
@@ -182,7 +184,7 @@ function ManualJournalsDataTable({
{
id: 'status',
Header: formatMessage({ id: 'status' }),
accessor: row => StatusAccessor(row),
accessor: (row) => StatusAccessor(row),
width: 95,
className: 'status',
},
@@ -221,46 +223,52 @@ function ManualJournalsDataTable({
);
const handleDataTableFetchData = useCallback(
(...args) => {
onFetchData && onFetchData(...args);
({ pageIndex, pageSize, sortBy }) => {
addManualJournalsTableQueries({
...(sortBy.length > 0
? {
column_sort_by: sortBy[0].id,
sort_order: sortBy[0].desc ? 'desc' : 'asc',
}
: {}),
page_size: pageSize,
page: pageIndex + 1,
});
},
[onFetchData],
[addManualJournalsTableQueries],
);
const handleSelectedRowsChange = useCallback(
(selectedRows) => {
onSelectedRowsChange &&
onSelectedRowsChange(selectedRows.map((s) => s.original));
saveInvoke(
onSelectedRowsChange,
selectedRows.map((s) => s.original),
);
},
[onSelectedRowsChange],
);
const selectionColumn = useMemo(
() => ({
minWidth: 40,
width: 40,
maxWidth: 40,
}),
[],
);
return (
<DataTable
noInitialFetch={true}
columns={columns}
data={manualJournalsCurrentPage}
onFetchData={handleDataTableFetchData}
manualSortBy={true}
selectionColumn={selectionColumn}
expandable={true}
sticky={true}
onSelectedRowsChange={handleSelectedRowsChange}
loading={manualJournalsLoading && !isMounted}
rowContextMenu={onRowContextMenu}
pagination={true}
pagesCount={manualJournalsPagination.pagesCount}
initialPageSize={manualJournalsTableQuery.page_size}
initialPageIndex={manualJournalsTableQuery.page - 1}
/>
<LoadingIndicator loading={manualJournalsLoading && !isLoadedBefore}>
<DataTable
noInitialFetch={true}
columns={columns}
data={manualJournalsCurrentPage}
onFetchData={handleDataTableFetchData}
manualSortBy={true}
selectionColumn={true}
expandable={true}
sticky={true}
onSelectedRowsChange={handleSelectedRowsChange}
rowContextMenu={onRowContextMenu}
pagesCount={manualJournalsPagination.pagesCount}
pagination={true}
initialPageSize={manualJournalsTableQuery.page_size}
initialPageIndex={manualJournalsTableQuery.page - 1}
autoResetSortBy={false}
autoResetPage={false}
/>
</LoadingIndicator>
);
}

3
client/src/containers/Accounting/ManualJournalsList.js
View File

@@ -161,8 +161,6 @@ function ManualJournalsTable({
const handleFetchData = useCallback(
({ pageIndex, pageSize, sortBy }) => {
const page = pageIndex + 1;
// addQuery('page_size', pageSize);
// addQuery('page', page);
addManualJournalsTableQueries({
...(sortBy.length > 0
@@ -224,7 +222,6 @@ function ManualJournalsTable({
<ManualJournalsDataTable
onDeleteJournal={handleDeleteJournal}
onFetchData={handleFetchData}
onEditJournal={handleEditJournal}
onPublishJournal={handlePublishJournal}
onSelectedRowsChange={handleSelectedRowsChange}

2
client/src/containers/Accounting/withManualJournalsActions.js
View File

@@ -22,7 +22,7 @@ const mapActionsToProps = (dispatch) => ({
}),
addManualJournalsTableQueries: (queries) => dispatch({
type: t.MANUAL_JOURNALS_TABLE_QUERIES_ADD,
queries,
payload: { queries },
}),
setJournalNumberChanged: (isChanged) => dispatch({
type: t.MANUAL_JOURNAL_NUMBER_CHANGED,

85
client/src/containers/Customers/CustomerTable.js
View File

@@ -1,4 +1,4 @@
import React, { useState, useCallback, useMemo } from 'react';
import React, { useRef, useEffect, useCallback, useMemo } from 'react';
import {
Button,
Popover,
@@ -8,14 +8,15 @@ import {
Position,
Intent,
} from '@blueprintjs/core';
import { FormattedMessage as T, useIntl } from 'react-intl';
import { useUpdateEffect } from 'hooks';
import { useIsValuePassed } from 'hooks';
import LoadingIndicator from 'components/LoadingIndicator';
import { DataTable, Icon, Money } from 'components';
import withCustomers from './withCustomers';
import withCustomersActions from './withCustomersActions';
import { compose, firstLettersArgs, saveInvoke } from 'utils';
const AvatarCell = (row) => {
@@ -27,6 +28,10 @@ const CustomerTable = ({
customers,
customersLoading,
customerPagination,
customersTableQuery,
// #withCustomersActions
addCustomersTableQueries,
//#OwnProps
loading,
@@ -36,13 +41,7 @@ const CustomerTable = ({
onSelectedRowsChange,
}) => {
const { formatMessage } = useIntl();
const [initialMount, setInitialMount] = useState(false);
useUpdateEffect(() => {
if (!customersLoading) {
setInitialMount(true);
}
}, [customersLoading, setInitialMount]);
const isLoadedBefore = useIsValuePassed(loading, false);
// Customers actions list.
const renderContextMenu = useMemo(
@@ -94,6 +93,7 @@ const CustomerTable = ({
[onDeleteCustomer, onEditCustomer, renderContextMenu],
);
// Table columns.
const columns = useMemo(
() => [
{
@@ -150,19 +150,23 @@ const CustomerTable = ({
[formatMessage, renderActionsCell],
);
const selectionColumn = useMemo(
() => ({
minWidth: 42,
width: 42,
maxWidth: 42,
}),
[],
// Handle fetch data table.
const handleFetchData = useCallback(
({ pageIndex, pageSize, sortBy }) => {
addCustomersTableQueries({
page: pageIndex + 1,
page_size: pageSize,
...(sortBy.length > 0
? {
column_sort_order: sortBy[0].id,
sort_order: sortBy[0].desc ? 'desc' : 'asc',
}
: {}),
});
},
[addCustomersTableQueries],
);
const handleFetchDate = useCallback((...args) => {
onFetchData && onFetchData(...args);
});
const handleSelectedRowsChange = useCallback(
(selectedRows) => {
onSelectedRowsChange &&
@@ -179,32 +183,47 @@ const CustomerTable = ({
});
return (
<LoadingIndicator loading={loading} mount={false}>
<LoadingIndicator
loading={customersLoading && !isLoadedBefore}
mount={false}
>
<DataTable
noInitialFetch={true}
columns={columns}
data={customers}
selectionColumn={selectionColumn}
onFetchData={handleFetchDate}
// loading={customersLoading}
onFetchData={handleFetchData}
selectionColumn={true}
expandable={false}
treeGraph={false}
sticky={true}
onSelectedRowsChange={handleSelectedRowsChange}
loading={customersLoading && !initialMount}
spinnerProps={{ size: 30 }}
rowContextMenu={rowContextMenu}
pagination={true}
manualSortBy={true}
pagesCount={customerPagination.pagesCount}
initialPageSize={customerPagination.pageSize}
initialPageIndex={customerPagination.page - 1}
autoResetSortBy={false}
autoResetPage={false}
initialPageSize={customersTableQuery.page_size}
initialPageIndex={customersTableQuery.page - 1}
/>
</LoadingIndicator>
);
};
export default compose(
withCustomers(({ customers, customersLoading, customerPagination }) => ({
customers,
customersLoading,
customerPagination,
})),
withCustomers(
({
customers,
customersLoading,
customerPagination,
customersTableQuery,
}) => ({
customers,
customersLoading,
customerPagination,
customersTableQuery,
}),
),
withCustomersActions,
)(CustomerTable);

35
client/src/containers/Customers/CustomersList.js
View File

@@ -52,15 +52,12 @@ function CustomersList({
useEffect(() => {
changePageTitle(formatMessage({ id: 'customers_list' }));
}, [changePageTitle]);
}, [changePageTitle, formatMessage]);
// Fetch customers resource views and fields.
// const fetchHook = useQuery('resource-customers', () => {
// return Promise.all([
// requestFetchResourceViews('customers'),
// requestFetchResourceFields('customers'),
// ]);
// });
// const fetchResourceViews = useQuery(['resource-views', 'customers'],
// () => requestFetchResourceViews('customers')
// );
const fetchCustomers = useQuery(
['customers-table', customersTableQuery],
@@ -116,22 +113,6 @@ function CustomersList({
});
}, [requestDeleteCustomer, deleteCustomer, formatMessage]);
// Handle fetch data table.
const handleFetchData = useCallback(
({ pageIndex, pageSize, sortBy }) => {
addCustomersTableQueries({
...(sortBy.length > 0
? {
column_sort_order: sortBy[0].id,
sort_order: sortBy[0].desc ? 'desc' : 'asc',
}
: {}),
});
fetchCustomers.refetch();
},
[fetchCustomers, addCustomersTableQueries],
);
// Handle selected rows change.
const handleSelectedRowsChange = useCallback(
(customer) => {
@@ -154,9 +135,9 @@ function CustomersList({
// Handle filter change to re-fetch the items.
const handleFilterChanged = useCallback(
(filterConditions) => {
addCustomersTableQueries({
filter_roles: filterConditions || '',
});
// addCustomersTableQueries({
// filter_roles: filterConditions || '',
// });
},
[addCustomersTableQueries],
);
@@ -210,7 +191,6 @@ function CustomersList({
loading={fetchCustomers.isFetching}
onDeleteCustomer={handleDeleteCustomer}
onEditCustomer={handleEditCustomer}
onfetchData={handleFetchData}
onSelectedRowsChange={handleSelectedRowsChange}
/>
</Route>
@@ -258,5 +238,6 @@ export default compose(
withResourceActions,
withCustomersActions,
withDashboardActions,
withViewsActions,
withCustomers(({ customersTableQuery }) => ({ customersTableQuery })),
)(CustomersList);

6
client/src/containers/Customers/CustomersViewsTabs.js
View File

@@ -39,9 +39,9 @@ function CustomersViewsTabs({
useEffect(() => {
setTopbarEditView(customViewId);
changePageSubtitle(customViewId && viewItem ? viewItem.name : '');
addCustomersTableQueries({
custom_view_id: customViewId,
});
// addCustomersTableQueries({
// custom_view_id: customViewId,
// });
return () => {
setTopbarEditView(null);
changePageSubtitle('');

2
client/src/containers/Customers/withCustomersActions.js
View File

@@ -19,7 +19,7 @@ export const mapDispatchToProps = (dispatch) => ({
addCustomersTableQueries: (queries) =>
dispatch({
type: t.CUSTOMERS_TABLE_QUERIES_ADD,
queries,
payload: { queries }
}),
});

126
client/src/containers/Expenses/ExpenseDataTable.js
View File

@@ -17,8 +17,8 @@ import { FormattedMessage as T, useIntl } from 'react-intl';
import moment from 'moment';
import Icon from 'components/Icon';
import { compose } from 'utils';
import { useUpdateEffect } from 'hooks';
import { compose, saveInvoke } from 'utils';
import { useIsValuePassed } from 'hooks';
import LoadingIndicator from 'components/LoadingIndicator';
import { If, Money } from 'components';
@@ -32,11 +32,15 @@ import withExpensesActions from 'containers/Expenses/withExpensesActions';
import withCurrentView from 'containers/Views/withCurrentView';
function ExpensesDataTable({
//#withExpenes
// #withExpenes
expensesCurrentPage,
expensesLoading,
expensesPagination,
expensesTableQuery,
// #withExpensesActions
addExpensesTableQueries,
// #withDashboardActions
changeCurrentView,
changePageSubtitle,
@@ -46,27 +50,16 @@ function ExpensesDataTable({
viewMeta,
// #ownProps
loading,
onFetchData,
onEditExpense,
onDeleteExpense,
onPublishExpense,
onSelectedRowsChange,
}) {
const { custom_view_id: customViewId } = useParams();
const [initialMount, setInitialMount] = useState(false);
const isLoadedBefore = useIsValuePassed(expensesLoading, false);
const { formatMessage } = useIntl();
useEffect(()=>{
setInitialMount(false)
},[customViewId])
useUpdateEffect(() => {
if (!expensesLoading) {
setInitialMount(true);
}
}, [expensesLoading, setInitialMount]);
useEffect(() => {
if (customViewId) {
changeCurrentView(customViewId);
@@ -81,23 +74,40 @@ function ExpensesDataTable({
viewMeta,
]);
// Handle fetch data of manual jouranls datatable.
const handleFetchData = useCallback(
({ pageIndex, pageSize, sortBy }) => {
addExpensesTableQueries({
...(sortBy.length > 0
? {
column_sort_by: sortBy[0].id,
sort_order: sortBy[0].desc ? 'desc' : 'asc',
}
: {}),
page_size: pageSize,
page: pageIndex + 1,
});
},
[addExpensesTableQueries],
);
const handlePublishExpense = useCallback(
(expense) => () => {
onPublishExpense && onPublishExpense(expense);
saveInvoke(onPublishExpense, expense);
},
[onPublishExpense],
);
const handleEditExpense = useCallback(
(expense) => () => {
onEditExpense && onEditExpense(expense);
saveInvoke(onEditExpense, expense);
},
[onEditExpense],
);
const handleDeleteExpense = useCallback(
(expense) => () => {
onDeleteExpense && onDeleteExpense(expense);
saveInvoke(onDeleteExpense, expense);
},
[onDeleteExpense],
);
@@ -107,7 +117,8 @@ function ExpensesDataTable({
<Menu>
<MenuItem
icon={<Icon icon="reader-18" />}
text={formatMessage({ id: 'view_details' })} />
text={formatMessage({ id: 'view_details' })}
/>
<MenuDivider />
<If condition={!expense.published}>
<MenuItem
@@ -244,42 +255,39 @@ function ExpensesDataTable({
[actionMenuList, formatMessage],
);
const handleDataTableFetchData = useCallback(
(...args) => {
onFetchData && onFetchData(...args);
},
[onFetchData],
);
const handleSelectedRowsChange = useCallback(
(selectedRows) => {
onSelectedRowsChange &&
onSelectedRowsChange(selectedRows.map((s) => s.original));
saveInvoke(
onSelectedRowsChange,
selectedRows.map((s) => s.original),
);
},
[onSelectedRowsChange],
);
return (
<div>
<LoadingIndicator loading={loading} mount={false}>
<DataTable
columns={columns}
data={expensesCurrentPage}
onFetchData={handleDataTableFetchData}
manualSortBy={true}
selectionColumn={true}
noInitialFetch={true}
sticky={true}
loading={expensesLoading && !initialMount}
onSelectedRowsChange={handleSelectedRowsChange}
rowContextMenu={onRowContextMenu}
pagination={true}
pagesCount={expensesPagination.pagesCount}
initialPageSize={expensesPagination.pageSize}
initialPageIndex={expensesPagination.page - 1}
/>
</LoadingIndicator>
</div>
<LoadingIndicator
loading={expensesLoading && !isLoadedBefore}
mount={false}
>
<DataTable
columns={columns}
data={expensesCurrentPage}
manualSortBy={true}
selectionColumn={true}
noInitialFetch={true}
sticky={true}
onSelectedRowsChange={handleSelectedRowsChange}
onFetchData={handleFetchData}
rowContextMenu={onRowContextMenu}
pagination={true}
pagesCount={expensesPagination.pagesCount}
autoResetSortBy={false}
autoResetPage={false}
initialPageSize={expensesTableQuery.page_size}
initialPageIndex={expensesTableQuery.page - 1}
/>
</LoadingIndicator>
);
}
@@ -289,10 +297,18 @@ export default compose(
withDialogActions,
withDashboardActions,
withExpensesActions,
withExpenses(({ expensesCurrentPage, expensesLoading, expensesPagination }) => ({
expensesCurrentPage,
expensesLoading,
expensesPagination,
})),
withExpenses(
({
expensesCurrentPage,
expensesLoading,
expensesPagination,
expensesTableQuery,
}) => ({
expensesCurrentPage,
expensesLoading,
expensesPagination,
expensesTableQuery,
}),
),
withViewDetails(),
)(ExpensesDataTable);

21
client/src/containers/Expenses/ExpensesList.js
View File

@@ -137,25 +137,6 @@ function ExpensesList({
// Handle filter change to re-fetch data-table.
const handleFilterChanged = useCallback(() => {}, []);
// Handle fetch data of manual jouranls datatable.
const handleFetchData = useCallback(
({ pageIndex, pageSize, sortBy }) => {
const page = pageIndex + 1;
addExpensesTableQueries({
...(sortBy.length > 0
? {
column_sort_by: sortBy[0].id,
sort_order: sortBy[0].desc ? 'desc' : 'asc',
}
: {}),
page_size: pageSize,
page,
});
},
[addExpensesTableQueries],
);
// const fetchExpenses = useQuery(['expenses-table', expensesTableQuery], () =>
// requestFetchExpensesTable(),
// );
@@ -217,9 +198,7 @@ function ExpensesList({
<ExpenseViewTabs />
<ExpenseDataTable
loading={fetchExpenses.isFetching}
onDeleteExpense={handleDeleteExpense}
onFetchData={handleFetchData}
onEditExpense={handleEidtExpense}
onPublishExpense={handlePublishExpense}
onSelectedRowsChange={handleSelectedRowsChange}

2
client/src/containers/Expenses/withExpensesActions.js
View File

@@ -29,7 +29,7 @@ const mapDispatchToProps = (dispatch) => ({
addExpensesTableQueries: (queries) =>
dispatch({
type: t.EXPENSES_TABLE_QUERIES_ADD,
queries,
payload: { queries },
}),
});

4
client/src/containers/Items/ItemFormBody.js
View File

@@ -101,7 +101,7 @@ function ItemFormBody({ accountsList }) {
<Col xs={6}>
{/*------------- Sellable checkbox ------------- */}
<FastField name={'purchasable'}>
{({ field, field: { value }, meta: { error, touched } }) => (
{({ form, field: { value, onChange }, meta: { error, touched } }) => (
<FormGroup inline={true} className={'form-group--purchasable'}>
<Checkbox
inline={true}
@@ -111,7 +111,7 @@ function ItemFormBody({ accountsList }) {
</h3>
}
checked={value}
{...field}
onChange={onChange}
/>
</FormGroup>
)}

82
client/src/containers/Items/ItemsDataTable.js
View File

@@ -10,34 +10,46 @@ import {
Tag,
} from '@blueprintjs/core';
import { FormattedMessage as T, useIntl } from 'react-intl';
import { Icon, DataTable, Money, If, Choose } from 'components';
import { Icon, DataTable, Money } from 'components';
import { useIsValuePassed } from 'hooks';
import LoadingIndicator from 'components/LoadingIndicator';
import withItems from 'containers/Items/withItems';
import { compose } from 'utils';
const ItemsDataTable = ({
loading,
import withItemsActions from 'containers/Items/withItemsActions';
import { compose, saveInvoke } from 'utils';
function ItemsDataTable({
// #withItems
itemsTableLoading,
itemsCurrentPage,
itemsTableQuery,
// #withItemsActions
addItemsTableQueries,
// props
onEditItem,
onDeleteItem,
onFetchData,
onSelectedRowsChange,
}) => {
}) {
const { formatMessage } = useIntl();
const [initialMount, setInitialMount] = useState(false);
const isLoadedBefore = useIsValuePassed(itemsTableLoading, false);
useEffect(() => {
if (!itemsTableLoading) {
setInitialMount(true);
}
}, [itemsTableLoading, setInitialMount]);
const handleFetchData = useCallback(
({ pageIndex, pageSize, sortBy }) => {
addItemsTableQueries({
page_size: pageSize,
page: pageIndex + 1,
...(sortBy.length > 0
? {
column_sort_by: sortBy[0].id,
sort_order: sortBy[0].desc ? 'desc' : 'asc',
}
: {}),
});
},
[addItemsTableQueries],
);
const handleEditItem = useCallback(
(item) => () => {
@@ -46,7 +58,6 @@ const ItemsDataTable = ({
[onEditItem],
);
// const handleDeleteItem = (item) => () => { onDeleteItem(item); };
const handleDeleteItem = useCallback(
(item) => () => {
onDeleteItem(item);
@@ -158,48 +169,49 @@ const ItemsDataTable = ({
[actionMenuList, formatMessage],
);
const selectionColumn = useMemo(
() => ({
minWidth: 42,
width: 42,
maxWidth: 42,
}),
[],
);
const handleFetchData = useCallback((...args) => {
onFetchData && onFetchData(...args);
}, []);
// Handle selected row change.
const handleSelectedRowsChange = useCallback(
(selectedRows) => {
onSelectedRowsChange &&
onSelectedRowsChange(selectedRows.map((s) => s.original));
saveInvoke(
onSelectedRowsChange,
selectedRows.map((s) => s.original),
);
},
[onSelectedRowsChange],
);
return (
<LoadingIndicator loading={loading} mount={false}>
<LoadingIndicator
loading={itemsTableLoading && !isLoadedBefore}
mount={false}
>
<DataTable
columns={columns}
data={itemsCurrentPage}
selectionColumn={selectionColumn}
onFetchData={handleFetchData}
loading={itemsTableLoading && !initialMount}
noInitialFetch={true}
expandable={true}
treeGraph={true}
selectionColumn={true}
spinnerProps={{ size: 30 }}
onSelectedRowsChange={handleSelectedRowsChange}
rowContextMenu={handleRowContextMenu}
sticky={true}
pagination={true}
pagesCount={2}
autoResetSortBy={false}
autoResetPage={false}
initialPageSize={itemsTableQuery.page_size}
initialPageIndex={itemsTableQuery.page - 1}
/>
</LoadingIndicator>
);
};
export default compose(
withItems(({ itemsCurrentPage, itemsTableLoading }) => ({
withItems(({ itemsCurrentPage, itemsTableLoading, itemsTableQuery }) => ({
itemsCurrentPage,
itemsTableLoading,
itemsTableQuery,
})),
withItemsActions,
)(ItemsDataTable);

38
client/src/containers/Items/ItemsList.js
View File

@@ -43,7 +43,6 @@ function ItemsList({
}) {
const [deleteItem, setDeleteItem] = useState(false);
const [selectedRows, setSelectedRows] = useState([]);
const [tableLoading, setTableLoading] = useState(false);
const [bulkDelete, setBulkDelete] = useState(false);
const { formatMessage } = useIntl();
@@ -53,16 +52,19 @@ function ItemsList({
changePageTitle(formatMessage({ id: 'items_list' }));
}, [changePageTitle]);
// Handle fetching the resource views.
const fetchResourceViews = useQuery(
['resource-views', 'items'],
(key, resourceName) => requestFetchResourceViews(resourceName),
);
// Handle fetching the resource fields.
const fetchResourceFields = useQuery(
['resource-fields', 'items'],
(key, resourceName) => requestFetchResourceFields(resourceName),
);
// Handle fetching the items table based on the given query.
const fetchItems = useQuery(['items-table', itemsTableQuery], () =>
requestFetchItems({}),
);
@@ -112,18 +114,7 @@ function ItemsList({
const handleFetchData = useCallback(
({ pageIndex, pageSize, sortBy }) => {
const page = pageIndex + 1;
addItemsTableQueries({
...(sortBy.length > 0
? {
column_sort_by: sortBy[0].id,
sort_order: sortBy[0].desc ? 'desc' : 'asc',
}
: {}),
page_size: pageSize,
page,
});
},
[addItemsTableQueries],
);
@@ -135,23 +126,9 @@ function ItemsList({
filter_roles: filterConditions || '',
});
},
[fetchItems],
[addItemsTableQueries],
);
// Handle custom view change to re-fetch the items.
const handleCustomViewChanged = useCallback(
(customViewId) => {
setTableLoading(true);
},
[fetchItems],
);
useEffect(() => {
if (tableLoading && !fetchItems.isFetching) {
setTableLoading(false);
}
}, [tableLoading, fetchItems.isFetching]);
// Handle selected rows change.
const handleSelectedRowsChange = useCallback(
(accounts) => {
@@ -213,16 +190,13 @@ function ItemsList({
exact={true}
path={['/items/:custom_view_id/custom_view', '/items']}
>
<ItemsViewsTabs onViewChanged={handleCustomViewChanged} />
<ItemsViewsTabs />
<ItemsDataTable
loading={fetchItems.isFetching}
onDeleteItem={handleDeleteItem}
onEditItem={handleEditItem}
onFetchData={handleFetchData}
onSelectedRowsChange={handleSelectedRowsChange}
/>
<Alert
cancelButtonText={<T id={'cancel'} />}
confirmButtonText={<T id={'delete'} />}

1
client/src/containers/Items/withItems.js
View File

@@ -10,6 +10,7 @@ import {
export default (mapState) => {
const mapStateToProps = (state, props) => {
const viewPages = getViewPages(state.items.views, state.items.currentViewId);
const mapped = {
itemsViews: getResourceViews(state, props, 'items'),
itemsCurrentPage: getCurrentPageResults(

50
client/src/containers/Items/withItemsActions.js
View File

@@ -1,11 +1,11 @@
import {connect} from 'react-redux';
import { connect } from 'react-redux';
import {
fetchItems,
fetchItem,
deleteItem,
submitItem,
editItem,
deleteBulkItems
deleteBulkItems,
} from 'store/items/items.actions';
import t from 'store/types';
@@ -13,26 +13,36 @@ export const mapDispatchToProps = (dispatch) => ({
requestFetchItems: (query) => dispatch(fetchItems({ query })),
requestFetchItem: (id) => dispatch(fetchItem({ id })),
requestDeleteItem: (id) => dispatch(deleteItem({ id })),
requestDeleteBulkItems:(ids)=>dispatch(deleteBulkItems({ids})),
requestDeleteBulkItems: (ids) => dispatch(deleteBulkItems({ ids })),
requestSubmitItem: (form) => dispatch(submitItem({ form })),
requestEditItem:(id,form) => dispatch(editItem({id,form})),
addBulkActionItem: (id) => dispatch({
type: t.ITEM_BULK_ACTION_ADD, itemId: id
}),
removeBulkActionItem: (id) => dispatch({
type: t.ITEM_BULK_ACTION_REMOVE, itemId: id,
}),
setItemsTableQuery: (key, value) => dispatch({
type: t.ITEMS_TABLE_QUERY_SET, key, value,
}),
addItemsTableQueries: (queries) => dispatch({
type: t.ITEMS_TABLE_QUERIES_ADD, queries,
}),
requestEditItem: (id, form) => dispatch(editItem({ id, form })),
addBulkActionItem: (id) =>
dispatch({
type: t.ITEM_BULK_ACTION_ADD,
itemId: id,
}),
removeBulkActionItem: (id) =>
dispatch({
type: t.ITEM_BULK_ACTION_REMOVE,
itemId: id,
}),
setItemsTableQuery: (key, value) =>
dispatch({
type: t.ITEMS_TABLE_QUERY_SET,
key,
value,
}),
addItemsTableQueries: (queries) =>
dispatch({
type: t.ITEMS_TABLE_QUERIES_ADD,
payload: { queries },
}),
changeItemsCurrentView: (id) => dispatch({
type: t.ITEMS_SET_CURRENT_VIEW,
currentViewId: parseInt(id, 10),
}),
changeItemsCurrentView: (id) =>
dispatch({
type: t.ITEMS_SET_CURRENT_VIEW,
currentViewId: parseInt(id, 10),
}),
});
export default connect(null, mapDispatchToProps);

20
client/src/containers/Purchases/Bill/BillList.js
View File

@@ -90,23 +90,7 @@ function BillList({
history.push(`/bills/${bill.id}/edit`);
});
const handleFetchData = useCallback(
({ pageIndex, pageSize, sortBy }) => {
const page = pageIndex + 1;
addBillsTableQueries({
...(sortBy.length > 0
? {
column_sort_by: sortBy[0].id,
sort_order: sortBy[0].desc ? 'desc' : 'asc',
}
: {}),
page_size: pageSize,
page,
});
},
[addBillsTableQueries],
);
// Handle selected rows change.
const handleSelectedRowsChange = useCallback(
@@ -141,9 +125,7 @@ function BillList({
<Route exact={true}>
<BillViewTabs />
<BillsDataTable
loading={fetchBills.isFetching}
onDeleteBill={handleDeleteBill}
onFetchData={handleFetchData}
onEditBill={handleEditBill}
onSelectedRowsChange={handleSelectedRowsChange}
/>

111
client/src/containers/Purchases/Bill/BillsDataTable.js
View File

@@ -16,8 +16,8 @@ import { FormattedMessage as T, useIntl } from 'react-intl';
import moment from 'moment';
import Icon from 'components/Icon';
import { compose } from 'utils';
import { useUpdateEffect } from 'hooks';
import { compose, saveInvoke } from 'utils';
import { useIsValuePassed } from 'hooks';
import LoadingIndicator from 'components/LoadingIndicator';
import DataTable from 'components/DataTable';
@@ -41,29 +41,22 @@ function BillsDataTable({
changePageSubtitle,
setTopbarEditView,
// #withBillsActions
addBillsTableQueries,
// #withView
viewMeta,
//#OwnProps
// #ownProps
loading,
onFetchData,
onEditBill,
onDeleteBill,
onSelectedRowsChange,
}) {
const [initialMount, setInitialMount] = useState(false);
const { custom_view_id: customViewId } = useParams();
const { formatMessage } = useIntl();
useEffect(() => {
setInitialMount(false);
}, [customViewId]);
useUpdateEffect(() => {
if (!billsLoading) {
setInitialMount(true);
}
}, [billsLoading, setInitialMount]);
const isLoadedBefore = useIsValuePassed(billsLoading, false);
useEffect(() => {
if (customViewId) {
@@ -79,16 +72,34 @@ function BillsDataTable({
viewMeta,
]);
const handleFetchData = useCallback(
({ pageIndex, pageSize, sortBy }) => {
const page = pageIndex + 1;
addBillsTableQueries({
...(sortBy.length > 0
? {
column_sort_by: sortBy[0].id,
sort_order: sortBy[0].desc ? 'desc' : 'asc',
}
: {}),
page_size: pageSize,
page,
});
},
[addBillsTableQueries],
);
const handleEditBill = useCallback(
(_bill) => () => {
onEditBill && onEditBill(_bill);
saveInvoke(onEditBill, _bill);
},
[onEditBill],
);
const handleDeleteBill = useCallback(
(_bill) => () => {
onDeleteBill && onDeleteBill(_bill);
saveInvoke(onDeleteBill, _bill);
},
[onDeleteBill],
);
@@ -147,7 +158,6 @@ function BillsDataTable({
width: 140,
className: 'bill_number',
},
{
id: 'due_date',
Header: formatMessage({ id: 'due_date' }),
@@ -195,41 +205,34 @@ function BillsDataTable({
[actionMenuList, formatMessage],
);
const handleDataTableFetchData = useCallback(
(...args) => {
onFetchData && onFetchData(...args);
},
[onFetchData],
);
const handleSelectedRowsChange = useCallback(
(selectedRows) => {
onSelectedRowsChange &&
onSelectedRowsChange(selectedRows.map((s) => s.original));
saveInvoke(
onSelectedRowsChange,
selectedRows.map((s) => s.original),
);
},
[onSelectedRowsChange],
);
return (
<div>
<LoadingIndicator loading={loading} mount={false}>
<DataTable
columns={columns}
data={billsCurrentPage}
onFetchData={handleDataTableFetchData}
manualSortBy={true}
selectionColumn={true}
noInitialFetch={true}
sticky={true}
loading={billsLoading && !initialMount}
onSelectedRowsChange={handleSelectedRowsChange}
rowContextMenu={onRowContextMenu}
pagination={true}
pagesCount={billsPageination.pagesCount}
initialPageSize={billsPageination.pageSize}
initialPageIndex={billsPageination.page - 1}
/>
</LoadingIndicator>
</div>
<LoadingIndicator loading={billsLoading && !isLoadedBefore} mount={false}>
<DataTable
columns={columns}
data={billsCurrentPage}
onFetchData={handleFetchData}
manualSortBy={true}
selectionColumn={true}
noInitialFetch={true}
sticky={true}
onSelectedRowsChange={handleSelectedRowsChange}
rowContextMenu={onRowContextMenu}
pagination={true}
pagesCount={billsPageination.pagesCount}
initialPageSize={billsPageination.pageSize}
initialPageIndex={billsPageination.page - 1}
/>
</LoadingIndicator>
);
}
@@ -239,10 +242,18 @@ export default compose(
withDialogActions,
withDashboardActions,
withBillActions,
withBills(({ billsCurrentPage, billsLoading, billsPageination }) => ({
billsCurrentPage,
billsLoading,
billsPageination,
})),
withBills(
({
billsCurrentPage,
billsLoading,
billsPageination,
billsTableQuery,
}) => ({
billsCurrentPage,
billsLoading,
billsPageination,
billsTableQuery,
}),
),
withViewDetails(),
)(BillsDataTable);

2
client/src/containers/Purchases/Bill/withBillActions.js
View File

@@ -27,7 +27,7 @@ const mapDispatchToProps = (dispatch) => ({
addBillsTableQueries: (queries) =>
dispatch({
type: t.BILLS_TABLE_QUERIES_ADD,
queries,
payload: { queries }
}),
setBillNumberChanged: (isChanged) =>
dispatch({

125
client/src/containers/Purchases/PaymentMades/PaymentMadeDataTable.js
View File

@@ -1,81 +1,58 @@
import React, { useEffect, useCallback, useState, useMemo } from 'react';
import React, { useCallback, useMemo } from 'react';
import {
Intent,
Button,
Classes,
Popover,
Menu,
MenuItem,
MenuDivider,
Position,
} from '@blueprintjs/core';
import { useParams } from 'react-router-dom';
import { withRouter } from 'react-router';
import { FormattedMessage as T, useIntl } from 'react-intl';
import moment from 'moment';
import { compose } from 'utils';
import { useUpdateEffect } from 'hooks';
import { compose, saveInvoke } from 'utils';
import { useIsValuePassed } from 'hooks';
import LoadingIndicator from 'components/LoadingIndicator';
import { DataTable, Money, Icon } from 'components';
import withDialogActions from 'containers/Dialog/withDialogActions';
import withDashboardActions from 'containers/Dashboard/withDashboardActions';
import withViewDetails from 'containers/Views/withViewDetails';
import withPaymentMade from './withPaymentMade';
import withPaymentMadeActions from './withPaymentMadeActions';
import withCurrentView from 'containers/Views/withCurrentView';
/**
* Payment made datatable transactions.
*/
function PaymentMadeDataTable({
//#withPaymentMades
// #withPaymentMades
paymentMadeCurrentPage,
paymentMadePageination,
paymentMadeLoading,
paymentMadeItems,
paymentMadesLoading,
paymentMadeTableQuery,
// #withDashboardActions
changeCurrentView,
changePageSubtitle,
setTopbarEditView,
// #withPaymentMadeActions
addPaymentMadesTableQueries,
// #withView
viewMeta,
//#OwnProps
loading,
onFetchData,
// #ownProps
onEditPaymentMade,
onDeletePaymentMade,
onSelectedRowsChange,
}) {
const [initialMount, setInitialMount] = useState(false);
const { custom_view_id: customViewId } = useParams();
const isLoaded = useIsValuePassed(paymentMadesLoading, false);
const { formatMessage } = useIntl();
useEffect(() => {
setInitialMount(false);
}, [customViewId]);
useUpdateEffect(() => {
if (!paymentMadeLoading) {
setInitialMount(true);
}
}, [paymentMadeLoading, setInitialMount]);
const handleEditPaymentMade = useCallback(
(paymentMade) => () => {
onEditPaymentMade && onEditPaymentMade(paymentMade);
saveInvoke(onEditPaymentMade, paymentMade);
},
[onEditPaymentMade],
);
const handleDeletePaymentMade = useCallback(
(paymentMade) => () => {
onDeletePaymentMade && onDeletePaymentMade(paymentMade);
saveInvoke(onDeletePaymentMade, paymentMade);
},
[onDeletePaymentMade],
);
@@ -89,7 +66,7 @@ function PaymentMadeDataTable({
/>
<MenuDivider />
<MenuItem
icon={<Icon icon="pen-18" />}
icon={<Icon icon="pen-18" />}
text={formatMessage({ id: 'edit_payment_made' })}
onClick={handleEditPaymentMade(paymentMade)}
/>
@@ -176,59 +153,69 @@ function PaymentMadeDataTable({
);
const handleDataTableFetchData = useCallback(
(...args) => {
onFetchData && onFetchData(...args);
({ pageIndex, pageSize, sortBy }) => {
addPaymentMadesTableQueries({
...(sortBy.length > 0
? {
column_sort_by: sortBy[0].id,
sort_order: sortBy[0].desc ? 'desc' : 'asc',
}
: {}),
page_size: pageSize,
page: pageIndex + 1,
});
},
[onFetchData],
[addPaymentMadesTableQueries],
);
const handleSelectedRowsChange = useCallback(
(selectedRows) => {
onSelectedRowsChange &&
onSelectedRowsChange(selectedRows.map((s) => s.original));
saveInvoke(
onSelectedRowsChange,
selectedRows.map((s) => s.original),
);
},
[onSelectedRowsChange],
);
return (
<div>
<LoadingIndicator loading={loading} mount={false}>
<DataTable
columns={columns}
data={paymentMadeCurrentPage}
onFetchData={handleDataTableFetchData}
manualSortBy={true}
selectionColumn={true}
noInitialFetch={true}
sticky={true}
loading={paymentMadeLoading && !initialMount}
onSelectedRowsChange={handleSelectedRowsChange}
rowContextMenu={onRowContextMenu}
pagination={true}
pagesCount={paymentMadePageination.pagesCount}
initialPageSize={paymentMadePageination.pageSize}
initialPageIndex={paymentMadePageination.page - 1}
/>
</LoadingIndicator>
</div>
<LoadingIndicator loading={paymentMadesLoading && !isLoaded} mount={false}>
<DataTable
columns={columns}
data={paymentMadeCurrentPage}
onFetchData={handleDataTableFetchData}
manualSortBy={true}
selectionColumn={true}
noInitialFetch={true}
sticky={true}
onSelectedRowsChange={handleSelectedRowsChange}
rowContextMenu={onRowContextMenu}
pagination={true}
pagesCount={paymentMadePageination.pagesCount}
initialPageSize={paymentMadeTableQuery.page_size}
initialPageIndex={paymentMadeTableQuery.page - 1}
autoResetSortBy={false}
autoResetPage={false}
/>
</LoadingIndicator>
);
}
export default compose(
withRouter,
withCurrentView,
withDialogActions,
withDashboardActions,
withPaymentMadeActions,
withPaymentMade(
({
paymentMadeCurrentPage,
paymentMadeLoading,
paymentMadesLoading,
paymentMadePageination,
paymentMadeTableQuery,
}) => ({
paymentMadeCurrentPage,
paymentMadeLoading,
paymentMadesLoading,
paymentMadePageination,
paymentMadeTableQuery,
}),
),
withViewDetails(),
)(PaymentMadeDataTable);

21
client/src/containers/Purchases/PaymentMades/PaymentMadeList.js
View File

@@ -95,24 +95,6 @@ function PaymentMadeList({
selectedRows,
]);
const handleFetchData = useCallback(
({ pageIndex, pageSize, sortBy }) => {
const page = pageIndex + 1;
addPaymentMadesTableQueries({
...(sortBy.length > 0
? {
column_sort_by: sortBy[0].id,
sort_order: sortBy[0].desc ? 'desc' : 'asc',
}
: {}),
page_size: pageSize,
page,
});
},
[addPaymentMadesTableQueries],
);
// Handle filter change to re-fetch data-table.
const handleFilterChanged = useCallback(() => {}, [fetchPaymentMades]);
@@ -145,14 +127,13 @@ function PaymentMadeList({
>
<PaymentMadeViewTabs />
<PaymentMadeDataTable
loading={fetchPaymentMades.isFetching}
onDeletePaymentMade={handleDeletePaymentMade}
onFetchData={handleFetchData}
onEditPaymentMade={handleEditPaymentMade}
onSelectedRowsChange={handleSelectedRowsChange}
/>
</Route>
</Switch>
<Alert
cancelButtonText={<T id={'cancel'} />}
confirmButtonText={<T id={'delete'} />}

4
client/src/containers/Purchases/PaymentMades/withPaymentMadeActions.js
View File

@@ -27,8 +27,8 @@ const mapDispatchToProps = (dispatch) => ({
addPaymentMadesTableQueries: (queries) =>
dispatch({
type: t.PAYMENT_MADE_TABLE_QUERIES_ADD,
queries,
type: t.PAYMENT_MADES_TABLE_QUERIES_ADD,
payload: { queries },
}),
setPaymentNumberChange: (isChanged) =>
dispatch({

28
client/src/containers/Sales/Estimate/EstimateList.js
View File

@@ -29,7 +29,7 @@ function EstimateList({
requestFetchResourceFields,
// #withEstimate
estimateTableQuery,
estimatesTableQuery,
estimateViews,
//#withEistimateActions
@@ -52,7 +52,7 @@ function EstimateList({
// (key, resourceName) => requestFetchResourceFields(resourceName),
// );
const fetchEstimate = useQuery(['estimates-table', estimateTableQuery], () =>
const fetchEstimate = useQuery(['estimates-table', estimatesTableQuery], () =>
requestFetchEstimatesTable(),
);
@@ -100,23 +100,6 @@ function EstimateList({
},
[history],
);
const handleFetchData = useCallback(
({ pageIndex, pageSize, sortBy }) => {
const page = pageIndex + 1;
addEstimatesTableQueries({
...(sortBy.length > 0
? {
column_sort_by: sortBy[0].id,
sort_order: sortBy[0].desc ? 'desc' : 'asc',
}
: {}),
page_size: pageSize,
page,
});
},
[addEstimatesTableQueries],
);
const handleSelectedRowsChange = useCallback(
(estimate) => {
@@ -142,14 +125,13 @@ function EstimateList({
>
<EstimateViewTabs />
<EstimatesDataTable
loading={fetchEstimate.isFetching}
onDeleteEstimate={handleDeleteEstimate}
onFetchData={handleFetchData}
onEditEstimate={handleEditEstimate}
onSelectedRowsChange={handleSelectedRowsChange}
/>
</Route>
</Switch>
<Alert
cancelButtonText={<T id={'cancel'} />}
confirmButtonText={<T id={'delete'} />}
@@ -173,8 +155,8 @@ export default compose(
withEstimateActions,
withDashboardActions,
withViewsActions,
withEstimates(({ estimateTableQuery, estimateViews }) => ({
estimateTableQuery,
withEstimates(({ estimatesTableQuery, estimateViews }) => ({
estimatesTableQuery,
estimateViews,
})),
)(EstimateList);

145
client/src/containers/Sales/Estimate/EstimatesDataTable.js
View File

@@ -8,85 +8,48 @@ import {
MenuDivider,
Position,
} from '@blueprintjs/core';
import { useParams } from 'react-router-dom';
import { withRouter } from 'react-router';
import { FormattedMessage as T, useIntl } from 'react-intl';
import moment from 'moment';
import { compose } from 'utils';
import { useUpdateEffect } from 'hooks';
import { compose, saveInvoke } from 'utils';
import { useIsValuePassed } from 'hooks';
import LoadingIndicator from 'components/LoadingIndicator';
import { DataTable, Money, Icon } from 'components';
import withDialogActions from 'containers/Dialog/withDialogActions';
import withDashboardActions from 'containers/Dashboard/withDashboardActions';
import withViewDetails from 'containers/Views/withViewDetails';
import withEstimates from './withEstimates';
import withEstimateActions from './withEstimateActions';
import withCurrentView from 'containers/Views/withCurrentView';
// Estimates transactions datatable.
function EstimatesDataTable({
//#withEitimates
// #withEstimates
estimatesCurrentPage,
estimatesLoading,
estimatesPageination,
estimateItems,
estimatesTableQuery,
// #withDashboardActions
changeCurrentView,
changePageSubtitle,
setTopbarEditView,
// #withEstimatesActions
addEstimatesTableQueries,
// #withView
viewMeta,
//#OwnProps
loading,
onFetchData,
// #ownProps
onEditEstimate,
onDeleteEstimate,
onSelectedRowsChange,
}) {
const [initialMount, setInitialMount] = useState(false);
const { custom_view_id: customViewId } = useParams();
const { formatMessage } = useIntl();
useEffect(() => {
setInitialMount(false);
}, []);
useUpdateEffect(() => {
if (!estimatesLoading) {
setInitialMount(true);
}
}, [estimatesLoading, setInitialMount]);
useEffect(() => {
if (customViewId) {
changeCurrentView(customViewId);
setTopbarEditView(customViewId);
}
changePageSubtitle(customViewId && viewMeta ? viewMeta.name : '');
}, [
customViewId,
changeCurrentView,
changePageSubtitle,
setTopbarEditView,
viewMeta,
]);
const isLoaded = useIsValuePassed(estimatesLoading, false);
const handleEditEstimate = useCallback(
(estimate) => () => {
onEditEstimate && onEditEstimate(estimate);
saveInvoke(onEditEstimate, estimate);
},
[onEditEstimate],
);
const handleDeleteEstimate = useCallback(
(estimate) => () => {
onDeleteEstimate && onDeleteEstimate(estimate);
saveInvoke(onDeleteEstimate, estimate);
},
[onDeleteEstimate],
);
@@ -185,74 +148,64 @@ function EstimatesDataTable({
],
[actionMenuList, formatMessage],
);
const selectionColumn = useMemo(
() => ({
minWidth: 40,
width: 40,
maxWidth: 40,
}),
[],
);
const handleDataTableFetchData = useCallback(
(...args) => {
onFetchData && onFetchData(...args);
const handleFetchData = useCallback(
({ pageIndex, pageSize, sortBy }) => {
const page = pageIndex + 1;
addEstimatesTableQueries({
...(sortBy.length > 0
? {
column_sort_by: sortBy[0].id,
sort_order: sortBy[0].desc ? 'desc' : 'asc',
}
: {}),
page_size: pageSize,
page,
});
},
[onFetchData],
[addEstimatesTableQueries],
);
const handleSelectedRowsChange = useCallback(
(selectedRows) => {
onSelectedRowsChange &&
onSelectedRowsChange(selectedRows.map((s) => s.original));
saveInvoke(
onSelectedRowsChange,
selectedRows.map((s) => s.original),
);
},
[onSelectedRowsChange],
);
console.log(estimatesCurrentPage, 'estimatesCurrentPage');
console.log(estimateItems, 'estimateItems');
return (
<div>
<LoadingIndicator loading={loading} mount={false}>
<DataTable
columns={columns}
data={estimatesCurrentPage}
onFetchData={handleDataTableFetchData}
manualSortBy={true}
selectionColumn={true}
noInitialFetch={true}
sticky={true}
loading={estimatesLoading && !initialMount}
onSelectedRowsChange={handleSelectedRowsChange}
rowContextMenu={onRowContextMenu}
pagination={true}
pagesCount={estimatesPageination.pagesCount}
initialPageSize={estimatesPageination.pageSize}
initialPageIndex={estimatesPageination.page - 1}
/>
</LoadingIndicator>
</div>
<LoadingIndicator loading={estimatesLoading && !isLoaded} mount={false}>
<DataTable
columns={columns}
data={estimatesCurrentPage}
onFetchData={handleFetchData}
manualSortBy={true}
selectionColumn={true}
noInitialFetch={true}
sticky={true}
onSelectedRowsChange={handleSelectedRowsChange}
rowContextMenu={onRowContextMenu}
pagination={true}
pagesCount={estimatesPageination.pagesCount}
initialPageSize={estimatesTableQuery.page_size}
initialPageIndex={estimatesTableQuery.page - 1}
/>
</LoadingIndicator>
);
}
export default compose(
withRouter,
withCurrentView,
withDialogActions,
withDashboardActions,
withEstimateActions,
withEstimates(
({
({ estimatesCurrentPage, estimatesLoading, estimatesPageination, estimatesTableQuery }) => ({
estimatesCurrentPage,
estimatesLoading,
estimatesPageination,
estimateItems,
}) => ({
estimatesCurrentPage,
estimatesLoading,
estimatesPageination,
estimateItems,
estimatesTableQuery
}),
),
withViewDetails(),
)(EstimatesDataTable);

2
client/src/containers/Sales/Estimate/withEstimateActions.js
View File

@@ -25,7 +25,7 @@ const mapDipatchToProps = (dispatch) => ({
addEstimatesTableQueries: (queries) =>
dispatch({
type: t.ESTIMATES_TABLE_QUERIES_ADD,
queries,
payload: { queries },
}),
setEstimateNumberChanged: (isChanged) =>
dispatch({

4
client/src/containers/Sales/Estimate/withEstimates.js
View File

@@ -18,8 +18,8 @@ export default (mapState) => {
estimatesCurrentPage: getEstimatesItems(state, props, query),
estimateViews: getResourceViews(state, props, 'sales_estimates'),
estimateItems: state.salesEstimates.items,
estimateTableQuery: query,
estimatesTableQuery: query,
estimatesPageination: getEstimatesPaginationMeta(state, props, query),
estimatesLoading: state.salesEstimates.loading,

26
client/src/containers/Sales/Invoice/InvoiceList.js
View File

@@ -20,6 +20,9 @@ import withViewsActions from 'containers/Views/withViewsActions';
import { compose } from 'utils';
/**
* Invoices list.
*/
function InvoiceList({
// #withDashboardActions
changePageTitle,
@@ -94,26 +97,8 @@ function InvoiceList({
selectedRows,
]);
const handleFetchData = useCallback(
({ pageIndex, pageSize, sortBy }) => {
const page = pageIndex + 1;
addInvoiceTableQueries({
...(sortBy.length > 0
? {
column_sort_by: sortBy[0].id,
sort_order: sortBy[0].desc ? 'desc' : 'asc',
}
: {}),
page_size: pageSize,
page,
});
},
[addInvoiceTableQueries],
);
// Handle filter change to re-fetch data-table.
const handleFilterChanged = useCallback(() => {}, [fetchInvoices]);
const handleFilterChanged = useCallback(() => {}, []);
// Handle selected rows change.
const handleSelectedRowsChange = useCallback(
@@ -140,14 +125,13 @@ function InvoiceList({
>
<InvoiceViewTabs />
<InvoicesDataTable
loading={fetchInvoices.isFetching}
onDeleteInvoice={handleDeleteInvoice}
onFetchData={handleFetchData}
onEditInvoice={handleEditInvoice}
onSelectedRowsChange={handleSelectedRowsChange}
/>
</Route>
</Switch>
<Alert
cancelButtonText={<T id={'cancel'} />}
confirmButtonText={<T id={'delete'} />}

136
client/src/containers/Sales/Invoice/InvoicesDataTable.js
View File

@@ -1,4 +1,4 @@
import React, { useEffect, useCallback, useState, useMemo } from 'react';
import React, { useCallback, useMemo } from 'react';
import {
Intent,
Button,
@@ -8,13 +8,12 @@ import {
MenuDivider,
Position,
} from '@blueprintjs/core';
import { useParams } from 'react-router-dom';
import { withRouter } from 'react-router';
import { FormattedMessage as T, useIntl } from 'react-intl';
import moment from 'moment';
import { compose } from 'utils';
import { useUpdateEffect } from 'hooks';
import { compose, saveInvoke } from 'utils';
import { useIsValuePassed } from 'hooks';
import LoadingIndicator from 'components/LoadingIndicator';
import { DataTable, Money, Icon } from 'components';
@@ -27,66 +26,34 @@ import withInvoices from './withInvoices';
import withInvoiceActions from './withInvoiceActions';
import withCurrentView from 'containers/Views/withCurrentView';
// Invoices datatable.
function InvoicesDataTable({
//#withInvoices
// #withInvoices
invoicesCurrentPage,
invoicesLoading,
invoicesPageination,
invoicesItems,
// #withDashboardActions
changeCurrentView,
changePageSubtitle,
setTopbarEditView,
// #withInvoicesActions
addInvoiceTableQueries,
// #withView
viewMeta,
//#OwnProps
loading,
onFetchData,
// #OwnProps
onEditInvoice,
onDeleteInvoice,
onSelectedRowsChange,
}) {
const [initialMount, setInitialMount] = useState(false);
const { custom_view_id: customViewId } = useParams();
const { formatMessage } = useIntl();
useEffect(() => {
setInitialMount(false);
}, [customViewId]);
useUpdateEffect(() => {
if (!invoicesLoading) {
setInitialMount(true);
}
}, [invoicesLoading, setInitialMount]);
// useEffect(() => {
// if (customViewId) {
// changeCurrentView(customViewId);
// setTopbarEditView(customViewId);
// }
// changePageSubtitle(customViewId && viewMeta ? viewMeta.name : '');
// }, [
// customViewId,
// changeCurrentView,
// changePageSubtitle,
// setTopbarEditView,
// viewMeta,
// ]);
const isLoadedBefore = useIsValuePassed(invoicesLoading, false);
const handleEditInvoice = useCallback(
(_invoice) => () => {
onEditInvoice && onEditInvoice(_invoice);
saveInvoke(onEditInvoice, _invoice);
},
[onEditInvoice],
);
const handleDeleteInvoice = useCallback(
(_invoice) => () => {
onDeleteInvoice && onDeleteInvoice(_invoice);
saveInvoke(onDeleteInvoice, _invoice);
},
[onDeleteInvoice],
);
@@ -194,49 +161,54 @@ function InvoicesDataTable({
);
const handleDataTableFetchData = useCallback(
(...args) => {
onFetchData && onFetchData(...args);
({ pageSize, pageIndex, sortBy }) => {
addInvoiceTableQueries({
...(sortBy.length > 0
? {
column_sort_by: sortBy[0].id,
sort_order: sortBy[0].desc ? 'desc' : 'asc',
}
: {}),
page_size: pageSize,
page: pageIndex + 1,
});
},
[onFetchData],
[addInvoiceTableQueries],
);
const handleSelectedRowsChange = useCallback(
(selectedRows) => {
onSelectedRowsChange &&
onSelectedRowsChange(selectedRows.map((s) => s.original));
saveInvoke(
onSelectedRowsChange,
selectedRows.map((s) => s.original),
);
},
[onSelectedRowsChange],
);
const selectionColumn = useMemo(
() => ({
minWidth: 40,
width: 40,
maxWidth: 40,
}),
[],
);
return (
<div>
<LoadingIndicator loading={loading} mount={false}>
<DataTable
columns={columns}
data={invoicesCurrentPage}
onFetchData={handleDataTableFetchData}
manualSortBy={true}
selectionColumn={true}
noInitialFetch={true}
sticky={true}
loading={invoicesLoading && !initialMount}
onSelectedRowsChange={handleSelectedRowsChange}
rowContextMenu={onRowContextMenu}
pagination={true}
pagesCount={invoicesPageination.pagesCount}
initialPageSize={invoicesPageination.pageSize}
initialPageIndex={invoicesPageination.page - 1}
/>
</LoadingIndicator>
</div>
<LoadingIndicator
loading={invoicesLoading && !isLoadedBefore}
mount={false}
>
<DataTable
columns={columns}
data={invoicesCurrentPage}
onFetchData={handleDataTableFetchData}
manualSortBy={true}
selectionColumn={true}
noInitialFetch={true}
sticky={true}
onSelectedRowsChange={handleSelectedRowsChange}
rowContextMenu={onRowContextMenu}
pagination={true}
autoResetSortBy={false}
autoResetPage={false}
pagesCount={invoicesPageination.pagesCount}
initialPageSize={invoicesPageination.pageSize}
initialPageIndex={invoicesPageination.page - 1}
/>
</LoadingIndicator>
);
}
@@ -247,10 +219,16 @@ export default compose(
withDashboardActions,
withInvoiceActions,
withInvoices(
({ invoicesCurrentPage, invoicesLoading, invoicesPageination }) => ({
({
invoicesCurrentPage,
invoicesLoading,
invoicesPageination,
invoicesTableQuery,
}) => ({
invoicesCurrentPage,
invoicesLoading,
invoicesPageination,
invoicesTableQuery,
}),
),
withViewDetails(),

11
client/src/containers/Sales/Invoice/withInvoiceActions.js
View File

@@ -16,19 +16,20 @@ const mapDipatchToProps = (dispatch) => ({
requestFetchInvoiceTable: (query = {}) =>
dispatch(fetchInvoicesTable({ query: { ...query } })),
requestDeleteInvoice: (id) => dispatch(deleteInvoice({ id })),
requestFetchDueInvoices: (customerId) => dispatch(fetchDueInvoices({ customerId })),
requestFetchDueInvoices: (customerId) =>
dispatch(fetchDueInvoices({ customerId })),
changeInvoiceView: (id) =>
dispatch({
type: t.INVOICES_SET_CURRENT_VIEW,
currentViewId: parseInt(id, 10),
}),
addInvoiceTableQueries: (_queries) =>
addInvoiceTableQueries: (queries) =>
dispatch({
type: t.INVOICES_TABLE_QUERIES_ADD,
_queries,
payload: { queries },
}),
setInvoiceNumberChanged: (isChanged) => dispatch({
setInvoiceNumberChanged: (isChanged) =>
dispatch({
type: t.INVOICE_NUMBER_CHANGED,
payload: { isChanged },
}),

1
client/src/containers/Sales/Invoice/withInvoices.js
View File

@@ -29,7 +29,6 @@ export default (mapState) => {
state,
props,
),
invoiceNumberChanged: state.salesInvoices.journalNumberChanged,
};
return mapState ? mapState(mapped, state, props) : mapped;

26
client/src/containers/Sales/PaymentReceive/PaymentReceiveList.js
View File

@@ -60,7 +60,7 @@ function PaymentReceiveList({
() => requestFetchPaymentReceiveTable(),
);
//handle dalete Payment Receive
// Handle dalete Payment Receive
const handleDeletePaymentReceive = useCallback(
(paymentReceive) => {
setDeletePaymentReceive(paymentReceive);
@@ -68,12 +68,12 @@ function PaymentReceiveList({
[setDeletePaymentReceive],
);
// handle cancel Payment Receive
// Handle cancel payment Receive.
const handleCancelPaymentReceiveDelete = useCallback(() => {
setDeletePaymentReceive(false);
}, [setDeletePaymentReceive]);
// handleConfirm delete payment receive
// Handle confirm delete payment receive.
const handleConfirmPaymentReceiveDelete = useCallback(() => {
requestDeletePaymentReceive(deletePaymentReceive.id).then(() => {
AppToaster.show({
@@ -95,24 +95,6 @@ function PaymentReceiveList({
selectedRows,
]);
const handleFetchData = useCallback(
({ pageIndex, pageSize, sortBy }) => {
const page = pageIndex + 1;
addPaymentReceivesTableQueries({
...(sortBy.length > 0
? {
column_sort_by: sortBy[0].id,
sort_order: sortBy[0].desc ? 'desc' : 'asc',
}
: {}),
page_size: pageSize,
page,
});
},
[addPaymentReceivesTableQueries],
);
// Handle filter change to re-fetch data-table.
const handleFilterChanged = useCallback(() => {}, [fetchPaymentReceives]);
@@ -145,9 +127,7 @@ function PaymentReceiveList({
>
<PaymentReceiveViewTabs />
<PaymentReceivesDataTable
loading={fetchPaymentReceives.isFetching}
onDeletePaymentReceive={handleDeletePaymentReceive}
onFetchData={handleFetchData}
onEditPaymentReceive={handleEditPaymentReceive}
onSelectedRowsChange={handleSelectedRowsChange}
/>

141
client/src/containers/Sales/PaymentReceive/PaymentReceivesDataTable.js
View File

@@ -1,21 +1,19 @@
import React, { useEffect, useCallback, useState, useMemo } from 'react';
import React, { useCallback, useMemo } from 'react';
import {
Intent,
Button,
Classes,
Popover,
Menu,
MenuItem,
MenuDivider,
Position,
} from '@blueprintjs/core';
import { useParams } from 'react-router-dom';
import { withRouter } from 'react-router';
import { FormattedMessage as T, useIntl } from 'react-intl';
import moment from 'moment';
import { compose } from 'utils';
import { useUpdateEffect } from 'hooks';
import { compose, saveInvoke } from 'utils';
import { useIsValuePassed } from 'hooks';
import LoadingIndicator from 'components/LoadingIndicator';
import { DataTable, Money, Icon } from 'components';
@@ -29,58 +27,26 @@ import withPaymentReceivesActions from './withPaymentReceivesActions';
import withCurrentView from 'containers/Views/withCurrentView';
function PaymentReceivesDataTable({
//#withPaymentReceives
// #withPaymentReceives
PaymentReceivesCurrentPage,
paymentReceivesPageination,
paymentReceivesLoading,
paymentReceivesItems,
paymentReceivesTableQuery,
// #withDashboardActions
changeCurrentView,
changePageSubtitle,
setTopbarEditView,
// #withPaymentReceivesActions
addPaymentReceivesTableQueries,
// #withView
viewMeta,
//#OwnProps
loading,
onFetchData,
// #OwnProps
onEditPaymentReceive,
onDeletePaymentReceive,
onSelectedRowsChange,
}) {
const [initialMount, setInitialMount] = useState(false);
const { custom_view_id: customViewId } = useParams();
const isLoaded = useIsValuePassed(paymentReceivesLoading, false);
const { formatMessage } = useIntl();
useEffect(() => {
setInitialMount(false);
}, [customViewId]);
useUpdateEffect(() => {
if (!paymentReceivesLoading) {
setInitialMount(true);
}
}, [paymentReceivesLoading, setInitialMount]);
// useEffect(() => {
// if (customViewId) {
// changeCurrentView(customViewId);
// setTopbarEditView(customViewId);
// }
// changePageSubtitle(customViewId && viewMeta ? viewMeta.name : '');
// }, [
// customViewId,
// changeCurrentView,
// changePageSubtitle,
// setTopbarEditView,
// viewMeta,
// ]);
const handleEditPaymentReceive = useCallback(
(paymentReceive) => () => {
onEditPaymentReceive && onEditPaymentReceive(paymentReceive);
saveInvoke(onEditPaymentReceive, paymentReceive);
},
[onEditPaymentReceive],
);
@@ -92,6 +58,32 @@ function PaymentReceivesDataTable({
[onDeletePaymentReceive],
);
const handleDataTableFetchData = useCallback(
({ pageIndex, pageSize, sortBy }) => {
addPaymentReceivesTableQueries({
...(sortBy.length > 0
? {
column_sort_by: sortBy[0].id,
sort_order: sortBy[0].desc ? 'desc' : 'asc',
}
: {}),
page_size: pageSize,
page: pageIndex + 1,
});
},
[addPaymentReceivesTableQueries],
);
const handleSelectedRowsChange = useCallback(
(selectedRows) => {
saveInvoke(
onSelectedRowsChange,
selectedRows.map((s) => s.original),
);
},
[onSelectedRowsChange],
);
const actionMenuList = useCallback(
(paymentReceive) => (
<Menu>
@@ -142,7 +134,8 @@ function PaymentReceivesDataTable({
{
id: 'payment_receive_no',
Header: formatMessage({ id: 'payment_receive_no' }),
accessor: (row) => (row.payment_receive_no ? `#${row.payment_receive_no}` : null),
accessor: (row) =>
row.payment_receive_no ? `#${row.payment_receive_no}` : null,
width: 140,
className: 'payment_receive_no',
},
@@ -186,41 +179,29 @@ function PaymentReceivesDataTable({
[actionMenuList, formatMessage],
);
const handleDataTableFetchData = useCallback(
(...args) => {
onFetchData && onFetchData(...args);
},
[onFetchData],
);
const handleSelectedRowsChange = useCallback(
(selectedRows) => {
onSelectedRowsChange &&
onSelectedRowsChange(selectedRows.map((s) => s.original));
},
[onSelectedRowsChange],
);
return (
<div>
<LoadingIndicator loading={loading} mount={false}>
<DataTable
columns={columns}
data={PaymentReceivesCurrentPage}
onFetchData={handleDataTableFetchData}
manualSortBy={true}
selectionColumn={true}
noInitialFetch={true}
sticky={true}
loading={paymentReceivesLoading && !initialMount}
onSelectedRowsChange={handleSelectedRowsChange}
rowContextMenu={onRowContextMenu}
pagination={true}
pagesCount={paymentReceivesPageination.pagesCount}
initialPageSize={paymentReceivesPageination.pageSize}
initialPageIndex={paymentReceivesPageination.page - 1}
/>
</LoadingIndicator>
</div>
<LoadingIndicator
loading={paymentReceivesLoading && !isLoaded}
mount={false}
>
<DataTable
columns={columns}
data={PaymentReceivesCurrentPage}
onFetchData={handleDataTableFetchData}
manualSortBy={true}
selectionColumn={true}
noInitialFetch={true}
sticky={true}
onSelectedRowsChange={handleSelectedRowsChange}
rowContextMenu={onRowContextMenu}
pagination={true}
autoResetSortBy={false}
autoResetPage={false}
pagesCount={paymentReceivesPageination.pagesCount}
initialPageSize={paymentReceivesTableQuery.page_size}
initialPageIndex={paymentReceivesTableQuery.page - 1}
/>
</LoadingIndicator>
);
}
@@ -235,10 +216,12 @@ export default compose(
PaymentReceivesCurrentPage,
paymentReceivesLoading,
paymentReceivesPageination,
paymentReceivesTableQuery
}) => ({
PaymentReceivesCurrentPage,
paymentReceivesLoading,
paymentReceivesPageination,
paymentReceivesTableQuery
}),
),
withViewDetails(),

1
client/src/containers/Sales/PaymentReceive/withPaymentReceives.js
View File

@@ -22,7 +22,6 @@ export default (mapState) => {
query,
),
paymentReceivesLoading: state.paymentReceives.loading,
paymentReceiveNumberChanged: state.paymentReceives.journalNumberChanged,
};
return mapState ? mapState(mapped, state, props) : mapped;

9
client/src/containers/Sales/PaymentReceive/withPaymentReceivesActions.js
View File

@@ -20,16 +20,17 @@ const mapDispatchToProps = (dispatch) => ({
changePaymentReceiveView: (id) =>
dispatch({
type: t.PAYMENT_RECEIVE_SET_CURRENT_VIEW,
type: t.PAYMENT_RECEIVES_SET_CURRENT_VIEW,
currentViewId: parseInt(id, 10),
}),
addPaymentReceivesTableQueries: (queries) =>
dispatch({
type: t.PAYMENT_RECEIVE_TABLE_QUERIES_ADD,
queries,
type: t.PAYMENT_RECEIVES_TABLE_QUERIES_ADD,
payload: { queries }
}),
setPaymentReceiveNumberChanged: (isChanged) =>
setPaymentReceiveNumberChanged: (isChanged) =>
dispatch({
type: t.PAYMENT_RECEIVE_NUMBER_CHANGED,
payload: { isChanged },

27
client/src/containers/Sales/Receipt/ReceiptList.js
View File

@@ -30,7 +30,6 @@ function ReceiptList({
//#withReceipts
receiptTableQuery,
receiptview,
//#withReceiptActions
requestFetchReceiptsTable,
@@ -96,10 +95,8 @@ function ReceiptList({
// [fetchReceipt],
// );
// Handle filter change to re-fetch data-table.
const handleFilterChanged = useCallback(() => {}, [fetchReceipts]);
// Handle filter change to re-fetch data-table.
const handleFilterChanged = useCallback(() => {}, [fetchReceipts]);
// Calculates the selected rows
const selectedRowsCount = useMemo(() => Object.values(selectedRows).length, [
@@ -112,23 +109,6 @@ function ReceiptList({
},
[history],
);
const handleFetchData = useCallback(
({ pageIndex, pageSize, sortBy }) => {
const page = pageIndex + 1;
addReceiptsTableQueries({
...(sortBy.length > 0
? {
column_sort_by: sortBy[0].id,
sort_order: sortBy[0].desc ? 'desc' : 'asc',
}
: {}),
page_size: pageSize,
page,
});
},
[addReceiptsTableQueries],
);
const handleSelectedRowsChange = useCallback(
(estimate) => {
@@ -154,14 +134,13 @@ function ReceiptList({
>
<ReceiptViewTabs />
<ReceiptsDataTable
loading={fetchReceipts.isLoading}
onDeleteReceipt={handleDeleteReceipt}
onFetchData={handleFetchData}
onEditReceipt={handleEditReceipt}
onSelectedRowsChange={handleSelectedRowsChange}
/>
</Route>
</Switch>
<Alert
cancelButtonText={<T id={'cancel'} />}
confirmButtonText={<T id={'delete'} />}

129
client/src/containers/Sales/Receipt/ReceiptsDataTable.js
View File

@@ -1,4 +1,4 @@
import React, { useEffect, useCallback, useState, useMemo } from 'react';
import React, { useCallback, useMemo } from 'react';
import {
Intent,
Button,
@@ -8,85 +8,50 @@ import {
MenuDivider,
Position,
} from '@blueprintjs/core';
import { useParams } from 'react-router-dom';
import { withRouter } from 'react-router';
import { FormattedMessage as T, useIntl } from 'react-intl';
import moment from 'moment';
import { compose } from 'utils';
import { useUpdateEffect } from 'hooks';
import { compose, saveInvoke } from 'utils';
import { useIsValuePassed } from 'hooks';
import LoadingIndicator from 'components/LoadingIndicator';
import { DataTable, Money, Icon } from 'components';
import { LoadingIndicator, DataTable, Money, Icon } from 'components';
import withDialogActions from 'containers/Dialog/withDialogActions';
import withDashboardActions from 'containers/Dashboard/withDashboardActions';
import withViewDetails from 'containers/Views/withViewDetails';
import withReceipts from './withReceipts';
import withReceiptActions from './withReceiptActions';
import withCurrentView from 'containers/Views/withCurrentView';
function ReceiptsDataTable({
//#withReceipts
receiptsCurrentPage,
receiptsLoading,
receiptsPagination,
receiptItems,
// #withDashboardActions
changeCurrentView,
changePageSubtitle,
setTopbarEditView,
receiptTableQuery,
// #withView
viewMeta,
// #withReceiptsActions
addReceiptsTableQueries,
// #Own Props
loading,
onFetchData,
onEditReceipt,
onDeleteReceipt,
onSelectedRowsChange,
}) {
const [initialMount, setInitialMount] = useState(false);
const { custom_view_id: customViewId } = useParams();
const { formatMessage } = useIntl();
useUpdateEffect(() => {
if (!receiptsLoading) {
setInitialMount(true);
}
}, [receiptsLoading, setInitialMount]);
useEffect(() => {
setInitialMount(false);
}, []);
useEffect(() => {
if (customViewId) {
changeCurrentView(customViewId);
setTopbarEditView(customViewId);
}
changePageSubtitle(customViewId && viewMeta ? viewMeta.name : '');
}, [
customViewId,
changeCurrentView,
changePageSubtitle,
setTopbarEditView,
viewMeta,
]);
const isLoadedBefore = useIsValuePassed(receiptsLoading, false);
const handleEditReceipt = useCallback(
(receipt) => () => {
onEditReceipt && onEditReceipt(receipt);
saveInvoke(onEditReceipt, receipt);
},
[onEditReceipt],
);
const handleDeleteReceipt = useCallback(
(receipt) => () => {
onDeleteReceipt && onDeleteReceipt(receipt);
saveInvoke(onDeleteReceipt, receipt);
},
[onDeleteReceipt],
);
@@ -194,50 +159,61 @@ function ReceiptsDataTable({
);
const handleDataTableFetchData = useCallback(
(...args) => {
onFetchData && onFetchData(...args);
({ sortBy, pageIndex, pageSize }) => {
const page = pageIndex + 1;
addReceiptsTableQueries({
...(sortBy.length > 0
? {
column_sort_by: sortBy[0].id,
sort_order: sortBy[0].desc ? 'desc' : 'asc',
}
: {}),
page_size: pageSize,
page,
});
},
[onFetchData],
[addReceiptsTableQueries],
);
const handleSelectedRowsChange = useCallback(
(selectedRows) => {
onSelectedRowsChange &&
onSelectedRowsChange(selectedRows.map((s) => s.original));
saveInvoke(
onSelectedRowsChange,
selectedRows.map((s) => s.original),
);
},
[onSelectedRowsChange],
);
console.log(receiptsCurrentPage, 'receiptCurrnetPage');
console.log(receiptItems, 'receiptItems');
return (
<div>
<LoadingIndicator loading={loading} mount={false}>
<DataTable
columns={columns}
data={receiptsCurrentPage}
loading={receiptsLoading && !initialMount}
onFetchData={handleDataTableFetchData}
manualSortBy={true}
selectionColumn={true}
noInitialFetch={true}
sticky={true}
onSelectedRowsChange={handleSelectedRowsChange}
rowContextMenu={onRowContextMenu}
pagination={true}
pagesCount={receiptsPagination.pagesCount}
initialPageSize={receiptsPagination.pageSize}
initialPageIndex={receiptsPagination.page - 1}
/>
</LoadingIndicator>
</div>
<LoadingIndicator
loading={receiptsLoading && !isLoadedBefore}
mount={false}
>
<DataTable
columns={columns}
data={receiptsCurrentPage}
onFetchData={handleDataTableFetchData}
manualSortBy={true}
selectionColumn={true}
noInitialFetch={true}
sticky={true}
onSelectedRowsChange={handleSelectedRowsChange}
rowContextMenu={onRowContextMenu}
pagination={true}
pagesCount={receiptsPagination.pagesCount}
autoResetSortBy={false}
autoResetPage={false}
initialPageSize={receiptTableQuery.page_size}
initialPageIndex={receiptTableQuery.page - 1}
/>
</LoadingIndicator>
);
}
export default compose(
withRouter,
withCurrentView,
withDialogActions,
withDashboardActions,
withReceiptActions,
@@ -246,13 +222,12 @@ export default compose(
receiptsCurrentPage,
receiptsLoading,
receiptsPagination,
receiptItems,
receiptTableQuery,
}) => ({
receiptsCurrentPage,
receiptsLoading,
receiptsPagination,
receiptItems,
receiptTableQuery,
}),
),
withViewDetails(),
)(ReceiptsDataTable);

2
client/src/containers/Sales/Receipt/withReceiptActions.js
View File

@@ -26,7 +26,7 @@ const mapDispatchToProps = (dispatch) => ({
addReceiptsTableQueries: (queries) =>
dispatch({
type: t.RECEIPTS_TABLE_QUERIES_ADD,
queries,
payload: { queries },
}),
setReceiptNumberChanged:(isChanged) => dispatch({
type: t.RECEIPT_NUMBER_CHANGED,

1
client/src/containers/Sales/Receipt/withReceipts.js
View File

@@ -22,7 +22,6 @@ export default (mapState) => {
receiptsPagination: getReceiptPaginationMeta(state, props, tableQuery),
receiptsLoading: state.salesReceipts.loading,
receiptNumberChanged: state.salesReceipts.journalNumberChanged,
};