import { Button, Flex } from "@mantine/core"; import { useState } from "react"; import createReport from 'docx-templates' const xslTemplate = ` progid="Excel.Sheet" Регион Нас. пункт Котельная Адрес Кол-во домов Этаж. Общая пл. Кол-во прожив. Отопление ГВС ХВС Канализация Сальдо исход. Объем Сумма Объем Сумма Объем Сумма Объем Сумма
2 2 2
Регион Нас. пункт Котельная Наименование Кол-во объектов Объем здания Отопление Подогрев ГВС ХВС Канализация Итого Объем Сумма Объем Сумма Объем Сумма Объем Сумма Объем Сумма
` const PrintReport = () => { const [loading, setLoading] = useState(false); const generateDocx = async () => { setLoading(true); try { // Fetch the DOCX template from the public folder const response = await fetch("/template.docx"); const response_table = await fetch("/template_table.docx"); const templateArrayBuffer = await response.arrayBuffer(); const templateArrayBuffer_table = await response_table.arrayBuffer(); // Convert ArrayBuffer to Uint8Array (Fix TypeScript error) const templateUint8Array = new Uint8Array(templateArrayBuffer); const templateUint8Array_table = new Uint8Array(templateArrayBuffer_table); // Fetch the image (Example: Load from public folder) const imageResponse = await fetch("/test.png"); // Change this to your image path const imageBlob = await imageResponse.blob(); const imageArrayBuffer = await imageBlob.arrayBuffer(); const imageUint8Array = new Uint8Array(imageArrayBuffer); // Generate the DOCX file with the replacement const report = await createReport({ template: templateUint8Array, // Ensure it's Uint8Array data: { test: "Hello World", myImage: { width: 6, // Width in cm height: 6, // Height in cm data: imageUint8Array, // Image binary data extension: ".png", // Specify the image format }, }, }); const report_table = await createReport({ template: templateUint8Array_table, // Ensure it's Uint8Array data: { test: "Hello World", rows: [ { first: 'A', second: 'B', third: 'C', fourth: 'D', }, { first: 'E', second: 'F', third: 'G', fourth: 'H', }, { first: 'I', second: 'J', third: 'K', fourth: 'L', } ] }, }); // Convert Uint8Array to a Blob const blob = new Blob([report], { type: "application/vnd.openxmlformats-officedocument.wordprocessingml.document", }); const blob_table = new Blob([report_table], { type: "application/vnd.openxmlformats-officedocument.wordprocessingml.document", }); // Create a download link and trigger the download const url = URL.createObjectURL(blob); const a = document.createElement("a"); a.href = url; a.download = "report.docx"; document.body.appendChild(a); a.click(); document.body.removeChild(a); // Create a download link and trigger the download const url_table = URL.createObjectURL(blob_table); const a_table = document.createElement("a"); a_table.href = url_table; a_table.download = "report_table.docx"; document.body.appendChild(a_table); a_table.click(); document.body.removeChild(a_table); // Revoke the object URL after download URL.revokeObjectURL(url); URL.revokeObjectURL(url_table); } catch (error) { console.error("Error generating DOCX:", error); } finally { setLoading(false); } } const handleGenerateExcel = () => { // Define the example XML data const xmlData = ` 1 Region 1 City 1 10 1000 500 200 1000 300 1500 400 2000 500 2500 300 `; // Parse the XSL template and XML data const parser = new DOMParser(); const xslDoc = parser.parseFromString(xslTemplate, "application/xml"); const xmlDoc = parser.parseFromString(xmlData, "application/xml"); // Apply the transformation const xsltProcessor = new XSLTProcessor(); xsltProcessor.importStylesheet(xslDoc); const resultDocument = xsltProcessor.transformToDocument(xmlDoc); // Serialize the result to a string const serializer = new XMLSerializer(); const resultXml = serializer.serializeToString(resultDocument); // Add missing Excel-specific headers if needed const correctedXml = `\n` + resultXml // Convert to Blob and trigger download const blob = new Blob([correctedXml], { type: "application/vnd.ms-excel" }); const url = URL.createObjectURL(blob); const link = document.createElement("a"); link.href = url; link.download = "template.xls"; link.click(); // Clean up URL.revokeObjectURL(url); } return ( ) } export default PrintReport