From ec1781112294ef04cf985f45321f984ef67af0b7 Mon Sep 17 00:00:00 2001 From: Srinath Date: Wed, 4 Mar 2026 16:33:23 +0530 Subject: [PATCH] Implement dynamic header and table color functionality --- .../PrintTemplates/A4/PrintA4Style11.jsx | 167 ++++++++++++++++-- 1 file changed, 153 insertions(+), 14 deletions(-) diff --git a/src/Pages/BookingScreen/PrintTemplates/A4/PrintA4Style11.jsx b/src/Pages/BookingScreen/PrintTemplates/A4/PrintA4Style11.jsx index ac6ec06..524e9cf 100644 --- a/src/Pages/BookingScreen/PrintTemplates/A4/PrintA4Style11.jsx +++ b/src/Pages/BookingScreen/PrintTemplates/A4/PrintA4Style11.jsx @@ -32,6 +32,17 @@ import { GlobalPritdummyData, GlobalSignatureImage, GlobalthemeFormat, + GlobalSelectedPrintHeaderColor, + GlobalSelectedPrintHeaderFontColor, + GlobalSelectedTableHeaderColor, + GlobalSelectedTableHeaderFontColor, + GlobalSelectedTableBodyFontColor, + GlobalSelectedTableBodyColor, + GlobalRowType, + GlobalSelectedFooterColor, + GlobalSelectedFooterFontColor, + GlobalSelectedNetAmountColor, + GlobalSelectedNetAmountFontColor, } from '../../../../Features/ThemeChange/ThemeChange'; import signature from '../../../../Images/signatureimage.jpg'; import QRCode from 'react-qr-code'; @@ -102,6 +113,23 @@ const PrintA4Style11 = ({ const GlobalLogo = useSelector(GlobalprintLogo); const GlobalCredit = useSelector(GlobalprintCredit); const SettingData = useSelector(PreferenceData); + 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); + 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 UomPrint = SettingData?.[0]?.SettingDtlDetails?.filter( (i) => i.SettingIdName === 'PrintUom' )?.[0]; @@ -279,6 +307,51 @@ const PrintA4Style11 = ({ : 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 (
- + {/* Placeholder for the fixed-position header */}
@@ -520,6 +594,7 @@ const PrintA4Style11 = ({ style={{ width: '8%', textAlign: 'center', + ...tableHeaderStyle, }} > S.No @@ -530,20 +605,22 @@ const PrintA4Style11 = ({ style={{ width: '8%', textAlign: 'center', + ...tableHeaderStyle, }} > S.No )} {GlobaldummyData - ? GlobalItem && Item - : Item == true && Item} + ? GlobalItem && Item + : Item == true && Item} {GlobaldummyData ? GlobalHsnCode && ( HSN @@ -554,6 +631,7 @@ const PrintA4Style11 = ({ style={{ width: '8%', textAlign: 'center', + ...tableHeaderStyle, }} > HSN @@ -565,6 +643,7 @@ const PrintA4Style11 = ({ style={{ width: '8%', textAlign: 'center', + ...tableHeaderStyle, }} > Qty @@ -575,6 +654,7 @@ const PrintA4Style11 = ({ style={{ width: '8%', textAlign: 'center', + ...tableHeaderStyle, }} > {WeightasKg ? 'Qty/Kg' : 'Qty'} @@ -586,6 +666,7 @@ const PrintA4Style11 = ({ style={{ width: '8%', textAlign: 'center', + ...tableHeaderStyle, }} > MRP @@ -596,6 +677,7 @@ const PrintA4Style11 = ({ style={{ width: '8%', textAlign: 'center', + ...tableHeaderStyle, }} > MRP @@ -607,6 +689,7 @@ const PrintA4Style11 = ({ style={{ width: '8%', textAlign: 'center', + ...tableHeaderStyle, }} > Rate @@ -617,6 +700,7 @@ const PrintA4Style11 = ({ style={{ width: '8%', textAlign: 'center', + ...tableHeaderStyle, }} > Rate @@ -628,6 +712,7 @@ const PrintA4Style11 = ({ style={{ width: '8%', textAlign: 'center', + ...tableHeaderStyle, }} > Dis{' '} @@ -638,6 +723,7 @@ const PrintA4Style11 = ({ style={{ width: '8%', textAlign: 'center', + ...tableHeaderStyle, }} > Dis{' '} @@ -649,6 +735,7 @@ const PrintA4Style11 = ({ style={{ width: '8%', textAlign: 'center', + ...tableHeaderStyle, }} > Tax % @@ -660,6 +747,7 @@ const PrintA4Style11 = ({ style={{ width: '8%', textAlign: 'center', + ...tableHeaderStyle, }} > Tax % @@ -671,6 +759,7 @@ const PrintA4Style11 = ({ style={{ width: '8%', textAlign: 'right', + ...tableHeaderStyle, }} > Amt @@ -681,6 +770,7 @@ const PrintA4Style11 = ({ style={{ width: '8%', textAlign: 'right', + ...tableHeaderStyle, }} > Amt @@ -691,7 +781,18 @@ const PrintA4Style11 = ({ {dataChunk?.map((item, index) => ( - + {GlobaldummyData ? GlobalSlNo && ( @@ -944,7 +1045,8 @@ const PrintA4Style11 = ({ fontSize: '25px', fontWeight: '600', padding: '10px', - backgroundColor: '#fdc716', + // backgroundColor: '#fdc716', + ...netAmountStyle, textAlign: 'center', }} > @@ -1323,7 +1425,8 @@ const PrintA4Style11 = ({ >{`*** Membership ${table2Data?.NetAmount === 0 ? 'Free Hours' : 'Discount'} Utilized - ${MembershipApplied?.Detail?.[0]?.MembershipName} ***`}
)} - {GlobaldummyData +
+ {GlobaldummyData ? GlobalIsnotes && (

@@ -1505,6 +1608,7 @@ const PrintA4Style11 = ({

)}
+
)} @@ -1576,6 +1680,7 @@ const PrintA4Style11 = ({ style={{ width: '8%', textAlign: 'center', + ...tableHeaderStyle }} > S.No @@ -1586,6 +1691,7 @@ const PrintA4Style11 = ({ style={{ width: '8%', textAlign: 'center', + ...tableHeaderStyle }} > S.No @@ -1600,6 +1706,7 @@ const PrintA4Style11 = ({ style={{ width: '8%', textAlign: 'center', + ...tableHeaderStyle }} > HSN @@ -1610,6 +1717,7 @@ const PrintA4Style11 = ({ style={{ width: '8%', textAlign: 'center', + ...tableHeaderStyle }} > HSN @@ -1621,6 +1729,7 @@ const PrintA4Style11 = ({ style={{ width: '8%', textAlign: 'center', + ...tableHeaderStyle }} > Qty @@ -1631,6 +1740,7 @@ const PrintA4Style11 = ({ style={{ width: '8%', textAlign: 'center', + ...tableHeaderStyle }} > {WeightasKg ? 'Qty/Kg' : 'Qty'} @@ -1642,6 +1752,7 @@ const PrintA4Style11 = ({ style={{ width: '8%', textAlign: 'center', + ...tableHeaderStyle }} > MRP @@ -1652,6 +1763,7 @@ const PrintA4Style11 = ({ style={{ width: '8%', textAlign: 'center', + ...tableHeaderStyle }} > MRP @@ -1663,6 +1775,7 @@ const PrintA4Style11 = ({ style={{ width: '8%', textAlign: 'center', + ...tableHeaderStyle }} > Rate @@ -1673,6 +1786,7 @@ const PrintA4Style11 = ({ style={{ width: '8%', textAlign: 'center', + ...tableHeaderStyle }} > Rate @@ -1684,6 +1798,7 @@ const PrintA4Style11 = ({ style={{ width: '8%', textAlign: 'center', + ...tableHeaderStyle }} > Dis{' '} @@ -1694,6 +1809,7 @@ const PrintA4Style11 = ({ style={{ width: '8%', textAlign: 'center', + ...tableHeaderStyle }} > Dis{' '} @@ -1705,6 +1821,7 @@ const PrintA4Style11 = ({ style={{ width: '8%', textAlign: 'center', + ...tableHeaderStyle }} > Tax % @@ -1716,6 +1833,7 @@ const PrintA4Style11 = ({ style={{ width: '8%', textAlign: 'center', + ...tableHeaderStyle }} > Tax % @@ -1728,6 +1846,7 @@ const PrintA4Style11 = ({ width: '8%', textAlign: 'center', textAlign: 'right', + ...tableHeaderStyle }} > Amt @@ -1739,6 +1858,7 @@ const PrintA4Style11 = ({ width: '8%', textAlign: 'center', textAlign: 'right', + ...tableHeaderStyle }} > Amt @@ -1749,7 +1869,18 @@ const PrintA4Style11 = ({ {dataChunk?.map((item, index) => ( - + {GlobaldummyData ? GlobalSlNo && ( @@ -1975,7 +2106,8 @@ const PrintA4Style11 = ({ fontSize: '25px', fontWeight: '600', padding: '10px', - backgroundColor: '#fdc716', + // backgroundColor: '#fdc716', + ...netAmountStyle, textAlign: 'center', }} > @@ -2352,7 +2484,8 @@ const PrintA4Style11 = ({ >{`*** Membership ${table2Data?.NetAmount === 0 ? 'Free Hours' : 'Discount'} Utilized - ${MembershipApplied?.Detail?.[0]?.MembershipName} ***`} )} - {GlobaldummyData +
+ {GlobaldummyData ? GlobalIsnotes && (

@@ -2534,6 +2667,7 @@ const PrintA4Style11 = ({

)}
+ )} @@ -2631,7 +2765,8 @@ const PrintA4Style11 = ({ fontSize: '25px', fontWeight: '600', padding: '10px', - backgroundColor: '#fdc716', + // backgroundColor: '#fdc716', + ...netAmountStyle, textAlign: 'center', }} > @@ -2945,7 +3080,8 @@ const PrintA4Style11 = ({ >{`*** Membership ${table2Data?.NetAmount === 0 ? 'Free Hours' : 'Discount'} Utilized - ${MembershipApplied?.Detail?.[0]?.MembershipName} ***`} )} - {GlobaldummyData +
+ {GlobaldummyData ? GlobalIsnotes && (

@@ -3116,6 +3252,7 @@ const PrintA4Style11 = ({ )}

+ )} ))} @@ -3198,7 +3335,8 @@ const PrintA4Style11 = ({ fontSize: '25px', fontWeight: '600', padding: '10px', - backgroundColor: '#fdc716', + // backgroundColor: '#fdc716', + ...netAmountStyle, textAlign: 'center', }} > @@ -3494,7 +3632,8 @@ const PrintA4Style11 = ({ >{`*** Membership ${table2Data?.NetAmount === 0 ? 'Free Hours' : 'Discount'} Utilized - ${MembershipApplied?.Detail?.[0]?.MembershipName} ***`} )} - {GlobaldummyData +
+ {GlobaldummyData ? GlobalIsnotes && (

@@ -3513,7 +3652,6 @@ const PrintA4Style11 = ({

)} -
+
)}