create new componnt ReprintPDFDataShare
This commit is contained in:
Srinath
parent
ede0fce223
commit
578f27337a
|
|
@ -0,0 +1,281 @@
|
|||
import { FaDownload, FaWhatsapp } from "react-icons/fa";
|
||||
import { extractLastNumberOrderId, getSession } from "../../../../../Services/Others";
|
||||
import { useDispatch } from "react-redux";
|
||||
import { useCallback, useState } from "react";
|
||||
import { DatePicker, Modal } from "antd";
|
||||
import { ReprintDetails } from "../../../../../Features/BookingScreen/Customer/addCustomer";
|
||||
import Buttons from "../../../../../Components/Forms/Buttons";
|
||||
import { MobileMultiPdfPrint, PdfProcessingProgress } from "../../BookingFunctionality/MobileMultiPdfPrint";
|
||||
import PaymentPdfBooking from "../../../../paymentpdfPage/PaymentPdfBooking";
|
||||
import { MdEmail } from "react-icons/md";
|
||||
import { uploadImage } from "../../../../../Features/upload/upload";
|
||||
import { SelfBookingEmailSendLink } from "../../../../../Features/ConfigMasterPage/ConfigMasterPage";
|
||||
import { Messages } from "../../../../../Components/Notifications/Messages";
|
||||
const { RangePicker } = DatePicker;
|
||||
const uploadApiUrl = import.meta.env.ENV_IMAGE_UPLOAD_API_URL;
|
||||
|
||||
const ReprintPDFDataShare = ({ printDatas, printerTemplateStyle, SettingDataSelector, open = false, onClose = () => { } }) => {
|
||||
const dispatch = useDispatch();
|
||||
const CompId = getSession('CompId');
|
||||
const BranchId = getSession('BranchId');
|
||||
const AppId = getSession('AppId');
|
||||
const UserId = getSession('UserId');
|
||||
|
||||
const [dateStrings, setDateStrings] = useState([]);
|
||||
const [type, setType] = useState("Sales");
|
||||
const [reprintData, setReprintData] = useState();
|
||||
const [isProcessing, setIsProcessing] = useState(false);
|
||||
const [processingProgress, setProcessingProgress] = useState(0);
|
||||
const [isDuplicate, setIsDuplicate] = useState('Original');
|
||||
const [emailId, setEmailId] = useState('');
|
||||
const [isEmail, setIsEmail] = useState(false);
|
||||
const [pdfUrl, setPdfUrl] = useState(false);
|
||||
const [messageType, setMessageType] = useState(null);
|
||||
const [messageData, setMessageData] = useState(null);
|
||||
const [isFetching, setIsFetching] = useState(false);
|
||||
|
||||
const handleDateChange = (dateStrings) => {
|
||||
if (dateStrings[0] && dateStrings[1]) {
|
||||
setDateStrings(dateStrings);
|
||||
fetchData(dateStrings);
|
||||
}
|
||||
};
|
||||
|
||||
const fetchData = async (dates = dateStrings) => {
|
||||
setIsFetching(true);
|
||||
try {
|
||||
const Response = await dispatch(ReprintDetails({
|
||||
CompId,
|
||||
BranchId,
|
||||
AppId,
|
||||
OrderFromDate: dates?.[0] ?? '',
|
||||
OrderToDate: dates?.[1] ?? '',
|
||||
Type: type
|
||||
})).unwrap();
|
||||
if (Response?.data?.statusCode === 1) {
|
||||
setReprintData(Response?.data?.data);
|
||||
} else {
|
||||
setReprintData(null);
|
||||
}
|
||||
} finally {
|
||||
setIsFetching(false);
|
||||
}
|
||||
};
|
||||
|
||||
const pdfPast = async () => {
|
||||
if (printerTemplateStyle !== "TaxInvoice") {
|
||||
setMessageType("error");
|
||||
setMessageData("Please select invoice print style");
|
||||
return;
|
||||
}
|
||||
|
||||
if (!reprintData || reprintData.length === 0) {
|
||||
return;
|
||||
}
|
||||
try {
|
||||
setIsProcessing(true);
|
||||
setProcessingProgress(0);
|
||||
const result = await MobileMultiPdfPrint({
|
||||
printerTemplateStyle,
|
||||
printDatas,
|
||||
PrintOrderDetails: reprintData,
|
||||
setPrintOrderDetails: setReprintData,
|
||||
PrintComing: 'download',
|
||||
UserId: UserId,
|
||||
dispatch,
|
||||
onProgress: (progress) => setProcessingProgress(progress),
|
||||
returnBlob: true
|
||||
});
|
||||
|
||||
if (result?.pdfBlob) {
|
||||
const file = new File([result.pdfBlob], 'invoices.pdf', { type: 'application/pdf' });
|
||||
const uploadImgData = await dispatch(uploadImage(file)).unwrap();
|
||||
if (uploadImgData?.data?.status) {
|
||||
const imageUrl = uploadImgData?.data?.image;
|
||||
const urlObj = new URL(imageUrl);
|
||||
const fileName = urlObj.searchParams.get("fileId");
|
||||
const downloadUrl = `${uploadApiUrl}/upload/DownloadFile?fileId=${fileName}`;
|
||||
setPdfUrl(downloadUrl);
|
||||
} else {
|
||||
setMessageType("error");
|
||||
setMessageData("Failed to upload PDF");
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
setMessageType("error");
|
||||
setMessageData("Error processing PDF");
|
||||
} finally {
|
||||
setIsProcessing(false);
|
||||
}
|
||||
};
|
||||
const handleDownload = () => {
|
||||
if (pdfUrl) {
|
||||
window.open(pdfUrl, '_blank');
|
||||
}
|
||||
};
|
||||
const SendToEmailLink = async () => {
|
||||
if (!emailId) {
|
||||
setMessageType("error");
|
||||
setMessageData("Please enter a recipient email.");
|
||||
return;
|
||||
}
|
||||
const data = {
|
||||
toEmail: emailId,
|
||||
type: 'M',
|
||||
HeaderType:'invoice attached',
|
||||
fileUrl: pdfUrl,
|
||||
};
|
||||
|
||||
try {
|
||||
const res = await dispatch(SelfBookingEmailSendLink(data)).unwrap();
|
||||
setMessageType("success");
|
||||
setMessageData(res.data?.response);
|
||||
clearAndClose();
|
||||
} catch (err) {
|
||||
console.error("Error sending Email:", err);
|
||||
setMessageType("error");
|
||||
setMessageData("Failed to send email. Please try again.");
|
||||
}
|
||||
};
|
||||
|
||||
const handleWhatsAppClick = () => {
|
||||
window.open(whatsappShareUrl, '_blank');
|
||||
clearAndClose();
|
||||
};
|
||||
|
||||
const clearAndClose = () => {
|
||||
setDateStrings([]);
|
||||
setReprintData(null);
|
||||
setPdfUrl(false);
|
||||
setEmailId('');
|
||||
setIsEmail(false);
|
||||
onClose();
|
||||
setDateStrings([]);
|
||||
};
|
||||
const message = `
|
||||
Please find your complete bill invoice attached in the link below:
|
||||
${pdfUrl}
|
||||
|
||||
Kindly review the details and keep this invoice for your records.
|
||||
|
||||
Thank you for choosing us!`;
|
||||
|
||||
const whatsappShareUrl = `https://wa.me/?text=${encodeURIComponent(message)}`;
|
||||
|
||||
const onComplete = useCallback(() => {
|
||||
setMessageData(null);
|
||||
setMessageType(null);
|
||||
}, []);
|
||||
return (
|
||||
<div>
|
||||
<Messages
|
||||
messageType={messageType}
|
||||
messageData={messageData}
|
||||
onComplete={onComplete}
|
||||
/>
|
||||
<Modal
|
||||
title="Invoice Send"
|
||||
open={open}
|
||||
onCancel={onClose}
|
||||
footer={null}
|
||||
>
|
||||
<>
|
||||
<div style={{ display: 'flex', gap: '1rem', alignItems: "center" }}>
|
||||
<div>
|
||||
<RangePicker
|
||||
placeholder={['Start Date', 'End Date']}
|
||||
format="YYYY-MM-DD"
|
||||
onChange={handleDateChange}
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<Buttons
|
||||
buttonText="Invoice Pdf"
|
||||
color="901D77"
|
||||
handleSubmit={pdfPast}
|
||||
disabled={!reprintData || reprintData.length === 0 || isFetching}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
{isEmail && <div style={{ display: 'flex', gap: '1rem', alignItems: "center", marginTop: '1rem' }}>
|
||||
<input
|
||||
type="email"
|
||||
placeholder="Enter email address"
|
||||
value={emailId}
|
||||
onChange={(e) => setEmailId(e.target.value)}
|
||||
style={{ flex: 1, padding: '8px', borderRadius: '4px', border: '1px solid #d9d9d9' }}
|
||||
/>
|
||||
<Buttons
|
||||
buttonText="Send Email"
|
||||
color="901D77"
|
||||
handleSubmit={() => SendToEmailLink()}
|
||||
/>
|
||||
|
||||
</div>}
|
||||
{pdfUrl && (
|
||||
<div
|
||||
style={{
|
||||
display: 'flex',
|
||||
justifyContent: 'space-between',
|
||||
alignItems: 'center',
|
||||
marginBottom: '10px',
|
||||
margin: '20px 0px'
|
||||
}}
|
||||
>
|
||||
<div className="action-icons-reprint">
|
||||
<FaDownload
|
||||
onClick={handleDownload}
|
||||
className="icon-download"
|
||||
style={{ cursor: 'pointer' }}
|
||||
/>
|
||||
<MdEmail onClick={() => setIsEmail(prev => !prev)} className="icon-email" style={{ cursor: 'pointer' }} />
|
||||
<FaWhatsapp
|
||||
onClick={handleWhatsAppClick}
|
||||
className="icon-whatsapp"
|
||||
style={{ cursor: 'pointer' }}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
|
||||
|
||||
<PdfProcessingProgress
|
||||
progress={processingProgress}
|
||||
isProcessing={isProcessing}
|
||||
/>
|
||||
</>
|
||||
</Modal>
|
||||
|
||||
<div style={{ display: 'none' }}>
|
||||
{reprintData?.map((orderDetail, index) => (
|
||||
<div key={index} id={`RePrint-${index}`}>
|
||||
<PaymentPdfBooking
|
||||
index={index}
|
||||
table2Data={orderDetail}
|
||||
singleData2={orderDetail?.productDetails}
|
||||
ReprintType={isDuplicate}
|
||||
orderId={
|
||||
orderDetail?.OrderId &&
|
||||
extractLastNumberOrderId(
|
||||
orderDetail?.OrderId,
|
||||
orderDetail?.FYStatus
|
||||
)
|
||||
}
|
||||
CreatedDate={orderDetail?.CreatedDate}
|
||||
PaymentStatus={orderDetail?.OrderPaymentDtl}
|
||||
Preference={SettingDataSelector}
|
||||
printDatas={printDatas}
|
||||
/>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
)
|
||||
}
|
||||
|
||||
export default ReprintPDFDataShare;
|
||||
Loading…
Reference in New Issue