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

fix: pdf templates

Browse Source
This commit is contained in:
Ahmed Bouhuolia
2024-09-17 17:46:56 +02:00
parent 2c790427fa
commit bb0d91a9cb
11 changed files with 177 additions and 131 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
packages/server/resources/scss/base.css
View File

@@ -29,14 +29,12 @@ body{
line-height: 1.5; line-height: 1.5;
color: #000; color: #000;
background-color: #fff; background-color: #fff;
direction: ltr;
-webkit-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;
-webkit-tap-highlight-color: transparent; -webkit-tap-highlight-color: transparent;
}
body, h1, h2, h3, h4, h5, h6{
font-family: "Noto Sans", sans-serif; font-family: "Noto Sans", sans-serif;
font-optical-sizing: auto; font-optical-sizing: auto;
/* font-weight: <weight>; */
font-style: normal; font-style: normal;
/* font-variation-settings:
"wdth" 100; */
} }

45
packages/server/resources/views/modules/credit-note-standard.pug
View File

@@ -44,8 +44,7 @@ block head
.#{prefix}-terms-item__value { .#{prefix}-terms-item__value {
/* Styles for the term value */ /* Styles for the term value */
} }
.#{prefix}-address-section{
.#{prefix}-group {
box-sizing: border-box; box-sizing: border-box;
display: flex; display: flex;
flex-flow: wrap; flex-flow: wrap;
@@ -56,12 +55,9 @@ block head
gap: 10px; gap: 10px;
margin-bottom: 24px; margin-bottom: 24px;
} }
.#{prefix}-address-section > * {
flex: 1 1;
.#{prefix}-address {
/* Styles for each address block */
} }
.#{prefix}-table { .#{prefix}-table {
width: 100%; width: 100%;
border-collapse: collapse; border-collapse: collapse;
@@ -124,15 +120,12 @@ block head
flex: 1 1 auto; flex: 1 1 auto;
text-align: right; text-align: right;
} }
.#{prefix}-statement { .#{prefix}-statement {
/* Styles for customer note/terms statement section */ margin-bottom: 20px;
} }
.#{prefix}-statement__label { .#{prefix}-statement__label {
/* Styles for statement label */ color: #666;
} }
.#{prefix}-statement__value { .#{prefix}-statement__value {
/* Styles for statement value */ /* Styles for statement value */
} }
@@ -156,7 +149,7 @@ block content
div(class=`${prefix}-terms-item__label`) #{creditNoteDateLabel}: div(class=`${prefix}-terms-item__label`) #{creditNoteDateLabel}:
div(class=`${prefix}-terms-item__value`) #{creditNoteDate} div(class=`${prefix}-terms-item__value`) #{creditNoteDate}
div(class=`${prefix}-group`) div(class=`${prefix}-address-section`)
if showBilledFromAddress if showBilledFromAddress
div(class=`${prefix}-address`) div(class=`${prefix}-address`)
strong #{companyName} strong #{companyName}
@@ -169,30 +162,30 @@ block content
div #{address} div #{address}
table(class=`${prefix}-table`) table(class=`${prefix}-table`)
thead(class=`${prefix}-table__header`) thead
tr tr
th #{'Item'} th(class=`${prefix}-table__header`) #{'Item'}
th #{'Description'} th(class=`${prefix}-table__header`) #{'Description'}
th #{'Rate'} th(class=`${prefix}-table__header`) #{'Rate'}
th #{'Total'} th(class=`${prefix}-table__header`) #{'Total'}
tbody tbody
each line in lines each line in lines
tr(class=`${prefix}-table__row`) tr(class=`${prefix}-table__row`)
td #{line.item} td(class=`${prefix}-table__cell`) #{line.item}
td #{line.description} td(class=`${prefix}-table__cell`) #{line.description}
td(class=`${prefix}-table__column--right`) #{line.rate} td(class=`${prefix}-table__cell--right`) #{line.rate}
td(class=`${prefix}-table__column--right`) #{line.total} td(class=`${prefix}-table__cell--right`) #{line.total}
div(class=`${prefix}-totals`) div(class=`${prefix}-totals`)
if showSubtotal if showSubtotal
div(class=`${prefix}-totals__item ${prefix}-totals__item--border-gray`) div(class=`${prefix}-totals__item ${prefix}-totals__item--border-gray`)
div #{subtotalLabel}: div(class=`${prefix}-totals__item-label`) #{subtotallabel}
div #{subtotal} div(class=`${prefix}-totals__item-amount`) #{subtotal}
if showTotal if showTotal
div(class=`${prefix}-totals__item ${prefix}-totals__item--border-dark`) div(class=`${prefix}-totals__item ${prefix}-totals__item--border-dark`)
div #{totalLabel}: div(class=`${prefix}-totals__item-amount`) #{totalLabel}:
div #{total} div(class=`${prefix}-totals__item-label`) #{total}
if showCustomerNote if showCustomerNote
div(class=`${prefix}-statement`) div(class=`${prefix}-statement`)

