import React, { useEffect, useState } from 'react'; import { Descriptions, Badge, Layout, Row, Col, Card, Button } from 'antd'; import { SaleOrderService } from '@gtpl/shared-services/sale-management'; import { FactoriesInput, PlantInvoiceDetailsModel, PlantInvoiceDetailsRequest, SaleOrderDetailViewInfoDTO, UnitsOfWeightInput, } from '@gtpl/shared-models/sale-management'; import { AlertMessages } from '@gtpl/shared-utils/alert-messages'; import { ExporterDataInput } from '@gtpl/shared-models/logistics'; import { SaleOrderIdRequest, UomEnum } from '@gtpl/shared-models/common-models'; import ReactHTMLTableToExcel from 'react-html-table-to-excel'; import { useLocation } from 'react-router-dom'; import moment from 'moment'; // import jsPDF from 'jspdf'; // import html2canvas from 'html2canvas'; import jsPDF from 'jspdf'; import 'jspdf-autotable'; import html2canvas from 'html2canvas'; /* eslint-disable-next-line */ export interface IsfWorksheetProps { // props: any; saleOrderId: number; soData: SaleOrderDetailViewInfoDTO; isPresailing: boolean; } export function IsfWorksheet( props: IsfWorksheetProps ) { const salOrderService = new SaleOrderService(); const [plantDetails, setPlantDetails] = useState(); const [linerAddress, setLinerAddress] = useState([]); const [singleproductData, setSingleProductData] = useState([]); let totalCases = 0; let totalGrossWeight = 0; let totalLbWeight = 0; let totalAmount = 0; let lbPouchWeight let kgPouchWeight let packSize; // const printOrder = () => { // const printableElements = document.getElementById('printme').innerHTML; // const orderHTML = '' + printableElements + '' // const oldPage = document.body.innerHTML; // document.body.innerHTML = orderHTML; // // document.body.innerHTML = oldPage // window.print(); // } useEffect(() => { if (props.saleOrderId) { getLinerAddressForIsfWorksheet(props.saleOrderId); } }, [props.saleOrderId]) const getLinerAddressForIsfWorksheet = (saleOrderId) => { // const req=new SoFormSdfPrintDto() salOrderService.getLinerAddressForIsfWorksheet(new SaleOrderIdRequest(props.saleOrderId)).then(res => { if (res.status) { setLinerAddress(res.data) } }) } const getData = (saleOrderId) => { // const reqObj = new PlantInvoiceDetailsRequest(1); salOrderService.getPlantInvoiceDetails({ saleOrderId: saleOrderId }).then((res) => { console.log(res); if (res.status) { console.log(res); setPlantDetails(res.data); const output = [...new Map(res.data?.saleOrderItems?.map(o => [o.foodTypeName && o.itemName && o.valueAdditionOneIdName && o.valueAdditionTwoIdName && o.valueAdditionThreeIdName && o.valueAdditionFourIdName && o.valueAdditionFiveIdName, o])).values()] console.log("output"); console.log(output); setSingleProductData(output); } else { if (res.intlCode) { setPlantDetails(undefined); AlertMessages.getErrorMessage(res.internalMessage); } else { AlertMessages.getErrorMessage(res.internalMessage); } } }) .catch((err) => { AlertMessages.getErrorMessage(err.message); setPlantDetails(undefined); }); }; useEffect(() => { console.log('kkk'); if (props.saleOrderId) { getData(props.saleOrderId); } }, []) let exporterDetails = ExporterDataInput; const exporterData = exporterDetails.find( (item) => item.value == plantDetails?.exporterId ); let factoryDetails = FactoriesInput; let factoryId = 3; const unitsData = factoryDetails.find( (item) => item.id == plantDetails?.unitId ? plantDetails.unitId : factoryId ); let uom; let outputWeight = ''; plantDetails?.saleOrderItems?.map(item => { totalCases += item.cases; totalGrossWeight += Number(item.grossWeight); console.log(plantDetails) console.log(item.cases) console.log(item.grossWeight) console.log(totalGrossWeight) uom = UnitsOfWeightInput.find(uom => uom.value == item.uomId); if (uom.name == UomEnum.LB || uom.name == UomEnum.OZ) { outputWeight = UomEnum.LB; } else if (uom.name == UomEnum.KG || uom.name == UomEnum.Gms) { outputWeight = UomEnum.KG; `` } lbPouchWeight = Number(plantDetails?.saleOrderItems[0].pouchWeight) kgPouchWeight = Number(plantDetails?.saleOrderItems[0].pouchWeight) if (uom.name == UomEnum.OZ) { lbPouchWeight = lbPouchWeight * 0.0625 } if (uom.name == UomEnum.Gms) { kgPouchWeight = kgPouchWeight * 0.001 } }); const grouped = plantDetails?.saleOrderItems?.filter((value, index, self) => index === self.findIndex((t) => ( t.pouches === value.pouches && t.pouchWeight === value.pouchWeight )) ) const productGrouped = plantDetails?.saleOrderItems?.filter((value, index, self) => index === self.findIndex((t) => ( t.itemName === value.itemName && t.varientCode === value.varientCode )) ) const downloadPD = () => { const input = document.getElementById('printme'); html2canvas(input).then((canvas) => { const imgData = canvas.toDataURL('image/png'); const pdf = new jsPDF('p', 'mm', 'a4'); const imgProps = pdf.getImageProperties(imgData); const pdfWidth = pdf.internal.pageSize.getWidth(); const pdfHeight = (imgProps.height * pdfWidth) / imgProps.width; pdf.addImage(imgData, 'PNG', 0, 0, pdfWidth, pdfHeight); pdf.save('ISFWorksheet.pdf'); }); }; // const downloadPDF = () => { // const pdf = new jsPDF('p', 'mm', 'a4'); // const element = document.getElementById('printme'); // // Calculate the width of the PDF based on the available screen size // const screenWidth = window.innerWidth; // let pdfWidth; // if (screenWidth < 768) { // // For small screens, set a smaller width // pdfWidth = 150; // } else { // // For larger screens, set the width to fit A4 format // pdfWidth = 190; // } // pdf.html(element, { // callback: function (pdf) { // // Generate the PDF as a blob // const blob = pdf.output('blob'); // const blobUrl = URL.createObjectURL(blob); // // Open the PDF in a new window // const newWindow = window.open(blobUrl, '_blank'); // if (newWindow) { // newWindow.focus(); // } else { // // Handle pop-up blockers or other issues // console.error('Failed to open PDF in a new window.'); // } // }, // x: 10, // y: 10, // width: pdfWidth, // windowWidth: element.scrollWidth, // }); // } const downloadPDF = () => { const pdf = new jsPDF('p', 'mm', 'a4'); const element = document.getElementById('printme'); // Calculate the width of the PDF based on the available screen size const screenWidth = window.innerWidth; let pdfWidth; if (screenWidth < 768) { // For small screens, set a smaller width pdfWidth = 150; } else { // For larger screens, set the width to fit A4 format pdfWidth = 190; } pdf.html(element, { callback: function (pdf) { // Print the PDF directly pdf.autoPrint(); pdf.output('dataurlnewwindow'); }, x: 10, y: 10, width: pdfWidth, windowWidth: element.scrollWidth, }); }; // finall // const downloadPDF = () => { // const pdf = new jsPDF('p', 'mm', 'a4'); // const element = document.getElementById('printme'); // // Fixed width to avoid issues with zoom levels // const pdfWidth = 190; // Standard width for A4 in mm // // Optional: Ensure that the element is scaled properly // const originalTransform = element.style.transform; // element.style.transform = 'scale(1)'; // element.style.transformOrigin = 'top left'; // pdf.html(element, { // callback: function (pdf) { // // Restore the original transform after rendering // element.style.transform = originalTransform; // // Print the PDF directly // pdf.autoPrint(); // pdf.output('dataurlnewwindow'); // }, // x: 10, // y: 10, // width: pdfWidth, // windowWidth: element.scrollWidth, // Fixed value to avoid scaling issues // }); // }; // const downloadPDF = () => { // const pdf = new jsPDF('p', 'mm', 'a4'); // const element = document.getElementById('printme'); // // Generate a unique code consisting of two letters and two numbers // const generateUniqueCode = () => { // const characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ'; // const numbers = '0123456789'; // let result = ''; // // Generate two random letters // for (let i = 0; i < 2; i++) { // const randomIndex = Math.floor(Math.random() * characters.length); // result += characters[randomIndex]; // } // // Generate two random numbers // for (let i = 0; i < 2; i++) { // const randomIndex = Math.floor(Math.random() * numbers.length); // result += numbers[randomIndex]; // } // return result; // }; // // Get today's date in YYYYMMDD format // const getCurrentDate = () => { // const today = new Date(); // const year = today.getFullYear(); // const month = String(today.getMonth() + 1).padStart(2, '0'); // const day = String(today.getDate()).padStart(2, '0'); // return `${year}${month}${day}`; // }; // // Calculate the width of the PDF based on the available screen size // const screenWidth = window.innerWidth; // let pdfWidth; // if (screenWidth < 768) { // // For small screens, set a smaller width // pdfWidth = 150; // } else { // // For larger screens, set the width to fit A4 format // pdfWidth = 190; // } // const uniqueCode = generateUniqueCode(); // const currentDate = getCurrentDate(); // const fileName = `FBGS_${uniqueCode}_${currentDate}.pdf`; // pdf.html(element, { // callback: function (pdf) { // pdf.save(fileName); // Save the PDF with the generated filename // }, // x: 10, // y: 10, // width: pdfWidth, // windowWidth: element.scrollWidth, // }); // }; return ( <>

