fix uploads encoding (cyrilic)

This commit is contained in:
Dobromir Popov
2024-05-07 21:37:13 +03:00
parent 7b741afa06
commit 5c596cc7c2
3 changed files with 48 additions and 27 deletions

View File

@ -23,17 +23,23 @@ const PDFViewerPage = ({ pdfFiles }) => {
const handleFileUpload = async (event) => {
const file = event.target.files[0];
//utf-8 encoding
// const formData = new FormData();
const formData = new FormData();
formData.append('file', file);
// formData.append('file', file);
const newFile = new File([file], encodeURI(file.name), { type: file.type });
formData.append('file', newFile);
const subfolder = 'permits'; // Change this as needed based on your subfolder structure
try {
const response = await axiosInstance.post(`/api/content/${subfolder}`, formData, {
headers: {
'Content-Type': 'multipart/form-data'
'Content-Type': 'multipart/form-data',
// 'Content-Encoding': 'utf-8'
}
});
setFiles([...files, response.data]);
const newFiles = response.data.files.map(file => ({ name: decodeURIComponent(file.originalname), url: file.path }));
setFiles([...files, ...newFiles]);
} catch (error) {
console.error('Error uploading file:', error);
}
@ -44,25 +50,35 @@ const PDFViewerPage = ({ pdfFiles }) => {
<Layout>
<h1 className="text-3xl font-bold p-4 pt-8">Разрешителни</h1>
<ProtectedRoute allowedRoles={[UserRole.ADMIN]} deniedMessage="">
<div className="border border-blue-500 border-solid p-2">
<div className="mb-4">
За да качите файл кликнете на бутона по-долу и изберете файл от вашия компютър.
<div className="border border-blue-500 p-4 rounded shadow-md">
<div className="mb-6">
<p className="text-lg mb-2">За да качите файл кликнете на бутона по-долу и изберете файл от вашия компютър.</p>
<input type="file" onChange={handleFileUpload} className="block w-full text-sm text-gray-600
file:mr-4 file:py-2 file:px-4
file:border-0
file:text-sm file:font-semibold
file:bg-blue-500 file:text-white
hover:file:bg-blue-600"/>
</div>
<input type="file" onChange={handleFileUpload} className="mb-4" />
<div className="mb-4">
Съществуващи файлове:
<div>
<h3 className="text-lg font-semibold mb-2">Съществуващи файлове:</h3>
{files.length > 0 ? (
files.map((file, index) => (
<div key={index} className="flex items-center justify-between mb-2 p-2 hover:bg-blue-50 rounded">
<a href={file.url} className="text-blue-600 hover:text-blue-800 visited:text-purple-600 underline" target="_blank" rel="noopener noreferrer">
{file.name}
</a>
<button onClick={() => handleFileDelete(file.name)} className="ml-4 bg-red-500 hover:bg-red-700 text-white font-bold py-1 px-2 rounded focus:outline-none focus:ring-2 focus:ring-red-500 focus:ring-opacity-50">
изтрий
</button>
</div>
))
) : (
<p className="text-gray-500">Няма качени файлове.</p>
)}
</div>
{files.map((file, index) => (
<div key={file.name} className="py-2">
<a href={file.url} className="text-blue-600 hover:text-blue-800 visited:text-purple-600 underline" target='_blank'>
{file.name}
</a>
<button onClick={() => handleFileDelete(file.name)} className="ml-4 bg-red-500 hover:bg-red-700 text-white font-bold py-1 px-2 rounded">
изтрий
</button>
</div>
))}
</div>
</ProtectedRoute>
<div style={{ width: '100%', height: 'calc(100vh - 100px)' }}> {/* Adjust the 100px based on your header/footer size */}
@ -111,5 +127,4 @@ export const getServerSideProps = async (context) => {
}
};
}
// export const getServerSideProps = async (context) => {