19
packages/server/resources/views/modules/estimate-regular.pug
View File

@@ -26,7 +26,7 @@ block head
top: 26px; top: 26px;
overflow: hidden; overflow: hidden;
} }
.#{prefix}-terms-list { .#{prefix}-terms {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 4px; gap: 4px;
@@ -43,7 +43,7 @@ block head
} }
.#{prefix}-terms-item__value { .#{prefix}-terms-item__value {
} }
.#{prefix}-address-section{ .#{prefix}-addresses{
box-sizing: border-box; box-sizing: border-box;
display: flex; display: flex;
flex-flow: wrap; flex-flow: wrap;
@@ -54,6 +54,9 @@ block head
gap: 10px; gap: 10px;
margin-bottom: 24px; margin-bottom: 24px;
} }
.#{prefix}-addresses > * {
flex: 1 1;
}
.#{prefix}-address { .#{prefix}-address {
} }
.#{prefix}-address__item { .#{prefix}-address__item {
@@ -120,8 +123,10 @@ block head
text-align: right; text-align: right;
} }
.#{prefix}-statement { .#{prefix}-statement {
margin-bottom: 20px;
} }
.#{prefix}-statement__label { .#{prefix}-statement__label {
color: #666;
} }
.#{prefix}-statement__value { .#{prefix}-statement__value {
} }
@@ -150,7 +155,7 @@ block content
div(class=`${prefix}-terms-item__value`) #{expirationDate} div(class=`${prefix}-terms-item__value`) #{expirationDate}
//- Addresses (Group section) //- Addresses (Group section)
div(class=`${prefix}-address-section`) div(class=`${prefix}-addresses`)
if showBilledFromAddress if showBilledFromAddress
div(class=`${prefix}-address`) div(class=`${prefix}-address`)
strong #{companyName} strong #{companyName}
@@ -182,21 +187,21 @@ block content
//- Totals section //- Totals section
div(class=`${prefix}-totals`) div(class=`${prefix}-totals`)
if showSubtotal if showSubtotal
div(class=`${prefix}-totals__item`) div(class=`${prefix}-totals__item ${prefix}-totals__item--border-gray`)
div(class=`${prefix}-totals__item-label`) #{subtotalLabel} div(class=`${prefix}-totals__item-label`) #{subtotalLabel}
div(class=`${prefix}-totals__item-amount`) #{subtotal} div(class=`${prefix}-totals__item-amount`) #{subtotal}
if showTotal if showTotal
div(class=`${prefix}-totals__item`) div(class=`${prefix}-totals__item ${prefix}-totals__item--border-dark ${prefix}-totals__item--font-weight-bold`)
div(class=`${prefix}-totals__item-label`) #{totalLabel} div(class=`${prefix}-totals__item-label`) #{totalLabel}
div(class=`${prefix}-totals__item-amount`) #{total} div(class=`${prefix}-totals__item-amount`) #{total}
//- Statements section //- Statements section
if showCustomerNote if showCustomerNote && customerNote
div(class=`${prefix}-statement`) div(class=`${prefix}-statement`)
div(class=`${prefix}-statement__label`) #{customerNoteLabel} div(class=`${prefix}-statement__label`) #{customerNoteLabel}
div(class=`${prefix}-statement__value`) #{customerNote} div(class=`${prefix}-statement__value`) #{customerNote}
if showTermsConditions if showTermsConditions && termsConditions
div(class=`${prefix}-statement`) div(class=`${prefix}-statement`)
div(class=`${prefix}-statement__label`) #{termsConditionsLabel} div(class=`${prefix}-statement__label`) #{termsConditionsLabel}
div(class=`${prefix}-statement__value`) #{termsConditions} div(class=`${prefix}-statement__value`) #{termsConditions}

4
packages/server/resources/views/modules/invoice-standard.pug
View File

