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

feat: Paper template reusable

Browse Source
This commit is contained in:
Ahmed Bouhuolia
2024-09-10 18:37:38 +02:00
parent 317adfa0de
commit 77a1e35ff4
9 changed files with 777 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
packages/webapp/src/containers/Sales/Estimates/EstimateCustomize/EstimateCustomizeContent.tsx
View File

@@ -4,6 +4,7 @@ import { Classes } from '@blueprintjs/core';
import { ElementCustomize } from '../../../ElementCustomize/ElementCustomize';
import { EstimateCustomizeGeneralField } from './EstimateCustomizeFieldsGeneral';
import { EstimateCustomizeContentFields } from './EstimateCustomizeFieldsContent';
import { EstimatePaperTemplate } from './EstimatePaperTemplate';
import { EstimateCustomizeValues } from './types';
import { initialValues } from './constants';
@@ -16,9 +17,9 @@ export default function EstimateCustomizeContent() {
initialValues={initialValues}
onSubmit={handleFormSubmit}
>
{/* <ElementCustomize.PaperTemplate>
<InvoicePaperTemplate />
</ElementCustomize.PaperTemplate> */}
<ElementCustomize.PaperTemplate>
<EstimatePaperTemplate />
</ElementCustomize.PaperTemplate>
<ElementCustomize.FieldsTab id={'general'} label={'General'}>
<EstimateCustomizeGeneralField />

175
packages/webapp/src/containers/Sales/Estimates/EstimateCustomize/EstimatePaperTemplate.tsx Normal file
View File

@@ -0,0 +1,175 @@
import { Group, Stack } from '@/components';
import { PaperTemplate, PaperTemplateProps } from '../../Invoices/InvoiceCustomize/PaperTemplate';
export interface EstimatePaperTemplateProps extends PaperTemplateProps {
billedToAddress?: Array<string>;
billedFromAddress?: Array<string>;
total?: string;
showTotal?: boolean;
totalLabel?: string;
subtotal?: string;
showSubtotal?: boolean;
subtotalLabel?: string;
showCustomerNote?: boolean;
customerNote?: string;
customerNoteLabel?: string;
showTermsConditions?: boolean;
termsConditions?: string;
termsConditionsLabel?: string;
lines?: Array<{
item: string;
description: string;
rate: string;
quantity: string;
total: string;
}>;
expirationDate?: string;
showExpirationDate?: boolean;
expirationDateLabel?: string;
estimateDateLabel?: string;
showEstimateDate?: boolean;
estimateDate?: string;
estimateNumebr?: string;
estimateNumberLabel?: string;
showEstimateNumber?: boolean;
}
export function EstimatePaperTemplate({
primaryColor,
secondaryColor,
showCompanyLogo = true,
companyLogo,
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',
],
total = '$1000.00',
totalLabel = 'Total',
showTotal = true,
subtotal = '1000/00',
subtotalLabel = 'Subtotal',
showSubtotal = true,
showCustomerNote = true,
customerNote = 'It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout.',
customerNoteLabel = 'Customer Note',
showTermsConditions = true,
termsConditions = 'It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout.',
termsConditionsLabel = 'Terms & Conditions',
lines = [
{
item: 'Simply dummy text',
description: 'Simply dummy text of the printing and typesetting',
rate: '1',
quantity: '1000',
total: '$1000.00',
},
],
showEstimateNumber = true,
estimateNumberLabel = 'Estimate Number',
estimateNumebr = '346D3D40-0001',
estimateDate = 'September 3, 2024',
showEstimateDate = true,
estimateDateLabel = 'Estimate Date',
expirationDateLabel = 'Expiration Date',
showExpirationDate = true,
expirationDate = 'September 3, 2024',
}: EstimatePaperTemplateProps) {
return (
<PaperTemplate
primaryColor={primaryColor}
secondaryColor={secondaryColor}
showCompanyLogo={showCompanyLogo}
companyLogo={companyLogo}
bigtitle={'Estimate'}
>
<Stack spacing={24}>
<PaperTemplate.TermsList>
{showEstimateNumber && (
<PaperTemplate.TermsItem label={estimateNumberLabel}>
{estimateNumebr}
</PaperTemplate.TermsItem>
)}
{showEstimateDate && (
<PaperTemplate.TermsItem label={estimateDateLabel}>
{estimateDate}
</PaperTemplate.TermsItem>
)}
{showExpirationDate && (
<PaperTemplate.TermsItem label={expirationDateLabel}>
{expirationDate}
</PaperTemplate.TermsItem>
)}
</PaperTemplate.TermsList>
<Group spacing={10}>
<PaperTemplate.Address items={billedToAddress} />
<PaperTemplate.Address items={billedFromAddress} />
</Group>
<Stack spacing={0}>
<PaperTemplate.Table
columns={[
{ label: 'Item', accessor: 'item' },
{ label: 'Description', accessor: 'item' },
{ label: 'Rate', accessor: 'rate' },
{ label: 'Total', accessor: 'total' },
]}
data={lines}
/>
<PaperTemplate.Totals>
{showSubtotal && (
<PaperTemplate.TotalLine
label={subtotalLabel}
amount={subtotal}
/>
)}
{showTotal && (
<PaperTemplate.TotalLine label={totalLabel} amount={total} />
)}
</PaperTemplate.Totals>
</Stack>
<Stack spacing={0}>
{showCustomerNote && (
<PaperTemplate.Statement label={customerNoteLabel}>
{customerNote}
</PaperTemplate.Statement>
)}
{showTermsConditions && (
<PaperTemplate.Statement label={termsConditionsLabel}>
{termsConditions}
</PaperTemplate.Statement>
)}
</Stack>
</Stack>
</PaperTemplate>
);
}