Merge pull request 'print-colors-sq' (#222) from print-colors-sq into main
Reviewed-on: Pozomind/pozo-retail-app#222
This commit is contained in:
commit
65e4d917b1
|
|
@ -471,7 +471,11 @@ const initialState = {
|
||||||
notes: false,
|
notes: false,
|
||||||
SignatureImage: '',
|
SignatureImage: '',
|
||||||
BillName: '',
|
BillName: '',
|
||||||
SelectedHeaderColor: '#000000',
|
SelectedHeaderColour: false,
|
||||||
|
SelectedTableHeaderColour: false,
|
||||||
|
SelectedTableBodyColour: false,
|
||||||
|
SelectedFooterColour: false,
|
||||||
|
SelectedNetAmountColour: false,
|
||||||
allColors: [],
|
allColors: [],
|
||||||
allColorsCat: [],
|
allColorsCat: [],
|
||||||
LayoutOverallColorsList: [],
|
LayoutOverallColorsList: [],
|
||||||
|
|
@ -552,6 +556,17 @@ const initialState = {
|
||||||
ScanTemplate: {},
|
ScanTemplate: {},
|
||||||
CustThemeData: 'Layout2',
|
CustThemeData: 'Layout2',
|
||||||
PrinterMappingDtls: [],
|
PrinterMappingDtls: [],
|
||||||
|
SelectedHeaderColor: '#ffffff',
|
||||||
|
SelectedHeaderFontColor: '#000000',
|
||||||
|
SelectedTableHeaderColor: '#ffffff',
|
||||||
|
SelectedTableHeaderFontColor: '#000000',
|
||||||
|
SelectedTableBodyColor: '#ffffff',
|
||||||
|
SelectedTableBodyFontColor: '#000000',
|
||||||
|
SelectedFooterColor: '#ffffff',
|
||||||
|
SelectedFooterFontColor: '#000000',
|
||||||
|
SelectedNetAmountColor: '#ffffff',
|
||||||
|
SelectedNetAmountFontColor: '#000000',
|
||||||
|
rowType: 'odd',
|
||||||
};
|
};
|
||||||
|
|
||||||
const ThemeSlice = createSlice({
|
const ThemeSlice = createSlice({
|
||||||
|
|
@ -2149,7 +2164,43 @@ const ThemeSlice = createSlice({
|
||||||
state.BillName = action?.payload;
|
state.BillName = action?.payload;
|
||||||
},
|
},
|
||||||
changeSelectedHeaderColor: (state, action) => {
|
changeSelectedHeaderColor: (state, action) => {
|
||||||
state.SelectedHeaderColor = action?.payload;
|
state.SelectedHeaderColor = action?.payload?.background;
|
||||||
|
state.SelectedHeaderFontColor = action?.payload?.font;
|
||||||
|
},
|
||||||
|
changeSelectedTableHeaderColor: (state, action) => {
|
||||||
|
state.SelectedTableHeaderColor = action?.payload?.background;
|
||||||
|
state.SelectedTableHeaderFontColor = action?.payload?.font;
|
||||||
|
},
|
||||||
|
changeSelectedTableBodyColor: (state, action) => {
|
||||||
|
state.SelectedTableBodyColor = action?.payload?.background;
|
||||||
|
state.SelectedTableBodyFontColor = action?.payload?.font;
|
||||||
|
},
|
||||||
|
changeSelectedFooterColor: (state, action) => {
|
||||||
|
state.SelectedFooterColor = action?.payload?.background;
|
||||||
|
state.SelectedFooterFontColor = action?.payload?.font;
|
||||||
|
},
|
||||||
|
// toggles indicating whether each colour option should actually be applied in print
|
||||||
|
changeSelectedHeaderColour: (state, action) => {
|
||||||
|
state.SelectedHeaderColour = action?.payload;
|
||||||
|
},
|
||||||
|
changeSelectedTableHeaderColour: (state, action) => {
|
||||||
|
state.SelectedTableHeaderColour = action?.payload;
|
||||||
|
},
|
||||||
|
changeSelectedTableBodyColour: (state, action) => {
|
||||||
|
state.SelectedTableBodyColour = action?.payload;
|
||||||
|
},
|
||||||
|
changeSelectedFooterColour: (state, action) => {
|
||||||
|
state.SelectedFooterColour = action?.payload;
|
||||||
|
},
|
||||||
|
changeSelectedNetAmountColour: (state, action) => {
|
||||||
|
state.SelectedNetAmountColour = action?.payload;
|
||||||
|
},
|
||||||
|
changeRowType: (state, action) => {
|
||||||
|
state.rowType = action?.payload;
|
||||||
|
},
|
||||||
|
changeSelectedNetAmountColor: (state, action) => {
|
||||||
|
state.SelectedNetAmountColor = action?.payload?.background;
|
||||||
|
state.SelectedNetAmountFontColor = action?.payload?.font;
|
||||||
},
|
},
|
||||||
changeCurrentColor: (state, action) => {
|
changeCurrentColor: (state, action) => {
|
||||||
const { color } = action?.payload;
|
const { color } = action?.payload;
|
||||||
|
|
@ -2687,6 +2738,16 @@ export const {
|
||||||
changeActiveTheme,
|
changeActiveTheme,
|
||||||
changeScanTemplate,
|
changeScanTemplate,
|
||||||
changeSelectedHeaderColor,
|
changeSelectedHeaderColor,
|
||||||
|
changeSelectedTableHeaderColor,
|
||||||
|
changeSelectedTableBodyColor,
|
||||||
|
changeSelectedFooterColor,
|
||||||
|
changeSelectedHeaderColour,
|
||||||
|
changeSelectedTableHeaderColour,
|
||||||
|
changeSelectedTableBodyColour,
|
||||||
|
changeSelectedFooterColour,
|
||||||
|
changeSelectedNetAmountColour,
|
||||||
|
changeRowType,
|
||||||
|
changeSelectedNetAmountColor
|
||||||
} = ThemeSlice.actions;
|
} = ThemeSlice.actions;
|
||||||
|
|
||||||
export const GlobalPricingAppPricingName = (state) =>
|
export const GlobalPricingAppPricingName = (state) =>
|
||||||
|
|
@ -2711,14 +2772,38 @@ export const GlobalprintSignature = (state) => state.theme?.Signature;
|
||||||
export const GlobalprintCashierName = (state) => state.theme?.CashierName;
|
export const GlobalprintCashierName = (state) => state.theme?.CashierName;
|
||||||
export const GlobalprintLogo = (state) => state.theme?.Logo;
|
export const GlobalprintLogo = (state) => state.theme?.Logo;
|
||||||
export const GlobalprintCredit = (state) => state.theme?.Credit;
|
export const GlobalprintCredit = (state) => state.theme?.Credit;
|
||||||
export const GlobalprinttermsAndConditions = (state) =>
|
export const GlobalprinttermsAndConditions = (state) => state.theme?.termsAndConditions;
|
||||||
state.theme?.termsAndConditions;
|
|
||||||
export const GlobalthemeFormat = (state) => state.theme?.themeFormat;
|
export const GlobalthemeFormat = (state) => state.theme?.themeFormat;
|
||||||
|
// selectors for colour toggles (true when the user has chosen that colour field)
|
||||||
|
export const GlobalSelectedHeaderColour = (state) => state.theme?.SelectedHeaderColour;
|
||||||
|
export const GlobalSelectedTableHeaderColour = (state) => state.theme?.SelectedTableHeaderColour;
|
||||||
|
export const GlobalSelectedTableBodyColour = (state) => state.theme?.SelectedTableBodyColour;
|
||||||
|
export const GlobalSelectedFooterColour = (state) => state.theme?.SelectedFooterColour;
|
||||||
|
export const GlobalSelectedNetAmountColour = (state) => state.theme?.SelectedNetAmountColour;
|
||||||
export const Globalnotes = (state) => state.theme?.notes;
|
export const Globalnotes = (state) => state.theme?.notes;
|
||||||
export const GlobalSignatureImage = (state) => state.theme?.SignatureImage;
|
export const GlobalSignatureImage = (state) => state.theme?.SignatureImage;
|
||||||
export const GlobalBillName = (state) => state.theme?.BillName;
|
export const GlobalBillName = (state) => state.theme?.BillName;
|
||||||
export const GlobalSelectedPrintHeaderColor = (state) =>
|
export const GlobalSelectedPrintHeaderColor = (state) =>
|
||||||
state.theme?.SelectedHeaderColor;
|
state.theme?.SelectedHeaderColor;
|
||||||
|
export const GlobalSelectedPrintHeaderFontColor = (state) =>
|
||||||
|
state.theme?.SelectedHeaderFontColor;
|
||||||
|
export const GlobalSelectedTableHeaderColor = (state) =>
|
||||||
|
state.theme?.SelectedTableHeaderColor;
|
||||||
|
export const GlobalSelectedTableHeaderFontColor = (state) =>
|
||||||
|
state.theme?.SelectedTableHeaderFontColor;
|
||||||
|
export const GlobalSelectedTableBodyColor = (state) =>
|
||||||
|
state.theme?.SelectedTableBodyColor;
|
||||||
|
export const GlobalSelectedTableBodyFontColor = (state) =>
|
||||||
|
state.theme?.SelectedTableBodyFontColor;
|
||||||
|
export const GlobalSelectedFooterColor = (state) =>
|
||||||
|
state.theme?.SelectedFooterColor;
|
||||||
|
export const GlobalSelectedFooterFontColor = (state) =>
|
||||||
|
state.theme?.SelectedFooterFontColor;
|
||||||
|
export const GlobalSelectedNetAmountColor = (state) =>
|
||||||
|
state.theme?.SelectedNetAmountColor;
|
||||||
|
export const GlobalSelectedNetAmountFontColor = (state) =>
|
||||||
|
state.theme?.SelectedNetAmountFontColor;
|
||||||
|
export const GlobalRowType = (state) => state.theme?.rowType;
|
||||||
|
|
||||||
export const changeCurrentColorValue = (state) => state.theme?.CurrentColor;
|
export const changeCurrentColorValue = (state) => state.theme?.CurrentColor;
|
||||||
export const changeCurrentTextValue = (state) => state.theme?.CurrentText;
|
export const changeCurrentTextValue = (state) => state.theme?.CurrentText;
|
||||||
|
|
|
||||||
|
|
@ -6,7 +6,7 @@ import React, {
|
||||||
forwardRef,
|
forwardRef,
|
||||||
useImperativeHandle,
|
useImperativeHandle,
|
||||||
} from 'react';
|
} from 'react';
|
||||||
import { useDispatch } from 'react-redux';
|
import { useDispatch, useSelector } from 'react-redux';
|
||||||
import {
|
import {
|
||||||
Form,
|
Form,
|
||||||
Checkbox,
|
Checkbox,
|
||||||
|
|
@ -69,12 +69,34 @@ import {
|
||||||
changeSelectedCredit,
|
changeSelectedCredit,
|
||||||
changeSelectedTax,
|
changeSelectedTax,
|
||||||
changeSelectedHeaderColor,
|
changeSelectedHeaderColor,
|
||||||
|
changeSelectedTableHeaderColor,
|
||||||
|
changeSelectedTableBodyColor,
|
||||||
|
changeSelectedFooterColor,
|
||||||
|
changeRowType,
|
||||||
|
GlobalSelectedPrintHeaderColor,
|
||||||
|
GlobalSelectedPrintHeaderFontColor,
|
||||||
|
GlobalSelectedTableHeaderColor,
|
||||||
|
GlobalSelectedTableHeaderFontColor,
|
||||||
|
GlobalSelectedTableBodyColor,
|
||||||
|
GlobalSelectedTableBodyFontColor,
|
||||||
|
GlobalSelectedFooterColor,
|
||||||
|
GlobalSelectedFooterFontColor,
|
||||||
|
GlobalRowType,
|
||||||
|
changeSelectedNetAmountColor,
|
||||||
|
GlobalSelectedNetAmountColor,
|
||||||
|
GlobalSelectedNetAmountFontColor,
|
||||||
|
changeSelectedHeaderColour,
|
||||||
|
changeSelectedTableHeaderColour,
|
||||||
|
changeSelectedTableBodyColour,
|
||||||
|
changeSelectedFooterColour,
|
||||||
|
changeSelectedNetAmountColour,
|
||||||
} from '../../../../Features/ThemeChange/ThemeChange';
|
} from '../../../../Features/ThemeChange/ThemeChange';
|
||||||
import '../../../../Styles/BookingScreen/Components/SelectionComponent/SelectionComponent.scss';
|
import '../../../../Styles/BookingScreen/Components/SelectionComponent/SelectionComponent.scss';
|
||||||
import { useAuth } from '../../../../AuthContext.jsx';
|
import { useAuth } from '../../../../AuthContext.jsx';
|
||||||
import { InputField } from '../../../../Components/Forms/InputField.jsx';
|
import { InputField } from '../../../../Components/Forms/InputField.jsx';
|
||||||
import ColorPicker from '../../../../Components/Forms/ColorPicker.jsx';
|
import ColorPicker from '../../../../Components/Forms/ColorPicker.jsx';
|
||||||
import { FaChevronDown, FaChevronUp } from 'react-icons/fa';
|
import { FaChevronDown, FaChevronUp } from 'react-icons/fa';
|
||||||
|
import ColorsSelected from '../UtillComponents/ColorsSelected.jsx';
|
||||||
|
|
||||||
const subDirectory = import.meta.env.BASE_URL;
|
const subDirectory = import.meta.env.BASE_URL;
|
||||||
|
|
||||||
|
|
@ -92,6 +114,13 @@ const SelectionComponent = forwardRef((props, ref) => {
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
// helper to read a color object from the newer `PrintColors` array
|
||||||
|
const getColor = (printColors, key) => {
|
||||||
|
if (!printColors || !Array.isArray(printColors)) return {};
|
||||||
|
const entry = printColors.find((c) => c && c[key]);
|
||||||
|
return entry ? entry[key] : {};
|
||||||
|
};
|
||||||
|
|
||||||
useImperativeHandle(ref, () => ({
|
useImperativeHandle(ref, () => ({
|
||||||
doSomething,
|
doSomething,
|
||||||
}));
|
}));
|
||||||
|
|
@ -138,6 +167,10 @@ const SelectionComponent = forwardRef((props, ref) => {
|
||||||
const [isTermscondChecking, setisTermscondChecking] = useState(false);
|
const [isTermscondChecking, setisTermscondChecking] = useState(false);
|
||||||
const [isSignatureChecking, setisSignatureChecking] = useState(false);
|
const [isSignatureChecking, setisSignatureChecking] = useState(false);
|
||||||
const [isheadercolour, setisheadercolour] = useState(false);
|
const [isheadercolour, setisheadercolour] = useState(false);
|
||||||
|
const [isTableHeaderColour, setisTableHeaderColour] = useState(false);
|
||||||
|
const [isTableBodyColour, setisTableBodyColour] = useState(false);
|
||||||
|
const [isFooterColour, setisFooterColour] = useState(false);
|
||||||
|
const [isNetAmountColour, setisNetAmountColour] = useState(false);
|
||||||
const [showMore, setShowMore] = useState(false);
|
const [showMore, setShowMore] = useState(false);
|
||||||
const visibleConfigs = showMore ? styleData : styleData.slice(0, 4);
|
const visibleConfigs = showMore ? styleData : styleData.slice(0, 4);
|
||||||
const defaultImage =
|
const defaultImage =
|
||||||
|
|
@ -150,6 +183,25 @@ const SelectionComponent = forwardRef((props, ref) => {
|
||||||
const [previewTitle, setPreviewTitle] = useState('');
|
const [previewTitle, setPreviewTitle] = useState('');
|
||||||
const [Notes, setNote] = useState('');
|
const [Notes, setNote] = useState('');
|
||||||
const [BillName, setBillName] = useState('');
|
const [BillName, setBillName] = useState('');
|
||||||
|
const [openColorModal, setOpenColorModal] = useState(false);
|
||||||
|
const [bgColor, setBgColor] = useState("#ffffff");
|
||||||
|
const [fontColor, setFontColor] = useState("#000000");
|
||||||
|
const [selectedHeaderFontColor, setSelectedHeaderFontColor] = useState("#ffffff");
|
||||||
|
const [colorModalTarget, setColorModalTarget] = useState(null); // 'header' | 'tableHeader' | 'tableBody' | 'footer'
|
||||||
|
const rowType = useSelector(GlobalRowType);
|
||||||
|
|
||||||
|
// derived from global store
|
||||||
|
const headerColor = useSelector(GlobalSelectedPrintHeaderColor);
|
||||||
|
const headerFontColor = useSelector(GlobalSelectedPrintHeaderFontColor);
|
||||||
|
const tableHeaderColor = useSelector(GlobalSelectedTableHeaderColor);
|
||||||
|
const tableHeaderFontColor = useSelector(GlobalSelectedTableHeaderFontColor);
|
||||||
|
const tableBodyColor = useSelector(GlobalSelectedTableBodyColor);
|
||||||
|
const tableBodyFontColor = useSelector(GlobalSelectedTableBodyFontColor);
|
||||||
|
const footerColor = useSelector(GlobalSelectedFooterColor);
|
||||||
|
const footerFontColor = useSelector(GlobalSelectedFooterFontColor);
|
||||||
|
const netAmountColor = useSelector(GlobalSelectedNetAmountColor);
|
||||||
|
const netAmountFontColor = useSelector(GlobalSelectedNetAmountFontColor);
|
||||||
|
|
||||||
|
|
||||||
const items = [
|
const items = [
|
||||||
{
|
{
|
||||||
|
|
@ -358,6 +410,66 @@ const SelectionComponent = forwardRef((props, ref) => {
|
||||||
);
|
);
|
||||||
setisSignatureChecking(checkedList?.includes(CheckSignature?.ConfigId));
|
setisSignatureChecking(checkedList?.includes(CheckSignature?.ConfigId));
|
||||||
setisheadercolour(checkedList?.includes(headerColour?.ConfigId));
|
setisheadercolour(checkedList?.includes(headerColour?.ConfigId));
|
||||||
|
setisTableHeaderColour(
|
||||||
|
checkedList?.includes(
|
||||||
|
sizeCheckList.find((item) => item.ConfigName === 'Table Header Colour')
|
||||||
|
?.ConfigId
|
||||||
|
)
|
||||||
|
);
|
||||||
|
setisTableBodyColour(
|
||||||
|
checkedList?.includes(
|
||||||
|
sizeCheckList.find((item) => item.ConfigName === 'Table Body Colour')
|
||||||
|
?.ConfigId
|
||||||
|
)
|
||||||
|
);
|
||||||
|
setisFooterColour(
|
||||||
|
checkedList?.includes(
|
||||||
|
sizeCheckList.find((item) => item.ConfigName === 'Footer Colour')
|
||||||
|
?.ConfigId
|
||||||
|
)
|
||||||
|
);
|
||||||
|
setisNetAmountColour(
|
||||||
|
checkedList?.includes(
|
||||||
|
sizeCheckList.find((item) => item.ConfigName === 'Net Amount Colour')
|
||||||
|
?.ConfigId
|
||||||
|
)
|
||||||
|
);
|
||||||
|
|
||||||
|
// update global toggle states as well so print components can read them
|
||||||
|
if (checkedList?.includes(headerColour?.ConfigId)) {
|
||||||
|
dispatch(changeSelectedHeaderColour(true));
|
||||||
|
} else {
|
||||||
|
dispatch(changeSelectedHeaderColour(false));
|
||||||
|
dispatch(changeSelectedHeaderColor({ background: '#ffffff', font: '#000000' }));
|
||||||
|
}
|
||||||
|
const tblHdr2 = sizeCheckList.find((item) => item.ConfigName === 'Table Header Colour')?.ConfigId;
|
||||||
|
if (checkedList?.includes(tblHdr2)) {
|
||||||
|
dispatch(changeSelectedTableHeaderColour(true));
|
||||||
|
} else {
|
||||||
|
dispatch(changeSelectedTableHeaderColour(false));
|
||||||
|
dispatch(changeSelectedTableHeaderColor({ background: '', font: '' }));
|
||||||
|
}
|
||||||
|
const tblBody2 = sizeCheckList.find((item) => item.ConfigName === 'Table Body Colour')?.ConfigId;
|
||||||
|
if (checkedList?.includes(tblBody2)) {
|
||||||
|
dispatch(changeSelectedTableBodyColour(true));
|
||||||
|
} else {
|
||||||
|
dispatch(changeSelectedTableBodyColour(false));
|
||||||
|
dispatch(changeSelectedTableBodyColor({ background: '', font: '' }));
|
||||||
|
}
|
||||||
|
const ftr2 = sizeCheckList.find((item) => item.ConfigName === 'Footer Colour')?.ConfigId;
|
||||||
|
if (checkedList?.includes(ftr2)) {
|
||||||
|
dispatch(changeSelectedFooterColour(true));
|
||||||
|
} else {
|
||||||
|
dispatch(changeSelectedFooterColour(false));
|
||||||
|
dispatch(changeSelectedFooterColor({ background: '', font: '' }));
|
||||||
|
}
|
||||||
|
const net2 = sizeCheckList.find((item) => item.ConfigName === 'Net Amount Colour')?.ConfigId;
|
||||||
|
if (checkedList?.includes(net2)) {
|
||||||
|
dispatch(changeSelectedNetAmountColour(true));
|
||||||
|
} else {
|
||||||
|
dispatch(changeSelectedNetAmountColour(false));
|
||||||
|
dispatch(changeSelectedNetAmountColor({ background: '', font: '' }));
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
const fetchInitialData = async () => {
|
const fetchInitialData = async () => {
|
||||||
|
|
@ -422,7 +534,30 @@ const SelectionComponent = forwardRef((props, ref) => {
|
||||||
Signature: item.Signature,
|
Signature: item.Signature,
|
||||||
PrintType: item.PrintType,
|
PrintType: item.PrintType,
|
||||||
PrintHdrName: item.PrintHdrName,
|
PrintHdrName: item.PrintHdrName,
|
||||||
PrintHdrColor: item.PrintHdrColor,
|
// legacy fields are filled from the array so older code still works
|
||||||
|
PrintHdrColor:
|
||||||
|
item.PrintHdrColor || getColor(item.PrintColors, 'headerColor')?.background,
|
||||||
|
PrintHdrFontColor:
|
||||||
|
item.PrintHdrFontColor || getColor(item.PrintColors, 'headerColor')?.font,
|
||||||
|
TableHeaderColor:
|
||||||
|
item.TableHeaderColor || getColor(item.PrintColors, 'tableHeaderColor')?.background,
|
||||||
|
TableHeaderFontColor:
|
||||||
|
item.TableHeaderFontColor || getColor(item.PrintColors, 'tableHeaderColor')?.font,
|
||||||
|
TableBodyColor:
|
||||||
|
item.TableBodyColor || getColor(item.PrintColors, 'tableBodyColor')?.background,
|
||||||
|
TableBodyFontColor:
|
||||||
|
item.TableBodyFontColor || getColor(item.PrintColors, 'tableBodyColor')?.font,
|
||||||
|
footerColor:
|
||||||
|
item.footerColor || getColor(item.PrintColors, 'footerColor')?.background,
|
||||||
|
footerFontColor:
|
||||||
|
item.footerFontColor || getColor(item.PrintColors, 'footerColor')?.font,
|
||||||
|
netAmountColor:
|
||||||
|
item.netAmountColor || getColor(item.PrintColors, 'netAmtColor')?.background,
|
||||||
|
netAmountFontColor:
|
||||||
|
item.netAmountFontColor || getColor(item.PrintColors, 'netAmtColor')?.font,
|
||||||
|
rowType:
|
||||||
|
item.rowType || getColor(item.PrintColors, 'tableBodyColor')?.rowType || 'odd',
|
||||||
|
PrintColors: item.PrintColors,
|
||||||
Notes: item?.Notes,
|
Notes: item?.Notes,
|
||||||
PageSize: item?.PageSize?.trim() || '3inch',
|
PageSize: item?.PageSize?.trim() || '3inch',
|
||||||
PrintTypeId: item?.PrintTypeId,
|
PrintTypeId: item?.PrintTypeId,
|
||||||
|
|
@ -474,6 +609,7 @@ const SelectionComponent = forwardRef((props, ref) => {
|
||||||
OptionDetails,
|
OptionDetails,
|
||||||
PrintTypeId,
|
PrintTypeId,
|
||||||
PrintHdrColor,
|
PrintHdrColor,
|
||||||
|
PrintColors
|
||||||
} = row;
|
} = row;
|
||||||
if (index >= 4) setShowMore(true);
|
if (index >= 4) setShowMore(true);
|
||||||
if (index <= 4) setShowMore(false);
|
if (index <= 4) setShowMore(false);
|
||||||
|
|
@ -487,7 +623,11 @@ const SelectionComponent = forwardRef((props, ref) => {
|
||||||
setNote(Notes);
|
setNote(Notes);
|
||||||
setBillName(PrintHdrName);
|
setBillName(PrintHdrName);
|
||||||
setEdit(true);
|
setEdit(true);
|
||||||
setSelectedColour(PrintHdrColor);
|
// load existing header color, falling back to array
|
||||||
|
setSelectedColour(
|
||||||
|
PrintHdrColor || getColor(PrintColors, 'headerColor')?.background || '#000000'
|
||||||
|
);
|
||||||
|
// setSelectedHeaderFontColor(PrintHdrFontColor);
|
||||||
setSelectedStyleId(StyleId);
|
setSelectedStyleId(StyleId);
|
||||||
|
|
||||||
if (Signature) {
|
if (Signature) {
|
||||||
|
|
@ -538,6 +678,44 @@ const SelectionComponent = forwardRef((props, ref) => {
|
||||||
dispatch(changeNotes(helperFunction('Notes')));
|
dispatch(changeNotes(helperFunction('Notes')));
|
||||||
dispatch(changeSignatureImage(Signature));
|
dispatch(changeSignatureImage(Signature));
|
||||||
dispatch(changeBillName(PrintHdrName));
|
dispatch(changeBillName(PrintHdrName));
|
||||||
|
// derive color objects; prefer the legacy fields but fall back to the PrintColors array
|
||||||
|
const hdr = getColor(PrintColors, 'headerColor');
|
||||||
|
const tblHdr = getColor(PrintColors, 'tableHeaderColor');
|
||||||
|
const tblBody = getColor(PrintColors, 'tableBodyColor');
|
||||||
|
const ftr = getColor(PrintColors, 'footerColor');
|
||||||
|
const net = getColor(PrintColors, 'netAmtColor');
|
||||||
|
|
||||||
|
dispatch(
|
||||||
|
changeSelectedHeaderColor({
|
||||||
|
background: PrintHdrColor || hdr.background,
|
||||||
|
font: hdr.font,
|
||||||
|
})
|
||||||
|
);
|
||||||
|
dispatch(
|
||||||
|
changeSelectedTableHeaderColor({
|
||||||
|
background: tblHdr.background || row.TableHeaderColor,
|
||||||
|
font: tblHdr.font || row.TableHeaderFontColor,
|
||||||
|
})
|
||||||
|
);
|
||||||
|
dispatch(
|
||||||
|
changeSelectedTableBodyColor({
|
||||||
|
background: tblBody.background || row.TableBodyColor,
|
||||||
|
font: tblBody.font || row.TableBodyFontColor,
|
||||||
|
})
|
||||||
|
);
|
||||||
|
dispatch(changeRowType(tblBody.rowType || row.rowType || 'odd'));
|
||||||
|
dispatch(
|
||||||
|
changeSelectedFooterColor({
|
||||||
|
background: ftr.background || row.footerColor,
|
||||||
|
font: ftr.font || row.footerFontColor,
|
||||||
|
})
|
||||||
|
);
|
||||||
|
dispatch(
|
||||||
|
changeSelectedNetAmountColor({
|
||||||
|
background: net.background || row.netAmountColor,
|
||||||
|
font: net.font || row.netAmountFontColor,
|
||||||
|
})
|
||||||
|
);
|
||||||
dispatch(
|
dispatch(
|
||||||
changeSelectedprintStyle({
|
changeSelectedprintStyle({
|
||||||
ConfigId: StyleId,
|
ConfigId: StyleId,
|
||||||
|
|
@ -613,6 +791,8 @@ const SelectionComponent = forwardRef((props, ref) => {
|
||||||
setSelectedStyleName(
|
setSelectedStyleName(
|
||||||
styleData.find((item) => item.ConfigId === e)?.ConfigName
|
styleData.find((item) => item.ConfigId === e)?.ConfigName
|
||||||
);
|
);
|
||||||
|
// reset rowType when selecting a new style
|
||||||
|
dispatch(changeRowType('odd'));
|
||||||
dispatch(
|
dispatch(
|
||||||
changeSelectedprintStyle({
|
changeSelectedprintStyle({
|
||||||
ConfigId: e,
|
ConfigId: e,
|
||||||
|
|
@ -733,13 +913,42 @@ const SelectionComponent = forwardRef((props, ref) => {
|
||||||
)
|
)
|
||||||
? dispatch(changeNotes(true))
|
? dispatch(changeNotes(true))
|
||||||
: dispatch(changeNotes(false));
|
: dispatch(changeNotes(false));
|
||||||
|
const hdrId = sizeCheckList.find((item) => item.ConfigName === 'Header Colour')?.ConfigId;
|
||||||
checkedValues?.includes(
|
if (checkedValues?.includes(hdrId)) {
|
||||||
sizeCheckList.find((item) => item.ConfigName === 'Header Colour')
|
dispatch(changeSelectedHeaderColour(true));
|
||||||
?.ConfigId
|
} else {
|
||||||
)
|
dispatch(changeSelectedHeaderColour(false));
|
||||||
? setisheadercolour(true)
|
// reset colours when option disabled
|
||||||
: setisheadercolour(false);
|
dispatch(changeSelectedHeaderColor({ background: '#ffffff', font: '#000000' }));
|
||||||
|
}
|
||||||
|
const tblHdrId = sizeCheckList.find((item) => item.ConfigName === 'Table Header Colour')?.ConfigId;
|
||||||
|
if (checkedValues?.includes(tblHdrId)) {
|
||||||
|
dispatch(changeSelectedTableHeaderColour(true));
|
||||||
|
} else {
|
||||||
|
dispatch(changeSelectedTableHeaderColour(false));
|
||||||
|
dispatch(changeSelectedTableHeaderColor({ background: '', font: '' }));
|
||||||
|
}
|
||||||
|
const tblBodyId = sizeCheckList.find((item) => item.ConfigName === 'Table Body Colour')?.ConfigId;
|
||||||
|
if (checkedValues?.includes(tblBodyId)) {
|
||||||
|
dispatch(changeSelectedTableBodyColour(true));
|
||||||
|
} else {
|
||||||
|
dispatch(changeSelectedTableBodyColour(false));
|
||||||
|
dispatch(changeSelectedTableBodyColor({ background: '', font: '' }));
|
||||||
|
}
|
||||||
|
const ftrId = sizeCheckList.find((item) => item.ConfigName === 'Footer Colour')?.ConfigId;
|
||||||
|
if (checkedValues?.includes(ftrId)) {
|
||||||
|
dispatch(changeSelectedFooterColour(true));
|
||||||
|
} else {
|
||||||
|
dispatch(changeSelectedFooterColour(false));
|
||||||
|
dispatch(changeSelectedFooterColor({ background: '', font: '' }));
|
||||||
|
}
|
||||||
|
const netId = sizeCheckList.find((item) => item.ConfigName === 'Net Amount Colour')?.ConfigId;
|
||||||
|
if (checkedValues?.includes(netId)) {
|
||||||
|
dispatch(changeSelectedNetAmountColour(true));
|
||||||
|
} else {
|
||||||
|
dispatch(changeSelectedNetAmountColour(false));
|
||||||
|
dispatch(changeSelectedNetAmountColor({ background: '', font: '' }));
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleOptions = async () => {
|
const handleOptions = async () => {
|
||||||
|
|
@ -790,13 +999,28 @@ const SelectionComponent = forwardRef((props, ref) => {
|
||||||
PrintHdrName: BillName,
|
PrintHdrName: BillName,
|
||||||
PrintType: PrintType ? 'S' : 'C',
|
PrintType: PrintType ? 'S' : 'C',
|
||||||
PrintTypeId: segmentValue,
|
PrintTypeId: segmentValue,
|
||||||
PrintHdrColor: getConcatenatedArray().some(
|
// Header color (background) and font
|
||||||
|
PrintHdrColor: getConcatenatedArray()?.some(
|
||||||
(e) => e?.ConfigName?.toLowerCase() == 'header colour'
|
(e) => e?.ConfigName?.toLowerCase() == 'header colour'
|
||||||
)
|
)
|
||||||
? selectedColour
|
? (headerColor || selectedColour)
|
||||||
: null,
|
: null,
|
||||||
|
PrintHdrFontColor: getConcatenatedArray()?.some(
|
||||||
|
(e) => e?.ConfigName?.toLowerCase() == 'header colour'
|
||||||
|
)
|
||||||
|
? (headerFontColor || selectedHeaderFontColor)
|
||||||
|
: null,
|
||||||
|
// Table header / body / footer / net amount colors
|
||||||
|
TableHeaderColor: tableHeaderColor || null,
|
||||||
|
TableHeaderFontColor: tableHeaderFontColor || null,
|
||||||
|
TableBodyColor: tableBodyColor || null,
|
||||||
|
TableBodyFontColor: tableBodyFontColor || null,
|
||||||
|
footerColor: footerColor || null,
|
||||||
|
footerFontColor: footerFontColor || null,
|
||||||
|
netAmountColor: netAmountColor || null,
|
||||||
|
netAmountFontColor: netAmountFontColor || null,
|
||||||
|
rowType: rowType || 'odd',
|
||||||
});
|
});
|
||||||
|
|
||||||
// Validation
|
// Validation
|
||||||
if (isSignatureChecking && fileList?.length === 0)
|
if (isSignatureChecking && fileList?.length === 0)
|
||||||
return message.warning('Please upload Signature');
|
return message.warning('Please upload Signature');
|
||||||
|
|
@ -865,7 +1089,39 @@ const SelectionComponent = forwardRef((props, ref) => {
|
||||||
StyleId: item.StyleId,
|
StyleId: item.StyleId,
|
||||||
SetasDefault: item.SetasDefault,
|
SetasDefault: item.SetasDefault,
|
||||||
SetasDefaultInvoice: item.SetasDefaultInvoice,
|
SetasDefaultInvoice: item.SetasDefaultInvoice,
|
||||||
PrintHdrColor: item.PrintHdrColor,
|
PrintHdrColor: [
|
||||||
|
{
|
||||||
|
headerColor: {
|
||||||
|
background: item.PrintHdrColor,
|
||||||
|
font: item.PrintHdrFontColor,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
tableHeaderColor: {
|
||||||
|
background: item?.TableHeaderColor,
|
||||||
|
font: item?.TableHeaderFontColor,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
tableBodyColor: {
|
||||||
|
background: item?.TableBodyColor,
|
||||||
|
font: item?.TableBodyFontColor,
|
||||||
|
rowType: rowType,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
footerColor: {
|
||||||
|
background: item?.footerColor,
|
||||||
|
font: item?.footerFontColor,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
netAmtColor: {
|
||||||
|
background: item?.netAmountColor,
|
||||||
|
font: item?.netAmountFontColor,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
],
|
||||||
PrintTypeId: item?.PrintTypeId,
|
PrintTypeId: item?.PrintTypeId,
|
||||||
SizeDetails: item.OptionDetails.map((item) => ({
|
SizeDetails: item.OptionDetails.map((item) => ({
|
||||||
OptionId: item.ConfigId,
|
OptionId: item.ConfigId,
|
||||||
|
|
@ -1045,6 +1301,37 @@ const SelectionComponent = forwardRef((props, ref) => {
|
||||||
|
|
||||||
// }
|
// }
|
||||||
|
|
||||||
|
const handleColorSave = (colors) => {
|
||||||
|
// common handler called when ColorsSelected modal returns values
|
||||||
|
console.log("Received from modal:", colors);
|
||||||
|
switch (colorModalTarget) {
|
||||||
|
case 'header':
|
||||||
|
dispatch(changeSelectedHeaderColor({ background: colors.background, font: colors.font }));
|
||||||
|
setSelectedColour(colors.background);
|
||||||
|
setSelectedHeaderFontColor(colors.font);
|
||||||
|
break;
|
||||||
|
case 'tableHeader':
|
||||||
|
dispatch(changeSelectedTableHeaderColor({ background: colors.background, font: colors.font }));
|
||||||
|
break;
|
||||||
|
case 'tableBody':
|
||||||
|
dispatch(changeSelectedTableBodyColor({ background: colors.background, font: colors.font }));
|
||||||
|
break;
|
||||||
|
case 'footer':
|
||||||
|
dispatch(changeSelectedFooterColor({ background: colors.background, font: colors.font }));
|
||||||
|
break;
|
||||||
|
case 'netAmount':
|
||||||
|
dispatch(changeSelectedNetAmountColor({ background: colors.background, font: colors.font }));
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
dispatch(changeSelectedHeaderColor({ background: colors.background, font: colors.font }));
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
// update local previews as well (not strictly necessary if UI reads from store)
|
||||||
|
setBgColor(colors.background);
|
||||||
|
setFontColor(colors.font);
|
||||||
|
setOpenColorModal(false);
|
||||||
|
setColorModalTarget(null);
|
||||||
|
};
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<Messages
|
<Messages
|
||||||
|
|
@ -1387,21 +1674,215 @@ const SelectionComponent = forwardRef((props, ref) => {
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
{isheadercolour && (
|
{isheadercolour && (
|
||||||
// {isheadercolour && SelectedStyleName == 'TaxInvoice' && (
|
|
||||||
<div style={{ marginTop: '1rem' }}>
|
<div style={{ marginTop: '1rem' }}>
|
||||||
<Title level={5} style={{ marginBottom: 12 }}>
|
<Title level={5} style={{ marginBottom: 12 }}>
|
||||||
Header Color
|
Header Color
|
||||||
</Title>
|
</Title>
|
||||||
<ColorPicker
|
<button
|
||||||
value={selectedColour}
|
onClick={() => {
|
||||||
onChange={(color) => {
|
setColorModalTarget('header');
|
||||||
setSelectedColour(color);
|
setOpenColorModal(true);
|
||||||
dispatch(changeSelectedHeaderColor(color));
|
|
||||||
}}
|
}}
|
||||||
placeholder="Select color"
|
className="handleAddBTN"
|
||||||
/>
|
>
|
||||||
|
<PlusOutlined /> select color
|
||||||
|
<span
|
||||||
|
style={{
|
||||||
|
display: 'inline-block',
|
||||||
|
width: 16,
|
||||||
|
height: 16,
|
||||||
|
backgroundColor: headerColor || '#ffffff',
|
||||||
|
border: '1px solid #000',
|
||||||
|
marginLeft: 6,
|
||||||
|
verticalAlign: 'middle',
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
<span
|
||||||
|
style={{
|
||||||
|
display: 'inline-block', width: 16, height: 16, backgroundColor: headerFontColor,
|
||||||
|
border: '1px solid #000', marginLeft: 6, verticalAlign: 'middle',
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</button>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
{isTableHeaderColour && (
|
||||||
|
<div style={{ marginTop: '1rem' }}>
|
||||||
|
<Title level={5} style={{ marginBottom: 12 }}>
|
||||||
|
Table Header Colour
|
||||||
|
</Title>
|
||||||
|
<button
|
||||||
|
onClick={() => {
|
||||||
|
setColorModalTarget('tableHeader');
|
||||||
|
|
||||||
|
setOpenColorModal(true);
|
||||||
|
}}
|
||||||
|
className="handleAddBTN"
|
||||||
|
>
|
||||||
|
<PlusOutlined /> select color
|
||||||
|
<span
|
||||||
|
style={{
|
||||||
|
display: 'inline-block',
|
||||||
|
width: 16,
|
||||||
|
height: 16,
|
||||||
|
backgroundColor: tableHeaderColor,
|
||||||
|
border: '1px solid #000',
|
||||||
|
marginLeft: 6,
|
||||||
|
verticalAlign: 'middle',
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
<span
|
||||||
|
style={{
|
||||||
|
display: 'inline-block', width: 16, height: 16, backgroundColor: tableHeaderFontColor,
|
||||||
|
border: '1px solid #000', marginLeft: 6, verticalAlign: 'middle',
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
{isTableBodyColour && (
|
||||||
|
<div style={{ marginTop: '1rem' }}>
|
||||||
|
<Title level={5} style={{ marginBottom: 12 }}>
|
||||||
|
Table Body Colour
|
||||||
|
</Title>
|
||||||
|
<button
|
||||||
|
onClick={() => {
|
||||||
|
setColorModalTarget('tableBody');
|
||||||
|
setOpenColorModal(true);
|
||||||
|
}}
|
||||||
|
className="handleAddBTN"
|
||||||
|
>
|
||||||
|
<PlusOutlined /> select color
|
||||||
|
<span
|
||||||
|
style={{
|
||||||
|
display: 'inline-block',
|
||||||
|
width: 16,
|
||||||
|
height: 16,
|
||||||
|
backgroundColor: tableBodyColor,
|
||||||
|
border: '1px solid #000',
|
||||||
|
marginLeft: 6,
|
||||||
|
verticalAlign: 'middle',
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
<span
|
||||||
|
style={{
|
||||||
|
display: 'inline-block', width: 16, height: 16, backgroundColor: tableBodyFontColor,
|
||||||
|
border: '1px solid #000', marginLeft: 6, verticalAlign: 'middle',
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<span style={{ margin: '0px 10px' }} className="handleAddBTN">
|
||||||
|
<Switch
|
||||||
|
checked={rowType === "even"}
|
||||||
|
checkedChildren="Even"
|
||||||
|
unCheckedChildren="Odd"
|
||||||
|
onChange={(checked) => dispatch(changeRowType(checked ? "even" : "odd"))}
|
||||||
|
/>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
{isFooterColour && (
|
||||||
|
<div style={{ marginTop: '1rem' }}>
|
||||||
|
<Title level={5} style={{ marginBottom: 12 }}>
|
||||||
|
Footer Colour
|
||||||
|
</Title>
|
||||||
|
<button
|
||||||
|
onClick={() => {
|
||||||
|
setColorModalTarget('footer');
|
||||||
|
setOpenColorModal(true);
|
||||||
|
}}
|
||||||
|
className="handleAddBTN"
|
||||||
|
>
|
||||||
|
<PlusOutlined /> select color
|
||||||
|
<span
|
||||||
|
style={{
|
||||||
|
display: 'inline-block',
|
||||||
|
width: 16,
|
||||||
|
height: 16,
|
||||||
|
backgroundColor: footerColor || '#ffffff',
|
||||||
|
border: '1px solid #000',
|
||||||
|
marginLeft: 6,
|
||||||
|
verticalAlign: 'middle',
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
<span
|
||||||
|
style={{
|
||||||
|
display: 'inline-block', width: 16, height: 16, backgroundColor: footerFontColor || '#000000',
|
||||||
|
border: '1px solid #000', marginLeft: 6, verticalAlign: 'middle',
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{isNetAmountColour && (
|
||||||
|
<div style={{ marginTop: '1rem' }}>
|
||||||
|
<Title level={5} style={{ marginBottom: 12 }}>
|
||||||
|
Net Amount Colour
|
||||||
|
</Title>
|
||||||
|
<button
|
||||||
|
onClick={() => {
|
||||||
|
setColorModalTarget('netAmount');
|
||||||
|
setOpenColorModal(true);
|
||||||
|
}}
|
||||||
|
className="handleAddBTN"
|
||||||
|
>
|
||||||
|
<PlusOutlined /> select color
|
||||||
|
<span
|
||||||
|
style={{
|
||||||
|
display: 'inline-block',
|
||||||
|
width: 16,
|
||||||
|
height: 16,
|
||||||
|
backgroundColor: netAmountColor || '#ffffff',
|
||||||
|
border: '1px solid #000',
|
||||||
|
marginLeft: 6,
|
||||||
|
verticalAlign: 'middle',
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
<span
|
||||||
|
style={{
|
||||||
|
display: 'inline-block', width: 16, height: 16, backgroundColor: netAmountFontColor || '#000000',
|
||||||
|
border: '1px solid #000', marginLeft: 6, verticalAlign: 'middle',
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
{openColorModal && (
|
||||||
|
<ColorsSelected
|
||||||
|
open={openColorModal}
|
||||||
|
onClose={() => setOpenColorModal(false)}
|
||||||
|
onSave={handleColorSave}
|
||||||
|
initial={{
|
||||||
|
background:
|
||||||
|
colorModalTarget === 'header'
|
||||||
|
? headerColor
|
||||||
|
: colorModalTarget === 'tableHeader'
|
||||||
|
? tableHeaderColor
|
||||||
|
: colorModalTarget === 'tableBody'
|
||||||
|
? tableBodyColor
|
||||||
|
: colorModalTarget === 'footer'
|
||||||
|
? footerColor
|
||||||
|
: colorModalTarget === 'netAmount'
|
||||||
|
? netAmountColor
|
||||||
|
: bgColor,
|
||||||
|
font:
|
||||||
|
colorModalTarget === 'header'
|
||||||
|
? headerFontColor
|
||||||
|
: colorModalTarget === 'tableHeader'
|
||||||
|
? tableHeaderFontColor
|
||||||
|
: colorModalTarget === 'tableBody'
|
||||||
|
? tableBodyFontColor
|
||||||
|
: colorModalTarget === 'footer'
|
||||||
|
? footerFontColor
|
||||||
|
: colorModalTarget === 'netAmount'
|
||||||
|
? netAmountFontColor
|
||||||
|
: fontColor,
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
)}
|
||||||
|
|
||||||
{isTermscondChecking && (
|
{isTermscondChecking && (
|
||||||
<div style={{ marginTop: '1rem' }}>
|
<div style={{ marginTop: '1rem' }}>
|
||||||
<Title level={5} style={{ marginBottom: 12 }}>
|
<Title level={5} style={{ marginBottom: 12 }}>
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,130 @@
|
||||||
|
import { Modal } from "antd";
|
||||||
|
import { CloseOutlined, PlusOutlined } from "@ant-design/icons";
|
||||||
|
import { SwatchesPicker } from "react-color";
|
||||||
|
import { useEffect, useState } from "react";
|
||||||
|
import Buttons from "../../../../Components/Forms/Buttons";
|
||||||
|
|
||||||
|
const ColorsSelected = ({ open, onClose, onSave, initial = {} }) => {
|
||||||
|
const [colorType, setColorType] = useState("background");
|
||||||
|
const [bgColor, setBgColor] = useState(initial.background || "#ffffff");
|
||||||
|
const [fontColor, setFontColor] = useState(initial.font || "#000000" );
|
||||||
|
|
||||||
|
// reset when modal is opened with different initial colors
|
||||||
|
useEffect(() => {
|
||||||
|
if (initial.background) setBgColor(initial.background);
|
||||||
|
if (initial.font) setFontColor(initial.font);
|
||||||
|
}, [initial, open]);
|
||||||
|
|
||||||
|
const handleColorChange = (color) => {
|
||||||
|
if (colorType === "background") {
|
||||||
|
setBgColor(color.hex);
|
||||||
|
} else {
|
||||||
|
setFontColor(color.hex);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleSave = () => {
|
||||||
|
onSave({
|
||||||
|
background: bgColor,
|
||||||
|
font: fontColor,
|
||||||
|
});
|
||||||
|
onClose();
|
||||||
|
};
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Modal
|
||||||
|
open={open}
|
||||||
|
title="Colors"
|
||||||
|
onCancel={onClose}
|
||||||
|
closeIcon={<CloseOutlined />}
|
||||||
|
footer={null}
|
||||||
|
width={400}
|
||||||
|
>
|
||||||
|
|
||||||
|
|
||||||
|
{/* ✅ Selected Color Preview */}
|
||||||
|
<div
|
||||||
|
style={{
|
||||||
|
display: "flex",
|
||||||
|
justifyContent: "space-between",
|
||||||
|
border: "1px solid #ccc",
|
||||||
|
padding: "10px",
|
||||||
|
borderRadius: "8px",
|
||||||
|
marginBottom: "15px",
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
style={{
|
||||||
|
display: "flex",
|
||||||
|
justifyContent: "space-between",
|
||||||
|
gap:'10px',
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{/* Background Preview */}
|
||||||
|
<div
|
||||||
|
onClick={() => setColorType("background")}
|
||||||
|
style={{
|
||||||
|
cursor: "pointer",
|
||||||
|
padding: "5px",
|
||||||
|
borderRadius: "6px",
|
||||||
|
border:
|
||||||
|
colorType === "background"
|
||||||
|
? "2px solid #901D77"
|
||||||
|
: "1px solid transparent",
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<p style={{ fontSize: 12, fontWeight: 600 }}>
|
||||||
|
Background
|
||||||
|
</p>
|
||||||
|
<div
|
||||||
|
style={{
|
||||||
|
|
||||||
|
width: 40,
|
||||||
|
height: 25,
|
||||||
|
backgroundColor: bgColor,
|
||||||
|
borderRadius: 5,
|
||||||
|
border: "1px solid #000",
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Font Preview */}
|
||||||
|
<div
|
||||||
|
onClick={() => setColorType("font")}
|
||||||
|
style={{
|
||||||
|
cursor: "pointer",
|
||||||
|
padding: "5px",
|
||||||
|
borderRadius: "6px",
|
||||||
|
border:
|
||||||
|
colorType === "font"
|
||||||
|
? "2px solid #901D77"
|
||||||
|
: "1px solid transparent",
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<p style={{ fontSize: 12, fontWeight: 600 }}>
|
||||||
|
Font
|
||||||
|
</p>
|
||||||
|
<div
|
||||||
|
style={{
|
||||||
|
width: 40,
|
||||||
|
height: 25,
|
||||||
|
backgroundColor: fontColor,
|
||||||
|
borderRadius: 5,
|
||||||
|
border: "1px solid #000",
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Color Picker */}
|
||||||
|
<SwatchesPicker onChange={handleColorChange} />
|
||||||
|
|
||||||
|
<button className="colorBtn" onClick={handleSave}>
|
||||||
|
SAVE
|
||||||
|
</button>
|
||||||
|
</Modal>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default ColorsSelected;
|
||||||
|
|
@ -23,6 +23,17 @@ import {
|
||||||
Globalnotes,
|
Globalnotes,
|
||||||
GlobalthemeFormat,
|
GlobalthemeFormat,
|
||||||
GlobalBillName,
|
GlobalBillName,
|
||||||
|
GlobalSelectedPrintHeaderColor,
|
||||||
|
GlobalSelectedPrintHeaderFontColor,
|
||||||
|
GlobalSelectedTableHeaderColor,
|
||||||
|
GlobalSelectedTableHeaderFontColor,
|
||||||
|
GlobalSelectedTableBodyColor,
|
||||||
|
GlobalSelectedTableBodyFontColor,
|
||||||
|
GlobalRowType,
|
||||||
|
GlobalSelectedFooterColor,
|
||||||
|
GlobalSelectedFooterFontColor,
|
||||||
|
GlobalSelectedNetAmountColor,
|
||||||
|
GlobalSelectedNetAmountFontColor,
|
||||||
} from "../../../Features/ThemeChange/ThemeChange";
|
} from "../../../Features/ThemeChange/ThemeChange";
|
||||||
import "../../../Styles/BookingScreen/PrintTemplates/ThermalPrinter/PrintStyle1.scss";
|
import "../../../Styles/BookingScreen/PrintTemplates/ThermalPrinter/PrintStyle1.scss";
|
||||||
import QRCode from "react-qr-code";
|
import QRCode from "react-qr-code";
|
||||||
|
|
@ -63,6 +74,12 @@ const PurPrintA4Standard = ({ index,
|
||||||
const Amount = FieldDetails?.["Amount"];
|
const Amount = FieldDetails?.["Amount"];
|
||||||
const HsnCode = FieldDetails?.["HsnCode"];
|
const HsnCode = FieldDetails?.["HsnCode"];
|
||||||
const Qrcodet = FieldDetails?.["Qrcode"];
|
const Qrcodet = FieldDetails?.["Qrcode"];
|
||||||
|
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 GlobalSlNo = useSelector(GlobalprintSlNo);
|
const GlobalSlNo = useSelector(GlobalprintSlNo);
|
||||||
const GlobalItem = useSelector(GlobalprintItem);
|
const GlobalItem = useSelector(GlobalprintItem);
|
||||||
const GlobalMRP = useSelector(GlobalprintMRP);
|
const GlobalMRP = useSelector(GlobalprintMRP);
|
||||||
|
|
@ -79,6 +96,17 @@ const PurPrintA4Standard = ({ index,
|
||||||
const GlobalIsnotes = useSelector(Globalnotes);
|
const GlobalIsnotes = useSelector(Globalnotes);
|
||||||
const GlobalthemeFormatr = useSelector(GlobalthemeFormat)
|
const GlobalthemeFormatr = useSelector(GlobalthemeFormat)
|
||||||
const GlobalBilltext = useSelector(GlobalBillName)
|
const GlobalBilltext = useSelector(GlobalBillName)
|
||||||
|
const SelectedHeaderColor = useSelector(GlobalSelectedPrintHeaderColor);
|
||||||
|
const SelectedHeaderFontColor = useSelector(GlobalSelectedPrintHeaderFontColor);
|
||||||
|
const SelectedTableHeaderColor = useSelector(GlobalSelectedTableHeaderColor);
|
||||||
|
const SelectedTableHeaderFontColor = useSelector(GlobalSelectedTableHeaderFontColor);
|
||||||
|
const SelectedTableBodyColor = useSelector(GlobalSelectedTableBodyColor);
|
||||||
|
const SelectedTableBodyFontColor = useSelector(GlobalSelectedTableBodyFontColor);
|
||||||
|
const SelectedRowType = useSelector(GlobalRowType);
|
||||||
|
const SelectedTableFooterColor = useSelector(GlobalSelectedFooterColor);
|
||||||
|
const SelectedTableFooterFontColor = useSelector(GlobalSelectedFooterFontColor);
|
||||||
|
const SelectedNetAmountColor = useSelector(GlobalSelectedNetAmountColor);
|
||||||
|
const SelectedNetAmountFontColor = useSelector(GlobalSelectedNetAmountFontColor);
|
||||||
const keysLength = Object.keys(table2Data ?? {}).length;
|
const keysLength = Object.keys(table2Data ?? {}).length;
|
||||||
console.log(GlobalDiscount, Discount, "Discount");
|
console.log(GlobalDiscount, Discount, "Discount");
|
||||||
|
|
||||||
|
|
@ -118,10 +146,6 @@ const PurPrintA4Standard = ({ index,
|
||||||
|
|
||||||
const formattedDate = `${day}-${monthNames[monthIndex]}-${year}`;
|
const formattedDate = `${day}-${monthNames[monthIndex]}-${year}`;
|
||||||
|
|
||||||
const TakeawayData = table2Data?.productDetails?.filter(
|
|
||||||
(item) => item.BookingTypeName?.toLowerCase() === "takeaway"
|
|
||||||
|
|
||||||
);
|
|
||||||
const productsData = table2Data?.[0]?.ProductDetails || [];
|
const productsData = table2Data?.[0]?.ProductDetails || [];
|
||||||
const offers = table2Data?.OrderOfferDetails || [];
|
const offers = table2Data?.OrderOfferDetails || [];
|
||||||
|
|
||||||
|
|
@ -209,7 +233,51 @@ const PurPrintA4Standard = ({ index,
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
;
|
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 (
|
return (
|
||||||
|
|
@ -565,18 +633,17 @@ const PurPrintA4Standard = ({ index,
|
||||||
<div className={`invoice-wrapper 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' : (isMobile ? "auto" : "275mm") : "", pageBreakInside: "avoid", }} key={chunkIndex}>
|
<div className={`invoice-wrapper 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' : (isMobile ? "auto" : "275mm") : "", pageBreakInside: "avoid", }} key={chunkIndex}>
|
||||||
|
|
||||||
{/* <div className="invoice-wrapper"> */}
|
{/* <div className="invoice-wrapper"> */}
|
||||||
{/* Header */}
|
|
||||||
|
|
||||||
{/* <div className="header" style={{ position: "fixed", top: 0, width: "100%" }}> */}
|
{/* <div className="header" style={{ position: "fixed", top: 0, width: "100%" }}> */}
|
||||||
<div className="header" style={{ position: "relative", width: "100%" }}>
|
<div className="header" style={{ position: "relative", width: "100%", }}>
|
||||||
<div className="header-section">
|
<div className="header-section" style={{...headerStyle}}>
|
||||||
<h1 className="company-name">{companyName}</h1>
|
<h1 className="company-name">{companyName}</h1>
|
||||||
<p>{ table2Data?.customerAddress}</p>
|
<p>{ table2Data?.customerAddress}</p>
|
||||||
<div>Phone: {table2Data?.customerMobile}</div>
|
<div>Phone: {table2Data?.customerMobile}</div>
|
||||||
<div>Email: {companyEmail}</div>
|
<div>Email: {companyEmail}</div>
|
||||||
{(companyGSTIN) && <div style={{ fontSize: "16px", fontWeight: "600" }}>GSTIN: {companyGSTIN}</div>}
|
{(companyGSTIN) && <div style={{ fontSize: "16px", fontWeight: "600" }}>GSTIN: {companyGSTIN}</div>}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Invoice Title */}
|
{/* Invoice Title */}
|
||||||
<div className="invoice-title">
|
<div className="invoice-title">
|
||||||
|
|
||||||
|
|
@ -594,9 +661,6 @@ const PurPrintA4Standard = ({ index,
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
{table2Data?.CustomerDetails?.length > 0 && <div className="billing-grid">
|
{table2Data?.CustomerDetails?.length > 0 && <div className="billing-grid">
|
||||||
<div className="billing-left">
|
<div className="billing-left">
|
||||||
<h3 className="section-title">Details of Receiver | Billed to</h3>
|
<h3 className="section-title">Details of Receiver | Billed to</h3>
|
||||||
|
|
@ -631,31 +695,39 @@ const PurPrintA4Standard = ({ index,
|
||||||
<thead>
|
<thead>
|
||||||
<tr className="table-header">
|
<tr className="table-header">
|
||||||
{
|
{
|
||||||
SLNO == true && <th className="table-header-cell" style={{ textAlign: "center", fontFamily: "sans-serif" }}>S.No</th>}
|
SLNO == true && <th className="table-header-cell" style={{...tableHeaderStyle, textAlign: "center", fontFamily: "sans-serif" }}>S.No</th>}
|
||||||
|
|
||||||
{
|
{
|
||||||
Item == true && <th className="table-header-cell" style={{ fontFamily: "sans-serif" }}>Item</th>}
|
Item == true && <th className="table-header-cell" style={{...tableHeaderStyle, fontFamily: "sans-serif" }}>Item</th>}
|
||||||
|
|
||||||
|
|
||||||
{
|
{
|
||||||
HsnCode == true && <th className="table-header-cell" style={{ fontFamily: "sans-serif" }}>HSN </th>}
|
HsnCode == true && <th className="table-header-cell" style={{ ...tableHeaderStyle,fontFamily: "sans-serif" }}>HSN </th>}
|
||||||
|
|
||||||
{ Quantity == true && <th className="table-header-cell" style={{ textAlign: "center", fontFamily: "sans-serif" }}>Qty</th>}
|
{ Quantity == true && <th className="table-header-cell" style={{...tableHeaderStyle, textAlign: "center", fontFamily: "sans-serif" }}>Qty</th>}
|
||||||
|
|
||||||
{ MRP == true && <th className="table-header-cell" style={{ textAlign: "right", fontFamily: "sans-serif" }}>MRP</th>}
|
{ MRP == true && <th className="table-header-cell" style={{...tableHeaderStyle, textAlign: "right", fontFamily: "sans-serif" }}>MRP</th>}
|
||||||
|
|
||||||
{ Rate == true && <th className="table-header-cell" style={{ textAlign: "right", fontFamily: "sans-serif" }}>Rate</th>}
|
{ Rate == true && <th className="table-header-cell" style={{...tableHeaderStyle, textAlign: "right", fontFamily: "sans-serif" }}>Rate</th>}
|
||||||
|
|
||||||
{ Discount == true && <th className="table-header-cell" style={{ textAlign: "right", fontFamily: "sans-serif" }}>Dis</th>}
|
{ Discount == true && <th className="table-header-cell" style={{...tableHeaderStyle, textAlign: "right", fontFamily: "sans-serif" }}>Dis</th>}
|
||||||
|
|
||||||
{ Amount == true && <th className="table-header-cell" style={{ textAlign: "right", fontFamily: "sans-serif" }}>Amount</th>}
|
{ Amount == true && <th className="table-header-cell" style={{...tableHeaderStyle, textAlign: "right", fontFamily: "sans-serif" }}>Amount</th>}
|
||||||
|
|
||||||
</tr>
|
</tr>
|
||||||
|
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
{(dataChunk || []).map((item, idx) => (
|
{(dataChunk || []).map((item, idx) => (
|
||||||
<tr key={idx} className="table-row">
|
<tr key={idx} className="table-row"
|
||||||
|
style={
|
||||||
|
idx % 2 !== 1 && rowtypeStyle === "even"
|
||||||
|
? {
|
||||||
|
...tableBodyStyle
|
||||||
|
}
|
||||||
|
: idx % 2 === 1 && rowtypeStyle === "odd"
|
||||||
|
? {
|
||||||
|
...tableBodyStyle
|
||||||
|
}
|
||||||
|
: {}
|
||||||
|
}>
|
||||||
{SLNO == true && (
|
{SLNO == true && (
|
||||||
<td className="table-header-cell" style={{ textAlign: "center", fontFamily: "sans-serif" }}>
|
<td className="table-header-cell" style={{ textAlign: "center", fontFamily: "sans-serif" }}>
|
||||||
{chunkIndex * chunkSize + idx + 1}
|
{chunkIndex * chunkSize + idx + 1}
|
||||||
|
|
@ -1223,7 +1295,7 @@ const PurPrintA4Standard = ({ index,
|
||||||
<div id={`SQA4Standard`} className="invoice-container">
|
<div id={`SQA4Standard`} className="invoice-container">
|
||||||
<div className="invoice-wrapper">
|
<div className="invoice-wrapper">
|
||||||
{/* Header */}
|
{/* Header */}
|
||||||
<div className="header-section">
|
<div className="header-section" style={{...headerStyle}}>
|
||||||
<h1 className="company-name">{GlobaldummyData ? "Company Name" : companyName}</h1>
|
<h1 className="company-name">{GlobaldummyData ? "Company Name" : companyName}</h1>
|
||||||
<p>{companyAddress}</p>
|
<p>{companyAddress}</p>
|
||||||
<div>Phone: {GlobaldummyData ? "999999XXXX" : companyPhone}</div>
|
<div>Phone: {GlobaldummyData ? "999999XXXX" : companyPhone}</div>
|
||||||
|
|
@ -1340,62 +1412,52 @@ const PurPrintA4Standard = ({ index,
|
||||||
<tr className="table-header">
|
<tr className="table-header">
|
||||||
{GlobaldummyData
|
{GlobaldummyData
|
||||||
? GlobalSlNo && <th className="table-header-cell">S.No</th> :
|
? GlobalSlNo && <th className="table-header-cell">S.No</th> :
|
||||||
SLNO == true && <th className="table-header-cell">S.No</th>}
|
SLNO == true && <th style={{...tableHeaderStyle,}} className="table-header-cell">S.No</th>}
|
||||||
|
|
||||||
{GlobaldummyData
|
{GlobaldummyData
|
||||||
? GlobalItem && <th className="table-header-cell">Item</th> :
|
? GlobalItem && <th className="table-header-cell">Item</th> :
|
||||||
Item == true && <th className="table-header-cell">Item</th>}
|
Item == true && <th style={{...tableHeaderStyle,}} className="table-header-cell">Item</th>}
|
||||||
|
|
||||||
|
|
||||||
{GlobaldummyData
|
{GlobaldummyData
|
||||||
? GlobalHsnCode && <th className="table-header-cell">HSN </th> :
|
? GlobalHsnCode && <th className="table-header-cell">HSN </th> :
|
||||||
HsnCode == true && <th className="table-header-cell">HSN </th>}
|
HsnCode == true && <th style={{...tableHeaderStyle,}}className="table-header-cell">HSN </th>}
|
||||||
|
|
||||||
{GlobaldummyData
|
{GlobaldummyData
|
||||||
? GlobalQuantity && <th className="table-header-cell">Qty</th>
|
? GlobalQuantity && <th className="table-header-cell">Qty</th>
|
||||||
: Quantity == true && <th className="table-header-cell">Qty</th>}
|
: Quantity == true && <th style={{...tableHeaderStyle,}}className="table-header-cell">Qty</th>}
|
||||||
|
|
||||||
{/* <th className="table-header-cell">UOM</th>
|
{/* <th className="table-header-cell">UOM</th>
|
||||||
<th className="table-header-cell">UOM</th> */}
|
<th className="table-header-cell">UOM</th> */}
|
||||||
|
|
||||||
{GlobaldummyData
|
{GlobaldummyData
|
||||||
? GlobalMRP && <th className="table-header-cell">MRP</th>
|
? GlobalMRP && <th className="table-header-cell">MRP</th>
|
||||||
: MRP == true && <th className="table-header-cell">MRP</th>}
|
: MRP == true && <th style={{...tableHeaderStyle,}}className="table-header-cell">MRP</th>}
|
||||||
|
|
||||||
{GlobaldummyData
|
{GlobaldummyData
|
||||||
? GlobalRate && <th className="table-header-cell">Rate</th>
|
? GlobalRate && <th className="table-header-cell">Rate</th>
|
||||||
: Rate == true && <th className="table-header-cell">Rate</th>}
|
: Rate == true && <th style={{...tableHeaderStyle,}}className="table-header-cell">Rate</th>}
|
||||||
|
|
||||||
{GlobaldummyData
|
{GlobaldummyData
|
||||||
? GlobalDiscount && <th className="table-header-cell">Dis</th>
|
? GlobalDiscount && <th className="table-header-cell">Dis</th>
|
||||||
: Discount == true && <th className="table-header-cell">Dis</th>}
|
: Discount == true && <th style={{...tableHeaderStyle,}}className="table-header-cell">Dis</th>}
|
||||||
|
|
||||||
{GlobaldummyData
|
{GlobaldummyData
|
||||||
? GlobalAmount && <th className="table-header-cell">Amount</th>
|
? GlobalAmount && <th className="table-header-cell">Amount</th>
|
||||||
: Amount == true && <th className="table-header-cell">Amount</th>}
|
: Amount == true && <th style={{...tableHeaderStyle,}}className="table-header-cell">Amount</th>}
|
||||||
|
|
||||||
{/* <th className="table-header-cell">Taxable</th>
|
|
||||||
<th className="table-header-cell-center" colSpan="2">IGST</th>
|
|
||||||
<th className="table-header-cell-last">Total</th> */}
|
|
||||||
</tr>
|
</tr>
|
||||||
{/* <tr className="table-header">
|
|
||||||
<th className="table-header-cell"></th>
|
|
||||||
<th className="table-header-cell"></th>
|
|
||||||
<th className="table-header-cell"></th>
|
|
||||||
<th className="table-header-cell"></th>
|
|
||||||
<th className="table-header-cell"></th>
|
|
||||||
<th className="table-header-cell"></th>
|
|
||||||
<th className="table-header-cell"></th>
|
|
||||||
<th className="table-header-cell"></th>
|
|
||||||
<th className="table-header-cell"></th>
|
|
||||||
<th className="table-header-cell-center">Rate</th>
|
|
||||||
<th className="table-header-cell-center">Amount</th>
|
|
||||||
<th className="table-header-cell-last"></th>
|
|
||||||
</tr> */}
|
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
{((GlobaldummyData ? products : productsData) || []).map((item, idx) => (
|
{((GlobaldummyData ? products : productsData) || []).map((item, idx) => (
|
||||||
<tr key={idx} className="table-row">
|
<tr key={idx} className="table-row"
|
||||||
|
style={
|
||||||
|
idx % 2 !== 1 && rowtypeStyle === "even"
|
||||||
|
? {
|
||||||
|
...tableBodyStyle
|
||||||
|
}
|
||||||
|
: idx % 2 === 1 && rowtypeStyle === "odd"
|
||||||
|
? {
|
||||||
|
...tableBodyStyle
|
||||||
|
}
|
||||||
|
: {}
|
||||||
|
}>
|
||||||
{GlobaldummyData
|
{GlobaldummyData
|
||||||
? GlobalSlNo && (
|
? GlobalSlNo && (
|
||||||
<td className="table-header-cell" style={{ textAlign: "center" }}>
|
<td className="table-header-cell" style={{ textAlign: "center" }}>
|
||||||
|
|
@ -1513,6 +1575,7 @@ const PurPrintA4Standard = ({ index,
|
||||||
fontSize: "10px",
|
fontSize: "10px",
|
||||||
flexWrap: "wrap",
|
flexWrap: "wrap",
|
||||||
gap: "2px",
|
gap: "2px",
|
||||||
|
...netAmountStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<div
|
<div
|
||||||
|
|
@ -1537,20 +1600,13 @@ const PurPrintA4Standard = ({ index,
|
||||||
{" "}
|
{" "}
|
||||||
Qty:{GlobaldummyData ? "9" : totalQuantity}
|
Qty:{GlobaldummyData ? "9" : totalQuantity}
|
||||||
</div>
|
</div>
|
||||||
{/* {ExtraChargeTotal > 0 && <p style={{ margin: 0, padding: 0, fontSize: "12px" }}> Extra Charges:{ExtraChargeTotal}</p>} */}
|
|
||||||
|
|
||||||
|
|
||||||
{/* {(TotalOfferAmount > 0 || table2Data?.OverallDisc > 0) && (
|
|
||||||
<p style={{ margin: 0, padding: 0, fontSize: "10px", fontWeight: "600" }}>
|
|
||||||
Off :{(Number(TotalOfferAmount || 0) + Number(table2Data?.OverallDisc || 0)).toFixed(2)}
|
|
||||||
</p>
|
|
||||||
)} */}
|
|
||||||
<div
|
<div
|
||||||
style={{
|
style={{
|
||||||
margin: 0,
|
margin: 0,
|
||||||
padding: 0,
|
padding: 0,
|
||||||
fontSize: "10px",
|
fontSize: "10px",
|
||||||
fontWeight: "600",
|
fontWeight: "600",
|
||||||
|
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
Amount :₹
|
Amount :₹
|
||||||
|
|
|
||||||
|
|
@ -4,21 +4,22 @@ import QrImage from '../../../Images/qrcode.jpg';
|
||||||
import Logo from '../../../Images/Logo.jpg'
|
import Logo from '../../../Images/Logo.jpg'
|
||||||
import { extractLastNumber, extractLastNumberOrderId, printDiv } from '../../../Services/Others';
|
import { extractLastNumber, extractLastNumberOrderId, printDiv } from '../../../Services/Others';
|
||||||
import {
|
import {
|
||||||
|
|
||||||
|
|
||||||
changeReprintDataFound,
|
changeReprintDataFound,
|
||||||
GloabalFieldDetails,
|
|
||||||
GlobalprintSignature,
|
|
||||||
GlobalprinttermsAndConditions,
|
GlobalprinttermsAndConditions,
|
||||||
GlobalSignatureImage,
|
GlobalSelectedPrintHeaderFontColor,
|
||||||
Globalnotes,
|
GlobalSelectedTableHeaderColor,
|
||||||
GlobalthemeFormat,
|
GlobalSelectedTableHeaderFontColor,
|
||||||
GlobalBillName,
|
GlobalSelectedTableBodyColor,
|
||||||
|
GlobalSelectedTableBodyFontColor,
|
||||||
|
GlobalRowType,
|
||||||
|
GlobalSelectedFooterColor,
|
||||||
|
GlobalSelectedFooterFontColor,
|
||||||
|
GlobalSelectedNetAmountColor,
|
||||||
|
GlobalSelectedNetAmountFontColor,
|
||||||
|
GlobalPritdummyData,
|
||||||
|
GlobalSelectedPrintHeaderColor,
|
||||||
} from '../../../Features/ThemeChange/ThemeChange'
|
} from '../../../Features/ThemeChange/ThemeChange'
|
||||||
import { GlobalUpiIDprint } from '../../../Features/BookingScreen/BookingData/BookingData';
|
|
||||||
import '../../../Styles/BookingScreen/PrintTemplates/ThermalPrinter/PrintStyle12.scss'
|
import '../../../Styles/BookingScreen/PrintTemplates/ThermalPrinter/PrintStyle12.scss'
|
||||||
import QRCode from 'react-qr-code';
|
|
||||||
import signature from "../../../Images/signatureimage.jpg"
|
|
||||||
import { ApplicationPreferences } from '../../../Features/BrachLogin/BranchLogin';
|
import { ApplicationPreferences } from '../../../Features/BrachLogin/BranchLogin';
|
||||||
import { isMobile } from 'react-device-detect';
|
import { isMobile } from 'react-device-detect';
|
||||||
|
|
||||||
|
|
@ -28,8 +29,19 @@ const PurPrintStyle12 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
|
||||||
OrderDetailGST, OrderDetailIGST, OrderDetailVAT, table2Data, PaymentStatus, PrintGreeting, printDatas }) => {
|
OrderDetailGST, OrderDetailIGST, OrderDetailVAT, table2Data, PaymentStatus, PrintGreeting, printDatas }) => {
|
||||||
|
|
||||||
const dispatch = useDispatch();
|
const dispatch = useDispatch();
|
||||||
const GlobalUpiID = useSelector(GlobalUpiIDprint)
|
|
||||||
// const FieldDetails = useSelector(GloabalFieldDetails);
|
// const FieldDetails = useSelector(GloabalFieldDetails);
|
||||||
|
const GlobaldummyData = useSelector(GlobalPritdummyData);
|
||||||
|
const SelectedHeaderColor = useSelector(GlobalSelectedPrintHeaderColor);
|
||||||
|
const SelectedHeaderFontColor = useSelector(GlobalSelectedPrintHeaderFontColor);
|
||||||
|
const SelectedTableHeaderColor = useSelector(GlobalSelectedTableHeaderColor);
|
||||||
|
const SelectedTableHeaderFontColor = useSelector(GlobalSelectedTableHeaderFontColor);
|
||||||
|
const SelectedTableBodyColor = useSelector(GlobalSelectedTableBodyColor);
|
||||||
|
const SelectedTableBodyFontColor = useSelector(GlobalSelectedTableBodyFontColor);
|
||||||
|
const SelectedRowType = useSelector(GlobalRowType);
|
||||||
|
const SelectedTableFooterColor = useSelector(GlobalSelectedFooterColor);
|
||||||
|
const SelectedTableFooterFontColor = useSelector(GlobalSelectedFooterFontColor);
|
||||||
|
const SelectedNetAmountColor = useSelector(GlobalSelectedNetAmountColor);
|
||||||
|
const SelectedNetAmountFontColor = useSelector(GlobalSelectedNetAmountFontColor);
|
||||||
|
|
||||||
const FieldDetails = printDatas?.FieldDetails?.reduce((acc, item) => {
|
const FieldDetails = printDatas?.FieldDetails?.reduce((acc, item) => {
|
||||||
acc[item.ConfigName] = true;
|
acc[item.ConfigName] = true;
|
||||||
|
|
@ -44,13 +56,14 @@ const PurPrintStyle12 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
|
||||||
const Rate = FieldDetails?.["Rate"];
|
const Rate = FieldDetails?.["Rate"];
|
||||||
const Amount = FieldDetails?.["Amount"];
|
const Amount = FieldDetails?.["Amount"];
|
||||||
const HsnCode = FieldDetails?.["HsnCode"];
|
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 GlobaltermsAndConditions = useSelector(GlobalprinttermsAndConditions);
|
const GlobaltermsAndConditions = useSelector(GlobalprinttermsAndConditions);
|
||||||
const appPreferences = useSelector(ApplicationPreferences);
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
let TermsAndConditions = printDatas?.TermsandConditions
|
let TermsAndConditions = printDatas?.TermsandConditions
|
||||||
let SignatureImg = printDatas?.Signature
|
let SignatureImg = printDatas?.Signature
|
||||||
let Notestext = printDatas?.Notes
|
let Notestext = printDatas?.Notes
|
||||||
|
|
@ -229,20 +242,61 @@ const PurPrintStyle12 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
|
||||||
const PrintA4 = async () => {
|
const PrintA4 = async () => {
|
||||||
await printDiv("SQPrintStyle12", style12, 'FontApply');
|
await printDiv("SQPrintStyle12", style12, 'FontApply');
|
||||||
};
|
};
|
||||||
console.log(table2Data, 'Address1');
|
|
||||||
|
|
||||||
|
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 (
|
return (
|
||||||
<>
|
<>
|
||||||
{
|
{
|
||||||
FormatTheme ?
|
FormatTheme ?
|
||||||
<div id="SQPrintStyle12" onClick={PrintA4} className='PrintStyle12MasterDiv' style={{ fontFamily: "'Courier New', Courier, monospace", position: "relative", width: "100%", minHeight: isMobile ? (PageSize === "A5" ? "210mm" : "297mm") : "auto" }}>
|
<div id="SQPrintStyle12" onClick={PrintA4} className='PrintStyle12MasterDiv' style={{ fontFamily: "'Courier New', Courier, monospace", position: "relative", width: "100%", minHeight: isMobile ? (PageSize === "A5" ? "210mm" : "297mm") : "auto" }}>
|
||||||
|
|
||||||
{paginatedChunks.map((dataChunk, chunkIndex) => (
|
{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={`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: isMobile ? "fixed" : "", top: 0, width: "100%", ...headerStyle }}>
|
||||||
|
|
||||||
<div className="header" style={{ position: isMobile ? "fixed" : "", top: 0, width: "100%" }}>
|
|
||||||
<div className='PrintStyle12-firstDiv'>
|
<div className='PrintStyle12-firstDiv'>
|
||||||
|
|
||||||
<div style={{ display: "flex", flexDirection: "column" }}>
|
<div style={{ display: "flex", flexDirection: "column" }}>
|
||||||
|
|
@ -257,22 +311,15 @@ const PurPrintStyle12 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
|
||||||
return <div key={index}>{parts}</div>;
|
return <div key={index}>{parts}</div>;
|
||||||
})}
|
})}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div style={{ fontSize: "clamp(0.75rem, 2.5vw, 1rem)" }}> Mobile : +91 {table2Data?.customerMobile}</div>
|
<div style={{ fontSize: "clamp(0.75rem, 2.5vw, 1rem)" }}> Mobile : +91 {table2Data?.customerMobile}</div>
|
||||||
|
|
||||||
|
|
||||||
{
|
{
|
||||||
<div style={{ fontSize: "clamp(0.75rem, 2.5vw, 1rem)" }}>Customer Name : {table2Data?.customerName}
|
<div style={{ fontSize: "clamp(0.75rem, 2.5vw, 1rem)" }}>Customer Name : {table2Data?.customerName}
|
||||||
</div>
|
</div>
|
||||||
}
|
}
|
||||||
|
|
||||||
{table2Data?.CustSuppName && table2Data?.CustSuppName !== undefined && table2Data?.CustSuppName !== null &&
|
{table2Data?.CustSuppName && table2Data?.CustSuppName !== undefined && table2Data?.CustSuppName !== null &&
|
||||||
<div style={{ fontSize: "clamp(0.75rem, 2.5vw, 1rem)" }}>Customer : {table2Data?.CustSuppName}
|
<div style={{ fontSize: "clamp(0.75rem, 2.5vw, 1rem)" }}>Customer : {table2Data?.CustSuppName}
|
||||||
</div>
|
</div>
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
{table2Data?.OrderType === "E" && <div style={{ fontSize: "clamp(0.75rem, 2.5vw, 1rem)", fontWeight: '600' }}>Estimate </div>}
|
{table2Data?.OrderType === "E" && <div style={{ fontSize: "clamp(0.75rem, 2.5vw, 1rem)", fontWeight: '600' }}>Estimate </div>}
|
||||||
</div>
|
</div>
|
||||||
<div style={{ display: "flex" }}> <img style={{ width: "60px", height: "60px" }} src={base64Image} alt='image' /></div>
|
<div style={{ display: "flex" }}> <img style={{ width: "60px", height: "60px" }} src={base64Image} alt='image' /></div>
|
||||||
|
|
@ -292,19 +339,29 @@ const PurPrintStyle12 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
|
||||||
<table className="PrintStyle12-print-table">
|
<table className="PrintStyle12-print-table">
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
{SLNO && <th>S.No</th>}
|
{SLNO && <th style={{ ...tableHeaderStyle }}>S.No</th>}
|
||||||
{Item && <th>Des</th>}
|
{Item && <th style={{ ...tableHeaderStyle }}>Des</th>}
|
||||||
{Quantity && <th style={{ textAlign: "right" }}>Qty</th>}
|
{Quantity && <th style={{ ...tableHeaderStyle, textAlign: "right" }}>Qty</th>}
|
||||||
{MRP && <th style={{ textAlign: 'right' }}>MRP</th>}
|
{MRP && <th style={{ ...tableHeaderStyle, textAlign: 'right' }}>MRP</th>}
|
||||||
{Rate && <th style={{ textAlign: "right" }}>Rate</th>}
|
{Rate && <th style={{ ...tableHeaderStyle, textAlign: "right" }}>Rate</th>}
|
||||||
{HsnCode && <th style={{ textAlign: "right" }}>HSN</th>}
|
{HsnCode && <th style={{ ...tableHeaderStyle, textAlign: "right" }}>HSN</th>}
|
||||||
{Discount && <th style={{ textAlign: 'right' }}>(%)</th>}
|
{Discount && <th style={{ ...tableHeaderStyle, textAlign: 'right' }}>(%)</th>}
|
||||||
{Amount && <th style={{ textAlign: "right" }}>Amt</th>}
|
{Amount && <th style={{ ...tableHeaderStyle, textAlign: "right" }}>Amt</th>}
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
{dataChunk?.map((item, index) => (
|
{dataChunk?.map((item, index) => (
|
||||||
<tr key={index}>
|
<tr key={index} style={
|
||||||
|
index % 2 !== 1 && rowtypeStyle === "even"
|
||||||
|
? {
|
||||||
|
...tableBodyStyle
|
||||||
|
}
|
||||||
|
: index % 2 === 1 && rowtypeStyle === "odd"
|
||||||
|
? {
|
||||||
|
...tableBodyStyle
|
||||||
|
}
|
||||||
|
: {}
|
||||||
|
}>
|
||||||
{SLNO && <td>{index + 1}</td>}
|
{SLNO && <td>{index + 1}</td>}
|
||||||
{Item && (
|
{Item && (
|
||||||
<td style={{ display: 'flex', flexDirection: 'column' }}>
|
<td style={{ display: 'flex', flexDirection: 'column' }}>
|
||||||
|
|
@ -383,7 +440,7 @@ const PurPrintStyle12 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
|
||||||
<hr style={{ width: '100%', borderWidth: '0.7px', borderTop: '0.5px solid rgb(0, 0, 0)' }} />
|
<hr style={{ width: '100%', borderWidth: '0.7px', borderTop: '0.5px solid rgb(0, 0, 0)' }} />
|
||||||
|
|
||||||
|
|
||||||
<div style={{ display: "flex", justifyContent: "space-between" }}>
|
<div style={{ display: "flex", justifyContent: "space-between" ,...netAmountStyle}}>
|
||||||
<div style={{ width: '45%', fontWeight: "600" }}>
|
<div style={{ width: '45%', fontWeight: "600" }}>
|
||||||
Amount
|
Amount
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -391,9 +448,6 @@ const PurPrintStyle12 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
|
||||||
<div style={{ padding: '0rem 1rem', display: "flex", justifyContent: "flex-end", fontWeight: "600", width: '35%' }}>
|
<div style={{ padding: '0rem 1rem', display: "flex", justifyContent: "flex-end", fontWeight: "600", width: '35%' }}>
|
||||||
{Number(table2Data?.[0]?.NetAmount || 0).toFixed(2)}
|
{Number(table2Data?.[0]?.NetAmount || 0).toFixed(2)}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{console.log(table2Data?.[0]?.NetAmount, 'table2Data?.NetAmount')
|
|
||||||
}
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div>
|
<div>
|
||||||
|
|
@ -562,6 +616,7 @@ const PurPrintStyle12 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
|
||||||
pageBreakBefore: "avoid",
|
pageBreakBefore: "avoid",
|
||||||
pageBreakInside: "avoid",
|
pageBreakInside: "avoid",
|
||||||
minHeight: "auto",
|
minHeight: "auto",
|
||||||
|
...footerColorStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{
|
{
|
||||||
|
|
@ -663,7 +718,7 @@ const PurPrintStyle12 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
|
||||||
<hr style={{ width: '100%', borderWidth: '0.7px', borderTop: '0.5px solid rgb(0, 0, 0)' }} />
|
<hr style={{ width: '100%', borderWidth: '0.7px', borderTop: '0.5px solid rgb(0, 0, 0)' }} />
|
||||||
|
|
||||||
|
|
||||||
<div style={{ display: "flex", justifyContent: "space-between" }}>
|
<div style={{ display: "flex", justifyContent: "space-between",...netAmountStyle }}>
|
||||||
<div style={{ width: '45%', fontWeight: "600" }}>
|
<div style={{ width: '45%', fontWeight: "600" }}>
|
||||||
Amount
|
Amount
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -820,6 +875,7 @@ const PurPrintStyle12 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
|
||||||
pageBreakBefore: "avoid",
|
pageBreakBefore: "avoid",
|
||||||
pageBreakInside: "avoid",
|
pageBreakInside: "avoid",
|
||||||
minHeight: "auto",
|
minHeight: "auto",
|
||||||
|
...footerColorStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{
|
{
|
||||||
|
|
@ -861,14 +917,9 @@ const PurPrintStyle12 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
|
||||||
</div>
|
</div>
|
||||||
}
|
}
|
||||||
|
|
||||||
</div>
|
</div> :
|
||||||
|
|
||||||
|
|
||||||
:
|
|
||||||
<div id={`SQPrintStyle12`} className='PrintStyle12MasterDiv' style={{ fontFamily: "'Courier New', Courier, monospace" }}>
|
<div id={`SQPrintStyle12`} className='PrintStyle12MasterDiv' style={{ fontFamily: "'Courier New', Courier, monospace" }}>
|
||||||
<div className='PrintStyle12-firstDiv'>
|
<div className='PrintStyle12-firstDiv' style={{ ...headerStyle }}>
|
||||||
|
|
||||||
{/* <h3>{table2Data?.BrName}</h3> */}
|
|
||||||
<div style={{ display: "flex", flexDirection: "column" }}>
|
<div style={{ display: "flex", flexDirection: "column" }}>
|
||||||
<hr style={{ width: '100%', borderWidth: '0.7px', borderTop: '0.5px dashed rgb(0, 0, 0)' }} />
|
<hr style={{ width: '100%', borderWidth: '0.7px', borderTop: '0.5px dashed rgb(0, 0, 0)' }} />
|
||||||
|
|
||||||
|
|
@ -886,19 +937,9 @@ const PurPrintStyle12 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
|
||||||
<div style={{ fontSize: "clamp(0.75rem, 2.5vw, 1rem)" }}>Customer : {table2Data?.CustSuppName}
|
<div style={{ fontSize: "clamp(0.75rem, 2.5vw, 1rem)" }}>Customer : {table2Data?.CustSuppName}
|
||||||
</div>
|
</div>
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
{table2Data?.BookingTypeName == 'Dine In' &&
|
|
||||||
<div>
|
|
||||||
Waiter : {table2Data?.SalesTableLinkDetails?.[0]?.WaiterName}
|
|
||||||
</div>}
|
|
||||||
{table2Data?.OrderType === "E" && <div style={{ fontSize: "clamp(0.75rem, 2.5vw, 1rem)", fontWeight: '600' }}>Estimate </div>}
|
|
||||||
</div>
|
</div>
|
||||||
<div style={{ display: "flex" }}> <img style={{ width: "60px", height: "60px" }} src={base64Image} alt='image' /></div>
|
<div style={{ display: "flex" }}> <img style={{ width: "60px", height: "60px" }} src={base64Image} alt='image' /></div>
|
||||||
</div>
|
</div>
|
||||||
{/* <div style={{ display: "flex", justifyContent: "left", marginTop: '5px' }}>
|
|
||||||
<p style={{ marginTop: '5px', padding: 0, fontSize: "17px", fontWeight: "600" }}>{table2Data?.PaymentTypeName} Payment : {Number(table2Data?.NetAmount).toFixed(2)}/- </p>
|
|
||||||
</div> */}
|
|
||||||
<div className='PrintStyle12-SecondDiv'>
|
<div className='PrintStyle12-SecondDiv'>
|
||||||
<div style={{ fontWeight: '600', fontSize: "clamp(0.9286rem, 2.5vw, 1rem)" }}>Bill No : {table2Data?.[0]?.QuotationNo && extractLastNumber(table2Data?.[0]?.QuotationNo)}</div>
|
<div style={{ fontWeight: '600', fontSize: "clamp(0.9286rem, 2.5vw, 1rem)" }}>Bill No : {table2Data?.[0]?.QuotationNo && extractLastNumber(table2Data?.[0]?.QuotationNo)}</div>
|
||||||
<div style={{ fontSize: "clamp(0.75rem, 2.5vw, 1rem)", padding: '0 1rem' }}>{Date1}</div>
|
<div style={{ fontSize: "clamp(0.75rem, 2.5vw, 1rem)", padding: '0 1rem' }}>{Date1}</div>
|
||||||
|
|
@ -913,20 +954,30 @@ const PurPrintStyle12 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
|
||||||
<table className="PrintStyle12-print-table">
|
<table className="PrintStyle12-print-table">
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
{SLNO && <th>S.No</th>}
|
{SLNO && <th style={{ ...tableHeaderStyle }}>S.No</th>}
|
||||||
{Item && <th>Des</th>}
|
{Item && <th style={{ ...tableHeaderStyle }}>Des</th>}
|
||||||
{Quantity && <th style={{ textAlign: "right" }}>Qty</th>}
|
{Quantity && <th style={{ ...tableHeaderStyle, textAlign: "right" }}>Qty</th>}
|
||||||
{MRP && <th style={{ textAlign: 'right' }}>MRP</th>}
|
{MRP && <th style={{ ...tableHeaderStyle, textAlign: 'right' }}>MRP</th>}
|
||||||
{Rate && <th style={{ textAlign: "right" }}>Rate</th>}
|
{Rate && <th style={{ ...tableHeaderStyle, textAlign: "right" }}>Rate</th>}
|
||||||
{HsnCode && <th style={{ textAlign: "right" }}>HSN</th>}
|
{HsnCode && <th style={{ ...tableHeaderStyle, textAlign: "right" }}>HSN</th>}
|
||||||
{Discount && <th style={{ textAlign: 'right' }}>(%)</th>}
|
{Discount && <th style={{ ...tableHeaderStyle, textAlign: 'right' }}>(%)</th>}
|
||||||
{Amount && <th style={{ textAlign: "right" }}>Amt</th>}
|
{Amount && <th style={{ ...tableHeaderStyle, textAlign: "right" }}>Amt</th>}
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
{TakeawayData?.map((item, index) => {
|
{TakeawayData?.map((item, index) => {
|
||||||
return (
|
return (
|
||||||
<tr key={index}>
|
<tr key={index} style={
|
||||||
|
index % 2 !== 1 && rowtypeStyle === "even"
|
||||||
|
? {
|
||||||
|
...tableBodyStyle
|
||||||
|
}
|
||||||
|
: index % 2 === 1 && rowtypeStyle === "odd"
|
||||||
|
? {
|
||||||
|
...tableBodyStyle
|
||||||
|
}
|
||||||
|
: {}
|
||||||
|
}>
|
||||||
{SLNO && <td>{index + 1}</td>}
|
{SLNO && <td>{index + 1}</td>}
|
||||||
{Item && (
|
{Item && (
|
||||||
<td style={{ display: 'flex', flexDirection: 'column' }}>
|
<td style={{ display: 'flex', flexDirection: 'column' }}>
|
||||||
|
|
@ -1010,7 +1061,7 @@ const PurPrintStyle12 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
|
||||||
<hr style={{ width: '100%', borderWidth: '0.7px', borderTop: '0.5px solid rgb(0, 0, 0)' }} />
|
<hr style={{ width: '100%', borderWidth: '0.7px', borderTop: '0.5px solid rgb(0, 0, 0)' }} />
|
||||||
|
|
||||||
|
|
||||||
<div style={{ display: "flex", justifyContent: "space-between" }}>
|
<div style={{ display: "flex", justifyContent: "space-between",...netAmountStyle}}>
|
||||||
<div style={{ width: '45%', fontWeight: "600" }}>
|
<div style={{ width: '45%', fontWeight: "600" }}>
|
||||||
Amount
|
Amount
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -1173,6 +1224,7 @@ const PurPrintStyle12 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
|
||||||
pageBreakBefore: "avoid",
|
pageBreakBefore: "avoid",
|
||||||
pageBreakInside: "avoid",
|
pageBreakInside: "avoid",
|
||||||
minHeight: "auto",
|
minHeight: "auto",
|
||||||
|
...footerColorStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{
|
{
|
||||||
|
|
|
||||||
|
|
@ -7,7 +7,22 @@ import { printDiv } from "../../../Services/Others";
|
||||||
|
|
||||||
import '../../../Styles/BookingScreen/PrintTemplates/A4/PrintA4Style11.scss'
|
import '../../../Styles/BookingScreen/PrintTemplates/A4/PrintA4Style11.scss'
|
||||||
import { useSelector } from 'react-redux';
|
import { useSelector } from 'react-redux';
|
||||||
import { GloabalFieldDetails, GlobalBillName, Globalnotes, GlobalprintAmount, GlobalprintDiscount, GlobalprintHsnCode, GlobalprintItem, GlobalprintMRP, GlobalprintQrcodet, GlobalprintQuantity, GlobalprintRate, GlobalprintSignature, GlobalprintSlNo, GlobalprinttermsAndConditions, GlobalPritdummyData, GlobalSignatureImage, GlobalthemeFormat } from '../../../Features/ThemeChange/ThemeChange';
|
import {
|
||||||
|
GloabalFieldDetails, GlobalBillName, Globalnotes,
|
||||||
|
GlobalprintQrcodet, GlobalprintSignature, GlobalprintSlNo, GlobalprinttermsAndConditions, GlobalPritdummyData,
|
||||||
|
GlobalSignatureImage, GlobalthemeFormat,
|
||||||
|
GlobalSelectedPrintHeaderFontColor,
|
||||||
|
GlobalSelectedTableHeaderColor,
|
||||||
|
GlobalSelectedTableHeaderFontColor,
|
||||||
|
GlobalSelectedTableBodyColor,
|
||||||
|
GlobalSelectedTableBodyFontColor,
|
||||||
|
GlobalRowType,
|
||||||
|
GlobalSelectedFooterColor,
|
||||||
|
GlobalSelectedFooterFontColor,
|
||||||
|
GlobalSelectedNetAmountColor,
|
||||||
|
GlobalSelectedNetAmountFontColor,
|
||||||
|
GlobalSelectedPrintHeaderColor,
|
||||||
|
} from '../../../Features/ThemeChange/ThemeChange';
|
||||||
import signature from "../../../Images/signatureimage.jpg"
|
import signature from "../../../Images/signatureimage.jpg"
|
||||||
import QRCode from 'react-qr-code';
|
import QRCode from 'react-qr-code';
|
||||||
import { isMobile } from 'react-device-detect';
|
import { isMobile } from 'react-device-detect';
|
||||||
|
|
@ -19,6 +34,17 @@ const PurPrintStyleA4 = ({ index, ExtraChargeTotal, UpiId, Date1, base64Image, t
|
||||||
const GlobalSignature = useSelector(GlobalprintSignature);
|
const GlobalSignature = useSelector(GlobalprintSignature);
|
||||||
const GlobaltermsAndConditions = useSelector(GlobalprinttermsAndConditions);
|
const GlobaltermsAndConditions = useSelector(GlobalprinttermsAndConditions);
|
||||||
// const FieldDetails = useSelector(GloabalFieldDetails);
|
// const FieldDetails = useSelector(GloabalFieldDetails);
|
||||||
|
const SelectedHeaderColor = useSelector(GlobalSelectedPrintHeaderColor);
|
||||||
|
const SelectedHeaderFontColor = useSelector(GlobalSelectedPrintHeaderFontColor);
|
||||||
|
const SelectedTableHeaderColor = useSelector(GlobalSelectedTableHeaderColor);
|
||||||
|
const SelectedTableHeaderFontColor = useSelector(GlobalSelectedTableHeaderFontColor);
|
||||||
|
const SelectedTableBodyColor = useSelector(GlobalSelectedTableBodyColor);
|
||||||
|
const SelectedTableBodyFontColor = useSelector(GlobalSelectedTableBodyFontColor);
|
||||||
|
const SelectedRowType = useSelector(GlobalRowType);
|
||||||
|
const SelectedTableFooterColor = useSelector(GlobalSelectedFooterColor);
|
||||||
|
const SelectedTableFooterFontColor = useSelector(GlobalSelectedFooterFontColor);
|
||||||
|
const SelectedNetAmountColor = useSelector(GlobalSelectedNetAmountColor);
|
||||||
|
const SelectedNetAmountFontColor = useSelector(GlobalSelectedNetAmountFontColor);
|
||||||
const FieldDetails = printDatas?.FieldDetails?.reduce((acc, item) => {
|
const FieldDetails = printDatas?.FieldDetails?.reduce((acc, item) => {
|
||||||
acc[item.ConfigName] = true;
|
acc[item.ConfigName] = true;
|
||||||
return acc;
|
return acc;
|
||||||
|
|
@ -37,6 +63,12 @@ const PurPrintStyleA4 = ({ index, ExtraChargeTotal, UpiId, Date1, base64Image, t
|
||||||
const Qrcodet = FieldDetails?.["Qrcode"];
|
const Qrcodet = FieldDetails?.["Qrcode"];
|
||||||
const Signature = FieldDetails?.["signature"];
|
const Signature = FieldDetails?.["signature"];
|
||||||
const TermsnAdCondition = FieldDetails?.["terms&conditions"];
|
const TermsnAdCondition = FieldDetails?.["terms&conditions"];
|
||||||
|
let printColors = printDatas?.PrintColors;
|
||||||
|
const headerColor = printColors?.find(obj => obj.headerColor)?.headerColor;
|
||||||
|
const tableHeaderColor = printColors?.find(obj => obj.tableHeaderColor)?.tableHeaderColor;
|
||||||
|
const tableBodyColor = printColors?.find(obj => obj.tableBodyColor)?.tableBodyColor;
|
||||||
|
const footerColor = printColors?.find(obj => obj.footerColor)?.footerColor;
|
||||||
|
const netAmtColor = printColors?.find(obj => obj.netAmtColor)?.netAmtColor;
|
||||||
const GlobalQrcodet = useSelector(GlobalprintQrcodet);
|
const GlobalQrcodet = useSelector(GlobalprintQrcodet);
|
||||||
const GlobaldummyData = useSelector(GlobalPritdummyData);
|
const GlobaldummyData = useSelector(GlobalPritdummyData);
|
||||||
const GlobalBilltext = useSelector(GlobalBillName)
|
const GlobalBilltext = useSelector(GlobalBillName)
|
||||||
|
|
@ -87,7 +119,51 @@ const PurPrintStyleA4 = ({ index, ExtraChargeTotal, UpiId, Date1, base64Image, t
|
||||||
}
|
}
|
||||||
const lastChunkRows = paginatedChunks.length > 0 ? paginatedChunks[paginatedChunks.length - 1].length : 0;
|
const lastChunkRows = paginatedChunks.length > 0 ? paginatedChunks[paginatedChunks.length - 1].length : 0;
|
||||||
const shouldFooterBeOnNewPage = lastChunkRows > 6;
|
const shouldFooterBeOnNewPage = lastChunkRows > 6;
|
||||||
|
const headerStyle = {
|
||||||
|
backgroundColor: GlobaldummyData
|
||||||
|
? SelectedHeaderColor
|
||||||
|
: headerColor?.background,
|
||||||
|
|
||||||
|
color: GlobaldummyData
|
||||||
|
? SelectedHeaderFontColor
|
||||||
|
: headerColor?.font,
|
||||||
|
}
|
||||||
|
const tableHeaderStyle = {
|
||||||
|
backgroundColor: GlobaldummyData
|
||||||
|
? SelectedTableHeaderColor
|
||||||
|
: tableHeaderColor?.background,
|
||||||
|
|
||||||
|
color: GlobaldummyData
|
||||||
|
? SelectedTableHeaderFontColor
|
||||||
|
: tableHeaderColor?.font,
|
||||||
|
}
|
||||||
|
const tableBodyStyle = {
|
||||||
|
backgroundColor: GlobaldummyData
|
||||||
|
? SelectedTableBodyColor
|
||||||
|
: tableBodyColor?.background,
|
||||||
|
color: GlobaldummyData
|
||||||
|
? SelectedTableBodyFontColor
|
||||||
|
: tableBodyColor?.font,
|
||||||
|
}
|
||||||
|
const rowtypeStyle = GlobaldummyData ? SelectedRowType : tableBodyColor?.rowType;
|
||||||
|
const footerColorStyle = {
|
||||||
|
backgroundColor: GlobaldummyData
|
||||||
|
? SelectedTableFooterColor
|
||||||
|
: footerColor?.background,
|
||||||
|
|
||||||
|
color: GlobaldummyData
|
||||||
|
? SelectedTableFooterFontColor
|
||||||
|
: footerColor?.font,
|
||||||
|
}
|
||||||
|
const netAmountStyle = {
|
||||||
|
backgroundColor: GlobaldummyData
|
||||||
|
? SelectedNetAmountColor
|
||||||
|
: netAmtColor?.background,
|
||||||
|
|
||||||
|
color: GlobaldummyData
|
||||||
|
? SelectedNetAmountFontColor
|
||||||
|
: netAmtColor?.font,
|
||||||
|
}
|
||||||
return (
|
return (
|
||||||
<div style={{
|
<div style={{
|
||||||
display: "flex",
|
display: "flex",
|
||||||
|
|
@ -101,7 +177,7 @@ const PurPrintStyleA4 = ({ index, ExtraChargeTotal, UpiId, Date1, base64Image, t
|
||||||
<div style={{ display: "flex", flexDirection: "column", justifyContent: "space-between", height: isMobile ? (FormatTheme ? "297mm" : "auto") : '257mm' }} className="print-page" key={chunkIndex}>
|
<div style={{ display: "flex", flexDirection: "column", justifyContent: "space-between", height: isMobile ? (FormatTheme ? "297mm" : "auto") : '257mm' }} className="print-page" key={chunkIndex}>
|
||||||
<div className="page-headerA4Style11" style={{ textAlign: "center" }}>
|
<div className="page-headerA4Style11" style={{ textAlign: "center" }}>
|
||||||
|
|
||||||
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', textAlign: 'left' }}>
|
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', textAlign: 'left', ...headerStyle }}>
|
||||||
|
|
||||||
<div style={{
|
<div style={{
|
||||||
display: 'flex',
|
display: 'flex',
|
||||||
|
|
@ -149,18 +225,6 @@ const PurPrintStyleA4 = ({ index, ExtraChargeTotal, UpiId, Date1, base64Image, t
|
||||||
<div className="print-body">
|
<div className="print-body">
|
||||||
{TakeawayData?.length > 0 && (
|
{TakeawayData?.length > 0 && (
|
||||||
<>
|
<>
|
||||||
<div
|
|
||||||
style={{
|
|
||||||
display: "flex",
|
|
||||||
width: "100%",
|
|
||||||
justifyContent: "center",
|
|
||||||
alignItems: "center",
|
|
||||||
fontSize: "12px",
|
|
||||||
fontWeight: "600",
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
Take Away
|
|
||||||
</div>
|
|
||||||
<table className="A4TableStyle11" style={{ width: '100%' }}>
|
<table className="A4TableStyle11" style={{ width: '100%' }}>
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
|
|
@ -178,21 +242,21 @@ const PurPrintStyleA4 = ({ index, ExtraChargeTotal, UpiId, Date1, base64Image, t
|
||||||
<table style={{ width: "99%", margin: "auto" }} className='A4TableA4Style11'>
|
<table style={{ width: "99%", margin: "auto" }} className='A4TableA4Style11'>
|
||||||
<thead>
|
<thead>
|
||||||
<tr style={{ background: '#373B44', color: '#fff', }}>
|
<tr style={{ background: '#373B44', color: '#fff', }}>
|
||||||
{SLNO == true && <th style={{ width: '10%', textAlign: "center" }}>S.No</th>}
|
{SLNO == true && <th style={{ ...tableHeaderStyle, width: '10%', textAlign: "center" }}>S.No</th>}
|
||||||
{Item == true && <th>Item</th>}
|
{Item == true && <th style={{ ...tableHeaderStyle }}>Item</th>}
|
||||||
{HsnCode == true && (
|
{HsnCode == true && (
|
||||||
<th style={{ width: '10%', textAlign: "center" }}>HSN</th>
|
<th style={{ ...tableHeaderStyle, width: '10%', textAlign: "center" }}>HSN</th>
|
||||||
)}
|
)}
|
||||||
{Quantity == true && (
|
{Quantity == true && (
|
||||||
<th style={{ width: '10%', textAlign: "center" }}>Qty</th>
|
<th style={{ ...tableHeaderStyle, width: '10%', textAlign: "center" }}>Qty</th>
|
||||||
)}
|
)}
|
||||||
{MRP == true && <th style={{ width: '10%', textAlign: "center" }}>MRP</th>}
|
{MRP == true && <th style={{ ...tableHeaderStyle, width: '10%', textAlign: "center" }}>MRP</th>}
|
||||||
{Rate == true && <th style={{ width: '10%', textAlign: "center" }}>Rate</th>}
|
{Rate == true && <th style={{ ...tableHeaderStyle, width: '10%', textAlign: "center" }}>Rate</th>}
|
||||||
{Discount == true && (
|
{Discount == true && (
|
||||||
<th style={{ width: '10%', textAlign: "center" }}>Dis </th>
|
<th style={{ ...tableHeaderStyle, width: '10%', textAlign: "center" }}>Dis </th>
|
||||||
)}
|
)}
|
||||||
{Amount == true && (
|
{Amount == true && (
|
||||||
<th style={{ width: '10%', textAlign: "center", textAlign: "right" }}>
|
<th style={{ ...tableHeaderStyle, width: '10%', textAlign: "center", textAlign: "right" }}>
|
||||||
Amt
|
Amt
|
||||||
</th>
|
</th>
|
||||||
)}
|
)}
|
||||||
|
|
@ -201,7 +265,18 @@ const PurPrintStyleA4 = ({ index, ExtraChargeTotal, UpiId, Date1, base64Image, t
|
||||||
|
|
||||||
<tbody>
|
<tbody>
|
||||||
{dataChunk?.map((item, index) => (
|
{dataChunk?.map((item, index) => (
|
||||||
<tr key={index}>
|
<tr key={index}
|
||||||
|
style={
|
||||||
|
index % 2 !== 1 && rowtypeStyle === "even"
|
||||||
|
? {
|
||||||
|
...tableBodyStyle
|
||||||
|
}
|
||||||
|
: index % 2 === 1 && rowtypeStyle === "odd"
|
||||||
|
? {
|
||||||
|
...tableBodyStyle
|
||||||
|
}
|
||||||
|
: {}
|
||||||
|
}>
|
||||||
{SLNO == true && (
|
{SLNO == true && (
|
||||||
<td style={{ textAlign: "center" }}>
|
<td style={{ textAlign: "center" }}>
|
||||||
{chunkIndex * chunkSize + index + 1}
|
{chunkIndex * chunkSize + index + 1}
|
||||||
|
|
@ -304,7 +379,7 @@ const PurPrintStyleA4 = ({ index, ExtraChargeTotal, UpiId, Date1, base64Image, t
|
||||||
{(TotalOfferAmount > 0 || table2Data?.OverallDisc) ? (<div>{Number(TotalOfferAmount + table2Data?.OverallDisc).toFixed(2)}</div>) : ""}
|
{(TotalOfferAmount > 0 || table2Data?.OverallDisc) ? (<div>{Number(TotalOfferAmount + table2Data?.OverallDisc).toFixed(2)}</div>) : ""}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className='total-Amount' style={{ fontSize: "25px", fontWeight: "600", padding: "10px", backgroundColor: "#fdc716", textAlign: "center" }}>Amount :{Number(dataSource?.[0]?.NetAmt).toFixed(2)}</div>
|
<div className='total-Amount' style={{...netAmountStyle, fontSize: "25px", fontWeight: "600", padding: "10px", textAlign: "center" }}>Amount :{Number(dataSource?.[0]?.NetAmt).toFixed(2)}</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<hr className="PrintA4Style11-print-dottline" />
|
<hr className="PrintA4Style11-print-dottline" />
|
||||||
|
|
@ -356,51 +431,32 @@ const PurPrintStyleA4 = ({ index, ExtraChargeTotal, UpiId, Date1, base64Image, t
|
||||||
<div className='PrintA4Style11-print-InfoDivsub' style={{ textTransform: 'capitalize' }}>{Date1}</div>
|
<div className='PrintA4Style11-print-InfoDivsub' style={{ textTransform: 'capitalize' }}>{Date1}</div>
|
||||||
</div>
|
</div>
|
||||||
</>
|
</>
|
||||||
{GlobaldummyData ? GlobalIsnotes &&
|
<div style={{ ...footerColorStyle }}>
|
||||||
(<div>
|
{Notestext && (<div>
|
||||||
<p style={{ padding: "0rem 1rem" }}>Notes : 10 days Return policy</p>
|
|
||||||
|
|
||||||
<hr className="PrintA4Style11-print-dottline" />
|
|
||||||
</div>) :
|
|
||||||
Notestext && (<div>
|
|
||||||
<p style={{ padding: "0rem 1rem", textAlign: "center" }}>{Notestext}</p>
|
<p style={{ padding: "0rem 1rem", textAlign: "center" }}>{Notestext}</p>
|
||||||
|
|
||||||
<hr className="PrintA4Style11-print-dottline" />
|
<hr className="PrintA4Style11-print-dottline" />
|
||||||
</div>)
|
</div>)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
<div style={{ display: "flex", width: "90%", padding: "0 1rem", justifyContent: GlobaltermsAndConditions ? "space-between" : "flex-end", alignItems: "center" }}>
|
<div style={{ display: "flex", width: "90%", padding: "0 1rem", justifyContent: GlobaltermsAndConditions ? "space-between" : "flex-end", alignItems: "center" }}>
|
||||||
{GlobaldummyData ? GlobaltermsAndConditions &&
|
{(TermsnAdCondition == true && TermsAndConditions?.length > 0) && (<div style={{ margin: "8px 0", fontFamily: "sans-serif", width: "100%", display: "flex", flexDirection: "column", alignItems: "flex-start" }}>
|
||||||
(<div style={{ margin: "8px 0", padding: "8px", fontFamily: "sans-serif", width: "100%" }}>
|
|
||||||
<p style={{ fontSize: "13px", fontWeight: "bold", marginBottom: "6px" }}>
|
|
||||||
Terms & Conditions
|
|
||||||
</p>
|
|
||||||
<ol style={{ fontSize: "12px", paddingLeft: "18px", margin: 0, lineHeight: "1" }}>
|
|
||||||
<li>Once goods are sold, they are not exchangeable or refundable.</li>
|
|
||||||
<li>Please check the product before leaving the counter.</li>
|
|
||||||
</ol>
|
|
||||||
</div>)
|
|
||||||
:
|
|
||||||
(TermsnAdCondition == true && TermsAndConditions?.length > 0) && (<div style={{ margin: "8px 0", fontFamily: "sans-serif", width: "100%", display: "flex", flexDirection: "column", alignItems: "flex-start" }}>
|
|
||||||
<p style={{ fontSize: "13px", fontWeight: "bold", marginBottom: "6px" }}>
|
<p style={{ fontSize: "13px", fontWeight: "bold", marginBottom: "6px" }}>
|
||||||
Terms & Conditions
|
Terms & Conditions
|
||||||
</p>
|
</p>
|
||||||
<ol style={{ fontSize: "12px", paddingLeft: "18px", margin: 0, lineHeight: "1" }}>
|
<ol style={{ fontSize: "12px", paddingLeft: "18px", margin: 0, lineHeight: "1" }}>
|
||||||
{TermsAndConditions?.map(item => (<li style={{ textAlign: "start" }}>{item?.TermsandConditions}</li>))}
|
{TermsAndConditions?.map(item => (<li style={{ textAlign: "start" }}>{item?.TermsandConditions}</li>))}
|
||||||
{/* <li>Please check the product before leaving the counter.</li> */}
|
|
||||||
</ol>
|
</ol>
|
||||||
</div>)
|
</div>)
|
||||||
}
|
}
|
||||||
|
|
||||||
{GlobaldummyData ? GlobalSignature && (<div style={{ display: "flex", flexDirection: "column", alignItems: "flex-end", 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>
|
<p style={{ fontSize: "13px", fontWeight: "bold", marginBottom: "6px" }}>Signature</p>
|
||||||
<img style={{ width: "70px", height: "40px" }} src={GlobalSignatureImages ? GlobalSignatureImages : signature} alt="" />
|
<img style={{ width: "100px", height: "60px" }} src={SignatureImg} alt="" />
|
||||||
</div>) : Signature == true && (<div style={{ display: "flex", flexDirection: "column", alignItems: "center", marginTop: "1rem", paddingBottom: "1rem" }}>
|
</div>)}
|
||||||
<p style={{ fontSize: "13px", fontWeight: "bold", marginBottom: "6px" }}>Signature</p>
|
|
||||||
<img style={{ width: "100px", height: "60px" }} src={SignatureImg} alt="" />
|
|
||||||
</div>)}
|
|
||||||
|
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>}
|
</div>}
|
||||||
<hr className="PrintA4Style11-print-dottline" />
|
<hr className="PrintA4Style11-print-dottline" />
|
||||||
|
|
@ -447,7 +503,7 @@ const PurPrintStyleA4 = ({ index, ExtraChargeTotal, UpiId, Date1, base64Image, t
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<div className='total-Amount' style={{ fontSize: "25px", fontWeight: "600", padding: "10px", backgroundColor: "#fdc716", textAlign: "center" }}>Amount :{GlobaldummyData ? "1066" : Number(dataSource?.[0]?.NetAmt).toFixed(2)}</div>
|
<div className='total-Amount' style={{ fontSize: "25px", fontWeight: "600", padding: "10px", ...netAmountStyle, textAlign: "center" }}>Amount :{GlobaldummyData ? "1066" : Number(dataSource?.[0]?.NetAmt).toFixed(2)}</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
@ -545,51 +601,32 @@ const PurPrintStyleA4 = ({ index, ExtraChargeTotal, UpiId, Date1, base64Image, t
|
||||||
<div className='PrintA4Style11-print-InfoDivsub' style={{ textTransform: 'capitalize' }}>{Date1}</div>
|
<div className='PrintA4Style11-print-InfoDivsub' style={{ textTransform: 'capitalize' }}>{Date1}</div>
|
||||||
</div>
|
</div>
|
||||||
</>
|
</>
|
||||||
{GlobaldummyData ? GlobalIsnotes &&
|
<div style={{ ...footerColorStyle }}>
|
||||||
(<div>
|
{Notestext && (<div>
|
||||||
<p style={{ padding: "0rem 1rem" }}>Notes : 10 days Return policy</p>
|
|
||||||
|
|
||||||
<hr className="PrintA4Style11-print-dottline" />
|
|
||||||
</div>) :
|
|
||||||
Notestext && (<div>
|
|
||||||
<p style={{ padding: "0rem 1rem", textAlign: "center" }}>{Notestext}</p>
|
<p style={{ padding: "0rem 1rem", textAlign: "center" }}>{Notestext}</p>
|
||||||
|
|
||||||
<hr className="PrintA4Style11-print-dottline" />
|
<hr className="PrintA4Style11-print-dottline" />
|
||||||
</div>)
|
</div>)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
<div style={{ display: "flex", width: "90%", padding: "0 1rem", justifyContent: GlobaltermsAndConditions ? "space-between" : "flex-end", alignItems: "center" }}>
|
<div style={{ display: "flex", width: "90%", padding: "0 1rem", justifyContent: GlobaltermsAndConditions ? "space-between" : "flex-end", alignItems: "center" }}>
|
||||||
{GlobaldummyData ? GlobaltermsAndConditions &&
|
{(TermsnAdCondition == true && TermsAndConditions?.length > 0) && (<div style={{ margin: "8px 0", fontFamily: "sans-serif", width: "100%", display: "flex", flexDirection: "column", alignItems: "flex-start" }}>
|
||||||
(<div style={{ margin: "8px 0", padding: "8px", fontFamily: "sans-serif", width: "100%" }}>
|
|
||||||
<p style={{ fontSize: "13px", fontWeight: "bold", marginBottom: "6px" }}>
|
|
||||||
Terms & Conditions
|
|
||||||
</p>
|
|
||||||
<ol style={{ fontSize: "12px", paddingLeft: "18px", margin: 0, lineHeight: "1" }}>
|
|
||||||
<li>Once goods are sold, they are not exchangeable or refundable.</li>
|
|
||||||
<li>Please check the product before leaving the counter.</li>
|
|
||||||
</ol>
|
|
||||||
</div>)
|
|
||||||
:
|
|
||||||
(TermsnAdCondition == true && TermsAndConditions?.length > 0) && (<div style={{ margin: "8px 0", fontFamily: "sans-serif", width: "100%", display: "flex", flexDirection: "column", alignItems: "flex-start" }}>
|
|
||||||
<p style={{ fontSize: "13px", fontWeight: "bold", marginBottom: "6px" }}>
|
<p style={{ fontSize: "13px", fontWeight: "bold", marginBottom: "6px" }}>
|
||||||
Terms & Conditions
|
Terms & Conditions
|
||||||
</p>
|
</p>
|
||||||
<ol style={{ fontSize: "12px", paddingLeft: "18px", margin: 0, lineHeight: "1" }}>
|
<ol style={{ fontSize: "12px", paddingLeft: "18px", margin: 0, lineHeight: "1" }}>
|
||||||
{TermsAndConditions?.map(item => (<li style={{ textAlign: "start" }}>{item?.TermsandConditions}</li>))}
|
{TermsAndConditions?.map(item => (<li style={{ textAlign: "start" }}>{item?.TermsandConditions}</li>))}
|
||||||
{/* <li>Please check the product before leaving the counter.</li> */}
|
|
||||||
</ol>
|
</ol>
|
||||||
</div>)
|
</div>)
|
||||||
}
|
}
|
||||||
|
|
||||||
{GlobaldummyData ? GlobalSignature && (<div style={{ display: "flex", flexDirection: "column", alignItems: "flex-end", 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>
|
<p style={{ fontSize: "13px", fontWeight: "bold", marginBottom: "6px" }}>Signature</p>
|
||||||
<img style={{ width: "70px", height: "40px" }} src={GlobalSignatureImages ? GlobalSignatureImages : signature} alt="" />
|
<img style={{ width: "100px", height: "60px" }} src={SignatureImg} alt="" />
|
||||||
</div>) : Signature == true && (<div style={{ display: "flex", flexDirection: "column", alignItems: "center", marginTop: "1rem", paddingBottom: "1rem" }}>
|
</div>)}
|
||||||
<p style={{ fontSize: "13px", fontWeight: "bold", marginBottom: "6px" }}>Signature</p>
|
|
||||||
<img style={{ width: "100px", height: "60px" }} src={SignatureImg} alt="" />
|
|
||||||
</div>)}
|
|
||||||
|
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
@ -633,7 +670,7 @@ const PurPrintStyleA4 = ({ index, ExtraChargeTotal, UpiId, Date1, base64Image, t
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<div className='total-Amount' style={{ fontSize: "25px", fontWeight: "600", padding: "10px", backgroundColor: "#fdc716", textAlign: "center" }}>Amount :{GlobaldummyData ? "1066" : Number(dataSource?.[0]?.NetAmt).toFixed(2)}</div>
|
<div className='total-Amount' style={{...netAmountStyle, fontSize: "25px", fontWeight: "600", padding: "10px",textAlign: "center" }}>Amount :{GlobaldummyData ? "1066" : Number(dataSource?.[0]?.NetAmt).toFixed(2)}</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
@ -731,51 +768,33 @@ const PurPrintStyleA4 = ({ index, ExtraChargeTotal, UpiId, Date1, base64Image, t
|
||||||
<div className='PrintA4Style11-print-InfoDivsub' style={{ textTransform: 'capitalize' }}>{Date1}</div>
|
<div className='PrintA4Style11-print-InfoDivsub' style={{ textTransform: 'capitalize' }}>{Date1}</div>
|
||||||
</div>
|
</div>
|
||||||
</>
|
</>
|
||||||
{GlobaldummyData ? GlobalIsnotes &&
|
|
||||||
(<div>
|
|
||||||
<p style={{ padding: "0rem 1rem" }}>Notes : 10 days Return policy</p>
|
|
||||||
|
|
||||||
<hr className="PrintA4Style11-print-dottline" />
|
<div style={{ ...footerColorStyle }}>
|
||||||
</div>) :
|
{Notestext && (<div>
|
||||||
Notestext && (<div>
|
|
||||||
<p style={{ padding: "0rem 1rem", textAlign: "center" }}>{Notestext}</p>
|
<p style={{ padding: "0rem 1rem", textAlign: "center" }}>{Notestext}</p>
|
||||||
|
|
||||||
<hr className="PrintA4Style11-print-dottline" />
|
<hr className="PrintA4Style11-print-dottline" />
|
||||||
</div>)
|
</div>)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
<div style={{ display: "flex", width: "90%", padding: "0 1rem", justifyContent: GlobaltermsAndConditions ? "space-between" : "flex-end", alignItems: "center" }}>
|
<div style={{ display: "flex", width: "90%", padding: "0 1rem", justifyContent: GlobaltermsAndConditions ? "space-between" : "flex-end", alignItems: "center" }}>
|
||||||
{GlobaldummyData ? GlobaltermsAndConditions &&
|
{(TermsnAdCondition == true && TermsAndConditions?.length > 0) && (<div style={{ margin: "8px 0", fontFamily: "sans-serif", width: "100%", display: "flex", flexDirection: "column", alignItems: "flex-start" }}>
|
||||||
(<div style={{ margin: "8px 0", padding: "8px", fontFamily: "sans-serif", width: "100%" }}>
|
|
||||||
<p style={{ fontSize: "13px", fontWeight: "bold", marginBottom: "6px" }}>
|
|
||||||
Terms & Conditions
|
|
||||||
</p>
|
|
||||||
<ol style={{ fontSize: "12px", paddingLeft: "18px", margin: 0, lineHeight: "1" }}>
|
|
||||||
<li>Once goods are sold, they are not exchangeable or refundable.</li>
|
|
||||||
<li>Please check the product before leaving the counter.</li>
|
|
||||||
</ol>
|
|
||||||
</div>)
|
|
||||||
:
|
|
||||||
(TermsnAdCondition == true && TermsAndConditions?.length > 0) && (<div style={{ margin: "8px 0", fontFamily: "sans-serif", width: "100%", display: "flex", flexDirection: "column", alignItems: "flex-start" }}>
|
|
||||||
<p style={{ fontSize: "13px", fontWeight: "bold", marginBottom: "6px" }}>
|
<p style={{ fontSize: "13px", fontWeight: "bold", marginBottom: "6px" }}>
|
||||||
Terms & Conditions
|
Terms & Conditions
|
||||||
</p>
|
</p>
|
||||||
<ol style={{ fontSize: "12px", paddingLeft: "18px", margin: 0, lineHeight: "1" }}>
|
<ol style={{ fontSize: "12px", paddingLeft: "18px", margin: 0, lineHeight: "1" }}>
|
||||||
{TermsAndConditions?.map(item => (<li style={{ textAlign: "start" }}>{item?.TermsandConditions}</li>))}
|
{TermsAndConditions?.map(item => (<li style={{ textAlign: "start" }}>{item?.TermsandConditions}</li>))}
|
||||||
{/* <li>Please check the product before leaving the counter.</li> */}
|
|
||||||
</ol>
|
</ol>
|
||||||
</div>)
|
</div>)
|
||||||
}
|
}
|
||||||
|
|
||||||
{GlobaldummyData ? GlobalSignature && (<div style={{ display: "flex", flexDirection: "column", alignItems: "flex-end", 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>
|
<p style={{ fontSize: "13px", fontWeight: "bold", marginBottom: "6px" }}>Signature</p>
|
||||||
<img style={{ width: "70px", height: "40px" }} src={GlobalSignatureImages ? GlobalSignatureImages : signature} alt="" />
|
<img style={{ width: "100px", height: "60px" }} src={SignatureImg} alt="" />
|
||||||
</div>) : Signature == true && (<div style={{ display: "flex", flexDirection: "column", alignItems: "center", marginTop: "1rem", paddingBottom: "1rem" }}>
|
</div>)}
|
||||||
<p style={{ fontSize: "13px", fontWeight: "bold", marginBottom: "6px" }}>Signature</p>
|
|
||||||
<img style={{ width: "100px", height: "60px" }} src={SignatureImg} alt="" />
|
|
||||||
</div>)}
|
|
||||||
|
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -10,7 +10,21 @@ import { printDiv } from "../../../Services/Others";
|
||||||
// import HpyImg from "../../../Images/happyemoji.png"
|
// import HpyImg from "../../../Images/happyemoji.png"
|
||||||
import '../../../Styles/BookingScreen/PrintTemplates/A4/PrintA4Style11.scss'
|
import '../../../Styles/BookingScreen/PrintTemplates/A4/PrintA4Style11.scss'
|
||||||
import { useSelector } from 'react-redux';
|
import { useSelector } from 'react-redux';
|
||||||
import { GloabalFieldDetails, GlobalBillName, Globalnotes, GlobalprintAmount, GlobalprintDiscount, GlobalprintHsnCode, GlobalprintItem, GlobalprintMRP, GlobalprintQrcodet, GlobalprintQuantity, GlobalprintRate, GlobalprintSignature, GlobalprintSlNo, GlobalprinttermsAndConditions, GlobalPritdummyData, GlobalSignatureImage, GlobalthemeFormat } from '../../../Features/ThemeChange/ThemeChange';
|
import {
|
||||||
|
Globalnotes, GlobalprintRate, GlobalprintSignature, GlobalprinttermsAndConditions, GlobalSignatureImage, GlobalthemeFormat,
|
||||||
|
GlobalSelectedPrintHeaderColor,
|
||||||
|
GlobalSelectedPrintHeaderFontColor,
|
||||||
|
GlobalSelectedTableHeaderColor,
|
||||||
|
GlobalSelectedTableHeaderFontColor,
|
||||||
|
GlobalSelectedTableBodyColor,
|
||||||
|
GlobalSelectedTableBodyFontColor,
|
||||||
|
GlobalRowType,
|
||||||
|
GlobalSelectedFooterColor,
|
||||||
|
GlobalSelectedFooterFontColor,
|
||||||
|
GlobalSelectedNetAmountColor,
|
||||||
|
GlobalSelectedNetAmountFontColor,
|
||||||
|
GlobalPritdummyData,
|
||||||
|
} from '../../../Features/ThemeChange/ThemeChange';
|
||||||
import signature from "../../../Images/signatureimage.jpg"
|
import signature from "../../../Images/signatureimage.jpg"
|
||||||
import QRCode from 'react-qr-code';
|
import QRCode from 'react-qr-code';
|
||||||
import { isMobile } from 'react-device-detect';
|
import { isMobile } from 'react-device-detect';
|
||||||
|
|
@ -21,13 +35,24 @@ const PurPrintStyleA5 = ({ index, ExtraChargeTotal, UpiId, Date1, base64Image, t
|
||||||
const GlobalSignature = useSelector(GlobalprintSignature);
|
const GlobalSignature = useSelector(GlobalprintSignature);
|
||||||
const GlobaltermsAndConditions = useSelector(GlobalprinttermsAndConditions);
|
const GlobaltermsAndConditions = useSelector(GlobalprinttermsAndConditions);
|
||||||
// const FieldDetails = useSelector(GloabalFieldDetails);
|
// const FieldDetails = useSelector(GloabalFieldDetails);
|
||||||
const FieldDetails = printDatas?.FieldDetails?.reduce((acc, item) => {
|
const FieldDetails = printDatas?.FieldDetails?.reduce((acc, item) => {
|
||||||
acc[item.ConfigName] = true;
|
acc[item.ConfigName] = true;
|
||||||
return acc;
|
return acc;
|
||||||
}, {});
|
}, {});
|
||||||
const GlobalIsnotes = useSelector(Globalnotes);
|
const GlobalIsnotes = useSelector(Globalnotes);
|
||||||
const GlobalSignatureImages = useSelector(GlobalSignatureImage);
|
const GlobalSignatureImages = useSelector(GlobalSignatureImage);
|
||||||
console.log(FieldDetails, "FieldDetails")
|
const GlobaldummyData = useSelector(GlobalPritdummyData);
|
||||||
|
const SelectedHeaderColor = useSelector(GlobalSelectedPrintHeaderColor);
|
||||||
|
const SelectedHeaderFontColor = useSelector(GlobalSelectedPrintHeaderFontColor);
|
||||||
|
const SelectedTableHeaderColor = useSelector(GlobalSelectedTableHeaderColor);
|
||||||
|
const SelectedTableHeaderFontColor = useSelector(GlobalSelectedTableHeaderFontColor);
|
||||||
|
const SelectedTableBodyColor = useSelector(GlobalSelectedTableBodyColor);
|
||||||
|
const SelectedTableBodyFontColor = useSelector(GlobalSelectedTableBodyFontColor);
|
||||||
|
const SelectedRowType = useSelector(GlobalRowType);
|
||||||
|
const SelectedTableFooterColor = useSelector(GlobalSelectedFooterColor);
|
||||||
|
const SelectedTableFooterFontColor = useSelector(GlobalSelectedFooterFontColor);
|
||||||
|
const SelectedNetAmountColor = useSelector(GlobalSelectedNetAmountColor);
|
||||||
|
const SelectedNetAmountFontColor = useSelector(GlobalSelectedNetAmountFontColor);
|
||||||
const SLNO = FieldDetails?.["Sl.No"];
|
const SLNO = FieldDetails?.["Sl.No"];
|
||||||
const Item = FieldDetails?.["Item"];
|
const Item = FieldDetails?.["Item"];
|
||||||
const MRP = FieldDetails?.["MRP"];
|
const MRP = FieldDetails?.["MRP"];
|
||||||
|
|
@ -40,6 +65,12 @@ const PurPrintStyleA5 = ({ index, ExtraChargeTotal, UpiId, Date1, base64Image, t
|
||||||
const Signature = FieldDetails?.["signature"];
|
const Signature = FieldDetails?.["signature"];
|
||||||
const TermsnAdCondition = FieldDetails?.["terms&conditions"];
|
const TermsnAdCondition = FieldDetails?.["terms&conditions"];
|
||||||
const isNotes = FieldDetails?.["Notes"];
|
const isNotes = FieldDetails?.["Notes"];
|
||||||
|
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 currentDate = new Date();
|
const currentDate = new Date();
|
||||||
console.log(FieldDetails, "FieldDetails")
|
console.log(FieldDetails, "FieldDetails")
|
||||||
|
|
@ -88,7 +119,51 @@ const PurPrintStyleA5 = ({ index, ExtraChargeTotal, UpiId, Date1, base64Image, t
|
||||||
}
|
}
|
||||||
const lastChunkRows = paginatedChunks.length > 0 ? paginatedChunks[paginatedChunks.length - 1].length : 0;
|
const lastChunkRows = paginatedChunks.length > 0 ? paginatedChunks[paginatedChunks.length - 1].length : 0;
|
||||||
const shouldFooterBeOnNewPage = lastChunkRows > 6;
|
const shouldFooterBeOnNewPage = lastChunkRows > 6;
|
||||||
|
const headerStyle = {
|
||||||
|
backgroundColor: GlobaldummyData
|
||||||
|
? SelectedHeaderColor
|
||||||
|
: headerColor?.background,
|
||||||
|
|
||||||
|
color: GlobaldummyData
|
||||||
|
? SelectedHeaderFontColor
|
||||||
|
: headerColor?.font,
|
||||||
|
}
|
||||||
|
const tableHeaderStyle = {
|
||||||
|
backgroundColor: GlobaldummyData
|
||||||
|
? SelectedTableHeaderColor
|
||||||
|
: tableHeaderColor?.background,
|
||||||
|
|
||||||
|
color: GlobaldummyData
|
||||||
|
? SelectedTableHeaderFontColor
|
||||||
|
: tableHeaderColor?.font,
|
||||||
|
}
|
||||||
|
const tableBodyStyle = {
|
||||||
|
backgroundColor: GlobaldummyData
|
||||||
|
? SelectedTableBodyColor
|
||||||
|
: tableBodyColor?.background,
|
||||||
|
color: GlobaldummyData
|
||||||
|
? SelectedTableBodyFontColor
|
||||||
|
: tableBodyColor?.font,
|
||||||
|
}
|
||||||
|
const rowtypeStyle = GlobaldummyData ? SelectedRowType : tableBodyColor?.rowType;
|
||||||
|
const footerColorStyle = {
|
||||||
|
backgroundColor: GlobaldummyData
|
||||||
|
? SelectedTableFooterColor
|
||||||
|
: footerColor?.background,
|
||||||
|
|
||||||
|
color: GlobaldummyData
|
||||||
|
? SelectedTableFooterFontColor
|
||||||
|
: footerColor?.font,
|
||||||
|
}
|
||||||
|
const netAmountStyle = {
|
||||||
|
backgroundColor: GlobaldummyData
|
||||||
|
? SelectedNetAmountColor
|
||||||
|
: netAmtColor?.background,
|
||||||
|
|
||||||
|
color: GlobaldummyData
|
||||||
|
? SelectedNetAmountFontColor
|
||||||
|
: netAmtColor?.font,
|
||||||
|
}
|
||||||
return (
|
return (
|
||||||
|
|
||||||
<div style={{
|
<div style={{
|
||||||
|
|
@ -100,10 +175,10 @@ const PurPrintStyleA5 = ({ index, ExtraChargeTotal, UpiId, Date1, base64Image, t
|
||||||
|
|
||||||
<div className="PrintA4Style11-MasterDiv" style={{ position: "relative", width: "100%", minHeight: isMobile ? '297mm' : "257mm" }} id={`SQPrintStyleA5`}>
|
<div className="PrintA4Style11-MasterDiv" style={{ position: "relative", width: "100%", minHeight: isMobile ? '297mm' : "257mm" }} id={`SQPrintStyleA5`}>
|
||||||
{paginatedChunks.map((dataChunk, chunkIndex) => (
|
{paginatedChunks.map((dataChunk, chunkIndex) => (
|
||||||
<div style={{ display: "flex", flexDirection: "column", justifyContent: "space-between", height:isMobile ? (FormatTheme ? "297mm" : "") : '257mm' }} className="print-page" key={chunkIndex}>
|
<div style={{ display: "flex", flexDirection: "column", justifyContent: "space-between", height: isMobile ? (FormatTheme ? "297mm" : "") : '257mm' }} className="print-page" key={chunkIndex}>
|
||||||
<div className="page-headerA4Style11" style={{ textAlign: "center" }}>
|
<div className="page-headerA4Style11" style={{ textAlign: "center" }}>
|
||||||
|
|
||||||
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', textAlign: 'left' }}>
|
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', textAlign: 'left', ...headerStyle }}>
|
||||||
|
|
||||||
<div style={{
|
<div style={{
|
||||||
display: 'flex',
|
display: 'flex',
|
||||||
|
|
@ -113,20 +188,20 @@ const PurPrintStyleA5 = ({ index, ExtraChargeTotal, UpiId, Date1, base64Image, t
|
||||||
borderBottom: '1px solid black'
|
borderBottom: '1px solid black'
|
||||||
}}>
|
}}>
|
||||||
{/* Logo Image */}
|
{/* Logo Image */}
|
||||||
{/* {base64Image && (
|
{base64Image && (
|
||||||
<div style={{ marginRight: '20px' }}>
|
<div style={{ marginRight: '20px' }}>
|
||||||
<img
|
<img
|
||||||
className='PrintA4Style11-BrandImage'
|
className='PrintA4Style11-BrandImage'
|
||||||
src={base64Image}
|
src={base64Image}
|
||||||
alt='Brand Logo'
|
alt='Brand Logo'
|
||||||
style={{
|
style={{
|
||||||
width: '100px',
|
width: '100px',
|
||||||
height: 'auto',
|
height: 'auto',
|
||||||
objectFit: 'contain'
|
objectFit: 'contain'
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
)} */}
|
)}
|
||||||
|
|
||||||
{/* Store Info */}
|
{/* Store Info */}
|
||||||
<div style={{
|
<div style={{
|
||||||
|
|
@ -139,7 +214,7 @@ const PurPrintStyleA5 = ({ index, ExtraChargeTotal, UpiId, Date1, base64Image, t
|
||||||
fontSize: 'clamp(1.5rem, 2.5vw, 2rem)',
|
fontSize: 'clamp(1.5rem, 2.5vw, 2rem)',
|
||||||
marginBottom: '4px'
|
marginBottom: '4px'
|
||||||
}}>
|
}}>
|
||||||
{table2Data?.[0]?.BranchName}
|
{table2Data?.[0]?.BranchName}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Address */}
|
{/* Address */}
|
||||||
|
|
@ -157,7 +232,7 @@ const PurPrintStyleA5 = ({ index, ExtraChargeTotal, UpiId, Date1, base64Image, t
|
||||||
return <div key={index}>{parts}</div>;
|
return <div key={index}>{parts}</div>;
|
||||||
})}
|
})}
|
||||||
<br />
|
<br />
|
||||||
Mobile: +91 {table2Data?.customerMobile}
|
Mobile: +91 {table2Data?.customerMobile}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Order Type */}
|
{/* Order Type */}
|
||||||
|
|
@ -167,19 +242,6 @@ const PurPrintStyleA5 = ({ index, ExtraChargeTotal, UpiId, Date1, base64Image, t
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
{/* <div >
|
|
||||||
<div style={{ marginTop: '4px', fontSize: '13px', fontWeight: 600 }}>
|
|
||||||
{table2Data?.OrderType === "E"
|
|
||||||
? "Estimate"
|
|
||||||
: (GlobaldummyData
|
|
||||||
? "Cash"
|
|
||||||
: PaymentStatusSuccess?.length === 1
|
|
||||||
? PaymentStatusSuccess?.[0]?.PaymentTypeName
|
|
||||||
: "") + table2Data?.OrderId && "Cash: " + extractLastNumberOrderId(table2Data?.OrderId, table2Data?.FYStatus)} {GlobaldummyData && "685"}
|
|
||||||
</div>
|
|
||||||
</div> */}
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -211,7 +273,7 @@ const PurPrintStyleA5 = ({ index, ExtraChargeTotal, UpiId, Date1, base64Image, t
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<table className="A4TableStyle11" style={{ width: '100%',marginTop:"2rem" }}>
|
<table className="A4TableStyle11" style={{ width: '100%', marginTop: "2rem" }}>
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
<td>
|
<td>
|
||||||
|
|
@ -229,21 +291,21 @@ const PurPrintStyleA5 = ({ index, ExtraChargeTotal, UpiId, Date1, base64Image, t
|
||||||
<table style={{ width: "99%", margin: "auto" }} className='A4TableA4Style11'>
|
<table style={{ width: "99%", margin: "auto" }} className='A4TableA4Style11'>
|
||||||
<thead>
|
<thead>
|
||||||
<tr style={{ background: '#373B44', color: '#fff', }}>
|
<tr style={{ background: '#373B44', color: '#fff', }}>
|
||||||
{SLNO == true && <th style={{ width: '10%', textAlign: "center" }}>S.No</th>}
|
{SLNO == true && <th style={{ ...tableHeaderStyle, width: '10%', textAlign: "center" }}>S.No</th>}
|
||||||
{Item == true && <th>Item</th>}
|
{Item == true && <th style={{ ...tableHeaderStyle }}>Item</th>}
|
||||||
{HsnCode == true && (
|
{HsnCode == true && (
|
||||||
<th style={{ width: '10%', textAlign: "center" }}>HSN</th>
|
<th style={{ ...tableHeaderStyle, width: '10%', textAlign: "center" }}>HSN</th>
|
||||||
)}
|
)}
|
||||||
{Quantity == true && (
|
{Quantity == true && (
|
||||||
<th style={{ width: '10%', textAlign: "center" }}>Qty</th>
|
<th style={{ ...tableHeaderStyle, width: '10%', textAlign: "center" }}>Qty</th>
|
||||||
)}
|
)}
|
||||||
{MRP == true && <th style={{ width: '10%', textAlign: "center" }}>MRP</th>}
|
{MRP == true && <th style={{ ...tableHeaderStyle, width: '10%', textAlign: "center" }}>MRP</th>}
|
||||||
{Rate == true && <th style={{ width: '10%', textAlign: "center" }}>Rate</th>}
|
{Rate == true && <th style={{ ...tableHeaderStyle, width: '10%', textAlign: "center" }}>Rate</th>}
|
||||||
{Discount == true && (
|
{Discount == true && (
|
||||||
<th style={{ width: '10%', textAlign: "center" }}>Dis </th>
|
<th style={{ ...tableHeaderStyle, width: '10%', textAlign: "center" }}>Dis </th>
|
||||||
)}
|
)}
|
||||||
{Amount == true && (
|
{Amount == true && (
|
||||||
<th style={{ width: '10%', textAlign: "center", textAlign: "right" }}>
|
<th style={{ ...tableHeaderStyle, width: '10%', textAlign: "center", textAlign: "right" }}>
|
||||||
Amt
|
Amt
|
||||||
</th>
|
</th>
|
||||||
)}
|
)}
|
||||||
|
|
@ -252,7 +314,18 @@ const PurPrintStyleA5 = ({ index, ExtraChargeTotal, UpiId, Date1, base64Image, t
|
||||||
|
|
||||||
<tbody>
|
<tbody>
|
||||||
{dataChunk?.map((item, index) => (
|
{dataChunk?.map((item, index) => (
|
||||||
<tr key={index}>
|
<tr key={index}
|
||||||
|
style={
|
||||||
|
index % 2 !== 1 && rowtypeStyle === "even"
|
||||||
|
? {
|
||||||
|
...tableBodyStyle
|
||||||
|
}
|
||||||
|
: index % 2 === 1 && rowtypeStyle === "odd"
|
||||||
|
? {
|
||||||
|
...tableBodyStyle
|
||||||
|
}
|
||||||
|
: {}
|
||||||
|
}>
|
||||||
{SLNO == true && (
|
{SLNO == true && (
|
||||||
<td style={{ textAlign: "center" }}>
|
<td style={{ textAlign: "center" }}>
|
||||||
{chunkIndex * chunkSize + index + 1}
|
{chunkIndex * chunkSize + index + 1}
|
||||||
|
|
@ -357,7 +430,7 @@ const PurPrintStyleA5 = ({ index, ExtraChargeTotal, UpiId, Date1, base64Image, t
|
||||||
{/* <div className='total-Amount' style={{ fontSize: "15px", fontWeight: "600" }}>{GlobaldummyData ? "1066" : Number(table2Data?.NetAmount).toFixed(2)}</div> */}
|
{/* <div className='total-Amount' style={{ fontSize: "15px", fontWeight: "600" }}>{GlobaldummyData ? "1066" : Number(table2Data?.NetAmount).toFixed(2)}</div> */}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className='total-Amount' style={{ fontSize: "25px", fontWeight: "600", padding: "10px", backgroundColor: "#fdc716", textAlign: "center" }}>Amount :{Number(dataSource?.[0]?.NetAmt).toFixed(2)}</div>
|
<div className='total-Amount' style={{ ...netAmountStyle,fontSize: "25px", fontWeight: "600", padding: "10px", textAlign: "center" }}>Amount :{Number(dataSource?.[0]?.NetAmt).toFixed(2)}</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
@ -428,33 +501,36 @@ const PurPrintStyleA5 = ({ index, ExtraChargeTotal, UpiId, Date1, base64Image, t
|
||||||
<div className='PrintA4Style11-print-InfoDivsub' style={{ textTransform: 'capitalize' }}>{Date1}</div>
|
<div className='PrintA4Style11-print-InfoDivsub' style={{ textTransform: 'capitalize' }}>{Date1}</div>
|
||||||
</div>
|
</div>
|
||||||
</>
|
</>
|
||||||
{Notestext && (
|
<div style={{ ...footerColorStyle }}>
|
||||||
<div>
|
{Notestext && (
|
||||||
<p style={{ padding: "0rem 1rem", textAlign: "center" }}>{Notestext}</p>
|
<div>
|
||||||
<hr className="PrintA4Style11-print-dottline" />
|
<p style={{ padding: "0rem 1rem", textAlign: "center" }}>{Notestext}</p>
|
||||||
|
<hr className="PrintA4Style11-print-dottline" />
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
|
|
||||||
|
<div style={{ display: "flex", width: "90%", padding: "0 1rem", justifyContent: GlobaltermsAndConditions ? "space-between" : "flex-end", alignItems: "center" }}>
|
||||||
|
{(TermsnAdCondition == true && TermsAndConditions?.length > 0) && (
|
||||||
|
<div style={{ margin: "8px 0", fontFamily: "sans-serif", width: "100%", display: "flex", flexDirection: "column", alignItems: "flex-start" }}>
|
||||||
|
<p style={{ fontSize: "13px", fontWeight: "bold", marginBottom: "6px" }}>
|
||||||
|
Terms & Conditions
|
||||||
|
</p>
|
||||||
|
<ol style={{ fontSize: "12px", paddingLeft: "18px", margin: 0, lineHeight: "1" }}>
|
||||||
|
{TermsAndConditions?.map(item => (<li style={{ textAlign: "start" }}>{item?.TermsandConditions}</li>))}
|
||||||
|
</ol>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
{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>
|
||||||
|
)}
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
)}
|
|
||||||
|
|
||||||
|
|
||||||
<div style={{ display: "flex", width: "90%", padding: "0 1rem", justifyContent: GlobaltermsAndConditions ? "space-between" : "flex-end", alignItems: "center" }}>
|
|
||||||
{(TermsnAdCondition == true && TermsAndConditions?.length > 0) && (
|
|
||||||
<div style={{ margin: "8px 0", fontFamily: "sans-serif", width: "100%", display: "flex", flexDirection: "column", alignItems: "flex-start" }}>
|
|
||||||
<p style={{ fontSize: "13px", fontWeight: "bold", marginBottom: "6px" }}>
|
|
||||||
Terms & Conditions
|
|
||||||
</p>
|
|
||||||
<ol style={{ fontSize: "12px", paddingLeft: "18px", margin: 0, lineHeight: "1" }}>
|
|
||||||
{TermsAndConditions?.map(item => (<li style={{ textAlign: "start" }}>{item?.TermsandConditions}</li>))}
|
|
||||||
</ol>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
{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>
|
|
||||||
)}
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>}
|
</div>}
|
||||||
|
|
||||||
<hr className="PrintA4Style11-print-dottline" />
|
<hr className="PrintA4Style11-print-dottline" />
|
||||||
|
|
@ -509,7 +585,7 @@ const PurPrintStyleA5 = ({ index, ExtraChargeTotal, UpiId, Date1, base64Image, t
|
||||||
{/* <div className='total-Amount' style={{ fontSize: "15px", fontWeight: "600" }}>{GlobaldummyData ? "1066" : Number(table2Data?.NetAmount).toFixed(2)}</div> */}
|
{/* <div className='total-Amount' style={{ fontSize: "15px", fontWeight: "600" }}>{GlobaldummyData ? "1066" : Number(table2Data?.NetAmount).toFixed(2)}</div> */}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className='total-Amount' style={{ fontSize: "25px", fontWeight: "600", padding: "10px", backgroundColor: "#fdc716", textAlign: "center" }}>Amount :{Number(dataSource?.[0]?.NetAmt).toFixed(2)}</div>
|
<div className='total-Amount' style={{ ...netAmountStyle,fontSize: "25px", fontWeight: "600", padding: "10px", textAlign: "center" }}>Amount :{Number(dataSource?.[0]?.NetAmt).toFixed(2)}</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
@ -580,32 +656,34 @@ const PurPrintStyleA5 = ({ index, ExtraChargeTotal, UpiId, Date1, base64Image, t
|
||||||
<div className='PrintA4Style11-print-InfoDivsub' style={{ textTransform: 'capitalize' }}>{Date1}</div>
|
<div className='PrintA4Style11-print-InfoDivsub' style={{ textTransform: 'capitalize' }}>{Date1}</div>
|
||||||
</div>
|
</div>
|
||||||
</>
|
</>
|
||||||
{Notestext && (
|
<div style={{ ...footerColorStyle }}>
|
||||||
<div>
|
{Notestext && (
|
||||||
<p style={{ padding: "0rem 1rem", textAlign: "center" }}>{Notestext}</p>
|
<div>
|
||||||
<hr className="PrintA4Style11-print-dottline" />
|
<p style={{ padding: "0rem 1rem", textAlign: "center" }}>{Notestext}</p>
|
||||||
|
<hr className="PrintA4Style11-print-dottline" />
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
|
|
||||||
|
<div style={{ display: "flex", width: "90%", padding: "0 1rem", justifyContent: GlobaltermsAndConditions ? "space-between" : "flex-end", alignItems: "center" }}>
|
||||||
|
{(TermsnAdCondition == true && TermsAndConditions?.length > 0) && (
|
||||||
|
<div style={{ margin: "8px 0", fontFamily: "sans-serif", width: "100%", display: "flex", flexDirection: "column", alignItems: "flex-start" }}>
|
||||||
|
<p style={{ fontSize: "13px", fontWeight: "bold", marginBottom: "6px" }}>
|
||||||
|
Terms & Conditions
|
||||||
|
</p>
|
||||||
|
<ol style={{ fontSize: "12px", paddingLeft: "18px", margin: 0, lineHeight: "1" }}>
|
||||||
|
{TermsAndConditions?.map(item => (<li style={{ textAlign: "start" }}>{item?.TermsandConditions}</li>))}
|
||||||
|
</ol>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
{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>
|
||||||
|
)}
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
)}
|
|
||||||
|
|
||||||
|
|
||||||
<div style={{ display: "flex", width: "90%", padding: "0 1rem", justifyContent: GlobaltermsAndConditions ? "space-between" : "flex-end", alignItems: "center" }}>
|
|
||||||
{(TermsnAdCondition == true && TermsAndConditions?.length > 0) && (
|
|
||||||
<div style={{ margin: "8px 0", fontFamily: "sans-serif", width: "100%", display: "flex", flexDirection: "column", alignItems: "flex-start" }}>
|
|
||||||
<p style={{ fontSize: "13px", fontWeight: "bold", marginBottom: "6px" }}>
|
|
||||||
Terms & Conditions
|
|
||||||
</p>
|
|
||||||
<ol style={{ fontSize: "12px", paddingLeft: "18px", margin: 0, lineHeight: "1" }}>
|
|
||||||
{TermsAndConditions?.map(item => (<li style={{ textAlign: "start" }}>{item?.TermsandConditions}</li>))}
|
|
||||||
</ol>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
{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>
|
|
||||||
)}
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
@ -648,7 +726,7 @@ const PurPrintStyleA5 = ({ index, ExtraChargeTotal, UpiId, Date1, base64Image, t
|
||||||
{/* <div className='total-Amount' style={{ fontSize: "15px", fontWeight: "600" }}>{GlobaldummyData ? "1066" : Number(table2Data?.NetAmount).toFixed(2)}</div> */}
|
{/* <div className='total-Amount' style={{ fontSize: "15px", fontWeight: "600" }}>{GlobaldummyData ? "1066" : Number(table2Data?.NetAmount).toFixed(2)}</div> */}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className='total-Amount' style={{ fontSize: "25px", fontWeight: "600", padding: "10px", backgroundColor: "#fdc716", textAlign: "center" }}>Amount :{Number(table2Data?.NetAmount).toFixed(2)}</div>
|
<div className='total-Amount' style={{...netAmountStyle, fontSize: "25px", fontWeight: "600", padding: "10px", textAlign: "center" }}>Amount :{Number(table2Data?.NetAmount).toFixed(2)}</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
@ -719,33 +797,36 @@ const PurPrintStyleA5 = ({ index, ExtraChargeTotal, UpiId, Date1, base64Image, t
|
||||||
<div className='PrintA4Style11-print-InfoDivsub' style={{ textTransform: 'capitalize' }}>{Date1}</div>
|
<div className='PrintA4Style11-print-InfoDivsub' style={{ textTransform: 'capitalize' }}>{Date1}</div>
|
||||||
</div>
|
</div>
|
||||||
</>
|
</>
|
||||||
{Notestext && (
|
<div style={{ ...footerColorStyle }}>
|
||||||
<div>
|
{Notestext && (
|
||||||
<p style={{ padding: "0rem 1rem", textAlign: "center" }}>{Notestext}</p>
|
<div>
|
||||||
<hr className="PrintA4Style11-print-dottline" />
|
<p style={{ padding: "0rem 1rem", textAlign: "center" }}>{Notestext}</p>
|
||||||
|
<hr className="PrintA4Style11-print-dottline" />
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
|
|
||||||
|
<div style={{ display: "flex", width: "90%", padding: "0 1rem", justifyContent: GlobaltermsAndConditions ? "space-between" : "flex-end", alignItems: "center" }}>
|
||||||
|
{(TermsnAdCondition == true && TermsAndConditions?.length > 0) && (
|
||||||
|
<div style={{ margin: "8px 0", fontFamily: "sans-serif", width: "100%", display: "flex", flexDirection: "column", alignItems: "flex-start" }}>
|
||||||
|
<p style={{ fontSize: "13px", fontWeight: "bold", marginBottom: "6px" }}>
|
||||||
|
Terms & Conditions
|
||||||
|
</p>
|
||||||
|
<ol style={{ fontSize: "12px", paddingLeft: "18px", margin: 0, lineHeight: "1" }}>
|
||||||
|
{TermsAndConditions?.map(item => (<li style={{ textAlign: "start" }}>{item?.TermsandConditions}</li>))}
|
||||||
|
</ol>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
{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>
|
||||||
|
)}
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
)}
|
|
||||||
|
|
||||||
|
|
||||||
<div style={{ display: "flex", width: "90%", padding: "0 1rem", justifyContent: GlobaltermsAndConditions ? "space-between" : "flex-end", alignItems: "center" }}>
|
|
||||||
{(TermsnAdCondition == true && TermsAndConditions?.length > 0) && (
|
|
||||||
<div style={{ margin: "8px 0", fontFamily: "sans-serif", width: "100%", display: "flex", flexDirection: "column", alignItems: "flex-start" }}>
|
|
||||||
<p style={{ fontSize: "13px", fontWeight: "bold", marginBottom: "6px" }}>
|
|
||||||
Terms & Conditions
|
|
||||||
</p>
|
|
||||||
<ol style={{ fontSize: "12px", paddingLeft: "18px", margin: 0, lineHeight: "1" }}>
|
|
||||||
{TermsAndConditions?.map(item => (<li style={{ textAlign: "start" }}>{item?.TermsandConditions}</li>))}
|
|
||||||
</ol>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
{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>
|
|
||||||
)}
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
|
||||||
|
|
@ -8,6 +8,17 @@ import {
|
||||||
Globalnotes,
|
Globalnotes,
|
||||||
GlobalthemeFormat,
|
GlobalthemeFormat,
|
||||||
GlobalBillName,
|
GlobalBillName,
|
||||||
|
GlobalSelectedPrintHeaderColor,
|
||||||
|
GlobalSelectedPrintHeaderFontColor,
|
||||||
|
GlobalSelectedTableHeaderColor,
|
||||||
|
GlobalSelectedTableHeaderFontColor,
|
||||||
|
GlobalSelectedTableBodyColor,
|
||||||
|
GlobalSelectedTableBodyFontColor,
|
||||||
|
GlobalRowType,
|
||||||
|
GlobalSelectedFooterColor,
|
||||||
|
GlobalSelectedFooterFontColor,
|
||||||
|
GlobalSelectedNetAmountColor,
|
||||||
|
GlobalSelectedNetAmountFontColor,
|
||||||
} from "../../../Features/ThemeChange/ThemeChange";
|
} from "../../../Features/ThemeChange/ThemeChange";
|
||||||
import "../../../Styles/BookingScreen/PrintTemplates/ThermalPrinter/PrintStyle1.scss";
|
import "../../../Styles/BookingScreen/PrintTemplates/ThermalPrinter/PrintStyle1.scss";
|
||||||
import { ApplicationPreferences } from "../../../Features/BrachLogin/BranchLogin";
|
import { ApplicationPreferences } from "../../../Features/BrachLogin/BranchLogin";
|
||||||
|
|
@ -36,7 +47,6 @@ const PurPrintStyle1 = ({
|
||||||
// console.log(FieldDetailss, "FieldDetails")
|
// console.log(FieldDetailss, "FieldDetails")
|
||||||
const SLNO = FieldDetails?.["Sl.No"];
|
const SLNO = FieldDetails?.["Sl.No"];
|
||||||
const Item = FieldDetails?.["Item"];
|
const Item = FieldDetails?.["Item"];
|
||||||
console.log(Item, "Item")
|
|
||||||
const MRP = FieldDetails?.["MRP"];
|
const MRP = FieldDetails?.["MRP"];
|
||||||
const Discount = FieldDetails?.["Discount"];
|
const Discount = FieldDetails?.["Discount"];
|
||||||
const Quantity = FieldDetails?.["Quantity"];
|
const Quantity = FieldDetails?.["Quantity"];
|
||||||
|
|
@ -44,8 +54,17 @@ const PurPrintStyle1 = ({
|
||||||
const Amount = FieldDetails?.["Amount"];
|
const Amount = FieldDetails?.["Amount"];
|
||||||
const HsnCode = FieldDetails?.["HsnCode"];
|
const HsnCode = FieldDetails?.["HsnCode"];
|
||||||
|
|
||||||
|
const SelectedHeaderColor = useSelector(GlobalSelectedPrintHeaderColor);
|
||||||
|
const SelectedHeaderFontColor = useSelector(GlobalSelectedPrintHeaderFontColor);
|
||||||
|
const SelectedTableHeaderColor = useSelector(GlobalSelectedTableHeaderColor);
|
||||||
|
const SelectedTableHeaderFontColor = useSelector(GlobalSelectedTableHeaderFontColor);
|
||||||
|
const SelectedTableBodyColor = useSelector(GlobalSelectedTableBodyColor);
|
||||||
|
const SelectedTableBodyFontColor = useSelector(GlobalSelectedTableBodyFontColor);
|
||||||
|
const SelectedRowType = useSelector(GlobalRowType);
|
||||||
|
const SelectedTableFooterColor = useSelector(GlobalSelectedFooterColor);
|
||||||
|
const SelectedTableFooterFontColor = useSelector(GlobalSelectedFooterFontColor);
|
||||||
|
const SelectedNetAmountColor = useSelector(GlobalSelectedNetAmountColor);
|
||||||
|
const SelectedNetAmountFontColor = useSelector(GlobalSelectedNetAmountFontColor);
|
||||||
const GlobaldummyData = useSelector(GlobalPritdummyData);
|
const GlobaldummyData = useSelector(GlobalPritdummyData);
|
||||||
const GlobaltermsAndConditions = useSelector(GlobalprinttermsAndConditions);
|
const GlobaltermsAndConditions = useSelector(GlobalprinttermsAndConditions);
|
||||||
const GlobalIsnotes = useSelector(Globalnotes);
|
const GlobalIsnotes = useSelector(Globalnotes);
|
||||||
|
|
@ -65,9 +84,14 @@ const PurPrintStyle1 = ({
|
||||||
let PageSize = printDatas?.PageSize
|
let PageSize = printDatas?.PageSize
|
||||||
const Signature = FieldDetails?.["signature"];
|
const Signature = FieldDetails?.["signature"];
|
||||||
const TermsnAdCondition = FieldDetails?.["terms&conditions"];
|
const TermsnAdCondition = FieldDetails?.["terms&conditions"];
|
||||||
|
let printColors = printDatas?.PrintColors;
|
||||||
|
const headerColor = printColors?.find(obj => obj.headerColor)?.headerColor;
|
||||||
|
const tableHeaderColor = printColors?.find(obj => obj.tableHeaderColor)?.tableHeaderColor;
|
||||||
|
const tableBodyColor = printColors?.find(obj => obj.tableBodyColor)?.tableBodyColor;
|
||||||
|
const footerColor = printColors?.find(obj => obj.footerColor)?.footerColor;
|
||||||
|
const netAmtColor = printColors?.find(obj => obj.netAmtColor)?.netAmtColor;
|
||||||
|
|
||||||
const dataSource = table2Data?.[0]?.ProductDetails;
|
const dataSource = table2Data?.[0]?.ProductDetails;
|
||||||
console.log(table2Data, "dataSource")
|
|
||||||
if (keysLength > 0) {
|
if (keysLength > 0) {
|
||||||
dispatch(changeReprintDataFound(true));
|
dispatch(changeReprintDataFound(true));
|
||||||
}
|
}
|
||||||
|
|
@ -135,7 +159,51 @@ const PurPrintStyle1 = ({
|
||||||
console.log(paginatedChunks, "paginatedChunkspaginatedChunkspaginatedChunks")
|
console.log(paginatedChunks, "paginatedChunkspaginatedChunkspaginatedChunks")
|
||||||
const lastChunkRows = paginatedChunks.length > 0 ? paginatedChunks[paginatedChunks.length - 1].length : 0;
|
const lastChunkRows = paginatedChunks.length > 0 ? paginatedChunks[paginatedChunks.length - 1].length : 0;
|
||||||
const shouldFooterBeOnNewPage = lastChunkRows > (PageSize == "A5" ? 5 : 10);
|
const shouldFooterBeOnNewPage = lastChunkRows > (PageSize == "A5" ? 5 : 10);
|
||||||
console.log(PageSize == "A5" ? '210mm' : "297mm", "aggregatedPaymentsaggregatedPayments");
|
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 (
|
return (
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -149,10 +217,9 @@ const PurPrintStyle1 = ({
|
||||||
{paginatedChunks.map((dataChunk, chunkIndex) => (
|
{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 ? "" : "", height: FormatTheme ? PageSize == "A5" ? '170mm' : (isMobile ? "257mm" : "257mm") : "", }} key={chunkIndex}>
|
<div className={`container print-chunk${chunkIndex > 0 ? ' print-page-break' : ''}`} style={{ display: "flex", flexDirection: "column", justifyContent: ((chunkIndex === paginatedChunks.length - 1) && (!shouldFooterBeOnNewPage)) && FormatTheme ? "" : "", height: FormatTheme ? PageSize == "A5" ? '170mm' : (isMobile ? "257mm" : "257mm") : "", }} key={chunkIndex}>
|
||||||
{console.log(dataChunk, "dataChunkdataChunkdataChunk")}
|
|
||||||
{/* <div className="header" style={{ position: GlobaldummyData ? "absolute" : "fixed", top: 0, width: "100%" }}> */}
|
{/* <div className="header" style={{ position: GlobaldummyData ? "absolute" : "fixed", top: 0, width: "100%" }}> */}
|
||||||
<div className="header" style={{ position: isMobile ? GlobaldummyData ? "absolute" : "fixed" : "", top: 0, width: "100%" }}>
|
<div className="header" style={{ position: isMobile ? GlobaldummyData ? "absolute" : "fixed" : "", top: 0, width: "100%" }}>
|
||||||
<div className="PrintStyle1-print" >
|
<div className="PrintStyle1-print" style={{...headerStyle}} >
|
||||||
<div
|
<div
|
||||||
style={{ fontSize: "clamp(2rem, 2.5vw, 2rem)", fontWeight: "600" }}
|
style={{ fontSize: "clamp(2rem, 2.5vw, 2rem)", fontWeight: "600" }}
|
||||||
>
|
>
|
||||||
|
|
@ -229,12 +296,6 @@ const PurPrintStyle1 = ({
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* orderdetails */}
|
|
||||||
|
|
||||||
{/* <hr className="PrintStyle1-print-dottline" /> */}
|
|
||||||
|
|
||||||
{/* itemdata (loop) */}
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<div style={{ marginTop: GlobaldummyData ? "9rem" : "0rem" }} className="print-body">
|
<div style={{ marginTop: GlobaldummyData ? "9rem" : "0rem" }} className="print-body">
|
||||||
|
|
||||||
|
|
@ -257,21 +318,21 @@ const PurPrintStyle1 = ({
|
||||||
<table className="PrintStyle1-print-table">
|
<table className="PrintStyle1-print-table">
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
{SLNO == true && <th style={{ width: "10px" }}>S.No</th>}
|
{SLNO == true && <th style={{...tableHeaderStyle,width: "10px" }}>S.No</th>}
|
||||||
{Item == true && <th>Item</th>}
|
{Item == true && <th style={{...tableHeaderStyle}}>Item</th>}
|
||||||
{HsnCode == true && (
|
{HsnCode == true && (
|
||||||
<th style={{ width: "10px" }}>HSN</th>
|
<th style={{...tableHeaderStyle, width: "10px" }}>HSN</th>
|
||||||
)}
|
)}
|
||||||
{Quantity == true && (
|
{Quantity == true && (
|
||||||
<th style={{ width: "10px" }}>Qty</th>
|
<th style={{...tableHeaderStyle, width: "10px" }}>Qty</th>
|
||||||
)}
|
)}
|
||||||
{MRP == true && <th style={{ width: "10px" }}>MRP</th>}
|
{MRP == true && <th style={{...tableHeaderStyle, width: "10px" }}>MRP</th>}
|
||||||
{Rate == true && <th style={{ width: "10px" }}>Rate</th>}
|
{Rate == true && <th style={{...tableHeaderStyle, width: "10px" }}>Rate</th>}
|
||||||
{Discount == true && (
|
{Discount == true && (
|
||||||
<th style={{ width: "10px" }}>Dis </th>
|
<th style={{...tableHeaderStyle, width: "10px" }}>Dis </th>
|
||||||
)}
|
)}
|
||||||
{Amount == true && (
|
{Amount == true && (
|
||||||
<th style={{ width: "10px", textAlign: "right" }}>
|
<th style={{...tableHeaderStyle, width: "10px", textAlign: "right" }}>
|
||||||
Amt
|
Amt
|
||||||
</th>
|
</th>
|
||||||
)}
|
)}
|
||||||
|
|
@ -282,7 +343,18 @@ const PurPrintStyle1 = ({
|
||||||
|
|
||||||
{dataChunk?.map(
|
{dataChunk?.map(
|
||||||
(item, index) => (
|
(item, index) => (
|
||||||
<tr key={index}>
|
<tr key={index}
|
||||||
|
style={
|
||||||
|
index % 2 !== 1 && rowtypeStyle === "even"
|
||||||
|
? {
|
||||||
|
...tableBodyStyle
|
||||||
|
}
|
||||||
|
: index % 2 === 1 && rowtypeStyle === "odd"
|
||||||
|
? {
|
||||||
|
...tableBodyStyle
|
||||||
|
}
|
||||||
|
: {}
|
||||||
|
}>
|
||||||
{SLNO == true && (
|
{SLNO == true && (
|
||||||
<td style={{ textAlign: "center" }}>
|
<td style={{ textAlign: "center" }}>
|
||||||
{chunkIndex * chunkSize + index + 1}
|
{chunkIndex * chunkSize + index + 1}
|
||||||
|
|
@ -392,11 +464,12 @@ const PurPrintStyle1 = ({
|
||||||
style={{
|
style={{
|
||||||
display: "flex",
|
display: "flex",
|
||||||
justifyContent: "space-around",
|
justifyContent: "space-around",
|
||||||
width: "95%",
|
width: "100%",
|
||||||
whiteSpace: "nowrap",
|
whiteSpace: "nowrap",
|
||||||
fontSize: "10px",
|
fontSize: "10px",
|
||||||
flexWrap: "wrap",
|
flexWrap: "wrap",
|
||||||
gap: "2px"
|
gap: "2px",
|
||||||
|
...netAmountStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<div
|
<div
|
||||||
|
|
@ -607,13 +680,7 @@ const PurPrintStyle1 = ({
|
||||||
marginTop: "5px",
|
marginTop: "5px",
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
{/* <hr className="PrintStyle1-print-dottline" /> */}
|
{/* <hr className="PrintStyle1-print-dottline" /> */}
|
||||||
|
|
||||||
<div className="page-footerA4Style11"
|
<div className="page-footerA4Style11"
|
||||||
|
|
@ -622,6 +689,7 @@ const PurPrintStyle1 = ({
|
||||||
pageBreakBefore: "avoid",
|
pageBreakBefore: "avoid",
|
||||||
pageBreakInside: "avoid",
|
pageBreakInside: "avoid",
|
||||||
minHeight: "auto",
|
minHeight: "auto",
|
||||||
|
...footerColorStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{
|
{
|
||||||
|
|
@ -690,11 +758,12 @@ const PurPrintStyle1 = ({
|
||||||
style={{
|
style={{
|
||||||
display: "flex",
|
display: "flex",
|
||||||
justifyContent: "space-around",
|
justifyContent: "space-around",
|
||||||
width: "95%",
|
width: "100%",
|
||||||
whiteSpace: "nowrap",
|
whiteSpace: "nowrap",
|
||||||
fontSize: "10px",
|
fontSize: "10px",
|
||||||
flexWrap: "wrap",
|
flexWrap: "wrap",
|
||||||
gap: "2px"
|
gap: "2px",
|
||||||
|
...netAmountStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<div
|
<div
|
||||||
|
|
@ -918,6 +987,7 @@ const PurPrintStyle1 = ({
|
||||||
pageBreakBefore: "avoid",
|
pageBreakBefore: "avoid",
|
||||||
pageBreakInside: "avoid",
|
pageBreakInside: "avoid",
|
||||||
minHeight: "auto",
|
minHeight: "auto",
|
||||||
|
...footerColorStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{
|
{
|
||||||
|
|
@ -974,11 +1044,12 @@ const PurPrintStyle1 = ({
|
||||||
style={{
|
style={{
|
||||||
display: "flex",
|
display: "flex",
|
||||||
justifyContent: "space-around",
|
justifyContent: "space-around",
|
||||||
width: "95%",
|
width: "100%",
|
||||||
whiteSpace: "nowrap",
|
whiteSpace: "nowrap",
|
||||||
fontSize: "10px",
|
fontSize: "10px",
|
||||||
flexWrap: "wrap",
|
flexWrap: "wrap",
|
||||||
gap: "2px"
|
gap: "2px",
|
||||||
|
...netAmountStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<div
|
<div
|
||||||
|
|
@ -1198,6 +1269,7 @@ const PurPrintStyle1 = ({
|
||||||
pageBreakBefore: "avoid",
|
pageBreakBefore: "avoid",
|
||||||
pageBreakInside: "avoid",
|
pageBreakInside: "avoid",
|
||||||
minHeight: "auto",
|
minHeight: "auto",
|
||||||
|
...footerColorStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{
|
{
|
||||||
|
|
@ -1254,16 +1326,12 @@ const PurPrintStyle1 = ({
|
||||||
}
|
}
|
||||||
|
|
||||||
</div > :
|
</div > :
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<div
|
<div
|
||||||
className="PrintStyle1MasterDiv"
|
className="PrintStyle1MasterDiv"
|
||||||
id={`SQPrintStyle1`}
|
id={`SQPrintStyle1`}
|
||||||
style={{ fontFamily: "'Courier New', Courier, monospace" }}
|
style={{ fontFamily: "'Courier New', Courier, monospace" }}
|
||||||
>
|
>
|
||||||
<div className="PrintStyle1-print">
|
<div className="PrintStyle1-print" style={{...headerStyle}}>
|
||||||
<div
|
<div
|
||||||
style={{ fontSize: "clamp(2rem, 2.5vw, 2rem)", fontWeight: "600" }}
|
style={{ fontSize: "clamp(2rem, 2.5vw, 2rem)", fontWeight: "600" }}
|
||||||
>
|
>
|
||||||
|
|
@ -1340,7 +1408,18 @@ const PurPrintStyle1 = ({
|
||||||
<tbody>
|
<tbody>
|
||||||
{(TakeawayData)?.map(
|
{(TakeawayData)?.map(
|
||||||
(item, index) => (
|
(item, index) => (
|
||||||
<tr key={index}>
|
<tr key={index}
|
||||||
|
style={
|
||||||
|
index % 2 !== 1 && rowtypeStyle === "even"
|
||||||
|
? {
|
||||||
|
...tableBodyStyle
|
||||||
|
}
|
||||||
|
: index % 2 === 1 && rowtypeStyle === "odd"
|
||||||
|
? {
|
||||||
|
...tableBodyStyle
|
||||||
|
}
|
||||||
|
: {}
|
||||||
|
}>
|
||||||
{SLNO == true && (
|
{SLNO == true && (
|
||||||
<td style={{ textAlign: "center" }}>
|
<td style={{ textAlign: "center" }}>
|
||||||
{index + 1}
|
{index + 1}
|
||||||
|
|
@ -1447,11 +1526,12 @@ const PurPrintStyle1 = ({
|
||||||
style={{
|
style={{
|
||||||
display: "flex",
|
display: "flex",
|
||||||
justifyContent: "space-around",
|
justifyContent: "space-around",
|
||||||
width: "95%",
|
width: "100%",
|
||||||
whiteSpace: "nowrap",
|
whiteSpace: "nowrap",
|
||||||
fontSize: "10px",
|
fontSize: "10px",
|
||||||
flexWrap: "wrap",
|
flexWrap: "wrap",
|
||||||
gap: "2px"
|
gap: "2px",
|
||||||
|
...netAmountStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<div
|
<div
|
||||||
|
|
@ -1659,11 +1739,6 @@ const PurPrintStyle1 = ({
|
||||||
>
|
>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<hr className="PrintStyle1-print-dottline" />
|
<hr className="PrintStyle1-print-dottline" />
|
||||||
|
|
||||||
<div className="page-footerA4Style11"
|
<div className="page-footerA4Style11"
|
||||||
|
|
@ -1672,6 +1747,7 @@ const PurPrintStyle1 = ({
|
||||||
pageBreakBefore: "avoid",
|
pageBreakBefore: "avoid",
|
||||||
pageBreakInside: "avoid",
|
pageBreakInside: "avoid",
|
||||||
minHeight: "auto",
|
minHeight: "auto",
|
||||||
|
...footerColorStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{
|
{
|
||||||
|
|
|
||||||
|
|
@ -4,7 +4,18 @@ import { useDispatch, useSelector } from "react-redux";
|
||||||
import {
|
import {
|
||||||
GlobalPritdummyData,
|
GlobalPritdummyData,
|
||||||
changeReprintDataFound,
|
changeReprintDataFound,
|
||||||
GlobalprinttermsAndConditions
|
GlobalprinttermsAndConditions,
|
||||||
|
GlobalSelectedPrintHeaderColor,
|
||||||
|
GlobalSelectedPrintHeaderFontColor,
|
||||||
|
GlobalSelectedTableHeaderColor,
|
||||||
|
GlobalSelectedTableHeaderFontColor,
|
||||||
|
GlobalSelectedTableBodyColor,
|
||||||
|
GlobalSelectedTableBodyFontColor,
|
||||||
|
GlobalRowType,
|
||||||
|
GlobalSelectedFooterColor,
|
||||||
|
GlobalSelectedFooterFontColor,
|
||||||
|
GlobalSelectedNetAmountColor,
|
||||||
|
GlobalSelectedNetAmountFontColor,
|
||||||
} from '../../../Features/ThemeChange/ThemeChange'
|
} from '../../../Features/ThemeChange/ThemeChange'
|
||||||
import "../../../Styles/BookingScreen/PrintTemplates/ThermalPrinter/PrintStyle10.scss";
|
import "../../../Styles/BookingScreen/PrintTemplates/ThermalPrinter/PrintStyle10.scss";
|
||||||
|
|
||||||
|
|
@ -13,7 +24,7 @@ import { isMobile } from "react-device-detect";
|
||||||
|
|
||||||
const PurPrintStyle10 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, CashierName, totalQuantity, OrderDetailGST, OrderDetailIGST,
|
const PurPrintStyle10 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, CashierName, totalQuantity, OrderDetailGST, OrderDetailIGST,
|
||||||
OrderDetailVAT, table2Data, PaymentStatus, PrintGreeting, printDatas }) => {
|
OrderDetailVAT, table2Data, PaymentStatus, PrintGreeting, printDatas }) => {
|
||||||
console.log(OrderDetailGST,'OrderDetailGST');
|
console.log(OrderDetailGST, 'OrderDetailGST');
|
||||||
|
|
||||||
const dispatch = useDispatch();
|
const dispatch = useDispatch();
|
||||||
|
|
||||||
|
|
@ -30,11 +41,26 @@ console.log(OrderDetailGST,'OrderDetailGST');
|
||||||
const Rate = FieldDetails?.["Rate"];
|
const Rate = FieldDetails?.["Rate"];
|
||||||
const Amount = FieldDetails?.["Amount"];
|
const Amount = FieldDetails?.["Amount"];
|
||||||
const HsnCode = FieldDetails?.["HsnCode"];
|
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 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 TermsAndConditions = printDatas?.TermsandConditions
|
||||||
let SignatureImg = printDatas?.Signature
|
let SignatureImg = printDatas?.Signature
|
||||||
|
|
@ -75,7 +101,51 @@ console.log(OrderDetailGST,'OrderDetailGST');
|
||||||
}
|
}
|
||||||
const lastChunkRows = paginatedChunks.length > 0 ? paginatedChunks[paginatedChunks.length - 1].length : 0;
|
const lastChunkRows = paginatedChunks.length > 0 ? paginatedChunks[paginatedChunks.length - 1].length : 0;
|
||||||
const shouldFooterBeOnNewPage = lastChunkRows > (PageSize == "A5" ? 5 : 10);
|
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 (
|
return (
|
||||||
<>
|
<>
|
||||||
{FormatTheme ?
|
{FormatTheme ?
|
||||||
|
|
@ -89,7 +159,7 @@ console.log(OrderDetailGST,'OrderDetailGST');
|
||||||
|
|
||||||
|
|
||||||
<div className="header" style={{ position: isMobile ? GlobaldummyData ? "absolute" : "fixed" : "", top: 0, width: "100%" }}>
|
<div className="header" style={{ position: isMobile ? GlobaldummyData ? "absolute" : "fixed" : "", top: 0, width: "100%" }}>
|
||||||
<div className="PrintStyle10-print">
|
<div className="PrintStyle10-print" style={{ ...headerStyle }} >
|
||||||
<div className="ShopName"
|
<div className="ShopName"
|
||||||
style={{
|
style={{
|
||||||
fontWeight: "600",
|
fontWeight: "600",
|
||||||
|
|
@ -124,20 +194,31 @@ console.log(OrderDetailGST,'OrderDetailGST');
|
||||||
<table className="PrintStyle10-print-table">
|
<table className="PrintStyle10-print-table">
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
{SLNO && <th style={{ width: '10px' }}>S.N</th>}
|
{SLNO && <th style={{ ...tableHeaderStyle, width: '10px' }}>S.N</th>}
|
||||||
{Item && <th style={{ width: '10px' }}>Item</th>}
|
{Item && <th style={{ ...tableHeaderStyle, width: '10px' }}>Item</th>}
|
||||||
{Quantity && <th style={{ width: '10px', textAlign: 'right' }}>Qty</th>}
|
{Quantity && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>Qty</th>}
|
||||||
{HsnCode && <th style={{ width: '10px', textAlign: 'right' }}>HSN</th>}
|
{HsnCode && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>HSN</th>}
|
||||||
{MRP && <th style={{ width: '10px', textAlign: 'right' }}>MRP</th>}
|
{MRP && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>MRP</th>}
|
||||||
{Discount && <th style={{ width: '10px', textAlign: 'right' }}>Dis </th>}
|
{Discount && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>Dis </th>}
|
||||||
{Rate && <th style={{ width: '10px', textAlign: 'right' }}>Rate</th>}
|
{Rate && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>Rate</th>}
|
||||||
{Amount && <th style={{ width: '10px', textAlign: 'right' }}>Amt</th>}
|
{Amount && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>Amt</th>}
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
{dataChunk?.map((item, index) => {
|
{dataChunk?.map((item, index) => {
|
||||||
return (
|
return (
|
||||||
<tr key={index}>
|
<tr key={index}
|
||||||
|
style={
|
||||||
|
index % 2 !== 1 && rowtypeStyle === "even"
|
||||||
|
? {
|
||||||
|
...tableBodyStyle
|
||||||
|
}
|
||||||
|
: index % 2 === 1 && rowtypeStyle === "odd"
|
||||||
|
? {
|
||||||
|
...tableBodyStyle
|
||||||
|
}
|
||||||
|
: {}
|
||||||
|
}>
|
||||||
{SLNO && <td style={{ width: '10px', textAlign: 'center' }} >{chunkIndex * chunkSize + index + 1}</td>}
|
{SLNO && <td style={{ width: '10px', textAlign: 'center' }} >{chunkIndex * chunkSize + index + 1}</td>}
|
||||||
{Item && <td style={{ display: 'flex', flexDirection: 'column' }}>
|
{Item && <td style={{ display: 'flex', flexDirection: 'column' }}>
|
||||||
<div>{item?.ProdName}</div>
|
<div>{item?.ProdName}</div>
|
||||||
|
|
@ -179,9 +260,9 @@ console.log(OrderDetailGST,'OrderDetailGST');
|
||||||
display: "flex",
|
display: "flex",
|
||||||
flexDirection: "column",
|
flexDirection: "column",
|
||||||
rowGap: "0.1rem",
|
rowGap: "0.1rem",
|
||||||
fontSize: "clamp(0.7rem, 2.5vw, 1rem)"
|
fontSize: "clamp(0.7rem, 2.5vw, 1rem)",
|
||||||
|
fontWeight: '600',
|
||||||
, fontWeight: '600'
|
...netAmountStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<div className="PrintStyle10-items" >
|
<div className="PrintStyle10-items" >
|
||||||
|
|
@ -359,6 +440,7 @@ console.log(OrderDetailGST,'OrderDetailGST');
|
||||||
pageBreakBefore: "avoid",
|
pageBreakBefore: "avoid",
|
||||||
pageBreakInside: "avoid",
|
pageBreakInside: "avoid",
|
||||||
minHeight: "auto",
|
minHeight: "auto",
|
||||||
|
...footerColorStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{
|
{
|
||||||
|
|
@ -428,9 +510,9 @@ console.log(OrderDetailGST,'OrderDetailGST');
|
||||||
display: "flex",
|
display: "flex",
|
||||||
flexDirection: "column",
|
flexDirection: "column",
|
||||||
rowGap: "0.1rem",
|
rowGap: "0.1rem",
|
||||||
fontSize: "clamp(0.7rem, 2.5vw, 1rem)"
|
fontSize: "clamp(0.7rem, 2.5vw, 1rem)",
|
||||||
|
fontWeight: '600',
|
||||||
, fontWeight: '600'
|
...netAmountStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<div className="PrintStyle10-items" >
|
<div className="PrintStyle10-items" >
|
||||||
|
|
@ -607,6 +689,7 @@ console.log(OrderDetailGST,'OrderDetailGST');
|
||||||
pageBreakBefore: "avoid",
|
pageBreakBefore: "avoid",
|
||||||
pageBreakInside: "avoid",
|
pageBreakInside: "avoid",
|
||||||
minHeight: "auto",
|
minHeight: "auto",
|
||||||
|
...footerColorStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{
|
{
|
||||||
|
|
@ -651,7 +734,7 @@ console.log(OrderDetailGST,'OrderDetailGST');
|
||||||
id={`SQPrintStyle10`}
|
id={`SQPrintStyle10`}
|
||||||
style={{ fontFamily: "'Courier New', Courier, monospace" }}
|
style={{ fontFamily: "'Courier New', Courier, monospace" }}
|
||||||
>
|
>
|
||||||
<div className="PrintStyle10-print">
|
<div className="PrintStyle10-print" style={{ ...headerStyle }}>
|
||||||
<div className="ShopName"
|
<div className="ShopName"
|
||||||
style={{
|
style={{
|
||||||
fontWeight: "600",
|
fontWeight: "600",
|
||||||
|
|
@ -673,8 +756,6 @@ console.log(OrderDetailGST,'OrderDetailGST');
|
||||||
|
|
||||||
{<div style={{ textTransform: 'uppercase' }}>{BillName}</div>}
|
{<div style={{ textTransform: 'uppercase' }}>{BillName}</div>}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<div style={{ fontSize: '9.27px', fontWeight: '600', textAlign: 'right' }}> {Date1} </div>
|
<div style={{ fontSize: '9.27px', fontWeight: '600', textAlign: 'right' }}> {Date1} </div>
|
||||||
<hr class="straightline" />
|
<hr class="straightline" />
|
||||||
|
|
@ -685,20 +766,31 @@ console.log(OrderDetailGST,'OrderDetailGST');
|
||||||
<table className="PrintStyle10-print-table">
|
<table className="PrintStyle10-print-table">
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
{SLNO && <th style={{ width: '10px' }}>S.N</th>}
|
{SLNO && <th style={{ ...tableHeaderStyle, width: '10px' }}>S.N</th>}
|
||||||
{Item && <th style={{ width: '10px' }}>Item</th>}
|
{Item && <th style={{ ...tableHeaderStyle, width: '10px' }}>Item</th>}
|
||||||
{Quantity && <th style={{ width: '10px', textAlign: 'right' }}>Qty</th>}
|
{Quantity && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>Qty</th>}
|
||||||
{HsnCode && <th style={{ width: '10px', textAlign: 'right' }}>HSN</th>}
|
{HsnCode && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>HSN</th>}
|
||||||
{MRP && <th style={{ width: '10px', textAlign: 'right' }}>MRP</th>}
|
{MRP && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>MRP</th>}
|
||||||
{Discount && <th style={{ width: '10px', textAlign: 'right' }}>Dis </th>}
|
{Discount && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>Dis </th>}
|
||||||
{Rate && <th style={{ width: '10px', textAlign: 'right' }}>Rate</th>}
|
{Rate && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>Rate</th>}
|
||||||
{Amount && <th style={{ width: '10px', textAlign: 'right' }}>Amt</th>}
|
{Amount && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>Amt</th>}
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
{(TakeawayData)?.map((item, index) => {
|
{(TakeawayData)?.map((item, index) => {
|
||||||
return (
|
return (
|
||||||
<tr key={index}>
|
<tr key={index}
|
||||||
|
style={
|
||||||
|
index % 2 !== 1 && rowtypeStyle === "even"
|
||||||
|
? {
|
||||||
|
...tableBodyStyle
|
||||||
|
}
|
||||||
|
: index % 2 === 1 && rowtypeStyle === "odd"
|
||||||
|
? {
|
||||||
|
...tableBodyStyle
|
||||||
|
}
|
||||||
|
: {}
|
||||||
|
}>
|
||||||
{SLNO && <td style={{ width: '10px', textAlign: 'center' }} >{index + 1}</td>}
|
{SLNO && <td style={{ width: '10px', textAlign: 'center' }} >{index + 1}</td>}
|
||||||
{Item && <td style={{ display: 'flex', flexDirection: 'column' }}>
|
{Item && <td style={{ display: 'flex', flexDirection: 'column' }}>
|
||||||
<div>{item?.ProdName}</div>
|
<div>{item?.ProdName}</div>
|
||||||
|
|
@ -739,9 +831,9 @@ console.log(OrderDetailGST,'OrderDetailGST');
|
||||||
display: "flex",
|
display: "flex",
|
||||||
flexDirection: "column",
|
flexDirection: "column",
|
||||||
rowGap: "0.1rem",
|
rowGap: "0.1rem",
|
||||||
fontSize: "clamp(0.7rem, 2.5vw, 1rem)"
|
fontSize: "clamp(0.7rem, 2.5vw, 1rem)",
|
||||||
|
fontWeight: '600',
|
||||||
, fontWeight: '600'
|
...netAmountStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<div className="PrintStyle10-items" >
|
<div className="PrintStyle10-items" >
|
||||||
|
|
@ -918,6 +1010,7 @@ console.log(OrderDetailGST,'OrderDetailGST');
|
||||||
pageBreakBefore: "avoid",
|
pageBreakBefore: "avoid",
|
||||||
pageBreakInside: "avoid",
|
pageBreakInside: "avoid",
|
||||||
minHeight: "auto",
|
minHeight: "auto",
|
||||||
|
...footerColorStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{
|
{
|
||||||
|
|
|
||||||
|
|
@ -4,7 +4,18 @@ import { useDispatch, useSelector } from "react-redux";
|
||||||
import {
|
import {
|
||||||
GlobalPritdummyData,
|
GlobalPritdummyData,
|
||||||
changeReprintDataFound,
|
changeReprintDataFound,
|
||||||
GlobalprinttermsAndConditions
|
GlobalprinttermsAndConditions,
|
||||||
|
GlobalSelectedPrintHeaderColor,
|
||||||
|
GlobalSelectedPrintHeaderFontColor,
|
||||||
|
GlobalSelectedTableHeaderColor,
|
||||||
|
GlobalSelectedTableHeaderFontColor,
|
||||||
|
GlobalSelectedTableBodyColor,
|
||||||
|
GlobalSelectedTableBodyFontColor,
|
||||||
|
GlobalRowType,
|
||||||
|
GlobalSelectedFooterColor,
|
||||||
|
GlobalSelectedFooterFontColor,
|
||||||
|
GlobalSelectedNetAmountColor,
|
||||||
|
GlobalSelectedNetAmountFontColor,
|
||||||
} from '../../../Features/ThemeChange/ThemeChange';
|
} from '../../../Features/ThemeChange/ThemeChange';
|
||||||
import "../../../Styles/BookingScreen/PrintTemplates/ThermalPrinter/PrintStyle11.scss";
|
import "../../../Styles/BookingScreen/PrintTemplates/ThermalPrinter/PrintStyle11.scss";
|
||||||
import { extractLastNumber } from "../../../Services/Others";
|
import { extractLastNumber } from "../../../Services/Others";
|
||||||
|
|
@ -29,11 +40,26 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
|
||||||
const Rate = FieldDetails?.["Rate"];
|
const Rate = FieldDetails?.["Rate"];
|
||||||
const Amount = FieldDetails?.["Amount"];
|
const Amount = FieldDetails?.["Amount"];
|
||||||
const HsnCode = FieldDetails?.["HsnCode"];
|
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 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 TermsAndConditions = printDatas?.TermsandConditions
|
||||||
let SignatureImg = printDatas?.Signature
|
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 lastChunkRows = paginatedChunks.length > 0 ? paginatedChunks[paginatedChunks.length - 1].length : 0;
|
||||||
const shouldFooterBeOnNewPage = lastChunkRows > (PageSize == "A5" ? 5 : 10);
|
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 (
|
return (
|
||||||
<>
|
<>
|
||||||
{FormatTheme ?
|
{FormatTheme ?
|
||||||
<div className="PrintStyle11MasterDiv" id={`SQPrintStyle11`}
|
<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) => (
|
{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={`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: "fixed", top: 0, width: "100%" }}> */}
|
||||||
<div className="header" style={{ position: isMobile ? "fixed" : "", top: 0, width: "100%" }}>
|
<div className="header" style={{ position: isMobile ? "fixed" : "", top: 0, width: "100%" }}>
|
||||||
<div className="PrintStyle11-print">
|
<div style={{ ...headerStyle }}>
|
||||||
{base64Image ? <img className='PrintStyle11-BrandImage' src={ base64Image} alt='image' style={{ width: '40px', height: '40px', }} /> : null}
|
<div className="PrintStyle11-print" style={{ ...headerStyle }}>
|
||||||
<div>
|
{base64Image ? <img className='PrintStyle11-BrandImage' src={base64Image} alt='image' style={{ width: '40px', height: '40px', }} /> : null}
|
||||||
<div style={{
|
<div>
|
||||||
fontWeight: '600',
|
<div style={{
|
||||||
// fontFamily: "Lemon",
|
fontWeight: '600',
|
||||||
fontSize: 'clamp(1rem, 2.5vw, 2.5rem)'
|
// fontFamily: "Lemon",
|
||||||
}}>
|
fontSize: 'clamp(1rem, 2.5vw, 2.5rem)'
|
||||||
{ table2Data?.[0]?.BrName}
|
}}>
|
||||||
|
{table2Data?.[0]?.BrName}
|
||||||
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<hr style={{ margin: '0.1rem 0rem' }} />
|
||||||
<hr style={{ margin: '0.1rem 0rem' }} />
|
<div className='PrintStyle11-print-SecondDiv' >
|
||||||
<div className='PrintStyle11-print-SecondDiv' >
|
<div style={{ fontSize: "12px", fontWeight: '600' }}>
|
||||||
<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 : '')}
|
||||||
(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>
|
||||||
<div style={{ fontSize: "11px", fontWeight: '600' }}> MOBILE NO :{table2Data?.[0]?.BrMobile}</div>
|
|
||||||
</div>
|
</div>
|
||||||
<hr style={{ margin: '0.1rem 0rem' }} />
|
<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>
|
<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>
|
||||||
|
|
||||||
|
|
||||||
<div style={{ marginTop: "0rem" }} className="print-body">
|
<div style={{ marginTop: "0rem" }} className="print-body">
|
||||||
{(TakeawayData?.length > 0 ) &&
|
{(TakeawayData?.length > 0) &&
|
||||||
<>
|
<>
|
||||||
|
|
||||||
<table className="PrintStyle11-print-table">
|
<table className="PrintStyle11-print-table">
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
{SLNO && <th style={{ width: '10px' }}>S.N</th>}
|
{SLNO && <th style={{ ...tableHeaderStyle, width: '10px' }}>S.N</th>}
|
||||||
{Item && <th style={{ width: '10px' }}>Item</th>}
|
{Item && <th style={{ ...tableHeaderStyle, width: '10px' }}>Item</th>}
|
||||||
{Quantity && <th style={{ width: '10px', textAlign: 'right' }}>Qty</th>}
|
{Quantity && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>Qty</th>}
|
||||||
{ HsnCode && <th style={{ width: '10px', textAlign: 'right' }}>HSN</th>}
|
{HsnCode && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>HSN</th>}
|
||||||
{ MRP && <th style={{ width: '10px', textAlign: 'right' }}>MRP</th>}
|
{MRP && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>MRP</th>}
|
||||||
{ Discount && <th style={{ width: '10px', textAlign: 'right' }}>Dis </th>}
|
{Discount && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>Dis </th>}
|
||||||
{ Rate && <th style={{ width: '10px', textAlign: 'right' }}>Rate</th>}
|
{Rate && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>Rate</th>}
|
||||||
{ Amount && <th style={{ width: '10px', textAlign: 'right' }}>Amt</th>}
|
{Amount && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>Amt</th>}
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
{dataChunk?.map((item, index) => {
|
{dataChunk?.map((item, index) => {
|
||||||
return (
|
return (
|
||||||
<tr key={index}>
|
<tr key={index}
|
||||||
{ SLNO && <td>{chunkIndex * chunkSize + index + 1}</td>}
|
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' }}>
|
{Item && <td style={{ display: 'flex', flexDirection: 'column' }}>
|
||||||
<div>{item?.ProdName}</div>
|
<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 : ""}
|
<div>({item?.Size ? item?.Size : "1"} {item?.SinglePc == 'Y' ? 'PCS' : item?.Type != "C" ? item?.UomName : "COMBO"}){item?.BrandName !== null ? item?.BrandName : ""}
|
||||||
|
|
@ -149,8 +232,8 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
|
||||||
{HsnCode && <td style={{ textAlign: 'right' }}>{item?.HSN}</td>}
|
{HsnCode && <td style={{ textAlign: 'right' }}>{item?.HSN}</td>}
|
||||||
{MRP && <td style={{ textAlign: 'right' }}>{item?.SinglePc === 'Y' ? item?.Price : item?.MRP}</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>}
|
{Discount && <td style={{ textAlign: 'right' }}>{item?.Type != "C" ? item?.OfferAmt || 0 : item?.OfferValue || 0}</td>}
|
||||||
{ Rate && <td style={{ textAlign: 'right' }}>{item?.Price}</td>}
|
{Rate && <td style={{ textAlign: 'right' }}>{item?.Price}</td>}
|
||||||
{ Amount && <td style={{ textAlign: 'right' }}>{item?.NetAmt?.toFixed(2)}</td>}
|
{Amount && <td style={{ textAlign: 'right' }}>{item?.NetAmt?.toFixed(2)}</td>}
|
||||||
</tr>
|
</tr>
|
||||||
)
|
)
|
||||||
})}
|
})}
|
||||||
|
|
@ -158,14 +241,14 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
|
||||||
</table>
|
</table>
|
||||||
</>
|
</>
|
||||||
}
|
}
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{((chunkIndex === paginatedChunks.length - 1) && (!shouldFooterBeOnNewPage)) && FormatTheme &&
|
{((chunkIndex === paginatedChunks.length - 1) && (!shouldFooterBeOnNewPage)) && FormatTheme &&
|
||||||
<>
|
<>
|
||||||
<hr className="PrintStyle11-print-dottline" />
|
<hr className="PrintStyle11-print-dottline" />
|
||||||
<div className='PrintStyle11-print-ThirdDiv'>
|
<div className='PrintStyle11-print-ThirdDiv'>
|
||||||
<div>
|
<div style={{ ...netAmountStyle}}>
|
||||||
<div className='PrintStyle11-print-ThirdDivSub'>
|
<div className='PrintStyle11-print-ThirdDivSub'>
|
||||||
<div style={{ display: 'flex', flexDirection: 'column', }}>
|
<div style={{ display: 'flex', flexDirection: 'column', }}>
|
||||||
<div style={{ fontSize: "15px", fontWeight: '600' }}>Qty</div>
|
<div style={{ fontSize: "15px", fontWeight: '600' }}>Qty</div>
|
||||||
|
|
@ -177,15 +260,15 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
|
||||||
<div>ROUND OFF</div> */}
|
<div>ROUND OFF</div> */}
|
||||||
</div>
|
</div>
|
||||||
<div style={{ textAlign: 'right', display: 'flex', flexDirection: 'column', fontSize: "13px", fontWeight: '500' }}>
|
<div style={{ textAlign: 'right', display: 'flex', flexDirection: 'column', fontSize: "13px", fontWeight: '500' }}>
|
||||||
<div>{ totalQuantity}</div>
|
<div>{totalQuantity}</div>
|
||||||
<div>{totalQuantityFilter?.length}</div>
|
<div>{totalQuantityFilter?.length}</div>
|
||||||
{(table2Data?.OverallDisc > 0 || TotalOfferAmount > 0) &&
|
{(table2Data?.OverallDisc > 0 || TotalOfferAmount > 0) &&
|
||||||
<div>{ Number(TotalOfferAmount + table2Data?.OverallDisc).toFixed(2)}</div>
|
<div>{Number(TotalOfferAmount + table2Data?.OverallDisc).toFixed(2)}</div>
|
||||||
}
|
}
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div style={{ textAlign: 'right', fontWeight: '600', fontSize: '18px' }}>Amount :{Number(table2Data?.[0]?.NetAmount).toFixed(2)}/-</div>
|
<div style={{ textAlign: 'right', fontWeight: '600', fontSize: '18px' }}>Amount :{Number(table2Data?.[0]?.NetAmount).toFixed(2)}/-</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -317,23 +400,23 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div style={{ display: 'flex', justifyContent: "space-between", width: '92%' }}>
|
<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={{ margin: '0.5rem 0.5rem', display: 'flex', flexDirection: 'column', gap: '0.5rem', fontWeight: '600' }}>
|
||||||
|
|
||||||
|
|
||||||
{table2Data?.CustSuppName && table2Data?.CustSuppName !== undefined && table2Data?.CustSuppName !== null && !GlobaldummyData &&
|
{table2Data?.CustSuppName && table2Data?.CustSuppName !== undefined && table2Data?.CustSuppName !== null && !GlobaldummyData &&
|
||||||
<div className='PrintStyle11-print-InfoDivsub'>Customer : {table2Data?.CustSuppName}
|
<div className='PrintStyle11-print-InfoDivsub'>Customer : {table2Data?.CustSuppName}
|
||||||
</div>
|
</div>
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<div className='PrintStyle11-print-InfoDivsub' style={{ textTransform: 'capitalize' }}>{Date1}</div>
|
<div className='PrintStyle11-print-InfoDivsub' style={{ textTransform: 'capitalize' }}>{Date1}</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<hr className="PrintStyle11-print-dottline" />
|
<hr className="PrintStyle11-print-dottline" />
|
||||||
|
|
||||||
|
|
@ -344,6 +427,7 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
|
||||||
pageBreakBefore: "avoid",
|
pageBreakBefore: "avoid",
|
||||||
pageBreakInside: "avoid",
|
pageBreakInside: "avoid",
|
||||||
minHeight: "auto",
|
minHeight: "auto",
|
||||||
|
...footerColorStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{
|
{
|
||||||
|
|
@ -368,7 +452,7 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
|
||||||
</div>)
|
</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>
|
<p style={{ fontSize: "13px", fontWeight: "bold", marginBottom: "6px" }}>Signature</p>
|
||||||
<img style={{ width: "100px", height: "60px" }} src={SignatureImg} alt="" />
|
<img style={{ width: "100px", height: "60px" }} src={SignatureImg} alt="" />
|
||||||
</div>)}
|
</div>)}
|
||||||
|
|
@ -376,7 +460,7 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</>
|
</>
|
||||||
}
|
}
|
||||||
|
|
@ -406,7 +490,7 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
|
||||||
<>
|
<>
|
||||||
<hr className="PrintStyle11-print-dottline" />
|
<hr className="PrintStyle11-print-dottline" />
|
||||||
<div className='PrintStyle11-print-ThirdDiv'>
|
<div className='PrintStyle11-print-ThirdDiv'>
|
||||||
<div>
|
<div style={{ ...netAmountStyle}}>
|
||||||
<div className='PrintStyle11-print-ThirdDivSub'>
|
<div className='PrintStyle11-print-ThirdDivSub'>
|
||||||
<div style={{ display: 'flex', flexDirection: 'column', }}>
|
<div style={{ display: 'flex', flexDirection: 'column', }}>
|
||||||
<div style={{ fontSize: "15px", fontWeight: '600' }}>Qty</div>
|
<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>{GlobaldummyData ? '1,066' : Number(table2Data?.NetAmount).toFixed(2) ? Number(table2Data?.NetAmount).toFixed(2) : 0}</div> */}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div style={{ textAlign: 'right', fontWeight: '600', fontSize: '18px' }}>Amount :{Number(table2Data?.[0]?.NetAmount).toFixed(2)}/-</div>
|
<div style={{ textAlign: 'right', fontWeight: '600', fontSize: '18px' }}>Amount :{Number(table2Data?.[0]?.NetAmount).toFixed(2)}/-</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -560,19 +644,19 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div style={{ display: 'flex', justifyContent: "space-between", width: '92%' }}>
|
<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={{ margin: '0.5rem 0.5rem', display: 'flex', flexDirection: 'column', gap: '0.5rem', fontWeight: '600' }}>
|
||||||
|
|
||||||
|
|
||||||
{table2Data?.CustSuppName && table2Data?.CustSuppName !== undefined && table2Data?.CustSuppName !== null && !GlobaldummyData &&
|
{table2Data?.CustSuppName && table2Data?.CustSuppName !== undefined && table2Data?.CustSuppName !== null && !GlobaldummyData &&
|
||||||
<div className='PrintStyle11-print-InfoDivsub'>Customer : {table2Data?.CustSuppName}
|
<div className='PrintStyle11-print-InfoDivsub'>Customer : {table2Data?.CustSuppName}
|
||||||
</div>
|
</div>
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<div className='PrintStyle11-print-InfoDivsub' style={{ textTransform: 'capitalize' }}>{Date1}</div>
|
<div className='PrintStyle11-print-InfoDivsub' style={{ textTransform: 'capitalize' }}>{Date1}</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -598,6 +682,7 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
|
||||||
pageBreakBefore: "avoid",
|
pageBreakBefore: "avoid",
|
||||||
pageBreakInside: "avoid",
|
pageBreakInside: "avoid",
|
||||||
minHeight: "auto",
|
minHeight: "auto",
|
||||||
|
...footerColorStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{GlobaldummyData ? GlobalIsnotes &&
|
{GlobaldummyData ? GlobalIsnotes &&
|
||||||
|
|
@ -648,7 +733,7 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</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="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}
|
{base64Image ? <img className='PrintStyle11-BrandImage' src={base64Image} alt='image' style={{ width: '40px', height: '40px', }} /> : null}
|
||||||
<div>
|
<div>
|
||||||
<div style={{
|
<div style={{
|
||||||
|
|
@ -674,7 +759,7 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<hr style={{ margin: '0.1rem 0rem' }} />
|
<hr style={{ margin: '0.1rem 0rem' }} />
|
||||||
<div className='PrintStyle11-print-SecondDiv' >
|
<div className='PrintStyle11-print-SecondDiv' style={{ ...headerStyle }} >
|
||||||
<div style={{ fontSize: "12px", fontWeight: '600' }}>
|
<div style={{ fontSize: "12px", fontWeight: '600' }}>
|
||||||
{GlobaldummyData ?
|
{GlobaldummyData ?
|
||||||
'BranchAddress, Town- 635XXX City - State' :
|
'BranchAddress, Town- 635XXX City - State' :
|
||||||
|
|
@ -693,21 +778,32 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
|
||||||
<table className="PrintStyle11-print-table">
|
<table className="PrintStyle11-print-table">
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
{SLNO && <th style={{ width: '10px' }}>S.N</th>}
|
{SLNO && <th style={{ ...tableHeaderStyle, width: '10px' }}>S.N</th>}
|
||||||
{Item && <th style={{ width: '10px' }}>Item</th>}
|
{Item && <th style={{ ...tableHeaderStyle, width: '10px' }}>Item</th>}
|
||||||
{Quantity && <th style={{ width: '10px', textAlign: 'right' }}>Qty</th>}
|
{Quantity && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>Qty</th>}
|
||||||
{ HsnCode && <th style={{ width: '10px', textAlign: 'right' }}>HSN</th>}
|
{HsnCode && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>HSN</th>}
|
||||||
{ MRP && <th style={{ width: '10px', textAlign: 'right' }}>MRP</th>}
|
{MRP && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>MRP</th>}
|
||||||
{ Discount && <th style={{ width: '10px', textAlign: 'right' }}>Dis </th>}
|
{Discount && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>Dis </th>}
|
||||||
{ Rate && <th style={{ width: '10px', textAlign: 'right' }}>Rate</th>}
|
{Rate && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>Rate</th>}
|
||||||
{ Amount && <th style={{ width: '10px', textAlign: 'right' }}>Amt</th>}
|
{Amount && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>Amt</th>}
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
{( TakeawayData)?.map((item, index) => {
|
{(TakeawayData)?.map((item, index) => {
|
||||||
return (
|
return (
|
||||||
<tr key={index}>
|
<tr key={index}
|
||||||
{ SLNO && <td>{index + 1}</td>}
|
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' }}>
|
{Item && <td style={{ display: 'flex', flexDirection: 'column' }}>
|
||||||
<div>{item?.ProdName}</div>
|
<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 : ""}
|
<div>({item?.Size ? item?.Size : "1"} {item?.SinglePc == 'Y' ? 'PCS' : item?.Type != "C" ? item?.UomName : "COMBO"}){item?.BrandName !== null ? item?.BrandName : ""}
|
||||||
|
|
@ -722,10 +818,10 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
|
||||||
</td>}
|
</td>}
|
||||||
{Quantity && <td style={{ textAlign: 'right' }}>{item?.Qty}</td>}
|
{Quantity && <td style={{ textAlign: 'right' }}>{item?.Qty}</td>}
|
||||||
{HsnCode && <td style={{ textAlign: 'right' }}>{item?.HSN}</td>}
|
{HsnCode && <td style={{ textAlign: 'right' }}>{item?.HSN}</td>}
|
||||||
{ MRP && <td style={{ textAlign: 'right' }}>{item?.SinglePc === 'Y' ? item?.Price : item?.MRP}</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>}
|
{Discount && <td style={{ textAlign: 'right' }}>{item?.Type != "C" ? item?.OfferAmt || 0 : item?.OfferValue || 0}</td>}
|
||||||
{ Rate && <td style={{ textAlign: 'right' }}>{item?.Price}</td>}
|
{Rate && <td style={{ textAlign: 'right' }}>{item?.Price}</td>}
|
||||||
{ Amount && <td style={{ textAlign: 'right' }}>{item?.NetAmt?.toFixed(2)}</td>}
|
{Amount && <td style={{ textAlign: 'right' }}>{item?.NetAmt?.toFixed(2)}</td>}
|
||||||
</tr>
|
</tr>
|
||||||
)
|
)
|
||||||
})}
|
})}
|
||||||
|
|
@ -733,10 +829,10 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
|
||||||
</table>
|
</table>
|
||||||
</>
|
</>
|
||||||
}
|
}
|
||||||
|
|
||||||
<hr className="PrintStyle11-print-dottline" />
|
<hr className="PrintStyle11-print-dottline" />
|
||||||
<div className='PrintStyle11-print-ThirdDiv'>
|
<div className='PrintStyle11-print-ThirdDiv'>
|
||||||
<div>
|
<div style={{ ...netAmountStyle}}>
|
||||||
<div className='PrintStyle11-print-ThirdDivSub'>
|
<div className='PrintStyle11-print-ThirdDivSub'>
|
||||||
<div style={{ display: 'flex', flexDirection: 'column', }}>
|
<div style={{ display: 'flex', flexDirection: 'column', }}>
|
||||||
<div style={{ fontSize: "15px", fontWeight: '600' }}>Qty</div>
|
<div style={{ fontSize: "15px", fontWeight: '600' }}>Qty</div>
|
||||||
|
|
@ -753,10 +849,10 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
|
||||||
{(table2Data?.OverallDisc > 0 || TotalOfferAmount > 0) &&
|
{(table2Data?.OverallDisc > 0 || TotalOfferAmount > 0) &&
|
||||||
<div>{Number(TotalOfferAmount + table2Data?.OverallDisc).toFixed(2)}</div>
|
<div>{Number(TotalOfferAmount + table2Data?.OverallDisc).toFixed(2)}</div>
|
||||||
}
|
}
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div style={{ textAlign: 'right', fontWeight: '600', fontSize: '18px' }}>Amount :{Number(table2Data?.[0]?.NetAmount).toFixed(2)}/-</div>
|
<div style={{ textAlign: 'right', fontWeight: '600', fontSize: '18px' }}>Amount :{Number(table2Data?.[0]?.NetAmount).toFixed(2)}/-</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -888,24 +984,24 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</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 &&
|
{table2Data?.CustSuppName && table2Data?.CustSuppName !== undefined && table2Data?.CustSuppName !== null && !GlobaldummyData &&
|
||||||
<div className='PrintStyle11-print-InfoDivsub'>Customer : {table2Data?.CustSuppName}
|
<div className='PrintStyle11-print-InfoDivsub'>Customer : {table2Data?.CustSuppName}
|
||||||
</div>
|
</div>
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<div className='PrintStyle11-print-InfoDivsub' style={{ textTransform: 'capitalize' }}>{Date1}</div>
|
<div className='PrintStyle11-print-InfoDivsub' style={{ textTransform: 'capitalize' }}>{Date1}</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<hr className="PrintStyle11-print-dottline" />
|
<hr className="PrintStyle11-print-dottline" />
|
||||||
|
|
||||||
|
|
@ -916,6 +1012,7 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
|
||||||
pageBreakBefore: "avoid",
|
pageBreakBefore: "avoid",
|
||||||
pageBreakInside: "avoid",
|
pageBreakInside: "avoid",
|
||||||
minHeight: "auto",
|
minHeight: "auto",
|
||||||
|
...footerColorStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{
|
{
|
||||||
|
|
@ -948,7 +1045,7 @@ const PurPrintStyle11 = ({ index, ExtraChargeTotal, Date1, base64Image, totalQua
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,7 +1,5 @@
|
||||||
import React from "react";
|
import React from "react";
|
||||||
import { useDispatch, useSelector } from "react-redux";
|
import { useDispatch, useSelector } from "react-redux";
|
||||||
|
|
||||||
|
|
||||||
import {
|
import {
|
||||||
|
|
||||||
GlobalPritdummyData,
|
GlobalPritdummyData,
|
||||||
|
|
@ -9,6 +7,17 @@ import {
|
||||||
GlobalprinttermsAndConditions,
|
GlobalprinttermsAndConditions,
|
||||||
Globalnotes,
|
Globalnotes,
|
||||||
GlobalthemeFormat,
|
GlobalthemeFormat,
|
||||||
|
GlobalSelectedPrintHeaderColor,
|
||||||
|
GlobalSelectedPrintHeaderFontColor,
|
||||||
|
GlobalSelectedTableHeaderColor,
|
||||||
|
GlobalSelectedTableHeaderFontColor,
|
||||||
|
GlobalSelectedTableBodyColor,
|
||||||
|
GlobalSelectedTableBodyFontColor,
|
||||||
|
GlobalRowType,
|
||||||
|
GlobalSelectedFooterColor,
|
||||||
|
GlobalSelectedFooterFontColor,
|
||||||
|
GlobalSelectedNetAmountColor,
|
||||||
|
GlobalSelectedNetAmountFontColor,
|
||||||
} from "../../../Features/ThemeChange/ThemeChange";
|
} from "../../../Features/ThemeChange/ThemeChange";
|
||||||
import { extractLastNumber } from "../../../Services/Others";
|
import { extractLastNumber } from "../../../Services/Others";
|
||||||
import "../../../Styles/BookingScreen/PrintTemplates/ThermalPrinter/PrintStyle2.scss";
|
import "../../../Styles/BookingScreen/PrintTemplates/ThermalPrinter/PrintStyle2.scss";
|
||||||
|
|
@ -32,9 +41,17 @@ const PurPrintstyle2 = ({ index, totalQuantityFilter, Date1, base64Image, Cashie
|
||||||
const HsnCode = FieldDetails?.["HsnCode"];
|
const HsnCode = FieldDetails?.["HsnCode"];
|
||||||
const GlobaldummyData = useSelector(GlobalPritdummyData);
|
const GlobaldummyData = useSelector(GlobalPritdummyData);
|
||||||
const GlobaltermsAndConditions = useSelector(GlobalprinttermsAndConditions);
|
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 TermsAndConditions = printDatas?.TermsandConditions
|
||||||
let SignatureImg = printDatas?.Signature
|
let SignatureImg = printDatas?.Signature
|
||||||
|
|
@ -44,9 +61,12 @@ const PurPrintstyle2 = ({ index, totalQuantityFilter, Date1, base64Image, Cashie
|
||||||
let PageSize = printDatas?.PageSize
|
let PageSize = printDatas?.PageSize
|
||||||
const Signature = FieldDetails?.["signature"];
|
const Signature = FieldDetails?.["signature"];
|
||||||
const TermsnAdCondition = FieldDetails?.["terms&conditions"];
|
const TermsnAdCondition = FieldDetails?.["terms&conditions"];
|
||||||
|
let printColors = printDatas?.PrintColors;
|
||||||
|
const headerColor = printColors?.find(obj => obj.headerColor)?.headerColor;
|
||||||
|
const tableHeaderColor = printColors?.find(obj => obj.tableHeaderColor)?.tableHeaderColor;
|
||||||
|
const tableBodyColor = printColors?.find(obj => obj.tableBodyColor)?.tableBodyColor;
|
||||||
|
const footerColor = printColors?.find(obj => obj.footerColor)?.footerColor;
|
||||||
|
const netAmtColor = printColors?.find(obj => obj.netAmtColor)?.netAmtColor;
|
||||||
const keysLength = Object.keys(table2Data ?? {}).length;
|
const keysLength = Object.keys(table2Data ?? {}).length;
|
||||||
const dataSource = table2Data?.[0]?.ProductDetails;
|
const dataSource = table2Data?.[0]?.ProductDetails;
|
||||||
if (keysLength > 0) {
|
if (keysLength > 0) {
|
||||||
|
|
@ -88,7 +108,51 @@ const PurPrintstyle2 = ({ index, totalQuantityFilter, Date1, base64Image, Cashie
|
||||||
}
|
}
|
||||||
const lastChunkRows = paginatedChunks.length > 0 ? paginatedChunks[paginatedChunks.length - 1].length : 0;
|
const lastChunkRows = paginatedChunks.length > 0 ? paginatedChunks[paginatedChunks.length - 1].length : 0;
|
||||||
const shouldFooterBeOnNewPage = lastChunkRows > (PageSize == "A5" ? 5 : 13);
|
const shouldFooterBeOnNewPage = lastChunkRows > (PageSize == "A5" ? 5 : 13);
|
||||||
console.log(FormatTheme, "paginatedChunks")
|
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 (
|
return (
|
||||||
<>
|
<>
|
||||||
{FormatTheme ?
|
{FormatTheme ?
|
||||||
|
|
@ -101,7 +165,7 @@ const PurPrintstyle2 = ({ index, totalQuantityFilter, Date1, base64Image, Cashie
|
||||||
<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={`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: "fixed", top: 0, width: "100%" }}> */}
|
||||||
<div className="header" style={{ position: isMobile ? GlobaldummyData ? "absolute" : "fixed" : "", top: 0, width: "100%" }}>
|
<div className="header" style={{ position: isMobile ? GlobaldummyData ? "absolute" : "fixed" : "", top: 0, width: "100%", ...headerStyle }}>
|
||||||
<div className='PrintStyle2-fistDiv' >
|
<div className='PrintStyle2-fistDiv' >
|
||||||
|
|
||||||
<div style={{ display: 'flex', flexDirection: 'row' }}>
|
<div style={{ display: 'flex', flexDirection: 'row' }}>
|
||||||
|
|
@ -146,20 +210,31 @@ const PurPrintstyle2 = ({ index, totalQuantityFilter, Date1, base64Image, Cashie
|
||||||
<table className="PrintStyle2-print-table">
|
<table className="PrintStyle2-print-table">
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
{SLNO && <th style={{ width: '8px' }}>S.No</th>}
|
{SLNO && <th style={{ width: '8px', ...tableHeaderStyle }}>S.No</th>}
|
||||||
{Item && <th >Item</th>}
|
{Item && <th style={{ ...tableHeaderStyle }} >Item</th>}
|
||||||
{HsnCode && <th style={{ width: '8px', textAlign: 'right' }}>HSN</th>}
|
{HsnCode && <th style={{ width: '8px', textAlign: 'right', ...tableHeaderStyle }}>HSN</th>}
|
||||||
{Quantity && <th style={{ width: '8px', textAlign: 'right' }}>Qty</th>}
|
{Quantity && <th style={{ width: '8px', textAlign: 'right', ...tableHeaderStyle }}>Qty</th>}
|
||||||
{MRP && <th style={{ width: '8px', textAlign: 'right' }}>MRP</th>}
|
{MRP && <th style={{ width: '8px', textAlign: 'right', ...tableHeaderStyle }}>MRP</th>}
|
||||||
{Amount && <th style={{ width: '8px', textAlign: 'right' }}>Amt</th>}
|
{Amount && <th style={{ width: '8px', textAlign: 'right', ...tableHeaderStyle }}>Amt</th>}
|
||||||
{Discount && <th style={{ width: '8px', textAlign: 'right' }}>Dis </th>}
|
{Discount && <th style={{ width: '8px', textAlign: 'right', ...tableHeaderStyle }}>Dis </th>}
|
||||||
{Rate && <th style={{ width: '8px', textAlign: 'right' }}>Rate</th>}
|
{Rate && <th style={{ width: '8px', textAlign: 'right', ...tableHeaderStyle }}>Rate</th>}
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
{dataChunk?.map((item, index) => {
|
{dataChunk?.map((item, index) => {
|
||||||
return (
|
return (
|
||||||
<tr key={index} >
|
<tr key={index}
|
||||||
|
style={
|
||||||
|
index % 2 !== 1 && rowtypeStyle === "even"
|
||||||
|
? {
|
||||||
|
...tableBodyStyle
|
||||||
|
}
|
||||||
|
: index % 2 === 1 && rowtypeStyle === "odd"
|
||||||
|
? {
|
||||||
|
...tableBodyStyle
|
||||||
|
}
|
||||||
|
: {}
|
||||||
|
} >
|
||||||
{SLNO && <td className="Re-print-body-Rate">{chunkIndex * chunkSize + index + 1}</td>}
|
{SLNO && <td className="Re-print-body-Rate">{chunkIndex * chunkSize + index + 1}</td>}
|
||||||
{Item &&
|
{Item &&
|
||||||
<td className="Re-print-body-Product" style={{ display: 'flex', flexDirection: 'column' }}>
|
<td className="Re-print-body-Product" style={{ display: 'flex', flexDirection: 'column' }}>
|
||||||
|
|
@ -196,7 +271,7 @@ const PurPrintstyle2 = ({ index, totalQuantityFilter, Date1, base64Image, Cashie
|
||||||
|
|
||||||
{((chunkIndex === paginatedChunks.length - 1) && (!shouldFooterBeOnNewPage)) && FormatTheme &&
|
{((chunkIndex === paginatedChunks.length - 1) && (!shouldFooterBeOnNewPage)) && FormatTheme &&
|
||||||
<>
|
<>
|
||||||
<div className='PrintStyle2-ThirdDivMaster'>
|
<div className='PrintStyle2-ThirdDivMaster' style={{...netAmountStyle}}>
|
||||||
<div className='PrintStyle2-ThirdP'>
|
<div className='PrintStyle2-ThirdP'>
|
||||||
<div>
|
<div>
|
||||||
<div style={{ textAlign: 'left', fontWeight: '600' }}>Qty</div>
|
<div style={{ textAlign: 'left', fontWeight: '600' }}>Qty</div>
|
||||||
|
|
@ -362,16 +437,13 @@ const PurPrintstyle2 = ({ index, totalQuantityFilter, Date1, base64Image, Cashie
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<div className="page-footerA4Style11"
|
<div className="page-footerA4Style11"
|
||||||
style={{
|
style={{
|
||||||
marginTop: "auto",
|
marginTop: "auto",
|
||||||
pageBreakBefore: "avoid",
|
pageBreakBefore: "avoid",
|
||||||
pageBreakInside: "avoid",
|
pageBreakInside: "avoid",
|
||||||
minHeight: "auto",
|
minHeight: "auto",
|
||||||
|
...footerColorStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{
|
{
|
||||||
|
|
@ -442,7 +514,7 @@ const PurPrintstyle2 = ({ index, totalQuantityFilter, Date1, base64Image, Cashie
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<>
|
<>
|
||||||
<div className='PrintStyle2-ThirdDivMaster'>
|
<div className='PrintStyle2-ThirdDivMaster' style={{...netAmountStyle}}>
|
||||||
<div className='PrintStyle2-ThirdP'>
|
<div className='PrintStyle2-ThirdP'>
|
||||||
<div>
|
<div>
|
||||||
<div style={{ textAlign: 'left', fontWeight: '600' }}>Qty</div>
|
<div style={{ textAlign: 'left', fontWeight: '600' }}>Qty</div>
|
||||||
|
|
@ -622,6 +694,7 @@ const PurPrintstyle2 = ({ index, totalQuantityFilter, Date1, base64Image, Cashie
|
||||||
pageBreakBefore: "avoid",
|
pageBreakBefore: "avoid",
|
||||||
pageBreakInside: "avoid",
|
pageBreakInside: "avoid",
|
||||||
minHeight: "auto",
|
minHeight: "auto",
|
||||||
|
...footerColorStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{
|
{
|
||||||
|
|
@ -687,7 +760,7 @@ const PurPrintstyle2 = ({ index, totalQuantityFilter, Date1, base64Image, Cashie
|
||||||
|
|
||||||
<div className='PrintStyle2-fistDiv' >
|
<div className='PrintStyle2-fistDiv' >
|
||||||
|
|
||||||
<div style={{ display: 'flex', flexDirection: 'row' }}>
|
<div style={{ display: 'flex', flexDirection: 'row', ...headerStyle }}>
|
||||||
{(base64Image && PrintLogo?.SettingValue === "Y") ? <img className='PrintStyle2-BrandImage' src={GlobaldummyData ? Logo : base64Image} alt='image' /> : null}
|
{(base64Image && PrintLogo?.SettingValue === "Y") ? <img className='PrintStyle2-BrandImage' src={GlobaldummyData ? Logo : base64Image} alt='image' /> : null}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
@ -729,20 +802,31 @@ const PurPrintstyle2 = ({ index, totalQuantityFilter, Date1, base64Image, Cashie
|
||||||
<table className="PrintStyle2-print-table">
|
<table className="PrintStyle2-print-table">
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
{SLNO && <th style={{ width: '8px' }}>S.No</th>}
|
{SLNO && <th style={{ ...tableHeaderStyle, width: '8px' }}>S.No</th>}
|
||||||
{Item && <th >Item</th>}
|
{Item && <th style={{ ...tableHeaderStyle }}>Item</th>}
|
||||||
{HsnCode && <th style={{ width: '8px', textAlign: 'right' }}>HSN</th>}
|
{HsnCode && <th style={{ ...tableHeaderStyle, width: '8px', textAlign: 'right' }}>HSN</th>}
|
||||||
{Quantity && <th style={{ width: '8px', textAlign: 'right' }}>Qty</th>}
|
{Quantity && <th style={{ ...tableHeaderStyle, width: '8px', textAlign: 'right' }}>Qty</th>}
|
||||||
{MRP && <th style={{ width: '8px', textAlign: 'right' }}>MRP</th>}
|
{MRP && <th style={{ ...tableHeaderStyle, width: '8px', textAlign: 'right' }}>MRP</th>}
|
||||||
{Amount && <th style={{ width: '8px', textAlign: 'right' }}>Amt</th>}
|
{Amount && <th style={{ ...tableHeaderStyle, width: '8px', textAlign: 'right' }}>Amt</th>}
|
||||||
{Discount && <th style={{ width: '8px', textAlign: 'right' }}>Dis </th>}
|
{Discount && <th style={{ ...tableHeaderStyle, width: '8px', textAlign: 'right' }}>Dis </th>}
|
||||||
{Rate && <th style={{ width: '8px', textAlign: 'right' }}>Rate</th>}
|
{Rate && <th style={{ ...tableHeaderStyle, width: '8px', textAlign: 'right' }}>Rate</th>}
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
{(TakeawayData)?.map((item, index) => {
|
{(TakeawayData)?.map((item, index) => {
|
||||||
return (
|
return (
|
||||||
<tr key={index} >
|
<tr key={index}
|
||||||
|
style={
|
||||||
|
index % 2 !== 1 && rowtypeStyle === "even"
|
||||||
|
? {
|
||||||
|
...tableBodyStyle
|
||||||
|
}
|
||||||
|
: index % 2 === 1 && rowtypeStyle === "odd"
|
||||||
|
? {
|
||||||
|
...tableBodyStyle
|
||||||
|
}
|
||||||
|
: {}
|
||||||
|
}>
|
||||||
{SLNO && <td className="Re-print-body-Rate">{index + 1}</td>}
|
{SLNO && <td className="Re-print-body-Rate">{index + 1}</td>}
|
||||||
{Item &&
|
{Item &&
|
||||||
<td className="Re-print-body-Product" style={{ display: 'flex', flexDirection: 'column' }}>
|
<td className="Re-print-body-Product" style={{ display: 'flex', flexDirection: 'column' }}>
|
||||||
|
|
@ -776,7 +860,7 @@ const PurPrintstyle2 = ({ index, totalQuantityFilter, Date1, base64Image, Cashie
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
<div className='PrintStyle2-ThirdDivMaster'>
|
<div className='PrintStyle2-ThirdDivMaster' style={{...netAmountStyle}}>
|
||||||
<div className='PrintStyle2-ThirdP'>
|
<div className='PrintStyle2-ThirdP'>
|
||||||
<div>
|
<div>
|
||||||
<div style={{ textAlign: 'left', fontWeight: '600' }}>Qty</div>
|
<div style={{ textAlign: 'left', fontWeight: '600' }}>Qty</div>
|
||||||
|
|
@ -928,6 +1012,7 @@ const PurPrintstyle2 = ({ index, totalQuantityFilter, Date1, base64Image, Cashie
|
||||||
pageBreakBefore: "avoid",
|
pageBreakBefore: "avoid",
|
||||||
pageBreakInside: "avoid",
|
pageBreakInside: "avoid",
|
||||||
minHeight: "auto",
|
minHeight: "auto",
|
||||||
|
...footerColorStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{
|
{
|
||||||
|
|
|
||||||
|
|
@ -8,6 +8,17 @@ import {
|
||||||
Globalnotes,
|
Globalnotes,
|
||||||
GlobalthemeFormat,
|
GlobalthemeFormat,
|
||||||
GlobalBillName,
|
GlobalBillName,
|
||||||
|
GlobalSelectedPrintHeaderColor,
|
||||||
|
GlobalSelectedPrintHeaderFontColor,
|
||||||
|
GlobalSelectedTableHeaderColor,
|
||||||
|
GlobalSelectedTableHeaderFontColor,
|
||||||
|
GlobalSelectedTableBodyColor,
|
||||||
|
GlobalSelectedTableBodyFontColor,
|
||||||
|
GlobalRowType,
|
||||||
|
GlobalSelectedFooterColor,
|
||||||
|
GlobalSelectedFooterFontColor,
|
||||||
|
GlobalSelectedNetAmountColor,
|
||||||
|
GlobalSelectedNetAmountFontColor,
|
||||||
} from "../../../Features/ThemeChange/ThemeChange";
|
} from "../../../Features/ThemeChange/ThemeChange";
|
||||||
import "../../../Styles/BookingScreen/PrintTemplates/ThermalPrinter/PrintStyle3.scss"
|
import "../../../Styles/BookingScreen/PrintTemplates/ThermalPrinter/PrintStyle3.scss"
|
||||||
import { extractLastNumber } from "../../../Services/Others";
|
import { extractLastNumber } from "../../../Services/Others";
|
||||||
|
|
@ -37,6 +48,17 @@ const PurPrintStyle3 = ({ index, totalQuantityFilter, Date1, CashierName, totalQ
|
||||||
|
|
||||||
const GlobaldummyData = useSelector(GlobalPritdummyData);
|
const GlobaldummyData = useSelector(GlobalPritdummyData);
|
||||||
const GlobaltermsAndConditions = useSelector(GlobalprinttermsAndConditions);
|
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 TermsAndConditions = printDatas?.TermsandConditions
|
||||||
|
|
@ -47,7 +69,12 @@ const PurPrintStyle3 = ({ index, totalQuantityFilter, Date1, CashierName, totalQ
|
||||||
let PageSize = printDatas?.PageSize
|
let PageSize = printDatas?.PageSize
|
||||||
const Signature = FieldDetails?.["signature"];
|
const Signature = FieldDetails?.["signature"];
|
||||||
const TermsnAdCondition = FieldDetails?.["terms&conditions"];
|
const TermsnAdCondition = FieldDetails?.["terms&conditions"];
|
||||||
|
let printColors = printDatas?.PrintColors;
|
||||||
|
const headerColor = printColors?.find(obj => obj.headerColor)?.headerColor;
|
||||||
|
const tableHeaderColor = printColors?.find(obj => obj.tableHeaderColor)?.tableHeaderColor;
|
||||||
|
const tableBodyColor = printColors?.find(obj => obj.tableBodyColor)?.tableBodyColor;
|
||||||
|
const footerColor = printColors?.find(obj => obj.footerColor)?.footerColor;
|
||||||
|
const netAmtColor = printColors?.find(obj => obj.netAmtColor)?.netAmtColor;
|
||||||
|
|
||||||
const keysLength = Object.keys(table2Data ?? {}).length;
|
const keysLength = Object.keys(table2Data ?? {}).length;
|
||||||
if (keysLength > 0) {
|
if (keysLength > 0) {
|
||||||
|
|
@ -60,28 +87,10 @@ const PurPrintStyle3 = ({ index, totalQuantityFilter, Date1, CashierName, totalQ
|
||||||
const year = currentDate.getFullYear().toString().slice(-2);
|
const year = currentDate.getFullYear().toString().slice(-2);
|
||||||
|
|
||||||
const formattedDate = `${day}-${monthNames[monthIndex]}-${year}`;
|
const formattedDate = `${day}-${monthNames[monthIndex]}-${year}`;
|
||||||
|
|
||||||
const TakeawayData = table2Data?.[0]?.ProductDetails
|
const TakeawayData = table2Data?.[0]?.ProductDetails
|
||||||
console.log(TakeawayData, "TakeawayData", table2Data)
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
let TotalOfferAmount = 0;
|
let TotalOfferAmount = 0;
|
||||||
|
|
||||||
// Calculate SalesWiseOffers total amount
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
const chunkSize = PageSize == "A5" ? 11 : 16;
|
const chunkSize = PageSize == "A5" ? 11 : 16;
|
||||||
|
|
||||||
let dataSource = table2Data?.[0]?.ProductDetails;
|
let dataSource = table2Data?.[0]?.ProductDetails;
|
||||||
|
|
||||||
console.log(table2Data,"FieldDetailsFieldDetails")
|
|
||||||
|
|
||||||
|
|
||||||
// Paginate the data
|
// Paginate the data
|
||||||
const paginatedChunks = [];
|
const paginatedChunks = [];
|
||||||
for (let i = 0; i < dataSource?.length; i += chunkSize) {
|
for (let i = 0; i < dataSource?.length; i += chunkSize) {
|
||||||
|
|
@ -89,9 +98,52 @@ const PurPrintStyle3 = ({ index, totalQuantityFilter, Date1, CashierName, totalQ
|
||||||
}
|
}
|
||||||
const lastChunkRows = paginatedChunks.length > 0 ? paginatedChunks[paginatedChunks.length - 1].length : 0;
|
const lastChunkRows = paginatedChunks.length > 0 ? paginatedChunks[paginatedChunks.length - 1].length : 0;
|
||||||
const shouldFooterBeOnNewPage = lastChunkRows > (PageSize == "A5" ? 5 : 10);
|
const shouldFooterBeOnNewPage = lastChunkRows > (PageSize == "A5" ? 5 : 10);
|
||||||
{console.log(TakeawayData,"TakeawayDataTakeawayData")}
|
|
||||||
|
|
||||||
|
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 (
|
return (
|
||||||
<>
|
<>
|
||||||
{FormatTheme ?
|
{FormatTheme ?
|
||||||
|
|
@ -101,91 +153,149 @@ const PurPrintStyle3 = ({ index, totalQuantityFilter, Date1, CashierName, totalQ
|
||||||
|
|
||||||
{/* <div className="header" style={{ position: "fixed", top: 0, width: "100%" }}> */}
|
{/* <div className="header" style={{ position: "fixed", top: 0, width: "100%" }}> */}
|
||||||
<div className="header" style={{ position: isMobile ? GlobaldummyData ? "absolute" : "fixed" : "", top: 0, width: "100%" }}>
|
<div className="header" style={{ position: isMobile ? GlobaldummyData ? "absolute" : "fixed" : "", top: 0, width: "100%" }}>
|
||||||
<div className="PrintStyle3-print" >
|
<div className="PrintStyle3-print" style={{ ...headerStyle }} >
|
||||||
<div style={{ fontSize: '30px', fontweight: '900' }}>
|
<div style={{ fontSize: '30px', fontweight: '900' }}>
|
||||||
{ table2Data?.[0]?.BrName}
|
{table2Data?.[0]?.BrName}
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<div style={{ fontweight: '600' }}> {GlobaldummyData ?
|
<div style={{ fontweight: '600' }}> {GlobaldummyData ?
|
||||||
'BranchAddress, Town- 635XXX City - State' :
|
'BranchAddress, Town- 635XXX City - State' :
|
||||||
(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 : '')}
|
(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 : '')}
|
||||||
|
|
||||||
{table2Data?.[0]?.BrGSTIN && <div>GST NO :{ table2Data?.[0]?.BrGSTIN}, CIN :u00045hhsgbubufsdug</div>}
|
{table2Data?.[0]?.BrGSTIN && <div>GST NO :{table2Data?.[0]?.BrGSTIN}, CIN :u00045hhsgbubufsdug</div>}
|
||||||
<div style={{ fontWeight: '600' }}> Mobile : +91 { table2Data?.[0]?.BrMobile}</div>
|
<div style={{ fontWeight: '600' }}> Mobile : +91 {table2Data?.[0]?.BrMobile}</div>
|
||||||
{ <div style={{ fontSize: "14px", margin: "2px 0 0 0", padding: 0, fontWeight: 600 }}>{BillName} </div>}
|
{<div style={{ fontSize: "14px", margin: "2px 0 0 0", padding: 0, fontWeight: 600 }}>{BillName} </div>}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<hr className="PrintStyle3-print-dottline" />
|
<hr className="PrintStyle3-print-dottline" />
|
||||||
<div className="PrintStyle3-print-ordr-dtls">
|
<div className="PrintStyle3-print-ordr-dtls">
|
||||||
<div style={{ lineheight: '50px' }}>
|
<div style={{ lineheight: '50px' }}>
|
||||||
<div style={{ fontSize: '14px', fontWeight: 600 }} > BILL NO :
|
<div style={{ fontSize: '14px', fontWeight: 600 }} > BILL NO :
|
||||||
{
|
{
|
||||||
table2Data?.[0]?.QuotationNo && extractLastNumber(table2Data?.[0]?.QuotationNo)
|
table2Data?.[0]?.QuotationNo && extractLastNumber(table2Data?.[0]?.QuotationNo)
|
||||||
|
|
||||||
} </div>
|
} </div>
|
||||||
<div style={{ fontSize: '14px', fontWeight: 600 }} > { Date1}</div>
|
<div style={{ fontSize: '14px', fontWeight: 600 }} > {Date1}</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<hr className="PrintStyle3-print-dottline" />
|
<hr className="PrintStyle3-print-dottline" />
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="print-body" style={{ marginTop: "0rem" }}>
|
<div className="print-body" style={{ marginTop: "0rem" }}>
|
||||||
<div className="PrintStyle3-print-tableMaster">
|
<div className="PrintStyle3-print-tableMaster">
|
||||||
{(TakeawayData?.length > 0 ) &&
|
{(TakeawayData?.length > 0) &&
|
||||||
<div style={{ width: '95%' }} className="PrintStyle3-print-table">
|
<div style={{ width: '95%' }} className="PrintStyle3-print-table">
|
||||||
<div style={{ display: 'flex', justifyContent: 'space-between', width: '100%', fontweight: '600', gap: '0.2rem' }}>
|
<div style={{ ...tableHeaderStyle, display: 'flex', justifyContent: 'space-between', width: '100%', fontweight: '600', gap: '0.2rem' }}>
|
||||||
{ SLNO && <div style={{ width: '100%', textAlign: 'center', fontWeight: 600 }}>S.No</div>}
|
{SLNO && <div style={{ width: '100%', textAlign: 'center', fontWeight: 600 }}>S.No</div>}
|
||||||
{ Item && <div style={{ width: '300%', textAlign: 'left', fontWeight: 600 }}>ITEM</div>}
|
{Item && <div style={{ width: '300%', textAlign: 'left', fontWeight: 600 }}>ITEM</div>}
|
||||||
{ HsnCode && <div style={{ width: '100%', textAlign: 'right', fontWeight: 600 }}>HSN</div>}
|
{HsnCode && <div style={{ width: '100%', textAlign: 'right', fontWeight: 600 }}>HSN</div>}
|
||||||
{ MRP && <div style={{ width: '100%', textAlign: 'right', fontWeight: 600 }}>MRP</div>}
|
{MRP && <div style={{ width: '100%', textAlign: 'right', fontWeight: 600 }}>MRP</div>}
|
||||||
{ Quantity && <div style={{ width: '100%', textAlign: 'right', fontWeight: 600 }}>QTY</div>}
|
{Quantity && <div style={{ width: '100%', textAlign: 'right', fontWeight: 600 }}>QTY</div>}
|
||||||
{ Rate && <div style={{ width: '100%', textAlign: 'right', fontWeight: 600 }}>RATE</div>}
|
{Rate && <div style={{ width: '100%', textAlign: 'right', fontWeight: 600 }}>RATE</div>}
|
||||||
{ Discount && <div style={{ width: '100%', textAlign: 'right', fontWeight: 600 }}>DIS </div>}
|
{Discount && <div style={{ width: '100%', textAlign: 'right', fontWeight: 600 }}>DIS </div>}
|
||||||
{ Amount && <div style={{ width: '100%', textAlign: 'right', fontWeight: 600 }}>AMT</div>}
|
{Amount && <div style={{ width: '100%', textAlign: 'right', fontWeight: 600 }}>AMT</div>}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div style={{ marginTop: '5px' }}>
|
<div style={{ marginTop: '5px' }}>
|
||||||
{dataChunk?.map((item, index) => (
|
{dataChunk?.map((item, index) => {
|
||||||
<div style={{ display: 'flex', justifyContent: 'space-between', width: '100%', gap: '0.2rem' }}>
|
const isMatch =
|
||||||
{ SLNO && <div style={{ width: '100%', textAlign: 'center', fontWeight: 600 }}>{chunkIndex * chunkSize + index + 1}</div>}
|
(index % 2 === 0 && rowtypeStyle === "even") ||
|
||||||
{ Item &&
|
(index % 2 === 1 && rowtypeStyle === "odd");
|
||||||
<div style={{ display: 'flex', flexDirection: 'column', width: '300%', textAlign: 'left', fontWeight: 600 }}>
|
|
||||||
<div>{item?.ProdName}</div>
|
return (
|
||||||
<div>({item?.Size ? item?.Size : "1"} {item?.SinglePc == 'Y' ? 'PCS' : item?.Type != "C" ? item?.UomName : "COMBO"})
|
<div
|
||||||
{item?.BrandName !== null ? item?.BrandName : ""}
|
style={{
|
||||||
{item?.ProductIdentifierDtls?.length > 0 ? (item?.ProductIdentifierDtls?.filter((items) => !(items.SerialNumber == "" || items.SerialNumber == null))
|
display: "flex",
|
||||||
?.map(a => { return (<div>{a.SerialNumber}</div>) })) : ""} {item?.ProductIdentifierDtls?.length > 0 ? item?.ProductIdentifierDtls.filter((item1) => item1.IMEI1 !== "" || item1.IMEI2 !== "")
|
justifyContent: "space-between",
|
||||||
?.map(item2 => {
|
width: "100%",
|
||||||
const imei1 = item2.IMEI1 || "";
|
gap: "0.2rem",
|
||||||
const imei2 = item2.IMEI2 || "";
|
...(isMatch ? tableBodyStyle : {}),
|
||||||
return (<div>{[imei1, imei2].filter(Boolean).join(",")}</div>);
|
}}
|
||||||
}
|
>
|
||||||
) : ""}
|
{SLNO && (
|
||||||
|
<div style={{ width: "100%", textAlign: "center", fontWeight: 600 }}>
|
||||||
|
{chunkIndex * chunkSize + index + 1}
|
||||||
</div>
|
</div>
|
||||||
</div>}
|
)}
|
||||||
{ HsnCode && <div style={{ width: '100%', textAlign: 'right', fontWeight: 600 }}>{item?.HSN}</div>}
|
|
||||||
{ MRP && <div style={{ width: '100%', textAlign: 'right', fontWeight: 600 }}>{item?.SinglePc === 'Y' ? item?.Price : item?.MRP}</div>}
|
{Item && (
|
||||||
{ Quantity && <div style={{ width: '100%', textAlign: 'right', fontWeight: 600 }}>{item?.Qty}</div>}
|
<div
|
||||||
{ Rate && <div style={{ width: '100%', textAlign: 'right', fontWeight: 600 }}>{item?.Price}</div>}
|
style={{
|
||||||
{ Discount && <div style={{ width: '100%', textAlign: 'right', fontWeight: 600 }}>{item?.Type != "C" ? item?.OfferAmt || 0 : item?.OfferValue || 0}</div>}
|
display: "flex",
|
||||||
{ Amount && <div style={{ width: '100%', textAlign: 'right', fontWeight: 600 }} > {item?.NetAmt?.toFixed(2)}</div>}
|
flexDirection: "column",
|
||||||
</div>
|
width: "300%",
|
||||||
))}
|
textAlign: "left",
|
||||||
|
fontWeight: 600,
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<div>{item?.ProdName}</div>
|
||||||
|
<div>
|
||||||
|
({item?.Size ? item?.Size : "1"}{" "}
|
||||||
|
{item?.SinglePc === "Y"
|
||||||
|
? "PCS"
|
||||||
|
: item?.Type !== "C"
|
||||||
|
? item?.UomName
|
||||||
|
: "COMBO"})
|
||||||
|
{item?.BrandName ?? ""}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{HsnCode && (
|
||||||
|
<div style={{ width: "100%", textAlign: "right", fontWeight: 600 }}>
|
||||||
|
{item?.HSN}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{MRP && (
|
||||||
|
<div style={{ width: "100%", textAlign: "right", fontWeight: 600 }}>
|
||||||
|
{item?.SinglePc === "Y" ? item?.Price : item?.MRP}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{Quantity && (
|
||||||
|
<div style={{ width: "100%", textAlign: "right", fontWeight: 600 }}>
|
||||||
|
{item?.Qty}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{Rate && (
|
||||||
|
<div style={{ width: "100%", textAlign: "right", fontWeight: 600 }}>
|
||||||
|
{item?.Price}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{Discount && (
|
||||||
|
<div style={{ width: "100%", textAlign: "right", fontWeight: 600 }}>
|
||||||
|
{item?.Type !== "C"
|
||||||
|
? item?.OfferAmt || 0
|
||||||
|
: item?.OfferValue || 0}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{Amount && (
|
||||||
|
<div style={{ width: "100%", textAlign: "right", fontWeight: 600 }}>
|
||||||
|
{item?.NetAmt?.toFixed(2)}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
})}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
}
|
}
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{((chunkIndex === paginatedChunks.length - 1) && (!shouldFooterBeOnNewPage)) && FormatTheme &&
|
{((chunkIndex === paginatedChunks.length - 1) && (!shouldFooterBeOnNewPage)) && FormatTheme &&
|
||||||
|
|
||||||
<>
|
<>
|
||||||
<div className="PrintStyle3-print-ttlovrl">
|
<div className="PrintStyle3-print-ttlovrl" style={{...netAmountStyle}}>
|
||||||
<div>
|
<div>
|
||||||
<div style={{ fontWeight: '600' }}> Items : </div>
|
<div style={{ fontWeight: '600' }}> Items : </div>
|
||||||
<div style={{ fontWeight: '600' }}> Qty : </div>
|
<div style={{ fontWeight: '600' }}> Qty : </div>
|
||||||
|
|
@ -319,24 +429,15 @@ const PurPrintStyle3 = ({ index, totalQuantityFilter, Date1, CashierName, totalQ
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<hr className="PrintStyle3-print-dottline" />
|
<hr className="PrintStyle3-print-dottline" />
|
||||||
|
|
||||||
|
|
||||||
<div className="PrintStyle3-print-stradrs" style={{ display: 'flex', justifyContent: 'space-between' }}>
|
<div className="PrintStyle3-print-stradrs" style={{ display: 'flex', justifyContent: 'space-between' }}>
|
||||||
|
|
||||||
<div style={{ display: 'flex', flexDirection: 'column', justifyContent: 'center', width: "100%" }}>
|
<div style={{ display: 'flex', flexDirection: 'column', justifyContent: 'center', width: "100%" }}>
|
||||||
|
|
||||||
{table2Data?.CustSuppName && table2Data?.CustSuppName !== undefined && table2Data?.CustSuppName !== null && !GlobaldummyData &&
|
{table2Data?.CustSuppName && table2Data?.CustSuppName !== undefined && table2Data?.CustSuppName !== null && !GlobaldummyData &&
|
||||||
<div style={{ fontSize: "14px", fontWeight: 600 }}>Customer : {table2Data?.CustSuppName}
|
<div style={{ fontSize: "14px", fontWeight: 600 }}>Customer : {table2Data?.CustSuppName}
|
||||||
</div>
|
</div>
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
{/* <br/> */}
|
{/* <br/> */}
|
||||||
|
|
||||||
<hr className="PrintStyle3-print-dottline" />
|
<hr className="PrintStyle3-print-dottline" />
|
||||||
|
|
||||||
<div className="page-footerA4Style11"
|
<div className="page-footerA4Style11"
|
||||||
|
|
@ -345,6 +446,7 @@ const PurPrintStyle3 = ({ index, totalQuantityFilter, Date1, CashierName, totalQ
|
||||||
pageBreakBefore: "avoid",
|
pageBreakBefore: "avoid",
|
||||||
pageBreakInside: "avoid",
|
pageBreakInside: "avoid",
|
||||||
minHeight: "auto",
|
minHeight: "auto",
|
||||||
|
...footerColorStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{
|
{
|
||||||
|
|
@ -356,7 +458,7 @@ const PurPrintStyle3 = ({ index, totalQuantityFilter, Date1, CashierName, totalQ
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
<div style={{ display: "flex", width: "90%", padding: "0 1rem", justifyContent: "flex-end", alignItems: "center" }}>
|
<div style={{ display: "flex", width: "90%", padding: "0 1rem", justifyContent: "flex-end", alignItems: "center" }}>
|
||||||
{
|
{
|
||||||
(TermsnAdCondition == true && TermsAndConditions?.length > 0) && (<div style={{ margin: "8px 0", fontFamily: "sans-serif", width: "100%", display: "flex", flexDirection: "column", alignItems: "flex-start" }}>
|
(TermsnAdCondition == true && TermsAndConditions?.length > 0) && (<div style={{ margin: "8px 0", fontFamily: "sans-serif", width: "100%", display: "flex", flexDirection: "column", alignItems: "flex-start" }}>
|
||||||
<p style={{ fontSize: "13px", fontWeight: "bold", marginBottom: "6px" }}>
|
<p style={{ fontSize: "13px", fontWeight: "bold", marginBottom: "6px" }}>
|
||||||
|
|
@ -369,7 +471,7 @@ const PurPrintStyle3 = ({ index, totalQuantityFilter, Date1, CashierName, totalQ
|
||||||
</div>)
|
</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>
|
<p style={{ fontSize: "13px", fontWeight: "bold", marginBottom: "6px" }}>Signature</p>
|
||||||
<img style={{ width: "100px", height: "60px" }} src={SignatureImg} alt="" />
|
<img style={{ width: "100px", height: "60px" }} src={SignatureImg} alt="" />
|
||||||
</div>)}
|
</div>)}
|
||||||
|
|
@ -378,7 +480,7 @@ const PurPrintStyle3 = ({ index, totalQuantityFilter, Date1, CashierName, totalQ
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</>
|
</>
|
||||||
}
|
}
|
||||||
|
|
@ -405,7 +507,7 @@ const PurPrintStyle3 = ({ index, totalQuantityFilter, Date1, CashierName, totalQ
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<>
|
<>
|
||||||
<div className="PrintStyle3-print-ttlovrl">
|
<div className="PrintStyle3-print-ttlovrl" style={{...netAmountStyle}}>
|
||||||
<div>
|
<div>
|
||||||
<div style={{ fontWeight: '600' }}> Items : </div>
|
<div style={{ fontWeight: '600' }}> Items : </div>
|
||||||
<div style={{ fontWeight: '600' }}> Qty : </div>
|
<div style={{ fontWeight: '600' }}> Qty : </div>
|
||||||
|
|
@ -413,10 +515,10 @@ const PurPrintStyle3 = ({ index, totalQuantityFilter, Date1, CashierName, totalQ
|
||||||
<div style={{ fontWeight: '600' }}> Amount : </div>
|
<div style={{ fontWeight: '600' }}> Amount : </div>
|
||||||
</div>
|
</div>
|
||||||
<div className="PrintStyle3-print-prdttl-amt">
|
<div className="PrintStyle3-print-prdttl-amt">
|
||||||
<div style={{ marginRight: '0.5rem', fontWeight: '600' }}>{ totalQuantityFilter?.length} </div>
|
<div style={{ marginRight: '0.5rem', fontWeight: '600' }}>{totalQuantityFilter?.length} </div>
|
||||||
<div style={{ marginRight: '0.5rem', fontWeight: '600' }}>{ totalQuantity} </div>
|
<div style={{ marginRight: '0.5rem', fontWeight: '600' }}>{totalQuantity} </div>
|
||||||
{(table2Data?.OverallDisc > 0 || TotalOfferAmount > 0) && <div style={{ marginRight: '0.5rem', fontWeight: '600' }}>{ Number(TotalOfferAmount + table2Data?.OverallDisc).toFixed(2)} </div>}
|
{(table2Data?.OverallDisc > 0 || TotalOfferAmount > 0) && <div style={{ marginRight: '0.5rem', fontWeight: '600' }}>{Number(TotalOfferAmount + table2Data?.OverallDisc).toFixed(2)} </div>}
|
||||||
<div style={{ fontWeight: '600', marginRight: '0.5rem' }}> { Number(table2Data?.[0]?.NetAmount).toFixed(2)} </div>
|
<div style={{ fontWeight: '600', marginRight: '0.5rem' }}> {Number(table2Data?.[0]?.NetAmount).toFixed(2)} </div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
@ -543,27 +645,27 @@ const PurPrintStyle3 = ({ index, totalQuantityFilter, Date1, CashierName, totalQ
|
||||||
{/* <br/> */}
|
{/* <br/> */}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<div className="PrintStyle3-print-stradrs" style={{ display: 'flex', justifyContent: 'space-between' }}>
|
<div className="PrintStyle3-print-stradrs" style={{ display: 'flex', justifyContent: 'space-between' }}>
|
||||||
|
|
||||||
<div style={{ display: 'flex', flexDirection: 'column', justifyContent: 'center', width: "100%" }}>
|
<div style={{ display: 'flex', flexDirection: 'column', justifyContent: 'center', width: "100%" }}>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
{table2Data?.CustSuppName && table2Data?.CustSuppName !== undefined && table2Data?.CustSuppName !== null && !GlobaldummyData &&
|
{table2Data?.CustSuppName && table2Data?.CustSuppName !== undefined && table2Data?.CustSuppName !== null && !GlobaldummyData &&
|
||||||
<div style={{ fontSize: "14px", fontWeight: 600 }}>Customer : {table2Data?.CustSuppName}
|
<div style={{ fontSize: "14px", fontWeight: 600 }}>Customer : {table2Data?.CustSuppName}
|
||||||
</div>
|
</div>
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
{/* <br/> */}
|
{/* <br/> */}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<div className="page-footerA4Style11"
|
<div className="page-footerA4Style11"
|
||||||
style={{
|
style={{
|
||||||
|
|
@ -571,6 +673,7 @@ const PurPrintStyle3 = ({ index, totalQuantityFilter, Date1, CashierName, totalQ
|
||||||
pageBreakBefore: "avoid",
|
pageBreakBefore: "avoid",
|
||||||
pageBreakInside: "avoid",
|
pageBreakInside: "avoid",
|
||||||
minHeight: "auto",
|
minHeight: "auto",
|
||||||
|
...footerColorStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{
|
{
|
||||||
|
|
@ -595,7 +698,7 @@ const PurPrintStyle3 = ({ index, totalQuantityFilter, Date1, CashierName, totalQ
|
||||||
</div>)
|
</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>
|
<p style={{ fontSize: "13px", fontWeight: "bold", marginBottom: "6px" }}>Signature</p>
|
||||||
<img style={{ width: "100px", height: "60px" }} src={SignatureImg} alt="" />
|
<img style={{ width: "100px", height: "60px" }} src={SignatureImg} alt="" />
|
||||||
</div>)}
|
</div>)}
|
||||||
|
|
@ -604,7 +707,7 @@ const PurPrintStyle3 = ({ index, totalQuantityFilter, Date1, CashierName, totalQ
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</>
|
</>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -614,79 +717,137 @@ const PurPrintStyle3 = ({ index, totalQuantityFilter, Date1, CashierName, totalQ
|
||||||
:
|
:
|
||||||
<div className="PrintStyle3MasterDiv" id={`SQPrintStyle3`} style={{ fontFamily: "'Courier New', Courier, monospace" }}>
|
<div className="PrintStyle3MasterDiv" id={`SQPrintStyle3`} style={{ fontFamily: "'Courier New', Courier, monospace" }}>
|
||||||
|
|
||||||
<div className="PrintStyle3-print" >
|
<div className="PrintStyle3-print" style={{ ...headerStyle }}>
|
||||||
<div style={{ fontSize: '30px', fontweight: '900' }}>{table2Data?.[0]?.BrName}</div>
|
<div style={{ fontSize: '30px', fontweight: '900' }}>{table2Data?.[0]?.BrName}</div>
|
||||||
<div style={{ fontweight: '600' }}> {
|
<div style={{ 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 : '')}
|
(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 : '')}
|
||||||
|
|
||||||
{table2Data?.[0]?.BrGSTIN && <div>GST NO :{ table2Data?.[0]?.BrGSTIN}, CIN :u00045hhsgbubufsdug</div>}
|
{table2Data?.[0]?.BrGSTIN && <div>GST NO :{table2Data?.[0]?.BrGSTIN}, CIN :u00045hhsgbubufsdug</div>}
|
||||||
<div style={{ fontWeight: '600' }}> Mobile : +91 { table2Data?.[0]?.BrMobile}</div>
|
<div style={{ fontWeight: '600' }}> Mobile : +91 {table2Data?.[0]?.BrMobile}</div>
|
||||||
{ <div style={{ fontSize: "14px", margin: "2px 0 0 0", padding: 0, fontWeight: 600 }}>{BillName}</div>}
|
{<div style={{ fontSize: "14px", margin: "2px 0 0 0", padding: 0, fontWeight: 600 }}>{BillName}</div>}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<hr className="PrintStyle3-print-dottline" />
|
<hr className="PrintStyle3-print-dottline" />
|
||||||
<div className="PrintStyle3-print-ordr-dtls">
|
<div className="PrintStyle3-print-ordr-dtls">
|
||||||
<div style={{ lineheight: '50px' }}>
|
<div style={{ lineheight: '50px' }}>
|
||||||
<div style={{ fontSize: '14px', fontWeight: 600 }} > BILL NO :
|
<div style={{ fontSize: '14px', fontWeight: 600 }} > BILL NO :
|
||||||
{
|
{
|
||||||
table2Data?.[0]?.QuotationNo && extractLastNumber(table2Data?.[0]?.QuotationNo)
|
table2Data?.[0]?.QuotationNo && extractLastNumber(table2Data?.[0]?.QuotationNo)
|
||||||
|
|
||||||
}
|
}
|
||||||
</div>
|
</div>
|
||||||
<div style={{ fontSize: '14px', fontWeight: 600 }} > { Date1}</div>
|
<div style={{ fontSize: '14px', fontWeight: 600 }} > {Date1}</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<hr className="PrintStyle3-print-dottline" />
|
<hr className="PrintStyle3-print-dottline" />
|
||||||
<div className="PrintStyle3-print-tableMaster">
|
<div className="PrintStyle3-print-tableMaster">
|
||||||
{(TakeawayData?.length > 0) &&
|
{(TakeawayData?.length > 0) &&
|
||||||
<div style={{ width: '95%' }} className="PrintStyle3-print-table">
|
<div style={{ width: '95%' }} className="PrintStyle3-print-table">
|
||||||
<div style={{ display: 'flex', justifyContent: 'space-between', width: '100%', fontweight: '600', gap: '0.2rem' }}>
|
<div style={{ ...tableHeaderStyle, display: 'flex', justifyContent: 'space-between', width: '100%', fontweight: '600', gap: '0.2rem' }}>
|
||||||
{ SLNO && <div style={{ width: '100%', textAlign: 'center', fontWeight: 600 }}>S.No</div>}
|
{SLNO && <div style={{ width: '100%', textAlign: 'center', fontWeight: 600 }}>S.No</div>}
|
||||||
{ Item && <div style={{ width: '300%', textAlign: 'left', fontWeight: 600 }}>ITEM</div>}
|
{Item && <div style={{ width: '300%', textAlign: 'left', fontWeight: 600 }}>ITEM</div>}
|
||||||
{ HsnCode && <div style={{ width: '100%', textAlign: 'right', fontWeight: 600 }}>HSN</div>}
|
{HsnCode && <div style={{ width: '100%', textAlign: 'right', fontWeight: 600 }}>HSN</div>}
|
||||||
{ MRP && <div style={{ width: '100%', textAlign: 'right', fontWeight: 600 }}>MRP</div>}
|
{MRP && <div style={{ width: '100%', textAlign: 'right', fontWeight: 600 }}>MRP</div>}
|
||||||
{ Quantity && <div style={{ width: '100%', textAlign: 'right', fontWeight: 600 }}>QTY</div>}
|
{Quantity && <div style={{ width: '100%', textAlign: 'right', fontWeight: 600 }}>QTY</div>}
|
||||||
{ Rate && <div style={{ width: '100%', textAlign: 'right', fontWeight: 600 }}>RATE</div>}
|
{Rate && <div style={{ width: '100%', textAlign: 'right', fontWeight: 600 }}>RATE</div>}
|
||||||
{ Discount && <div style={{ width: '100%', textAlign: 'right', fontWeight: 600 }}>DIS </div>}
|
{Discount && <div style={{ width: '100%', textAlign: 'right', fontWeight: 600 }}>DIS </div>}
|
||||||
{ Amount && <div style={{ width: '100%', textAlign: 'right', fontWeight: 600 }}>AMT</div>}
|
{Amount && <div style={{ width: '100%', textAlign: 'right', fontWeight: 600 }}>AMT</div>}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div style={{ marginTop: '5px' }}>
|
<div style={{ marginTop: '5px' }}>
|
||||||
{( TakeawayData)?.map((item, index) => (
|
{dataChunk?.map((item, index) => {
|
||||||
<div style={{ display: 'flex', justifyContent: 'space-between', width: '100%', gap: '0.2rem' }}>
|
const isMatch =
|
||||||
{ SLNO && <div style={{ width: '100%', textAlign: 'center', fontWeight: 600 }}>{index + 1}</div>}
|
(index % 2 === 0 && rowtypeStyle === "even") ||
|
||||||
{ Item &&
|
(index % 2 === 1 && rowtypeStyle === "odd");
|
||||||
<div style={{ display: 'flex', flexDirection: 'column', width: '300%', textAlign: 'left', fontWeight: 600 }}>
|
|
||||||
<div>{item?.ProdName}</div>
|
return (
|
||||||
<div>({item?.Size ? item?.Size : "1"} {item?.SinglePc == 'Y' ? 'PCS' : item?.Type != "C" ? item?.UomName : "COMBO"})
|
<div
|
||||||
{item?.BrandName !== null ? item?.BrandName : ""}
|
style={{
|
||||||
{item?.ProductIdentifierDtls?.length > 0 ? (item?.ProductIdentifierDtls?.filter((items) => !(items.SerialNumber == "" || items.SerialNumber == null))
|
display: "flex",
|
||||||
?.map(a => { return (<div>{a.SerialNumber}</div>) })) : ""} {item?.ProductIdentifierDtls?.length > 0 ? item?.ProductIdentifierDtls.filter((item1) => item1.IMEI1 !== "" || item1.IMEI2 !== "")
|
justifyContent: "space-between",
|
||||||
?.map(item2 => {
|
width: "100%",
|
||||||
const imei1 = item2.IMEI1 || "";
|
gap: "0.2rem",
|
||||||
const imei2 = item2.IMEI2 || "";
|
...(isMatch ? tableBodyStyle : {}),
|
||||||
return (<div>{[imei1, imei2].filter(Boolean).join(",")}</div>);
|
}}
|
||||||
}
|
>
|
||||||
) : ""}
|
{SLNO && (
|
||||||
|
<div style={{ width: "100%", textAlign: "center", fontWeight: 600 }}>
|
||||||
|
{chunkIndex * chunkSize + index + 1}
|
||||||
</div>
|
</div>
|
||||||
</div>}
|
)}
|
||||||
{ HsnCode && <div style={{ width: '100%', textAlign: 'right', fontWeight: 600 }}>{item?.HSN}</div>}
|
|
||||||
{ MRP && <div style={{ width: '100%', textAlign: 'right', fontWeight: 600 }}>{item?.SinglePc === 'Y' ? item?.Price : item?.MRP}</div>}
|
{Item && (
|
||||||
{ Quantity && <div style={{ width: '100%', textAlign: 'right', fontWeight: 600 }}>{item?.Qty}</div>}
|
<div
|
||||||
{ Rate && <div style={{ width: '100%', textAlign: 'right', fontWeight: 600 }}>{item?.Price}</div>}
|
style={{
|
||||||
{ Discount && <div style={{ width: '100%', textAlign: 'right', fontWeight: 600 }}>{item?.Type != "C" ? item?.OfferAmt || 0 : item?.OfferValue || 0}</div>}
|
display: "flex",
|
||||||
{ Amount && <div style={{ width: '100%', textAlign: 'right', fontWeight: 600 }} > {item?.NetAmt?.toFixed(2)}</div>}
|
flexDirection: "column",
|
||||||
</div>
|
width: "300%",
|
||||||
))}
|
textAlign: "left",
|
||||||
|
fontWeight: 600,
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<div>{item?.ProdName}</div>
|
||||||
|
<div>
|
||||||
|
({item?.Size ? item?.Size : "1"}{" "}
|
||||||
|
{item?.SinglePc === "Y"
|
||||||
|
? "PCS"
|
||||||
|
: item?.Type !== "C"
|
||||||
|
? item?.UomName
|
||||||
|
: "COMBO"})
|
||||||
|
{item?.BrandName ?? ""}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{HsnCode && (
|
||||||
|
<div style={{ width: "100%", textAlign: "right", fontWeight: 600 }}>
|
||||||
|
{item?.HSN}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{MRP && (
|
||||||
|
<div style={{ width: "100%", textAlign: "right", fontWeight: 600 }}>
|
||||||
|
{item?.SinglePc === "Y" ? item?.Price : item?.MRP}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{Quantity && (
|
||||||
|
<div style={{ width: "100%", textAlign: "right", fontWeight: 600 }}>
|
||||||
|
{item?.Qty}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{Rate && (
|
||||||
|
<div style={{ width: "100%", textAlign: "right", fontWeight: 600 }}>
|
||||||
|
{item?.Price}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{Discount && (
|
||||||
|
<div style={{ width: "100%", textAlign: "right", fontWeight: 600 }}>
|
||||||
|
{item?.Type !== "C"
|
||||||
|
? item?.OfferAmt || 0
|
||||||
|
: item?.OfferValue || 0}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{Amount && (
|
||||||
|
<div style={{ width: "100%", textAlign: "right", fontWeight: 600 }}>
|
||||||
|
{item?.NetAmt?.toFixed(2)}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
})}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
}
|
}
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
{/* <br/> */}
|
{/* <br/> */}
|
||||||
<div className="PrintStyle3-print-ttlovrl">
|
<div className="PrintStyle3-print-ttlovrl" style={{...netAmountStyle}}>
|
||||||
<div>
|
<div>
|
||||||
<div style={{ fontWeight: '600' }}> Items : </div>
|
<div style={{ fontWeight: '600' }}> Items : </div>
|
||||||
<div style={{ fontWeight: '600' }}> Qty : </div>
|
<div style={{ fontWeight: '600' }}> Qty : </div>
|
||||||
|
|
@ -819,7 +980,7 @@ const PurPrintStyle3 = ({ index, totalQuantityFilter, Date1, CashierName, totalQ
|
||||||
}
|
}
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
{/* <br/> */}
|
{/* <br/> */}
|
||||||
|
|
||||||
|
|
@ -827,27 +988,28 @@ const PurPrintStyle3 = ({ index, totalQuantityFilter, Date1, CashierName, totalQ
|
||||||
<div className="PrintStyle3-print-stradrs" style={{ display: 'flex', justifyContent: 'space-between' }}>
|
<div className="PrintStyle3-print-stradrs" style={{ display: 'flex', justifyContent: 'space-between' }}>
|
||||||
|
|
||||||
<div style={{ display: 'flex', flexDirection: 'column', justifyContent: 'center', width: "100%" }}>
|
<div style={{ display: 'flex', flexDirection: 'column', justifyContent: 'center', width: "100%" }}>
|
||||||
|
|
||||||
|
|
||||||
{table2Data?.CustSuppName && table2Data?.CustSuppName !== undefined && table2Data?.CustSuppName !== null && !GlobaldummyData &&
|
{table2Data?.CustSuppName && table2Data?.CustSuppName !== undefined && table2Data?.CustSuppName !== null && !GlobaldummyData &&
|
||||||
<div style={{ fontSize: "14px", fontWeight: 600 }}>Customer : {table2Data?.CustSuppName}
|
<div style={{ fontSize: "14px", fontWeight: 600 }}>Customer : {table2Data?.CustSuppName}
|
||||||
</div>
|
</div>
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
{/* <br/> */}
|
{/* <br/> */}
|
||||||
|
|
||||||
|
|
||||||
<div className="page-footerA4Style11"
|
<div className="page-footerA4Style11"
|
||||||
style={{
|
style={{
|
||||||
marginTop: "auto",
|
marginTop: "auto",
|
||||||
pageBreakBefore: "avoid",
|
pageBreakBefore: "avoid",
|
||||||
pageBreakInside: "avoid",
|
pageBreakInside: "avoid",
|
||||||
minHeight: "auto",
|
minHeight: "auto",
|
||||||
|
...footerColorStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{
|
{
|
||||||
|
|
@ -859,7 +1021,7 @@ const PurPrintStyle3 = ({ index, totalQuantityFilter, Date1, CashierName, totalQ
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
<div style={{ display: "flex", width: "90%", padding: "0 1rem", justifyContent: "flex-end", alignItems: "center" }}>
|
<div style={{ display: "flex", width: "90%", padding: "0 1rem", justifyContent: "flex-end", alignItems: "center" }}>
|
||||||
{
|
{
|
||||||
(TermsnAdCondition == true && TermsAndConditions?.length > 0) && (<div style={{ margin: "8px 0", fontFamily: "sans-serif", width: "100%", display: "flex", flexDirection: "column", alignItems: "flex-start" }}>
|
(TermsnAdCondition == true && TermsAndConditions?.length > 0) && (<div style={{ margin: "8px 0", fontFamily: "sans-serif", width: "100%", display: "flex", flexDirection: "column", alignItems: "flex-start" }}>
|
||||||
<p style={{ fontSize: "13px", fontWeight: "bold", marginBottom: "6px" }}>
|
<p style={{ fontSize: "13px", fontWeight: "bold", marginBottom: "6px" }}>
|
||||||
|
|
@ -872,7 +1034,7 @@ const PurPrintStyle3 = ({ index, totalQuantityFilter, Date1, CashierName, totalQ
|
||||||
</div>)
|
</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>
|
<p style={{ fontSize: "13px", fontWeight: "bold", marginBottom: "6px" }}>Signature</p>
|
||||||
<img style={{ width: "100px", height: "60px" }} src={SignatureImg} alt="" />
|
<img style={{ width: "100px", height: "60px" }} src={SignatureImg} alt="" />
|
||||||
</div>)}
|
</div>)}
|
||||||
|
|
@ -880,8 +1042,8 @@ const PurPrintStyle3 = ({ index, totalQuantityFilter, Date1, CashierName, totalQ
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
{/* <div onClick={Print}> print</div> */}
|
{/* <div onClick={Print}> print</div> */}
|
||||||
</div>}
|
</div>}
|
||||||
</>
|
</>
|
||||||
|
|
|
||||||
|
|
@ -4,6 +4,17 @@ import {
|
||||||
GlobalPritdummyData,
|
GlobalPritdummyData,
|
||||||
changeReprintDataFound,
|
changeReprintDataFound,
|
||||||
GlobalprinttermsAndConditions,
|
GlobalprinttermsAndConditions,
|
||||||
|
GlobalSelectedPrintHeaderColor,
|
||||||
|
GlobalSelectedPrintHeaderFontColor,
|
||||||
|
GlobalSelectedTableHeaderColor,
|
||||||
|
GlobalSelectedTableHeaderFontColor,
|
||||||
|
GlobalSelectedTableBodyColor,
|
||||||
|
GlobalSelectedTableBodyFontColor,
|
||||||
|
GlobalRowType,
|
||||||
|
GlobalSelectedFooterColor,
|
||||||
|
GlobalSelectedFooterFontColor,
|
||||||
|
GlobalSelectedNetAmountColor,
|
||||||
|
GlobalSelectedNetAmountFontColor,
|
||||||
} from "../../../Features/ThemeChange/ThemeChange";
|
} from "../../../Features/ThemeChange/ThemeChange";
|
||||||
import "../../../Styles/BookingScreen/PrintTemplates/ThermalPrinter/PrintStyle3.scss"
|
import "../../../Styles/BookingScreen/PrintTemplates/ThermalPrinter/PrintStyle3.scss"
|
||||||
import { extractLastNumber } from "../../../Services/Others";
|
import { extractLastNumber } from "../../../Services/Others";
|
||||||
|
|
@ -28,12 +39,21 @@ const PurPrintstyle4 = ({ index, Date1, base64Image, totalQuantityFilter, Cashie
|
||||||
const Rate = FieldDetails?.["Rate"];
|
const Rate = FieldDetails?.["Rate"];
|
||||||
const Amount = FieldDetails?.["Amount"];
|
const Amount = FieldDetails?.["Amount"];
|
||||||
const HsnCode = FieldDetails?.["HsnCode"];
|
const HsnCode = FieldDetails?.["HsnCode"];
|
||||||
|
|
||||||
|
|
||||||
const GlobaldummyData = useSelector(GlobalPritdummyData);
|
const GlobaldummyData = useSelector(GlobalPritdummyData);
|
||||||
const GlobaltermsAndConditions = useSelector(GlobalprinttermsAndConditions);
|
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 TermsAndConditions = printDatas?.TermsandConditions
|
||||||
let SignatureImg = printDatas?.Signature
|
let SignatureImg = printDatas?.Signature
|
||||||
let Notestext = printDatas?.Notes
|
let Notestext = printDatas?.Notes
|
||||||
|
|
@ -42,7 +62,13 @@ const PurPrintstyle4 = ({ index, Date1, base64Image, totalQuantityFilter, Cashie
|
||||||
let PageSize = printDatas?.PageSize
|
let PageSize = printDatas?.PageSize
|
||||||
const Signature = FieldDetails?.["signature"];
|
const Signature = FieldDetails?.["signature"];
|
||||||
const TermsnAdCondition = FieldDetails?.["terms&conditions"];
|
const TermsnAdCondition = FieldDetails?.["terms&conditions"];
|
||||||
|
//
|
||||||
|
let printColors = printDatas?.PrintColors;
|
||||||
|
const headerColor = printColors?.find(obj => obj.headerColor)?.headerColor;
|
||||||
|
const tableHeaderColor = printColors?.find(obj => obj.tableHeaderColor)?.tableHeaderColor;
|
||||||
|
const tableBodyColor = printColors?.find(obj => obj.tableBodyColor)?.tableBodyColor;
|
||||||
|
const footerColor = printColors?.find(obj => obj.footerColor)?.footerColor;
|
||||||
|
const netAmtColor = printColors?.find(obj => obj.netAmtColor)?.netAmtColor;
|
||||||
|
|
||||||
const keysLength = Object.keys(table2Data ?? {}).length;
|
const keysLength = Object.keys(table2Data ?? {}).length;
|
||||||
|
|
||||||
|
|
@ -58,19 +84,7 @@ const PurPrintstyle4 = ({ index, Date1, base64Image, totalQuantityFilter, Cashie
|
||||||
const formattedDate = `${day}-${monthNames[monthIndex]}-${year}`;
|
const formattedDate = `${day}-${monthNames[monthIndex]}-${year}`;
|
||||||
|
|
||||||
const TakeawayData = table2Data?.[0]?.ProductDetails
|
const TakeawayData = table2Data?.[0]?.ProductDetails
|
||||||
console.log(TakeawayData, "TakeawayData")
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
let TotalOfferAmount = 0;
|
let TotalOfferAmount = 0;
|
||||||
|
|
||||||
// Calculate SalesWiseOffers total amount
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
const chunkSize = PageSize == "A5" ? 11 : 16;
|
const chunkSize = PageSize == "A5" ? 11 : 16;
|
||||||
|
|
||||||
let dataSource = table2Data?.[0]?.ProductDetails;
|
let dataSource = table2Data?.[0]?.ProductDetails;
|
||||||
|
|
@ -85,6 +99,52 @@ const PurPrintstyle4 = ({ index, Date1, base64Image, totalQuantityFilter, Cashie
|
||||||
}
|
}
|
||||||
const lastChunkRows = paginatedChunks.length > 0 ? paginatedChunks[paginatedChunks.length - 1].length : 0;
|
const lastChunkRows = paginatedChunks.length > 0 ? paginatedChunks[paginatedChunks.length - 1].length : 0;
|
||||||
const shouldFooterBeOnNewPage = lastChunkRows > (PageSize == "A5" ? 5 : 10);
|
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 (
|
return (
|
||||||
<>
|
<>
|
||||||
{FormatTheme ?
|
{FormatTheme ?
|
||||||
|
|
@ -95,7 +155,7 @@ const PurPrintstyle4 = ({ index, Date1, base64Image, totalQuantityFilter, Cashie
|
||||||
|
|
||||||
{/* <div className="header" style={{ position: "fixed", top: 0, width: "100%" }}> */}
|
{/* <div className="header" style={{ position: "fixed", top: 0, width: "100%" }}> */}
|
||||||
<div className="header" style={{ position: isMobile ? GlobaldummyData ? "absolute" : "fixed" : "", top: 0, width: "100%" }}>
|
<div className="header" style={{ position: isMobile ? GlobaldummyData ? "absolute" : "fixed" : "", top: 0, width: "100%" }}>
|
||||||
<div className='PrintStyle4-fistDiv' style={{ flexDirection: 'column' }}>
|
<div className='PrintStyle4-fistDiv' style={{ flexDirection: 'column',...headerStyle, }}>
|
||||||
<div style={{ fontSize: '20px', fontWeight: '600', width: '100%', textAlign: 'center' }}>{table2Data?.[0]?.BrName}</div>
|
<div style={{ fontSize: '20px', fontWeight: '600', width: '100%', textAlign: 'center' }}>{table2Data?.[0]?.BrName}</div>
|
||||||
<div style={{ display: 'flex', justifyContent: 'center', alignItems: 'center', fontWeight: 600 }}>
|
<div style={{ display: 'flex', justifyContent: 'center', alignItems: 'center', fontWeight: 600 }}>
|
||||||
{
|
{
|
||||||
|
|
@ -129,20 +189,31 @@ const PurPrintstyle4 = ({ index, Date1, base64Image, totalQuantityFilter, Cashie
|
||||||
<table className="PrintStyle4-print-table">
|
<table className="PrintStyle4-print-table">
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
{SLNO && <th style={{ width: '10px' }}>S.No</th>}
|
{SLNO && <th style={{ width: '10px',...tableHeaderStyle }}>S.No</th>}
|
||||||
{Item && <th>Item</th>}
|
{Item && <th style={{...tableHeaderStyle}}>Item</th>}
|
||||||
{Quantity && <th style={{ width: '30px', textAlign: 'right' }}>Qty</th>}
|
{Quantity && <th style={{ width: '30px', textAlign: 'right',...tableHeaderStyle }}>Qty</th>}
|
||||||
{HsnCode && <th style={{ width: '30px', textAlign: 'right' }}>HSN</th>}
|
{HsnCode && <th style={{ width: '30px', textAlign: 'right',...tableHeaderStyle }}>HSN</th>}
|
||||||
{MRP && <th style={{ width: '30px', textAlign: 'right' }}>MRP</th>}
|
{MRP && <th style={{ width: '30px', textAlign: 'right',...tableHeaderStyle }}>MRP</th>}
|
||||||
{Discount && <th style={{ width: '30px', textAlign: 'right' }}>Dis </th>}
|
{Discount && <th style={{ width: '30px', textAlign: 'right',...tableHeaderStyle }}>Dis </th>}
|
||||||
{Rate && <th style={{ width: '40px', textAlign: 'right' }}>Rate</th>}
|
{Rate && <th style={{ width: '40px', textAlign: 'right',...tableHeaderStyle }}>Rate</th>}
|
||||||
{Amount && <th style={{ width: '30px', textAlign: 'right' }}>Amt</th>}
|
{Amount && <th style={{ width: '30px', textAlign: 'right',...tableHeaderStyle }}>Amt</th>}
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
{dataChunk?.map((item, index) => {
|
{dataChunk?.map((item, index) => {
|
||||||
return (
|
return (
|
||||||
<tr key={index}>
|
<tr key={index}
|
||||||
|
style={
|
||||||
|
index % 2 !== 1 && rowtypeStyle === "even"
|
||||||
|
? {
|
||||||
|
...tableBodyStyle
|
||||||
|
}
|
||||||
|
: index % 2 === 1 && rowtypeStyle === "odd"
|
||||||
|
? {
|
||||||
|
...tableBodyStyle
|
||||||
|
}
|
||||||
|
: {}
|
||||||
|
}>
|
||||||
{SLNO && <td>{chunkIndex * chunkSize + index + 1}</td>}
|
{SLNO && <td>{chunkIndex * chunkSize + index + 1}</td>}
|
||||||
{Item && <td style={{ display: 'flex', flexDirection: 'column', marginLeft: "30px" }}>
|
{Item && <td style={{ display: 'flex', flexDirection: 'column', marginLeft: "30px" }}>
|
||||||
<div>{item?.ProdName}</div>
|
<div>{item?.ProdName}</div>
|
||||||
|
|
@ -196,7 +267,7 @@ const PurPrintstyle4 = ({ index, Date1, base64Image, totalQuantityFilter, Cashie
|
||||||
<>
|
<>
|
||||||
|
|
||||||
|
|
||||||
<div className='PrintStyle4-ThirdDivMaster'>
|
<div className='PrintStyle4-ThirdDivMaster' style={{...netAmountStyle}}>
|
||||||
<div className='PrintStyle4-ThirdP'>
|
<div className='PrintStyle4-ThirdP'>
|
||||||
<div>
|
<div>
|
||||||
<div style={{ fontWeight: '600' }}>Items </div>
|
<div style={{ fontWeight: '600' }}>Items </div>
|
||||||
|
|
@ -365,6 +436,7 @@ const PurPrintstyle4 = ({ index, Date1, base64Image, totalQuantityFilter, Cashie
|
||||||
pageBreakBefore: "avoid",
|
pageBreakBefore: "avoid",
|
||||||
pageBreakInside: "avoid",
|
pageBreakInside: "avoid",
|
||||||
minHeight: "auto",
|
minHeight: "auto",
|
||||||
|
...footerColorStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{
|
{
|
||||||
|
|
@ -425,7 +497,7 @@ const PurPrintstyle4 = ({ index, Date1, base64Image, totalQuantityFilter, Cashie
|
||||||
<>
|
<>
|
||||||
|
|
||||||
|
|
||||||
<div className='PrintStyle4-ThirdDivMaster'>
|
<div className='PrintStyle4-ThirdDivMaster' style={{...netAmountStyle}}>
|
||||||
<div className='PrintStyle4-ThirdP'>
|
<div className='PrintStyle4-ThirdP'>
|
||||||
<div>
|
<div>
|
||||||
<div style={{ fontWeight: '600' }}>Items </div>
|
<div style={{ fontWeight: '600' }}>Items </div>
|
||||||
|
|
@ -592,6 +664,7 @@ const PurPrintstyle4 = ({ index, Date1, base64Image, totalQuantityFilter, Cashie
|
||||||
pageBreakBefore: "avoid",
|
pageBreakBefore: "avoid",
|
||||||
pageBreakInside: "avoid",
|
pageBreakInside: "avoid",
|
||||||
minHeight: "auto",
|
minHeight: "auto",
|
||||||
|
...footerColorStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{
|
{
|
||||||
|
|
@ -657,20 +730,31 @@ const PurPrintstyle4 = ({ index, Date1, base64Image, totalQuantityFilter, Cashie
|
||||||
<table className="PrintStyle4-print-table">
|
<table className="PrintStyle4-print-table">
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
{SLNO && <th style={{ width: '10px' }}>S.No</th>}
|
{SLNO && <th style={{ width: '10px',...tableHeaderStyle }}>S.No</th>}
|
||||||
{Item && <th>Item</th>}
|
{Item && <th style={{...tableHeaderStyle}}>Item</th>}
|
||||||
{Quantity && <th style={{ width: '30px', textAlign: 'right' }}>Qty</th>}
|
{Quantity && <th style={{ width: '30px', textAlign: 'right',...tableHeaderStyle }}>Qty</th>}
|
||||||
{HsnCode && <th style={{ width: '30px', textAlign: 'right' }}>HSN</th>}
|
{HsnCode && <th style={{ width: '30px', textAlign: 'right',...tableHeaderStyle }}>HSN</th>}
|
||||||
{MRP && <th style={{ width: '30px', textAlign: 'right' }}>MRP</th>}
|
{MRP && <th style={{ width: '30px', textAlign: 'right',...tableHeaderStyle }}>MRP</th>}
|
||||||
{Discount && <th style={{ width: '30px', textAlign: 'right' }}>Dis </th>}
|
{Discount && <th style={{ width: '30px', textAlign: 'right',...tableHeaderStyle }}>Dis </th>}
|
||||||
{Rate && <th style={{ width: '40px', textAlign: 'right' }}>Rate</th>}
|
{Rate && <th style={{ width: '40px', textAlign: 'right',...tableHeaderStyle }}>Rate</th>}
|
||||||
{Amount && <th style={{ width: '30px', textAlign: 'right' }}>Amt</th>}
|
{Amount && <th style={{ width: '30px', textAlign: 'right',...tableHeaderStyle }}>Amt</th>}
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
{(GlobaldummyData ? products : TakeawayData)?.map((item, index) => {
|
{(GlobaldummyData ? products : TakeawayData)?.map((item, index) => {
|
||||||
return (
|
return (
|
||||||
<tr key={index}>
|
<tr key={index}
|
||||||
|
style={
|
||||||
|
index % 2 !== 1 && rowtypeStyle === "even"
|
||||||
|
? {
|
||||||
|
...tableBodyStyle
|
||||||
|
}
|
||||||
|
: index % 2 === 1 && rowtypeStyle === "odd"
|
||||||
|
? {
|
||||||
|
...tableBodyStyle
|
||||||
|
}
|
||||||
|
: {}
|
||||||
|
}>
|
||||||
{SLNO && <td>{index + 1}</td>}
|
{SLNO && <td>{index + 1}</td>}
|
||||||
{Item && <td style={{ display: 'flex', flexDirection: 'column', marginLeft: "30px" }}>
|
{Item && <td style={{ display: 'flex', flexDirection: 'column', marginLeft: "30px" }}>
|
||||||
<div>{item?.ProdName}</div>
|
<div>{item?.ProdName}</div>
|
||||||
|
|
@ -716,7 +800,7 @@ const PurPrintstyle4 = ({ index, Date1, base64Image, totalQuantityFilter, Cashie
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
<div className='PrintStyle4-ThirdDivMaster'>
|
<div className='PrintStyle4-ThirdDivMaster' style={{...netAmountStyle}}>
|
||||||
<div className='PrintStyle4-ThirdP'>
|
<div className='PrintStyle4-ThirdP'>
|
||||||
<div>
|
<div>
|
||||||
<div style={{ fontWeight: '600' }}>Items </div>
|
<div style={{ fontWeight: '600' }}>Items </div>
|
||||||
|
|
@ -883,6 +967,7 @@ const PurPrintstyle4 = ({ index, Date1, base64Image, totalQuantityFilter, Cashie
|
||||||
pageBreakBefore: "avoid",
|
pageBreakBefore: "avoid",
|
||||||
pageBreakInside: "avoid",
|
pageBreakInside: "avoid",
|
||||||
minHeight: "auto",
|
minHeight: "auto",
|
||||||
|
...footerColorStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{
|
{
|
||||||
|
|
|
||||||
|
|
@ -4,6 +4,17 @@ import {
|
||||||
GlobalPritdummyData,
|
GlobalPritdummyData,
|
||||||
changeReprintDataFound,
|
changeReprintDataFound,
|
||||||
GlobalprinttermsAndConditions,
|
GlobalprinttermsAndConditions,
|
||||||
|
GlobalSelectedPrintHeaderColor,
|
||||||
|
GlobalSelectedPrintHeaderFontColor,
|
||||||
|
GlobalSelectedTableHeaderColor,
|
||||||
|
GlobalSelectedTableHeaderFontColor,
|
||||||
|
GlobalSelectedTableBodyColor,
|
||||||
|
GlobalSelectedTableBodyFontColor,
|
||||||
|
GlobalRowType,
|
||||||
|
GlobalSelectedFooterColor,
|
||||||
|
GlobalSelectedFooterFontColor,
|
||||||
|
GlobalSelectedNetAmountColor,
|
||||||
|
GlobalSelectedNetAmountFontColor,
|
||||||
} from '../../../Features/ThemeChange/ThemeChange'
|
} from '../../../Features/ThemeChange/ThemeChange'
|
||||||
import '../../../Styles/BookingScreen/PrintTemplates/ThermalPrinter/PrintStyle5.scss'
|
import '../../../Styles/BookingScreen/PrintTemplates/ThermalPrinter/PrintStyle5.scss'
|
||||||
import { extractLastNumber } from "../../../Services/Others";
|
import { extractLastNumber } from "../../../Services/Others";
|
||||||
|
|
@ -33,6 +44,17 @@ const PurPrintStyle5 = ({ index, ExtraChargeTotal, totalQuantityFilter, Date1, C
|
||||||
|
|
||||||
const GlobaldummyData = useSelector(GlobalPritdummyData);
|
const GlobaldummyData = useSelector(GlobalPritdummyData);
|
||||||
const GlobaltermsAndConditions = useSelector(GlobalprinttermsAndConditions);
|
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 TermsAndConditions = printDatas?.TermsandConditions
|
||||||
|
|
@ -61,10 +83,12 @@ const PurPrintStyle5 = ({ index, ExtraChargeTotal, totalQuantityFilter, Date1, C
|
||||||
const TakeawayData = table2Data?.[0]?.ProductDetails
|
const TakeawayData = table2Data?.[0]?.ProductDetails
|
||||||
console.log(TakeawayData, "TakeawayData", table2Data)
|
console.log(TakeawayData, "TakeawayData", table2Data)
|
||||||
|
|
||||||
|
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;
|
||||||
let TotalOfferAmount = 0;
|
let TotalOfferAmount = 0;
|
||||||
|
|
||||||
// Calculate SalesWiseOffers total amount
|
// Calculate SalesWiseOffers total amount
|
||||||
|
|
@ -82,7 +106,51 @@ const PurPrintStyle5 = ({ index, ExtraChargeTotal, totalQuantityFilter, Date1, C
|
||||||
}
|
}
|
||||||
const lastChunkRows = paginatedChunks.length > 0 ? paginatedChunks[paginatedChunks.length - 1].length : 0;
|
const lastChunkRows = paginatedChunks.length > 0 ? paginatedChunks[paginatedChunks.length - 1].length : 0;
|
||||||
const shouldFooterBeOnNewPage = lastChunkRows > (PageSize == "A5" ? 2 : 10);
|
const shouldFooterBeOnNewPage = lastChunkRows > (PageSize == "A5" ? 2 : 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 (
|
return (
|
||||||
<>
|
<>
|
||||||
{FormatTheme ?
|
{FormatTheme ?
|
||||||
|
|
@ -91,8 +159,8 @@ const PurPrintStyle5 = ({ index, ExtraChargeTotal, totalQuantityFilter, Date1, C
|
||||||
<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={`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: "fixed", top: 0, width: "100%" }}> */}
|
||||||
<div className="header" style={{ position: isMobile ? GlobaldummyData ? "absolute" : "fixed" : "", top: 0, width: "100%" }}>
|
<div className="header" style={{ position: isMobile ? GlobaldummyData ? "absolute" : "fixed" : "", top: 0, width: "100%" }}>
|
||||||
<div className="PrintStyle5-Head">
|
<div className="PrintStyle5-Head" style={{...headerStyle}}>
|
||||||
<div>
|
<div>
|
||||||
<div style={{ fontSize: 'clamp(2rem, 2.5vw, 2rem)', fontWeight: '600' }}>{table2Data?.[0]?.BrName}</div>
|
<div style={{ fontSize: 'clamp(2rem, 2.5vw, 2rem)', fontWeight: '600' }}>{table2Data?.[0]?.BrName}</div>
|
||||||
|
|
||||||
|
|
@ -104,9 +172,8 @@ const PurPrintStyle5 = ({ index, ExtraChargeTotal, totalQuantityFilter, Date1, C
|
||||||
</div>
|
</div>
|
||||||
<div style={{ fontSize: "14px", fontWeight: '600' }}> Mobile :{GlobaldummyData ? '1234567890' : table2Data?.[0]?.BrMobile} </div>
|
<div style={{ fontSize: "14px", fontWeight: '600' }}> Mobile :{GlobaldummyData ? '1234567890' : table2Data?.[0]?.BrMobile} </div>
|
||||||
{<div style={{ textTransform: 'uppercase' }}>{BillName} </div>}
|
{<div style={{ textTransform: 'uppercase' }}>{BillName} </div>}
|
||||||
|
|
||||||
<hr />
|
|
||||||
</div>
|
</div>
|
||||||
|
<hr />
|
||||||
|
|
||||||
|
|
||||||
<div style={{ display: "flex", justifyContent: "space-between", fontSize: "14px", fontWeight: '600' }}>
|
<div style={{ display: "flex", justifyContent: "space-between", fontSize: "14px", fontWeight: '600' }}>
|
||||||
|
|
@ -121,7 +188,7 @@ const PurPrintStyle5 = ({ index, ExtraChargeTotal, totalQuantityFilter, Date1, C
|
||||||
<div style={{ marginTop: GlobaldummyData ? "9rem" : "0rem" }} className="print-body">
|
<div style={{ marginTop: GlobaldummyData ? "9rem" : "0rem" }} className="print-body">
|
||||||
{(TakeawayData?.length > 0 || GlobaldummyData) &&
|
{(TakeawayData?.length > 0 || GlobaldummyData) &&
|
||||||
<>
|
<>
|
||||||
<div style={{ display: "flex", justifyContent: "space-between", fontWeight: '600', fontSize: 'clamp(1rem, 2.5vw, 1.2rem)', width: '100%', gap: '0.5rem' }}>
|
<div style={{ display: "flex", justifyContent: "space-between", fontWeight: '600', fontSize: 'clamp(1rem, 2.5vw, 1.2rem)', width: '100%', gap: '0.5rem', ...tableHeaderStyle }}>
|
||||||
{GlobaldummyData ? GlobalSlNo && <div style={{ width: '100%', textAlign: 'center' }}>S.No</div> : SLNO && <div style={{ width: '100%', textAlign: 'center' }}>S.No</div>}
|
{GlobaldummyData ? GlobalSlNo && <div style={{ width: '100%', textAlign: 'center' }}>S.No</div> : SLNO && <div style={{ width: '100%', textAlign: 'center' }}>S.No</div>}
|
||||||
{GlobaldummyData ? (GlobalItem || GlobalQuantity) &&
|
{GlobaldummyData ? (GlobalItem || GlobalQuantity) &&
|
||||||
<div style={{ width: '300%', textAlign: 'center' }} > {GlobaldummyData ? GlobalItem && 'ITEM /DES /' : 'ITEM /DES /'} {GlobaldummyData ? GlobalQuantity && 'QTY' : 'QTY'} </div> :
|
<div style={{ width: '300%', textAlign: 'center' }} > {GlobaldummyData ? GlobalItem && 'ITEM /DES /' : 'ITEM /DES /'} {GlobaldummyData ? GlobalQuantity && 'QTY' : 'QTY'} </div> :
|
||||||
|
|
@ -136,7 +203,8 @@ const PurPrintStyle5 = ({ index, ExtraChargeTotal, totalQuantityFilter, Date1, C
|
||||||
<hr className="hrline" />
|
<hr className="hrline" />
|
||||||
|
|
||||||
{dataChunk?.map((item, index) => (
|
{dataChunk?.map((item, index) => (
|
||||||
<div key={index} className="PrintStyle5-print-prddtls" style={{ display: "flex", justifyContent: "space-between", fontSize: 'clamp(1rem, 2.5vw, 1.2rem)', fontWeight: '600', width: '100%', gap: '0.5rem' }}>
|
<div key={index} className="PrintStyle5-print-prddtls" style={{ ...(rowtypeStyle === (index % 2 === 0 ? "even" : "odd")? tableBodyStyle
|
||||||
|
: {}),display: "flex", justifyContent: "space-between", fontSize: 'clamp(1rem, 2.5vw, 1.2rem)', fontWeight: '600', width: '100%', gap: '0.5rem' }}>
|
||||||
{SLNO && <div style={{ width: '100%', textAlign: 'center' }}>{chunkIndex * chunkSize + index + 1}</div>}
|
{SLNO && <div style={{ width: '100%', textAlign: 'center' }}>{chunkIndex * chunkSize + index + 1}</div>}
|
||||||
{
|
{
|
||||||
GlobaldummyData ? (GlobalItem || GlobalQuantity) &&
|
GlobaldummyData ? (GlobalItem || GlobalQuantity) &&
|
||||||
|
|
@ -331,7 +399,7 @@ const PurPrintStyle5 = ({ index, ExtraChargeTotal, totalQuantityFilter, Date1, C
|
||||||
|
|
||||||
<hr className="hrline" />
|
<hr className="hrline" />
|
||||||
|
|
||||||
<div className="align-style" style={{ fontWeight: '600', fontSize: '19px' }}> <div>Amount </div> <div> : </div> <div>{GlobaldummyData ? '1,066' : Number(table2Data?.[0]?.NetAmount).toFixed(2)}</div> </div>
|
<div className="align-style" style={{...netAmountStyle, fontWeight: '600', fontSize: '19px' }}> <div>Amount </div> <div> : </div> <div>{GlobaldummyData ? '1,066' : Number(table2Data?.[0]?.NetAmount).toFixed(2)}</div> </div>
|
||||||
|
|
||||||
<hr className="hrline" />
|
<hr className="hrline" />
|
||||||
{/*
|
{/*
|
||||||
|
|
@ -379,6 +447,7 @@ const PurPrintStyle5 = ({ index, ExtraChargeTotal, totalQuantityFilter, Date1, C
|
||||||
pageBreakBefore: "avoid",
|
pageBreakBefore: "avoid",
|
||||||
pageBreakInside: "avoid",
|
pageBreakInside: "avoid",
|
||||||
minHeight: "auto",
|
minHeight: "auto",
|
||||||
|
...footerColorStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{GlobaldummyData ? GlobalIsnotes &&
|
{GlobaldummyData ? GlobalIsnotes &&
|
||||||
|
|
@ -590,7 +659,7 @@ const PurPrintStyle5 = ({ index, ExtraChargeTotal, totalQuantityFilter, Date1, C
|
||||||
|
|
||||||
<hr className="hrline" />
|
<hr className="hrline" />
|
||||||
|
|
||||||
<div className="align-style" style={{ fontWeight: '600', fontSize: '19px' }}> <div>Amount </div> <div> : </div> <div>{GlobaldummyData ? '1,066' : Number(table2Data?.NetAmount).toFixed(2)}</div> </div>
|
<div className="align-style" style={{...netAmountStyle, fontWeight: '600', fontSize: '19px' }}> <div>Amount </div> <div> : </div> <div>{GlobaldummyData ? '1,066' : Number(table2Data?.NetAmount).toFixed(2)}</div> </div>
|
||||||
|
|
||||||
<hr className="hrline" />
|
<hr className="hrline" />
|
||||||
|
|
||||||
|
|
@ -634,6 +703,7 @@ const PurPrintStyle5 = ({ index, ExtraChargeTotal, totalQuantityFilter, Date1, C
|
||||||
pageBreakBefore: "avoid",
|
pageBreakBefore: "avoid",
|
||||||
pageBreakInside: "avoid",
|
pageBreakInside: "avoid",
|
||||||
minHeight: "auto",
|
minHeight: "auto",
|
||||||
|
...footerColorStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{
|
{
|
||||||
|
|
@ -681,7 +751,7 @@ const PurPrintStyle5 = ({ index, ExtraChargeTotal, totalQuantityFilter, Date1, C
|
||||||
:
|
:
|
||||||
<div className="PrintStyle5-MasterDiv" id={`SQPrintStyle5`} style={{ fontFamily: "'Courier New', Courier, monospace" }} >
|
<div className="PrintStyle5-MasterDiv" id={`SQPrintStyle5`} style={{ fontFamily: "'Courier New', Courier, monospace" }} >
|
||||||
|
|
||||||
<div className="PrintStyle5-Head">
|
<div className="PrintStyle5-Head" style={{...headerStyle}}>
|
||||||
<div>
|
<div>
|
||||||
<div style={{ fontSize: 'clamp(2rem, 2.5vw, 2rem)', fontWeight: '600' }}>{table2Data?.[0]?.BrName}</div>
|
<div style={{ fontSize: 'clamp(2rem, 2.5vw, 2rem)', fontWeight: '600' }}>{table2Data?.[0]?.BrName}</div>
|
||||||
|
|
||||||
|
|
@ -692,15 +762,9 @@ const PurPrintStyle5 = ({ index, ExtraChargeTotal, totalQuantityFilter, Date1, C
|
||||||
</div>
|
</div>
|
||||||
<div style={{ fontSize: "14px", fontWeight: '600' }}> Mobile :{GlobaldummyData ? '1234567890' : table2Data?.[0]?.BrMobile} </div>
|
<div style={{ fontSize: "14px", fontWeight: '600' }}> Mobile :{GlobaldummyData ? '1234567890' : table2Data?.[0]?.BrMobile} </div>
|
||||||
{<div style={{ textTransform: 'uppercase' }}>{BillName}</div>}
|
{<div style={{ textTransform: 'uppercase' }}>{BillName}</div>}
|
||||||
|
|
||||||
<hr />
|
|
||||||
</div>
|
</div>
|
||||||
|
<hr />
|
||||||
|
|
||||||
|
|
||||||
<div className="PrintStyle5-print-table">
|
<div className="PrintStyle5-print-table">
|
||||||
|
|
||||||
|
|
||||||
<div style={{ display: "flex", justifyContent: "space-between", fontSize: "14px", fontWeight: '600' }}>
|
<div style={{ display: "flex", justifyContent: "space-between", fontSize: "14px", fontWeight: '600' }}>
|
||||||
{" "}
|
{" "}
|
||||||
<div> {GlobaldummyData ? formattedDate : Date1} </div>{" "}
|
<div> {GlobaldummyData ? formattedDate : Date1} </div>{" "}
|
||||||
|
|
@ -710,7 +774,7 @@ const PurPrintStyle5 = ({ index, ExtraChargeTotal, totalQuantityFilter, Date1, C
|
||||||
<hr />
|
<hr />
|
||||||
{(TakeawayData?.length > 0) &&
|
{(TakeawayData?.length > 0) &&
|
||||||
<>
|
<>
|
||||||
<div style={{ display: "flex", justifyContent: "space-between", fontWeight: '600', fontSize: 'clamp(1rem, 2.5vw, 1.2rem)', width: '100%', gap: '0.5rem' }}>
|
<div style={{ display: "flex", justifyContent: "space-between", fontWeight: '600', fontSize: 'clamp(1rem, 2.5vw, 1.2rem)', width: '100%', gap: '0.5rem', ...tableHeaderStyle }}>
|
||||||
{
|
{
|
||||||
SLNO && <div style={{ width: '100%', textAlign: 'center' }}>S.No</div>}
|
SLNO && <div style={{ width: '100%', textAlign: 'center' }}>S.No</div>}
|
||||||
{
|
{
|
||||||
|
|
@ -727,7 +791,8 @@ const PurPrintStyle5 = ({ index, ExtraChargeTotal, totalQuantityFilter, Date1, C
|
||||||
<hr className="hrline" />
|
<hr className="hrline" />
|
||||||
|
|
||||||
{(TakeawayData)?.map((item, index) => (
|
{(TakeawayData)?.map((item, index) => (
|
||||||
<div key={index} className="PrintStyle5-print-prddtls" style={{ display: "flex", justifyContent: "space-between", fontSize: 'clamp(1rem, 2.5vw, 1.2rem)', fontWeight: '600', width: '100%', gap: '0.5rem' }}>
|
<div key={index} className="PrintStyle5-print-prddtls" style={{ ...(rowtypeStyle === (index % 2 === 0 ? "even" : "odd")? tableBodyStyle
|
||||||
|
: {}), display: "flex", justifyContent: "space-between", fontSize: 'clamp(1rem, 2.5vw, 1.2rem)', fontWeight: '600', width: '100%', gap: '0.5rem' }}>
|
||||||
{SLNO && <div style={{ width: '100%', textAlign: 'center' }}>{index + 1}</div>}
|
{SLNO && <div style={{ width: '100%', textAlign: 'center' }}>{index + 1}</div>}
|
||||||
{
|
{
|
||||||
|
|
||||||
|
|
@ -907,7 +972,7 @@ const PurPrintStyle5 = ({ index, ExtraChargeTotal, totalQuantityFilter, Date1, C
|
||||||
|
|
||||||
<hr className="hrline" />
|
<hr className="hrline" />
|
||||||
|
|
||||||
<div className="align-style" style={{ fontWeight: '600', fontSize: '19px' }}> <div>Amount </div> <div> : </div> <div>{GlobaldummyData ? '1,066' : Number(table2Data?.[0]?.NetAmount).toFixed(2)}</div> </div>
|
<div className="align-style" style={{...netAmountStyle, fontWeight: '600', fontSize: '19px' }}> <div>Amount </div> <div> : </div> <div>{GlobaldummyData ? '1,066' : Number(table2Data?.[0]?.NetAmount).toFixed(2)}</div> </div>
|
||||||
|
|
||||||
<hr className="hrline" />
|
<hr className="hrline" />
|
||||||
{/*
|
{/*
|
||||||
|
|
@ -964,6 +1029,7 @@ const PurPrintStyle5 = ({ index, ExtraChargeTotal, totalQuantityFilter, Date1, C
|
||||||
pageBreakBefore: "avoid",
|
pageBreakBefore: "avoid",
|
||||||
pageBreakInside: "avoid",
|
pageBreakInside: "avoid",
|
||||||
minHeight: "auto",
|
minHeight: "auto",
|
||||||
|
...footerColorStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{
|
{
|
||||||
|
|
|
||||||
|
|
@ -5,6 +5,17 @@ import {
|
||||||
GlobalPritdummyData,
|
GlobalPritdummyData,
|
||||||
changeReprintDataFound,
|
changeReprintDataFound,
|
||||||
GlobalprinttermsAndConditions,
|
GlobalprinttermsAndConditions,
|
||||||
|
GlobalSelectedPrintHeaderColor,
|
||||||
|
GlobalSelectedPrintHeaderFontColor,
|
||||||
|
GlobalSelectedTableHeaderColor,
|
||||||
|
GlobalSelectedTableHeaderFontColor,
|
||||||
|
GlobalSelectedTableBodyColor,
|
||||||
|
GlobalSelectedTableBodyFontColor,
|
||||||
|
GlobalRowType,
|
||||||
|
GlobalSelectedFooterColor,
|
||||||
|
GlobalSelectedFooterFontColor,
|
||||||
|
GlobalSelectedNetAmountColor,
|
||||||
|
GlobalSelectedNetAmountFontColor,
|
||||||
} from "../../../Features/ThemeChange/ThemeChange";
|
} from "../../../Features/ThemeChange/ThemeChange";
|
||||||
import "../../../Styles/BookingScreen/PrintTemplates/ThermalPrinter/PrintStyle6.scss";
|
import "../../../Styles/BookingScreen/PrintTemplates/ThermalPrinter/PrintStyle6.scss";
|
||||||
import { extractLastNumber } from "../../../Services/Others";
|
import { extractLastNumber } from "../../../Services/Others";
|
||||||
|
|
@ -44,10 +55,20 @@ const PurPrintstyle6 = ({
|
||||||
const Rate = FieldDetails?.["Rate"];
|
const Rate = FieldDetails?.["Rate"];
|
||||||
const Amount = FieldDetails?.["Amount"];
|
const Amount = FieldDetails?.["Amount"];
|
||||||
const HsnCode = FieldDetails?.["HsnCode"];
|
const HsnCode = FieldDetails?.["HsnCode"];
|
||||||
|
|
||||||
|
|
||||||
const GlobaldummyData = useSelector(GlobalPritdummyData);
|
const GlobaldummyData = useSelector(GlobalPritdummyData);
|
||||||
const GlobaltermsAndConditions = useSelector(GlobalprinttermsAndConditions);
|
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 TermsAndConditions = printDatas?.TermsandConditions
|
||||||
|
|
@ -58,6 +79,12 @@ const PurPrintstyle6 = ({
|
||||||
let PageSize = printDatas?.PageSize
|
let PageSize = printDatas?.PageSize
|
||||||
const Signature = FieldDetails?.["signature"];
|
const Signature = FieldDetails?.["signature"];
|
||||||
const TermsnAdCondition = FieldDetails?.["terms&conditions"];
|
const TermsnAdCondition = FieldDetails?.["terms&conditions"];
|
||||||
|
let printColors = printDatas?.PrintColors;
|
||||||
|
const headerColor = printColors?.find(obj => obj.headerColor)?.headerColor;
|
||||||
|
const tableHeaderColor = printColors?.find(obj => obj.tableHeaderColor)?.tableHeaderColor;
|
||||||
|
const tableBodyColor = printColors?.find(obj => obj.tableBodyColor)?.tableBodyColor;
|
||||||
|
const footerColor = printColors?.find(obj => obj.footerColor)?.footerColor;
|
||||||
|
const netAmtColor = printColors?.find(obj => obj.netAmtColor)?.netAmtColor;
|
||||||
|
|
||||||
|
|
||||||
const keysLength = Object.keys(table2Data ?? {}).length;
|
const keysLength = Object.keys(table2Data ?? {}).length;
|
||||||
|
|
@ -90,19 +117,60 @@ const PurPrintstyle6 = ({
|
||||||
}
|
}
|
||||||
const lastChunkRows = paginatedChunks.length > 0 ? paginatedChunks[paginatedChunks.length - 1].length : 0;
|
const lastChunkRows = paginatedChunks.length > 0 ? paginatedChunks[paginatedChunks.length - 1].length : 0;
|
||||||
const shouldFooterBeOnNewPage = lastChunkRows > (PageSize == "A5" ? 5 : 13);
|
const shouldFooterBeOnNewPage = lastChunkRows > (PageSize == "A5" ? 5 : 13);
|
||||||
|
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 (
|
return (
|
||||||
<>
|
<>
|
||||||
{FormatTheme ?
|
{FormatTheme ?
|
||||||
<div id={`SQPrintStyle6`} className="PrintStyle6MasterDiv" style={{ fontFamily: "'Courier New', Courier, monospace", position: "relative", width: "100%", minHeight: isMobile ? (PageSize === "A5" ? "210mm" : "297mm") : "auto" }}>
|
<div id={`SQPrintStyle6`} className="PrintStyle6MasterDiv" style={{ fontFamily: "'Courier New', Courier, monospace", position: "relative", width: "100%", minHeight: isMobile ? (PageSize === "A5" ? "210mm" : "297mm") : "auto" }}>
|
||||||
|
|
||||||
{paginatedChunks.map((dataChunk, chunkIndex) => (
|
{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={`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: "fixed", top: 0, width: "100%" }}> */}
|
||||||
<div className="header" style={{ position: isMobile ? GlobaldummyData ? "absolute" : "fixed" : "", top: 0, width: "100%" }}>
|
<div className="header" style={{ position: isMobile ? GlobaldummyData ? "absolute" : "fixed" : "", top: 0, width: "100%" }}>
|
||||||
<div className="PrintStyle6-firstDiv">
|
<div className="PrintStyle6-firstDiv" style={{...headerStyle}}>
|
||||||
<div className="P6HdBrnchName" style={{ fontSize: 'clamp(1.2rem, 2.5vw, 1.8rem)', fontWeight: '600' }}>
|
<div className="P6HdBrnchName" style={{ fontSize: 'clamp(1.2rem, 2.5vw, 1.8rem)', fontWeight: '600' }}>
|
||||||
{GlobaldummyData ? "XYZ Shop" : table2Data?.[0]?.BrName}
|
{GlobaldummyData ? "XYZ Shop" : table2Data?.[0]?.BrName}
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -140,31 +208,31 @@ const PurPrintstyle6 = ({
|
||||||
<table className="PrintStyle6-print-table">
|
<table className="PrintStyle6-print-table">
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
{SLNO && <th style={{ width: "10px", }}>S.No</th>}
|
{SLNO && <th style={{ width: "10px", ...tableHeaderStyle }}>S.No</th>}
|
||||||
{(
|
{(
|
||||||
<th style={{ width: "10px", }}>
|
<th style={{ width: "10px", ...tableHeaderStyle }}>
|
||||||
{Item && "ITEM /DES/"}{" "}
|
{Item && "ITEM /DES/"}{" "}
|
||||||
{Quantity && "QTY"}
|
{Quantity && "QTY"}
|
||||||
</th>
|
</th>
|
||||||
)}
|
)}
|
||||||
{HsnCode && (
|
{HsnCode && (
|
||||||
<th style={{ width: "10px", textAlign: "right", }}>HSN</th>
|
<th style={{ width: "10px", textAlign: "right", ...tableHeaderStyle }}>HSN</th>
|
||||||
)}
|
)}
|
||||||
{MRP && (
|
{MRP && (
|
||||||
<th style={{ width: "10px", textAlign: "right", }}>MRP</th>
|
<th style={{ width: "10px", textAlign: "right", ...tableHeaderStyle }}>MRP</th>
|
||||||
)}
|
)}
|
||||||
{Discount && (
|
{Discount && (
|
||||||
<th style={{ width: "10px", textAlign: "right", }}>
|
<th style={{ width: "10px", textAlign: "right", ...tableHeaderStyle }}>
|
||||||
Dis{" "}
|
Dis{" "}
|
||||||
</th>
|
</th>
|
||||||
)}
|
)}
|
||||||
{Rate && (
|
{Rate && (
|
||||||
<th style={{ width: "10px", textAlign: "right", }}>
|
<th style={{ width: "10px", textAlign: "right", ...tableHeaderStyle }}>
|
||||||
Rate
|
Rate
|
||||||
</th>
|
</th>
|
||||||
)}
|
)}
|
||||||
{Amount && (
|
{Amount && (
|
||||||
<th style={{ width: "10px", textAlign: "right", }}>
|
<th style={{ width: "10px", textAlign: "right", ...tableHeaderStyle }}>
|
||||||
Amt
|
Amt
|
||||||
</th>
|
</th>
|
||||||
)}
|
)}
|
||||||
|
|
@ -174,7 +242,17 @@ const PurPrintstyle6 = ({
|
||||||
{dataChunk?.map(
|
{dataChunk?.map(
|
||||||
(item, index) => {
|
(item, index) => {
|
||||||
return (
|
return (
|
||||||
<tr key={index}>
|
<tr key={index} style={
|
||||||
|
index % 2 !== 1 && rowtypeStyle === "even"
|
||||||
|
? {
|
||||||
|
...tableBodyStyle
|
||||||
|
}
|
||||||
|
: index % 2 === 1 && rowtypeStyle === "odd"
|
||||||
|
? {
|
||||||
|
...tableBodyStyle
|
||||||
|
}
|
||||||
|
: {}
|
||||||
|
}>
|
||||||
{SLNO && <td>{chunkIndex * chunkSize + index + 1}</td>}
|
{SLNO && <td>{chunkIndex * chunkSize + index + 1}</td>}
|
||||||
{(
|
{(
|
||||||
<td
|
<td
|
||||||
|
|
@ -381,7 +459,7 @@ const PurPrintstyle6 = ({
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
<div className="PrintStyle6-secondDiv">
|
<div className="PrintStyle6-secondDiv" style={{...netAmountStyle}}>
|
||||||
<div style={{ textAlign: "left", fontSize: "clamp(1rem, 2.5vw, 1.2rem)", fontWeight: '600' }}>
|
<div style={{ textAlign: "left", fontSize: "clamp(1rem, 2.5vw, 1.2rem)", fontWeight: '600' }}>
|
||||||
Amount
|
Amount
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -449,6 +527,7 @@ const PurPrintstyle6 = ({
|
||||||
pageBreakBefore: "avoid",
|
pageBreakBefore: "avoid",
|
||||||
pageBreakInside: "avoid",
|
pageBreakInside: "avoid",
|
||||||
minHeight: "auto",
|
minHeight: "auto",
|
||||||
|
...footerColorStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{GlobaldummyData ? GlobalIsnotes &&
|
{GlobaldummyData ? GlobalIsnotes &&
|
||||||
|
|
@ -533,7 +612,7 @@ const PurPrintstyle6 = ({
|
||||||
|
|
||||||
<hr className="PrintStyle6-HrLine" />
|
<hr className="PrintStyle6-HrLine" />
|
||||||
|
|
||||||
<div className="align-style6" style={{ display: "flex", alignItems: "center", justifyContent: "space-evenly", margin: "0rem 1.5rem", fontSize: "clamp(0.65rem, 2.5vw, 1rem)", fontWeight: '600' }}>
|
<div className="align-style6" style={{ ...netAmountStyle, display: "flex", alignItems: "center", justifyContent: "space-evenly", margin: "0rem 1.5rem", fontSize: "clamp(0.65rem, 2.5vw, 1rem)", fontWeight: '600' }}>
|
||||||
<div>
|
<div>
|
||||||
<div>Items :{GlobaldummyData ? "8" : totalQuantityFilter?.length} </div>
|
<div>Items :{GlobaldummyData ? "8" : totalQuantityFilter?.length} </div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -671,8 +750,8 @@ const PurPrintstyle6 = ({
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<div className="PrintStyle6-secondDiv">
|
<div className="PrintStyle6-secondDiv"style={{...netAmountStyle}}>
|
||||||
<div style={{ textAlign: "left", fontSize: "clamp(1rem, 2.5vw, 1.2rem)", fontWeight: '600' }}>
|
<div style={{ textAlign: "left", fontSize: "clamp(1rem, 2.5vw, 1.2rem)", fontWeight: '600'}}>
|
||||||
Amount
|
Amount
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
@ -727,6 +806,7 @@ const PurPrintstyle6 = ({
|
||||||
pageBreakBefore: "avoid",
|
pageBreakBefore: "avoid",
|
||||||
pageBreakInside: "avoid",
|
pageBreakInside: "avoid",
|
||||||
minHeight: "auto",
|
minHeight: "auto",
|
||||||
|
...footerColorStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{
|
{
|
||||||
|
|
@ -769,7 +849,7 @@ const PurPrintstyle6 = ({
|
||||||
</div>
|
</div>
|
||||||
:
|
:
|
||||||
<div id={`SQPrintStyle6`} className="PrintStyle6MasterDiv" style={{ fontFamily: "'Courier New', Courier, monospace" }}>
|
<div id={`SQPrintStyle6`} className="PrintStyle6MasterDiv" style={{ fontFamily: "'Courier New', Courier, monospace" }}>
|
||||||
<div className="PrintStyle6-firstDiv">
|
<div className="PrintStyle6-firstDiv" style={{...headerStyle}}>
|
||||||
<div className="P6HdBrnchName" style={{ fontSize: 'clamp(1.2rem, 2.5vw, 1.8rem)', fontWeight: '600' }}>
|
<div className="P6HdBrnchName" style={{ fontSize: 'clamp(1.2rem, 2.5vw, 1.8rem)', fontWeight: '600' }}>
|
||||||
{table2Data?.[0]?.BrName}
|
{table2Data?.[0]?.BrName}
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -782,8 +862,6 @@ const PurPrintstyle6 = ({
|
||||||
<div style={{ fontSize: "clamp(0.65rem, 2.5vw, 1rem)", }}>
|
<div style={{ fontSize: "clamp(0.65rem, 2.5vw, 1rem)", }}>
|
||||||
Mobile : {table2Data?.[0]?.BrMobile}
|
Mobile : {table2Data?.[0]?.BrMobile}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
{<div style={{ textTransform: 'uppercase', fontSize: "clamp(0.75rem, 2.5vw, 1rem)", fontWeight: '600' }}>{BillName}</div>}
|
{<div style={{ textTransform: 'uppercase', fontSize: "clamp(0.75rem, 2.5vw, 1rem)", fontWeight: '600' }}>{BillName}</div>}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
@ -805,31 +883,31 @@ const PurPrintstyle6 = ({
|
||||||
<table className="PrintStyle6-print-table">
|
<table className="PrintStyle6-print-table">
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
{SLNO && <th style={{ width: "10px", }}>S.No</th>}
|
{SLNO && <th style={{ width: "10px", ...tableHeaderStyle }}>S.No</th>}
|
||||||
{(
|
{(
|
||||||
<th style={{ width: "10px", }}>
|
<th style={{ width: "10px", ...tableHeaderStyle }}>
|
||||||
{Item && "ITEM /DES/"}{" "}
|
{Item && "ITEM /DES/"}{" "}
|
||||||
{Quantity && "QTY"}
|
{Quantity && "QTY"}
|
||||||
</th>
|
</th>
|
||||||
)}
|
)}
|
||||||
{HsnCode && (
|
{HsnCode && (
|
||||||
<th style={{ width: "10px", textAlign: "right", }}>HSN</th>
|
<th style={{ width: "10px", textAlign: "right", ...tableHeaderStyle }}>HSN</th>
|
||||||
)}
|
)}
|
||||||
{MRP && (
|
{MRP && (
|
||||||
<th style={{ width: "10px", textAlign: "right", }}>MRP</th>
|
<th style={{ width: "10px", textAlign: "right", ...tableHeaderStyle }}>MRP</th>
|
||||||
)}
|
)}
|
||||||
{Discount && (
|
{Discount && (
|
||||||
<th style={{ width: "10px", textAlign: "right", }}>
|
<th style={{ width: "10px", textAlign: "right", ...tableHeaderStyle }}>
|
||||||
Dis{" "}
|
Dis{" "}
|
||||||
</th>
|
</th>
|
||||||
)}
|
)}
|
||||||
{Rate && (
|
{Rate && (
|
||||||
<th style={{ width: "10px", textAlign: "right", }}>
|
<th style={{ width: "10px", textAlign: "right", ...tableHeaderStyle }}>
|
||||||
Rate
|
Rate
|
||||||
</th>
|
</th>
|
||||||
)}
|
)}
|
||||||
{Amount && (
|
{Amount && (
|
||||||
<th style={{ width: "10px", textAlign: "right", }}>
|
<th style={{ width: "10px", textAlign: "right", ...tableHeaderStyle }}>
|
||||||
Amt
|
Amt
|
||||||
</th>
|
</th>
|
||||||
)}
|
)}
|
||||||
|
|
@ -839,7 +917,18 @@ const PurPrintstyle6 = ({
|
||||||
{(TakeawayData)?.map(
|
{(TakeawayData)?.map(
|
||||||
(item, index) => {
|
(item, index) => {
|
||||||
return (
|
return (
|
||||||
<tr key={index}>
|
<tr key={index}
|
||||||
|
style={
|
||||||
|
index % 2 !== 1 && rowtypeStyle === "even"
|
||||||
|
? {
|
||||||
|
...tableBodyStyle
|
||||||
|
}
|
||||||
|
: index % 2 === 1 && rowtypeStyle === "odd"
|
||||||
|
? {
|
||||||
|
...tableBodyStyle
|
||||||
|
}
|
||||||
|
: {}
|
||||||
|
}>
|
||||||
{SLNO && <td>{index + 1}</td>}
|
{SLNO && <td>{index + 1}</td>}
|
||||||
{(
|
{(
|
||||||
<td
|
<td
|
||||||
|
|
@ -906,7 +995,7 @@ const PurPrintstyle6 = ({
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
<div className="align-style6" style={{ display: "flex", alignItems: "center", justifyContent: "space-evenly", margin: "0rem 1.5rem", fontSize: "clamp(0.65rem, 2.5vw, 1rem)", fontWeight: '600' }}>
|
<div className="align-style6" style={{ ...netAmountStyle, display: "flex", alignItems: "center", justifyContent: "space-evenly", margin: "0rem 1.5rem", fontSize: "clamp(0.65rem, 2.5vw, 1rem)", fontWeight: '600' }}>
|
||||||
<div>
|
<div>
|
||||||
<div>Items :{GlobaldummyData ? "8" : totalQuantityFilter?.length} </div>
|
<div>Items :{GlobaldummyData ? "8" : totalQuantityFilter?.length} </div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -1045,8 +1134,8 @@ const PurPrintstyle6 = ({
|
||||||
{/* <div className="align-style"> <div>Qty : </div> <div>{GlobaldummyData ? '9' : totalQuantity}</div> </div> */}
|
{/* <div className="align-style"> <div>Qty : </div> <div>{GlobaldummyData ? '9' : totalQuantity}</div> </div> */}
|
||||||
|
|
||||||
|
|
||||||
<div className="PrintStyle6-secondDiv">
|
<div className="PrintStyle6-secondDiv" style={{...netAmountStyle}}>
|
||||||
<div style={{ textAlign: "left", fontSize: "clamp(1rem, 2.5vw, 1.2rem)", fontWeight: '600' }}>
|
<div style={{ textAlign: "left", fontSize: "clamp(1rem, 2.5vw, 1.2rem)", fontWeight: '600'}}>
|
||||||
Amount
|
Amount
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
@ -1097,6 +1186,7 @@ const PurPrintstyle6 = ({
|
||||||
pageBreakBefore: "avoid",
|
pageBreakBefore: "avoid",
|
||||||
pageBreakInside: "avoid",
|
pageBreakInside: "avoid",
|
||||||
minHeight: "auto",
|
minHeight: "auto",
|
||||||
|
...footerColorStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{
|
{
|
||||||
|
|
|
||||||
|
|
@ -4,7 +4,18 @@ import { useDispatch, useSelector } from "react-redux";
|
||||||
import {
|
import {
|
||||||
GlobalPritdummyData,
|
GlobalPritdummyData,
|
||||||
changeReprintDataFound,
|
changeReprintDataFound,
|
||||||
GlobalprinttermsAndConditions
|
GlobalprinttermsAndConditions,
|
||||||
|
GlobalSelectedPrintHeaderColor,
|
||||||
|
GlobalSelectedPrintHeaderFontColor,
|
||||||
|
GlobalSelectedTableHeaderColor,
|
||||||
|
GlobalSelectedTableHeaderFontColor,
|
||||||
|
GlobalSelectedTableBodyColor,
|
||||||
|
GlobalSelectedTableBodyFontColor,
|
||||||
|
GlobalRowType,
|
||||||
|
GlobalSelectedFooterColor,
|
||||||
|
GlobalSelectedFooterFontColor,
|
||||||
|
GlobalSelectedNetAmountColor,
|
||||||
|
GlobalSelectedNetAmountFontColor,
|
||||||
} from '../../../Features/ThemeChange/ThemeChange';
|
} from '../../../Features/ThemeChange/ThemeChange';
|
||||||
import "../../../Styles/BookingScreen/PrintTemplates/ThermalPrinter/PrintStyle7.scss"
|
import "../../../Styles/BookingScreen/PrintTemplates/ThermalPrinter/PrintStyle7.scss"
|
||||||
import { extractLastNumber } from "../../../Services/Others";
|
import { extractLastNumber } from "../../../Services/Others";
|
||||||
|
|
@ -16,10 +27,10 @@ const PurPrintStyle7 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
|
|
||||||
const dispatch = useDispatch();
|
const dispatch = useDispatch();
|
||||||
|
|
||||||
const FieldDetails = printDatas?.FieldDetails?.reduce((acc, item) => {
|
const FieldDetails = printDatas?.FieldDetails?.reduce((acc, item) => {
|
||||||
acc[item.ConfigName] = true;
|
acc[item.ConfigName] = true;
|
||||||
return acc;
|
return acc;
|
||||||
}, {});
|
}, {});
|
||||||
|
|
||||||
const SLNO = FieldDetails?.["Sl.No"];
|
const SLNO = FieldDetails?.["Sl.No"];
|
||||||
const Item = FieldDetails?.["Item"];
|
const Item = FieldDetails?.["Item"];
|
||||||
|
|
@ -29,12 +40,27 @@ const PurPrintStyle7 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
const Rate = FieldDetails?.["Rate"];
|
const Rate = FieldDetails?.["Rate"];
|
||||||
const Amount = FieldDetails?.["Amount"];
|
const Amount = FieldDetails?.["Amount"];
|
||||||
const HsnCode = FieldDetails?.["HsnCode"];
|
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 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 TermsAndConditions = printDatas?.TermsandConditions
|
||||||
let SignatureImg = printDatas?.Signature
|
let SignatureImg = printDatas?.Signature
|
||||||
let Notestext = printDatas?.Notes
|
let Notestext = printDatas?.Notes
|
||||||
|
|
@ -43,41 +69,66 @@ const PurPrintStyle7 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
let PageSize = printDatas?.PageSize
|
let PageSize = printDatas?.PageSize
|
||||||
const Signature = FieldDetails?.["signature"];
|
const Signature = FieldDetails?.["signature"];
|
||||||
const TermsnAdCondition = FieldDetails?.["terms&conditions"];
|
const TermsnAdCondition = FieldDetails?.["terms&conditions"];
|
||||||
|
|
||||||
|
|
||||||
const keysLength = Object.keys(table2Data ?? {}).length;
|
const keysLength = Object.keys(table2Data ?? {}).length;
|
||||||
if (keysLength > 0) {
|
if (keysLength > 0) {
|
||||||
dispatch(changeReprintDataFound(true));
|
dispatch(changeReprintDataFound(true));
|
||||||
}
|
}
|
||||||
|
const TakeawayData = table2Data?.[0]?.ProductDetails
|
||||||
|
|
||||||
const TakeawayData = table2Data?.[0]?.ProductDetails
|
|
||||||
console.log(TakeawayData, "TakeawayData", table2Data)
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
let TotalOfferAmount = 0;
|
let TotalOfferAmount = 0;
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
const chunkSize = PageSize == "A5" ? 8 : 11;
|
const chunkSize = PageSize == "A5" ? 8 : 11;
|
||||||
let dataSource = table2Data?.[0]?.ProductDetails;
|
let dataSource = table2Data?.[0]?.ProductDetails;
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// Paginate the data
|
// Paginate the data
|
||||||
const paginatedChunks = [];
|
const paginatedChunks = [];
|
||||||
for (let i = 0; i < dataSource?.length; i += chunkSize) {
|
for (let i = 0; i < dataSource?.length; i += chunkSize) {
|
||||||
paginatedChunks.push(dataSource?.slice(i, i + chunkSize));
|
paginatedChunks.push(dataSource?.slice(i, i + chunkSize));
|
||||||
}
|
}
|
||||||
const lastChunkRows = paginatedChunks.length > 0 ? paginatedChunks[paginatedChunks.length - 1].length : 0;
|
const lastChunkRows = paginatedChunks.length > 0 ? paginatedChunks[paginatedChunks.length - 1].length : 0;
|
||||||
const shouldFooterBeOnNewPage = lastChunkRows > (PageSize == "A5" ? 5 : 10);
|
const shouldFooterBeOnNewPage = lastChunkRows > (PageSize == "A5" ? 5 : 10);
|
||||||
{ console.log(TakeawayData, "TakeawayDataTakeawayData") }
|
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 (
|
return (
|
||||||
<>
|
<>
|
||||||
|
|
@ -87,15 +138,15 @@ const PurPrintStyle7 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
<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={`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: isMobile ? GlobaldummyData ? "absolute" : "fixed" : "", top: 0, width: "100%" }}>
|
<div className="header" style={{ position: isMobile ? GlobaldummyData ? "absolute" : "fixed" : "", top: 0, width: "100%" }}>
|
||||||
<hr class="star-line" />
|
<hr class="star-line" />
|
||||||
<div className="PrintStyle7-print">
|
<div className="PrintStyle7-print" style={{...headerStyle}}>
|
||||||
<div style={{ fontSize: '16px', fontWeight: '600' }}> { table2Data?.[0]?.BrName}</div>
|
<div style={{ fontSize: '16px', fontWeight: '600' }}> {table2Data?.[0]?.BrName}</div>
|
||||||
<div style={{ fontSize: '10px', fontWeight: '600' }} >{GlobaldummyData ?
|
<div style={{ fontSize: '10px', fontWeight: '600' }} >{GlobaldummyData ?
|
||||||
'BranchAddress, Town- 635XXX City - State' :
|
'BranchAddress, Town- 635XXX City - State' :
|
||||||
(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 : '')}
|
(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>
|
||||||
{ <div style={{ fontSize: "12px", margin: "2px 0 0 0", textTransform: 'uppercase' }}>{BillName} </div>}
|
{<div style={{ fontSize: "12px", margin: "2px 0 0 0", textTransform: 'uppercase' }}>{BillName} </div>}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<hr className="PrintStyle7-print-dottline" />
|
<hr className="PrintStyle7-print-dottline" />
|
||||||
|
|
@ -115,7 +166,7 @@ const PurPrintStyle7 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
<div style={{ marginTop: GlobaldummyData ? "9rem" : "0rem" }} className="print-body">
|
<div style={{ marginTop: GlobaldummyData ? "9rem" : "0rem" }} className="print-body">
|
||||||
<div className="PrintStyle7-print-table" >
|
<div className="PrintStyle7-print-table" >
|
||||||
|
|
||||||
{(TakeawayData?.length > 0 ) &&
|
{(TakeawayData?.length > 0) &&
|
||||||
<>
|
<>
|
||||||
<div className="PrintStyle7-print-tableMaster">
|
<div className="PrintStyle7-print-tableMaster">
|
||||||
|
|
||||||
|
|
@ -123,30 +174,41 @@ const PurPrintStyle7 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
<table className="PrintStyle7-print-table">
|
<table className="PrintStyle7-print-table">
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
{ SLNO == true && <th style={{ width: '10px', }}>S</th>}
|
{SLNO == true && <th style={{ width: '10px', ...tableHeaderStyle }}>S.No</th>}
|
||||||
{ Item == true && <th>Item</th>}
|
{Item == true && <th style={{ ...tableHeaderStyle }}>Item</th>}
|
||||||
{ HsnCode == true && <th style={{ width: '10px', }}>HSN</th>}
|
{HsnCode == true && <th style={{ width: '10px', ...tableHeaderStyle }}>HSN</th>}
|
||||||
{ Quantity == true && <th style={{ width: '10px', }}>Qty</th>}
|
{Quantity == true && <th style={{ width: '10px', ...tableHeaderStyle }}>Qty</th>}
|
||||||
{GlobaldummyData ? GlobalMRP && <th style={{ width: '10px' }}>MRP</th> : MRP == true && <th style={{ width: '10px' }}>MRP</th>}
|
{GlobaldummyData ? GlobalMRP && <th style={{ width: '10px', ...tableHeaderStyle }}>MRP</th> : MRP == true && <th style={{...tableHeaderStyle, width: '10px' }}>MRP</th>}
|
||||||
{GlobaldummyData ? GlobalRate && <th style={{ width: '10px' }}>Rate</th> : Rate == true && <th style={{ width: '10px' }}>Rate</th>}
|
{GlobaldummyData ? GlobalRate && <th style={{ width: '10px', ...tableHeaderStyle }}>Rate</th> : Rate == true && <th style={{...tableHeaderStyle, width: '10px' }}>Rate</th>}
|
||||||
{ Discount == true && <th style={{ width: '10px' }}>Dis </th>}
|
{Discount == true && <th style={{ width: '10px', ...tableHeaderStyle }}>Dis </th>}
|
||||||
{ Amount == true && <th style={{ width: '10px', textAlign: 'right' }}>Amt</th>}
|
{Amount == true && <th style={{ width: '10px', textAlign: 'right', ...tableHeaderStyle }}>Amt</th>}
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
{dataChunk?.map((item, index) => (
|
{dataChunk?.map((item, index) => (
|
||||||
<tr key={index} >
|
<tr key={index}
|
||||||
{ SLNO == true && <td style={{ textAlign: 'center' }}>{chunkIndex * chunkSize + index + 1}</td>}
|
style={
|
||||||
{ Item == true && <td style={{ display: 'flex', flexDirection: 'column' }}>
|
index % 2 !== 1 && rowtypeStyle === "even"
|
||||||
<div>{item?.ProdName}</div>
|
? {
|
||||||
<div>({item?.Size ? item?.Size : "1"} {item?.SinglePc == 'Y' ? 'PCS' : item?.Type != "C" ? item?.UomName : "COMBO"})</div>
|
...tableBodyStyle
|
||||||
</td>}
|
}
|
||||||
{ HsnCode == true && <td style={{ textAlign: 'center' }}>{item?.HSN}</td>}
|
: index % 2 === 1 && rowtypeStyle === "odd"
|
||||||
{ Quantity == true && <td style={{ textAlign: 'center' }}>{item?.Qty}</td>}
|
? {
|
||||||
{ MRP == true && <td style={{ textAlign: 'right' }}>{item?.SinglePc === 'Y' ? item?.Price : item?.MRP}</td>}
|
...tableBodyStyle
|
||||||
|
}
|
||||||
|
: {}
|
||||||
|
}>
|
||||||
|
{SLNO == true && <td style={{ textAlign: 'center' }}>{chunkIndex * chunkSize + index + 1}</td>}
|
||||||
|
{Item == true && <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"})</div>
|
||||||
|
</td>}
|
||||||
|
{HsnCode == true && <td style={{ textAlign: 'center' }}>{item?.HSN}</td>}
|
||||||
|
{Quantity == true && <td style={{ textAlign: 'center' }}>{item?.Qty}</td>}
|
||||||
|
{MRP == true && <td style={{ textAlign: 'right' }}>{item?.SinglePc === 'Y' ? item?.Price : item?.MRP}</td>}
|
||||||
{Rate == true && <td style={{ textAlign: 'right' }}>{item?.Price}</td>}
|
{Rate == true && <td style={{ textAlign: 'right' }}>{item?.Price}</td>}
|
||||||
{ Discount == true && <td style={{ textAlign: 'right' }}>{item?.Type != "C" ? item?.OfferAmt || 0 : item?.OfferValue || 0}</td>}
|
{Discount == true && <td style={{ textAlign: 'right' }}>{item?.Type != "C" ? item?.OfferAmt || 0 : item?.OfferValue || 0}</td>}
|
||||||
{ Amount == true && <td style={{ textAlign: 'right' }}>{item?.NetAmt?.toFixed(2)}</td>}
|
{Amount == true && <td style={{ textAlign: 'right' }}>{item?.NetAmt?.toFixed(2)}</td>}
|
||||||
</tr>
|
</tr>
|
||||||
))}
|
))}
|
||||||
</tbody>
|
</tbody>
|
||||||
|
|
@ -161,10 +223,10 @@ const PurPrintStyle7 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
{((chunkIndex === paginatedChunks.length - 1) && (!shouldFooterBeOnNewPage)) && FormatTheme &&
|
{((chunkIndex === paginatedChunks.length - 1) && (!shouldFooterBeOnNewPage)) && FormatTheme &&
|
||||||
<>
|
<>
|
||||||
<div className='PrintStyle7-SecondDiv3'>
|
<div className='PrintStyle7-SecondDiv3'>
|
||||||
<div className='PrintStyle7-SecondDivMaster'>
|
<div className='PrintStyle7-SecondDivMaster' style={{ ...netAmountStyle }}>
|
||||||
<div style={{ fontWeight: "600" }}>Items : { totalQuantityFilter?.length}</div>
|
<div style={{ fontWeight: "600" }}>Items : {totalQuantityFilter?.length}</div>
|
||||||
<div style={{ fontWeight: "600" }}>Qty : { totalQuantity}</div>
|
<div style={{ fontWeight: "600" }}>Qty : {totalQuantity}</div>
|
||||||
{(table2Data?.OverallDisc > 0 || TotalOfferAmount > 0) && <div style={{ fontWeight: "600" }}>Off : { Number(TotalOfferAmount + table2Data?.OverallDisc).toFixed(2)}</div>}
|
{(table2Data?.OverallDisc > 0 || TotalOfferAmount > 0) && <div style={{ fontWeight: "600" }}>Off : {Number(TotalOfferAmount + table2Data?.OverallDisc).toFixed(2)}</div>}
|
||||||
</div>
|
</div>
|
||||||
<div style={{ display: 'flex', justifyContent: 'center' }}>
|
<div style={{ display: 'flex', justifyContent: 'center' }}>
|
||||||
<div>
|
<div>
|
||||||
|
|
@ -294,11 +356,11 @@ const PurPrintStyle7 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
<div style={{ display: 'flex', justifyContent: 'center', fontSize: '16px', fontWeight: '600' }}>Amount : ₹{GlobaldummyData ? '1,066' : Number(table2Data?.[0]?.NetAmount).toFixed(2)}</div>
|
<div style={{ display: 'flex', justifyContent: 'center', fontSize: '16px', fontWeight: '600' }}>Amount : ₹{GlobaldummyData ? '1,066' : Number(table2Data?.[0]?.NetAmount).toFixed(2)}</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
{table2Data?.CustSuppName && table2Data?.CustSuppName !== undefined && table2Data?.CustSuppName !== null && !GlobaldummyData &&
|
{table2Data?.CustSuppName && table2Data?.CustSuppName !== undefined && table2Data?.CustSuppName !== null && !GlobaldummyData &&
|
||||||
<div>
|
<div>
|
||||||
<div style={{ marginLeft: '13px', padding: 0, fontSize: "8px", fontWeight: "600" }}>Customer : {table2Data?.CustSuppName}</div>
|
<div style={{ marginLeft: '13px', padding: 0, fontSize: "8px", fontWeight: "600" }}>Customer : {table2Data?.CustSuppName}</div>
|
||||||
|
|
@ -315,6 +377,7 @@ const PurPrintStyle7 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
pageBreakBefore: "avoid",
|
pageBreakBefore: "avoid",
|
||||||
pageBreakInside: "avoid",
|
pageBreakInside: "avoid",
|
||||||
minHeight: "auto",
|
minHeight: "auto",
|
||||||
|
...footerColorStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{
|
{
|
||||||
|
|
@ -339,7 +402,7 @@ const PurPrintStyle7 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
</div>)
|
</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>
|
<p style={{ fontSize: "13px", fontWeight: "bold", marginBottom: "6px" }}>Signature</p>
|
||||||
<img style={{ width: "100px", height: "60px" }} src={SignatureImg} alt="" />
|
<img style={{ width: "100px", height: "60px" }} src={SignatureImg} alt="" />
|
||||||
</div>)}
|
</div>)}
|
||||||
|
|
@ -349,7 +412,7 @@ const PurPrintStyle7 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</>
|
</>
|
||||||
}
|
}
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -376,10 +439,10 @@ const PurPrintStyle7 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
>
|
>
|
||||||
<>
|
<>
|
||||||
<div className='PrintStyle7-SecondDiv3'>
|
<div className='PrintStyle7-SecondDiv3'>
|
||||||
<div className='PrintStyle7-SecondDivMaster'>
|
<div className='PrintStyle7-SecondDivMaster' style={{ ...netAmountStyle }}>
|
||||||
<div style={{ fontWeight: "600" }}>Items : { totalQuantityFilter?.length}</div>
|
<div style={{ fontWeight: "600" }}>Items : {totalQuantityFilter?.length}</div>
|
||||||
<div style={{ fontWeight: "600" }}>Qty : { totalQuantity}</div>
|
<div style={{ fontWeight: "600" }}>Qty : {totalQuantity}</div>
|
||||||
{(table2Data?.OverallDisc > 0 || TotalOfferAmount > 0) && <div style={{ fontWeight: "600" }}>Off : { Number(TotalOfferAmount + table2Data?.OverallDisc).toFixed(2)}</div>}
|
{(table2Data?.OverallDisc > 0 || TotalOfferAmount > 0) && <div style={{ fontWeight: "600" }}>Off : {Number(TotalOfferAmount + table2Data?.OverallDisc).toFixed(2)}</div>}
|
||||||
</div>
|
</div>
|
||||||
<div style={{ display: 'flex', justifyContent: 'center' }}>
|
<div style={{ display: 'flex', justifyContent: 'center' }}>
|
||||||
<div>
|
<div>
|
||||||
|
|
@ -506,36 +569,28 @@ const PurPrintStyle7 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div style={{ display: 'flex', justifyContent: 'center', fontSize: '16px', fontWeight: '600' }}>Amount : ₹{ Number(table2Data?.[0]?.NetAmount).toFixed(2)}</div>
|
<div style={{ display: 'flex', justifyContent: 'center', fontSize: '16px', fontWeight: '600' }}>Amount : ₹{Number(table2Data?.[0]?.NetAmount).toFixed(2)}</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
{table2Data?.CustSuppName && table2Data?.CustSuppName !== undefined && table2Data?.CustSuppName !== null && !GlobaldummyData &&
|
{table2Data?.CustSuppName && table2Data?.CustSuppName !== undefined && table2Data?.CustSuppName !== null && !GlobaldummyData &&
|
||||||
<div>
|
<div>
|
||||||
<div style={{ marginLeft: '13px', padding: 0, fontSize: "8px", fontWeight: "600" }}>Customer : {table2Data?.CustSuppName}</div>
|
<div style={{ marginLeft: '13px', padding: 0, fontSize: "8px", fontWeight: "600" }}>Customer : {table2Data?.CustSuppName}</div>
|
||||||
</div>
|
</div>
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<div className="page-footerA4Style11"
|
<div className="page-footerA4Style11"
|
||||||
style={{
|
style={{
|
||||||
marginTop: "auto",
|
marginTop: "auto",
|
||||||
pageBreakBefore: "avoid",
|
pageBreakBefore: "avoid",
|
||||||
pageBreakInside: "avoid",
|
pageBreakInside: "avoid",
|
||||||
minHeight: "auto",
|
minHeight: "auto",
|
||||||
|
...footerColorStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<div style={{ display: "flex", width: "90%", padding: "0 1rem", justifyContent: GlobaltermsAndConditions ? "space-between" : "flex-end", alignItems: "center" }}>
|
<div style={{ display: "flex", width: "90%", padding: "0 1rem", justifyContent: GlobaltermsAndConditions ? "space-between" : "flex-end", alignItems: "center" }}>
|
||||||
{
|
{
|
||||||
(TermsnAdCondition == true && TermsAndConditions?.length > 0) && (<div style={{ margin: "8px 0", fontFamily: "sans-serif", width: "100%", display: "flex", flexDirection: "column", alignItems: "flex-start" }}>
|
(TermsnAdCondition == true && TermsAndConditions?.length > 0) && (<div style={{ margin: "8px 0", fontFamily: "sans-serif", width: "100%", display: "flex", flexDirection: "column", alignItems: "flex-start" }}>
|
||||||
|
|
@ -549,32 +604,27 @@ const PurPrintStyle7 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
</div>)
|
</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>
|
<p style={{ fontSize: "13px", fontWeight: "bold", marginBottom: "6px" }}>Signature</p>
|
||||||
<img style={{ width: "100px", height: "60px" }} src={SignatureImg} alt="" />
|
<img style={{ width: "100px", height: "60px" }} src={SignatureImg} alt="" />
|
||||||
</div>)}
|
</div>)}
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</>
|
</>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
}
|
}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
:
|
:
|
||||||
<div className="PrintStyle7MasterDiv" id={`SQPrintStyle7`} style={{ fontFamily: "'Courier New', Courier, monospace" }}>
|
<div className="PrintStyle7MasterDiv" id={`SQPrintStyle7`} style={{ fontFamily: "'Courier New', Courier, monospace" }}>
|
||||||
<hr class="star-line" />
|
<hr class="star-line" />
|
||||||
<div className="PrintStyle7-print">
|
<div className="PrintStyle7-print" style={{...headerStyle}}>
|
||||||
<div style={{ fontSize: '16px', fontWeight: '600' }}> { table2Data?.[0]?.BrName}</div>
|
<div style={{ fontSize: '16px', fontWeight: '600' }}> {table2Data?.[0]?.BrName}</div>
|
||||||
<div style={{ fontSize: '10px', fontWeight: '600' }} >{
|
<div style={{ fontSize: '10px', 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 : '')}
|
(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>
|
||||||
{ <div style={{ fontSize: "12px", margin: "2px 0 0 0", textTransform: 'uppercase' }}>{BillName} </div>}
|
{<div style={{ fontSize: "12px", margin: "2px 0 0 0", textTransform: 'uppercase' }}>{BillName} </div>}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<hr className="PrintStyle7-print-dottline" />
|
<hr className="PrintStyle7-print-dottline" />
|
||||||
|
|
@ -582,7 +632,7 @@ const PurPrintStyle7 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
<div className='PrintStyle7-SecondDivMaster'>
|
<div className='PrintStyle7-SecondDivMaster'>
|
||||||
<div className='PrintStyle7-SecondDiv'>
|
<div className='PrintStyle7-SecondDiv'>
|
||||||
<div className='PrintStyle7-SecondDiv-wordings' style={{ fontSize: "10px", fontWeight: "600" }} >Bill No :{
|
<div className='PrintStyle7-SecondDiv-wordings' style={{ fontSize: "10px", fontWeight: "600" }} >Bill No :{
|
||||||
table2Data?.[0]?.QuotationNo && extractLastNumber(table2Data?.[0]?.QuotationNo)
|
table2Data?.[0]?.QuotationNo && extractLastNumber(table2Data?.[0]?.QuotationNo)
|
||||||
}</div>
|
}</div>
|
||||||
</div>
|
</div>
|
||||||
<div className='PrintStyle7-SecondDiv2'>
|
<div className='PrintStyle7-SecondDiv2'>
|
||||||
|
|
@ -604,30 +654,41 @@ const PurPrintStyle7 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
<table className="PrintStyle7-print-table">
|
<table className="PrintStyle7-print-table">
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
{ SLNO == true && <th style={{ width: '10px', }}>S</th>}
|
{SLNO == true && <th style={{ width: '10px', ...tableHeaderStyle }}>S.No</th>}
|
||||||
{ Item == true && <th>Item</th>}
|
{Item == true && <th style={{ ...tableHeaderStyle }}>Item</th>}
|
||||||
{ HsnCode == true && <th style={{ width: '10px', }}>HSN</th>}
|
{HsnCode == true && <th style={{ width: '10px', ...tableHeaderStyle }}>HSN</th>}
|
||||||
{ Quantity == true && <th style={{ width: '10px', }}>Qty</th>}
|
{Quantity == true && <th style={{ width: '10px', ...tableHeaderStyle }}>Qty</th>}
|
||||||
{ MRP == true && <th style={{ width: '10px' }}>MRP</th>}
|
{MRP == true && <th style={{ width: '10px', ...tableHeaderStyle }}>MRP</th>}
|
||||||
{ Rate == true && <th style={{ width: '10px' }}>Rate</th>}
|
{Rate == true && <th style={{ width: '10px', ...tableHeaderStyle }}>Rate</th>}
|
||||||
{ Discount == true && <th style={{ width: '10px' }}>Dis </th>}
|
{Discount == true && <th style={{ width: '10px', ...tableHeaderStyle }}>Dis </th>}
|
||||||
{ Amount == true && <th style={{ width: '10px', textAlign: 'right' }}>Amt</th>}
|
{Amount == true && <th style={{ width: '10px', textAlign: 'right', ...tableHeaderStyle }}>Amt</th>}
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
{(GlobaldummyData ? products : TakeawayData)?.map((item, index) => (
|
{(GlobaldummyData ? products : TakeawayData)?.map((item, index) => (
|
||||||
<tr key={index} >
|
<tr key={index}
|
||||||
{ SLNO == true && <td style={{ textAlign: 'center' }}>{index + 1}</td>}
|
style={
|
||||||
{ Item == true && <td style={{ display: 'flex', flexDirection: 'column' }}>
|
index % 2 !== 1 && rowtypeStyle === "even"
|
||||||
<div>{item?.ProdName}</div>
|
? {
|
||||||
<div>({item?.Size ? item?.Size : "1"} {item?.SinglePc == 'Y' ? 'PCS' : item?.Type != "C" ? item?.UomName : "COMBO"})</div>
|
...tableBodyStyle
|
||||||
</td>}
|
}
|
||||||
{ HsnCode == true && <td style={{ textAlign: 'center' }}>{item?.HSN}</td>}
|
: index % 2 === 1 && rowtypeStyle === "odd"
|
||||||
{ Quantity == true && <td style={{ textAlign: 'center' }}>{item?.Qty}</td>}
|
? {
|
||||||
{ MRP == true && <td style={{ textAlign: 'right' }}>{item?.SinglePc === 'Y' ? item?.Price : item?.MRP}</td>}
|
...tableBodyStyle
|
||||||
|
}
|
||||||
|
: {}
|
||||||
|
}>
|
||||||
|
{SLNO == true && <td style={{ textAlign: 'center' }}>{index + 1}</td>}
|
||||||
|
{Item == true && <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"})</div>
|
||||||
|
</td>}
|
||||||
|
{HsnCode == true && <td style={{ textAlign: 'center' }}>{item?.HSN}</td>}
|
||||||
|
{Quantity == true && <td style={{ textAlign: 'center' }}>{item?.Qty}</td>}
|
||||||
|
{MRP == true && <td style={{ textAlign: 'right' }}>{item?.SinglePc === 'Y' ? item?.Price : item?.MRP}</td>}
|
||||||
{Rate == true && <td style={{ textAlign: 'right' }}>{item?.Price}</td>}
|
{Rate == true && <td style={{ textAlign: 'right' }}>{item?.Price}</td>}
|
||||||
{ Discount == true && <td style={{ textAlign: 'right' }}>{item?.Type != "C" ? item?.OfferAmt || 0 : item?.OfferValue || 0}</td>}
|
{Discount == true && <td style={{ textAlign: 'right' }}>{item?.Type != "C" ? item?.OfferAmt || 0 : item?.OfferValue || 0}</td>}
|
||||||
{ Amount == true && <td style={{ textAlign: 'right' }}>{item?.NetAmt?.toFixed(2)}</td>}
|
{Amount == true && <td style={{ textAlign: 'right' }}>{item?.NetAmt?.toFixed(2)}</td>}
|
||||||
</tr>
|
</tr>
|
||||||
))}
|
))}
|
||||||
</tbody>
|
</tbody>
|
||||||
|
|
@ -638,10 +699,10 @@ const PurPrintStyle7 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className='PrintStyle7-SecondDiv3'>
|
<div className='PrintStyle7-SecondDiv3'>
|
||||||
<div className='PrintStyle7-SecondDivMaster'>
|
<div className='PrintStyle7-SecondDivMaster' style={{ ...netAmountStyle }}>
|
||||||
<div style={{ fontWeight: "600" }}>Items : { totalQuantityFilter?.length}</div>
|
<div style={{ fontWeight: "600" }}>Items : {totalQuantityFilter?.length}</div>
|
||||||
<div style={{ fontWeight: "600" }}>Qty : { totalQuantity}</div>
|
<div style={{ fontWeight: "600" }}>Qty : {totalQuantity}</div>
|
||||||
{(table2Data?.OverallDisc > 0 || TotalOfferAmount > 0) && <div style={{ fontWeight: "600" }}>Off : { Number(TotalOfferAmount + table2Data?.OverallDisc).toFixed(2)}</div>}
|
{(table2Data?.OverallDisc > 0 || TotalOfferAmount > 0) && <div style={{ fontWeight: "600" }}>Off : {Number(TotalOfferAmount + table2Data?.OverallDisc).toFixed(2)}</div>}
|
||||||
</div>
|
</div>
|
||||||
<div style={{ display: 'flex', justifyContent: 'center' }}>
|
<div style={{ display: 'flex', justifyContent: 'center' }}>
|
||||||
<div>
|
<div>
|
||||||
|
|
@ -768,10 +829,10 @@ const PurPrintStyle7 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div style={{ display: 'flex', justifyContent: 'center', fontSize: '16px', fontWeight: '600' }}>Amount : ₹{ Number(table2Data?.[0]?.NetAmount).toFixed(2)}</div>
|
<div style={{ display: 'flex', justifyContent: 'center', fontSize: '16px', fontWeight: '600' }}>Amount : ₹{Number(table2Data?.[0]?.NetAmount).toFixed(2)}</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -791,6 +852,7 @@ const PurPrintStyle7 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
pageBreakBefore: "avoid",
|
pageBreakBefore: "avoid",
|
||||||
pageBreakInside: "avoid",
|
pageBreakInside: "avoid",
|
||||||
minHeight: "auto",
|
minHeight: "auto",
|
||||||
|
...footerColorStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{
|
{
|
||||||
|
|
|
||||||
|
|
@ -4,7 +4,19 @@ import { useDispatch, useSelector } from "react-redux";
|
||||||
import {
|
import {
|
||||||
GlobalPritdummyData,
|
GlobalPritdummyData,
|
||||||
changeReprintDataFound,
|
changeReprintDataFound,
|
||||||
GlobalprinttermsAndConditions
|
GlobalprinttermsAndConditions,
|
||||||
|
GlobalSelectedPrintHeaderColor,
|
||||||
|
GlobalSelectedPrintHeaderFontColor,
|
||||||
|
GlobalSelectedTableHeaderColor,
|
||||||
|
GlobalSelectedTableHeaderFontColor,
|
||||||
|
GlobalSelectedTableBodyColor,
|
||||||
|
GlobalSelectedTableBodyFontColor,
|
||||||
|
GlobalRowType,
|
||||||
|
GlobalSelectedFooterColor,
|
||||||
|
GlobalSelectedFooterFontColor,
|
||||||
|
GlobalSelectedNetAmountColor,
|
||||||
|
GlobalSelectedNetAmountFontColor,
|
||||||
|
|
||||||
} from '../../../Features/ThemeChange/ThemeChange';
|
} from '../../../Features/ThemeChange/ThemeChange';
|
||||||
import '../../../Styles/BookingScreen/PrintTemplates/ThermalPrinter/PrintStyle8.scss';
|
import '../../../Styles/BookingScreen/PrintTemplates/ThermalPrinter/PrintStyle8.scss';
|
||||||
import { extractLastNumber } from "../../../Services/Others";
|
import { extractLastNumber } from "../../../Services/Others";
|
||||||
|
|
@ -27,11 +39,26 @@ const PurPrintstyle8 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, B
|
||||||
const Rate = FieldDetails?.["Rate"];
|
const Rate = FieldDetails?.["Rate"];
|
||||||
const Amount = FieldDetails?.["Amount"];
|
const Amount = FieldDetails?.["Amount"];
|
||||||
const HsnCode = FieldDetails?.["HsnCode"];
|
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 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 TermsAndConditions = printDatas?.TermsandConditions
|
||||||
let SignatureImg = printDatas?.Signature
|
let SignatureImg = printDatas?.Signature
|
||||||
|
|
@ -74,7 +101,51 @@ const PurPrintstyle8 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, B
|
||||||
}
|
}
|
||||||
const lastChunkRows = paginatedChunks.length > 0 ? paginatedChunks[paginatedChunks.length - 1].length : 0;
|
const lastChunkRows = paginatedChunks.length > 0 ? paginatedChunks[paginatedChunks.length - 1].length : 0;
|
||||||
const shouldFooterBeOnNewPage = lastChunkRows > (PageSize == "A5" ? 5 : 13);
|
const shouldFooterBeOnNewPage = lastChunkRows > (PageSize == "A5" ? 5 : 13);
|
||||||
|
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 (
|
return (
|
||||||
<>
|
<>
|
||||||
|
|
@ -85,8 +156,8 @@ const PurPrintstyle8 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, B
|
||||||
|
|
||||||
|
|
||||||
{/* <div className="header" style={{ position: "fixed", top: 0, width: "100%" }}> */}
|
{/* <div className="header" style={{ position: "fixed", top: 0, width: "100%" }}> */}
|
||||||
<div className="header" style={{ position: isMobile ? GlobaldummyData ? "absolute" : "fixed" : "", top: 0, width: "100%" }}>
|
<div className="header" style={{ position: isMobile ? GlobaldummyData ? "absolute" : "fixed" : "", top: 0, width: "100%" }}>
|
||||||
<div className='PrintStyle8-fistDiv' style={{}} >
|
<div className='PrintStyle8-fistDiv' style={{ ...headerStyle }} >
|
||||||
{/* <h3>{table2Data?.[0]?.BrName}</h3> */}
|
{/* <h3>{table2Data?.[0]?.BrName}</h3> */}
|
||||||
<div style={{ fontSize: "clamp(1.25rem, 2.5vw, 1.75rem)", fontWeight: '600', }} >{table2Data?.[0]?.BrName}</div>
|
<div style={{ fontSize: "clamp(1.25rem, 2.5vw, 1.75rem)", fontWeight: '600', }} >{table2Data?.[0]?.BrName}</div>
|
||||||
<div className='PrintStyle8-BrAddress' style={{ fontSize: "clamp(0.63rem, 2.5vw, 1.2rem)" }}>
|
<div className='PrintStyle8-BrAddress' style={{ fontSize: "clamp(0.63rem, 2.5vw, 1.2rem)" }}>
|
||||||
|
|
@ -94,21 +165,19 @@ const PurPrintstyle8 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, B
|
||||||
(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 : '')
|
(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>
|
||||||
<div className='PrintStyle8-BrAddress' style={{ fontSize: "clamp(0.63rem, 2.5vw, 1.2rem)" }}>
|
<div className='PrintStyle8-BrAddress' style={{ fontSize: "clamp(0.63rem, 2.5vw, 1.2rem)" }}>
|
||||||
Mobile : +91 {GlobaldummyData ? '986XXXXXXX' : table2Data?.[0]?.BrMobile}</div>
|
Mobile : +91 {GlobaldummyData ? '986XXXXXXX' : table2Data?.[0]?.BrMobile}</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{<div className='PrintStyle4-FourthSpan' style={{ textTransform: 'uppercase', fontWeight: '600' }}>
|
{<div className='PrintStyle4-FourthSpan' style={{ textTransform: 'uppercase', fontWeight: '600' }}>{BillName}</div>}
|
||||||
{BillName}</div>}
|
|
||||||
|
|
||||||
<div className='PrintStyle8-SecondDiv'>
|
<div className='PrintStyle8-SecondDiv'>
|
||||||
<div style={{ fontWeight: '600' }}>Bill No :{table2Data?.[0]?.QuotationNo && extractLastNumber(table2Data?.[0]?.QuotationNo)}</div>
|
<div style={{ fontWeight: '600' }}>Bill No :{table2Data?.[0]?.QuotationNo && extractLastNumber(table2Data?.[0]?.QuotationNo)}</div>
|
||||||
<div style={{ fontSize: "clamp(0.63rem, 2.5vw, 1.2rem)" }}>{ Date1}</div>
|
<div style={{ fontSize: "clamp(0.63rem, 2.5vw, 1.2rem)" }}>{Date1}</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<hr className="PrintStyle8-print-dottline" />
|
<hr className="PrintStyle8-print-dottline" />
|
||||||
</div>
|
</div>
|
||||||
<div style={{ marginTop: "0rem" }} className="print-body">
|
<div style={{ marginTop: "0rem" }} className="print-body">
|
||||||
{(TakeawayData?.length > 0) &&
|
{(TakeawayData?.length > 0) &&
|
||||||
<>
|
<>
|
||||||
|
|
||||||
|
|
@ -116,32 +185,43 @@ const PurPrintstyle8 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, B
|
||||||
<table className="PrintStyle8-print-table">
|
<table className="PrintStyle8-print-table">
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
{SLNO && <th style={{ width: "10px", textAlign: "center" }}>S.No</th>}
|
{SLNO && <th style={{ width: "10px", textAlign: "center", ...tableHeaderStyle }}>S.No</th>}
|
||||||
{Item && <th>Des</th>}
|
{Item && <th style={{ ...tableHeaderStyle }}>Des</th>}
|
||||||
{HsnCode && <th style={{ width: "10px", textAlign: "right" }}>HSN</th>}
|
{HsnCode && <th style={{ width: "10px", textAlign: "right", ...tableHeaderStyle }}>HSN</th>}
|
||||||
{MRP && <th style={{ width: "10px", textAlign: "right" }}>MRP</th>}
|
{MRP && <th style={{ width: "10px", textAlign: "right", ...tableHeaderStyle }}>MRP</th>}
|
||||||
{Rate && <th style={{ width: "10px", textAlign: "right" }}>Rt</th>}
|
{Rate && <th style={{ width: "10px", textAlign: "right", ...tableHeaderStyle }}>Rt</th>}
|
||||||
{
|
{
|
||||||
Discount && <th style={{ width: "10px", textAlign: "right" }}>(%)</th>}
|
Discount && <th style={{ width: "10px", textAlign: "right", ...tableHeaderStyle }}>(%)</th>}
|
||||||
{Quantity && <th style={{ width: "10px", textAlign: "right" }}>Qty</th>}
|
{Quantity && <th style={{ width: "10px", textAlign: "right", ...tableHeaderStyle }}>Qty</th>}
|
||||||
{Amount && <th style={{ width: "10px", textAlign: "right" }}>Amt</th>}
|
{Amount && <th style={{ width: "10px", textAlign: "right", ...tableHeaderStyle }}>Amt</th>}
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
{dataChunk?.map((item, index) => {
|
{dataChunk?.map((item, index) => {
|
||||||
return (
|
return (
|
||||||
<tr key={index}>
|
<tr key={index}
|
||||||
{ SLNO && <td style={{ textAlign: 'center' }}>{chunkIndex * chunkSize + index + 1}</td>}
|
style={
|
||||||
|
index % 2 !== 1 && rowtypeStyle === "even"
|
||||||
|
? {
|
||||||
|
...tableBodyStyle
|
||||||
|
}
|
||||||
|
: index % 2 === 1 && rowtypeStyle === "odd"
|
||||||
|
? {
|
||||||
|
...tableBodyStyle
|
||||||
|
}
|
||||||
|
: {}
|
||||||
|
}>
|
||||||
|
{SLNO && <td style={{ textAlign: 'center' }}>{chunkIndex * chunkSize + index + 1}</td>}
|
||||||
{Item && <td style={{ display: 'flex', flexDirection: 'column' }}>
|
{Item && <td style={{ display: 'flex', flexDirection: 'column' }}>
|
||||||
<div>{item?.ProdName}</div>
|
<div>{item?.ProdName}</div>
|
||||||
<div>({ item?.Type != "C" ? item?.UomName : "COMBO"})</div>
|
<div>({item?.Type != "C" ? item?.UomName : "COMBO"})</div>
|
||||||
</td>}
|
</td>}
|
||||||
{ HsnCode && <td>{item?.HSN}</td>}
|
{HsnCode && <td>{item?.HSN}</td>}
|
||||||
{ MRP && <td style={{ textAlign: 'right' }}>{item?.SinglePc === 'Y' ? item?.Price : item?.MRP}</td>}
|
{MRP && <td style={{ textAlign: 'right' }}>{item?.SinglePc === 'Y' ? item?.Price : item?.MRP}</td>}
|
||||||
{ Rate && <td style={{ textAlign: 'right' }}>{item?.Price}</td>}
|
{Rate && <td style={{ textAlign: 'right' }}>{item?.Price}</td>}
|
||||||
{ Discount && <td style={{ textAlign: 'right' }}>{item?.Type != "C" ? item?.OfferAmt || 0 : item?.OfferValue || 0}</td>}
|
{Discount && <td style={{ textAlign: 'right' }}>{item?.Type != "C" ? item?.OfferAmt || 0 : item?.OfferValue || 0}</td>}
|
||||||
{ Quantity && <td style={{ textAlign: 'right' }}>{item?.Qty}</td>}
|
{Quantity && <td style={{ textAlign: 'right' }}>{item?.Qty}</td>}
|
||||||
{ Amount && <td style={{ width: "10px", textAlign: 'right' }}>{(table2Data?.[0]?.NetAmount).toFixed(2)}</td>}
|
{Amount && <td style={{ width: "10px", textAlign: 'right' }}>{(table2Data?.[0]?.NetAmount).toFixed(2)}</td>}
|
||||||
</tr>
|
</tr>
|
||||||
)
|
)
|
||||||
})}
|
})}
|
||||||
|
|
@ -157,7 +237,7 @@ const PurPrintstyle8 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, B
|
||||||
|
|
||||||
<>
|
<>
|
||||||
<hr className="PrintStyle8-print-dottline" />
|
<hr className="PrintStyle8-print-dottline" />
|
||||||
<div style={{ fontSize: "12px" }}>
|
<div style={{ fontSize: "12px",...netAmountStyle }}>
|
||||||
<div style={{ display: "flex", justifyContent: "space-between" }}>
|
<div style={{ display: "flex", justifyContent: "space-between" }}>
|
||||||
<div style={{ width: '40%' }}>Items </div>
|
<div style={{ width: '40%' }}>Items </div>
|
||||||
<div> : </div>
|
<div> : </div>
|
||||||
|
|
@ -311,12 +391,12 @@ const PurPrintstyle8 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, B
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<div className='PrintStyle8-Qr-Order'>
|
<div className='PrintStyle8-Qr-Order'>
|
||||||
|
|
||||||
<div className='PrintStyle8-OrderNo'>
|
<div className='PrintStyle8-OrderNo'>
|
||||||
|
|
||||||
{table2Data?.CustSuppName && table2Data?.CustSuppName !== undefined && table2Data?.CustSuppName !== null && !GlobaldummyData &&
|
{table2Data?.CustSuppName && table2Data?.CustSuppName !== undefined && table2Data?.CustSuppName !== null && !GlobaldummyData &&
|
||||||
<div style={{ marginLeft: '14px', padding: 0, fontSize: "12px", fontWeight: "600" }}>Customer : {table2Data?.CustSuppName}
|
<div style={{ marginLeft: '14px', padding: 0, fontSize: "12px", fontWeight: "600" }}>Customer : {table2Data?.CustSuppName}
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -325,7 +405,7 @@ const PurPrintstyle8 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, B
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -335,8 +415,8 @@ const PurPrintstyle8 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, B
|
||||||
pageBreakBefore: "avoid",
|
pageBreakBefore: "avoid",
|
||||||
pageBreakInside: "avoid",
|
pageBreakInside: "avoid",
|
||||||
minHeight: "auto",
|
minHeight: "auto",
|
||||||
}}
|
...footerColorStyle
|
||||||
>
|
}} >
|
||||||
{
|
{
|
||||||
Notestext && (<div>
|
Notestext && (<div>
|
||||||
<p style={{ padding: "0rem 1rem" }}>{Notestext}</p>
|
<p style={{ padding: "0rem 1rem" }}>{Notestext}</p>
|
||||||
|
|
@ -344,8 +424,6 @@ const PurPrintstyle8 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, B
|
||||||
<hr className="PrintA4Style11-print-dottline" />
|
<hr className="PrintA4Style11-print-dottline" />
|
||||||
</div>)
|
</div>)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
<div style={{ display: "flex", width: "90%", padding: "0 1rem", justifyContent: GlobaltermsAndConditions ? "space-between" : "flex-end", alignItems: "center" }}>
|
<div style={{ display: "flex", width: "90%", padding: "0 1rem", justifyContent: GlobaltermsAndConditions ? "space-between" : "flex-end", alignItems: "center" }}>
|
||||||
{
|
{
|
||||||
(TermsnAdCondition == true && TermsAndConditions?.length > 0) && (<div style={{ margin: "8px 0", fontFamily: "sans-serif", width: "100%", display: "flex", flexDirection: "column", alignItems: "flex-start" }}>
|
(TermsnAdCondition == true && TermsAndConditions?.length > 0) && (<div style={{ margin: "8px 0", fontFamily: "sans-serif", width: "100%", display: "flex", flexDirection: "column", alignItems: "flex-start" }}>
|
||||||
|
|
@ -359,16 +437,13 @@ const PurPrintstyle8 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, B
|
||||||
</div>)
|
</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>
|
<p style={{ fontSize: "13px", fontWeight: "bold", marginBottom: "6px" }}>Signature</p>
|
||||||
<img style={{ width: "100px", height: "60px" }} src={SignatureImg} alt="" />
|
<img style={{ width: "100px", height: "60px" }} src={SignatureImg} alt="" />
|
||||||
</div>)}
|
</div>)}
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</>
|
</>
|
||||||
}
|
}
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -395,7 +470,7 @@ const PurPrintstyle8 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, B
|
||||||
>
|
>
|
||||||
<>
|
<>
|
||||||
<hr className="PrintStyle8-print-dottline" />
|
<hr className="PrintStyle8-print-dottline" />
|
||||||
<div style={{ fontSize: "12px" }}>
|
<div style={{ fontSize: "12px",...netAmountStyle }}>
|
||||||
<div style={{ display: "flex", justifyContent: "space-between" }}>
|
<div style={{ display: "flex", justifyContent: "space-between" }}>
|
||||||
<div style={{ width: '40%' }}>Items </div>
|
<div style={{ width: '40%' }}>Items </div>
|
||||||
<div> : </div>
|
<div> : </div>
|
||||||
|
|
@ -549,18 +624,18 @@ const PurPrintstyle8 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, B
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<div className='PrintStyle8-Qr-Order'>
|
<div className='PrintStyle8-Qr-Order'>
|
||||||
|
|
||||||
<div className='PrintStyle8-OrderNo'>
|
<div className='PrintStyle8-OrderNo'>
|
||||||
|
|
||||||
|
|
||||||
{CashierName && CashierName !== undefined && CashierName !== null && !GlobaldummyData &&
|
{CashierName && CashierName !== undefined && CashierName !== null && !GlobaldummyData &&
|
||||||
<div style={{ marginLeft: '14px', padding: 0, fontSize: "12px", fontWeight: "600" }}>Cashier : {CashierName}
|
<div style={{ marginLeft: '14px', padding: 0, fontSize: "12px", fontWeight: "600" }}>Cashier : {CashierName}
|
||||||
</div>
|
</div>
|
||||||
}
|
}
|
||||||
|
|
||||||
{table2Data?.CustSuppName && table2Data?.CustSuppName !== undefined && table2Data?.CustSuppName !== null && !GlobaldummyData &&
|
{table2Data?.CustSuppName && table2Data?.CustSuppName !== undefined && table2Data?.CustSuppName !== null && !GlobaldummyData &&
|
||||||
<div style={{ marginLeft: '14px', padding: 0, fontSize: "12px", fontWeight: "600" }}>Customer : {table2Data?.CustSuppName}
|
<div style={{ marginLeft: '14px', padding: 0, fontSize: "12px", fontWeight: "600" }}>Customer : {table2Data?.CustSuppName}
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -576,6 +651,7 @@ const PurPrintstyle8 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, B
|
||||||
pageBreakBefore: "avoid",
|
pageBreakBefore: "avoid",
|
||||||
pageBreakInside: "avoid",
|
pageBreakInside: "avoid",
|
||||||
minHeight: "auto",
|
minHeight: "auto",
|
||||||
|
...footerColorStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{
|
{
|
||||||
|
|
@ -600,7 +676,7 @@ const PurPrintstyle8 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, B
|
||||||
</div>)
|
</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>
|
<p style={{ fontSize: "13px", fontWeight: "bold", marginBottom: "6px" }}>Signature</p>
|
||||||
<img style={{ width: "100px", height: "60px" }} src={SignatureImg} alt="" />
|
<img style={{ width: "100px", height: "60px" }} src={SignatureImg} alt="" />
|
||||||
</div>)}
|
</div>)}
|
||||||
|
|
@ -609,7 +685,7 @@ const PurPrintstyle8 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, B
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</>
|
</>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -618,7 +694,7 @@ const PurPrintstyle8 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, B
|
||||||
</div>
|
</div>
|
||||||
:
|
:
|
||||||
<div id={`SQPrintStyle8`} className='PrintStyle8MasterDiv' style={{ fontFamily: "'Courier New', Courier, monospace" }}>
|
<div id={`SQPrintStyle8`} className='PrintStyle8MasterDiv' style={{ fontFamily: "'Courier New', Courier, monospace" }}>
|
||||||
<div className='PrintStyle8-fistDiv' style={{}} >
|
<div className='PrintStyle8-fistDiv' style={{ headerStyle }} >
|
||||||
{/* <h3>{table2Data?.[0]?.BrName}</h3> */}
|
{/* <h3>{table2Data?.[0]?.BrName}</h3> */}
|
||||||
<div style={{ fontSize: "clamp(1.25rem, 2.5vw, 1.75rem)", fontWeight: '600', }} >{GlobaldummyData ? 'XYZ Shop' : table2Data?.[0]?.BrName}</div>
|
<div style={{ fontSize: "clamp(1.25rem, 2.5vw, 1.75rem)", fontWeight: '600', }} >{GlobaldummyData ? 'XYZ Shop' : table2Data?.[0]?.BrName}</div>
|
||||||
<div className='PrintStyle8-BrAddress' style={{ fontSize: "clamp(0.63rem, 2.5vw, 1.2rem)" }}>
|
<div className='PrintStyle8-BrAddress' style={{ fontSize: "clamp(0.63rem, 2.5vw, 1.2rem)" }}>
|
||||||
|
|
@ -626,18 +702,18 @@ const PurPrintstyle8 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, B
|
||||||
'BranchAddress, Town- 635XXX City - State' :
|
'BranchAddress, Town- 635XXX City - State' :
|
||||||
(BranchAddress || '') + (BranchCity ? (BranchAddress && BranchCity ? '-' : '') + BranchCity : '') + (BranchZip ? (BranchCity && BranchZip ? '-' : '') + BranchZip : '')}
|
(BranchAddress || '') + (BranchCity ? (BranchAddress && BranchCity ? '-' : '') + BranchCity : '') + (BranchZip ? (BranchCity && BranchZip ? '-' : '') + BranchZip : '')}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className='PrintStyle8-BrAddress' style={{ fontSize: "clamp(0.63rem, 2.5vw, 1.2rem)" }}> Mobile : +91 {GlobaldummyData ? '986XXXXXXX' : table2Data?.[0]?.BrMobile}</div>
|
<div className='PrintStyle8-BrAddress' style={{ fontSize: "clamp(0.63rem, 2.5vw, 1.2rem)" }}> Mobile : +91 {GlobaldummyData ? '986XXXXXXX' : table2Data?.[0]?.BrMobile}</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<div className='PrintStyle4-FourthSpan' style={{ textTransform: 'uppercase', fontWeight: '600' }}>
|
<div className='PrintStyle4-FourthSpan' style={{ textTransform: 'uppercase', fontWeight: '600' }}>
|
||||||
{BillName}</div>
|
{BillName}</div>
|
||||||
|
|
||||||
|
|
||||||
<div className='PrintStyle8-SecondDiv'>
|
<div className='PrintStyle8-SecondDiv'>
|
||||||
<div style={{ fontWeight: '600' }}>Bill No :{
|
<div style={{ fontWeight: '600' }}>Bill No :{
|
||||||
table2Data?.[0]?.QuotationNo && extractLastNumber(table2Data?.[0]?.QuotationNo)}</div>
|
table2Data?.[0]?.QuotationNo && extractLastNumber(table2Data?.[0]?.QuotationNo)}</div>
|
||||||
<div style={{ fontSize: "clamp(0.63rem, 2.5vw, 1.2rem)" }}>{ Date1}</div>
|
<div style={{ fontSize: "clamp(0.63rem, 2.5vw, 1.2rem)" }}>{Date1}</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<hr className="PrintStyle8-print-dottline" />
|
<hr className="PrintStyle8-print-dottline" />
|
||||||
|
|
@ -648,22 +724,33 @@ const PurPrintstyle8 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, B
|
||||||
<table className="PrintStyle8-print-table">
|
<table className="PrintStyle8-print-table">
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
{SLNO && <th style={{ width: "10px", textAlign: "center" }}>S.No</th>}
|
{SLNO && <th style={{ ...tableHeaderStyle, width: "10px", textAlign: "center" }}>S.No</th>}
|
||||||
{Item && <th>Des</th>}
|
{Item && <th style={{ ...tableHeaderStyle }}>Des</th>}
|
||||||
{HsnCode && <th style={{ width: "10px", textAlign: "right" }}>HSN</th>}
|
{HsnCode && <th style={{ ...tableHeaderStyle, width: "10px", textAlign: "right" }}>HSN</th>}
|
||||||
{MRP && <th style={{ width: "10px", textAlign: "right" }}>MRP</th>}
|
{MRP && <th style={{ ...tableHeaderStyle, width: "10px", textAlign: "right" }}>MRP</th>}
|
||||||
{Rate && <th style={{ width: "10px", textAlign: "right" }}>Rt</th>}
|
{Rate && <th style={{ ...tableHeaderStyle, width: "10px", textAlign: "right" }}>Rt</th>}
|
||||||
{Discount && <th style={{ width: "10px", textAlign: "right" }}>(%)</th>}
|
{Discount && <th style={{ ...tableHeaderStyle, width: "10px", textAlign: "right" }}>(%)</th>}
|
||||||
{Quantity && <th style={{ width: "10px", textAlign: "right" }}>Qty</th>}
|
{Quantity && <th style={{ ...tableHeaderStyle, width: "10px", textAlign: "right" }}>Qty</th>}
|
||||||
{Amount && <th style={{ width: "10px", textAlign: "right" }}>Amt</th>}
|
{Amount && <th style={{ ...tableHeaderStyle, width: "10px", textAlign: "right" }}>Amt</th>}
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
{(TakeawayData)?.map((item, index) => {
|
{(TakeawayData)?.map((item, index) => {
|
||||||
return (
|
return (
|
||||||
<tr key={index}>
|
<tr key={index}
|
||||||
{ SLNO && <td style={{ textAlign: 'center' }}>{index + 1}</td>}
|
style={
|
||||||
{ Item && <td style={{ display: 'flex', flexDirection: 'column' }}>
|
index % 2 !== 1 && rowtypeStyle === "even"
|
||||||
|
? {
|
||||||
|
...tableBodyStyle
|
||||||
|
}
|
||||||
|
: index % 2 === 1 && rowtypeStyle === "odd"
|
||||||
|
? {
|
||||||
|
...tableBodyStyle
|
||||||
|
}
|
||||||
|
: {}
|
||||||
|
}>
|
||||||
|
{SLNO && <td style={{ textAlign: 'center' }}>{index + 1}</td>}
|
||||||
|
{Item && <td style={{ display: 'flex', flexDirection: 'column' }}>
|
||||||
<div>{item?.ProdName}</div>
|
<div>{item?.ProdName}</div>
|
||||||
<div>({item?.Size ? item?.Size : "1"} {item?.SinglePc == 'Y' ? 'PCS' : item?.Type != "C" ? item?.UomName : "COMBO"})</div>
|
<div>({item?.Size ? item?.Size : "1"} {item?.SinglePc == 'Y' ? 'PCS' : item?.Type != "C" ? item?.UomName : "COMBO"})</div>
|
||||||
</td>}
|
</td>}
|
||||||
|
|
@ -683,7 +770,7 @@ const PurPrintstyle8 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, B
|
||||||
}
|
}
|
||||||
|
|
||||||
<hr className="PrintStyle8-print-dottline" />
|
<hr className="PrintStyle8-print-dottline" />
|
||||||
<div style={{ fontSize: "12px" }}>
|
<div style={{ fontSize: "12px",...netAmountStyle }}>
|
||||||
<div style={{ display: "flex", justifyContent: "space-between" }}>
|
<div style={{ display: "flex", justifyContent: "space-between" }}>
|
||||||
<div style={{ width: '40%' }}>Items </div>
|
<div style={{ width: '40%' }}>Items </div>
|
||||||
<div> : </div>
|
<div> : </div>
|
||||||
|
|
@ -692,7 +779,7 @@ const PurPrintstyle8 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, B
|
||||||
<div style={{ display: "flex", justifyContent: "space-between" }}>
|
<div style={{ display: "flex", justifyContent: "space-between" }}>
|
||||||
<div style={{ width: '40%' }}>Qty </div>
|
<div style={{ width: '40%' }}>Qty </div>
|
||||||
<div> : </div>
|
<div> : </div>
|
||||||
<div style={{ padding: '0rem 1rem', width: '40%', textAlign: 'right' }} >{ totalQuantity}</div>
|
<div style={{ padding: '0rem 1rem', width: '40%', textAlign: 'right' }} >{totalQuantity}</div>
|
||||||
</div>
|
</div>
|
||||||
{(table2Data?.OverallDisc > 0 || TotalOfferAmount > 0) &&
|
{(table2Data?.OverallDisc > 0 || TotalOfferAmount > 0) &&
|
||||||
<div style={{ display: "flex", justifyContent: "space-between" }}>
|
<div style={{ display: "flex", justifyContent: "space-between" }}>
|
||||||
|
|
@ -706,7 +793,7 @@ const PurPrintstyle8 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, B
|
||||||
<div style={{ display: "flex", justifyContent: "space-between" }}>
|
<div style={{ display: "flex", justifyContent: "space-between" }}>
|
||||||
<div style={{ width: '40%' }}>Amount</div>
|
<div style={{ width: '40%' }}>Amount</div>
|
||||||
<div> : </div>
|
<div> : </div>
|
||||||
<div style={{ padding: '0rem 1rem', width: '40%', textAlign: 'right' }}>{ Number(table2Data?.[0]?.NetAmount).toFixed(2)}</div>
|
<div style={{ padding: '0rem 1rem', width: '40%', textAlign: 'right' }}>{Number(table2Data?.[0]?.NetAmount).toFixed(2)}</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
@ -845,7 +932,7 @@ const PurPrintstyle8 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, B
|
||||||
<div className='PrintStyle8-Qr-Order'>
|
<div className='PrintStyle8-Qr-Order'>
|
||||||
|
|
||||||
<div className='PrintStyle8-OrderNo'>
|
<div className='PrintStyle8-OrderNo'>
|
||||||
|
|
||||||
{table2Data?.CustSuppName && table2Data?.CustSuppName !== undefined && table2Data?.CustSuppName !== null && !GlobaldummyData &&
|
{table2Data?.CustSuppName && table2Data?.CustSuppName !== undefined && table2Data?.CustSuppName !== null && !GlobaldummyData &&
|
||||||
<div style={{ marginLeft: '14px', padding: 0, fontSize: "12px", fontWeight: "600" }}>Customer : {table2Data?.CustSuppName}
|
<div style={{ marginLeft: '14px', padding: 0, fontSize: "12px", fontWeight: "600" }}>Customer : {table2Data?.CustSuppName}
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -854,7 +941,7 @@ const PurPrintstyle8 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, B
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -864,6 +951,7 @@ const PurPrintstyle8 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, B
|
||||||
pageBreakBefore: "avoid",
|
pageBreakBefore: "avoid",
|
||||||
pageBreakInside: "avoid",
|
pageBreakInside: "avoid",
|
||||||
minHeight: "auto",
|
minHeight: "auto",
|
||||||
|
...footerColorStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{
|
{
|
||||||
|
|
@ -888,7 +976,7 @@ const PurPrintstyle8 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, B
|
||||||
</div>)
|
</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>
|
<p style={{ fontSize: "13px", fontWeight: "bold", marginBottom: "6px" }}>Signature</p>
|
||||||
<img style={{ width: "100px", height: "60px" }} src={SignatureImg} alt="" />
|
<img style={{ width: "100px", height: "60px" }} src={SignatureImg} alt="" />
|
||||||
</div>)}
|
</div>)}
|
||||||
|
|
@ -897,7 +985,7 @@ const PurPrintstyle8 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, B
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -2,9 +2,20 @@ import React from "react";
|
||||||
import { useDispatch, useSelector } from "react-redux";
|
import { useDispatch, useSelector } from "react-redux";
|
||||||
|
|
||||||
import {
|
import {
|
||||||
GlobalPritdummyData,
|
GlobalPritdummyData,
|
||||||
changeReprintDataFound,
|
changeReprintDataFound,
|
||||||
GlobalprinttermsAndConditions
|
GlobalprinttermsAndConditions,
|
||||||
|
GlobalSelectedPrintHeaderColor,
|
||||||
|
GlobalSelectedPrintHeaderFontColor,
|
||||||
|
GlobalSelectedTableHeaderColor,
|
||||||
|
GlobalSelectedTableHeaderFontColor,
|
||||||
|
GlobalSelectedTableBodyColor,
|
||||||
|
GlobalSelectedTableBodyFontColor,
|
||||||
|
GlobalRowType,
|
||||||
|
GlobalSelectedFooterColor,
|
||||||
|
GlobalSelectedFooterFontColor,
|
||||||
|
GlobalSelectedNetAmountColor,
|
||||||
|
GlobalSelectedNetAmountFontColor,
|
||||||
} from '../../../Features/ThemeChange/ThemeChange';
|
} from '../../../Features/ThemeChange/ThemeChange';
|
||||||
import '../../../Styles/BookingScreen/PrintTemplates/ThermalPrinter/PrintStyle9.scss';
|
import '../../../Styles/BookingScreen/PrintTemplates/ThermalPrinter/PrintStyle9.scss';
|
||||||
import { extractLastNumber } from "../../../Services/Others";
|
import { extractLastNumber } from "../../../Services/Others";
|
||||||
|
|
@ -28,11 +39,26 @@ const PurPrintStyle9 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
const Rate = FieldDetails?.["Rate"];
|
const Rate = FieldDetails?.["Rate"];
|
||||||
const Amount = FieldDetails?.["Amount"];
|
const Amount = FieldDetails?.["Amount"];
|
||||||
const HsnCode = FieldDetails?.["HsnCode"];
|
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 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 TermsAndConditions = printDatas?.TermsandConditions
|
||||||
let SignatureImg = printDatas?.Signature
|
let SignatureImg = printDatas?.Signature
|
||||||
|
|
@ -54,7 +80,7 @@ const PurPrintStyle9 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
console.log(TakeawayData, "TakeawayData", table2Data)
|
console.log(TakeawayData, "TakeawayData", table2Data)
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
let TotalOfferAmount = 0;
|
let TotalOfferAmount = 0;
|
||||||
|
|
@ -71,7 +97,51 @@ const PurPrintStyle9 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
}
|
}
|
||||||
const lastChunkRows = paginatedChunks.length > 0 ? paginatedChunks[paginatedChunks.length - 1].length : 0;
|
const lastChunkRows = paginatedChunks.length > 0 ? paginatedChunks[paginatedChunks.length - 1].length : 0;
|
||||||
const shouldFooterBeOnNewPage = lastChunkRows > (PageSize == "A5" ? 5 : 10);
|
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 (
|
return (
|
||||||
<>
|
<>
|
||||||
{FormatTheme ?
|
{FormatTheme ?
|
||||||
|
|
@ -80,9 +150,9 @@ const PurPrintStyle9 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
<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={`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: isMobile ? GlobaldummyData ? "absolute" : "fixed" : "", top: 0, width: "100%" }}>
|
<div className="header" style={{ position: isMobile ? GlobaldummyData ? "absolute" : "fixed" : "", top: 0, width: "100%" }}>
|
||||||
<div className="PrintStyle9-print" >
|
<div className="PrintStyle9-print" style={{ ...headerStyle }}>
|
||||||
<div style={{ fontSize: 'clamp(1.5rem, 2.5vw, 2rem)', fontWeight: '600' }} className="PrintStyle9-Branch">{ table2Data?.[0]?.BrName}</div>
|
<div style={{ fontSize: 'clamp(1.5rem, 2.5vw, 2rem)', fontWeight: '600' }} className="PrintStyle9-Branch">{table2Data?.[0]?.BrName}</div>
|
||||||
|
|
||||||
<div style={{ display: 'flex', flexDirection: 'column', fontWeight: '400', fontSize: '11px' }}>
|
<div style={{ display: 'flex', flexDirection: 'column', fontWeight: '400', fontSize: '11px' }}>
|
||||||
{GlobaldummyData ?
|
{GlobaldummyData ?
|
||||||
|
|
@ -94,42 +164,52 @@ const PurPrintStyle9 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
|
|
||||||
<div className='' style={{ textTransform: 'uppercase', fontSize: '11px', fontWeight: '600' }}>{BillName} </div>
|
<div className='' style={{ textTransform: 'uppercase', fontSize: '11px', fontWeight: '600' }}>{BillName} </div>
|
||||||
{/*
|
{/*
|
||||||
<div >
|
<div >
|
||||||
{table2Data?.BrGSTIN &&<div>GST NO :{table2Data?.BrGSTIN}, CIN :u00045hhsgbubufsdug</div>}
|
{table2Data?.BrGSTIN &&<div>GST NO :{table2Data?.BrGSTIN}, CIN :u00045hhsgbubufsdug</div>}
|
||||||
<div > PH : +91 {table2Data?.[0]?.BrMobile}</div>
|
<div > PH : +91 {table2Data?.[0]?.BrMobile}</div>
|
||||||
</div>} */}
|
</div>} */}
|
||||||
<div >
|
</div>
|
||||||
<div style={{ fontSize: '14px', fontWeight: '600' }} > BILL NO :{table2Data?.[0]?.QuotationNo && extractLastNumber(table2Data?.[0]?.QuotationNo)}</div>
|
<div >
|
||||||
<div style={{ fontSize: '12px', fontWeight: '400' }}> {Date1} </div>
|
<div style={{ fontSize: '14px', fontWeight: '600' }} > BILL NO :{table2Data?.[0]?.QuotationNo && extractLastNumber(table2Data?.[0]?.QuotationNo)}</div>
|
||||||
</div>
|
<div style={{ fontSize: '12px', fontWeight: '400' }}> {Date1} </div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className='straight-line9'></div>
|
<div className='straight-line9'></div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div style={{ marginTop: "0rem" }} className="print-body">
|
<div style={{ marginTop: "0rem" }} className="print-body">
|
||||||
{(TakeawayData?.length > 0 ) &&
|
{(TakeawayData?.length > 0) &&
|
||||||
<>
|
<>
|
||||||
<table className="PrintStyle9-print-table">
|
<table className="PrintStyle9-print-table">
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
{ SLNO && <th style={{ width: '10px' }}>S.No</th>}
|
{SLNO && <th style={{ ...tableHeaderStyle, width: '10px' }}>S.No</th>}
|
||||||
{ Item && <th style={{ width: '10px' }}>Item</th>}
|
{Item && <th style={{ ...tableHeaderStyle, width: '10px' }}>Item</th>}
|
||||||
{ Quantity && <th style={{ width: '10px', textAlign: 'right' }}>Qty</th>}
|
{Quantity && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>Qty</th>}
|
||||||
{ HsnCode && <th style={{ width: '10px', textAlign: 'right' }}>HSN</th>}
|
{HsnCode && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>HSN</th>}
|
||||||
{ MRP && <th style={{ width: '10px', textAlign: 'right' }}>MRP</th>}
|
{MRP && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>MRP</th>}
|
||||||
{ Discount && <th style={{ width: '10px', textAlign: 'right' }}>Dis </th>}
|
{Discount && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>Dis </th>}
|
||||||
{ Rate && <th style={{ width: '10px', textAlign: 'right' }}>Rate</th>}
|
{Rate && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>Rate</th>}
|
||||||
{ Amount && <th style={{ width: '10px', textAlign: 'right' }}>Amt</th>}
|
{Amount && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>Amt</th>}
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
{dataChunk?.map((item, index) => {
|
{dataChunk?.map((item, index) => {
|
||||||
return (
|
return (
|
||||||
<tr key={index}>
|
<tr key={index}
|
||||||
{ SLNO && <td>{chunkIndex * chunkSize + index + 1}</td>}
|
style={
|
||||||
{ Item && <td style={{ display: 'flex', flexDirection: 'column' }}>
|
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?.ProdName}</div>
|
||||||
<div>({item?.Size ? item?.Size : "1"} {item?.SinglePc == 'Y' ? 'PCS' : item?.Type != "C" ? item?.UomName : "COMBO"}){item?.BrandName !== null ? item?.BrandName : ""}
|
<div>({item?.Size ? item?.Size : "1"} {item?.SinglePc == 'Y' ? 'PCS' : item?.Type != "C" ? item?.UomName : "COMBO"}){item?.BrandName !== null ? item?.BrandName : ""}
|
||||||
{item?.ProductIdentifierDtls?.length > 0 ? (item?.ProductIdentifierDtls?.filter((items) => !(items.SerialNumber == "" || items.SerialNumber == null))
|
{item?.ProductIdentifierDtls?.length > 0 ? (item?.ProductIdentifierDtls?.filter((items) => !(items.SerialNumber == "" || items.SerialNumber == null))
|
||||||
|
|
@ -141,12 +221,12 @@ const PurPrintStyle9 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
}
|
}
|
||||||
) : ""}</div>
|
) : ""}</div>
|
||||||
</td>}
|
</td>}
|
||||||
{ Quantity && <td style={{ textAlign: 'right' }}>{item?.Qty}</td>}
|
{Quantity && <td style={{ textAlign: 'right' }}>{item?.Qty}</td>}
|
||||||
{ HsnCode && <td style={{ textAlign: 'right' }}>{item?.HSN}</td>}
|
{HsnCode && <td style={{ textAlign: 'right' }}>{item?.HSN}</td>}
|
||||||
{ MRP && <td style={{ textAlign: 'right' }}>{item?.SinglePc === 'Y' ? item?.Price : item?.MRP}</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>}
|
{Discount && <td style={{ textAlign: 'right' }}>{item?.Type != "C" ? item?.OfferAmt || 0 : item?.OfferValue || 0}</td>}
|
||||||
{ Rate && <td style={{ textAlign: 'right' }}>{item?.Price}</td>}
|
{Rate && <td style={{ textAlign: 'right' }}>{item?.Price}</td>}
|
||||||
{ Amount && <td style={{ textAlign: 'right' }}>{item?.NetAmt?.toFixed(2)}</td>}
|
{Amount && <td style={{ textAlign: 'right' }}>{item?.NetAmt?.toFixed(2)}</td>}
|
||||||
</tr>
|
</tr>
|
||||||
)
|
)
|
||||||
})}
|
})}
|
||||||
|
|
@ -154,14 +234,14 @@ const PurPrintStyle9 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
</table>
|
</table>
|
||||||
</>
|
</>
|
||||||
}
|
}
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
{((chunkIndex === paginatedChunks.length - 1) && (!shouldFooterBeOnNewPage)) && FormatTheme &&
|
{((chunkIndex === paginatedChunks.length - 1) && (!shouldFooterBeOnNewPage)) && FormatTheme &&
|
||||||
<>
|
<>
|
||||||
|
|
||||||
<div style={{ display: 'flex', flexDirection: 'column', }}>
|
<div style={{ display: 'flex', flexDirection: 'column',...netAmountStyle }}>
|
||||||
|
|
||||||
|
|
||||||
{(table2Data?.OverallDisc > 0 || TotalOfferAmount > 0) &&
|
{(table2Data?.OverallDisc > 0 || TotalOfferAmount > 0) &&
|
||||||
<div style={{ display: "flex", justifyContent: "space-between", fontSize: '12px', fontWeight: '600', marginRight: '0.5rem' }}>
|
<div style={{ display: "flex", justifyContent: "space-between", fontSize: '12px', fontWeight: '600', marginRight: '0.5rem' }}>
|
||||||
Off :
|
Off :
|
||||||
|
|
@ -328,12 +408,12 @@ const PurPrintStyle9 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<div>
|
<div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
{table2Data?.CustSuppName && table2Data?.CustSuppName !== undefined && table2Data?.CustSuppName !== null && !GlobaldummyData &&
|
{table2Data?.CustSuppName && table2Data?.CustSuppName !== undefined && table2Data?.CustSuppName !== null && !GlobaldummyData &&
|
||||||
<div>
|
<div>
|
||||||
<p style={{ padding: 0, fontSize: "10px", fontWeight: "600" }}>Customer : {table2Data?.CustSuppName}</p>
|
<p style={{ padding: 0, fontSize: "10px", fontWeight: "600" }}>Customer : {table2Data?.CustSuppName}</p>
|
||||||
|
|
@ -344,14 +424,14 @@ const PurPrintStyle9 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<div className="page-footerA4Style11"
|
<div className="page-footerA4Style11"
|
||||||
style={{
|
style={{
|
||||||
|
|
@ -359,13 +439,14 @@ const PurPrintStyle9 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
pageBreakBefore: "avoid",
|
pageBreakBefore: "avoid",
|
||||||
pageBreakInside: "avoid",
|
pageBreakInside: "avoid",
|
||||||
minHeight: "auto",
|
minHeight: "auto",
|
||||||
|
...footerColorStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{Notestext && (<div>
|
{Notestext && (<div>
|
||||||
<p style={{ padding: "0rem 1rem" }}>{Notestext}</p>
|
<p style={{ padding: "0rem 1rem" }}>{Notestext}</p>
|
||||||
|
|
||||||
<hr className="PrintA4Style11-print-dottline" />
|
<hr className="PrintA4Style11-print-dottline" />
|
||||||
</div>)
|
</div>)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -393,8 +474,8 @@ const PurPrintStyle9 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</>
|
</>
|
||||||
}
|
}
|
||||||
|
|
@ -422,9 +503,9 @@ const PurPrintStyle9 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
>
|
>
|
||||||
<>
|
<>
|
||||||
|
|
||||||
<div style={{ display: 'flex', flexDirection: 'column', }}>
|
<div style={{ display: 'flex', flexDirection: 'column',...netAmountStyle }}>
|
||||||
|
|
||||||
|
|
||||||
{(table2Data?.OverallDisc > 0 || TotalOfferAmount > 0) &&
|
{(table2Data?.OverallDisc > 0 || TotalOfferAmount > 0) &&
|
||||||
<div style={{ display: "flex", justifyContent: "space-between", fontSize: '12px', fontWeight: '600', marginRight: '0.5rem' }}>
|
<div style={{ display: "flex", justifyContent: "space-between", fontSize: '12px', fontWeight: '600', marginRight: '0.5rem' }}>
|
||||||
Off :
|
Off :
|
||||||
|
|
@ -582,7 +663,7 @@ const PurPrintStyle9 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
}
|
}
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
</>
|
</>
|
||||||
}
|
}
|
||||||
|
|
@ -591,13 +672,13 @@ const PurPrintStyle9 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<div>
|
<div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
{table2Data?.CustSuppName && table2Data?.CustSuppName !== undefined && table2Data?.CustSuppName !== null && !GlobaldummyData &&
|
{table2Data?.CustSuppName && table2Data?.CustSuppName !== undefined && table2Data?.CustSuppName !== null && !GlobaldummyData &&
|
||||||
<div>
|
<div>
|
||||||
<p style={{ padding: 0, fontSize: "10px", fontWeight: "600" }}>Customer : {table2Data?.CustSuppName}</p>
|
<p style={{ padding: 0, fontSize: "10px", fontWeight: "600" }}>Customer : {table2Data?.CustSuppName}</p>
|
||||||
|
|
@ -617,6 +698,7 @@ const PurPrintStyle9 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
pageBreakBefore: "avoid",
|
pageBreakBefore: "avoid",
|
||||||
pageBreakInside: "avoid",
|
pageBreakInside: "avoid",
|
||||||
minHeight: "auto",
|
minHeight: "auto",
|
||||||
|
...footerColorStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{
|
{
|
||||||
|
|
@ -641,7 +723,7 @@ const PurPrintStyle9 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
</div>)
|
</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>
|
<p style={{ fontSize: "13px", fontWeight: "bold", marginBottom: "6px" }}>Signature</p>
|
||||||
<img style={{ width: "100px", height: "60px" }} src={SignatureImg} alt="" />
|
<img style={{ width: "100px", height: "60px" }} src={SignatureImg} alt="" />
|
||||||
</div>)}
|
</div>)}
|
||||||
|
|
@ -649,7 +731,7 @@ const PurPrintStyle9 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</>
|
</>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -659,7 +741,7 @@ const PurPrintStyle9 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
:
|
:
|
||||||
<div className="PrintStyle9MasterDiv" id={`SQPrintStyle9`} style={{ fontFamily: "'Courier New', Courier, monospace" }}>
|
<div className="PrintStyle9MasterDiv" id={`SQPrintStyle9`} style={{ fontFamily: "'Courier New', Courier, monospace" }}>
|
||||||
|
|
||||||
<div className="PrintStyle9-print" >
|
<div className="PrintStyle9-print" style={{ ...headerStyle }} >
|
||||||
<div style={{ fontSize: 'clamp(1.5rem, 2.5vw, 2rem)', fontWeight: '600' }} className="PrintStyle9-Branch">{GlobaldummyData ? 'XYZ Shop' : table2Data?.[0]?.BrName}</div>
|
<div style={{ fontSize: 'clamp(1.5rem, 2.5vw, 2rem)', fontWeight: '600' }} className="PrintStyle9-Branch">{GlobaldummyData ? 'XYZ Shop' : table2Data?.[0]?.BrName}</div>
|
||||||
|
|
||||||
<div style={{ display: 'flex', flexDirection: 'column', fontWeight: '400', fontSize: '11px' }}>
|
<div style={{ display: 'flex', flexDirection: 'column', fontWeight: '400', fontSize: '11px' }}>
|
||||||
|
|
@ -676,12 +758,12 @@ const PurPrintStyle9 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
{table2Data?.BrGSTIN &&<div>GST NO :{table2Data?.BrGSTIN}, CIN :u00045hhsgbubufsdug</div>}
|
{table2Data?.BrGSTIN &&<div>GST NO :{table2Data?.BrGSTIN}, CIN :u00045hhsgbubufsdug</div>}
|
||||||
<div > PH : +91 {table2Data?.[0]?.BrMobile}</div>
|
<div > PH : +91 {table2Data?.[0]?.BrMobile}</div>
|
||||||
</div>} */}
|
</div>} */}
|
||||||
<div >
|
|
||||||
<div style={{ fontSize: '14px', fontWeight: '600' }} > BILL NO :{table2Data?.[0]?.QuotationNo && extractLastNumber(table2Data?.[0]?.QuotationNo)}</div>
|
|
||||||
<div style={{ fontSize: '12px', fontWeight: '400' }}> { Date1} </div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div >
|
||||||
|
<div style={{ fontSize: '14px', fontWeight: '600' }} > BILL NO :{table2Data?.[0]?.QuotationNo && extractLastNumber(table2Data?.[0]?.QuotationNo)}</div>
|
||||||
|
<div style={{ fontSize: '12px', fontWeight: '400' }}> {Date1} </div>
|
||||||
|
</div>
|
||||||
<div className='straight-line9'></div>
|
<div className='straight-line9'></div>
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -692,22 +774,33 @@ const PurPrintStyle9 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
<table className="PrintStyle9-print-table">
|
<table className="PrintStyle9-print-table">
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
{ SLNO && <th style={{ width: '10px' }}>S.No</th>}
|
{SLNO && <th style={{ ...tableHeaderStyle, width: '10px' }}>S.No</th>}
|
||||||
{ Item && <th style={{ width: '10px' }}>Item</th>}
|
{Item && <th style={{ ...tableHeaderStyle, width: '10px' }}>Item</th>}
|
||||||
{ Quantity && <th style={{ width: '10px', textAlign: 'right' }}>Qty</th>}
|
{Quantity && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>Qty</th>}
|
||||||
{ HsnCode && <th style={{ width: '10px', textAlign: 'right' }}>HSN</th>}
|
{HsnCode && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>HSN</th>}
|
||||||
{ MRP && <th style={{ width: '10px', textAlign: 'right' }}>MRP</th>}
|
{MRP && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>MRP</th>}
|
||||||
{ Discount && <th style={{ width: '10px', textAlign: 'right' }}>Dis </th>}
|
{Discount && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>Dis </th>}
|
||||||
{ Rate && <th style={{ width: '10px', textAlign: 'right' }}>Rate</th>}
|
{Rate && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>Rate</th>}
|
||||||
{ Amount && <th style={{ width: '10px', textAlign: 'right' }}>Amt</th>}
|
{Amount && <th style={{ ...tableHeaderStyle, width: '10px', textAlign: 'right' }}>Amt</th>}
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
{(TakeawayData)?.map((item, index) => {
|
{(TakeawayData)?.map((item, index) => {
|
||||||
return (
|
return (
|
||||||
<tr key={index}>
|
<tr key={index}
|
||||||
{ SLNO && <td>{index + 1}</td>}
|
style={
|
||||||
{ Item && <td style={{ display: 'flex', flexDirection: 'column' }}>
|
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?.ProdName}</div>
|
||||||
<div>({item?.Size ? item?.Size : "1"} {item?.SinglePc == 'Y' ? 'PCS' : item?.Type != "C" ? item?.UomName : "COMBO"}){item?.BrandName !== null ? item?.BrandName : ""}
|
<div>({item?.Size ? item?.Size : "1"} {item?.SinglePc == 'Y' ? 'PCS' : item?.Type != "C" ? item?.UomName : "COMBO"}){item?.BrandName !== null ? item?.BrandName : ""}
|
||||||
{item?.ProductIdentifierDtls?.length > 0 ? (item?.ProductIdentifierDtls?.filter((items) => !(items.SerialNumber == "" || items.SerialNumber == null))
|
{item?.ProductIdentifierDtls?.length > 0 ? (item?.ProductIdentifierDtls?.filter((items) => !(items.SerialNumber == "" || items.SerialNumber == null))
|
||||||
|
|
@ -732,10 +825,10 @@ const PurPrintStyle9 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
</table>
|
</table>
|
||||||
</>
|
</>
|
||||||
}
|
}
|
||||||
|
|
||||||
<div style={{ display: 'flex', flexDirection: 'column', }}>
|
<div style={{ display: 'flex', flexDirection: 'column',...netAmountStyle }}>
|
||||||
|
|
||||||
|
|
||||||
{(table2Data?.OverallDisc > 0 || TotalOfferAmount > 0) &&
|
{(table2Data?.OverallDisc > 0 || TotalOfferAmount > 0) &&
|
||||||
<div style={{ display: "flex", justifyContent: "space-between", fontSize: '12px', fontWeight: '600', marginRight: '0.5rem' }}>
|
<div style={{ display: "flex", justifyContent: "space-between", fontSize: '12px', fontWeight: '600', marginRight: '0.5rem' }}>
|
||||||
Off :
|
Off :
|
||||||
|
|
@ -772,10 +865,10 @@ const PurPrintStyle9 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
|
|
||||||
<div style={{ display: 'flex', justifyContent: 'space-between' }}>
|
<div style={{ display: 'flex', justifyContent: 'space-between' }}>
|
||||||
<div style={{ fontWeight: '700' }}>Net Amount:</div>
|
<div style={{ fontWeight: '700' }}>Net Amount:</div>
|
||||||
<div style={{ fontWeight: '700', marginRight: '0.5rem' }}>{ Number(table2Data?.[0]?.NetAmount).toFixed(2)}</div>
|
<div style={{ fontWeight: '700', marginRight: '0.5rem' }}>{Number(table2Data?.[0]?.NetAmount).toFixed(2)}</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<div style={{ display: 'flex', justifyContent: 'space-between' }}>
|
<div style={{ display: 'flex', justifyContent: 'space-between' }}>
|
||||||
|
|
@ -905,12 +998,12 @@ const PurPrintStyle9 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div>
|
<div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
{table2Data?.CustSuppName && table2Data?.CustSuppName !== undefined && table2Data?.CustSuppName !== null && !GlobaldummyData &&
|
{table2Data?.CustSuppName && table2Data?.CustSuppName !== undefined && table2Data?.CustSuppName !== null && !GlobaldummyData &&
|
||||||
<div>
|
<div>
|
||||||
<p style={{ padding: 0, fontSize: "10px", fontWeight: "600" }}>Customer : {table2Data?.CustSuppName}</p>
|
<p style={{ padding: 0, fontSize: "10px", fontWeight: "600" }}>Customer : {table2Data?.CustSuppName}</p>
|
||||||
|
|
@ -936,6 +1029,7 @@ const PurPrintStyle9 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
pageBreakBefore: "avoid",
|
pageBreakBefore: "avoid",
|
||||||
pageBreakInside: "avoid",
|
pageBreakInside: "avoid",
|
||||||
minHeight: "auto",
|
minHeight: "auto",
|
||||||
|
...footerColorStyle
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{
|
{
|
||||||
|
|
@ -969,8 +1063,8 @@ const PurPrintStyle9 = ({ index, ExtraChargeTotal, Date1, totalQuantityFilter, C
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div>
|
<div>
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,19 @@
|
||||||
|
|
||||||
import { useSelector } from 'react-redux';
|
import { useSelector } from 'react-redux';
|
||||||
import { GlobalPritdummyData } from '../../../Features/ThemeChange/ThemeChange';
|
import {
|
||||||
|
GlobalPritdummyData,
|
||||||
|
GlobalSelectedPrintHeaderFontColor,
|
||||||
|
GlobalSelectedTableHeaderColor,
|
||||||
|
GlobalSelectedTableHeaderFontColor,
|
||||||
|
GlobalSelectedTableBodyColor,
|
||||||
|
GlobalSelectedTableBodyFontColor,
|
||||||
|
GlobalRowType,
|
||||||
|
GlobalSelectedFooterColor,
|
||||||
|
GlobalSelectedFooterFontColor,
|
||||||
|
GlobalSelectedNetAmountColor,
|
||||||
|
GlobalSelectedNetAmountFontColor,
|
||||||
|
GlobalSelectedPrintHeaderColor,
|
||||||
|
} from '../../../Features/ThemeChange/ThemeChange';
|
||||||
import { isMobile } from 'react-device-detect';
|
import { isMobile } from 'react-device-detect';
|
||||||
import { extractLastNumberOrderId } from '../../../Services/Others';
|
import { extractLastNumberOrderId } from '../../../Services/Others';
|
||||||
import moment from 'moment';
|
import moment from 'moment';
|
||||||
|
|
@ -18,6 +31,17 @@ const PurPrintstyleInvoice = ({
|
||||||
}) => {
|
}) => {
|
||||||
|
|
||||||
const GlobaldummyData = useSelector(GlobalPritdummyData);
|
const GlobaldummyData = useSelector(GlobalPritdummyData);
|
||||||
|
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 BillName = printDatas?.PrintHdrName
|
let BillName = printDatas?.PrintHdrName
|
||||||
// Function to convert number to words
|
// Function to convert number to words
|
||||||
const numberToWords = (num) => {
|
const numberToWords = (num) => {
|
||||||
|
|
@ -67,7 +91,7 @@ const PurPrintstyleInvoice = ({
|
||||||
|
|
||||||
// Customer Details - mapped from A4Standard CustomerDetails array
|
// Customer Details - mapped from A4Standard CustomerDetails array
|
||||||
customerName: table2Data?.CustomerDetails?.[0]?.CustSuppName || table2Data?.CustName
|
customerName: table2Data?.CustomerDetails?.[0]?.CustSuppName || table2Data?.CustName
|
||||||
|| "",
|
|| "",
|
||||||
customerMobile: table2Data?.CustomerDetails?.[0]?.MobileNo || table2Data?.CustMobile || "",
|
customerMobile: table2Data?.CustomerDetails?.[0]?.MobileNo || table2Data?.CustMobile || "",
|
||||||
customerGSTIN: table2Data?.CustomerDetails?.[0]?.CustGSTNo || table2Data?.CustGSTIN || "",
|
customerGSTIN: table2Data?.CustomerDetails?.[0]?.CustGSTNo || table2Data?.CustGSTIN || "",
|
||||||
customerAddress: {
|
customerAddress: {
|
||||||
|
|
@ -88,13 +112,16 @@ const PurPrintstyleInvoice = ({
|
||||||
bankDetails: BankDetails?.[0] || null
|
bankDetails: BankDetails?.[0] || null
|
||||||
};
|
};
|
||||||
|
|
||||||
console.log(table2Data, "Date1Date1", invoiceData, )
|
console.log(table2Data, "Date1Date1", invoiceData,)
|
||||||
|
|
||||||
let PageSize = printDatas?.PageSize
|
let PageSize = printDatas?.PageSize
|
||||||
|
|
||||||
const TakeawayData = table2Data?.ProductDetails
|
let printColors = printDatas?.PrintColors;
|
||||||
|
const headerColor = printColors?.find(obj => obj.headerColor)?.headerColor;
|
||||||
const DineInData = table2Data?.ProductDetails
|
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 cgstTotal = OrderDetailGST && OrderDetailGST.length > 0
|
const cgstTotal = OrderDetailGST && OrderDetailGST.length > 0
|
||||||
? Number(OrderDetailGST.reduce((sum, item) => sum + (item.CGST || 0), 0))?.toFixed(2)
|
? Number(OrderDetailGST.reduce((sum, item) => sum + (item.CGST || 0), 0))?.toFixed(2)
|
||||||
|
|
@ -135,7 +162,7 @@ const PurPrintstyleInvoice = ({
|
||||||
dataSource = [];
|
dataSource = [];
|
||||||
}
|
}
|
||||||
|
|
||||||
console.log("Final DataSource:", table2Data, );
|
console.log("Final DataSource:", table2Data,);
|
||||||
|
|
||||||
const paginatedChunks = [];
|
const paginatedChunks = [];
|
||||||
|
|
||||||
|
|
@ -158,7 +185,51 @@ const PurPrintstyleInvoice = ({
|
||||||
if (shouldFooterBeOnNewPage && paginatedChunks.length > 0) {
|
if (shouldFooterBeOnNewPage && paginatedChunks.length > 0) {
|
||||||
paginatedChunks.push([]); // Empty chunk for footer-only page
|
paginatedChunks.push([]); // Empty chunk for footer-only page
|
||||||
}
|
}
|
||||||
|
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 (
|
return (
|
||||||
<div id={`TaxInvoice`} style={{
|
<div id={`TaxInvoice`} style={{
|
||||||
|
|
@ -207,7 +278,7 @@ const PurPrintstyleInvoice = ({
|
||||||
<>
|
<>
|
||||||
<div style={{ textAlign: 'center', marginBottom: '10px', display: "flex", justifyContent: "space-between", alignItems: "center", }}>
|
<div style={{ textAlign: 'center', marginBottom: '10px', display: "flex", justifyContent: "space-between", alignItems: "center", }}>
|
||||||
<div></div>
|
<div></div>
|
||||||
<h2 style={{ margin: '0', fontSize: '20px', fontWeight: '700' }}>{table2Data?.OrderType === "E" ? "Estimate" : (BillName ? BillName : "Tax Invoice")}</h2>
|
<h2 style={{ margin: '0', fontSize: '20px', fontWeight: '700', }}>{table2Data?.OrderType === "E" ? "Estimate" : (BillName ? BillName : "Tax Invoice")}</h2>
|
||||||
<div>
|
<div>
|
||||||
<div style={{ fontSize: '10px', marginTop: '2px' }}>(ORIGINAL FOR RECIPIENT)</div>
|
<div style={{ fontSize: '10px', marginTop: '2px' }}>(ORIGINAL FOR RECIPIENT)</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -232,7 +303,7 @@ const PurPrintstyleInvoice = ({
|
||||||
textAlign: 'left'
|
textAlign: 'left'
|
||||||
}}>
|
}}>
|
||||||
|
|
||||||
<div style={{ fontWeight: '700', fontSize: '15px', }}>
|
<div style={{ fontWeight: '700', fontSize: '15px', ...headerStyle }}>
|
||||||
{invoiceData.companyName}
|
{invoiceData.companyName}
|
||||||
</div>
|
</div>
|
||||||
<div style={{ fontWeight: '700', fontSize: '12px', }}>{invoiceData.companyspecname}</div>
|
<div style={{ fontWeight: '700', fontSize: '12px', }}>{invoiceData.companyspecname}</div>
|
||||||
|
|
@ -374,6 +445,7 @@ const PurPrintstyleInvoice = ({
|
||||||
// borderRight: '1px solid #000',
|
// borderRight: '1px solid #000',
|
||||||
borderBottom: '1px solid #000',
|
borderBottom: '1px solid #000',
|
||||||
borderTop: '1px solid #000',
|
borderTop: '1px solid #000',
|
||||||
|
...tableHeaderStyle
|
||||||
}}>
|
}}>
|
||||||
<div style={{ padding: '8px 4px', borderRight: '1px solid #000', textAlign: 'center' }}>SL.No</div>
|
<div style={{ padding: '8px 4px', borderRight: '1px solid #000', textAlign: 'center' }}>SL.No</div>
|
||||||
<div style={{ padding: '8px 4px', borderRight: '1px solid #000', textAlign: 'center' }}>Description of Goods</div>
|
<div style={{ padding: '8px 4px', borderRight: '1px solid #000', textAlign: 'center' }}>Description of Goods</div>
|
||||||
|
|
@ -392,6 +464,9 @@ const PurPrintstyleInvoice = ({
|
||||||
display: 'grid',
|
display: 'grid',
|
||||||
gridTemplateColumns: '5% 40% 12% 10% 12% 8% 13%',
|
gridTemplateColumns: '5% 40% 12% 10% 12% 8% 13%',
|
||||||
// borderRight: '1px solid #000',
|
// borderRight: '1px solid #000',
|
||||||
|
...(rowtypeStyle === (index % 2 === 0 ? "even" : "odd")
|
||||||
|
? tableBodyStyle
|
||||||
|
: {}),
|
||||||
|
|
||||||
}}>
|
}}>
|
||||||
<div style={{ padding: '8px 4px', borderRight: '1px solid #000', textAlign: 'center', fontWeight: '700' }}>{chunkIndex * chunkSize + index + 1}</div>
|
<div style={{ padding: '8px 4px', borderRight: '1px solid #000', textAlign: 'center', fontWeight: '700' }}>{chunkIndex * chunkSize + index + 1}</div>
|
||||||
|
|
@ -430,7 +505,7 @@ const PurPrintstyleInvoice = ({
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
{/* CGST */}
|
{/* CGST */}
|
||||||
{OrderDetailGST[0]?.TaxTypeName === "WithTax" && <div style={{
|
{OrderDetailGST[0]?.TaxTypeName === "WithTax" && <div style={{
|
||||||
display: 'grid',
|
display: 'grid',
|
||||||
gridTemplateColumns: '5% 40% 12% 10% 12% 8% 13%',
|
gridTemplateColumns: '5% 40% 12% 10% 12% 8% 13%',
|
||||||
// borderRight: '1px solid #000',
|
// borderRight: '1px solid #000',
|
||||||
|
|
@ -445,13 +520,13 @@ const PurPrintstyleInvoice = ({
|
||||||
<div style={{ borderRight: '1px solid #000' }}></div>
|
<div style={{ borderRight: '1px solid #000' }}></div>
|
||||||
<div style={{ borderRight: '1px solid #000' }}></div>
|
<div style={{ borderRight: '1px solid #000' }}></div>
|
||||||
{<div style={{ padding: '6px 6px', textAlign: 'right', }}>
|
{<div style={{ padding: '6px 6px', textAlign: 'right', }}>
|
||||||
{ 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 })
|
? Number(OrderDetailGST.reduce((sum, item) => sum + (item.CGST || 0), 0)).toLocaleString('en-IN', { minimumFractionDigits: 2, maximumFractionDigits: 2 })
|
||||||
: "0.00"}
|
: "0.00"}
|
||||||
</div>}
|
</div>}
|
||||||
</div>}
|
</div>}
|
||||||
{/* SGST */}
|
{/* SGST */}
|
||||||
{ OrderDetailGST[0]?.TaxTypeName === "WithTax" && <div style={{
|
{OrderDetailGST[0]?.TaxTypeName === "WithTax" && <div style={{
|
||||||
display: 'grid',
|
display: 'grid',
|
||||||
gridTemplateColumns: '5% 40% 12% 10% 12% 8% 13%',
|
gridTemplateColumns: '5% 40% 12% 10% 12% 8% 13%',
|
||||||
// borderRight: '1px solid #000',
|
// borderRight: '1px solid #000',
|
||||||
|
|
@ -472,7 +547,7 @@ const PurPrintstyleInvoice = ({
|
||||||
</div>
|
</div>
|
||||||
</div>}
|
</div>}
|
||||||
{/* IGST */}
|
{/* IGST */}
|
||||||
{ OrderDetailGST[0]?.TaxTypeName === "WithTax" && (
|
{OrderDetailGST[0]?.TaxTypeName === "WithTax" && (
|
||||||
<div style={{
|
<div style={{
|
||||||
display: 'grid',
|
display: 'grid',
|
||||||
gridTemplateColumns: '5% 40% 12% 10% 12% 8% 13%',
|
gridTemplateColumns: '5% 40% 12% 10% 12% 8% 13%',
|
||||||
|
|
@ -555,7 +630,7 @@ const PurPrintstyleInvoice = ({
|
||||||
</div>
|
</div>
|
||||||
<div style={{ borderRight: '1px solid #000' }}></div>
|
<div style={{ borderRight: '1px solid #000' }}></div>
|
||||||
<div style={{ borderRight: '1px solid #000' }}></div>
|
<div style={{ borderRight: '1px solid #000' }}></div>
|
||||||
<div style={{ padding: '8px 6px', textAlign: 'right', }}>
|
<div style={{ padding: '8px 6px', textAlign: 'right',...netAmountStyle }}>
|
||||||
₹ {Number(invoiceData.grandTotal).toLocaleString('en-IN', { minimumFractionDigits: 2, maximumFractionDigits: 2 })}
|
₹ {Number(invoiceData.grandTotal).toLocaleString('en-IN', { minimumFractionDigits: 2, maximumFractionDigits: 2 })}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue