This commit is contained in:
elforjani3
2020-11-18 15:18:44 +02:00
49 changed files with 1050 additions and 244 deletions

View File

@@ -25,6 +25,8 @@ import {
} from 'components';
import { useIsValuePassed } from 'hooks';
import ManualJournalsEmptyStatus from './ManualJournalsEmptyStatus';
import withDialogActions from 'containers/Dialog/withDialogActions';
import withManualJournals from 'containers/Accounting/withManualJournals';
import withManualJournalsActions from 'containers/Accounting/withManualJournalsActions';
@@ -76,6 +78,7 @@ function ManualJournalsDataTable({
manualJournalsLoading,
manualJournalsPagination,
manualJournalsTableQuery,
manualJournalsCurrentViewId,
// #withManualJournalsActions
addManualJournalsTableQueries,
@@ -248,26 +251,39 @@ function ManualJournalsDataTable({
[onSelectedRowsChange],
);
const showEmptyStatus = [
manualJournalsCurrentViewId === -1,
manualJournalsCurrentPage.length === 0,
].every(condition => condition === true);
return (
<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}
/>
<Choose>
<Choose.When condition={showEmptyStatus}>
<ManualJournalsEmptyStatus />
</Choose.When>
<Choose.Otherwise>
<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}
/>
</Choose.Otherwise>
</Choose>
</LoadingIndicator>
);
}
@@ -282,11 +298,13 @@ export default compose(
manualJournalsLoading,
manualJournalsPagination,
manualJournalsTableQuery,
manualJournalsCurrentViewId,
}) => ({
manualJournalsCurrentPage,
manualJournalsLoading,
manualJournalsPagination,
manualJournalsTableQuery,
manualJournalsCurrentViewId
}),
),
)(ManualJournalsDataTable);

View File

@@ -0,0 +1,37 @@
import React from 'react';
import { Button, Intent } from '@blueprintjs/core';
import { useHistory } from 'react-router-dom';
import { EmptyStatus } from 'components';
export default function ManualJournalsEmptyStatus() {
const history = useHistory();
return (
<EmptyStatus
title={'Create your first journal entries on accounts chart.'}
description={
<p>
It is a long established fact that a reader will be distracted by the
readable content of a page when looking at its layout.
</p>
}
action={
<>
<Button
intent={Intent.PRIMARY}
large={true}
onClick={() => {
history.push('/invoices/new');
}}
>
Make journal
</Button>
<Button intent={Intent.NONE} large={true}>
Learn more
</Button>
</>
}
/>
);
}

View File

