feat: Pdf template address

This commit is contained in:
Ahmed Bouhuolia
2024-09-29 13:43:09 +02:00
parent 9b63c176cd
commit be2049ca6e
9 changed files with 122 additions and 169 deletions

View File

@@ -1,4 +1,4 @@
import { Stack } from '@/components';
import { Box, Stack } from '@/components';
import {
PaperTemplate,
PaperTemplateProps,
@@ -8,12 +8,14 @@ import {
DefaultPdfTemplateItemDescription,
DefaultPdfTemplateStatement,
DefaultPdfTemplateItemName,
DefaultPdfTemplateAddressBilledTo,
DefaultPdfTemplateAddressBilledFrom,
} from '@/constants/PdfTemplates';
export interface CreditNotePaperTemplateProps extends PaperTemplateProps {
// Address
billedToAddress?: Array<string>;
billedFromAddress?: Array<string>;
billedToAddress?: string;
billedFromAddress?: string;
showBilledToAddress?: boolean;
showBilledFromAddress?: boolean;
billedToLabel?: string;
@@ -70,23 +72,11 @@ export function CreditNotePaperTemplate({
companyName = 'Bigcapital Technology, Inc.',
// Address
billedToAddress = [
'Bigcapital Technology, Inc.',
'131 Continental Dr Suite 305 Newark,',
'Delaware 19713',
'United States',
'+1 762-339-5634',
'ahmed@bigcapital.app',
],
billedFromAddress = [
'131 Continental Dr Suite 305 Newark,',
'Delaware 19713',
'United States',
'+1 762-339-5634',
'ahmed@bigcapital.app',
],
showBilledToAddress = true,
billedToAddress = DefaultPdfTemplateAddressBilledTo,
billedFromAddress = DefaultPdfTemplateAddressBilledFrom,
showBilledFromAddress = true,
showBilledToAddress = true,
billedToLabel = 'Billed To',
// Total
@@ -152,14 +142,16 @@ export function CreditNotePaperTemplate({
<PaperTemplate.AddressesGroup>
{showBilledFromAddress && (
<PaperTemplate.Address
items={[<strong>{companyName}</strong>, ...billedFromAddress]}
/>
<PaperTemplate.Address>
<strong>{companyName}</strong>
<Box dangerouslySetInnerHTML={{ __html: billedFromAddress }} />
</PaperTemplate.Address>
)}
{showBilledToAddress && (
<PaperTemplate.Address
items={[<strong>{billedToLabel}</strong>, ...billedToAddress]}
/>
<PaperTemplate.Address>
<strong>{billedToLabel}</strong>
<Box dangerouslySetInnerHTML={{ __html: billedToAddress }} />
</PaperTemplate.Address>
)}
</PaperTemplate.AddressesGroup>

View File

@@ -1,4 +1,4 @@
import { Stack } from '@/components';
import { Box, Stack } from '@/components';
import {
PaperTemplate,
PaperTemplateProps,
@@ -8,6 +8,8 @@ import {
DefaultPdfTemplateItemDescription,
DefaultPdfTemplateStatement,
DefaultPdfTemplateItemName,
DefaultPdfTemplateAddressBilledTo,
DefaultPdfTemplateAddressBilledFrom,
} from '@/constants/PdfTemplates';
export interface EstimatePaperTemplateProps extends PaperTemplateProps {
@@ -31,10 +33,10 @@ export interface EstimatePaperTemplateProps extends PaperTemplateProps {
// Address
showBilledToAddress?: boolean;
billedToAddress?: Array<string>;
billedToAddress?: string;
showBilledFromAddress?: boolean;
billedFromAddress?: Array<string>;
billedFromAddress?: string;
billedToLabel?: string;
// Totals
@@ -74,25 +76,14 @@ export function EstimatePaperTemplate({
companyName,
billedToAddress = [
'Bigcapital Technology, Inc.',
'131 Continental Dr Suite 305 Newark,',
'Delaware 19713',
'United States',
'+1 762-339-5634',
'ahmed@bigcapital.app',
],
billedFromAddress = [
'131 Continental Dr Suite 305 Newark,',
'Delaware 19713',
'United States',
'+1 762-339-5634',
'ahmed@bigcapital.app',
],
// # Address
billedToAddress = DefaultPdfTemplateAddressBilledTo,
billedFromAddress = DefaultPdfTemplateAddressBilledFrom,
showBilledFromAddress = true,
showBilledToAddress = true,
billedToLabel = 'Billed To',
// #Total
total = '$1000.00',
totalLabel = 'Total',
showTotal = true,
@@ -101,10 +92,12 @@ export function EstimatePaperTemplate({
subtotalLabel = 'Subtotal',
showSubtotal = true,
// # Customer Note
showCustomerNote = true,
customerNote = DefaultPdfTemplateStatement,
customerNoteLabel = 'Customer Note',
// # Terms & Conditions
showTermsConditions = true,
termsConditions = DefaultPdfTemplateTerms,
termsConditionsLabel = 'Terms & Conditions',
@@ -145,13 +138,11 @@ export function EstimatePaperTemplate({
{estimateNumebr}
</PaperTemplate.TermsItem>
)}
{showEstimateDate && (
<PaperTemplate.TermsItem label={estimateDateLabel}>
{estimateDate}
</PaperTemplate.TermsItem>
)}
{showExpirationDate && (
<PaperTemplate.TermsItem label={expirationDateLabel}>
{expirationDate}
@@ -161,14 +152,16 @@ export function EstimatePaperTemplate({
<PaperTemplate.AddressesGroup>
{showBilledFromAddress && (
<PaperTemplate.Address
items={[<strong>{companyName}</strong>, ...billedFromAddress]}
/>
<PaperTemplate.Address>
<strong>{companyName}</strong>
<Box dangerouslySetInnerHTML={{ __html: billedFromAddress }} />
</PaperTemplate.Address>
)}
{showBilledToAddress && (
<PaperTemplate.Address
items={[<strong>{billedToLabel}</strong>, ...billedToAddress]}
/>
<PaperTemplate.Address>
<strong>{billedToLabel}</strong>
<Box dangerouslySetInnerHTML={{ __html: billedToAddress }} />
</PaperTemplate.Address>
)}
</PaperTemplate.AddressesGroup>

View File

@@ -1,11 +1,13 @@
import React from 'react';
import { PaperTemplate, PaperTemplateTotalBorder } from './PaperTemplate';
import { Stack } from '@/components';
import { Box, Stack } from '@/components';
import {
DefaultPdfTemplateTerms,
DefaultPdfTemplateItemDescription,
DefaultPdfTemplateStatement,
DefaultPdfTemplateItemName,
DefaultPdfTemplateAddressBilledTo,
DefaultPdfTemplateAddressBilledFrom,
} from '@/constants/PdfTemplates';
interface PapaerLine {
item?: string;
@@ -89,8 +91,8 @@ export interface InvoicePaperTemplateProps {
lines?: Array<PapaerLine>;
taxes?: Array<PaperTax>;
billedFromAddres?: Array<string | React.ReactNode>;
billedToAddress?: Array<string | React.ReactNode>;
billedFromAddres?: string;
billedToAddress?: string;
}
export function InvoicePaperTemplate({
@@ -169,21 +171,8 @@ export function InvoicePaperTemplate({
statementLabel = 'Statement',
showStatement = true,
statement = DefaultPdfTemplateStatement,
billedToAddress = [
'Bigcapital Technology, Inc.',
'131 Continental Dr Suite 305 Newark,',
'Delaware 19713',
'United States',
'+1 762-339-5634',
'ahmed@bigcapital.app',
],
billedFromAddres = [
'131 Continental Dr Suite 305 Newark,',
'Delaware 19713',
'United States',
'+1 762-339-5634',
'ahmed@bigcapital.app',
],
billedToAddress = DefaultPdfTemplateAddressBilledTo,
billedFromAddres = DefaultPdfTemplateAddressBilledFrom,
}: InvoicePaperTemplateProps) {
return (
<PaperTemplate
@@ -214,14 +203,16 @@ export function InvoicePaperTemplate({
<PaperTemplate.AddressesGroup>
{showBilledFromAddress && (
<PaperTemplate.Address
items={[<strong>{companyName}</strong>, ...billedFromAddres]}
/>
<PaperTemplate.Address>
<strong>{companyName}</strong>
<Box dangerouslySetInnerHTML={{ __html: billedFromAddres }} />
</PaperTemplate.Address>
)}
{showBillingToAddress && (
<PaperTemplate.Address
items={[<strong>{billedToLabel}</strong>, ...billedToAddress]}
/>
<PaperTemplate.Address>
<strong>{billedToLabel}</strong>
<Box dangerouslySetInnerHTML={{ __html: billedToAddress }} />
</PaperTemplate.Address>
)}
</PaperTemplate.AddressesGroup>

View File

@@ -1,7 +1,7 @@
import React from 'react';
import clsx from 'classnames';
import { get } from 'lodash';
import { Group, GroupProps, Stack } from '@/components';
import { Box, Group, GroupProps, Stack } from '@/components';
import styles from './InvoicePaperTemplate.module.scss';
export interface PaperTemplateProps {
@@ -123,16 +123,14 @@ PaperTemplate.AddressesGroup = (props: GroupProps) => {
return <Group spacing={10} {...props} className={styles.addressRoot} />;
};
PaperTemplate.Address = ({
items,
children,
}: {
items: Array<string | React.ReactNode>;
children: React.ReactNode;
}) => {
return (
<Stack spacing={0}>
{items.map((item, index) => (
<div key={index}>{item}</div>
))}
</Stack>
<Box>
{children}
</Box>
);
};

View File

@@ -1,15 +1,19 @@
import { Stack } from '@/components';
import { Box, Stack } from '@/components';
import {
PaperTemplate,
PaperTemplateProps,
PaperTemplateTotalBorder,
} from '../../Invoices/InvoiceCustomize/PaperTemplate';
import {
DefaultPdfTemplateAddressBilledFrom,
DefaultPdfTemplateAddressBilledTo,
} from '@/constants/PdfTemplates';
export interface PaymentReceivedPaperTemplateProps extends PaperTemplateProps {
billedToAddress?: Array<string>;
showBillingToAddress?: boolean;
billedToAddress?: string;
showBilledToAddress?: boolean;
billedFromAddress?: Array<string>;
billedFromAddress?: string;
showBilledFromAddress?: boolean;
billedToLabel?: string;
@@ -52,23 +56,10 @@ export function PaymentReceivedPaperTemplate({
// # Company name
companyName = 'Bigcapital Technology, Inc.',
billedToAddress = [
'Bigcapital Technology, Inc.',
'131 Continental Dr Suite 305 Newark,',
'Delaware 19713',
'United States',
'+1 762-339-5634',
'ahmed@bigcapital.app',
],
billedFromAddress = [
'131 Continental Dr Suite 305 Newark,',
'Delaware 19713',
'United States',
'+1 762-339-5634',
'ahmed@bigcapital.app',
],
billedToAddress = DefaultPdfTemplateAddressBilledTo,
billedFromAddress = DefaultPdfTemplateAddressBilledFrom,
showBilledFromAddress,
showBillingToAddress,
showBilledToAddress,
billedToLabel = 'Billed To',
total = '$1000.00',
@@ -119,14 +110,16 @@ export function PaymentReceivedPaperTemplate({
<PaperTemplate.AddressesGroup>
{showBilledFromAddress && (
<PaperTemplate.Address
items={[<strong>{companyName}</strong>, ...billedFromAddress]}
/>
<PaperTemplate.Address>
<strong>{companyName}</strong>
<Box dangerouslySetInnerHTML={{ __html: billedFromAddress }} />
</PaperTemplate.Address>
)}
{showBillingToAddress && (
<PaperTemplate.Address
items={[<strong>{billedToLabel}</strong>, ...billedToAddress]}
/>
{showBilledToAddress && (
<PaperTemplate.Address>
<strong>{billedToLabel}</strong>
<Box dangerouslySetInnerHTML={{ __html: billedToAddress }} />
</PaperTemplate.Address>
)}
</PaperTemplate.AddressesGroup>

View File

@@ -1,4 +1,4 @@
import { Stack } from '@/components';
import { Box, Stack } from '@/components';
import {
PaperTemplate,
PaperTemplateProps,
@@ -8,12 +8,14 @@ import {
DefaultPdfTemplateItemDescription,
DefaultPdfTemplateStatement,
DefaultPdfTemplateItemName,
DefaultPdfTemplateAddressBilledTo,
DefaultPdfTemplateAddressBilledFrom,
} from '@/constants/PdfTemplates';
export interface ReceiptPaperTemplateProps extends PaperTemplateProps {
// Addresses
billedToAddress?: Array<string>;
billedFromAddress?: Array<string>;
billedToAddress?: string;
billedFromAddress?: string;
showBilledFromAddress?: boolean;
showBilledToAddress?: boolean;
billedToLabel?: string;
@@ -71,21 +73,8 @@ export function ReceiptPaperTemplate({
companyName = 'Bigcapital Technology, Inc.',
// # Address
billedToAddress = [
'Bigcapital Technology, Inc.',
'131 Continental Dr Suite 305 Newark,',
'Delaware 19713',
'United States',
'+1 762-339-5634',
'ahmed@bigcapital.app',
],
billedFromAddress = [
'131 Continental Dr Suite 305 Newark,',
'Delaware 19713',
'United States',
'+1 762-339-5634',
'ahmed@bigcapital.app',
],
billedToAddress = DefaultPdfTemplateAddressBilledTo,
billedFromAddress = DefaultPdfTemplateAddressBilledFrom,
showBilledFromAddress = true,
showBilledToAddress = true,
billedToLabel = 'Billed To',
@@ -147,14 +136,16 @@ export function ReceiptPaperTemplate({
<PaperTemplate.AddressesGroup>
{showBilledFromAddress && (
<PaperTemplate.Address
items={[<strong>{companyName}</strong>, ...billedFromAddress]}
/>
<PaperTemplate.Address>
<strong>{companyName}</strong>
<Box dangerouslySetInnerHTML={{ __html: billedFromAddress }} />
</PaperTemplate.Address>
)}
{showBilledToAddress && (
<PaperTemplate.Address
items={[<strong>{billedToLabel}</strong>, ...billedToAddress]}
/>
<PaperTemplate.Address>
<strong>{billedToLabel}</strong>
<Box dangerouslySetInnerHTML={{ __html: billedToAddress }} />
</PaperTemplate.Address>
)}
</PaperTemplate.AddressesGroup>