@@ -229,13 +229,13 @@ block content
div(class=`${prefix}-totals__item-amount`) #{balanceDue} div(class=`${prefix}-totals__item-amount`) #{balanceDue}
//- Footer section //- Footer section
if showTermsConditions if showTermsConditions && termsConditions
div(class=`${prefix}-paragraph`) div(class=`${prefix}-paragraph`)
if termsConditionsLabel if termsConditionsLabel
div(class=`${prefix}-paragraph__label`) #{termsConditionsLabel} div(class=`${prefix}-paragraph__label`) #{termsConditionsLabel}
div(class=`${prefix}-paragraph__value`) #{termsConditions} div(class=`${prefix}-paragraph__value`) #{termsConditions}
if showStatement if showStatement && statement
div(class=`${prefix}-paragraph`) div(class=`${prefix}-paragraph`)
if statementLabel if statementLabel
div(class=`${prefix}-paragraph__label`) #{statementLabel} div(class=`${prefix}-paragraph__label`) #{statementLabel}

13
packages/server/resources/views/modules/payment-receive-standard.pug
View File

@@ -41,9 +41,6 @@ block head
.#{prefix}-terms-item__label{ .#{prefix}-terms-item__label{
min-width: 120px; min-width: 120px;
color: #333; color: #333;
}
.#{prefix}-group{
} }
.#{prefix}-addresses{ .#{prefix}-addresses{
box-sizing: border-box; box-sizing: border-box;
@@ -95,12 +92,6 @@ block head
} }
.#{prefix}-table__cell--right { .#{prefix}-table__cell--right {
text-align: right; text-align: right;
}
.#{prefix}-table__column{
}
.#{prefix}-table__column--right{
} }
.#{prefix}-totals { .#{prefix}-totals {
display: flex; display: flex;
@@ -177,11 +168,11 @@ block content
div(class=`${prefix}-totals`) div(class=`${prefix}-totals`)
if showSubtotal if showSubtotal
div(class=`${prefix}-totals__item`) div(class=`${prefix}-totals__item ${prefix}-totals__item--gray-border`)
div(class=`${prefix}-totals__item-label`) #{subtotalLabel} div(class=`${prefix}-totals__item-label`) #{subtotalLabel}
div(class=`${prefix}-totals__item-amount`) #{subtotal} div(class=`${prefix}-totals__item-amount`) #{subtotal}
if showTotal if showTotal
div(class=`${prefix}-totals__item`) div(class=`${prefix}-totals__item ${prefix}-totals__item--dark-border`)
div(class=`${prefix}-totals__item-label`) #{totalLabel} div(class=`${prefix}-totals__item-label`) #{totalLabel}
div(class=`${prefix}-totals__item-amount`) #{total} div(class=`${prefix}-totals__item-amount`) #{total}

50
packages/server/resources/views/modules/receipt-regular.pug
View File

