From a7ab626afcd67f8d166631bd8d015dc408e46668 Mon Sep 17 00:00:00 2001
From: Srinath <msrinath6109@gmail.com>
Date: Tue, 3 Mar 2026 19:57:55 +0530
Subject: [PATCH] Implement dynamic header and table color functionality

---
 .../PurchasePrintTemplate/PurPrintstyle11.jsx | 271 ++++++++++++------
 1 file changed, 184 insertions(+), 87 deletions(-)

diff --git a/src/Pages/PurchaseQuotation/PurchasePrintTemplate/PurPrintstyle11.jsx b/src/Pages/PurchaseQuotation/PurchasePrintTemplate/PurPrintstyle11.jsx
index bd0e9c8..895e519 100644
--- a/src/Pages/PurchaseQuotation/PurchasePrintTemplate/PurPrintstyle11.jsx
+++ b/src/Pages/PurchaseQuotation/PurchasePrintTemplate/PurPrintstyle11.jsx
@@ -4,7 +4,18 @@ import { useDispatch, useSelector } from "react-redux";
 import {
   GlobalPritdummyData,
   changeReprintDataFound,
-  GlobalprinttermsAndConditions
+  GlobalprinttermsAndConditions,
+  GlobalSelectedPrintHeaderColor,
+  GlobalSelectedPrintHeaderFontColor,
+  GlobalSelectedTableHeaderColor,
+  GlobalSelectedTableHeaderFontColor,
+  GlobalSelectedTableBodyColor,
+  GlobalSelectedTableBodyFontColor,
+  GlobalRowType,
+  GlobalSelectedFooterColor,
+  GlobalSelectedFooterFontColor,
+  GlobalSelectedNetAmountColor,
+  GlobalSelectedNetAmountFontColor,
 } from '../../../Features/ThemeChange/ThemeChange';
 import "../../../Styles/BookingScreen/PrintTemplates/ThermalPrinter/PrintStyle11.scss";
 import { extractLastNumber } from "../../../Services/Others";
@@ -29,11 +40,26 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
   const Rate = FieldDetails?.["Rate"];
   const Amount = FieldDetails?.["Amount"];
   const HsnCode = FieldDetails?.["HsnCode"];
+  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 GlobaldummyData = useSelector(GlobalPritdummyData);
+  const GlobaldummyData = useSelector(GlobalPritdummyData);
   const GlobaltermsAndConditions = useSelector(GlobalprinttermsAndConditions);
-
+  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 TermsAndConditions = printDatas?.TermsandConditions
   let SignatureImg = printDatas?.Signature
@@ -70,39 +96,85 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
   }
   const lastChunkRows = paginatedChunks.length > 0 ? paginatedChunks[paginatedChunks.length - 1].length : 0;
   const shouldFooterBeOnNewPage = lastChunkRows > (PageSize == "A5" ? 5 : 10);
