QT/bigcapital
1
0
Fork 0
mirror of https://github.com/bigcapitalhq/bigcapital.git synced 2026-02-16 21:00:31 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: add payment trasnactions.

Browse Source
This commit is contained in:
elforjani13
2021-12-14 17:56:42 +02:00
parent ae7d37a0e0
commit 6aba694518
19 changed files with 448 additions and 382 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
src/containers/Drawers/BillDrawer/BillDrawerDetails.js
View File

@@ -19,11 +19,12 @@ import BillDrawerCls from 'style/components/Drawers/BillDrawer.module.scss';
export default function BillDrawerDetails() {
const {
data: { transactions },
billId,
} = useBillDrawerContext();
return (
<div className={clsx(BillDrawerCls.root)}>
<DrawerMainTabs defaultSelectedTabId="details">
<DrawerMainTabs renderActiveTabPanelOnly={true} defaultSelectedTabId="details">
<Tab
title={intl.get('details')}
id={'details'}
@@ -37,7 +38,7 @@ export default function BillDrawerDetails() {
<Tab
title={intl.get('payment_transactions')}
id={'payment_transactions'}
panel={<BillPaymentTransactionTable />}
panel={<BillPaymentTransactionTable billId={billId} />}
/>
<Tab
title={intl.get('located_landed_cost')}

19
src/containers/Drawers/BillDrawer/BillDrawerProvider.js
View File

@@ -5,7 +5,6 @@ import {
useBill,
useTransactionsByReference,
useBillLocatedLandedCost,
useBillPaymentTransactions,
} from 'hooks/query';
const BillDrawerContext = React.createContext();
@@ -34,31 +33,15 @@ function BillDrawerProvider({ billId, ...props }) {
enabled: !!billId,
});
// Handle fetch bill payment transaction.
const {
isLoading: isPaymentTransactionsLoading,
isFetching: isPaymentTransactionFetching,
data: paymentTransactions,
} = useBillPaymentTransactions(billId, {
enabled: !!billId,
});
//provider.
const provider = {
transactions,
billId,
data,
bill,
paymentTransactions,
isPaymentTransactionsLoading,
isPaymentTransactionFetching,
};
const loading =
isLandedCostLoading ||
isTransactionLoading ||
isPaymentTransactionsLoading ||
isBillLoading;
const loading = isLandedCostLoading || isTransactionLoading || isBillLoading;
return (
<DrawerLoading loading={loading}>

14
src/containers/Drawers/BillDrawer/BillPaymentTransactions/BillPaymentTransactionTable.js
View File

@@ -5,6 +5,7 @@ import 'style/pages/PaymentTransactions/List.scss';
import { useBillPaymentTransactionsColumns } from './components';
import { useBillDrawerContext } from '../BillDrawerProvider';
import { useBillPaymentTransactions } from 'hooks/query';
/**
* Bill payment transactions datatable.
@@ -12,11 +13,16 @@ import { useBillDrawerContext } from '../BillDrawerProvider';
export default function BillPaymentTransactionTable() {
const columns = useBillPaymentTransactionsColumns();
const { billId } = useBillDrawerContext();
// Handle fetch bill payment transaction.
const {
paymentTransactions,
isPaymentTransactionsLoading,
isPaymentTransactionFetching,
} = useBillDrawerContext();
isLoading: isPaymentTransactionsLoading,
isFetching: isPaymentTransactionFetching,
data: paymentTransactions,
} = useBillPaymentTransactions(billId, {
enabled: !!billId,
});
return (
<Card>

16
src/containers/Drawers/BillDrawer/BillPaymentTransactions/components.js
View File

@@ -14,17 +14,23 @@ export const useBillPaymentTransactionsColumns = () => {
{
id: 'date',
Header: intl.get('payment_date'),
accessor: 'date',
accessor: 'formatted_payment_date',
Cell: FormatDateCell,
width: 110,
className: 'date',
textOverview: true,
},
{
id: 'payment_account_name',
Header: intl.get('bill_transactions.column.deposit_account'),
accessor: 'payment_account_name',
width: 120,
textOverview: true,
},
{
id: 'amount',
Header: intl.get('amount'),
accessor: 'amount',
// accessor: 'formatted_amount',
accessor: 'formatted_payment_amount',
align: 'right',
width: 100,
className: clsx(CLASSES.FONT_BOLD),
@@ -40,9 +46,9 @@ export const useBillPaymentTransactionsColumns = () => {
{
id: 'reference',
Header: intl.get('reference_no'),
accessor: 'reference',
accessor: 'payment_reference_no',
width: 90,
className: 'reference',
className: 'payment_reference_no',
clickable: true,
textOverview: true,
},

5
src/containers/Drawers/InvoiceDetailDrawer/InvoiceDetail.js
View File

@@ -20,7 +20,10 @@ export default function InvoiceDetail() {
return (
<div className={clsx(InvoiceDrawerCls.invoice_details)}>
<DrawerMainTabs defaultSelectedTabId="details">
<DrawerMainTabs
renderActiveTabPanelOnly={true}
defaultSelectedTabId="details"
>
<Tab
title={intl.get('details')}
id={'details'}

18
src/containers/Drawers/InvoiceDetailDrawer/InvoiceDetailDrawerProvider.js
View File

@@ -29,30 +29,14 @@ function InvoiceDetailDrawerProvider({ invoiceId, ...props }) {
enabled: !!invoiceId,
});
// Fetch invoice payment transactions.
const {
data: paymentTransactions,
isFetching: isPaymentTransactionFetching,
isLoading: isPaymentTransactionLoading,
} = useInvoicePaymentTransactions(invoiceId, {
enabled: !!invoiceId,
});
//provider.
const provider = {
transactions,
paymentTransactions,
isPaymentTransactionLoading,
isPaymentTransactionFetching,
invoiceId,
invoice,
};
return (
<DrawerLoading
loading={
isTransactionLoading || isInvoiceLoading || isPaymentTransactionLoading
}
>
<DrawerLoading loading={isTransactionLoading || isInvoiceLoading}>
<DrawerHeaderContent
name="invoice-detail-drawer"
title={intl.get('invoice_details')}

16
src/containers/Drawers/InvoiceDetailDrawer/InvoicePaymentTransactions/InvoicePaymentTransactionsTable.js
View File

@@ -5,18 +5,24 @@ import 'style/pages/PaymentTransactions/List.scss';
import { useInvoicePaymentTransactionsColumns } from './components';
import { useInvoiceDetailDrawerContext } from '../InvoiceDetailDrawerProvider';
import { useInvoicePaymentTransactions } from 'hooks/query';
/**
* Invoice payment transactions datatable.
*/
export default function InvoicePaymentTransactionsTable() {
const columns = useInvoicePaymentTransactionsColumns();
const {
paymentTransactions,
isPaymentTransactionLoading,
isPaymentTransactionFetching,
} = useInvoiceDetailDrawerContext();
const { invoiceId } = useInvoiceDetailDrawerContext();
// Fetch invoice payment transactions.
const {
data: paymentTransactions,
isFetching: isPaymentTransactionFetching,
isLoading: isPaymentTransactionLoading,
} = useInvoicePaymentTransactions(invoiceId, {
enabled: !!invoiceId,
});
return (
<Card>
<DataTable

24
src/containers/Drawers/InvoiceDetailDrawer/InvoicePaymentTransactions/components.js
View File

@@ -14,35 +14,41 @@ export const useInvoicePaymentTransactionsColumns = () => {
{
id: 'date',
Header: intl.get('payment_date'),
accessor: 'date',
accessor: 'formatted_payment_date',
Cell: FormatDateCell,
width: 110,
className: 'date',
textOverview: true,
},
{
id: 'deposit_account_name',
Header: intl.get('invoice_transactions.column.withdrawal_account'),
accessor: 'deposit_account_name',
width: 120,
textOverview: true,
},
{
id: 'amount',
Header: intl.get('amount'),
accessor: 'amount',
// accessor: 'formatted_amount',
accessor: 'formatted_payment_amount',
align: 'right',
width: 120,
className: clsx(CLASSES.FONT_BOLD),
textOverview: true,
},
{
id: 'payment_receive_no.',
id: 'payment_number.',
Header: intl.get('payment_no'),
accessor: 'payment_receive_no',
accessor: 'payment_number',
width: 100,
className: 'payment_receive_no',
className: 'payment_number',
},
{
id: 'reference_no',
id: 'payment_reference_no',
Header: intl.get('reference_no'),
accessor: 'reference_no',
accessor: 'payment_reference_no',
width: 90,
className: 'reference_no',
className: 'payment_reference_no',
clickable: true,
textOverview: true,
},

1
src/containers/Drawers/ItemDetailDrawer/ItemContentDetails.js
View File

@@ -3,7 +3,6 @@ import React from 'react';
import ItemDetailActionsBar from './ItemDetailActionsBar';
import ItemDetailHeader from './ItemDetailHeader';
import { ItemPaymentTransactions } from './ItemPaymentTransactions';
import DashboardActionsBar from 'components/Dashboard/DashboardActionsBar';
import { Card } from 'components';

81
src/containers/Drawers/ItemDetailDrawer/ItemPaymentTransactions/BillPaymentTransactionsDataTable.js
View File

@@ -1,76 +1,35 @@
import React from 'react';
import intl from 'react-intl-universal';
import clsx from 'classnames';
import { CLASSES } from '../../../../common/classes';
import { DataTable, Card, FormatDateCell } from '../../../../components';
import { DataTable, Card } from '../../../../components';
import { useItemDetailDrawerContext } from '../ItemDetailDrawerProvider';
import { useItemAssociatedBillTransactions } from 'hooks/query';
import { useBillTransactionsColumns } from './components';
/**
* Bill payment transactions data table.
*/
export default function BillPaymentTransactions() {
const columns = React.useMemo(
() => [
{
id: 'bill_date',
Header: intl.get('date'),
accessor: 'bill_date',
Cell: FormatDateCell,
width: 110,
className: 'bill_date',
},
{
id: 'bill_number',
Header: intl.get('bill_number'),
accessor: (row) => (row.bill_number ? `${row.bill_number}` : null),
width: 100,
className: 'bill_number',
},
{
id: 'vendor',
Header: intl.get('vendor_name'),
accessor: 'vendor.display_name',
width: 180,
className: 'vendor',
},
{
id: 'reference_no',
Header: intl.get('reference_no'),
accessor: 'reference_no',
width: 90,
className: 'reference_no',
},
{
id: 'qunatity',
Header: 'Quantity Purchase',
},
{
id: 'rate',
Header: 'Rate',
},
{
id: 'total',
Header: intl.get('total'),
},
{
id: 'status',
Header: intl.get('status'),
// accessor: (row) => statusAccessor(row),
width: 160,
className: 'status',
},
],
[],
);
const columns = useBillTransactionsColumns();
const { itemId } = useItemDetailDrawerContext();
// Handle fetch Estimate associated transactions.
const {
isLoading: isBillTransactionsLoading,
isFetching: isBillTransactionFetching,
data: paymentTransactions,
} = useItemAssociatedBillTransactions(itemId, {
enabled: !!itemId,
});
return (
<div className="item-drawer__table">
<Card>
<DataTable
columns={columns}
data={[]}
// loading={}
// headerLoading={}
// progressBarLoading={}
data={paymentTransactions}
loading={isBillTransactionsLoading}
headerLoading={isBillTransactionsLoading}
progressBarLoading={isBillTransactionFetching}
/>
</Card>
</div>

76
src/containers/Drawers/ItemDetailDrawer/ItemPaymentTransactions/EstimatePaymentTransactionsDataTable.js
View File

@@ -1,71 +1,35 @@
import React from 'react';
import intl from 'react-intl-universal';
import clsx from 'classnames';
import { CLASSES } from '../../../../common/classes';
import { DataTable, Card, FormatDateCell } from '../../../../components';
import { DataTable, Card } from '../../../../components';
import { useItemDetailDrawerContext } from '../ItemDetailDrawerProvider';
import { useItemAssociatedEstimateTransactions } from 'hooks/query';
import { useEstimateTransactionsColumns } from './components';
/**
* Esimtate payment transactions datatable.
*/
export default function EstimatePaymentTransactions() {
const columns = React.useMemo(
() => [
{
id: 'estimate_date',
Header: intl.get('date'),
accessor: 'estimate_date',
Cell: FormatDateCell,
width: 110,
className: 'estimate_date',
textOverview: true,
},
{
id: 'estimate_number',
Header: intl.get('estimate_no'),
accessor: 'estimate_number',
width: 100,
className: 'estimate_number',
textOverview: true,
},
{
id: 'reference',
Header: intl.get('reference_no'),
accessor: 'reference',
width: 140,
className: 'reference',
},
{
id: 'customer_id',
Header: intl.get('customer_name'),
accessor: 'customer.display_name',
width: 140,
className: 'customer_id',
},
{
id: 'qunatity',
Header: 'Quantity Sold',
},
{
id: 'rate',
Header: 'Rate',
},
{
id: 'total',
Header: intl.get('total'),
},
],
[],
);
const columns = useEstimateTransactionsColumns();
const { itemId } = useItemDetailDrawerContext();
// Handle fetch Estimate associated transactions.
const {
isLoading: isEstimateTransactionsLoading,
isFetching: isEstimateTransactionFetching,
data: paymentTransactions,
} = useItemAssociatedEstimateTransactions(itemId, {
enabled: !!itemId,
});
return (
<div className="item-drawer__table">
<Card>
<DataTable
columns={columns}
data={[]}
// loading={}
// headerLoading={}
// progressBarLoading={}
data={paymentTransactions}
loading={isEstimateTransactionsLoading}
headerLoading={isEstimateTransactionsLoading}
progressBarLoading={isEstimateTransactionFetching}
/>
</Card>
</div>

86
src/containers/Drawers/ItemDetailDrawer/ItemPaymentTransactions/InvoicePaymentTransactionsDataTable.js
View File

@@ -1,81 +1,35 @@
import React from 'react';
import intl from 'react-intl-universal';
import clsx from 'classnames';
import { CLASSES } from '../../../../common/classes';
import { DataTable, Card, FormatDateCell } from '../../../../components';
import { DataTable, Card } from '../../../../components';
import { useItemAssociatedInvoiceTransactions } from 'hooks/query';
import { useItemDetailDrawerContext } from '../ItemDetailDrawerProvider';
import { useInvoicePaymentTransactionsColumns } from './components';
/**
* Invoice payment transactions datatable.
*/
export default function InvoicePaymentTransactionsTable() {
const columns = React.useMemo(
() => [
{
id: 'invoice_date',
Header: intl.get('date'),
accessor: 'invoice_date',
Cell: FormatDateCell,
width: 110,
className: 'invoice_date',
textOverview: true,
},
{
id: 'invoice_no',
Header: intl.get('invoice_no__'),
accessor: 'invoice_no',
width: 240,
className: 'invoice_no',
textOverview: true,
},
{
id: 'customer',
Header: intl.get('customer_name'),
accessor: 'customer.display_name',
width: 140,
className: 'customer_id',
clickable: true,
textOverview: true,
},
{
id: 'reference_no',
Header: intl.get('reference_no'),
accessor: 'reference_no',
width: 140,
className: 'reference_no',
textOverview: true,
},
{
id: 'qunatity',
Header: 'Quantity Sold',
},
{
id: 'rate',
Header: 'Rate',
},
{
id: 'total',
Header: intl.get('total'),
},
{
id: 'status',
Header: intl.get('status'),
// accessor: (row) => statusAccessor(row),
width: 160,
className: 'status',
},
],
[],
);
const columns = useInvoicePaymentTransactionsColumns();
const { itemId } = useItemDetailDrawerContext();
// Handle fetch invoice associated transactions.
const {
isLoading: isInvoiceTransactionsLoading,
isFetching: isInvoiceTransactionFetching,
data: paymentTransactions,
} = useItemAssociatedInvoiceTransactions(itemId, {
enabled: !!itemId,
});
return (
<div className="item-drawer__table">
<Card>
<DataTable
columns={columns}
data={[]}
// loading={}
// headerLoading={}
// progressBarLoading={}
data={paymentTransactions}
loading={isInvoiceTransactionsLoading}
headerLoading={isInvoiceTransactionsLoading}
progressBarLoading={isInvoiceTransactionFetching}
/>
</Card>
</div>

86
src/containers/Drawers/ItemDetailDrawer/ItemPaymentTransactions/ReceiptPaymentTransactionsDataTable.js
View File

@@ -1,81 +1,35 @@
import React from 'react';
import intl from 'react-intl-universal';
import clsx from 'classnames';
import { CLASSES } from '../../../../common/classes';
import { DataTable, Card, FormatDateCell } from '../../../../components';
import { DataTable, Card } from '../../../../components';
import { useItemDetailDrawerContext } from '../ItemDetailDrawerProvider';
import { useItemAssociatedReceiptTransactions } from 'hooks/query';
import { useReceiptTransactionsColumns } from './components';
/**
* Receipt payment transactions datatable.
*/
export default function ReceiptPaymentTransactions() {
const columns = React.useMemo(
() => [
{
id: 'receipt_date',
Header: intl.get('date'),
accessor: 'receipt_date',
Cell: FormatDateCell,
width: 110,
className: 'receipt_date',
textOverview: true,
},
{
id: 'receipt_number',
Header: intl.get('receipt_no'),
accessor: 'receipt_number',
width: 140,
className: 'receipt_number',
clickable: true,
textOverview: true,
},
{
id: 'customer',
Header: intl.get('customer_name'),
accessor: 'customer.display_name',
width: 140,
className: 'customer_id',
textOverview: true,
},
{
id: 'reference_no',
Header: intl.get('reference_no'),
accessor: 'reference_no',
width: 140,
className: 'reference_no',
textOverview: true,
},
{
id: 'status',
Header: intl.get('status'),
// accessor: StatusAccessor,
width: 140,
className: 'status',
},
{
id: 'qunatity',
Header: 'Quantity Sold',
},
{
id: 'rate',
Header: 'Rate',
},
{
id: 'total',
Header: intl.get('total'),
},
],
[],
);
const columns = useReceiptTransactionsColumns();
const { itemId } = useItemDetailDrawerContext();
// Handle fetch receipts associated transactions.
const {
isLoading: isReceiptTransactionsLoading,
isFetching: isReceiptTransactionFetching,
data: paymentTransactions,
} = useItemAssociatedReceiptTransactions(itemId, {
enabled: !!itemId,
});
return (
<div className="item-drawer__table">
<Card>
<DataTable
columns={columns}
data={[]}
// loading={}
// headerLoading={}
// progressBarLoading={}
data={paymentTransactions}
loading={isReceiptTransactionsLoading}
headerLoading={isReceiptTransactionsLoading}
progressBarLoading={isReceiptTransactionFetching}
/>
</Card>
</div>

237
src/containers/Drawers/ItemDetailDrawer/ItemPaymentTransactions/components.js Normal file
View File

@@ -0,0 +1,237 @@
import React from 'react';
import intl from 'react-intl-universal';
import clsx from 'classnames';
import { CLASSES } from '../../../../common/classes';
import { FormatDateCell } from '../../../../components';
/**
* Retrieve invoice payment transactions associated with item table columns.
*/
export const useInvoicePaymentTransactionsColumns = () => {
return React.useMemo(
() => [
{
id: 'invoice_date',
Header: intl.get('date'),
accessor: 'formatted_invoice_date',
Cell: FormatDateCell,
width: 140,
className: 'invoice_date',
textOverview: true,
},
{
id: 'invoice_no',
Header: intl.get('invoice_no__'),
accessor: 'invoice_number',
width: 120,
className: 'invoice_no',
textOverview: true,
},
// {
// id: 'reference_number',
// Header: intl.get('reference_no'),
// accessor: 'reference_number',
// width: 120,
// className: 'reference_number',
// textOverview: true,
// },
{
id: 'qunatity',
Header: 'Quantity Sold',
accessor: 'quantity',
width: 100,
},
{
id: 'rate',
Header: 'Rate',
accessor: 'formatted_rate',
align: 'right',
width: 100,
className: clsx(CLASSES.FONT_BOLD),
textOverview: true,
},
{
id: 'amount',
Header: intl.get('total'),
accessor: 'formatted_amount',
align: 'right',
width: 100,
className: clsx(CLASSES.FONT_BOLD),
textOverview: true,
},
],
[],
);
};
/**
* Retrieve estimate transactions associated with item table columns.
*/
export const useEstimateTransactionsColumns = () => {
return React.useMemo(
() => [
{
id: 'estimate_date',
Header: intl.get('date'),
accessor: 'formatted_estimate_date',
Cell: FormatDateCell,
width: 140,
className: 'estimate_date',
textOverview: true,
},
{
id: 'estimate_number',
Header: intl.get('estimate_no'),
accessor: 'estimate_number',
width: 120,
className: 'estimate_number',
textOverview: true,
},
{
id: 'qunatity',
Header: 'Quantity Sold',
accessor: 'quantity',
width: 100,
},
{
id: 'rate',
Header: 'Rate',
accessor: 'formatted_rate',
align: 'right',
width: 100,
className: clsx(CLASSES.FONT_BOLD),
textOverview: true,
},
{
id: 'amount',
Header: intl.get('total'),
accessor: 'formatted_amount',
align: 'right',
width: 100,
className: clsx(CLASSES.FONT_BOLD),
textOverview: true,
},
],
[],
);
};
/**
* Retrieve receipt transactions associated with item table columns.
*/
export const useReceiptTransactionsColumns = () => {
return React.useMemo(
() => [
{
id: 'receipt_date',
Header: intl.get('date'),
accessor: 'formatted_receipt_date',
Cell: FormatDateCell,
width: 110,
className: 'receipt_date',
textOverview: true,
},
{
id: 'receipt_number',
Header: intl.get('receipt_no'),
accessor: 'receip_number',
width: 140,
className: 'receipt_number',
clickable: true,
textOverview: true,
},
{
id: 'reference_number',
Header: intl.get('reference_no'),
accessor: 'reference_number',
width: 140,
className: 'reference_number',
textOverview: true,
},
{
id: 'qunatity',
Header: 'Quantity Sold',
accessor: 'quantity',
width: 100,
},
{
id: 'rate',
Header: 'Rate',
accessor: 'formatted_rate',
align: 'right',
width: 100,
className: clsx(CLASSES.FONT_BOLD),
textOverview: true,
},
{
id: 'amount',
Header: intl.get('total'),
accessor: 'formatted_amount',
align: 'right',
width: 100,
className: clsx(CLASSES.FONT_BOLD),
textOverview: true,
},
],
[],
);
};
/**
* Retrieve bill transactions associated with item table columns.
*/
export const useBillTransactionsColumns = () => {
return React.useMemo(
() => [
{
id: 'bill_date',
Header: intl.get('date'),
accessor: 'formatted_bill_date',
Cell: FormatDateCell,
width: 110,
className: 'bill_date',
},
{
id: 'bill_number',
Header: intl.get('bill_number'),
accessor: (row) => (row.bill_number ? `${row.bill_number}` : null),
width: 100,
className: 'bill_number',
},
{
id: 'reference_number',
Header: intl.get('reference_no'),
accessor: 'reference_number',
width: 140,
className: 'reference_number',
textOverview: true,
},
{
id: 'qunatity',
Header: 'Quantity Sold',
accessor: 'quantity',
width: 100,
},
{
id: 'rate',
Header: 'Rate',
accessor: 'formatted_rate',
align: 'right',
width: 100,
className: clsx(CLASSES.FONT_BOLD),
textOverview: true,
},
{
id: 'amount',
Header: intl.get('total'),
accessor: 'formatted_amount',
align: 'right',
width: 100,
className: clsx(CLASSES.FONT_BOLD),
textOverview: true,
},
],
[],
);
};

5
src/containers/Drawers/ItemDetailDrawer/ItemPaymentTransactions/index.js
View File

@@ -6,11 +6,9 @@ import EstimatePaymentTransactionsTable from './EstimatePaymentTransactionsDataT
import ReceiptPaymentTransactionsTable from './ReceiptPaymentTransactionsDataTable';
import BillPaymentTransactionsTable from './BillPaymentTransactionsDataTable';
import ItemSwitchMenuItem from './utils';
export const ItemPaymentTransactions = () => {
return (
<DrawerMainTabs>
<DrawerMainTabs renderActiveTabPanelOnly={true}>
<Tab
id={'invoice'}
title={<T id={'invoice'} />}
@@ -18,7 +16,6 @@ export const ItemPaymentTransactions = () => {
/>
<Tab
id={'estiamte'}
title={'Estimate'}
title={<T id={'estimate_'} />}
panel={<EstimatePaymentTransactionsTable />}
/>

59
src/containers/Drawers/ItemDetailDrawer/ItemPaymentTransactions/utils.js
View File

@@ -1,59 +0,0 @@
import React from 'react';
import intl from 'react-intl-universal';
import {
Popover,
Menu,
Position,
Button,
MenuItem,
Classes,
NavbarGroup,
PopoverInteractionKind,
} from '@blueprintjs/core';
import { Icon } from '../../../../components';
import { curry } from 'lodash/fp';
import { Select } from '@blueprintjs/select';
function ItemSwitchMenuItem({ onChange }) {
const Transaction = [
{ name: 'Invoice' },
{ name: 'Estimate' },
{ name: 'Bill' },
{ name: 'Receipt' },
];
const handleSwitchMenutItem = (item) => {
onChange && onChange(item);
};
const content = (
<Menu>
{Transaction.map((item) => (
<MenuItem
onClick={() => handleSwitchMenutItem(item.name)}
text={item.name}
/>
))}
</Menu>
);
return (
<Popover
content={content}
interactionKind={PopoverInteractionKind.CLICK}
position={Position.BOTTOM_LEFT}
modifiers={{
offset: { offset: '0, 4' },
}}
minimal={true}
>
<Button
minimal={true}
text="Select Service"
rightIcon={<Icon icon={'arrow-drop-down'} iconSize={24} />}
/>
</Popover>
);
}
export default ItemSwitchMenuItem;

59
src/hooks/query/items.js
View File

@@ -172,3 +172,62 @@ export function useItem(id, props) {
},
);
}
export function useItemAssociatedInvoiceTransactions(id, props) {
return useRequestQuery(
[t.ITEM_ASSOCIATED_WITH_INVOICES, id],
{
method: 'get',
url: `items/${id}/transactions/invoices`,
},
{
select: (res) => res.data.data,
defaultData: [],
...props,
},
);
}
export function useItemAssociatedEstimateTransactions(id, props) {
return useRequestQuery(
[t.ITEM_ASSOCIATED_WITH_ESTIMATES, id],
{
method: 'get',
url: `items/${id}/transactions/estimates`,
},
{
select: (res) => res.data.data,
defaultData: [],
...props,
},
);
}
export function useItemAssociatedReceiptTransactions(id, props) {
return useRequestQuery(
[t.ITEM_ASSOCIATED_WITH_RECEIPTS, id],
{
method: 'get',
url: `items/${id}/transactions/receipts`,
},
{
select: (res) => res.data.data,
defaultData: [],
...props,
},
);
}
export function useItemAssociatedBillTransactions(id, props) {
return useRequestQuery(
[t.ITEM_ASSOCIATED_WITH_BILLS, id],
{
method: 'get',
url: `items/${id}/transactions/bills`,
},
{
select: (res) => res.data.data,
defaultData: [],
...props,
},
);
}

4
src/hooks/query/types.js
View File

@@ -47,6 +47,10 @@ const ITEMS = {
ITEMS: 'ITEMS',
ITEM: 'ITEM',
ITEMS_CATEGORIES: 'ITEMS_CATEGORIES',
ITEM_ASSOCIATED_WITH_INVOICES: 'ITEM_ASSOCIATED_WITH_INVOICES',
ITEM_ASSOCIATED_WITH_ESTIMATES: 'ITEM_ASSOCIATED_WITH_ESTIMATES',
ITEM_ASSOCIATED_WITH_RECEIVES: 'ITEM_ASSOCIATED_WITH_RECEIPTS',
ITEM_ASSOCIATED_WITH_BILSS: 'ITEMS_ASSOCIATED_WITH_BILLS',
};
const SALE_ESTIMATES = {

19
src/lang/en/index.json
View File

@@ -1624,14 +1624,17 @@
"transactions_locking.lock_all_transactions_at_once": "Lock All Transactions At Once →",
"transactions_locking.lock_modules_individually": "Lock Modules Individually →",
"transactions_locking_lock_all_transactions_at_once": "Lock All Transactions At Once.",
"transactions_locking.lock": "Lock",
"transactions_locking.unlock": "Unlock",
"transactions_locking.full_unlock": "Full Unlock",
"transactions_locking.paetial_unlock": "Partial Unlock",
"transactions_locking.cancel_partial_unlock": "Cancel Partial Unlock",
"transactions_locking.lock": "Lock",
"transactions_locking.unlock": "Unlock",
"transactions_locking.full_unlock": "Full Unlock",
"transactions_locking.paetial_unlock": "Partial Unlock",
"transactions_locking.cancel_partial_unlock": "Cancel Partial Unlock",
"transactions_locking.of_the_module_locked_to": "Transactions of the module locked to <strong>{value}</strong>.",
"transactions_locking.lock_reason": "Lock Reason: <strong>{value}</strong>.",
"transactions_locking.partial_unlocked_from": "Partial unlocked from <strong>{fromDate}</strong> to <strong>{toDate}</strong>.",
"transactions_locking.unlock_reason":"<strong>Unlock Reason:</strong> {value}.",
"payment_transactions":"Payment transactions"
}
"transactions_locking.unlock_reason": "<strong>Unlock Reason:</strong> {value}.",
"payment_transactions": "Payment transactions",
"invoice_transactions.column.withdrawal_account": "Deposit account",
"bill_transactions.column.deposit_account": "Withdrawal account"
}