@@ -4,21 +4,13 @@ block head
- var prefix = 'bc' - var prefix = 'bc'
style. style.
.#{prefix}-root { .#{prefix}-root {
color: #111; color: #000;
padding: 24px 30px; padding: 24px 30px;
font-size: 12px; font-size: 12px;
position: relative; position: relative;
box-shadow: inset 0 4px 0px 0 var(--invoice-primary-color); box-shadow: inset 0 4px 0px 0 var(--invoice-primary-color);
} }
.#{prefix}-logo-wrap { .#{prefix}-logo-wrap {
font-size: 60px;
margin: 0;
line-height: 1;
margin-bottom: 25px;
font-weight: 500;
color: #333;
}
.#{prefix}-big-title {
height: 120px; height: 120px;
width: 120px; width: 120px;
position: absolute; position: absolute;
@@ -26,6 +18,14 @@ block head
top: 26px; top: 26px;
overflow: hidden; overflow: hidden;
} }
.#{prefix}-big-title {
font-size: 60px;
margin: 0;
line-height: 1;
margin-bottom: 25px;
font-weight: 500;
color: #333;
}
.#{prefix}-terms-list { .#{prefix}-terms-list {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@@ -53,6 +53,9 @@ block head
gap: 10px; gap: 10px;
margin-bottom: 24px; margin-bottom: 24px;
} }
.#{prefix}-address-section > * {
flex: 1 1 auto;
}
.#{prefix}-address {} .#{prefix}-address {}
.#{prefix}-table { .#{prefix}-table {
width: 100%; width: 100%;
@@ -99,8 +102,12 @@ block head
display: flex; display: flex;
padding: 4px 0; padding: 4px 0;
} }
.#{prefix}-totals__line--gray-border {} .#{prefix}-totals__line--gray-border {
.#{prefix}-totals__line--dark-border {} border-bottom: 1px solid #DADADA;
}
.#{prefix}-totals__line--dark-border {
border-bottom: 1px solid #000;
}
.#{prefix}-totals__line__label { .#{prefix}-totals__line__label {
min-width: 160px; min-width: 160px;
} }
@@ -161,30 +168,31 @@ block content
tbody tbody
each line in lines each line in lines
tr(class=`${prefix}-table__row`) tr(class=`${prefix}-table__row`)
td(class=`${prefix}-table__column`)= line.item td(class=`${prefix}-table__cell`)= line.item
td(class=`${prefix}-table__column`)= line.description td(class=`${prefix}-table__cell`)= line.description
td(class=`${prefix}-table__column ${prefix}-table__column--right`)= line.rate td(class=`${prefix}-table__cell${prefix}-table__cell--right`)= line.rate
td(class=`${prefix}-table__column ${prefix}-table__column--right`)= line.total td(class=`${prefix}-table__cell${prefix}-table__cell--right`)= line.total
//- Totals Section //- Totals Section
div(class=`${prefix}-totals`) div(class=`${prefix}-totals`)
if showSubtotal if showSubtotal
div(class=`${prefix}-totals__line #{prefix}-totals__line--gray-border`) div(class=`${prefix}-totals__line ${prefix}-totals__line--gray-border`)
span(class=`${prefix}-totals__line__label`)= subtotalLabel span(class=`${prefix}-totals__line__label`)= subtotalLabel
span(class=`${prefix}-totals__line__amount`)= subtotal span(class=`${prefix}-totals__line__amount`)= subtotal
if showTotal if showTotal
div(class=`${prefix}-totals__line #{prefix}-totals__line--dark-border`) div(class=`${prefix}-totals__line ${prefix}-totals__line--dark-border`)
span(class=`${prefix}-totals__line__label`)= totalLabel span(class=`${prefix}-totals__line__label`)= totalLabel
span(class=`${prefix}-totals__line__amount`)= total span(class=`${prefix}-totals__line__amount`)= total
//- Customer Note Section //- Customer Note Section
if showCustomerNote if showCustomerNote
div(class=`${prefix}-statement`) div(class=`${prefix}-statement`)
span(class=`${prefix}-statement__label`)= customerNoteLabel div(class=`${prefix}-statement__label`)= customerNoteLabel
p(class=`${prefix}-statement__value`)= customerNote div(class=`${prefix}-statement__value`)= customerNote
//- Terms & Conditions Section //- Terms & Conditions Section
if showTermsConditions if showTermsConditions
div(class=`${prefix}-statement`) div(class=`${prefix}-statement`)
span(class=`${prefix}-statement__label`)= termsConditionsLabel div(class=`${prefix}-statement__label`)= termsConditionsLabel
p(class=`${prefix}-statement__value`)= termsConditions div(class=`${prefix}-statement__value`)= termsConditions

2
packages/server/src/interfaces/CreditNote.ts
View File