+  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 (
     <>
       {FormatTheme ?
         <div className="PrintStyle11MasterDiv" id={`SQPrintStyle11`}
-          style={{ fontFamily: "'Courier New', Courier, monospace", position: "relative", width: "100%", minHeight:isMobile ? (PageSize === "A5" ? "210mm" : "297mm") : "auto" }}
+          style={{ fontFamily: "'Courier New', Courier, monospace", position: "relative", width: "100%", minHeight: isMobile ? (PageSize === "A5" ? "210mm" : "297mm") : "auto" }}
         >
           {paginatedChunks.map((dataChunk, chunkIndex) => (
             <div className={`container print-chunk${chunkIndex > 0 ? ' print-page-break' : ''}`} style={{ display: "flex", flexDirection: "column", justifyContent: ((chunkIndex === paginatedChunks.length - 1) && (!shouldFooterBeOnNewPage)) && FormatTheme ? "space-between" : "", height: FormatTheme ? PageSize == "A5" ? '170mm' : "257mm" : "", }} key={chunkIndex}>
 
 
               {/* <div className="header" style={{ position: "fixed", top: 0, width: "100%" }}> */}
-                <div className="header" style={{ position: isMobile ?  "fixed" : "", top: 0, width: "100%" }}>
-                <div className="PrintStyle11-print">
-                  {base64Image ? <img className='PrintStyle11-BrandImage' src={ base64Image} alt='image' style={{ width: '40px', height: '40px', }} /> : null}
-                  <div>
-                    <div style={{
-                      fontWeight: '600',
-                      // fontFamily: "Lemon",
-                      fontSize: 'clamp(1rem, 2.5vw, 2.5rem)'
-                    }}>
-                      { table2Data?.[0]?.BrName}
+              <div className="header" style={{ position: isMobile ? "fixed" : "", top: 0, width: "100%" }}>
+                <div style={{ ...headerStyle }}>
+                  <div className="PrintStyle11-print" style={{ ...headerStyle }}>
+                    {base64Image ? <img className='PrintStyle11-BrandImage' src={base64Image} alt='image' style={{ width: '40px', height: '40px', }} /> : null}
+                    <div>
+                      <div style={{
+                        fontWeight: '600',
+                        // fontFamily: "Lemon",
+                        fontSize: 'clamp(1rem, 2.5vw, 2.5rem)'
+                      }}>
+                        {table2Data?.[0]?.BrName}
+                      </div>
+
                     </div>
-                 
                   </div>
-                </div>
-                <hr style={{ margin: '0.1rem 0rem' }} />
-                <div className='PrintStyle11-print-SecondDiv' >
-                  <div style={{ fontSize: "12px", fontWeight: '600' }}>
-                    {
-                      (table2Data?.[0]?.AddressDetails?.[0]?.Address1 || '') + (table2Data?.[0]?.AddressDetails?.[0]?.City ? (table2Data?.[0]?.AddressDetails?.[0]?.Address1 && table2Data?.[0]?.AddressDetails?.[0]?.City ? '-' : '') + table2Data?.[0]?.AddressDetails?.[0]?.City : '') + (table2Data?.[0]?.AddressDetails?.[0]?.Zip ? (table2Data?.[0]?.AddressDetails?.[0]?.City && table2Data?.[0]?.AddressDetails?.[0]?.Zip ? '-' : '') + table2Data?.[0]?.AddressDetails?.[0]?.Zip : '')}
+                  <hr style={{ margin: '0.1rem 0rem' }} />
+                  <div className='PrintStyle11-print-SecondDiv' >
+                    <div style={{ fontSize: "12px", fontWeight: '600' }}>
+                      {
+                        (table2Data?.[0]?.AddressDetails?.[0]?.Address1 || '') + (table2Data?.[0]?.AddressDetails?.[0]?.City ? (table2Data?.[0]?.AddressDetails?.[0]?.Address1 && table2Data?.[0]?.AddressDetails?.[0]?.City ? '-' : '') + table2Data?.[0]?.AddressDetails?.[0]?.City : '') + (table2Data?.[0]?.AddressDetails?.[0]?.Zip ? (table2Data?.[0]?.AddressDetails?.[0]?.City && table2Data?.[0]?.AddressDetails?.[0]?.Zip ? '-' : '') + table2Data?.[0]?.AddressDetails?.[0]?.Zip : '')}
+                    </div>
+                    <div style={{ fontSize: "11px", fontWeight: '600' }}> MOBILE NO :{table2Data?.[0]?.BrMobile}</div>
                   </div>
-                  <div style={{ fontSize: "11px", fontWeight: '600' }}> MOBILE NO :{table2Data?.[0]?.BrMobile}</div>
                 </div>
                 <hr style={{ margin: '0.1rem 0rem' }} />
                 <div style={{ margin: '0rem 0.5rem', display: 'flex', justifyContent: 'center', fontWeight: '600', textTransform: 'capitalize' }} className='PrintStyle11-print-BillNO' >{BillName} </div>
@@ -111,28 +183,39 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
               </div>
 
 
-              <div style={{ marginTop:  "0rem" }} className="print-body">
-                {(TakeawayData?.length > 0 ) &&
+              <div style={{ marginTop: "0rem" }} className="print-body">
+                {(TakeawayData?.length > 0) &&
                   <>
 
                     <table className="PrintStyle11-print-table">
                       <thead>
                         <tr>
-                          {SLNO && <th style={{ width: '10px' }}>S.N</th>}
-                          {Item && <th style={{ width: '10px' }}>Item</th>}
-                          {Quantity && <th style={{ width: '10px', textAlign: 'right' }}>Qty</th>}
-                          { HsnCode && <th style={{ width: '10px', textAlign: 'right' }}>HSN</th>}
-                          { MRP && <th style={{ width: '10px', textAlign: 'right' }}>MRP</th>}
-                          { Discount && <th style={{ width: '10px', textAlign: 'right' }}>Dis </th>}
-                          { Rate && <th style={{ width: '10px', textAlign: 'right' }}>Rate</th>}
-                          { Amount && <th style={{ width: '10px', textAlign: 'right' }}>Amt</th>}
+                          {SLNO && <th style={{ ...tableHeaderStyle, width: '10px' }}>S.N</th>}
+                          {Item && <th style={{ ...tableHeaderStyle, width: '10px' }}>Item</th>}
+                          {Quantity && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>Qty</th>}
+                          {HsnCode && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>HSN</th>}
+                          {MRP && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>MRP</th>}
+                          {Discount && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>Dis </th>}
+                          {Rate && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>Rate</th>}
+                          {Amount && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>Amt</th>}
                         </tr>
                       </thead>
                       <tbody>
                         {dataChunk?.map((item, index) => {
                           return (
-                            <tr key={index}>
-                              { SLNO && <td>{chunkIndex * chunkSize + index + 1}</td>}
+                            <tr key={index}
+                              style={
+                                index % 2 !== 1 && rowtypeStyle === "even"
+                                  ? {
+                                    ...tableBodyStyle
+                                  }
+                                  : index % 2 === 1 && rowtypeStyle === "odd"
+                                    ? {
+                                      ...tableBodyStyle
+                                    }
+                                    : {}
+                              }>
+                              {SLNO && <td>{chunkIndex * chunkSize + index + 1}</td>}
                               {Item && <td style={{ display: 'flex', flexDirection: 'column' }}>
                                 <div>{item?.ProdName}</div>
                                 <div>({item?.Size ? item?.Size : "1"} {item?.SinglePc == 'Y' ? 'PCS' : item?.Type != "C" ? item?.UomName : "COMBO"}){item?.BrandName !== null ? item?.BrandName : ""}&nbsp;
@@ -149,8 +232,8 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
                               {HsnCode && <td style={{ textAlign: 'right' }}>{item?.HSN}</td>}
                               {MRP && <td style={{ textAlign: 'right' }}>{item?.SinglePc === 'Y' ? item?.Price : item?.MRP}</td>}
                               {Discount && <td style={{ textAlign: 'right' }}>{item?.Type != "C" ? item?.OfferAmt || 0 : item?.OfferValue || 0}</td>}
-                              { Rate && <td style={{ textAlign: 'right' }}>{item?.Price}</td>}
-                              { Amount && <td style={{ textAlign: 'right' }}>{item?.NetAmt?.toFixed(2)}</td>}
+                              {Rate && <td style={{ textAlign: 'right' }}>{item?.Price}</td>}
+                              {Amount && <td style={{ textAlign: 'right' }}>{item?.NetAmt?.toFixed(2)}</td>}
                             </tr>
                           )
                         })}
@@ -158,14 +241,14 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
                     </table>
                   </>
                 }
-                
+
               </div>
 
               {((chunkIndex === paginatedChunks.length - 1) && (!shouldFooterBeOnNewPage)) && FormatTheme &&
                 <>
                   <hr className="PrintStyle11-print-dottline" />
                   <div className='PrintStyle11-print-ThirdDiv'>
-                    <div>
+                    <div style={{ ...netAmountStyle}}>
                       <div className='PrintStyle11-print-ThirdDivSub'>
                         <div style={{ display: 'flex', flexDirection: 'column', }}>
                           <div style={{ fontSize: "15px", fontWeight: '600' }}>Qty</div>
@@ -177,15 +260,15 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
                                         <div>ROUND OFF</div> */}
                         </div>
                         <div style={{ textAlign: 'right', display: 'flex', flexDirection: 'column', fontSize: "13px", fontWeight: '500' }}>
-                          <div>{ totalQuantity}</div>
+                          <div>{totalQuantity}</div>
                           <div>{totalQuantityFilter?.length}</div>
                           {(table2Data?.OverallDisc > 0 || TotalOfferAmount > 0) &&
-                            <div>{ Number(TotalOfferAmount + table2Data?.OverallDisc).toFixed(2)}</div>
+                            <div>{Number(TotalOfferAmount + table2Data?.OverallDisc).toFixed(2)}</div>
                           }
-                         
+
                         </div>
                       </div>
-                      
+
                       <div style={{ textAlign: 'right', fontWeight: '600', fontSize: '18px' }}>Amount  :{Number(table2Data?.[0]?.NetAmount).toFixed(2)}/-</div>
                     </div>
                   </div>
@@ -317,23 +400,23 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
                       </div>
                     </div>
                   </div>
-                
+
                   <div style={{ display: 'flex', justifyContent: "space-between", width: '92%' }}>
 
                     <div style={{ margin: '0.5rem 0.5rem', display: 'flex', flexDirection: 'column', gap: '0.5rem', fontWeight: '600' }}>
-                     
-                      
+
+
                       {table2Data?.CustSuppName && table2Data?.CustSuppName !== undefined && table2Data?.CustSuppName !== null && !GlobaldummyData &&
                         <div className='PrintStyle11-print-InfoDivsub'>Customer : {table2Data?.CustSuppName}
                         </div>
                       }
 
 
-                     
+
 
                       <div className='PrintStyle11-print-InfoDivsub' style={{ textTransform: 'capitalize' }}>{Date1}</div>
                     </div>
-                    
+
                   </div>
                   <hr className="PrintStyle11-print-dottline" />
 
@@ -344,6 +427,7 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
                       pageBreakBefore: "avoid",
                       pageBreakInside: "avoid",
                       minHeight: "auto",
+                      ...footerColorStyle
                     }}
                   >
                     {
@@ -368,7 +452,7 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
                         </div>)
                       }
 
-                      { Signature == true && (<div style={{ display: "flex", flexDirection: "column", alignItems: "center", marginTop: "1rem", paddingBottom: "1rem" }}>
+                      {Signature == true && (<div style={{ display: "flex", flexDirection: "column", alignItems: "center", marginTop: "1rem", paddingBottom: "1rem" }}>
                         <p style={{ fontSize: "13px", fontWeight: "bold", marginBottom: "6px" }}>Signature</p>
                         <img style={{ width: "100px", height: "60px" }} src={SignatureImg} alt="" />
                       </div>)}
@@ -376,7 +460,7 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
                     </div>
                   </div>
 
-                  
+
 
                 </>
               }
@@ -406,7 +490,7 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
                 <>
                   <hr className="PrintStyle11-print-dottline" />
                   <div className='PrintStyle11-print-ThirdDiv'>
-                    <div>
+                    <div style={{ ...netAmountStyle}}>
                       <div className='PrintStyle11-print-ThirdDivSub'>
                         <div style={{ display: 'flex', flexDirection: 'column', }}>
                           <div style={{ fontSize: "15px", fontWeight: '600' }}>Qty</div>
@@ -427,7 +511,7 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
                           {/* <div>{GlobaldummyData ? '1,066' : Number(table2Data?.NetAmount).toFixed(2) ? Number(table2Data?.NetAmount).toFixed(2) : 0}</div> */}
                         </div>
                       </div>
-                     
+
                       <div style={{ textAlign: 'right', fontWeight: '600', fontSize: '18px' }}>Amount  :{Number(table2Data?.[0]?.NetAmount).toFixed(2)}/-</div>
                     </div>
                   </div>
@@ -560,19 +644,19 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
                       </div>
                     </div>
                   </div>
-                 
+
                   <div style={{ display: 'flex', justifyContent: "space-between", width: '92%' }}>
 
                     <div style={{ margin: '0.5rem 0.5rem', display: 'flex', flexDirection: 'column', gap: '0.5rem', fontWeight: '600' }}>
-                      
-                     
+
+
                       {table2Data?.CustSuppName && table2Data?.CustSuppName !== undefined && table2Data?.CustSuppName !== null && !GlobaldummyData &&
                         <div className='PrintStyle11-print-InfoDivsub'>Customer : {table2Data?.CustSuppName}
                         </div>
                       }
 
 
-                     
+
 
                       <div className='PrintStyle11-print-InfoDivsub' style={{ textTransform: 'capitalize' }}>{Date1}</div>
                     </div>
@@ -598,6 +682,7 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
                       pageBreakBefore: "avoid",
                       pageBreakInside: "avoid",
                       minHeight: "auto",
+                      ...footerColorStyle
                     }}
                   >
                     {GlobaldummyData ? GlobalIsnotes &&
@@ -648,7 +733,7 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
                     </div>
                   </div>
 
-                 
+
 
                 </>
               </div>
@@ -658,7 +743,7 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
         :
         <div className="PrintStyle11MasterDiv" id={`SQPrintStyle11`} style={{ fontFamily: "'Courier New', Courier, monospace" }}
         >
-          <div className="PrintStyle11-print">
+          <div className="PrintStyle11-print"  style={{ ...headerStyle }}>
             {base64Image ? <img className='PrintStyle11-BrandImage' src={base64Image} alt='image' style={{ width: '40px', height: '40px', }} /> : null}
             <div>
               <div style={{
@@ -674,7 +759,7 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
             </div>
           </div>
           <hr style={{ margin: '0.1rem 0rem' }} />
-          <div className='PrintStyle11-print-SecondDiv' >
+          <div className='PrintStyle11-print-SecondDiv' style={{ ...headerStyle }} >
             <div style={{ fontSize: "12px", fontWeight: '600' }}>
               {GlobaldummyData ?
                 'BranchAddress, Town- 635XXX City - State' :
@@ -693,21 +778,32 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
                 <table className="PrintStyle11-print-table">
                   <thead>
                     <tr>
-                      {SLNO && <th style={{ width: '10px' }}>S.N</th>}
-                      {Item && <th style={{ width: '10px' }}>Item</th>}
-                      {Quantity && <th style={{ width: '10px', textAlign: 'right' }}>Qty</th>}
-                      { HsnCode && <th style={{ width: '10px', textAlign: 'right' }}>HSN</th>}
-                      { MRP && <th style={{ width: '10px', textAlign: 'right' }}>MRP</th>}
-                      { Discount && <th style={{ width: '10px', textAlign: 'right' }}>Dis </th>}
-                      { Rate && <th style={{ width: '10px', textAlign: 'right' }}>Rate</th>}
-                      { Amount && <th style={{ width: '10px', textAlign: 'right' }}>Amt</th>}
+                      {SLNO && <th style={{ ...tableHeaderStyle, width: '10px' }}>S.N</th>}
+                      {Item && <th style={{ ...tableHeaderStyle, width: '10px' }}>Item</th>}
+                      {Quantity && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>Qty</th>}
+                      {HsnCode && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>HSN</th>}
+                      {MRP && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>MRP</th>}
+                      {Discount && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>Dis </th>}
+                      {Rate && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>Rate</th>}
+                      {Amount && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>Amt</th>}
                     </tr>
                   </thead>
                   <tbody>
-                    {( TakeawayData)?.map((item, index) => {
+                    {(TakeawayData)?.map((item, index) => {
                       return (
-                        <tr key={index}>
-                          { SLNO && <td>{index + 1}</td>}
+                        <tr key={index}
+                          style={
+                            index % 2 !== 1 && rowtypeStyle === "even"
+                              ? {
+                                ...tableBodyStyle
+                              }
+                              : index % 2 === 1 && rowtypeStyle === "odd"
+                                ? {
+                                  ...tableBodyStyle
+                                }
+                                : {}
+                          }>
+                          {SLNO && <td>{index + 1}</td>}
                           {Item && <td style={{ display: 'flex', flexDirection: 'column' }}>
                             <div>{item?.ProdName}</div>
                             <div>({item?.Size ? item?.Size : "1"} {item?.SinglePc == 'Y' ? 'PCS' : item?.Type != "C" ? item?.UomName : "COMBO"}){item?.BrandName !== null ? item?.BrandName : ""}&nbsp;
@@ -722,10 +818,10 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
                           </td>}
                           {Quantity && <td style={{ textAlign: 'right' }}>{item?.Qty}</td>}
                           {HsnCode && <td style={{ textAlign: 'right' }}>{item?.HSN}</td>}
-                          { MRP && <td style={{ textAlign: 'right' }}>{item?.SinglePc === 'Y' ? item?.Price : item?.MRP}</td>}
-                          { Discount && <td style={{ textAlign: 'right' }}>{item?.Type != "C" ? item?.OfferAmt || 0 : item?.OfferValue || 0}</td>}
-                          { Rate && <td style={{ textAlign: 'right' }}>{item?.Price}</td>}
-                          { Amount && <td style={{ textAlign: 'right' }}>{item?.NetAmt?.toFixed(2)}</td>}
+                          {MRP && <td style={{ textAlign: 'right' }}>{item?.SinglePc === 'Y' ? item?.Price : item?.MRP}</td>}
+                          {Discount && <td style={{ textAlign: 'right' }}>{item?.Type != "C" ? item?.OfferAmt || 0 : item?.OfferValue || 0}</td>}
+                          {Rate && <td style={{ textAlign: 'right' }}>{item?.Price}</td>}
+                          {Amount && <td style={{ textAlign: 'right' }}>{item?.NetAmt?.toFixed(2)}</td>}
                         </tr>
                       )
                     })}
@@ -733,10 +829,10 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
                 </table>
               </>
             }
-          
+
             <hr className="PrintStyle11-print-dottline" />
             <div className='PrintStyle11-print-ThirdDiv'>
-              <div>
+              <div style={{ ...netAmountStyle}}>
                 <div className='PrintStyle11-print-ThirdDivSub'>
                   <div style={{ display: 'flex', flexDirection: 'column', }}>
                     <div style={{ fontSize: "15px", fontWeight: '600' }}>Qty</div>
@@ -753,10 +849,10 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
                     {(table2Data?.OverallDisc > 0 || TotalOfferAmount > 0) &&
                       <div>{Number(TotalOfferAmount + table2Data?.OverallDisc).toFixed(2)}</div>
                     }
-                    
+
                   </div>
                 </div>
-                
+
                 <div style={{ textAlign: 'right', fontWeight: '600', fontSize: '18px' }}>Amount  :{Number(table2Data?.[0]?.NetAmount).toFixed(2)}/-</div>
               </div>
             </div>
@@ -888,24 +984,24 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
                 </div>
               </div>
             </div>
-            
-            <div style={{ display: 'flex', justifyContent: "space-between", width: '92%' }}>
-              
-              <div style={{ margin: '0.5rem 0.5rem', display: 'flex', flexDirection: 'column', gap: '0.5rem', fontWeight: '600' }}>
-                
 
-               
+            <div style={{ display: 'flex', justifyContent: "space-between", width: '92%' }}>
+
+              <div style={{ margin: '0.5rem 0.5rem', display: 'flex', flexDirection: 'column', gap: '0.5rem', fontWeight: '600' }}>
+
+
+
                 {table2Data?.CustSuppName && table2Data?.CustSuppName !== undefined && table2Data?.CustSuppName !== null && !GlobaldummyData &&
                   <div className='PrintStyle11-print-InfoDivsub'>Customer : {table2Data?.CustSuppName}
                   </div>
                 }
 
 
-          
+
 
                 <div className='PrintStyle11-print-InfoDivsub' style={{ textTransform: 'capitalize' }}>{Date1}</div>
               </div>
-              
+
             </div>
             <hr className="PrintStyle11-print-dottline" />
 
@@ -916,6 +1012,7 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
                 pageBreakBefore: "avoid",
                 pageBreakInside: "avoid",
                 minHeight: "auto",
+                ...footerColorStyle
               }}
             >
               {
@@ -948,7 +1045,7 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
               </div>
             </div>
 
-            
+
 
           </div>