s464958/FirmTracker
2
1
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

2-minimalna zmiana działania funkcjonalości oraz poprawki wizualne

Browse Source
This commit is contained in:
Wiktor Szynaka 2024-06-13 23:47:46 +01:00
parent 77c4dc9c36
commit ec358faf9f
5 changed files with 71 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
firm/public/index.html
View File

@ -24,7 +24,7 @@
work correctly both with client-side routing and a non-root public URL. work correctly both with client-side routing and a non-root public URL.
Learn how to configure a non-root public URL by running `npm run build`. Learn how to configure a non-root public URL by running `npm run build`.
--> -->
<title>React App</title> <title>FirmTracker</title>
</head> </head>
<body> <body>
<noscript>You need to enable JavaScript to run this app.</noscript> <noscript>You need to enable JavaScript to run this app.</noscript>

2
firm/src/App.js
View File

@ -15,7 +15,7 @@ const App = () => {
<div className=""> <div className="">
<NavBar /> <NavBar />
<div className="flex w-screen"> <div className="flex w-screen">
<div className="w-17/100"> <div className="w-17/100 bg-gray-200">
<Sidebar /> <Sidebar />
</div> </div>
<div className="w-3/4"> <div className="w-3/4">

5
firm/src/components/Raporty.js
View File

@ -35,13 +35,14 @@ const Raporty = () => {
const handleDeleteReport = async (reportId) => { const handleDeleteReport = async (reportId) => {
try { try {
await axios.delete(`https://localhost:7039/api/Report/${reportId}`); await axios.delete(`https://localhost:7039/api/Report?${reportId}`);
fetchReports(); setReports(reports.filter(report => report.id !== reportId)); // Update state after deletion
} catch (error) { } catch (error) {
console.error('Błąd podczas usuwania raportu:', error); console.error('Błąd podczas usuwania raportu:', error);
} }
}; };
const formatDate = (dateString) => { const formatDate = (dateString) => {
const options = { year: 'numeric', month: '2-digit', day: '2-digit', hour: '2-digit', minute: '2-digit' }; const options = { year: 'numeric', month: '2-digit', day: '2-digit', hour: '2-digit', minute: '2-digit' };
const date = new Date(dateString); const date = new Date(dateString);

86
firm/src/components/Transakcje.js
View File

@ -9,6 +9,7 @@ const Transakcje = () => {
const [isModalOpen, setIsModalOpen] = useState(false); const [isModalOpen, setIsModalOpen] = useState(false);
const [isEditModalOpen, setIsEditModalOpen] = useState(false); const [isEditModalOpen, setIsEditModalOpen] = useState(false);
const [editTransaction, setEditTransaction] = useState(null); const [editTransaction, setEditTransaction] = useState(null);
const [error, setError] = useState(null);
const [newTransaction, setNewTransaction] = useState({ const [newTransaction, setNewTransaction] = useState({
id: 2, id: 2,
date: "", date: "",
@ -17,7 +18,8 @@ const Transakcje = () => {
{ {
id: 0, id: 0,
transactionId: 2, transactionId: 2,
productID: "", productID: 0,
productName: "",
quantity: "" quantity: ""
} }
], ],
@ -32,7 +34,7 @@ const Transakcje = () => {
const response = await axios.get('https://localhost:7039/api/Transaction'); const response = await axios.get('https://localhost:7039/api/Transaction');
setTransactions(response.data); setTransactions(response.data);
} catch (error) { } catch (error) {
console.error('Błąd podczas pobierania transakcji:', error); console.error('Błąd podczas dodawania transakcji:', error);
} }
}; };
@ -53,9 +55,10 @@ const Transakcje = () => {
employeeId: "", employeeId: "",
transactionProducts: [ transactionProducts: [
{ {
id: 0, id: 2,
transactionId: 2, transactionId: 0,
productID: "", productID: 0,
productName: "",
quantity: "" quantity: ""
} }
], ],
@ -66,6 +69,11 @@ const Transakcje = () => {
}); });
} catch (error) { } catch (error) {
console.error('Błąd podczas dodawania transakcji:', error); console.error('Błąd podczas dodawania transakcji:', error);
if (error.response && error.response.data) {
setError(error.response.data);
} else {
setError('Wystąpił nieoczekiwany błąd. Spróbuj ponownie później.');
}
} }
}; };
@ -82,9 +90,10 @@ const Transakcje = () => {
transactionProducts: [ transactionProducts: [
...newTransaction.transactionProducts, ...newTransaction.transactionProducts,
{ {
id: 0, id: 2,
transactionId: 2, transactionId: 0,
productID: "", productID: 0,
productName: "",
quantity: "" quantity: ""
} }
] ]
@ -108,21 +117,34 @@ const Transakcje = () => {
console.error('Błąd podczas usuwania transakcji:', error); console.error('Błąd podczas usuwania transakcji:', error);
} }
}; };
const handleEditTransaction = (transaction) => { const handleEditTransaction = async (transaction) => {
try {
// Jeśli transakcja nie jest ustawiona, oznacza to, że chcemy ją tylko edytować
if (!editTransaction) {
setEditTransaction(transaction); setEditTransaction(transaction);
setIsEditModalOpen(true); setIsEditModalOpen(true);
}; return; // Przerwij dalsze wykonanie funkcji
const handleSaveEditedTransaction = async () => { }
try {
// Jeśli transakcja jest ustawiona, zapisujemy ją na serwerze
await axios.put(`https://localhost:7039/api/Transaction/${editTransaction.id}`, editTransaction); await axios.put(`https://localhost:7039/api/Transaction/${editTransaction.id}`, editTransaction);
fetchTransactions(); fetchTransactions(); // Pobranie najnowszych danych po udanej aktualizacji
setIsEditModalOpen(false); setIsEditModalOpen(false); // Zamknięcie modala po udanej aktualizacji
setEditTransaction(null); // Wyczyszczenie transakcji po zakończeniu edycji
setError(null); // Wyczyszczenie ewentualnego błędu
} catch (error) { } catch (error) {
console.error('Błąd podczas edycji transakcji:', error); console.error('Błąd podczas edycji transakcji:', error);
if (error.response && error.response.data) {
setError(error.response.data); // Ustawienie błędu na odpowiedź z serwera
} else {
setError('Wystąpił nieoczekiwany błąd. Spróbuj ponownie później.');
}
} }
}; };
return ( return (
<div className='p-10 ml-11'> <div className='p-10 ml-11'>
<div className='flex items-center justify-between'> <div className='flex items-center justify-between'>
@ -133,6 +155,17 @@ const Transakcje = () => {
<img src={plusIcon} alt="" className="w-8 h-8 mr-2" />Dodaj <img src={plusIcon} alt="" className="w-8 h-8 mr-2" />Dodaj
</button> </button>
</div> </div>
{error && (
<div className="absolute top-0 left-0 w-full h-full bg-black bg-opacity-50 flex items-center justify-center">
<div className="bg-white p-8 rounded-lg">
<h2 className="text-2xl font-bold mb-4">Błąd</h2>
<p>{error}</p>
<button onClick={() => window.location.reload()} className="bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded">
Zamknij
</button>
</div>
</div>
)}
{isEditModalOpen && editTransaction && ( {isEditModalOpen && editTransaction && (
<div className="absolute top-0 left-0 w-full h-full bg-black bg-opacity-50 flex items-center justify-center"> <div className="absolute top-0 left-0 w-full h-full bg-black bg-opacity-50 flex items-center justify-center">
<div className="bg-white p-8 rounded-lg"> <div className="bg-white p-8 rounded-lg">
@ -156,15 +189,15 @@ const Transakcje = () => {
{editTransaction.transactionProducts.map((product, index) => ( {editTransaction.transactionProducts.map((product, index) => (
<div key={index}> <div key={index}>
<input <input
type="number" type="text"
name={`productID-${index}`} name={`productName-${index}`}
value={product.productID} value={product.productName}
onChange={(e) => { onChange={(e) => {
const newTransactionProducts = [...editTransaction.transactionProducts]; const newTransactionProducts = [...editTransaction.transactionProducts];
newTransactionProducts[index].productID = e.target.value; newTransactionProducts[index].productName = e.target.value;
setEditTransaction({ ...editTransaction, transactionProducts: newTransactionProducts }); setEditTransaction({ ...editTransaction, transactionProducts: newTransactionProducts });
}} }}
placeholder="ID Produktu" placeholder="Nazwa Produktu"
className="block w-full mb-4 px-4 py-2 border border-gray-300 rounded-lg"/> className="block w-full mb-4 px-4 py-2 border border-gray-300 rounded-lg"/>
<input <input
type="number" type="number"
@ -206,7 +239,7 @@ const Transakcje = () => {
/> />
<button <button
onClick={() => { onClick={() => {
handleSaveEditedTransaction(); handleEditTransaction();
setIsEditModalOpen(false); setIsEditModalOpen(false);
}} }}
className="bg-green-500 hover:bg-green-700 text-white font-bold py-2 px-4 rounded" className="bg-green-500 hover:bg-green-700 text-white font-bold py-2 px-4 rounded"
@ -223,7 +256,6 @@ const Transakcje = () => {
</div> </div>
)} )}
{isModalOpen && ( {isModalOpen && (
<div className="absolute top-0 left-0 w-full h-full bg-black bg-opacity-50 flex items-center justify-center"> <div className="absolute top-0 left-0 w-full h-full bg-black bg-opacity-50 flex items-center justify-center">
<div className="bg-white p-8 rounded-lg"> <div className="bg-white p-8 rounded-lg">
@ -247,15 +279,15 @@ const Transakcje = () => {
{newTransaction.transactionProducts.map((product, index) => ( {newTransaction.transactionProducts.map((product, index) => (
<div key={index}> <div key={index}>
<input <input
type="number" type="text"
name={`productID-${index}`} name={`productName-${index}`}
value={product.productID} value={product.productName}
onChange={(e) => { onChange={(e) => {
const newTransactionProducts = [...newTransaction.transactionProducts]; const newTransactionProducts = [...newTransaction.transactionProducts];
newTransactionProducts[index].productID = e.target.value; newTransactionProducts[index].productName = e.target.value;
setNewTransaction({ ...newTransaction, transactionProducts: newTransactionProducts }); setNewTransaction({ ...newTransaction, transactionProducts: newTransactionProducts });
}} }}
placeholder="ID Produktu" placeholder="Nazwa Produktu"
className="block w-full mb-4 px-4 py-2 border border-gray-300 rounded-lg" className="block w-full mb-4 px-4 py-2 border border-gray-300 rounded-lg"
/> />
<input <input
@ -321,7 +353,7 @@ const Transakcje = () => {
</div> </div>
)} )}
<div className="w-8/10 mx-auto mt-2"> <div className="w-8/10 mx-auto mt-2">
<div className="h-140 overflow-y-auto"> <div className="h-screen overflow-y-auto">
<table className="w-full border-collapse border border-gray-300"> <table className="w-full border-collapse border border-gray-300">
<thead className="bg-gray-200"> <thead className="bg-gray-200">
<tr> <tr>

8
firm/src/components/ZarzadzanieProduktami.js
View File

@ -183,7 +183,7 @@ const ZarzadzanieProduktami = () => {
name="type" name="type"
value={newProduct.type} value={newProduct.type}
onChange={handleInputChange} onChange={handleInputChange}
placeholder="Typ" placeholder="Kategoria"
className="block w-full mb-4 px-4 py-2 border border-gray-300 rounded-lg" className="block w-full mb-4 px-4 py-2 border border-gray-300 rounded-lg"
/> />
<input <input
@ -210,9 +210,9 @@ const ZarzadzanieProduktami = () => {
</div> </div>
)} )}
<div className="w-8/10 mx-auto mt-2"> <div className="w-8/10 mx-auto mt-2">
<div className="h-140 overflow-y-auto"> <div className="h-screen overflow-y-auto margin-0">
<table className="w-full border-collapse border border-gray-300"> <table className="w-full border-collapse border border-gray-500">
<thead className="bg-gray-200 top-0 z-10"> <thead className="bg-gray-200 top-0 z-10 sticky">
<tr> <tr>
<th className="border border-gray-300 p-2">ID</th> <th className="border border-gray-300 p-2">ID</th>
<th className="border border-gray-300 p-2">Produkt</th> <th className="border border-gray-300 p-2">Produkt</th>