fix: pdf templates server-side rendered

This commit is contained in:
Ahmed Bouhuolia
2024-09-30 11:15:05 +02:00
parent 863c7ad99f
commit 783387dce6
10 changed files with 46 additions and 42 deletions

View File

@@ -48,8 +48,8 @@ block head
box-sizing: border-box; box-sizing: border-box;
display: flex; display: flex;
flex-flow: wrap; flex-flow: wrap;
-webkit-box-align: center; -webkit-box-align: flex-start;
align-items: center; align-items: flex-start;
-webkit-box-pack: start; -webkit-box-pack: start;
justify-content: flex-start; justify-content: flex-start;
gap: 10px; gap: 10px;

View File

@@ -47,9 +47,7 @@ block head
box-sizing: border-box; box-sizing: border-box;
display: flex; display: flex;
flex-flow: wrap; flex-flow: wrap;
-webkit-box-align: center; align-items: flex-start;
align-items: center;
-webkit-box-pack: start;
justify-content: flex-start; justify-content: flex-start;
gap: 10px; gap: 10px;
margin-bottom: 24px; margin-bottom: 24px;

View File

@@ -48,9 +48,7 @@ block head
box-sizing: border-box; box-sizing: border-box;
display: flex; display: flex;
flex-flow: wrap; flex-flow: wrap;
-webkit-box-align: center; align-items: flex-start;
align-items: center;
-webkit-box-pack: start;
justify-content: flex-start; justify-content: flex-start;
gap: 10px; gap: 10px;
margin-bottom: 24px; margin-bottom: 24px;

View File

@@ -46,9 +46,7 @@ block head
box-sizing: border-box; box-sizing: border-box;
display: flex; display: flex;
flex-flow: wrap; flex-flow: wrap;
-webkit-box-align: center; align-items: flex-start;
align-items: center;
-webkit-box-pack: start;
justify-content: flex-start; justify-content: flex-start;
gap: 10px; gap: 10px;
margin-bottom: 24px; margin-bottom: 24px;

View File

@@ -46,8 +46,8 @@ block head
box-sizing: border-box; box-sizing: border-box;
display: flex; display: flex;
flex-flow: wrap; flex-flow: wrap;
-webkit-box-align: center; -webkit-box-align: flex-start;
align-items: center; align-items: flex-start;
-webkit-box-pack: start; -webkit-box-pack: start;
justify-content: flex-start; justify-content: flex-start;
gap: 10px; gap: 10px;

View File

