mirror of
https://github.com/bigcapitalhq/bigcapital.git
synced 2026-02-18 13:50:31 +00:00
feat: add payment transaction & style
This commit is contained in:
@@ -8,7 +8,7 @@ import { DrawerMainTabs } from 'components';
|
||||
import BillDetailTab from './BillDetailTab';
|
||||
import LocatedLandedCostTable from './LocatedLandedCostTable';
|
||||
import JournalEntriesTable from '../../JournalEntriesTable/JournalEntriesTable';
|
||||
import BillPaymentTransactionTable from './BillPaymentTransactionTable';
|
||||
import BillPaymentTransactionTable from './BillPaymentTransactions/BillPaymentTransactionTable';
|
||||
import { useBillDrawerContext } from './BillDrawerProvider';
|
||||
|
||||
import BillDrawerCls from 'style/components/Drawers/BillDrawer.module.scss';
|
||||
|
||||
@@ -1,8 +1,10 @@
|
||||
import React from 'react';
|
||||
import { DataTable, Card } from 'components';
|
||||
|
||||
import { useBillPaymentTransactionsColumns } from './utils';
|
||||
import { useBillDrawerContext } from './BillDrawerProvider';
|
||||
import 'style/pages/PaymentTransactions/List.scss';
|
||||
|
||||
import { useBillPaymentTransactionsColumns } from './components';
|
||||
import { useBillDrawerContext } from '../BillDrawerProvider';
|
||||
|
||||
/**
|
||||
* Bill payment transactions datatable.
|
||||
@@ -24,6 +26,7 @@ export default function BillPaymentTransactionTable() {
|
||||
loading={isPaymentTransactionsLoading}
|
||||
headerLoading={isPaymentTransactionsLoading}
|
||||
progressBarLoading={isPaymentTransactionFetching}
|
||||
className={'payment-transactions'}
|
||||
/>
|
||||
</Card>
|
||||
);
|
||||
@@ -0,0 +1,52 @@
|
||||
import React from 'react';
|
||||
import intl from 'react-intl-universal';
|
||||
|
||||
import clsx from 'classnames';
|
||||
import { CLASSES } from '../../../../common/classes';
|
||||
import { FormatDateCell } from '../../../../components';
|
||||
|
||||
/**
|
||||
* Retrieve bill payment transactions table columns.
|
||||
*/
|
||||
export const useBillPaymentTransactionsColumns = () => {
|
||||
return React.useMemo(
|
||||
() => [
|
||||
{
|
||||
id: 'date',
|
||||
Header: intl.get('payment_date'),
|
||||
accessor: 'date',
|
||||
Cell: FormatDateCell,
|
||||
width: 110,
|
||||
className: 'date',
|
||||
textOverview: true,
|
||||
},
|
||||
{
|
||||
id: 'amount',
|
||||
Header: intl.get('amount'),
|
||||
accessor: 'amount',
|
||||
// accessor: 'formatted_amount',
|
||||
align: 'right',
|
||||
width: 100,
|
||||
className: clsx(CLASSES.FONT_BOLD),
|
||||
textOverview: true,
|
||||
},
|
||||
{
|
||||
id: 'payment_number',
|
||||
Header: intl.get('payment_no'),
|
||||
accessor: 'payment_number',
|
||||
width: 100,
|
||||
className: 'payment_number',
|
||||
},
|
||||
{
|
||||
id: 'reference',
|
||||
Header: intl.get('reference_no'),
|
||||
accessor: 'reference',
|
||||
width: 90,
|
||||
className: 'reference',
|
||||
clickable: true,
|
||||
textOverview: true,
|
||||
},
|
||||
],
|
||||
[],
|
||||
);
|
||||
};
|
||||
@@ -1,9 +1,7 @@
|
||||
import React from 'react';
|
||||
import intl from 'react-intl-universal';
|
||||
|
||||
import clsx from 'classnames';
|
||||
import { CLASSES } from '../../../common/classes';
|
||||
import { FormatNumberCell, FormatDateCell } from '../../../components';
|
||||
import { FormatNumberCell } from '../../../components';
|
||||
|
||||
/**
|
||||
* Retrieve bill readonly details entries table columns.
|
||||
@@ -51,49 +49,3 @@ export const useBillReadonlyEntriesTableColumns = () =>
|
||||
],
|
||||
[],
|
||||
);
|
||||
|
||||
/**
|
||||
* Retrieve bill payment transactions table columns.
|
||||
*/
|
||||
export const useBillPaymentTransactionsColumns = () => {
|
||||
return React.useMemo(
|
||||
() => [
|
||||
{
|
||||
id: 'date',
|
||||
Header: intl.get('payment_date'),
|
||||
accessor: 'date',
|
||||
Cell: FormatDateCell,
|
||||
width: 110,
|
||||
className: 'date',
|
||||
textOverview: true,
|
||||
},
|
||||
{
|
||||
id: 'amount',
|
||||
Header: intl.get('amount'),
|
||||
accessor: 'amount',
|
||||
// accessor: 'formatted_amount',
|
||||
align: 'right',
|
||||
width: 100,
|
||||
className: clsx(CLASSES.FONT_BOLD),
|
||||
textOverview: true,
|
||||
},
|
||||
{
|
||||
id: 'payment_number',
|
||||
Header: intl.get('payment_no'),
|
||||
accessor: 'payment_number',
|
||||
width: 100,
|
||||
className: 'payment_number',
|
||||
},
|
||||
{
|
||||
id: 'reference',
|
||||
Header: intl.get('reference_no'),
|
||||
accessor: 'reference',
|
||||
width: 90,
|
||||
className: 'reference',
|
||||
clickable: true,
|
||||
textOverview: true,
|
||||
},
|
||||
],
|
||||
[],
|
||||
);
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user