feat: Add Uziomy calculator page with grounding calculations and document generation
- Implemented Uziomy component for calculating grounding parameters. - Added state management for input fields and results. - Integrated DatePicker for date selection. - Created functions for grounding calculations, document generation (DOCX), and DXF file generation. - Enhanced UI with Tailwind CSS for better styling and responsiveness. - Updated global styles to include Inter font and custom scrollbar styles. - Configured Tailwind CSS to extend colors, fonts, and animations.
This commit is contained in:
178
archive/pages/cross_old.js
Normal file
178
archive/pages/cross_old.js
Normal file
@@ -0,0 +1,178 @@
|
||||
import { useState, useCallback } from "react";
|
||||
import { useSession, signIn } from "next-auth/react";
|
||||
import Layout from "../components/ui/Layout";
|
||||
import { Card, CardHeader, CardContent, CardTitle, CardDescription, Button, Alert } from "../components/ui/components";
|
||||
import {
|
||||
FileUploader,
|
||||
FileCard,
|
||||
} from "evergreen-ui";
|
||||
import { CloudArrowUpIcon as CloudUploadIcon, ArrowDownTrayIcon as DownloadIcon, Squares2X2Icon as GridIcon } from '@heroicons/react/24/outline';
|
||||
import axios from "axios";
|
||||
|
||||
export default function Cross() {
|
||||
const { data: session } = useSession();
|
||||
|
||||
const [fileData, setFileData] = useState(null);
|
||||
const handleDownload = () => {
|
||||
console.log("down");
|
||||
if (fileData) {
|
||||
console.log("load");
|
||||
// const link = document.createElement("a");
|
||||
// link.href = `data:application/octet-stream;base64,${fileData}`;
|
||||
// link.download = "plik.dxf";
|
||||
// link.click();
|
||||
document.getElementById("down").download = fileData.filename;
|
||||
console.log(fileData.filename)
|
||||
|
||||
document.getElementById("down").href = "cross.dxf";
|
||||
console.log("cross.dxf")
|
||||
|
||||
document.getElementById("down").click();
|
||||
}
|
||||
};
|
||||
|
||||
const [files, setFiles] = useState([]);
|
||||
const [fileRejections, setFileRejections] = useState([]);
|
||||
const handleChange = useCallback((files) => setFiles([files[0]]), []);
|
||||
const handleRejected = useCallback(
|
||||
(fileRejections) => setFileRejections([fileRejections[0]]),
|
||||
[]
|
||||
);
|
||||
const handleRemove = useCallback(() => {
|
||||
setFiles([]);
|
||||
setFileRejections([]);
|
||||
}, []);
|
||||
|
||||
const handleSubmit = async (event) => {
|
||||
event.preventDefault();
|
||||
|
||||
let file = files[0];
|
||||
|
||||
if (!file) {
|
||||
// Handle error if no file is selected
|
||||
return;
|
||||
}
|
||||
|
||||
const formData = new FormData();
|
||||
formData.append("file", file);
|
||||
|
||||
axios
|
||||
.post("/api/upload", formData, {
|
||||
headers: {
|
||||
"Content-Type": "multipart/form-data",
|
||||
},
|
||||
})
|
||||
.then((response) => {
|
||||
console.log(response.data);
|
||||
if (response.data.toString().startsWith("Py Error")) {
|
||||
toaster.danger(response.data);
|
||||
return;
|
||||
}
|
||||
toaster.warning(response.statusText);
|
||||
console.log(response.data)
|
||||
setFileData(response.data);
|
||||
document.getElementById("download").disabled = false;
|
||||
|
||||
// document.getElementById("down").download =
|
||||
// response.data.filename.toString().split(".")[0].split("-")[1]+"_s.dxf";
|
||||
// document.getElementById("down").href =
|
||||
// "uploads/"+response.data.filename.toString().split(".")[0]+"_s.dxf";
|
||||
// document.getElementById("down").click();
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error(error);
|
||||
});
|
||||
};
|
||||
|
||||
if (session) {
|
||||
return (
|
||||
<div className="">
|
||||
<Head>
|
||||
<title>Wastpol</title>
|
||||
</Head>
|
||||
|
||||
<div className="flex md:flex-row flex-col justify-between px-8 mt-2">
|
||||
<Nav />
|
||||
<UserTop session={session} />
|
||||
</div>
|
||||
|
||||
<main className="flex flex-1 flex-col items-center">
|
||||
<FileUploader
|
||||
label="Prześlij plik"
|
||||
description="Możesz dodać 1 plik, max 50 MB."
|
||||
maxSizeInBytes={50 * 1024 ** 2}
|
||||
maxFiles={1}
|
||||
onChange={handleChange}
|
||||
onRejected={handleRejected}
|
||||
renderFile={(file) => {
|
||||
const { name, size, type } = file;
|
||||
const fileRejection = fileRejections.find(
|
||||
(fileRejection) => fileRejection.file === file
|
||||
);
|
||||
const { message } = fileRejection || {};
|
||||
return (
|
||||
<FileCard
|
||||
key={name}
|
||||
isInvalid={fileRejection != null}
|
||||
name={name}
|
||||
onRemove={handleRemove}
|
||||
sizeInBytes={size}
|
||||
type={type}
|
||||
validationMessage={message}
|
||||
/>
|
||||
);
|
||||
}}
|
||||
values={files}
|
||||
/>
|
||||
|
||||
<Button
|
||||
marginY={8}
|
||||
marginRight={12}
|
||||
appearance="default"
|
||||
iconAfter={BuildIcon}
|
||||
onClick={(e) => {
|
||||
console.log("louding begins");
|
||||
console.log(files);
|
||||
document.getElementById("download").disabled = false;
|
||||
handleSubmit(e);
|
||||
}}
|
||||
>
|
||||
Dodaj siatkę
|
||||
</Button>
|
||||
<Button
|
||||
id="download"
|
||||
marginY={8}
|
||||
marginRight={12}
|
||||
appearance="default"
|
||||
iconAfter={BuildIcon}
|
||||
// disabled={true}
|
||||
onClick={handleDownload}
|
||||
>
|
||||
Pobierz
|
||||
</Button>
|
||||
<a href="the.dxf" download="the.dxf" id="down">
|
||||
{" "}
|
||||
</a>
|
||||
</main>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
return (
|
||||
<div className="grid place-items-center h-screen">
|
||||
<Head>
|
||||
<title>Wastpol</title>
|
||||
</Head>
|
||||
<div className="flex flex-col justify-center">
|
||||
<h2 className="p-2">Nie zalogowano</h2>
|
||||
<br></br>
|
||||
<Button
|
||||
onClick={() => signIn()}
|
||||
appearance="primary"
|
||||
// className="p-2 bg-slate-200 rounded-md"
|
||||
>
|
||||
Zaloguj
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user