{/* */}

          Yes   No
 Data Submited Date:  
 SID:  
 Client Code:  
 Filing Date:  
 Bill OnFile Date:  

FBGS Logo

FBGS ISF 10+2 Filling Form

ETD : {props.isPresailing ? moment(plantDetails?.etd).format('DD-MMM-YYYY') : plantDetails?.shippedOnboardDate}   {props.isPresailing ? plantDetails?.shippedOnboardDate : plantDetails?.shippedOnboardDate} ETA : {(plantDetails?.shippedOnboardDate) ? moment(plantDetails?.shippedOnboardDate).format('DD-MMM-YYYY') : ""} Import of record : {exporterData?.importerOfRecord} Consignee : {plantDetails?.consignee?plantDetails?.consignee:"-"}
Loading Port : {(plantDetails?.portOfDischarge ? (plantDetails.portOfDischarge + ',') : '') + (plantDetails?.country ? plantDetails?.country : '')} Discharge port :   {(plantDetails?.saleOrderItems[0]?.destinationDetails ? (plantDetails?.saleOrderItems[0]?.destinationDetails + ',') : '') + (plantDetails?.country ? plantDetails?.country : '')} Vessel / Voyage : {plantDetails?.vesselName} Weight(KGS ) : {plantDetails?.grossWeight?plantDetails?.grossWeight:"-"}{""}KGS
Master Bill Of Lading # : Ams House Bill of Lading # : Container Number: No. of Pakgs  :
{plantDetails?.trackingNo}  {plantDetails?.saleOrderItems[0].containerNo} {totalCases}{""}MASTER CARTONS
{}  {}
{}  {}
{}  {}
   Seller (or Owner)/Name and Address    Buyer (or Owner)/Name and Address
{(exporterData?.name) ? exporterData?.name : ''}

