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

feat: add refund transactions.

Browse Source
This commit is contained in:
elforjani13
2021-12-05 19:30:52 +02:00
parent ab48e6092a
commit 2a48d9be51
24 changed files with 688 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/containers/Drawers/CreditNoteDetailDrawer/CreditNoteDetail.js
View File

@@ -4,6 +4,7 @@ import intl from 'react-intl-universal';
import { DrawerMainTabs } from 'components';
import CreditNoteDetailPanel from './CreditNoteDetailPanel';
import RefundCreditNoteTransactionsTable from './RefundCreditNoteTransactions/RefundCreditNoteTransactionsTable';
import clsx from 'classnames';
import CreditNoteDetailCls from '../../../style/components/Drawers/CreditNoteDetails.module.scss';
@@ -20,6 +21,11 @@ export default function CreditNoteDetail() {
id={'details'}
panel={<CreditNoteDetailPanel />}
/>
<Tab
title={intl.get('credit_note.drawer.label_refund_transactions')}
id={'refund_transactions'}
panel={<RefundCreditNoteTransactionsTable />}
/>
</DrawerMainTabs>
</div>
);

13
src/containers/Drawers/CreditNoteDetailDrawer/CreditNoteDetailActionsBar.js
View File

@@ -42,6 +42,10 @@ function CreditNoteDetailActionsBar({
closeDrawer('credit-note-detail-drawer');
};
const handleRefundCreditNote = () => {
openDialog('refund-credit-note', { creditNoteId });
};
// Handle delete credit note.
const handleDeleteCreditNote = () => {
openAlert('credit-note-delete', { creditNoteId });
@@ -57,6 +61,15 @@ function CreditNoteDetailActionsBar({
onClick={handleEditCreditNote}
/>
<NavbarDivider />
<Button
className={Classes.MINIMAL}
icon={<Icon icon="quick-payment-16" iconSize={16} />}
text={'Refund'}
// text={<T id={'add_payment'} />}
onClick={handleRefundCreditNote}
/>
<NavbarDivider />
<Button
className={Classes.MINIMAL}
icon={<Icon icon={'trash-16'} iconSize={16} />}

16
src/containers/Drawers/CreditNoteDetailDrawer/CreditNoteDetailDrawerProvider.js
View File

@@ -1,6 +1,6 @@
import React from 'react';
import intl from 'react-intl-universal';
import { useCreditNote } from 'hooks/query';
import { useCreditNote, useRefundCreditNote } from 'hooks/query';
import { DrawerHeaderContent, DrawerLoading } from 'components';
const CreditNoteDetailDrawerContext = React.createContext();
@@ -17,13 +17,25 @@ function CreditNoteDetailDrawerProvider({ creditNoteId, ...props }) {
},
);
// Handle fetch refund credit note.
const {
data: refundCreditNote,
isFetching: isRefundCreditNoteFetching,
isLoading: isRefundCreditNoteLoading,
} = useRefundCreditNote(creditNoteId, {
enabled: !!creditNoteId,
});
const provider = {
creditNote,
refundCreditNote,
isRefundCreditNoteLoading,
isRefundCreditNoteFetching,
creditNoteId,
};
return (
<DrawerLoading loading={isCreditNoteLoading}>
<DrawerLoading loading={isCreditNoteLoading || isRefundCreditNoteLoading}>
<DrawerHeaderContent
name="credit-note-detail-drawer"
title={intl.get('credit_note.drawer_credit_note_detail')}

48
src/containers/Drawers/CreditNoteDetailDrawer/RefundCreditNoteTransactions/RefundCreditNoteTransactionsTable.js Normal file
View File

@@ -0,0 +1,48 @@
import React from 'react';
import { DataTable, Card } from 'components';
import '../../../../style/pages/RefundCreditNote/List.scss';
import withAlertsActions from 'containers/Alert/withAlertActions';
import { useCreditNoteDetailDrawerContext } from '../CreditNoteDetailDrawerProvider';
import {
useRefundCreditTransactionsTableColumns,
ActionsMenu,
} from './components';
import { compose } from 'utils';
/**
* Refund credit note transactions table.
*/
function RefundCreditNoteTransactionsTable({
// #withAlertsActions
openAlert,
}) {
const { refundCreditNote } = useCreditNoteDetailDrawerContext();
const columns = useRefundCreditTransactionsTableColumns();
// Handle delete refund credit.
const handleDeleteRefundCreditNote = ({ id }) => {
openAlert('refund-credit-delete', { creditNoteId: id });
};
return (
<Card>
<DataTable
columns={columns}
data={refundCreditNote}
ContextMenu={ActionsMenu}
payload={{
onDelete: handleDeleteRefundCreditNote,
}}
className={'datatable--refund-transactions'}
/>
</Card>
);
}
export default compose(withAlertsActions)(RefundCreditNoteTransactionsTable);

59
src/containers/Drawers/CreditNoteDetailDrawer/RefundCreditNoteTransactions/components.js Normal file
View File

@@ -0,0 +1,59 @@
import React from 'react';
import { Intent, MenuItem, Menu } from '@blueprintjs/core';
import intl from 'react-intl-universal';
import { FormatDateCell, Icon } from 'components';
import { safeCallback } from 'utils';
/**
* Actions menu.
*/
export function ActionsMenu({ payload: { onDelete }, row: { original } }) {
return (
<Menu>
<MenuItem
icon={<Icon icon="trash-16" iconSize={16} />}
text={intl.get('delete_transaction')}
intent={Intent.DANGER}
onClick={safeCallback(onDelete, original)}
/>
</Menu>
);
}
export function useRefundCreditTransactionsTableColumns() {
return React.useMemo(
() => [
{
Header: intl.get('date'),
accessor: 'date',
Cell: FormatDateCell,
width: 100,
className: 'date',
},
{
Header: intl.get('refund_credit_transactions.column.amount_refunded'),
accessor: 'amount',
width: 100,
className: 'amount',
align: 'right',
},
{
Header: intl.get(
'refund_credit_transactions.column.withdrawal_account',
),
accessor: ({ from_account }) => from_account.name,
width: 100,
className: 'from_account',
},
{
id: 'reference_no',
Header: intl.get('reference_no'),
accessor: 'reference_no',
width: 100,
className: 'reference_no',
textOverview: true,
},
],
[],
);
}

46
src/containers/Drawers/VendorCreditDetailDrawer/RefundVendorCreditTransactions/RefundVendorCreditTransactionsTable.js Normal file
View File

@@ -0,0 +1,46 @@
import React from 'react';
import { DataTable, Card } from 'components';
import 'style/pages/RefundVendorCredit/List.scss';
import withAlertsActions from 'containers/Alert/withAlertActions';
import { useVendorCreditDetailDrawerContext } from '../VendorCreditDetailDrawerProvider';
import {
useRefundCreditTransactionsTableColumns,
ActionsMenu,
} from './components';
import { compose } from 'utils';
/**
* Refund vendor transactions table.
*/
function RefundVendorCreditTransactionsTable({
// #withAlertsActions
openAlert,
}) {
const { refundVendorCredit } = useVendorCreditDetailDrawerContext();
const columns = useRefundCreditTransactionsTableColumns();
// Handle delete refund vendor credit.
const handleDeleteRefundVendorCredit = ({ id }) => {
openAlert('refund-vendor-delete', { vendorCreditId: id });
};
return (
<Card>
<DataTable
columns={columns}
data={refundVendorCredit}
ContextMenu={ActionsMenu}
payload={{
onDelete: handleDeleteRefundVendorCredit,
}}
className={'datatable--refund-transactions'}
/>
</Card>
);
}
export default compose(withAlertsActions)(RefundVendorCreditTransactionsTable);

57
src/containers/Drawers/VendorCreditDetailDrawer/RefundVendorCreditTransactions/components.js Normal file
View File

@@ -0,0 +1,57 @@
import React from 'react';
import intl from 'react-intl-universal';
import { Intent, MenuItem, Menu } from '@blueprintjs/core';
import { FormatDateCell, Icon } from 'components';
import { safeCallback } from 'utils';
/**
* Actions menu.
*/
export function ActionsMenu({ payload: { onDelete }, row: { original } }) {
return (
<Menu>
<MenuItem
icon={<Icon icon="trash-16" iconSize={16} />}
text={intl.get('delete_transaction')}
intent={Intent.DANGER}
onClick={safeCallback(onDelete, original)}
/>
</Menu>
);
}
export function useRefundCreditTransactionsTableColumns() {
return React.useMemo(
() => [
{
Header: intl.get('date'),
accessor: 'date',
Cell: FormatDateCell,
width: 100,
className: 'date',
},
{
Header: intl.get('refund_vendor_credit.column.amount'),
accessor: 'amount',
width: 100,
className: 'amount',
align: 'right',
},
{
Header: intl.get('refund_vendor_credit.column.withdrawal_account'),
accessor: ({ from_account }) => from_account.name,
width: 100,
className: 'from_account',
},
{
id: 'reference_no',
Header: intl.get('reference_no'),
accessor: 'reference_no',
width: 100,
className: 'reference_no',
textOverview: true,
},
],
[],
);
}

6
src/containers/Drawers/VendorCreditDetailDrawer/VendorCreditDetail.js
View File

@@ -4,6 +4,7 @@ import intl from 'react-intl-universal';
import { DrawerMainTabs } from 'components';
import VendorCreditDetailPanel from './VendorCreditDetailPanel';
import RefundVendorCreditTransactionsTable from './RefundVendorCreditTransactions/RefundVendorCreditTransactionsTable';
import clsx from 'classnames';
import VendorCreditDetailCls from '../../../style/components/Drawers/VendorCreditDetail.module.scss';
@@ -20,6 +21,11 @@ export default function VendorCreditDetail() {
id={'details'}
panel={<VendorCreditDetailPanel />}
/>
<Tab
title={intl.get('credit_note.drawer.label_refund_transactions')}
id={'refund_transactions'}
panel={<RefundVendorCreditTransactionsTable />}
/>
</DrawerMainTabs>
</div>
);

11
src/containers/Drawers/VendorCreditDetailDrawer/VendorCreditDetailActionsBar.js
View File

@@ -42,6 +42,9 @@ function VendorCreditDetailActionsBar({
closeDrawer('vendor-credit-detail-drawer');
};
const handleRefundVendorCredit = () => {
openDialog('refund-vendor-credit', { vendorCreditId });
};
// Handle delete credit note.
const handleDeleteVendorCredit = () => {
openAlert('vendor-credit-delete', { vendorCreditId });
@@ -57,6 +60,14 @@ function VendorCreditDetailActionsBar({
onClick={handleEditVendorCredit}
/>
<NavbarDivider />
<Button
className={Classes.MINIMAL}
icon={<Icon icon="quick-payment-16" iconSize={16} />}
text={'Refund'}
// text={<T id={'add_payment'} />}
onClick={handleRefundVendorCredit}
/>
<NavbarDivider />
<Button
className={Classes.MINIMAL}
icon={<Icon icon={'trash-16'} iconSize={16} />}

18
src/containers/Drawers/VendorCreditDetailDrawer/VendorCreditDetailDrawerProvider.js
View File

@@ -1,6 +1,6 @@
import React from 'react';
import intl from 'react-intl-universal';
import { useVendorCredit } from 'hooks/query';
import { useVendorCredit, useRefundVendorCredit } from 'hooks/query';
import { DrawerHeaderContent, DrawerLoading } from 'components';
const VendorCreditDetailDrawerContext = React.createContext();
@@ -15,13 +15,27 @@ function VendorCreditDetailDrawerProvider({ vendorCreditId, ...props }) {
enabled: !!vendorCreditId,
});
// Handle fetch refund credit note.
const {
data: refundVendorCredit,
isFetching: isRefundVendorCreditFetching,
isLoading: isRefundVendorCreditLoading,
} = useRefundVendorCredit(vendorCreditId, {
enabled: !!vendorCreditId,
});
const provider = {
vendorCredit,
refundVendorCredit,
isRefundVendorCreditLoading,
isRefundVendorCreditFetching,
vendorCreditId,
};
return (
<DrawerLoading loading={isVendorCreditLoading}>
<DrawerLoading
loading={isVendorCreditLoading || isRefundVendorCreditLoading}
>
<DrawerHeaderContent
name="vendor-credit-detail-drawer"
title={intl.get('vendor_credit.drawer_vendor_credit_detail')}