mirror of
https://github.com/bigcapitalhq/bigcapital.git
synced 2026-02-17 13:20:31 +00:00
feat: Map the invoice preview data
This commit is contained in:
@@ -10,14 +10,11 @@ export default function PaymentPortalPage() {
|
||||
const { linkId } = useParams<{ linkId: string }>();
|
||||
|
||||
return (
|
||||
<>
|
||||
<BodyClassName className={styles.rootBodyPage}>
|
||||
<PaymentPortalBoot linkId={linkId}>
|
||||
<PaymentPortal />
|
||||
</PaymentPortalBoot>
|
||||
</BodyClassName>
|
||||
|
||||
<PaymentInvoicePreviewDrawer name={DRAWERS.PAYMENT_INVOICE_PREVIEW} />
|
||||
</>
|
||||
<BodyClassName className={styles.rootBodyPage}>
|
||||
<PaymentPortalBoot linkId={linkId}>
|
||||
<PaymentPortal />
|
||||
<PaymentInvoicePreviewDrawer name={DRAWERS.PAYMENT_INVOICE_PREVIEW} />
|
||||
</PaymentPortalBoot>
|
||||
</BodyClassName>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -1,15 +1,36 @@
|
||||
// @ts-nocheck
|
||||
import { Box, DrawerBody, DrawerHeaderContent } from '@/components';
|
||||
import { InvoicePaperTemplate } from '@/containers/Sales/Invoices/InvoiceCustomize/InvoicePaperTemplate';
|
||||
import { usePaymentPortalBoot } from '../../PaymentPortalBoot';
|
||||
|
||||
export function PaymentInvoicePreviewContent() {
|
||||
const { sharableLinkMeta } = usePaymentPortalBoot();
|
||||
|
||||
return (
|
||||
<>
|
||||
<DrawerHeaderContent title={'Invoice'} />
|
||||
|
||||
<DrawerBody>
|
||||
<Box style={{ paddingTop: 20, paddingBottom: 20 }}>
|
||||
<InvoicePaperTemplate />
|
||||
<InvoicePaperTemplate
|
||||
invoiceNumber={sharableLinkMeta?.invoiceNo}
|
||||
dueDate={sharableLinkMeta?.dueDateFormatted}
|
||||
dateIssue={sharableLinkMeta?.invoiceDateFormatted}
|
||||
total={sharableLinkMeta?.totalFormatted}
|
||||
subtotal={sharableLinkMeta?.subtotalFormatted}
|
||||
balanceDue={sharableLinkMeta?.dueAmountFormatted}
|
||||
paymentMade={sharableLinkMeta?.paymentAmountFormatted}
|
||||
termsConditions={sharableLinkMeta?.termsConditions}
|
||||
statement={sharableLinkMeta?.invoiceMessage}
|
||||
companyName={sharableLinkMeta?.companyName}
|
||||
lines={sharableLinkMeta?.entries?.map((entry) => ({
|
||||
item: entry.itemName,
|
||||
description: entry.description,
|
||||
quantity: entry.quantityFormatted,
|
||||
rate: entry.rateFormatted,
|
||||
total: entry.totalFormatted,
|
||||
}))}
|
||||
/>
|
||||
</Box>
|
||||
</DrawerBody>
|
||||
</>
|
||||
|
||||
@@ -1,10 +1,10 @@
|
||||
// @ts-nocheck
|
||||
import React from 'react';
|
||||
import * as R from 'ramda';
|
||||
import { Position } from '@blueprintjs/core';
|
||||
import { Drawer, DrawerSuspense } from '@/components';
|
||||
import withDrawers from '@/containers/Drawer/withDrawers';
|
||||
import { PaymentInvoicePreviewContent } from './PaymentInvoicePreviewContent';
|
||||
import { Position } from '@blueprintjs/core';
|
||||
|
||||
/**
|
||||
*
|
||||
|
||||
@@ -99,16 +99,16 @@ export function InvoicePaperTemplate({
|
||||
|
||||
dueDate = 'September 3, 2024',
|
||||
dueDateLabel = 'Date due',
|
||||
showDueDate,
|
||||
showDueDate = true,
|
||||
|
||||
dateIssue = 'September 3, 2024',
|
||||
dateIssueLabel = 'Date of issue',
|
||||
showDateIssue,
|
||||
showDateIssue = true,
|
||||
|
||||
// dateIssue,
|
||||
invoiceNumberLabel = 'Invoice number',
|
||||
invoiceNumber = '346D3D40-0001',
|
||||
showInvoiceNumber,
|
||||
showInvoiceNumber = true,
|
||||
|
||||
// Address
|
||||
showBillingToAddress = true,
|
||||
@@ -281,12 +281,12 @@ export function InvoicePaperTemplate({
|
||||
</Stack>
|
||||
|
||||
<Stack spacing={0}>
|
||||
{showTermsConditions && (
|
||||
{showTermsConditions && termsConditions && (
|
||||
<PaperTemplate.Statement label={termsConditionsLabel}>
|
||||
{termsConditions}
|
||||
</PaperTemplate.Statement>
|
||||
)}
|
||||
{showStatement && (
|
||||
{showStatement && statement && (
|
||||
<PaperTemplate.Statement label={statementLabel}>
|
||||
{statement}
|
||||
</PaperTemplate.Statement>
|
||||
|
||||
Reference in New Issue
Block a user