@@ -4,10 +4,12 @@ import {
getManualJournalsItems,
getManualJournalsPagination,
getManualJournalsTableQuery,
getManualJournalsCurrentViewIdFactory
} from 'store/manualJournals/manualJournals.selectors';
export default (mapState) => {
const getManualJournalsCurrentViewId = getManualJournalsCurrentViewIdFactory();
const mapStateToProps = (state, props) => {
const query = getManualJournalsTableQuery(state, props);
@@ -21,6 +23,8 @@ export default (mapState) => {
manualJournalsLoading: state.manualJournals.loading,
journalNumberChanged: state.manualJournals.journalNumberChanged,
manualJournalsCurrentViewId: getManualJournalsCurrentViewId(state, props),
};
return mapState ? mapState(mapped, state, props) : mapped;
};

View File

@@ -1,4 +1,4 @@
import React, { useRef, useEffect, useCallback, useMemo } from 'react';
import React, { useCallback, useMemo } from 'react';
import {
Button,
Popover,
@@ -11,8 +11,8 @@ import {
import { FormattedMessage as T, useIntl } from 'react-intl';
import { useIsValuePassed } from 'hooks';
import LoadingIndicator from 'components/LoadingIndicator';
import { DataTable, Icon, Money } from 'components';
import CustomersEmptyStatus from './CustomersEmptyStatus';
import { DataTable, Icon, Money, Choose, LoadingIndicator } from 'components';
import withCustomers from './withCustomers';
import withCustomersActions from './withCustomersActions';
@@ -29,6 +29,7 @@ const CustomerTable = ({
customersLoading,
customerPagination,
customersTableQuery,
customersCurrentViewId,
// #withCustomersActions
addCustomersTableQueries,
@@ -182,31 +183,44 @@ const CustomerTable = ({
onDeleteCustomer,
});
const showEmptyStatus = [
customersCurrentViewId === -1,
customers.length === 0,
].every(condition => condition === true);
return (
<LoadingIndicator
loading={customersLoading && !isLoadedBefore}
mount={false}
>
<DataTable
noInitialFetch={true}
columns={columns}
data={customers}
// loading={customersLoading}
onFetchData={handleFetchData}
selectionColumn={true}
expandable={false}
sticky={true}
onSelectedRowsChange={handleSelectedRowsChange}
spinnerProps={{ size: 30 }}
rowContextMenu={rowContextMenu}
pagination={true}
manualSortBy={true}
pagesCount={customerPagination.pagesCount}
autoResetSortBy={false}
autoResetPage={false}
initialPageSize={customersTableQuery.page_size}
initialPageIndex={customersTableQuery.page - 1}
/>
<Choose>
<Choose.When condition={showEmptyStatus}>
<CustomersEmptyStatus />
</Choose.When>
<Choose.Otherwise>
<DataTable
noInitialFetch={true}
columns={columns}
data={customers}
// loading={customersLoading}
onFetchData={handleFetchData}
selectionColumn={true}
expandable={false}
sticky={true}
onSelectedRowsChange={handleSelectedRowsChange}
spinnerProps={{ size: 30 }}
rowContextMenu={rowContextMenu}
pagination={true}
manualSortBy={true}
pagesCount={customerPagination.pagesCount}
autoResetSortBy={false}
autoResetPage={false}
initialPageSize={customersTableQuery.page_size}
initialPageIndex={customersTableQuery.page - 1}
/>
</Choose.Otherwise>
</Choose>
</LoadingIndicator>
);
};
@@ -218,11 +232,13 @@ export default compose(
customersLoading,
customerPagination,
customersTableQuery,
customersCurrentViewId,
}) => ({
customers,
customersLoading,
customerPagination,
customersTableQuery,
customersCurrentViewId
}),
),
withCustomersActions,

View File

@@ -0,0 +1,37 @@
import React from 'react';
import { Button, Intent } from '@blueprintjs/core';
import { useHistory } from 'react-router-dom';
import { EmptyStatus } from 'components';
export default function CustomersEmptyStatus() {
const history = useHistory();
return (
<EmptyStatus
title={"Create and manage your organization's customers."}
description={
<p>
Here a list of your organization products and services, to be used
when you create invoices or bills to your customers or vendors.
</p>
}
action={
<>
<Button
intent={Intent.PRIMARY}
large={true}
onClick={() => {
history.push('/customers/new');
}}
>
New customer
</Button>
<Button intent={Intent.NONE} large={true}>
Learn more
</Button>
</>
}
/>
);
}

View File

@@ -4,11 +4,13 @@ import {
getCustomerCurrentPageFactory,
getCustomerPaginationMetaFactory,
getCustomerTableQueryFactory,
getCustomersCurrentViewIdFactory,
} from 'store/customers/customers.selectors';
export default (mapState) => {
const getCustomersList = getCustomerCurrentPageFactory();
const getCustomerPaginationMeta = getCustomerPaginationMetaFactory();
const getCustomersCurrentViewId = getCustomersCurrentViewIdFactory();
const getCustomerTableQuery = getCustomerTableQueryFactory();
const mapStateToProps = (state, props) => {
@@ -21,6 +23,7 @@ export default (mapState) => {
customerPagination: getCustomerPaginationMeta(state, props, query),
customersLoading: state.customers.loading,
customersItems: state.customers.items,
customersCurrentViewId: getCustomersCurrentViewId(state, props),
// customerErrors: state.customers.errors,
};
return mapState ? mapState(mapped, state, props) : mapped;

View File

@@ -20,9 +20,9 @@ import Icon from 'components/Icon';
import { compose, saveInvoke } from 'utils';
import { useIsValuePassed } from 'hooks';
import LoadingIndicator from 'components/LoadingIndicator';
import { If, Money } from 'components';
import { If, Money, Choose, LoadingIndicator } from 'components';
import DataTable from 'components/DataTable';
import ExpensesEmptyStatus from './ExpensesEmptyStatus';
import withDialogActions from 'containers/Dialog/withDialogActions';
import withDashboardActions from 'containers/Dashboard/withDashboardActions';
@@ -37,6 +37,7 @@ function ExpensesDataTable({
expensesLoading,
expensesPagination,
expensesTableQuery,
expensesCurrentViewId,
// #withExpensesActions
addExpensesTableQueries,
@@ -265,28 +266,41 @@ function ExpensesDataTable({
[onSelectedRowsChange],
);
const showEmptyStatus = [
expensesCurrentViewId === -1,
expensesCurrentPage.length === 0
].every(condition => condition === true);
return (
<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}
/>
<Choose>
<Choose.When condition={showEmptyStatus}>
<ExpensesEmptyStatus />
</Choose.When>
<Choose.Otherwise>
<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}
/>
</Choose.Otherwise>
</Choose>
</LoadingIndicator>
);
}
@@ -303,11 +317,13 @@ export default compose(
expensesLoading,
expensesPagination,
expensesTableQuery,
expensesCurrentViewId,
}) => ({
expensesCurrentPage,
expensesLoading,
expensesPagination,
expensesTableQuery,
expensesCurrentViewId,
}),
),
withViewDetails(),

View File

@@ -0,0 +1,40 @@
import React from 'react';
function DatatableEmptyState({
title,
description,
newButtonText,
newButtonUrl,
learnMoreButtonText,
learnMoreButtonUrl,
}) {
return (
<div class={'datatable-empty-state'}>
<h1 class={CLASSES.DATATABLE_EMPTY_STATE_TITLE}>
{ title }
</h1>
</div>
)
}
export default function ExpensesEmptyState({
}) {
return (
<DatatableEmptyState
title={''}
description={''}
newButtonText={''}
newButtonUrl={''}
learnMoreButtonText={''}
learnMoreButtonUrl={''}
/>
);
}

View File

@@ -0,0 +1,37 @@
import React from 'react';
import { Button, Intent } from '@blueprintjs/core';
import { useHistory } from 'react-router-dom';
import { EmptyStatus } from 'components';
export default function InvoicesEmptyStatus() {
const history = useHistory();
return (
<EmptyStatus
title={"Create and manage your organization's expenses"}
description={
<p>
It is a long established fact that a reader will be distracted by the
readable content of a page when looking at its layout.
</p>
}
action={
<>
<Button
intent={Intent.PRIMARY}
large={true}
onClick={() => {
history.push('/expenses/new');
}}
>
New expense
</Button>
<Button intent={Intent.NONE} large={true}>
Learn more
</Button>
</>
}
/>
);
}

View File

@@ -5,11 +5,13 @@ import {
getExpenseByIdFactory,
getExpensesTableQuery,
getExpensesPaginationMetaFactory,
getExpensesCurrentViewIdFactory,
} from 'store/expenses/expenses.selectors';
export default (mapState) => {
const getExpensesItems = getExpensesCurrentPageFactory();
const getExpensesPaginationMeta = getExpensesPaginationMetaFactory();
const getExpensesCurrentViewId = getExpensesCurrentViewIdFactory();
const mapStateToProps = (state, props) => {
const query = getExpensesTableQuery(state, props);
@@ -21,6 +23,7 @@ export default (mapState) => {
expensesTableQuery: query,
expensesPagination: getExpensesPaginationMeta(state, props),
expensesLoading: state.expenses.loading,
expensesCurrentViewId: getExpensesCurrentViewId(state, props),
};
return mapState ? mapState(mapped, state, props) : mapped;
};

View File

@@ -50,7 +50,6 @@ const ItemFormContainer = ({
);
const handleCancel = useCallback(() => {
// history.push('/items');
history.goBack();
}, [history]);

View File

@@ -1,4 +1,4 @@
import React, { useState, useEffect, useCallback, useMemo } from 'react';
import React, { useCallback, useMemo } from 'react';
import {
Button,
Popover,
@@ -10,14 +10,18 @@ import {
Tag,
} from '@blueprintjs/core';
import { FormattedMessage as T, useIntl } from 'react-intl';
import { Icon, DataTable, Money } from 'components';
import { useIsValuePassed } from 'hooks';
import classNames from 'classnames';
import { Icon, DataTable, Money, LoadingIndicator, Choose } from 'components';
import ItemsEmptyStatus from './ItemsEmptyStatus';
import { useIsValuePassed } from 'hooks';
import { CLASSES } from 'common/classes';
import LoadingIndicator from 'components/LoadingIndicator';
import withItems from 'containers/Items/withItems';
import withItemsActions from 'containers/Items/withItemsActions';
import { compose, saveInvoke } from 'utils';
// Items datatable.
function ItemsDataTable({
// #withItems
itemsTableLoading,
@@ -181,31 +185,38 @@ function ItemsDataTable({
);
return (
<LoadingIndicator
loading={itemsTableLoading && !isLoadedBefore}
mount={false}
>
<DataTable
columns={columns}
data={itemsCurrentPage}
onFetchData={handleFetchData}
noInitialFetch={true}
expandable={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>
<div className={classNames(CLASSES.DASHBOARD_DATATABLE)}>
<LoadingIndicator loading={itemsTableLoading && !isLoadedBefore}>
<Choose>
<Choose.When condition={true}>
<ItemsEmptyStatus />
</Choose.When>
<Choose.Otherwise>
<DataTable
columns={columns}
data={itemsCurrentPage}
onFetchData={handleFetchData}
noInitialFetch={true}
expandable={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}
/>
</Choose.Otherwise>
</Choose>
</LoadingIndicator>
</div>
);
};
}
export default compose(
withItems(({ itemsCurrentPage, itemsTableLoading, itemsTableQuery }) => ({

View File

@@ -0,0 +1,36 @@
import React from 'react';
import { Button, Intent } from '@blueprintjs/core';
import { useHistory } from 'react-router-dom';
import { EmptyStatus } from 'components';
export default function ItemsEmptyStatus() {
const history = useHistory();
return (
<EmptyStatus
title={'Manage the organizations services and products.'}
description={
<p>
Here a list of your organization products and services, to be used when you create invoices or bills to your customers or vendors.
</p>
}
action={
<>
<Button
intent={Intent.PRIMARY}
large={true}
onClick={() => {
history.push('/items/new');
}}
>
New Item
</Button>
<Button intent={Intent.NONE} large={true}>
Learn more
</Button>
</>
}
/>
);
}

View File

@@ -50,7 +50,7 @@ function ItemsList({
useEffect(() => {
changePageTitle(formatMessage({ id: 'items_list' }));
}, [changePageTitle]);
}, [changePageTitle, formatMessage]);
// Handle fetching the resource views.
const fetchResourceViews = useQuery(

View File

@@ -19,8 +19,9 @@ import Icon from 'components/Icon';
import { compose, saveInvoke } from 'utils';
import { useIsValuePassed } from 'hooks';
import LoadingIndicator from 'components/LoadingIndicator';
import { LoadingIndicator, Choose } from 'components';
import DataTable from 'components/DataTable';
import BillsEmptyStatus from './BillsEmptyStatus';
import withDialogActions from 'containers/Dialog/withDialogActions';
import withDashboardActions from 'containers/Dashboard/withDashboardActions';
@@ -30,11 +31,13 @@ import withBills from './withBills';
import withBillActions from './withBillActions';
import withCurrentView from 'containers/Views/withCurrentView';
// Bills transactions datatable.
function BillsDataTable({
//#withBills
// #withBills
billsCurrentPage,
billsLoading,
billsPageination,
billsCurrentViewId,
// #withDashboardActions
changeCurrentView,
@@ -215,23 +218,36 @@ function BillsDataTable({
[onSelectedRowsChange],
);
const showEmptyStatus = [
billsCurrentViewId === -1,
billsCurrentPage.length === 0,
].every(condition => condition === true);
return (
<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}
/>
<Choose>
<Choose.When condition={showEmptyStatus}>
<BillsEmptyStatus />
</Choose.When>
<Choose.Otherwise>
<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}
/>
</Choose.Otherwise>
</Choose>
</LoadingIndicator>
);
}
@@ -248,11 +264,13 @@ export default compose(
billsLoading,
billsPageination,
billsTableQuery,
billsCurrentViewId
}) => ({
billsCurrentPage,
billsLoading,
billsPageination,
billsTableQuery,
billsCurrentViewId
}),
),
withViewDetails(),

View File

@@ -0,0 +1,36 @@
import React from 'react';
import { Button, Intent } from '@blueprintjs/core';
import { useHistory } from 'react-router-dom';
import { EmptyStatus } from 'components';
export default function BillsEmptyStatus() {
const history = useHistory();
return (
<EmptyStatus
title={'Manage the organizations services and products.'}
description={
<p>
Here a list of your organization products and services, to be used when you create invoices or bills to your customers or vendors.
</p>
}
action={
<>
<Button
intent={Intent.PRIMARY}
large={true}
onClick={() => {
history.push('/bills/new');
}}
>
New bill
</Button>
<Button intent={Intent.NONE} large={true}>
Learn more
</Button>
</>
}
/>
);
}

View File

@@ -6,6 +6,7 @@ import {
getBillTableQueryFactory,
getVendorPayableBillsFactory,
getVendorPayableBillsEntriesFactory,
getBillsCurrentViewIdFactory,
} from 'store/Bills/bills.selectors';
export default (mapState) => {
@@ -14,12 +15,14 @@ export default (mapState) => {
const getBillTableQuery = getBillTableQueryFactory();
const getVendorPayableBills = getVendorPayableBillsFactory();
const getVendorPayableBillsEntries = getVendorPayableBillsEntriesFactory();
const getBillsCurrentViewId = getBillsCurrentViewIdFactory();
const mapStateToProps = (state, props) => {
const tableQuery = getBillTableQuery(state, props);
const mapped = {
billsCurrentPage: getBillsItems(state, props, tableQuery),
billsCurrentViewId: getBillsCurrentViewId(state),
billsViews: getResourceViews(state, props, 'bills'),
billsItems: state.bills.items,
billsTableQuery: tableQuery,
@@ -29,6 +32,7 @@ export default (mapState) => {
nextBillNumberChanged: state.bills.nextBillNumberChanged,
vendorPayableBills: getVendorPayableBills(state, props),
vendorPayableBillsEntries: getVendorPayableBillsEntries(state, props),
};
return mapState ? mapState(mapped, state, props) : mapped;
};

View File

@@ -15,8 +15,8 @@ import moment from 'moment';
import { compose, saveInvoke } from 'utils';
import { useIsValuePassed } from 'hooks';
import LoadingIndicator from 'components/LoadingIndicator';
import { DataTable, Money, Icon } from 'components';
import { DataTable, Money, Icon, Choose, LoadingIndicator } from 'components';
import PaymentMadesEmptyStatus from './PaymentMadesEmptyStatus';
import withPaymentMade from './withPaymentMade';
import withPaymentMadeActions from './withPaymentMadeActions';
@@ -31,6 +31,7 @@ function PaymentMadeDataTable({
paymentMadePageination,
paymentMadesLoading,
paymentMadeTableQuery,
paymentMadesCurrentViewId,
// #withPaymentMadeActions
addPaymentMadesTableQueries,
@@ -178,25 +179,38 @@ function PaymentMadeDataTable({
[onSelectedRowsChange],
);
const showEmptyStatuts = [
paymentMadeCurrentPage.length === 0,
paymentMadesCurrentViewId === -1,
].every(condition => condition === true);
return (
<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 loading={paymentMadesLoading && !isLoaded}>
<Choose>
<Choose.When condition={showEmptyStatuts}>
<PaymentMadesEmptyStatus />
</Choose.When>
<Choose.Otherwise>
<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}
/>
</Choose.Otherwise>
</Choose>
</LoadingIndicator>
);
}
@@ -211,11 +225,13 @@ export default compose(
paymentMadesLoading,
paymentMadePageination,
paymentMadeTableQuery,
paymentMadesCurrentViewId
}) => ({
paymentMadeCurrentPage,
paymentMadesLoading,
paymentMadePageination,
paymentMadeTableQuery,
paymentMadesCurrentViewId
}),
),
)(PaymentMadeDataTable);

View File

@@ -0,0 +1,37 @@
import React from 'react';
import { Button, Intent } from '@blueprintjs/core';
import { useHistory } from 'react-router-dom';
import { EmptyStatus } from 'components';
export default function PaymentMadesEmptyStatus() {
const history = useHistory();
return (
<EmptyStatus
title={'The organization does not have invoices, yet!'}
description={
<p>
It is a long established fact that a reader will be distracted by the
readable content of a page when looking at its layout.
</p>
}
action={
<>
<Button
intent={Intent.PRIMARY}
large={true}
onClick={() => {
history.push('/payment-made/new');
}}
>
New bill payment
</Button>
<Button intent={Intent.NONE} large={true}>
Learn more
</Button>
</>
}
/>
);
}

View File

@@ -1,20 +1,22 @@
import { connect } from 'react-redux';
import { getResourceViews } from 'store/customViews/customViews.selectors';
import {
getPaymentMadeCurrentPageFactory,
getPaymentMadePaginationMetaFactory,
getPaymentMadeTableQuery,
getPaymentMadeEntriesFactory
getPaymentMadeEntriesFactory,
getPaymentMadesCurrentViewIdFactory
} from 'store/PaymentMades/paymentMade.selector';
export default (mapState) => {
const getPyamentMadesItems = getPaymentMadeCurrentPageFactory();
const getPyamentMadesPaginationMeta = getPaymentMadePaginationMetaFactory();
const getPaymentMadeEntries = getPaymentMadeEntriesFactory();
const getPaymentMadesCurrentViewId = getPaymentMadesCurrentViewIdFactory();
const mapStateToProps = (state, props) => {
const query = getPaymentMadeTableQuery(state, props);
const mapped = {
paymentMadeCurrentPage: getPyamentMadesItems(state, props, query),
paymentMadeViews: getResourceViews(state, props, 'bill_payments'),
@@ -28,6 +30,8 @@ export default (mapState) => {
paymentMadesLoading: state.paymentMades.loading,
nextPaymentNumberChanged: state.paymentMades.nextPaymentNumberChanged,
paymentMadeEntries: getPaymentMadeEntries(state, props),
paymentMadesCurrentViewId: getPaymentMadesCurrentViewId(state, props),
};
return mapState ? mapState(mapped, state, props) : mapped;
};

View File

@@ -76,7 +76,6 @@ function EstimateViewTabs({
history.push('/custom_views/estimates/new');
};
console.log(estimateViews, 'estimateViews');
return (
<Navbar className={'navbar--dashboard-views'}>
<NavbarGroup align={Alignment.LEFT}>

View File

@@ -1,4 +1,4 @@
import React, { useEffect, useCallback, useState, useMemo } from 'react';
import React, { useCallback, useMemo } from 'react';
import {
Intent,
Button,
@@ -8,15 +8,17 @@ import {
MenuDivider,
Position,
} from '@blueprintjs/core';
import { withRouter } from 'react-router';
import classNames from 'classnames';
import { FormattedMessage as T, useIntl } from 'react-intl';
import moment from 'moment';
import { CLASSES } from 'common/classes';
import { compose, saveInvoke } from 'utils';
import { useIsValuePassed } from 'hooks';
import LoadingIndicator from 'components/LoadingIndicator';
import { DataTable, Money, Icon } from 'components';
import { DataTable, Money, Choose, Icon } from 'components';
import EstimatesEmptyStatus from './EstimatesEmptyStatus';
import withEstimates from './withEstimates';
import withEstimateActions from './withEstimateActions';
@@ -28,6 +30,7 @@ function EstimatesDataTable({
estimatesLoading,
estimatesPageination,
estimatesTableQuery,
estimatesCurrentViewId,
// #withEstimatesActions
addEstimatesTableQueries,
@@ -177,35 +180,57 @@ function EstimatesDataTable({
[onSelectedRowsChange],
);
const showEmptyStatus = [
estimatesCurrentPage.length === 0,
estimatesCurrentViewId === -1,
].every(d => d === true);
return (
<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>
<div className={classNames(CLASSES.DASHBOARD_DATATABLE)}>
<LoadingIndicator loading={estimatesLoading && !isLoaded} mount={false}>
<Choose>
<Choose.When condition={showEmptyStatus}>
<EstimatesEmptyStatus />
</Choose.When>
<Choose.Otherwise>
<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}
/>
</Choose.Otherwise>
</Choose>
</LoadingIndicator>
</div>
);
}
export default compose(
withEstimateActions,
withEstimates(
({ estimatesCurrentPage, estimatesLoading, estimatesPageination, estimatesTableQuery }) => ({
({
estimatesCurrentPage,
estimatesLoading,
estimatesPageination,
estimatesTableQuery
estimatesTableQuery,
estimatesCurrentViewId,
}) => ({
estimatesCurrentPage,
estimatesLoading,
estimatesPageination,
estimatesTableQuery,
estimatesCurrentViewId,
}),
),
)(EstimatesDataTable);

View File

@@ -0,0 +1,36 @@
import React from 'react';
import { Button, Intent } from '@blueprintjs/core';
import { useHistory } from 'react-router-dom';
import { EmptyStatus } from 'components';
export default function EstimatesEmptyStatus() {
const history = useHistory();
return (
<EmptyStatus
title={"It's time to send estimates to your customers."}
description={
<p>
It is a long established fact that a reader will be distracted by the
readable content of a page when looking at its layout.
</p>
}
action={
<>
<Button
intent={Intent.PRIMARY}
large={true}
onClick={() => {
history.push('/estimates/new');
}}
>
New sale estimate
</Button>
<Button intent={Intent.NONE} large={true}>
Learn more
</Button>
</>
}
/>
);
}

View File

@@ -4,18 +4,22 @@ import {
getEstimateCurrentPageFactory,
getEstimatesTableQueryFactory,
getEstimatesPaginationMetaFactory,
getEstimatesCurrentViewIdFactory,
} from 'store/Estimate/estimates.selectors';
export default (mapState) => {
const getEstimatesItems = getEstimateCurrentPageFactory();
const getEstimatesPaginationMeta = getEstimatesPaginationMetaFactory();
const getEstimatesTableQuery = getEstimatesTableQueryFactory();
const getEstimatesCurrentViewId = getEstimatesCurrentViewIdFactory();
const mapStateToProps = (state, props) => {
const query = getEstimatesTableQuery(state, props);
const mapped = {
estimatesCurrentPage: getEstimatesItems(state, props, query),
estimatesCurrentViewId: getEstimatesCurrentViewId(state, props),
estimateViews: getResourceViews(state, props, 'sales_estimates'),
estimateItems: state.salesEstimates.items,

View File

@@ -11,12 +11,15 @@ import {
import { withRouter } from 'react-router';
import { FormattedMessage as T, useIntl } from 'react-intl';
import moment from 'moment';
import classNames from 'classnames';
import { CLASSES } from 'common/classes';
import { compose, saveInvoke } from 'utils';
import { useIsValuePassed } from 'hooks';
import LoadingIndicator from 'components/LoadingIndicator';
import { DataTable, Money, Icon } from 'components';
import { LoadingIndicator, Choose, DataTable, Money, Icon } from 'components';
import InvoicesEmptyStatus from './InvoicesEmptyStatus';
import withDialogActions from 'containers/Dialog/withDialogActions';
import withDashboardActions from 'containers/Dashboard/withDashboardActions';
@@ -32,6 +35,7 @@ function InvoicesDataTable({
invoicesCurrentPage,
invoicesLoading,
invoicesPageination,
invoicesCurrentViewId,
// #withInvoicesActions
addInvoiceTableQueries,
@@ -186,29 +190,41 @@ function InvoicesDataTable({
[onSelectedRowsChange],
);
const showEmptyStatus = [
invoicesCurrentPage.length === 0,
invoicesCurrentViewId === -1,
].every((d) => d === true);
return (
<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>
<div className={classNames(CLASSES.DASHBOARD_DATATABLE)}>
<LoadingIndicator loading={invoicesLoading && !isLoadedBefore}>
<Choose>
<Choose.When condition={showEmptyStatus}>
<InvoicesEmptyStatus />
</Choose.When>
<Choose.Otherwise>
<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}
/>
</Choose.Otherwise>
</Choose>
</LoadingIndicator>
</div>
);
}
@@ -224,11 +240,13 @@ export default compose(
invoicesLoading,
invoicesPageination,
invoicesTableQuery,
invoicesCurrentViewId,
}) => ({
invoicesCurrentPage,
invoicesLoading,
invoicesPageination,
invoicesTableQuery,
invoicesCurrentViewId,
}),
),
withViewDetails(),

View File

@@ -0,0 +1,37 @@
import React from 'react';
import { Button, Intent } from '@blueprintjs/core';
import { useHistory } from 'react-router-dom';
import { EmptyStatus } from 'components';
export default function EstimatesEmptyStatus() {
const history = useHistory();
return (
<EmptyStatus
title={'The organization does not have invoices, yet!'}
description={
<p>
It is a long established fact that a reader will be distracted by the
readable content of a page when looking at its layout.
</p>
}
action={
<>
<Button
intent={Intent.PRIMARY}
large={true}
onClick={() => {
history.push('/invoices/new');
}}
>
New sale invoice
</Button>
<Button intent={Intent.NONE} large={true}>
Learn more
</Button>
</>
}
/>
);
}

View File

@@ -5,6 +5,7 @@ import {
getInvoicePaginationMetaFactory,
getInvoiceTableQueryFactory,
getCustomerReceivableInvoicesEntriesFactory,
getInvoicesCurrentViewIdFactory,
} from 'store/Invoice/invoices.selector';
export default (mapState) => {
@@ -15,11 +16,15 @@ export default (mapState) => {
const getCustomerReceivableInvoicesEntries = getCustomerReceivableInvoicesEntriesFactory();
const getInvoicesCurrentViewId = getInvoicesCurrentViewIdFactory();
const mapStateToProps = (state, props) => {
const query = getInvoiceTableQuery(state, props);
const mapped = {
invoicesCurrentPage: getInvoicesItems(state, props, query),
invoicesCurrentViewId: getInvoicesCurrentViewId(state, props),
invoicesViews: getResourceViews(state, props, 'sales_invoices'),
invoicesItems: state.salesInvoices.items,
invoicesTableQuery: query,

View File

@@ -15,8 +15,8 @@ import moment from 'moment';
import { compose, saveInvoke } from 'utils';
import { useIsValuePassed } from 'hooks';
import LoadingIndicator from 'components/LoadingIndicator';
import { DataTable, Money, Icon } from 'components';
import PaymentReceivesEmptyStatus from './PaymentReceivesEmptyStatus';
import { LoadingIndicator, DataTable, Choose, Money, Icon } from 'components';
import withDialogActions from 'containers/Dialog/withDialogActions';
import withDashboardActions from 'containers/Dashboard/withDashboardActions';
@@ -32,6 +32,7 @@ function PaymentReceivesDataTable({
paymentReceivesPageination,
paymentReceivesLoading,
paymentReceivesTableQuery,
paymentReceivesCurrentViewId,
// #withPaymentReceivesActions
addPaymentReceivesTableQueries,
@@ -179,28 +180,41 @@ function PaymentReceivesDataTable({
[actionMenuList, formatMessage],
);
const showEmptyStatus = [
paymentReceivesCurrentViewId === -1,
PaymentReceivesCurrentPage.length === 0,
].every(condition => condition === true);
return (
<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}
/>
<Choose>
<Choose.When condition={showEmptyStatus}>
<PaymentReceivesEmptyStatus />
</Choose.When>
<Choose.Otherwise>
<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}
/>
</Choose.Otherwise>
</Choose>
</LoadingIndicator>
);
}
@@ -216,12 +230,14 @@ export default compose(
PaymentReceivesCurrentPage,
paymentReceivesLoading,
paymentReceivesPageination,
paymentReceivesTableQuery
paymentReceivesTableQuery,
paymentReceivesCurrentViewId,
}) => ({
PaymentReceivesCurrentPage,
paymentReceivesLoading,
paymentReceivesPageination,
paymentReceivesTableQuery
paymentReceivesTableQuery,
paymentReceivesCurrentViewId,
}),
),
withViewDetails(),

View File

@@ -0,0 +1,37 @@
import React from 'react';
import { Button, Intent } from '@blueprintjs/core';
import { useHistory } from 'react-router-dom';
import { EmptyStatus } from 'components';
export default function PaymentReceivesEmptyStatus() {
const history = useHistory();
return (
<EmptyStatus
title={"The organization does't receive money, yet!"}
description={
<p>
It is a long established fact that a reader will be distracted by the
readable content of a page when looking at its layout.
</p>
}
action={
<>
<Button
intent={Intent.PRIMARY}
large={true}
onClick={() => {
history.push('/payment-receive/new');
}}
>
New payment receive
</Button>
<Button intent={Intent.NONE} large={true}>
Learn more
</Button>
</>
}
/>
);
}

View File

@@ -4,11 +4,14 @@ import {
getPaymentReceiveCurrentPageFactory,
getPaymentReceivePaginationMetaFactory,
getPaymentReceiveTableQuery,
getPaymentReceivesCurrentViewIdFactory,
} from 'store/PaymentReceive/paymentReceive.selector';
export default (mapState) => {
const getPyamentReceivesItems = getPaymentReceiveCurrentPageFactory();
const getPyamentReceivesPaginationMeta = getPaymentReceivePaginationMetaFactory();
const getPaymentReceivesCurrentViewId = getPaymentReceivesCurrentViewIdFactory();
const mapStateToProps = (state, props) => {
const query = getPaymentReceiveTableQuery(state, props);
const mapped = {
@@ -23,6 +26,7 @@ export default (mapState) => {
),
paymentReceivesLoading: state.paymentReceives.loading,
paymentReceiveNumberChanged: state.paymentReceives.journalNumberChanged,
paymentReceivesCurrentViewId: getPaymentReceivesCurrentViewId(state, props),
};
return mapState ? mapState(mapped, state, props) : mapped;
};

View File

@@ -15,7 +15,9 @@ import moment from 'moment';
import { compose, saveInvoke } from 'utils';
import { useIsValuePassed } from 'hooks';
import { LoadingIndicator, DataTable, Money, Icon } from 'components';
import { Choose, LoadingIndicator, DataTable, Money, Icon } from 'components';
import ReceiptsEmptyStatus from './ReceiptsEmptyStatus';
import withDialogActions from 'containers/Dialog/withDialogActions';
import withDashboardActions from 'containers/Dashboard/withDashboardActions';
@@ -24,16 +26,17 @@ import withReceipts from './withReceipts';
import withReceiptActions from './withReceiptActions';
function ReceiptsDataTable({
//#withReceipts
// #withReceipts
receiptsCurrentPage,
receiptsLoading,
receiptsPagination,
receiptTableQuery,
receiptsCurrentViewId,
// #withReceiptsActions
addReceiptsTableQueries,
// #Own Props
// #ownProps
loading,
onEditReceipt,
onDeleteReceipt,
@@ -186,28 +189,38 @@ function ReceiptsDataTable({
[onSelectedRowsChange],
);
const showEmptyStatus = [
receiptsCurrentViewId === -1,
receiptsCurrentPage.length === 0,
].every(condition => condition === true);
return (
<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 loading={receiptsLoading && !isLoadedBefore}>
<Choose>
<Choose.When condition={showEmptyStatus}>
<ReceiptsEmptyStatus />
</Choose.When>
<Choose.Otherwise>
<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}
/>
</Choose.Otherwise>
</Choose>
</LoadingIndicator>
);
}
@@ -223,11 +236,13 @@ export default compose(
receiptsLoading,
receiptsPagination,
receiptTableQuery,
receiptsCurrentViewId
}) => ({
receiptsCurrentPage,
receiptsLoading,
receiptsPagination,
receiptTableQuery,
receiptsCurrentViewId
}),
),
)(ReceiptsDataTable);

View File

@@ -0,0 +1,36 @@
import React from 'react';
import { Button, Intent } from '@blueprintjs/core';
import { useHistory } from 'react-router-dom';
import { EmptyStatus } from 'components';
export default function ReceiptsEmptyStatus() {
const history = useHistory();
return (
<EmptyStatus
title={'Manage the organizations services and products.'}
description={
<p>
Here a list of your organization products and services, to be used when you create invoices or bills to your customers or vendors.
</p>
}
action={
<>
<Button
intent={Intent.PRIMARY}
large={true}
onClick={() => {
history.push('/receipts/new');
}}
>
New receipt
</Button>
<Button intent={Intent.NONE} large={true}>
Learn more
</Button>
</>
}
/>
);
}

View File

@@ -4,12 +4,14 @@ import {
getReceiptCurrentPageFactory,
getReceiptsTableQueryFactory,
getReceiptsPaginationMetaFactory,
getReceiptsCurrentViewIdFactory
} from 'store/receipt/receipt.selector';
export default (mapState) => {
const getReceiptsItems = getReceiptCurrentPageFactory();
const getReceiptPaginationMeta = getReceiptsPaginationMetaFactory();
const getReceiptsTableQuery = getReceiptsTableQueryFactory();
const getReceiptsCurrentViewId = getReceiptsCurrentViewIdFactory();
const mapStateToProps = (state, props) => {
const tableQuery = getReceiptsTableQuery(state, props);
@@ -23,6 +25,8 @@ export default (mapState) => {
receiptsLoading: state.salesReceipts.loading,
receiptNumberChanged: state.salesReceipts.journalNumberChanged,
receiptsCurrentViewId: getReceiptsCurrentViewId(state, props),
};
return mapState ? mapState(mapped, state, props) : mapped;