diff --git a/src/Features/ThemeChange/ThemeChange.js b/src/Features/ThemeChange/ThemeChange.js index 44bc209..0cf576b 100644 --- a/src/Features/ThemeChange/ThemeChange.js +++ b/src/Features/ThemeChange/ThemeChange.js @@ -544,11 +544,13 @@ const initialState = { PrintTemplate: null, DCPrintTemplate: null, PrintFieldDetails: null, + DCtoInvoicePrintFieldDetails: null, PricingAppPricingName: null, FeatureAddonData: [], SessionData: [], ThemeCreation: {}, printDatas: {}, + DCtoInvoice: {}, DefaultTheme: [], OthersTheme: [], SelectedTheme: {}, @@ -2407,12 +2409,16 @@ const ThemeSlice = createSlice({ item.SetasDefault == 'Y' && item.PrintTypeName === 'Delivery Chalan' )?.StyleName; - state.printDatas = action?.payload?.data?.data?.[0]?.ComponentDetails.find( (item) => item.SetasDefault == 'Y' && item.PrintTypeName === 'Sales' ); + state.DCtoInvoice = + action?.payload?.data?.data?.[0]?.ComponentDetails.find( + (item) => + item.SetasDefault == 'Y' && item.PrintTypeName === 'DC to Invoice' + ); state.PrintFieldDetails = action?.payload?.data?.data?.[0]?.ComponentDetails?.find( (item) => @@ -2421,6 +2427,14 @@ const ThemeSlice = createSlice({ acc[item.ConfigName] = true; return acc; }, {}); + state.DCtoInvoicePrintFieldDetails = + action?.payload?.data?.data?.[0]?.ComponentDetails?.find( + (item) => + item.SetasDefault == 'Y' && item.PrintTypeName === 'DC to Invoice' + )?.FieldDetails?.reduce((acc, item) => { + acc[item.ConfigName] = true; + return acc; + }, {}); } else if (action?.payload?.data?.statusCode == 0) { state.PrintTemplate = undefined; @@ -2755,6 +2769,7 @@ export const GlobalPricingAppPricingName = (state) => state?.theme?.PricingAppPricingName; export const SelectedPrintTemplate = (state) => state?.theme?.PrintTemplate; export const GloabalFieldDetails = (state) => state?.theme?.PrintFieldDetails; +export const GloabalDCtoInvoiceFieldDetails = (state) => state?.theme?.DCtoInvoicePrintFieldDetails; export const GlobalReprintDataFound = (state) => state.theme?.ReprintDataFound; export const GlobalPritdummyData = (state) => state.theme?.PrintdummyData; export const GlobalprintSize = (state) => state.theme?.printSize; @@ -2865,6 +2880,7 @@ export const SelectedGlobalSubCatgFont = (state) => state.theme.SelectedSubCatgFont; export const StoredSessionData = (state) => state.theme.SessionData; export const GlobalprintDatas = (state) => state.theme.printDatas; +export const GlobalDCtoInvoicePrint = (state) => state.theme.DCtoInvoice; export const GlobalDefaultTheme = (state) => state.theme.DefaultTheme; export const GlobalOthersTheme = (state) => state.theme.OthersTheme; export const GlobalSelectedTheme = (state) => state.theme.SelectedTheme; diff --git a/src/Pages/DeliveryChallanToInvoice/DeliveryChallanToInvoiceList.jsx b/src/Pages/DeliveryChallanToInvoice/DeliveryChallanToInvoiceList.jsx index c83cdc9..ed3e4c3 100644 --- a/src/Pages/DeliveryChallanToInvoice/DeliveryChallanToInvoiceList.jsx +++ b/src/Pages/DeliveryChallanToInvoice/DeliveryChallanToInvoiceList.jsx @@ -23,7 +23,7 @@ import { Emailsend } from "../../Features/PurchaseOrder/PurchaseOrder"; import './DeliveryChallanToInvoice.scss' import { settingDataSelector } from "../../Features/PreferenceMaster/PreferenceMaster"; import { getBranchDetail } from "../../Features/BrachLogin/BranchLogin"; -import { getPrintSelectionComponentData, GlobalprintDatas, SelectedPrintTemplate } from "../../Features/ThemeChange/ThemeChange"; +import { getPrintSelectionComponentData, GlobalDCtoInvoicePrint, GlobalprintDatas, SelectedPrintTemplate } from "../../Features/ThemeChange/ThemeChange"; import { printDCToInvoiceStyles } from "./PrintTemplates/printDCToInvoiceStyles"; import { isMobile } from "react-device-detect"; import { DCMobilePdfPrint } from "./PrintTemplates/DCMobilePdfPrint"; @@ -48,7 +48,7 @@ const DeliveryChallanToInvoiceList = () => { const UserType = getSession("UserType"); const SettingDataSelector = useSelector(PreferenceData); const printerTemplateStyle = useSelector(SelectedPrintTemplate); - const printDatas = useSelector(GlobalprintDatas); + const printDatas = useSelector(GlobalDCtoInvoicePrint); const [page, setPage] = useState(1); const [empData, setEmpData] = useState(); const [addnewAccess, setaddnewAccess] = useState(true); diff --git a/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice1.jsx b/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice1.jsx index abfa699..250c566 100644 --- a/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice1.jsx +++ b/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice1.jsx @@ -1,6 +1,6 @@ import React, { useMemo } from "react"; import { useSelector } from "react-redux"; -import { GloabalFieldDetails } from "../../../Features/ThemeChange/ThemeChange"; +import { GloabalDCtoInvoiceFieldDetails, GloabalFieldDetails } from "../../../Features/ThemeChange/ThemeChange"; import { dateFormatChange1 } from "../../../Services/Others"; const PrintStyleDCToInvoice1 = ({ invoiceData, preference, printDatas }) => { @@ -17,8 +17,7 @@ const PrintStyleDCToInvoice1 = ({ invoiceData, preference, printDatas }) => { CustName, VehicleNo } = invoiceData; - - const fieldDetails = useSelector(GloabalFieldDetails); + const fieldDetails = useSelector(GloabalDCtoInvoiceFieldDetails); const signature = fieldDetails?.["signature"]; const termsAndConditions = fieldDetails?.["terms&conditions"]; const termsAndConditionsData = printDatas?.TermsandConditions; @@ -28,7 +27,6 @@ const PrintStyleDCToInvoice1 = ({ invoiceData, preference, printDatas }) => { const pageSize = printDatas?.PageSize; const branch = AddressDetails[0]; const logo = branch?.CompLogo; - const printGreeting = preference?.[0]?.SettingDtlDetails?.find( (i) => i.SettingIdName === 'PrintGreetings' ); @@ -54,9 +52,37 @@ const PrintStyleDCToInvoice1 = ({ invoiceData, preference, printDatas }) => { maxHeight: "97vh" }); + 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 headerStyle = { + backgroundColor: headerColor?.background, + color: headerColor?.font, + } + const tableHeaderStyle = { + backgroundColor: tableHeaderColor?.background, + color: tableHeaderColor?.font, + } + const tableBodyStyle = { + backgroundColor: tableBodyColor?.background, + color: tableBodyColor?.font, + } + const rowtypeStyle = tableBodyColor?.rowType; + const footerColorStyle = { + backgroundColor: footerColor?.background, + color: footerColor?.font, + } + const netAmountStyle = { + backgroundColor: netAmtColor?.background, + color: netAmtColor?.font, + } + const HeaderSection = () => ( <> -
+

{ const renderFooter = () => ( <>
- + {(notesText || termsAndConditions || signature || printGreeting?.SettingValue === "Y") && ( <> -
+
+
{notesText &&

{notesText}

}
{termsAndConditions && termsAndConditionsData?.length > 0 && ( @@ -99,6 +126,7 @@ const PrintStyleDCToInvoice1 = ({ invoiceData, preference, printDatas }) => { {printGreeting?.SettingValue === "Y" && (
Thank You Visit Again
)} +
)} @@ -119,7 +147,7 @@ const PrintStyleDCToInvoice1 = ({ invoiceData, preference, printDatas }) => { >
{(chunkIndex === 0 || formatTheme) && } - + {!formatTheme && isFinalFooterPage && renderFooter()}
{formatTheme && isFinalFooterPage &&
{renderFooter()}
} @@ -129,7 +157,7 @@ const PrintStyleDCToInvoice1 = ({ invoiceData, preference, printDatas }) => { ) : (
- + {renderFooter()}
)} @@ -141,8 +169,8 @@ export default PrintStyleDCToInvoice1; // -------------------- COMPONENTS -------------------- -const Header = ({ logo, branch }) => ( -
+const Header = ({ logo, branch, headerStyle }) => ( +
{/* {logo && {`${branch?.CompName}} */}
{branch.CompName}
@@ -172,7 +200,7 @@ const InvoiceMeta = ({ InvoiceNo, DCNo, InvoiceDate, CustMobile, VehicleNo, Cust
); -const ProductTable = ({ data }) => { +const ProductTable = ({ data, tableHeaderStyle, tableBodyStyle, rowtypeStyle }) => { const columns = [ { label: "S.No", key: "sno", width: "5%" }, { label: "Product", key: "ProdName", width: "20%" }, @@ -186,7 +214,7 @@ const ProductTable = ({ data }) => { return ( - + {columns.map(col => ( ))} @@ -194,7 +222,18 @@ const ProductTable = ({ data }) => { {data.map((prod, index) => ( - + @@ -209,8 +248,8 @@ const ProductTable = ({ data }) => { ); }; -const Summary = ({ TotalAmount, TaxAmount, GrandTotal }) => ( -
+const Summary = ({ TotalAmount, TaxAmount, GrandTotal,netAmountStyle }) => ( +
Subtotal: ₹ {TotalAmount.toFixed(2)}
Tax Amount: ₹ {TaxAmount.toFixed(2)}
Grand Total: ₹ {GrandTotal.toFixed(2)}
diff --git a/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice10.jsx b/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice10.jsx index d57e284..63b603e 100644 --- a/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice10.jsx +++ b/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice10.jsx @@ -1,6 +1,6 @@ import { useMemo } from "react"; import { useSelector } from "react-redux"; -import { GloabalFieldDetails } from "../../../Features/ThemeChange/ThemeChange"; // Fix typo if needed +import { GloabalDCtoInvoiceFieldDetails, GloabalFieldDetails } from "../../../Features/ThemeChange/ThemeChange"; // Fix typo if needed import { dateFormatChange1 } from "../../../Services/Others"; const PrintStyleDCToInvoice10 = ({ invoiceData, preference, printDatas }) => { @@ -18,7 +18,7 @@ const PrintStyleDCToInvoice10 = ({ invoiceData, preference, printDatas }) => { VehicleNo } = invoiceData; - const fieldDetails = useSelector(GloabalFieldDetails); + const fieldDetails = useSelector(GloabalDCtoInvoiceFieldDetails); const signature = fieldDetails?.["signature"]; const termsAndConditions = fieldDetails?.["terms&conditions"]; const termsAndConditionsData = printDatas?.TermsandConditions; @@ -52,9 +52,36 @@ const PrintStyleDCToInvoice10 = ({ invoiceData, preference, printDatas }) => { height: pageSize === "A5" ? "170mm" : "98vh", maxHeight: "98vh" }); + 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 headerStyle = { + backgroundColor: headerColor?.background, + color: headerColor?.font, + } + const tableHeaderStyle = { + backgroundColor: tableHeaderColor?.background, + color: tableHeaderColor?.font, + } + const tableBodyStyle = { + backgroundColor: tableBodyColor?.background, + color: tableBodyColor?.font, + } + const rowtypeStyle = tableBodyColor?.rowType; + const footerColorStyle = { + backgroundColor: footerColor?.background, + color: footerColor?.font, + } + const netAmountStyle = { + backgroundColor: netAmtColor?.background, + color: netAmtColor?.font, + } const renderFooter = () => ( -
+
{(notesText || termsAndConditions || signature || printGreeting?.SettingValue === "Y") && ( <> {notesText &&

{notesText}

} @@ -95,6 +122,7 @@ const PrintStyleDCToInvoice10 = ({ invoiceData, preference, printDatas }) => { DCNo={DCNo} InvoiceDate={InvoiceDate} VehicleNo={VehicleNo} + headerStyle={headerStyle} /> ); @@ -113,13 +141,14 @@ const PrintStyleDCToInvoice10 = ({ invoiceData, preference, printDatas }) => { >
{(chunkIndex === 0 || formatTheme) && } - + {isLastPage && ( <> { ) : (
- + {renderFooter()} @@ -154,8 +184,8 @@ export default PrintStyleDCToInvoice10; // COMPONENTS -const Header = ({ branch, InvoiceNo, DCNo, InvoiceDate, VehicleNo }) => ( -
+const Header = ({ branch, InvoiceNo, DCNo, InvoiceDate, VehicleNo,headerStyle }) => ( +
{branch?.CompName}
{branch?.Address1}-{branch?.City}-{branch?.Zip}
@@ -176,7 +206,7 @@ const Header = ({ branch, InvoiceNo, DCNo, InvoiceDate, VehicleNo }) => (
); -const ProductTable = ({ data }) => { +const ProductTable = ({ data,tableHeaderStyle,tableBodyStyle,rowtypeStyle }) => { const columns = [ { label: "S.No", key: "sno", width: "5%", align: 'center' }, { label: "Product", key: "ProdName", width: "35%", align: 'center' }, @@ -188,9 +218,9 @@ const ProductTable = ({ data }) => { ]; return ( -
{col.label}
{index + 1} {prod.ProdName} {prod.ProdVariantName}
+
- + {columns.map(col => ( ))} @@ -198,7 +228,18 @@ const ProductTable = ({ data }) => { {data.map((prod, index) => ( - + @@ -213,8 +254,8 @@ const ProductTable = ({ data }) => { ); }; -const Summary = ({ TotalAmount, TaxAmount, GrandTotal }) => ( -
+const Summary = ({ TotalAmount, TaxAmount, GrandTotal,netAmountStyle }) => ( +
Subtotal :
₹ {TotalAmount.toFixed(2)}
diff --git a/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice11.jsx b/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice11.jsx index b55fc08..08df8ac 100644 --- a/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice11.jsx +++ b/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice11.jsx @@ -1,6 +1,6 @@ import { useMemo } from "react"; import { useSelector } from "react-redux"; -import { GloabalFieldDetails } from "../../../Features/ThemeChange/ThemeChange"; +import { GloabalDCtoInvoiceFieldDetails, GloabalFieldDetails } from "../../../Features/ThemeChange/ThemeChange"; import { dateFormatChange1 } from "../../../Services/Others"; @@ -19,7 +19,7 @@ const PrintStyleDCToInvoice11 = ({ invoiceData, preference, printDatas }) => { VehicleNo } = invoiceData; - const fieldDetails = useSelector(GloabalFieldDetails); + const fieldDetails = useSelector(GloabalDCtoInvoiceFieldDetails); const signature = fieldDetails?.["signature"]; const termsAndConditions = fieldDetails?.["terms&conditions"]; const termsAndConditionsData = printDatas?.TermsandConditions; @@ -53,9 +53,36 @@ const PrintStyleDCToInvoice11 = ({ invoiceData, preference, printDatas }) => { height: pageSize === "A5" ? "170mm" : "98vh", maxHeight: "98vh" }); + 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 headerStyle = { + backgroundColor: headerColor?.background, + color: headerColor?.font, + } + const tableHeaderStyle = { + backgroundColor: tableHeaderColor?.background, + color: tableHeaderColor?.font, + } + const tableBodyStyle = { + backgroundColor: tableBodyColor?.background, + color: tableBodyColor?.font, + } + const rowtypeStyle = tableBodyColor?.rowType; + const footerColorStyle = { + backgroundColor: footerColor?.background, + color: footerColor?.font, + } + const netAmountStyle = { + backgroundColor: netAmtColor?.background, + color: netAmtColor?.font, + } const renderFooter = () => ( -
+
{(notesText || termsAndConditions || signature || printGreeting?.SettingValue === "Y") && ( <> {notesText &&

{notesText}

} @@ -94,6 +121,7 @@ const PrintStyleDCToInvoice11 = ({ invoiceData, preference, printDatas }) => { branch={branch} InvoiceNo={InvoiceNo} DCNo={DCNo} + headerStyle={headerStyle} /> ); @@ -112,13 +140,14 @@ const PrintStyleDCToInvoice11 = ({ invoiceData, preference, printDatas }) => { >
{(chunkIndex === 0 || formatTheme) && } - + {isLastPage && ( <> { ) : (
- + ( -
-
+const Header = ({ branch, InvoiceNo, DCNo,headerStyle }) => ( +
+
{branch?.CompName}
@@ -181,7 +211,7 @@ const Header = ({ branch, InvoiceNo, DCNo }) => (
); -const ProductTable = ({ data }) => { +const ProductTable = ({ data ,tableHeaderStyle,tableBodyStyle,rowtypeStyle}) => { const columns = [ { label: "S.No", key: "sno", width: "5%", align: 'center' }, { label: "Product", key: "ProdName", width: "35%", align: 'center' }, @@ -193,9 +223,9 @@ const ProductTable = ({ data }) => { ]; return ( -
{col.label}
{index + 1} {prod.ProdName} {prod.ProdVariantName}
+
- + {columns.map(col => ( ))} @@ -203,7 +233,17 @@ const ProductTable = ({ data }) => { {data.map((prod, index) => ( - + @@ -218,8 +258,8 @@ const ProductTable = ({ data }) => { ); }; -const Summary = ({ TotalAmount, TaxAmount, GrandTotal }) => ( -
+const Summary = ({ TotalAmount, TaxAmount, GrandTotal ,netAmountStyle}) => ( +
Subtotal
₹ {TotalAmount.toFixed(2)}
diff --git a/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice12.jsx b/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice12.jsx index 8c348b2..1b110a2 100644 --- a/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice12.jsx +++ b/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice12.jsx @@ -1,6 +1,6 @@ import { useMemo } from "react"; import { useSelector } from "react-redux"; -import { GloabalFieldDetails } from "../../../Features/ThemeChange/ThemeChange"; +import { GloabalDCtoInvoiceFieldDetails, GloabalFieldDetails } from "../../../Features/ThemeChange/ThemeChange"; import { dateFormatChange1 } from "../../../Services/Others"; const PrintStyleDCToInvoice12 = ({ invoiceData, preference, printDatas }) => { @@ -18,7 +18,7 @@ const PrintStyleDCToInvoice12 = ({ invoiceData, preference, printDatas }) => { VehicleNo } = invoiceData; - const fieldDetails = useSelector(GloabalFieldDetails); + const fieldDetails = useSelector(GloabalDCtoInvoiceFieldDetails); const signature = fieldDetails?.["signature"]; const termsAndConditions = fieldDetails?.["terms&conditions"]; const termsAndConditionsData = printDatas?.TermsandConditions; @@ -45,6 +45,33 @@ const PrintStyleDCToInvoice12 = ({ invoiceData, preference, printDatas }) => { const lastChunkRows = paginatedChunks.at(-1)?.length || 0; const shouldFooterBeOnNewPage = lastChunkRows > (pageSize === "A5" ? 5 : 10); + 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 headerStyle = { + backgroundColor: headerColor?.background, + color: headerColor?.font, + } + const tableHeaderStyle = { + backgroundColor: tableHeaderColor?.background, + color: tableHeaderColor?.font, + } + const tableBodyStyle = { + backgroundColor: tableBodyColor?.background, + color: tableBodyColor?.font, + } + const rowtypeStyle = tableBodyColor?.rowType; + const footerColorStyle = { + backgroundColor: footerColor?.background, + color: footerColor?.font, + } + const netAmountStyle = { + backgroundColor: netAmtColor?.background, + color: netAmtColor?.font, + } const getPageStyle = (isFinalFooterPage) => ({ display: "flex", @@ -55,7 +82,7 @@ const PrintStyleDCToInvoice12 = ({ invoiceData, preference, printDatas }) => { }); const renderFooter = () => ( -
+
{(notesText || termsAndConditions || signature || printGreeting?.SettingValue === "Y") && ( <> {notesText &&

{notesText}

} @@ -99,6 +126,7 @@ const PrintStyleDCToInvoice12 = ({ invoiceData, preference, printDatas }) => { DCNo={DCNo} InvoiceDate={InvoiceDate} VehicleNo={VehicleNo} + headerStyle={headerStyle} /> ); @@ -117,7 +145,7 @@ const PrintStyleDCToInvoice12 = ({ invoiceData, preference, printDatas }) => { >
{(chunkIndex === 0 || formatTheme) && } - + {isLastPage && ( <>
@@ -125,6 +153,7 @@ const PrintStyleDCToInvoice12 = ({ invoiceData, preference, printDatas }) => { TotalAmount={TotalAmount} TaxAmount={TaxAmount} GrandTotal={GrandTotal} + netAmountStyle={netAmountStyle} />
@@ -138,12 +167,13 @@ const PrintStyleDCToInvoice12 = ({ invoiceData, preference, printDatas }) => { ) : (
- +

{renderFooter()} @@ -157,8 +187,8 @@ export default PrintStyleDCToInvoice12; // COMPONENTS -const Header = ({ CustMobile, CustName, logo, branch, InvoiceNo, DCNo, InvoiceDate, VehicleNo }) => ( -
+const Header = ({ CustMobile, CustName, logo, branch, InvoiceNo, DCNo, InvoiceDate, VehicleNo,headerStyle }) => ( +
{branch?.CompName}
@@ -184,7 +214,7 @@ const Header = ({ CustMobile, CustName, logo, branch, InvoiceNo, DCNo, InvoiceDa
); -const ProductTable = ({ data }) => { +const ProductTable = ({ data ,tableHeaderStyle,tableBodyStyle,rowtypeStyle}) => { const columns = [ { label: "S.No", key: "sno", width: "5%", align: 'center' }, { label: "Product", key: "ProdName", width: "35%", align: 'center' }, @@ -196,9 +226,9 @@ const ProductTable = ({ data }) => { ]; return ( -
{col.label}
{index + 1} {prod.ProdName} {prod.ProdVariantName}
+
- + {columns.map(col => ( ))} @@ -206,7 +236,17 @@ const ProductTable = ({ data }) => { {data.map((prod, index) => ( - + @@ -221,8 +261,8 @@ const ProductTable = ({ data }) => { ); }; -const Summary = ({ TotalAmount, TaxAmount, GrandTotal }) => ( -
+const Summary = ({ TotalAmount, TaxAmount, GrandTotal ,netAmountStyle}) => ( +
Subtotal
diff --git a/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice2.jsx b/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice2.jsx index 4cf7b7f..b2e16c7 100644 --- a/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice2.jsx +++ b/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice2.jsx @@ -1,8 +1,9 @@ import { useMemo } from "react"; import { useSelector } from "react-redux"; -import { GloabalFieldDetails } from "../../../Features/ThemeChange/ThemeChange"; +import { GloabalDCtoInvoiceFieldDetails, GloabalFieldDetails } from "../../../Features/ThemeChange/ThemeChange"; import { dateFormatChange1 } from "../../../Services/Others"; import { isMobile } from "react-device-detect"; +import { style } from "../../Product/Printstyles"; const PrintStyleDCToInvoice2 = ({ invoiceData, preference, printDatas }) => { const { @@ -19,7 +20,7 @@ const PrintStyleDCToInvoice2 = ({ invoiceData, preference, printDatas }) => { VehicleNo } = invoiceData; - const fieldDetails = useSelector(GloabalFieldDetails); + const fieldDetails = useSelector(GloabalDCtoInvoiceFieldDetails); const signature = fieldDetails?.["signature"]; const termsAndConditions = fieldDetails?.["terms&conditions"]; const termsAndConditionsData = printDatas?.TermsandConditions; @@ -46,6 +47,33 @@ const PrintStyleDCToInvoice2 = ({ invoiceData, preference, printDatas }) => { const lastChunkRows = paginatedChunks.at(-1)?.length || 0; const shouldFooterBeOnNewPage = lastChunkRows > (pageSize === "A5" ? 5 : 10); + 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 headerStyle = { + backgroundColor: headerColor?.background, + color: headerColor?.font, + } + const tableHeaderStyle = { + backgroundColor: tableHeaderColor?.background, + color: tableHeaderColor?.font, + } + const tableBodyStyle = { + backgroundColor: tableBodyColor?.background, + color: tableBodyColor?.font, + } + const rowtypeStyle = tableBodyColor?.rowType; + const footerColorStyle = { + backgroundColor: footerColor?.background, + color: footerColor?.font, + } + const netAmountStyle = { + backgroundColor: netAmtColor?.background, + color: netAmtColor?.font, + } const getPageStyle = (isFinalFooterPage) => ({ display: "flex", @@ -64,12 +92,13 @@ const PrintStyleDCToInvoice2 = ({ invoiceData, preference, printDatas }) => { DCNo={DCNo} InvoiceDate={InvoiceDate} VehicleNo={VehicleNo} + headerStyle={headerStyle} /> ); const renderFooter = () => ( -
+
{(notesText || termsAndConditions || signature || printGreeting?.SettingValue === "Y") && ( <>
@@ -115,13 +144,14 @@ const PrintStyleDCToInvoice2 = ({ invoiceData, preference, printDatas }) => { >
{(chunkIndex === 0 || formatTheme) && } - + {isLastPage && <>
{ ) : (
- +
( -
+const Header = ({ logo, branch, InvoiceNo, DCNo, InvoiceDate, VehicleNo,headerStyle }) => ( +
{logo && Company Logo}
@@ -184,7 +215,7 @@ const Header = ({ logo, branch, InvoiceNo, DCNo, InvoiceDate, VehicleNo }) => (
); -const ProductTable = ({ data }) => { +const ProductTable = ({ data ,tableHeaderStyle,tableBodyStyle,rowtypeStyle}) => { const columns = [ { label: "S.No", key: "sno", width: "5%" }, { label: "Product", key: "ProdName", width: "20%" }, @@ -199,7 +230,7 @@ const ProductTable = ({ data }) => { <>
{col.label}
{index + 1} {prod.ProdName} {prod.ProdVariantName}
- + {columns.map(col => ( ))} @@ -207,7 +238,18 @@ const ProductTable = ({ data }) => { {data.map((prod, index) => ( - + @@ -223,8 +265,8 @@ const ProductTable = ({ data }) => { ); }; -const Summary = ({ TotalAmount, TaxAmount, GrandTotal }) => ( -
+const Summary = ({ TotalAmount, TaxAmount, GrandTotal,netAmountStyle }) => ( +
Subtotal : diff --git a/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice3.jsx b/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice3.jsx index 4bc5ff1..368de3c 100644 --- a/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice3.jsx +++ b/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice3.jsx @@ -1,6 +1,6 @@ import { useMemo } from "react"; import { useSelector } from "react-redux"; -import { GloabalFieldDetails } from "../../../Features/ThemeChange/ThemeChange"; +import { GloabalDCtoInvoiceFieldDetails, GloabalFieldDetails } from "../../../Features/ThemeChange/ThemeChange"; import { dateFormatChange1 } from "../../../Services/Others"; const PrintStyleDCToInvoice3 = ({ invoiceData, preference, printDatas }) => { @@ -18,7 +18,7 @@ const PrintStyleDCToInvoice3 = ({ invoiceData, preference, printDatas }) => { VehicleNo } = invoiceData; - const fieldDetails = useSelector(GloabalFieldDetails); + const fieldDetails = useSelector(GloabalDCtoInvoiceFieldDetails); const signature = fieldDetails?.["signature"]; const termsAndConditions = fieldDetails?.["terms&conditions"]; const termsAndConditionsData = printDatas?.TermsandConditions; @@ -45,6 +45,34 @@ const PrintStyleDCToInvoice3 = ({ invoiceData, preference, printDatas }) => { const lastChunkRows = paginatedChunks.at(-1)?.length || 0; const shouldFooterBeOnNewPage = lastChunkRows > (pageSize === "A5" ? 5 : 10); + 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 headerStyle = { + backgroundColor: headerColor?.background, + color: headerColor?.font, + } + const tableHeaderStyle = { + backgroundColor: tableHeaderColor?.background, + color: tableHeaderColor?.font, + } + const tableBodyStyle = { + backgroundColor: tableBodyColor?.background, + color: tableBodyColor?.font, + } + const rowtypeStyle = tableBodyColor?.rowType; + const footerColorStyle = { + backgroundColor: footerColor?.background, + color: footerColor?.font, + } + const netAmountStyle = { + backgroundColor: netAmtColor?.background, + color: netAmtColor?.font, + } + const getPageStyle = (isFinalFooterPage) => ({ display: "flex", @@ -63,12 +91,13 @@ const PrintStyleDCToInvoice3 = ({ invoiceData, preference, printDatas }) => { DCNo={DCNo} InvoiceDate={InvoiceDate} VehicleNo={VehicleNo} + headerStyle={headerStyle} /> ); const renderFooter = () => ( -
+
{(notesText || termsAndConditions || signature || printGreeting?.SettingValue === "Y") && ( <> {notesText &&

{notesText}

} @@ -114,13 +143,14 @@ const PrintStyleDCToInvoice3 = ({ invoiceData, preference, printDatas }) => { >
{(chunkIndex === 0 || formatTheme) && } - + {isLastPage && <>
{ ) : (
- +
( -
+const Header = ({ branch, InvoiceNo, DCNo, InvoiceDate, VehicleNo ,headerStyle}) => ( +
{branch?.CompName}
{branch?.Address1}-{branch?.City}-{branch?.Zip}
@@ -181,7 +212,7 @@ const Header = ({ branch, InvoiceNo, DCNo, InvoiceDate, VehicleNo }) => (
); -const ProductTable = ({ data }) => { +const ProductTable = ({ data ,tableHeaderStyle,tableBodyStyle,rowtypeStyle}) => { const columns = [ { label: "S.No", key: "sno", width: "5%", align: 'center' }, { label: "Product", key: "ProdName", width: "20%" }, @@ -196,7 +227,7 @@ const ProductTable = ({ data }) => { <>
{col.label}
{index + 1} {prod.ProdName} {prod.ProdVariantName}
- + {columns.map(col => ( ))} @@ -204,7 +235,18 @@ const ProductTable = ({ data }) => { {data.map((prod, index) => ( - + @@ -220,8 +262,8 @@ const ProductTable = ({ data }) => { ); }; -const Summary = ({ TotalAmount, TaxAmount, GrandTotal }) => ( -
+const Summary = ({ TotalAmount, TaxAmount, GrandTotal,netAmountStyle }) => ( +
Subtotal:
₹ {TotalAmount.toFixed(2)}
diff --git a/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice4.jsx b/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice4.jsx index 432edc1..a7d6803 100644 --- a/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice4.jsx +++ b/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice4.jsx @@ -1,6 +1,6 @@ import { useMemo } from "react"; import { useSelector } from "react-redux"; -import { GloabalFieldDetails } from "../../../Features/ThemeChange/ThemeChange"; +import { GloabalDCtoInvoiceFieldDetails, GloabalFieldDetails } from "../../../Features/ThemeChange/ThemeChange"; import { dateFormatChange1 } from "../../../Services/Others"; const PrintStyleDCToInvoice4 = ({ invoiceData, preference, printDatas }) => { @@ -18,7 +18,7 @@ const PrintStyleDCToInvoice4 = ({ invoiceData, preference, printDatas }) => { VehicleNo } = invoiceData; - const fieldDetails = useSelector(GloabalFieldDetails); + const fieldDetails = useSelector(GloabalDCtoInvoiceFieldDetails); const signature = fieldDetails?.["signature"]; const termsAndConditions = fieldDetails?.["terms&conditions"]; const termsAndConditionsData = printDatas?.TermsandConditions; @@ -54,6 +54,35 @@ const PrintStyleDCToInvoice4 = ({ invoiceData, preference, printDatas }) => { maxHeight: "97vh" }); + 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 headerStyle = { + backgroundColor: headerColor?.background, + color: headerColor?.font, + } + const tableHeaderStyle = { + backgroundColor: tableHeaderColor?.background, + color: tableHeaderColor?.font, + } + const tableBodyStyle = { + backgroundColor: tableBodyColor?.background, + color: tableBodyColor?.font, + } + const rowtypeStyle = tableBodyColor?.rowType; + const footerColorStyle = { + backgroundColor: footerColor?.background, + color: footerColor?.font, + } + const netAmountStyle = { + backgroundColor: netAmtColor?.background, + color: netAmtColor?.font, + } + + const HeaderSection = () => ( <>
{ DCNo={DCNo} InvoiceDate={InvoiceDate} VehicleNo={VehicleNo} + headerStyle={headerStyle} /> ); const renderFooter = () => ( -
+
{(notesText || termsAndConditions || signature || printGreeting?.SettingValue === "Y") && ( <> {notesText &&

{notesText}

} @@ -114,13 +144,14 @@ const PrintStyleDCToInvoice4 = ({ invoiceData, preference, printDatas }) => { >
{(chunkIndex === 0 || formatTheme) && } - + {isLastPage && <>

{ ) : (
- +

( -
+const Header = ({ branch, InvoiceNo, DCNo, InvoiceDate, VehicleNo,headerStyle }) => ( +
{branch?.CompName}
{branch?.Address1}-{branch?.City}-{branch?.Zip}
@@ -182,7 +214,7 @@ const Header = ({ branch, InvoiceNo, DCNo, InvoiceDate, VehicleNo }) => (
); -const ProductTable = ({ data }) => { +const ProductTable = ({ data ,tableHeaderStyle,tableBodyStyle,rowtypeStyle}) => { const columns = [ { label: "S.No", key: "sno", width: "5%" }, { label: "Product", key: "ProdName", width: "20%", align: 'center' }, @@ -197,7 +229,7 @@ const ProductTable = ({ data }) => { <>
{col.label}
{index + 1} {prod.ProdName} {prod.ProdVariantName}
- + {columns.map(col => ( ))} @@ -205,7 +237,17 @@ const ProductTable = ({ data }) => { {data.map((prod, index) => ( - + @@ -221,8 +263,8 @@ const ProductTable = ({ data }) => { ); }; -const Summary = ({ TotalAmount, TaxAmount, GrandTotal }) => ( -
+const Summary = ({ TotalAmount, TaxAmount, GrandTotal,netAmountStyle }) => ( +
Subtotal : diff --git a/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice5.jsx b/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice5.jsx index 89f883a..cf8063e 100644 --- a/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice5.jsx +++ b/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice5.jsx @@ -1,6 +1,6 @@ import { useMemo } from "react"; import { useSelector } from "react-redux"; -import { GloabalFieldDetails } from "../../../Features/ThemeChange/ThemeChange"; +import { GloabalDCtoInvoiceFieldDetails, GloabalFieldDetails } from "../../../Features/ThemeChange/ThemeChange"; import { dateFormatChange1 } from "../../../Services/Others"; const PrintStyleDCToInvoice5 = ({ invoiceData, preference, printDatas }) => { @@ -18,7 +18,7 @@ const PrintStyleDCToInvoice5 = ({ invoiceData, preference, printDatas }) => { VehicleNo } = invoiceData; - const fieldDetails = useSelector(GloabalFieldDetails); + const fieldDetails = useSelector(GloabalDCtoInvoiceFieldDetails); const signature = fieldDetails?.["signature"]; const termsAndConditions = fieldDetails?.["terms&conditions"]; const termsAndConditionsData = printDatas?.TermsandConditions; @@ -45,6 +45,34 @@ const PrintStyleDCToInvoice5 = ({ invoiceData, preference, printDatas }) => { const lastChunkRows = paginatedChunks.at(-1)?.length || 0; const shouldFooterBeOnNewPage = lastChunkRows > (pageSize === "A5" ? 5 : 10); + 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 headerStyle = { + backgroundColor: headerColor?.background, + color: headerColor?.font, + } + const tableHeaderStyle = { + backgroundColor: tableHeaderColor?.background, + color: tableHeaderColor?.font, + } + const tableBodyStyle = { + backgroundColor: tableBodyColor?.background, + color: tableBodyColor?.font, + } + const rowtypeStyle = tableBodyColor?.rowType; + const footerColorStyle = { + backgroundColor: footerColor?.background, + color: footerColor?.font, + } + const netAmountStyle = { + backgroundColor: netAmtColor?.background, + color: netAmtColor?.font, + } + const getPageStyle = (isFinalFooterPage) => ({ display: "flex", flexDirection: "column", @@ -61,12 +89,13 @@ const PrintStyleDCToInvoice5 = ({ invoiceData, preference, printDatas }) => { DCNo={DCNo} InvoiceDate={InvoiceDate} VehicleNo={VehicleNo} + headerStyle={headerStyle} /> ); const renderFooter = () => ( -
+
{(notesText || termsAndConditions || signature || printGreeting?.SettingValue === "Y") && ( <> {notesText &&

{notesText}

} @@ -112,12 +141,13 @@ const PrintStyleDCToInvoice5 = ({ invoiceData, preference, printDatas }) => { >
{(chunkIndex === 0 || formatTheme) && } - + {isLastPage && <>
{ ) : (
- +
( -
+const Header = ({ branch, InvoiceNo, DCNo, InvoiceDate, VehicleNo,headerStyle }) => ( +
{branch?.CompName}
{branch?.Address1}-{branch?.City}-{branch?.Zip}
@@ -179,7 +210,7 @@ const Header = ({ branch, InvoiceNo, DCNo, InvoiceDate, VehicleNo }) => (
); -const ProductTable = ({ data }) => { +const ProductTable = ({ data ,tableHeaderStyle,tableBodyStyle,rowtypeStyle}) => { const columns = [ { label: "S.No", key: "sno", width: "5%", align: 'center' }, { label: "Product", key: "ProdName", width: "35%", align: 'center' }, @@ -194,7 +225,7 @@ const ProductTable = ({ data }) => { <>
{col.label}
{index + 1} {prod.ProdName} {prod.ProdVariantName}
- + {columns.map(col => ( ))} @@ -202,7 +233,17 @@ const ProductTable = ({ data }) => { {data.map((prod, index) => ( - + @@ -218,8 +259,8 @@ const ProductTable = ({ data }) => { ); }; -const Summary = ({ TotalAmount, TaxAmount, GrandTotal }) => ( -
+const Summary = ({ TotalAmount, TaxAmount, GrandTotal,netAmountStyle }) => ( +
Subtotal:
₹ {TotalAmount.toFixed(2)}
diff --git a/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice6.jsx b/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice6.jsx index aebd32b..7bf2976 100644 --- a/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice6.jsx +++ b/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice6.jsx @@ -1,6 +1,6 @@ import { useMemo } from "react"; import { useSelector } from "react-redux"; -import { GloabalFieldDetails } from "../../../Features/ThemeChange/ThemeChange"; +import { GloabalDCtoInvoiceFieldDetails, GloabalFieldDetails } from "../../../Features/ThemeChange/ThemeChange"; import { dateFormatChange1 } from "../../../Services/Others"; const PrintStyleDCToInvoice6 = ({ invoiceData, preference, printDatas }) => { @@ -18,7 +18,7 @@ const PrintStyleDCToInvoice6 = ({ invoiceData, preference, printDatas }) => { VehicleNo } = invoiceData; - const fieldDetails = useSelector(GloabalFieldDetails); + const fieldDetails = useSelector(GloabalDCtoInvoiceFieldDetails); const signature = fieldDetails?.["signature"]; const termsAndConditions = fieldDetails?.["terms&conditions"]; const termsAndConditionsData = printDatas?.TermsandConditions; @@ -44,6 +44,34 @@ const PrintStyleDCToInvoice6 = ({ invoiceData, preference, printDatas }) => { const lastChunkRows = paginatedChunks.at(-1)?.length || 0; const shouldFooterBeOnNewPage = lastChunkRows > (pageSize === "A5" ? 5 : 10); + 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 headerStyle = { + backgroundColor: headerColor?.background, + color: headerColor?.font, + } + const tableHeaderStyle = { + backgroundColor: tableHeaderColor?.background, + color: tableHeaderColor?.font, + } + const tableBodyStyle = { + backgroundColor: tableBodyColor?.background, + color: tableBodyColor?.font, + } + const rowtypeStyle = tableBodyColor?.rowType; + const footerColorStyle = { + backgroundColor: footerColor?.background, + color: footerColor?.font, + } + const netAmountStyle = { + backgroundColor: netAmtColor?.background, + color: netAmtColor?.font, + } + const getPageStyle = (isFinalFooterPage) => ({ display: "flex", @@ -61,12 +89,13 @@ const PrintStyleDCToInvoice6 = ({ invoiceData, preference, printDatas }) => { DCNo={DCNo} InvoiceDate={InvoiceDate} VehicleNo={VehicleNo} + headerStyle={headerStyle} /> ); const renderFooter = () => ( -
+
{(notesText || termsAndConditions || signature || printGreeting?.SettingValue === "Y") && ( <> {notesText &&

{notesText}

} @@ -112,13 +141,14 @@ const PrintStyleDCToInvoice6 = ({ invoiceData, preference, printDatas }) => { >
{(chunkIndex === 0 || formatTheme) && } - + {isLastPage && <>
{ ) : (
- +
( -
+const Header = ({ branch, InvoiceNo, DCNo, InvoiceDate, VehicleNo,headerStyle }) => ( +
{branch?.CompName}
{branch?.Address1}-{branch?.City}-{branch?.Zip}
@@ -182,7 +213,7 @@ const Header = ({ branch, InvoiceNo, DCNo, InvoiceDate, VehicleNo }) => (
); -const ProductTable = ({ data }) => { +const ProductTable = ({ data ,tableHeaderStyle,tableBodyStyle,rowtypeStyle}) => { const columns = [ { label: "S.No", key: "sno", width: "5%", align: 'center' }, { label: "Product", key: "ProdName", width: "35%", align: 'center' }, @@ -197,7 +228,7 @@ const ProductTable = ({ data }) => { <>
{col.label}
{index + 1} {prod.ProdName} {prod.ProdVariantName}
- + {columns.map(col => ( ))} @@ -205,7 +236,17 @@ const ProductTable = ({ data }) => { {data.map((prod, index) => ( - + @@ -221,8 +262,8 @@ const ProductTable = ({ data }) => { ); }; -const Summary = ({ TotalAmount, TaxAmount, GrandTotal }) => ( -
+const Summary = ({ TotalAmount, TaxAmount, GrandTotal,netAmountStyle }) => ( +
Subtotal: ₹ {TotalAmount.toFixed(2)}
Tax Amount: ₹ {TaxAmount.toFixed(2)}
diff --git a/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice7.jsx b/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice7.jsx index f14334f..f1dee48 100644 --- a/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice7.jsx +++ b/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice7.jsx @@ -1,6 +1,6 @@ import { useMemo } from "react"; import { useSelector } from "react-redux"; -import { GloabalFieldDetails } from "../../../Features/ThemeChange/ThemeChange"; // Fix typo if needed +import { GloabalDCtoInvoiceFieldDetails, GloabalFieldDetails } from "../../../Features/ThemeChange/ThemeChange"; // Fix typo if needed import { dateFormatChange1 } from "../../../Services/Others"; const PrintStyleDCToInvoice7 = ({ invoiceData, preference, printDatas }) => { @@ -18,7 +18,7 @@ const PrintStyleDCToInvoice7 = ({ invoiceData, preference, printDatas }) => { VehicleNo } = invoiceData; - const fieldDetails = useSelector(GloabalFieldDetails); + const fieldDetails = useSelector(GloabalDCtoInvoiceFieldDetails); const signature = fieldDetails?.["signature"]; const termsAndConditions = fieldDetails?.["terms&conditions"]; const termsAndConditionsData = printDatas?.TermsandConditions; @@ -53,8 +53,35 @@ const PrintStyleDCToInvoice7 = ({ invoiceData, preference, printDatas }) => { maxHeight: "98vh" }); + 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 headerStyle = { + backgroundColor: headerColor?.background, + color: headerColor?.font, + } + const tableHeaderStyle = { + backgroundColor: tableHeaderColor?.background, + color: tableHeaderColor?.font, + } + const tableBodyStyle = { + backgroundColor: tableBodyColor?.background, + color: tableBodyColor?.font, + } + const rowtypeStyle = tableBodyColor?.rowType; + const footerColorStyle = { + backgroundColor: footerColor?.background, + color: footerColor?.font, + } + const netAmountStyle = { + backgroundColor: netAmtColor?.background, + color: netAmtColor?.font, + } const renderFooter = () => ( -
+
{(notesText || termsAndConditions || signature || printGreeting?.SettingValue === "Y") && ( <> {notesText &&

{notesText}

} @@ -95,6 +122,7 @@ const PrintStyleDCToInvoice7 = ({ invoiceData, preference, printDatas }) => { DCNo={DCNo} InvoiceDate={InvoiceDate} VehicleNo={VehicleNo} + headerStyle={headerStyle} /> ); @@ -245,13 +273,14 @@ const PrintStyleDCToInvoice7 = ({ invoiceData, preference, printDatas }) => { >
{(chunkIndex === 0 || formatTheme) && } - + {isLastPage && ( <>
{ ) : (
- +
@@ -288,12 +318,12 @@ export default PrintStyleDCToInvoice7; // COMPONENTS -const Header = ({ branch, InvoiceNo, DCNo, InvoiceDate, VehicleNo }) => ( -
+const Header = ({ branch, InvoiceNo, DCNo, InvoiceDate, VehicleNo,headerStyle }) => ( +
********************************************************
-
+
{branch?.CompName}
{branch?.Address1}-{branch?.City}-{branch?.Zip}
Mobile : {branch?.BrMobile}
@@ -316,7 +346,7 @@ const Header = ({ branch, InvoiceNo, DCNo, InvoiceDate, VehicleNo }) => (
); -const ProductTable = ({ data }) => { +const ProductTable = ({ data,tableHeaderStyle,tableBodyStyle,rowtypeStyle }) => { const columns = [ { label: "S.No", key: "sno", width: "5%", align: 'center' }, { label: "Product", key: "ProdName", width: "35%", align: 'center' }, @@ -328,9 +358,10 @@ const ProductTable = ({ data }) => { ]; return ( -
{col.label}
{index + 1} {prod.ProdName} {prod.ProdVariantName}
+ //
+
- + {columns.map(col => ( ))} @@ -338,7 +369,18 @@ const ProductTable = ({ data }) => { {data.map((prod, index) => ( - + @@ -353,8 +395,8 @@ const ProductTable = ({ data }) => { ); }; -const Summary = ({ TotalAmount, TaxAmount, GrandTotal }) => ( -
+const Summary = ({ TotalAmount, TaxAmount, GrandTotal,netAmountStyle }) => ( +
Subtotal: ₹ {TotalAmount.toFixed(2)}
Tax Amount: ₹ {TaxAmount.toFixed(2)}
diff --git a/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice8.jsx b/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice8.jsx index df615aa..6b02227 100644 --- a/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice8.jsx +++ b/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice8.jsx @@ -1,6 +1,6 @@ import { useMemo } from "react"; import { useSelector } from "react-redux"; -import { GloabalFieldDetails } from "../../../Features/ThemeChange/ThemeChange"; // Fix typo if needed +import { GloabalDCtoInvoiceFieldDetails, GloabalFieldDetails } from "../../../Features/ThemeChange/ThemeChange"; // Fix typo if needed import { dateFormatChange1 } from "../../../Services/Others"; const PrintStyleDCToInvoice8 = ({ invoiceData, preference, printDatas }) => { @@ -18,7 +18,7 @@ const PrintStyleDCToInvoice8 = ({ invoiceData, preference, printDatas }) => { VehicleNo } = invoiceData; - const fieldDetails = useSelector(GloabalFieldDetails); + const fieldDetails = useSelector(GloabalDCtoInvoiceFieldDetails); const signature = fieldDetails?.["signature"]; const termsAndConditions = fieldDetails?.["terms&conditions"]; const termsAndConditionsData = printDatas?.TermsandConditions; @@ -52,9 +52,36 @@ const PrintStyleDCToInvoice8 = ({ invoiceData, preference, printDatas }) => { height: pageSize === "A5" ? "170mm" : "98vh", maxHeight: "98vh" }); + 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 headerStyle = { + backgroundColor: headerColor?.background, + color: headerColor?.font, + } + const tableHeaderStyle = { + backgroundColor: tableHeaderColor?.background, + color: tableHeaderColor?.font, + } + const tableBodyStyle = { + backgroundColor: tableBodyColor?.background, + color: tableBodyColor?.font, + } + const rowtypeStyle = tableBodyColor?.rowType; + const footerColorStyle = { + backgroundColor: footerColor?.background, + color: footerColor?.font, + } + const netAmountStyle = { + backgroundColor: netAmtColor?.background, + color: netAmtColor?.font, + } const renderFooter = () => ( -
+
{(notesText || termsAndConditions || signature || printGreeting?.SettingValue === "Y") && ( <> {notesText &&

{notesText}

} @@ -92,6 +119,7 @@ const PrintStyleDCToInvoice8 = ({ invoiceData, preference, printDatas }) => { DCNo={DCNo} InvoiceDate={InvoiceDate} VehicleNo={VehicleNo} + headerStyle={headerStyle} /> ); @@ -110,7 +138,7 @@ const PrintStyleDCToInvoice8 = ({ invoiceData, preference, printDatas }) => { >
{(chunkIndex === 0 || formatTheme) && } - + {isLastPage && ( <>
@@ -118,6 +146,7 @@ const PrintStyleDCToInvoice8 = ({ invoiceData, preference, printDatas }) => { TotalAmount={TotalAmount} TaxAmount={TaxAmount} GrandTotal={GrandTotal} + netAmountStyle={netAmountStyle} />
{ ) : (
- +

@@ -155,8 +185,8 @@ export default PrintStyleDCToInvoice8; // COMPONENTS -const Header = ({ branch, InvoiceNo, DCNo, InvoiceDate, VehicleNo }) => ( -
+const Header = ({ branch, InvoiceNo, DCNo, InvoiceDate, VehicleNo,headerStyle }) => ( +
{branch?.CompName}
{branch?.Address1}-{branch?.City}-{branch?.Zip}
@@ -177,7 +207,7 @@ const Header = ({ branch, InvoiceNo, DCNo, InvoiceDate, VehicleNo }) => (
); -const ProductTable = ({ data }) => { +const ProductTable = ({ data,tableHeaderStyle,tableBodyStyle,rowtypeStyle }) => { const columns = [ { label: "S.No", key: "sno", width: "5%", align: 'center' }, { label: "Product", key: "ProdName", width: "35%", align: 'center' }, @@ -189,9 +219,9 @@ const ProductTable = ({ data }) => { ]; return ( -
{col.label}
{index + 1} {prod.ProdName} {prod.ProdVariantName}
+
- + {columns.map(col => ( ))} @@ -199,7 +229,18 @@ const ProductTable = ({ data }) => { {data.map((prod, index) => ( - + @@ -214,8 +255,8 @@ const ProductTable = ({ data }) => { ); }; -const Summary = ({ TotalAmount, TaxAmount, GrandTotal }) => ( -
+const Summary = ({ TotalAmount, TaxAmount, GrandTotal,netAmountStyle }) => ( +
Subtotal
: diff --git a/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice9.jsx b/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice9.jsx index dc77824..5b51526 100644 --- a/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice9.jsx +++ b/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoice9.jsx @@ -1,6 +1,6 @@ import { useMemo } from "react"; import { useSelector } from "react-redux"; -import { GloabalFieldDetails } from "../../../Features/ThemeChange/ThemeChange"; // Fix typo if needed +import { GloabalDCtoInvoiceFieldDetails, GloabalFieldDetails } from "../../../Features/ThemeChange/ThemeChange"; // Fix typo if needed import { dateFormatChange1 } from "../../../Services/Others"; const PrintStyleDCToInvoice9 = ({ invoiceData, preference, printDatas }) => { @@ -18,7 +18,7 @@ const PrintStyleDCToInvoice9 = ({ invoiceData, preference, printDatas }) => { VehicleNo } = invoiceData; - const fieldDetails = useSelector(GloabalFieldDetails); + const fieldDetails = useSelector(GloabalDCtoInvoiceFieldDetails); const signature = fieldDetails?.["signature"]; const termsAndConditions = fieldDetails?.["terms&conditions"]; const termsAndConditionsData = printDatas?.TermsandConditions; @@ -52,9 +52,36 @@ const PrintStyleDCToInvoice9 = ({ invoiceData, preference, printDatas }) => { height: pageSize === "A5" ? "170mm" : "98vh", maxHeight: "98vh" }); + 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 headerStyle = { + backgroundColor: headerColor?.background, + color: headerColor?.font, + } + const tableHeaderStyle = { + backgroundColor: tableHeaderColor?.background, + color: tableHeaderColor?.font, + } + const tableBodyStyle = { + backgroundColor: tableBodyColor?.background, + color: tableBodyColor?.font, + } + const rowtypeStyle = tableBodyColor?.rowType; + const footerColorStyle = { + backgroundColor: footerColor?.background, + color: footerColor?.font, + } + const netAmountStyle = { + backgroundColor: netAmtColor?.background, + color: netAmtColor?.font, + } const renderFooter = () => ( -
+
{(notesText || termsAndConditions || signature || printGreeting?.SettingValue === "Y") && ( <> {notesText &&

{notesText}

} @@ -101,6 +128,7 @@ const PrintStyleDCToInvoice9 = ({ invoiceData, preference, printDatas }) => { DCNo={DCNo} InvoiceDate={InvoiceDate} VehicleNo={VehicleNo} + headerStyle={headerStyle} /> ); @@ -119,13 +147,14 @@ const PrintStyleDCToInvoice9 = ({ invoiceData, preference, printDatas }) => { >
{(chunkIndex === 0 || formatTheme) && } - + {isLastPage && ( <>
{ ) : (
- +
@@ -164,8 +194,8 @@ export default PrintStyleDCToInvoice9; // COMPONENTS -const Header = ({ branch, InvoiceNo, DCNo, InvoiceDate, VehicleNo }) => ( -
+const Header = ({ branch, InvoiceNo, DCNo, InvoiceDate, VehicleNo,headerStyle }) => ( +
{branch?.CompName}
{branch?.Address1}-{branch?.City}-{branch?.Zip}
@@ -186,7 +216,7 @@ const Header = ({ branch, InvoiceNo, DCNo, InvoiceDate, VehicleNo }) => (
); -const ProductTable = ({ data }) => { +const ProductTable = ({ data,tableHeaderStyle,tableBodyStyle,rowtypeStyle }) => { const columns = [ { label: "S.No", key: "sno", width: "5%", align: 'center' }, { label: "Product", key: "ProdName", width: "35%", align: 'center' }, @@ -198,9 +228,9 @@ const ProductTable = ({ data }) => { ]; return ( -
{col.label}
{index + 1} {prod.ProdName} {prod.ProdVariantName}
+
- + {columns.map(col => ( ))} @@ -208,7 +238,18 @@ const ProductTable = ({ data }) => { {data.map((prod, index) => ( - + @@ -223,8 +264,8 @@ const ProductTable = ({ data }) => { ); }; -const Summary = ({ TotalAmount, TaxAmount, GrandTotal }) => ( -
+const Summary = ({ TotalAmount, TaxAmount, GrandTotal ,netAmountStyle}) => ( +
Subtotal :
₹ {TotalAmount.toFixed(2)}
diff --git a/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoiceA4.jsx b/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoiceA4.jsx index 0a51c21..716e6e2 100644 --- a/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoiceA4.jsx +++ b/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoiceA4.jsx @@ -1,6 +1,6 @@ import { useMemo } from "react"; import { useSelector } from "react-redux"; -import { GloabalFieldDetails } from "../../../Features/ThemeChange/ThemeChange"; +import { GloabalDCtoInvoiceFieldDetails, GloabalFieldDetails } from "../../../Features/ThemeChange/ThemeChange"; import { dateFormatChange1 } from "../../../Services/Others"; const PrintStyleDCToInvoiceA4 = ({ invoiceData, preference, printDatas }) => { @@ -18,7 +18,7 @@ const PrintStyleDCToInvoiceA4 = ({ invoiceData, preference, printDatas }) => { VehicleNo } = invoiceData; - const fieldDetails = useSelector(GloabalFieldDetails); + const fieldDetails = useSelector(GloabalDCtoInvoiceFieldDetails); const signature = fieldDetails?.["signature"]; const termsAndConditions = fieldDetails?.["terms&conditions"]; const termsAndConditionsData = printDatas?.TermsandConditions; @@ -45,6 +45,33 @@ const PrintStyleDCToInvoiceA4 = ({ invoiceData, preference, printDatas }) => { const lastChunkRows = paginatedChunks.at(-1)?.length || 0; const shouldFooterBeOnNewPage = lastChunkRows > (pageSize === "A5" ? 5 : 10); + 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 headerStyle = { + backgroundColor: headerColor?.background, + color: headerColor?.font, + } + const tableHeaderStyle = { + backgroundColor: tableHeaderColor?.background, + color: tableHeaderColor?.font, + } + const tableBodyStyle = { + backgroundColor: tableBodyColor?.background, + color: tableBodyColor?.font, + } + const rowtypeStyle = tableBodyColor?.rowType; + const footerColorStyle = { + backgroundColor: footerColor?.background, + color: footerColor?.font, + } + const netAmountStyle = { + backgroundColor: netAmtColor?.background, + color: netAmtColor?.font, + } const getPageStyle = (isFinalFooterPage) => ({ display: "flex", @@ -60,9 +87,10 @@ const PrintStyleDCToInvoiceA4 = ({ invoiceData, preference, printDatas }) => { TotalAmount={TotalAmount} TaxAmount={TaxAmount} GrandTotal={GrandTotal} + netAmountStyle={netAmountStyle} /> -
+
{(notesText || termsAndConditions || signature || printGreeting?.SettingValue === "Y") && ( <> {notesText && (<> @@ -108,6 +136,7 @@ const PrintStyleDCToInvoiceA4 = ({ invoiceData, preference, printDatas }) => { DCNo={DCNo} InvoiceDate={InvoiceDate} VehicleNo={VehicleNo} + headerStyle={headerStyle} /> ); @@ -126,7 +155,7 @@ const PrintStyleDCToInvoiceA4 = ({ invoiceData, preference, printDatas }) => { >
{(chunkIndex === 0 || formatTheme) && } - +
{!formatTheme && isFinalFooterPage && renderFooter()}
@@ -137,7 +166,7 @@ const PrintStyleDCToInvoiceA4 = ({ invoiceData, preference, printDatas }) => { ) : (
- +
{renderFooter()}
@@ -150,8 +179,8 @@ export default PrintStyleDCToInvoiceA4; // COMPONENTS -const Header = ({ logo, branch, InvoiceNo, DCNo, InvoiceDate, VehicleNo }) => ( -
+const Header = ({ logo, branch, InvoiceNo, DCNo, InvoiceDate, VehicleNo ,headerStyle}) => ( +
{branch?.CompName}
@@ -177,7 +206,7 @@ const Header = ({ logo, branch, InvoiceNo, DCNo, InvoiceDate, VehicleNo }) => (
); -const ProductTable = ({ data }) => { +const ProductTable = ({ data ,tableHeaderStyle,tableBodyStyle,rowtypeStyle}) => { const columns = [ { label: "S.No", key: "sno", width: "5%", align: 'center' }, { label: "Product", key: "ProdName", width: "35%", align: 'center' }, @@ -191,7 +220,7 @@ const ProductTable = ({ data }) => { return (
{col.label}
{index + 1} {prod.ProdName} {prod.ProdVariantName}
- + {columns.map(col => ( ))} @@ -199,7 +228,18 @@ const ProductTable = ({ data }) => { {data.map((prod, index) => ( - + @@ -214,8 +254,8 @@ const ProductTable = ({ data }) => { ); }; -const Summary = ({ TotalAmount, TaxAmount, GrandTotal }) => ( -
+const Summary = ({ TotalAmount, TaxAmount, GrandTotal,netAmountStyle }) => ( +
Subtotal :
₹ {TotalAmount.toFixed(2)}
@@ -224,7 +264,7 @@ const Summary = ({ TotalAmount, TaxAmount, GrandTotal }) => (
Tax Amount :
₹ {TaxAmount.toFixed(2)}
-
+
Grand Total :
₹ {GrandTotal.toFixed(2)}
diff --git a/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoiceA4Standard.jsx b/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoiceA4Standard.jsx index 5939f33..f9797dc 100644 --- a/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoiceA4Standard.jsx +++ b/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoiceA4Standard.jsx @@ -1,6 +1,6 @@ import React, { useMemo } from "react"; import { useSelector } from "react-redux"; -import { GloabalFieldDetails } from "../../../Features/ThemeChange/ThemeChange"; +import { GloabalDCtoInvoiceFieldDetails, GloabalFieldDetails } from "../../../Features/ThemeChange/ThemeChange"; import { dateFormatChange1 } from "../../../Services/Others"; const PrintStyleDCToInvoiceA4Standard = ({ invoiceData, preference, printDatas }) => { @@ -19,7 +19,7 @@ const PrintStyleDCToInvoiceA4Standard = ({ invoiceData, preference, printDatas } } = invoiceData; console.log(invoiceData, "invoiceData") - const fieldDetails = useSelector(GloabalFieldDetails); + const fieldDetails = useSelector(GloabalDCtoInvoiceFieldDetails); const signature = fieldDetails?.["signature"]; const termsAndConditions = fieldDetails?.["terms&conditions"]; const termsAndConditionsData = printDatas?.TermsandConditions; @@ -48,6 +48,33 @@ const PrintStyleDCToInvoiceA4Standard = ({ invoiceData, preference, printDatas } const lastChunkRows = paginatedChunks.at(-1)?.length || 0; const shouldFooterBeOnNewPage = lastChunkRows > (pageSize === "A5" ? 5 : 10); + 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 headerStyle = { + backgroundColor: headerColor?.background, + color: headerColor?.font, + } + const tableHeaderStyle = { + backgroundColor: tableHeaderColor?.background, + color: tableHeaderColor?.font, + } + const tableBodyStyle = { + backgroundColor: tableBodyColor?.background, + color: tableBodyColor?.font, + } + const rowtypeStyle = tableBodyColor?.rowType; + const footerColorStyle = { + backgroundColor: footerColor?.background, + color: footerColor?.font, + } + const netAmountStyle = { + backgroundColor: netAmtColor?.background, + color: netAmtColor?.font, + } const getPageStyle = (isFinalFooterPage) => ({ display: "flex", @@ -67,6 +94,7 @@ const PrintStyleDCToInvoiceA4Standard = ({ invoiceData, preference, printDatas } CustMobile={CustMobile} CustName={CustName} VehicleNo={VehicleNo} + headerStyle={headerStyle} /> ); @@ -86,7 +114,7 @@ const PrintStyleDCToInvoiceA4Standard = ({ invoiceData, preference, printDatas }
} {termsAndConditions && termsAndConditionsData?.length > 0 && ( -
+

Terms & Conditions

    {termsAndConditionsData.map((item, idx) => ( @@ -131,8 +159,8 @@ const PrintStyleDCToInvoiceA4Standard = ({ invoiceData, preference, printDatas } >
    {(chunkIndex === 0 || formatTheme) && } - - {isLastPage && } + + {isLastPage && } {!formatTheme && isFinalFooterPage && renderFooter()}
    {formatTheme && isFinalFooterPage &&
    {renderFooter()}
    } @@ -142,8 +170,8 @@ const PrintStyleDCToInvoiceA4Standard = ({ invoiceData, preference, printDatas } ) : (
    - - + + {renderFooter()}
    )} @@ -155,9 +183,9 @@ export default PrintStyleDCToInvoiceA4Standard; // -------------------- COMPONENTS -------------------- -const Header = ({ logo, branch }) => ( +const Header = ({ logo, branch,headerStyle }) => ( <> -
    +
    {/* {logo && {`${branch?.CompName}} */}
    {branch.CompName}
    @@ -227,7 +255,7 @@ const InvoiceAmountWords = ({ amount }) => { ); }; -const ProductTable = ({ data }) => { +const ProductTable = ({ data ,tableHeaderStyle,tableBodyStyle,rowtypeStyle}) => { const columns = [ { label: "S.No", key: "sno", width: "5%" }, { label: "Product", key: "ProdName", width: "20%" }, @@ -241,7 +269,7 @@ const ProductTable = ({ data }) => { return (
{col.label}
{index + 1} {prod.ProdName} {prod.ProdVariantName}
- + {columns.map(col => ( ))} @@ -249,7 +277,18 @@ const ProductTable = ({ data }) => { {data.map((prod, index) => ( - + @@ -264,9 +303,9 @@ const ProductTable = ({ data }) => { ); }; -const Summary = ({ bankDetails, TotalAmount, TaxAmount, GrandTotal }) => ( +const Summary = ({ bankDetails, TotalAmount, TaxAmount, GrandTotal ,netAmountStyle}) => ( <> -
+
Subtotal: ₹ {TotalAmount.toFixed(2)}
Tax Amount: ₹ {TaxAmount.toFixed(2)}
Grand Total: ₹ {GrandTotal.toFixed(2)}
diff --git a/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoiceA5.jsx b/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoiceA5.jsx index 2830b6d..4e6b83c 100644 --- a/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoiceA5.jsx +++ b/src/Pages/DeliveryChallanToInvoice/PrintTemplates/PrintStyleDCToInvoiceA5.jsx @@ -1,6 +1,6 @@ import { useMemo } from "react"; import { useSelector } from "react-redux"; -import { GloabalFieldDetails } from "../../../Features/ThemeChange/ThemeChange"; +import { GloabalDCtoInvoiceFieldDetails, GloabalFieldDetails } from "../../../Features/ThemeChange/ThemeChange"; import { dateFormatChange1 } from "../../../Services/Others"; const PrintStyleDCToInvoiceA5 = ({ invoiceData, preference, printDatas }) => { @@ -18,7 +18,7 @@ const PrintStyleDCToInvoiceA5 = ({ invoiceData, preference, printDatas }) => { VehicleNo } = invoiceData; - const fieldDetails = useSelector(GloabalFieldDetails); + const fieldDetails = useSelector(GloabalDCtoInvoiceFieldDetails); const signature = fieldDetails?.["signature"]; const termsAndConditions = fieldDetails?.["terms&conditions"]; const termsAndConditionsData = printDatas?.TermsandConditions; @@ -45,6 +45,33 @@ const PrintStyleDCToInvoiceA5 = ({ invoiceData, preference, printDatas }) => { const lastChunkRows = paginatedChunks.at(-1)?.length || 0; const shouldFooterBeOnNewPage = lastChunkRows > (pageSize === "A5" ? 5 : 10); + 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 headerStyle = { + backgroundColor: headerColor?.background, + color: headerColor?.font, + } + const tableHeaderStyle = { + backgroundColor: tableHeaderColor?.background, + color: tableHeaderColor?.font, + } + const tableBodyStyle = { + backgroundColor: tableBodyColor?.background, + color: tableBodyColor?.font, + } + const rowtypeStyle = tableBodyColor?.rowType; + const footerColorStyle = { + backgroundColor: footerColor?.background, + color: footerColor?.font, + } + const netAmountStyle = { + backgroundColor: netAmtColor?.background, + color: netAmtColor?.font, + } const getPageStyle = (isFinalFooterPage) => ({ display: "flex", @@ -60,10 +87,11 @@ const PrintStyleDCToInvoiceA5 = ({ invoiceData, preference, printDatas }) => { TotalAmount={TotalAmount} TaxAmount={TaxAmount} GrandTotal={GrandTotal} + netAmountStyle={netAmountStyle} />
-
+
{(notesText || termsAndConditions || signature || printGreeting?.SettingValue === "Y") && ( <> {notesText &&

{notesText}

} @@ -106,6 +134,7 @@ const PrintStyleDCToInvoiceA5 = ({ invoiceData, preference, printDatas }) => { DCNo={DCNo} InvoiceDate={InvoiceDate} VehicleNo={VehicleNo} + headerStyle={headerStyle} /> ); @@ -124,7 +153,7 @@ const PrintStyleDCToInvoiceA5 = ({ invoiceData, preference, printDatas }) => { >
{(chunkIndex === 0 || formatTheme) && } - +
{!formatTheme && isFinalFooterPage && renderFooter()}
@@ -135,7 +164,7 @@ const PrintStyleDCToInvoiceA5 = ({ invoiceData, preference, printDatas }) => { ) : (
- +
{renderFooter()}
@@ -148,8 +177,8 @@ export default PrintStyleDCToInvoiceA5; // COMPONENTS -const Header = ({ logo, branch, InvoiceNo, DCNo, InvoiceDate, VehicleNo }) => ( -
+const Header = ({ logo, branch, InvoiceNo, DCNo, InvoiceDate, VehicleNo ,headerStyle}) => ( +
{branch?.CompName}
@@ -175,7 +204,7 @@ const Header = ({ logo, branch, InvoiceNo, DCNo, InvoiceDate, VehicleNo }) => (
); -const ProductTable = ({ data }) => { +const ProductTable = ({ data ,tableHeaderStyle,tableBodyStyle,rowtypeStyle}) => { const columns = [ { label: "S.No", key: "sno", width: "5%", align: 'center' }, { label: "Product", key: "ProdName", width: "35%", align: 'center' }, @@ -189,7 +218,7 @@ const ProductTable = ({ data }) => { return (
{col.label}
{index + 1} {prod.ProdName} {prod.ProdVariantName}
- + {columns.map(col => ( ))} @@ -197,7 +226,18 @@ const ProductTable = ({ data }) => { {data.map((prod, index) => ( - + @@ -212,8 +252,8 @@ const ProductTable = ({ data }) => { ); }; -const Summary = ({ TotalAmount, TaxAmount, GrandTotal }) => ( -
+const Summary = ({ TotalAmount, TaxAmount, GrandTotal ,netAmountStyle}) => ( +
Subtotal :
₹ {TotalAmount.toFixed(2)}
@@ -222,7 +262,7 @@ const Summary = ({ TotalAmount, TaxAmount, GrandTotal }) => (
Tax Amount :
₹ {TaxAmount.toFixed(2)}
-
+
Grand Total :
₹ {GrandTotal.toFixed(2)}
diff --git a/src/Pages/DeliveryChallanToInvoice/PrintTemplates/TaxInvoicePrint.jsx b/src/Pages/DeliveryChallanToInvoice/PrintTemplates/TaxInvoicePrint.jsx index 99efee3..a8b0c3a 100644 --- a/src/Pages/DeliveryChallanToInvoice/PrintTemplates/TaxInvoicePrint.jsx +++ b/src/Pages/DeliveryChallanToInvoice/PrintTemplates/TaxInvoicePrint.jsx @@ -3,7 +3,7 @@ import { useSelector } from 'react-redux'; import { isMobile } from 'react-device-detect'; import { extractLastNumberOrderId } from '../../../Services/Others'; import moment from 'moment'; -import { GlobalPritdummyData } from '../../../Features/ThemeChange/ThemeChange'; +import { GloabalDCtoInvoiceFieldDetails, GlobalPritdummyData } from '../../../Features/ThemeChange/ThemeChange'; const TaxInvoicePrint = ({ index, @@ -16,8 +16,8 @@ const TaxInvoicePrint = ({ BranchData, printDatas, BankDetails -}) => { - const GlobaldummyData = useSelector(GlobalPritdummyData); +}) => { + const GlobaldummyData = useSelector(GloabalDCtoInvoiceFieldDetails); let BillName = printDatas?.PrintHdrName // Function to convert number to words const numberToWords = (num) => { @@ -52,9 +52,9 @@ const TaxInvoicePrint = ({ city: table2Data?.AddressDetails?.[0]?.City || "", state: table2Data?.AddressDetails?.[0]?.State || "", zip: table2Data?.AddressDetails?.[0]?.Zip || "" - }, + }, companyGSTIN: table2Data?.AddressDetails?.[0]?.CompGSTIN || BranchData?.BrGSTIN || "", - companyEmail: table2Data?.AddressDetails?.[0]?.companyEmail || BranchData?.companyEmail ||"", + companyEmail: table2Data?.AddressDetails?.[0]?.companyEmail || BranchData?.companyEmail || "", companyMobile: table2Data?.AddressDetails?.[0]?.BrMobile || "", companyMobile2: table2Data?.AddressDetails?.[0]?.BrMobile2 || "", @@ -67,7 +67,7 @@ const TaxInvoicePrint = ({ // Customer Details - mapped from A4Standard CustomerDetails array customerName: table2Data?.CustomerDetails?.[0]?.CustSuppName || table2Data?.CustName - || "", + || "", customerMobile: table2Data?.CustomerDetails?.[0]?.MobileNo || table2Data?.CustMobile || "", customerGSTIN: table2Data?.CustomerDetails?.[0]?.CustGSTNo || table2Data?.CustGSTIN || "", customerAddress: { @@ -82,20 +82,41 @@ const TaxInvoicePrint = ({ // Totals - mapped from A4Standard totalAmount: Number(table2Data?.BillAmount || table2Data?.TotalAmount || 0), taxAmount: Number(OrderDetailGST || ''), - grandTotal: Number(table2Data?.NetAmount || table2Data?.GrandTotal|| 0), + grandTotal: Number(table2Data?.NetAmount || table2Data?.GrandTotal || 0), totalBillAmount: Number(table2Data?.BillAmount || table2Data?.GrandTotal || 0), // Bank Details - mapped from A4Standard bankDetails: BankDetails?.[0] || "" }; - console.log(table2Data, "Date1Date1", invoiceData, ) + 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 headerStyle = { + backgroundColor: headerColor?.background, + color: headerColor?.font, + } + const tableHeaderStyle = { + backgroundColor: tableHeaderColor?.background, + color: tableHeaderColor?.font, + } + const tableBodyStyle = { + backgroundColor: tableBodyColor?.background, + color: tableBodyColor?.font, + } + const rowtypeStyle = tableBodyColor?.rowType; + const footerColorStyle = { + backgroundColor: footerColor?.background, + color: footerColor?.font, + } + const netAmountStyle = { + backgroundColor: netAmtColor?.background, + color: netAmtColor?.font, + } let PageSize = printDatas?.PageSize - - const TakeawayData = table2Data?.productDetails - - const DineInData = table2Data?.productDetails - const cgstTotal = OrderDetailGST && OrderDetailGST.length > 0 ? Number(OrderDetailGST.reduce((sum, item) => sum + (item.CGST || 0), 0))?.toFixed(2) : 0; @@ -135,7 +156,7 @@ const TaxInvoicePrint = ({ dataSource = []; } - console.log("Final DataSource:", table2Data, ); + console.log("Final DataSource:", table2Data,); const paginatedChunks = []; @@ -206,7 +227,7 @@ const TaxInvoicePrint = ({ {/* Header - Only on first page */} {isFirstPage && ( <> -
+

{table2Data?.OrderType === "E" ? "Estimate" : (BillName ? BillName : "Tax Invoice")}

@@ -233,10 +254,10 @@ const TaxInvoicePrint = ({ textAlign: 'left' }}> -
+
{invoiceData.companyName}
-
{invoiceData.companyspecname}
+
{invoiceData.companyspecname}
{invoiceData.companyAddress.address1}
{invoiceData.companyAddress.address2}
{invoiceData.companyAddress.city} {invoiceData.companyAddress.zip ? ` - ${invoiceData.companyAddress.zip}` : ""}
@@ -376,6 +397,7 @@ const TaxInvoicePrint = ({ // borderRight: '1px solid #000', borderBottom: '1px solid #000', borderTop: '1px solid #000', + ...tableHeaderStyle }}>
Sl.No
Description of Goods
@@ -394,6 +416,11 @@ const TaxInvoicePrint = ({ display: 'grid', gridTemplateColumns: '5% 40% 12% 10% 12% 8% 13%', // borderRight: '1px solid #000', + ...(index % 2 === 0 && rowtypeStyle === "even" + ? tableBodyStyle + : index % 2 === 1 && rowtypeStyle === "odd" + ? tableBodyStyle + : {}) }}>
{chunkIndex * chunkSize + index + 1}
@@ -432,7 +459,7 @@ const TaxInvoicePrint = ({
{/* CGST */} - {OrderDetailGST && OrderDetailGST.length > 0 &&
0 &&
{
- { OrderDetailGST && OrderDetailGST.length > 0 + {OrderDetailGST && OrderDetailGST.length > 0 ? Number(OrderDetailGST.reduce((sum, item) => sum + (item.CGST || 0), 0)).toLocaleString('en-IN', { minimumFractionDigits: 2, maximumFractionDigits: 2 }) : "0.00"}
}
} {/* SGST */} - { OrderDetailGST && OrderDetailGST.length > 0 &&
0 &&
} {/* IGST */} - { OrderDetailGST && OrderDetailGST.length > 0 && ( + {OrderDetailGST && OrderDetailGST.length > 0 && (
-
+
₹ {Number(invoiceData.grandTotal).toLocaleString('en-IN', { minimumFractionDigits: 2, maximumFractionDigits: 2 })}
@@ -804,6 +831,7 @@ const TaxInvoicePrint = ({ textAlign: 'center', fontSize: '10px', padding: '8px', + ...footerColorStyle }}>
This is a Computer Generated Invoice
diff --git a/src/Pages/DeliveryChallanToInvoice/PrintTemplates/printDCToInvoiceStyles.js b/src/Pages/DeliveryChallanToInvoice/PrintTemplates/printDCToInvoiceStyles.js index f3bd862..4b88e27 100644 --- a/src/Pages/DeliveryChallanToInvoice/PrintTemplates/printDCToInvoiceStyles.js +++ b/src/Pages/DeliveryChallanToInvoice/PrintTemplates/printDCToInvoiceStyles.js @@ -293,7 +293,7 @@ export const printDCToInvoiceStyles = (printStyle) => { } .header-section-wrapper { padding: 5px 0px; - background: #f3f3f3; + // background: #f3f3f3; border-radius: 1%; display: flex; flex-direction: column; @@ -435,7 +435,7 @@ export const printDCToInvoiceStyles = (printStyle) => { .invoice-head{ font-weight: light; font-size: 18px; - color: #5e5e5e; + // color: #5e5e5e; } .meta-info { margin-top: 1rem; @@ -453,7 +453,7 @@ export const printDCToInvoiceStyles = (printStyle) => { border-spacing: 0px 5px; } .product-table th { - background: #ebebebff; + // background: #ebebebff; padding: 4px; text-align: left; } @@ -583,7 +583,7 @@ export const printDCToInvoiceStyles = (printStyle) => { .invoice-head{ font-weight: light; font-size: 16px; - color: #5e5e5e; + // color: #5e5e5e; } .meta-info { display: flex; @@ -888,7 +888,7 @@ export const printDCToInvoiceStyles = (printStyle) => { text-align: center; } .header-section-wrapper { - background: #ccccccff; + // background: #ccccccff; font-size: 15px; font-weight: bold; display: flex; @@ -928,7 +928,7 @@ export const printDCToInvoiceStyles = (printStyle) => { .product-table th { padding: 4px; text-align: left; - background: #ccccccff; + // background: #ccccccff; } .product-table td { padding: 4px; @@ -1057,7 +1057,7 @@ export const printDCToInvoiceStyles = (printStyle) => { font-weight: bold; padding: 4px; text-align: left; - background: #ccccccff; + // background: #ccccccff; } .product-table td { padding: 4px; @@ -1153,7 +1153,7 @@ export const printDCToInvoiceStyles = (printStyle) => { } .header-section { text-align: center; - background: #dbdbdb; + // background: #dbdbdb; padding: 1px 8px; } .header-section-wrapper { @@ -1192,7 +1192,7 @@ export const printDCToInvoiceStyles = (printStyle) => { .product-table th { padding: 4px; text-align: left; - background: #ccccccff; + // background: #ccccccff; } .product-table td { padding: 4px; @@ -1297,7 +1297,7 @@ export const printDCToInvoiceStyles = (printStyle) => { margin-bottom: 8px; align-items: center; font-weight: 500; - background: #dbdbdb; + // background: #dbdbdb; } .header-company { font-size: 20px; @@ -1327,7 +1327,7 @@ export const printDCToInvoiceStyles = (printStyle) => { .product-table th { padding: 4px; text-align: left; - background: #ccccccff; + // background: #ccccccff; } .product-table td { padding: 4px; @@ -1436,7 +1436,7 @@ export const printDCToInvoiceStyles = (printStyle) => { width: 100%; font-size: 20px; font-weight: 600; - background: #dbdbdb; + // background: #dbdbdb; } .branch-address { margin: 5px 0px; @@ -1463,7 +1463,7 @@ export const printDCToInvoiceStyles = (printStyle) => { .product-table th { padding: 4px; text-align: left; - background: #ccccccff; + // background: #ccccccff; } .product-table td { padding: 4px; @@ -1621,7 +1621,7 @@ export const printDCToInvoiceStyles = (printStyle) => { font-weight: bold; padding: 4px; text-align: left; - background: #ccccccff; + // background: #ccccccff; border-bottom: 2px dashed #000; } .product-table td { @@ -1808,8 +1808,8 @@ export const printDCToInvoiceStyles = (printStyle) => { padding: 4px; text-align: left; border: 2px solid #fff; - background: rgb(55, 59, 68); - color:rgb(255, 255, 255); + // background: rgb(55, 59, 68); + // color:rgb(255, 255, 255); } .product-table tr:nth-child(even) { background-color: #E8E8E8; @@ -1899,7 +1899,7 @@ export const printDCToInvoiceStyles = (printStyle) => { font-size: 20px; padding: 10px 0; font-weight: 600; - background: rgb(253, 199, 22); + // background: rgb(253, 199, 22); width: 100%; display : flex; justify-content :center; @@ -1988,11 +1988,11 @@ export const printDCToInvoiceStyles = (printStyle) => { padding: 4px; text-align: left; border: 2px solid #fff; - background: rgb(55, 59, 68); - color:rgb(255, 255, 255); + // background: rgb(55, 59, 68); + // color:rgb(255, 255, 255); } .product-table tr:nth-child(even) { - background-color: #E8E8E8; + // background-color: #E8E8E8; } .product-table td { padding: 4px; @@ -2018,7 +2018,7 @@ export const printDCToInvoiceStyles = (printStyle) => { .footer-notes { font-size: 17px; text-align: left; - color: #5e5e5e; + // color: #5e5e5e; font-weight: bold; } .greeting-section { @@ -2079,7 +2079,7 @@ export const printDCToInvoiceStyles = (printStyle) => { font-size: 20px; padding: 10px 0; font-weight: 600; - background: rgb(253, 199, 22); + // background: rgb(253, 199, 22); width: 100%; display : flex; justify-content :center;
{col.label}
{index + 1} {prod.ProdName} {prod.ProdVariantName}