SUPPLIERS  ( SELLER  ) ADDRESS   :

{(exporterData?.addressOne) ? exporterData?.addressOne + ',' : ''} {(exporterData?.addressTwo) ? (exporterData?.addressTwo) + ' - ' + exporterData?.postalCode : '' + "," + exporterData?.country}
usfda reg no:{exporterData?.usfdaRegNo}
{/*
*/}    {plantDetails?.saleOrderItems?.[0]?.customeraddress?.[0] ? `${plantDetails.saleOrderItems[0].customeraddress[0]},` : '-'}
   {plantDetails?.saleOrderItems?.[0]?.customeraddress?.[1] ? plantDetails.saleOrderItems[0].customeraddress[1] + "," : '-'} {plantDetails?.saleOrderItems?.[0]?.customeraddress ? plantDetails.saleOrderItems[0].customeraddress + "," : '-'} {plantDetails?.saleOrderItems?.[0]?.customeraddress ? plantDetails.saleOrderItems[0].customeraddress : '-'}
   FDA REGISTRATION   NO. {unitsData?.consigneefdaRegNumber} {/*
*/}
   Ship To ( Name and Address ) : For FBGS   use only
  {(plantDetails?.saleOrderItems[0]?.destinationDetails ? (plantDetails?.saleOrderItems[0]?.destinationDetails)?.toUpperCase() + "," : '') + (plantDetails?.country ? plantDetails?.country : '')}
 Information Completed:
 		           
   Container Stuffing Location ( Name and Address   )
{(exporterData?.name) ? exporterData?.name : ''}

