From 145e9424f8eb0b30b92fd1b0d6b336cef90c726f Mon Sep 17 00:00:00 2001 From: Srinath Date: Tue, 3 Mar 2026 19:58:41 +0530 Subject: [PATCH] Implement dynamic header and table color functionality --- .../PurchasePrintTemplate/PurPrintStyleA4.jsx | 249 ++++++++++-------- 1 file changed, 134 insertions(+), 115 deletions(-) diff --git a/src/Pages/PurchaseQuotation/PurchasePrintTemplate/PurPrintStyleA4.jsx b/src/Pages/PurchaseQuotation/PurchasePrintTemplate/PurPrintStyleA4.jsx index fda981a..febd14f 100644 --- a/src/Pages/PurchaseQuotation/PurchasePrintTemplate/PurPrintStyleA4.jsx +++ b/src/Pages/PurchaseQuotation/PurchasePrintTemplate/PurPrintStyleA4.jsx @@ -7,7 +7,22 @@ import { printDiv } from "../../../Services/Others"; import '../../../Styles/BookingScreen/PrintTemplates/A4/PrintA4Style11.scss' import { useSelector } from 'react-redux'; -import { GloabalFieldDetails, GlobalBillName, Globalnotes, GlobalprintAmount, GlobalprintDiscount, GlobalprintHsnCode, GlobalprintItem, GlobalprintMRP, GlobalprintQrcodet, GlobalprintQuantity, GlobalprintRate, GlobalprintSignature, GlobalprintSlNo, GlobalprinttermsAndConditions, GlobalPritdummyData, GlobalSignatureImage, GlobalthemeFormat } from '../../../Features/ThemeChange/ThemeChange'; +import { + GloabalFieldDetails, GlobalBillName, Globalnotes, + GlobalprintQrcodet, GlobalprintSignature, GlobalprintSlNo, GlobalprinttermsAndConditions, GlobalPritdummyData, + GlobalSignatureImage, GlobalthemeFormat, + GlobalSelectedPrintHeaderFontColor, + GlobalSelectedTableHeaderColor, + GlobalSelectedTableHeaderFontColor, + GlobalSelectedTableBodyColor, + GlobalSelectedTableBodyFontColor, + GlobalRowType, + GlobalSelectedFooterColor, + GlobalSelectedFooterFontColor, + GlobalSelectedNetAmountColor, + GlobalSelectedNetAmountFontColor, + GlobalSelectedPrintHeaderColor, +} from '../../../Features/ThemeChange/ThemeChange'; import signature from "../../../Images/signatureimage.jpg" import QRCode from 'react-qr-code'; import { isMobile } from 'react-device-detect'; @@ -19,6 +34,17 @@ const PurPrintStyleA4 = ({ index, ExtraChargeTotal, UpiId, Date1, base64Image, t const GlobalSignature = useSelector(GlobalprintSignature); const GlobaltermsAndConditions = useSelector(GlobalprinttermsAndConditions); // const FieldDetails = useSelector(GloabalFieldDetails); + const SelectedHeaderColor = useSelector(GlobalSelectedPrintHeaderColor); + const SelectedHeaderFontColor = useSelector(GlobalSelectedPrintHeaderFontColor); + const SelectedTableHeaderColor = useSelector(GlobalSelectedTableHeaderColor); + const SelectedTableHeaderFontColor = useSelector(GlobalSelectedTableHeaderFontColor); + const SelectedTableBodyColor = useSelector(GlobalSelectedTableBodyColor); + const SelectedTableBodyFontColor = useSelector(GlobalSelectedTableBodyFontColor); + const SelectedRowType = useSelector(GlobalRowType); + const SelectedTableFooterColor = useSelector(GlobalSelectedFooterColor); + const SelectedTableFooterFontColor = useSelector(GlobalSelectedFooterFontColor); + const SelectedNetAmountColor = useSelector(GlobalSelectedNetAmountColor); + const SelectedNetAmountFontColor = useSelector(GlobalSelectedNetAmountFontColor); const FieldDetails = printDatas?.FieldDetails?.reduce((acc, item) => { acc[item.ConfigName] = true; return acc; @@ -37,6 +63,12 @@ const PurPrintStyleA4 = ({ index, ExtraChargeTotal, UpiId, Date1, base64Image, t const Qrcodet = FieldDetails?.["Qrcode"]; const Signature = FieldDetails?.["signature"]; const TermsnAdCondition = FieldDetails?.["terms&conditions"]; + let printColors = printDatas?.PrintColors; + const headerColor = printColors?.find(obj => obj.headerColor)?.headerColor; + const tableHeaderColor = printColors?.find(obj => obj.tableHeaderColor)?.tableHeaderColor; + const tableBodyColor = printColors?.find(obj => obj.tableBodyColor)?.tableBodyColor; + const footerColor = printColors?.find(obj => obj.footerColor)?.footerColor; + const netAmtColor = printColors?.find(obj => obj.netAmtColor)?.netAmtColor; const GlobalQrcodet = useSelector(GlobalprintQrcodet); const GlobaldummyData = useSelector(GlobalPritdummyData); const GlobalBilltext = useSelector(GlobalBillName) @@ -87,7 +119,51 @@ const PurPrintStyleA4 = ({ index, ExtraChargeTotal, UpiId, Date1, base64Image, t } const lastChunkRows = paginatedChunks.length > 0 ? paginatedChunks[paginatedChunks.length - 1].length : 0; const shouldFooterBeOnNewPage = lastChunkRows > 6; + const headerStyle = { + backgroundColor: GlobaldummyData + ? SelectedHeaderColor + : headerColor?.background, + color: GlobaldummyData + ? SelectedHeaderFontColor + : headerColor?.font, + } + const tableHeaderStyle = { + backgroundColor: GlobaldummyData + ? SelectedTableHeaderColor + : tableHeaderColor?.background, + + color: GlobaldummyData + ? SelectedTableHeaderFontColor + : tableHeaderColor?.font, + } + const tableBodyStyle = { + backgroundColor: GlobaldummyData + ? SelectedTableBodyColor + : tableBodyColor?.background, + color: GlobaldummyData + ? SelectedTableBodyFontColor + : tableBodyColor?.font, + } + const rowtypeStyle = GlobaldummyData ? SelectedRowType : tableBodyColor?.rowType; + const footerColorStyle = { + backgroundColor: GlobaldummyData + ? SelectedTableFooterColor + : footerColor?.background, + + color: GlobaldummyData + ? SelectedTableFooterFontColor + : footerColor?.font, + } + const netAmountStyle = { + backgroundColor: GlobaldummyData + ? SelectedNetAmountColor + : netAmtColor?.background, + + color: GlobaldummyData + ? SelectedNetAmountFontColor + : netAmtColor?.font, + } return (
-
+
{TakeawayData?.length > 0 && ( <> -
- Take Away -
@@ -178,21 +242,21 @@ const PurPrintStyleA4 = ({ index, ExtraChargeTotal, UpiId, Date1, base64Image, t
- {SLNO == true && } - {Item == true && } + {SLNO == true && } + {Item == true && } {HsnCode == true && ( - + )} {Quantity == true && ( - + )} - {MRP == true && } - {Rate == true && } + {MRP == true && } + {Rate == true && } {Discount == true && ( - + )} {Amount == true && ( - )} @@ -201,7 +265,18 @@ const PurPrintStyleA4 = ({ index, ExtraChargeTotal, UpiId, Date1, base64Image, t {dataChunk?.map((item, index) => ( - + {SLNO == true && (
S.NoItemS.NoItemHSNHSNQtyQtyMRPRateMRPRateDis Dis + Amt
{chunkIndex * chunkSize + index + 1} @@ -304,7 +379,7 @@ const PurPrintStyleA4 = ({ index, ExtraChargeTotal, UpiId, Date1, base64Image, t {(TotalOfferAmount > 0 || table2Data?.OverallDisc) ? (
{Number(TotalOfferAmount + table2Data?.OverallDisc).toFixed(2)}
) : ""} -
Amount :{Number(dataSource?.[0]?.NetAmt).toFixed(2)}
+
Amount :{Number(dataSource?.[0]?.NetAmt).toFixed(2)}
@@ -356,51 +431,32 @@ const PurPrintStyleA4 = ({ index, ExtraChargeTotal, UpiId, Date1, base64Image, t
{Date1}
- {GlobaldummyData ? GlobalIsnotes && - (
-

Notes : 10 days Return policy

- -
-
) : - Notestext && (
+
+ {Notestext && (

{Notestext}

) - } + } -
- {GlobaldummyData ? GlobaltermsAndConditions && - (
-

- Terms & Conditions -

-
    -
  1. Once goods are sold, they are not exchangeable or refundable.
    2. -
  2. Please check the product before leaving the counter.
    3. -
-
) - : - (TermsnAdCondition == true && TermsAndConditions?.length > 0) && (
+
+ {(TermsnAdCondition == true && TermsAndConditions?.length > 0) && (

Terms & Conditions

    {TermsAndConditions?.map(item => (
  1. {item?.TermsandConditions}
    2. ))} - {/*
  2. Please check the product before leaving the counter.
    3. */}
) - } + } - {GlobaldummyData ? GlobalSignature && (
-

Signature

- -
) : Signature == true && (
-

Signature

- -
)} + {Signature == true && (
+

Signature

+ +
)} +
}
@@ -447,7 +503,7 @@ const PurPrintStyleA4 = ({ index, ExtraChargeTotal, UpiId, Date1, base64Image, t
-
Amount :{GlobaldummyData ? "1066" : Number(dataSource?.[0]?.NetAmt).toFixed(2)}
+
Amount :{GlobaldummyData ? "1066" : Number(dataSource?.[0]?.NetAmt).toFixed(2)}
@@ -545,51 +601,32 @@ const PurPrintStyleA4 = ({ index, ExtraChargeTotal, UpiId, Date1, base64Image, t
{Date1}
- {GlobaldummyData ? GlobalIsnotes && - (
-

Notes : 10 days Return policy

- -
-
) : - Notestext && (
+
+ {Notestext && (

{Notestext}

) - } + } -
- {GlobaldummyData ? GlobaltermsAndConditions && - (
-

- Terms & Conditions -

-
    -
  1. Once goods are sold, they are not exchangeable or refundable.
    2. -
  2. Please check the product before leaving the counter.
    3. -
-
) - : - (TermsnAdCondition == true && TermsAndConditions?.length > 0) && (
+
+ {(TermsnAdCondition == true && TermsAndConditions?.length > 0) && (

Terms & Conditions

    {TermsAndConditions?.map(item => (
  1. {item?.TermsandConditions}
    2. ))} - {/*
  2. Please check the product before leaving the counter.
    3. */}
) - } + } - {GlobaldummyData ? GlobalSignature && (
-

Signature

- -
) : Signature == true && (
-

Signature

- -
)} + {Signature == true && (
+

Signature

+ +
)} +
)} @@ -633,7 +670,7 @@ const PurPrintStyleA4 = ({ index, ExtraChargeTotal, UpiId, Date1, base64Image, t
-
Amount :{GlobaldummyData ? "1066" : Number(dataSource?.[0]?.NetAmt).toFixed(2)}
+
Amount :{GlobaldummyData ? "1066" : Number(dataSource?.[0]?.NetAmt).toFixed(2)}
@@ -731,51 +768,33 @@ const PurPrintStyleA4 = ({ index, ExtraChargeTotal, UpiId, Date1, base64Image, t
{Date1}
- {GlobaldummyData ? GlobalIsnotes && - (
-

Notes : 10 days Return policy

-
-
) : - Notestext && (
+
+ {Notestext && (

{Notestext}

) - } + } -
- {GlobaldummyData ? GlobaltermsAndConditions && - (
-

- Terms & Conditions -

-
    -
  1. Once goods are sold, they are not exchangeable or refundable.
    2. -
  2. Please check the product before leaving the counter.
    3. -
-
) - : - (TermsnAdCondition == true && TermsAndConditions?.length > 0) && (
+
+ {(TermsnAdCondition == true && TermsAndConditions?.length > 0) && (

Terms & Conditions

    {TermsAndConditions?.map(item => (
  1. {item?.TermsandConditions}
    2. ))} - {/*
  2. Please check the product before leaving the counter.
    3. */}
) - } + } - {GlobaldummyData ? GlobalSignature && (
-

Signature

- -
) : Signature == true && (
-

Signature

- -
)} + {Signature == true && (
+

Signature

+ +
)} +