@@ -62,6 +62,8 @@ export interface ICreditNote {
branchId?: number; branchId?: number;
warehouseId: number; warehouseId: number;
createdAt?: Date; createdAt?: Date;
termsConditions: string;
note: string;
} }
export enum CreditNoteAction { export enum CreditNoteAction {

70
packages/server/src/interfaces/PaymentReceive.ts
View File

@@ -203,53 +203,35 @@ export interface PaymentReceivedPdfTax {
export interface PaymentReceivedPdfTemplateAttributes { export interface PaymentReceivedPdfTemplateAttributes {
primaryColor: string; primaryColor: string;
secondaryColor: string; secondaryColor: string;
companyName: string;
showCompanyLogo: boolean; showCompanyLogo: boolean;
companyLogo: string; companyLogo: string;
companyName: string;
dueDateLabel: string;
showDueDate: boolean;
dateIssueLabel: string;
showDateIssue: boolean;
invoiceNumberLabel: string;
showInvoiceNumber: boolean;
showBillingToAddress: boolean;
showBilledFromAddress: boolean;
billedToLabel: string;
lineItemLabel: string;
lineDescriptionLabel: string;
lineRateLabel: string;
lineTotalLabel: string;
totalLabel: string;
subtotalLabel: string;
discountLabel: string;
paymentMadeLabel: string;
balanceDueLabel: string;
showTotal: boolean;
showSubtotal: boolean;
showDiscount: boolean;
showTaxes: boolean;
showPaymentMade: boolean;
showDueAmount: boolean;
showBalanceDue: boolean;
discount: string;
termsConditionsLabel: string;
showTermsConditions: boolean;
lines: PaymentReceivedPdfLineItem[];
taxes: PaymentReceivedPdfTax[];
statementLabel: string;
showStatement: boolean;
billedToAddress: string[]; billedToAddress: string[];
billedFromAddress: string[]; billedFromAddress: string[];
showBilledFromAddress: boolean;
showBillingToAddress: boolean;
billedToLabel: string;
total: string;
totalLabel: string;
showTotal: boolean;
subtotal: string;
subtotalLabel: string;
showSubtotal: boolean;
lines: Array<{
invoiceNumber: string;
invoiceAmount: string;
paidAmount: string;
}>;
showPaymentReceivedNumber: boolean;
paymentReceivedNumberLabel: string;
paymentReceivedNumebr: string;
paymentReceivedDate: string;
showPaymentReceivedDate: boolean;
paymentReceivedDateLabel: string;
} }

54
packages/server/src/interfaces/SaleReceipt.ts
View File

@@ -155,3 +155,57 @@ export interface ISaleReceiptMailPresend {
saleReceiptId: number; saleReceiptId: number;
messageOptions: SaleReceiptMailOptsDTO; messageOptions: SaleReceiptMailOptsDTO;
} }
export interface ISaleReceiptBrandingTemplateAttributes {
primaryColor: string;
secondaryColor: string;
showCompanyLogo: boolean;
companyLogo: string;
companyName: string;
// Address
billedToAddress: string[];
billedFromAddress: string[];
showBilledFromAddress: boolean;
showBilledToAddress: boolean;
billedToLabel: string;
// Total
total: string;
totalLabel: string;
showTotal: boolean;
// Subtotal
subtotal: string;
subtotalLabel: string;
showSubtotal: boolean;
// Customer Note
showCustomerNote: boolean;
customerNote: string;
customerNoteLabel: string;
// Terms & Conditions
showTermsConditions: boolean;
termsConditions: string;
termsConditionsLabel: string;
// Lines
lines: Array<{
item: string;
description: string;
rate: string;
quantity: string;
total: string;
}>;
// Receipt Number
showReceiptNumber: boolean;
receiptNumberLabel: string;
receiptNumebr: string;
// Receipt Date
receiptDate: string;
showReceiptDate: boolean;
receiptDateLabel: string;
}

24
packages/server/src/services/CreditNotes/utils.ts
View File

@@ -1,9 +1,23 @@
import { CreditNotePdfTemplateAttributes } from "@/interfaces"; import { CreditNotePdfTemplateAttributes, ICreditNote } from '@/interfaces';
import CreditNote from "@/models/CreditNote";
export const transformCreditNoteToPdfTemplate = (
export const transformCreditNoteToPdfTemplate = (creditNote: CreditNote): Partial<CreditNotePdfTemplateAttributes> { creditNote: ICreditNote
): Partial<CreditNotePdfTemplateAttributes> => {
return { return {
creditNoteDate: creditNote.formattedCreditNoteDate,
creditNoteNumebr: creditNote.creditNoteNumber,
total: creditNote.formattedAmount,
subtotal: creditNote.formattedSubtotal,
lines: creditNote.entries?.map((entry) => ({
item: entry.item.name,
description: entry.description,
rate: entry.rateFormatted,
quantity: entry.quantityFormatted,
total: entry.totalFormatted,
})),
customerNote: creditNote.note,
termsConditions: creditNote.termsConditions,
}; };
} };

21
packages/webapp/src/containers/Sales/Receipts/ReceiptForm/ReceiptFormProvider.tsx
View File

@@ -136,19 +136,18 @@ function ReceiptFormProvider({ receiptId, ...props }) {
// Branding templates // Branding templates
brandingTemplates, brandingTemplates,
isBrandingTemplatesLoading isBrandingTemplatesLoading,
}; };
const isLoading =
isReceiptLoading ||
isAccountsLoading ||
isCustomersLoading ||
isItemsLoading ||
isSettingLoading ||
isBrandingTemplatesLoading;
return ( return (
<DashboardInsider <DashboardInsider loading={isLoading} name={'receipt-form'}>
loading={
isReceiptLoading ||
isAccountsLoading ||
isCustomersLoading ||
isItemsLoading ||
isSettingLoading
}
name={'receipt-form'}
>
<ReceiptFormContext.Provider value={provider} {...props} /> <ReceiptFormContext.Provider value={provider} {...props} />
</DashboardInsider> </DashboardInsider>
); );