68 lines
2 KiB
JavaScript
68 lines
2 KiB
JavaScript
// frontend/src/components/TxtToPdf.js
|
|
import React, { useState, useEffect } from 'react';
|
|
import axios from 'axios';
|
|
|
|
const API_URL = '/api';
|
|
|
|
function TxtToPdf() {
|
|
const [txtFiles, setTxtFiles] = useState([]);
|
|
const [selectedFile, setSelectedFile] = useState('');
|
|
const [message, setMessage] = useState('');
|
|
const [pdfFile, setPdfFile] = useState('');
|
|
|
|
useEffect(() => {
|
|
// Obtener la lista de archivos y filtrar solo los .txt
|
|
axios.get(`${API_URL}/files`)
|
|
.then(response => {
|
|
const files = response.data.files.filter(file => file.toLowerCase().endsWith('.txt'));
|
|
setTxtFiles(files);
|
|
})
|
|
.catch(err => console.error(err));
|
|
}, []);
|
|
|
|
const handleConversion = () => {
|
|
if (!selectedFile) {
|
|
setMessage("⚠️ Please select a TXT file.");
|
|
return;
|
|
}
|
|
axios.post(`${API_URL}/txttopdf`, { filename: selectedFile })
|
|
.then(response => {
|
|
setMessage(response.data.message);
|
|
setPdfFile(response.data.pdf_file);
|
|
})
|
|
.catch(err => {
|
|
setMessage("❌ Error converting TXT to PDF.");
|
|
console.error(err);
|
|
});
|
|
};
|
|
|
|
return (
|
|
<div style={{ textAlign: 'left', maxWidth: '600px', margin: '0 auto' }}>
|
|
<h2>TXT to PDF</h2>
|
|
<div style={{ marginBottom: '10px' }}>
|
|
<label>
|
|
Select TXT File:
|
|
<select
|
|
value={selectedFile}
|
|
onChange={(e) => setSelectedFile(e.target.value)}
|
|
style={{ marginLeft: '10px' }}
|
|
>
|
|
<option value="">-- Select TXT File --</option>
|
|
{txtFiles.map((file, index) => (
|
|
<option key={index} value={file}>{file}</option>
|
|
))}
|
|
</select>
|
|
</label>
|
|
</div>
|
|
<button onClick={handleConversion}>Convert to PDF</button>
|
|
{message && <p>{message}</p>}
|
|
{pdfFile && (
|
|
<p>
|
|
Download PDF: <a href={`${API_URL}/files/${pdfFile}`} download>{pdfFile}</a>
|
|
</p>
|
|
)}
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default TxtToPdf;
|