SUPPLIERS  ( SELLER  ) ADDRESS   :

{(exporterData?.addressOne) ? exporterData?.addressOne + ',' : ''} {(exporterData?.addressTwo) ? (exporterData?.addressTwo) + ' - ' + exporterData?.postalCode : '' + "," + exporterData?.country}
usfda reg no:{exporterData?.usfdaRegNo}
   Consolidator (Stuffer) NAME and Address
 {linerAddress[0]?.name ? linerAddress[0]?.name : '-'}
 {linerAddress[0]?.linerAddress?linerAddress[0]?.linerAddress:"-"}
{/*   {((plantDetails?.invoicedPlant?.postalCode) ? plantDetails?.invoicedPlant?.postalCode : "") + "," + ((plantDetails?.invoicedPlant?.distirctName) ? plantDetails?.invoicedPlant?.distirctName : "")}
  {((plantDetails?.invoicedPlant?.stateName) ? plantDetails?.invoicedPlant?.stateName : "") + "," + ((plantDetails?.invoicedPlant?.countryName) ? plantDetails?.invoicedPlant?.countryName : "")}
*/}
Manufacture( Name and address ) Country Of Origin Commodity HTS-6 Number Or Products
Description With Commercial Invoice attached:
  {exporterData?.name}

  MANUFACTURERS   ADDRESS   :
   {plantDetails?.invoicedPlant?.villageName && `${plantDetails.invoicedPlant.villageName}, `}    {plantDetails?.invoicedPlant?.mandalName && `${plantDetails.invoicedPlant.mandalName}`}
   {plantDetails?.invoicedPlant?.postalCode && `${plantDetails.invoicedPlant.postalCode}, `}   {plantDetails?.invoicedPlant?.distirctName && `${plantDetails.invoicedPlant.distirctName}`}
  {plantDetails?.invoicedPlant?.stateName && `${plantDetails.invoicedPlant.stateName}, `}   {plantDetails?.invoicedPlant?.countryName && `${plantDetails.invoicedPlant.countryName}`}
  
FDA Registration   Number   :
     {plantDetails?.invoicedPlant?.fdaRegNumber}
  {plantDetails?.invoicedPlant?.feiNumber && ( <>  
FEI Number:
    {plantDetails.invoicedPlant.feiNumber} )} 		  INDIA   {plantDetails?.saleOrderItems[0]?plantDetails?.saleOrderItems[0]?.hsnCode?.replace(/^\D+/, ''):"-"}
     
// ); } export default IsfWorksheet;