@@ -179,14 +179,15 @@ export const defaultInvoicePdfTemplateAttributes = {
dateIssueLabel: 'Date of issue', dateIssueLabel: 'Date of issue',
showDateIssue: true, showDateIssue: true,
// dateIssue, // # Invoice number,
invoiceNumberLabel: 'Invoice number', invoiceNumberLabel: 'Invoice number',
showInvoiceNumber: true, showInvoiceNumber: true,
// Address // # Customer address
showCustomerAddress: true, showCustomerAddress: true,
customerAddress: '', customerAddress: '',
// # Company address
showCompanyAddress: true, showCompanyAddress: true,
companyAddress: '', companyAddress: '',
billedToLabel: 'Billed To', billedToLabel: 'Billed To',

View File

@@ -10,35 +10,36 @@ export class PaymentReceivedBrandingTemplate {
@Inject() @Inject()
private getPdfTemplateService: GetPdfTemplate; private getPdfTemplateService: GetPdfTemplate;
@Inject() @Inject()
private getOrgBrandingAttributes: GetOrganizationBrandingAttributes; private getOrgBrandingAttributes: GetOrganizationBrandingAttributes;
/** /**
* Retrieves the payment received pdf template. * Retrieves the payment received pdf template.
* @param {number} tenantId * @param {number} tenantId
* @param {number} paymentTemplateId * @param {number} paymentTemplateId
* @returns * @returns
*/ */
public async getPaymentReceivedPdfTemplate( public async getPaymentReceivedPdfTemplate(
tenantId: number, tenantId: number,
paymentTemplateId: number paymentTemplateId: number
) { ) {
const template = await this.getPdfTemplateService.getPdfTemplate( const template = await this.getPdfTemplateService.getPdfTemplate(
tenantId, tenantId,
paymentTemplateId paymentTemplateId
); );
// Retrieves the organization branding attributes. // Retrieves the organization branding attributes.
const commonOrgBrandingAttrs = this.getOrgBrandingAttributes.getOrganizationBrandingAttributes(tenantId); const commonOrgBrandingAttrs =
await this.getOrgBrandingAttributes.getOrganizationBrandingAttributes(
tenantId
);
// Merges the default branding attributes with common organization branding attrs.
const organizationBrandingAttrs = { const organizationBrandingAttrs = {
...defaultPaymentReceivedPdfTemplateAttributes, ...defaultPaymentReceivedPdfTemplateAttributes,
...commonOrgBrandingAttrs, ...commonOrgBrandingAttrs,
}; };
const attributes = mergePdfTemplateWithDefaultAttributes( const attributes = mergePdfTemplateWithDefaultAttributes(
template.attributes, template.attributes,
organizationBrandingAttrs organizationBrandingAttrs
); );
return { return {
...template, ...template,

View File

@@ -120,19 +120,18 @@ PaperTemplate.MutedText = () => {};
PaperTemplate.Text = () => {}; PaperTemplate.Text = () => {};
PaperTemplate.AddressesGroup = (props: GroupProps) => { PaperTemplate.AddressesGroup = (props: GroupProps) => {
return <Group spacing={10} {...props} className={styles.addressRoot} />;
};
PaperTemplate.Address = ({
children,
}: {
children: React.ReactNode;
}) => {
return ( return (
<Box> <Group
{children} spacing={10}
</Box> align={'flex-start'}
{...props}
className={styles.addressRoot}
/>
); );
}; };
PaperTemplate.Address = ({ children }: { children: React.ReactNode }) => {
return <Box>{children}</Box>;
};
PaperTemplate.Statement = ({ PaperTemplate.Statement = ({
label, label,

View File

@@ -14,17 +14,19 @@ export const initialValues = {
showPaymentReceivedNumber: true, showPaymentReceivedNumber: true,
paymentReceivedNumberLabel: 'Payment number', paymentReceivedNumberLabel: 'Payment number',
// Payment number
showPaymentReceivedDate: true, showPaymentReceivedDate: true,
paymentReceivedDateLabel: 'Date of Issue', paymentReceivedDateLabel: 'Date of Issue',
// Company name // Company name
companyName: 'Bigcapital Technology, Inc.', companyName: 'Bigcapital Technology, Inc.',
// Addresses // Customer address
showCustomerAddress: true,
showCompanyAddress: true, showCompanyAddress: true,
customerAddress: '',
companyAddress: '', companyAddress: '',
// Company address
showCustomerAddress: true,
billedToLabel: 'Billed To', billedToLabel: 'Billed To',
// Entries // Entries
@@ -33,10 +35,11 @@ export const initialValues = {
itemRateLabel: 'Rate', itemRateLabel: 'Rate',
itemTotalLabel: 'Total', itemTotalLabel: 'Total',
// Totals // Subtotal
showSubtotal: true, showSubtotal: true,
subtotalLabel: 'Subtotal', subtotalLabel: 'Subtotal',
// Total
showTotal: true, showTotal: true,
totalLabel: 'Total', totalLabel: 'Total',
}; };

View File

@@ -12,18 +12,23 @@ export interface PaymentReceivedCustomizeValues extends BrandingTemplateValues {
showInvoiceNumber?: boolean; showInvoiceNumber?: boolean;
invoiceNumberLabel?: string; invoiceNumberLabel?: string;
// # Issue date
showDateIssue?: boolean; showDateIssue?: boolean;
dateIssueLabel?: string; dateIssueLabel?: string;
// # Due date
showDueDate?: boolean; showDueDate?: boolean;
dueDateLabel?: string; dueDateLabel?: string;
// Company name // # Company name
companyName?: string; companyName?: string;
// Addresses // # Customer address
showBilledFromAddress?: boolean; showCustomerAddress?: boolean;
showBillingToAddress?: boolean;
// # Company address
showCompanyAddress?: boolean;
companyAddress?: string;
billedToLabel?: string; billedToLabel?: string;
// Entries // Entries
@@ -54,6 +59,7 @@ export interface PaymentReceivedCustomizeValues extends BrandingTemplateValues {
termsConditionsLabel?: string; termsConditionsLabel?: string;
showTermsConditions?: boolean; showTermsConditions?: boolean;
// # Statement
statementLabel?: string; statementLabel?: string;
showStatement?: boolean; showStatement?: boolean;
} }