Admin/panel
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Implement project search functionality and task management features

Browse Source 
- Added search functionality to the Project List page, allowing users to filter projects by name, WP, plot, or investment number.
- Created a new Project Tasks page to manage tasks across all projects, including filtering by status and priority.
- Implemented task status updates and deletion functionality.
- Added a new Task Template Edit page for modifying existing task templates.
- Enhanced Task Template Form to include a description field and loading state during submission.
- Updated UI components for better user experience, including badges for task status and priority.
- Introduced new database queries for managing contracts and projects, including fetching tasks related to projects.
- Added migrations to the database for new columns and improved data handling.
This commit is contained in:
Chop
2025-06-02 23:21:04 +02:00
parent b06aad72b8
commit 35569846bc
24 changed files with 2019 additions and 169 deletions
Download Patch File Download Diff File Expand all files Collapse all files

206
src/app/contracts/[id]/page.js Normal file
View File

@@ -0,0 +1,206 @@
"use client";
import { useEffect, useState } from "react";
import Link from "next/link";
import { useParams } from "next/navigation";
export default function ContractDetailsPage() {
const params = useParams();
const contractId = params.id;
const [contract, setContract] = useState(null);
const [projects, setProjects] = useState([]);
const [loading, setLoading] = useState(true);
useEffect(() => {
async function fetchContractDetails() {
setLoading(true);
try {
// Fetch contract details
const contractRes = await fetch(`/api/contracts/${contractId}`);
if (contractRes.ok) {
const contractData = await contractRes.json();
setContract(contractData);
}
// Fetch projects for this contract
const projectsRes = await fetch(
`/api/projects?contract_id=${contractId}`
);
if (projectsRes.ok) {
const projectsData = await projectsRes.json();
setProjects(projectsData);
}
} catch (error) {
console.error("Error fetching contract details:", error);
} finally {
setLoading(false);
}
}
if (contractId) {
fetchContractDetails();
}
}, [contractId]);
if (loading) {
return (
<div className="p-4 max-w-4xl mx-auto">
<div className="text-center">Ładowanie szczegółów umowy...</div>
</div>
);
}
if (!contract) {
return (
<div className="p-4 max-w-4xl mx-auto">
<div className="text-center text-red-600">Nie znaleziono umowy.</div>
<div className="text-center mt-4">
<Link href="/contracts" className="text-blue-600 hover:underline">
← Powrót do listy umów
</Link>
</div>
</div>
);
}
return (
<div className="p-4 max-w-4xl mx-auto">
{/* Header */}
<div className="flex justify-between items-center mb-6">
<h1 className="text-2xl font-bold">Umowa {contract.contract_number}</h1>
<Link href="/contracts" className="text-blue-600 hover:underline">
← Powrót do listy umów
</Link>
</div>
{/* Contract Details */}
<div className="bg-white border border-gray-200 rounded-lg p-6 mb-6">
<h2 className="text-xl font-semibold mb-4">Szczegóły umowy</h2>
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
<div>
<label className="block text-sm font-medium text-gray-600">
Numer umowy
</label>
<p className="text-lg">{contract.contract_number}</p>
</div>
{contract.contract_name && (
<div>
<label className="block text-sm font-medium text-gray-600">
Nazwa umowy
</label>
<p className="text-lg">{contract.contract_name}</p>
</div>
)}
{contract.customer_contract_number && (
<div>
<label className="block text-sm font-medium text-gray-600">
Numer umowy (Klienta)
</label>
<p>{contract.customer_contract_number}</p>
</div>
)}
{contract.customer && (
<div>
<label className="block text-sm font-medium text-gray-600">
Zleceniodawca
</label>
<p>{contract.customer}</p>
</div>
)}
{contract.investor && (
<div>
<label className="block text-sm font-medium text-gray-600">
Inwestor
</label>
<p>{contract.investor}</p>
</div>
)}
{contract.date_signed && (
<div>
<label className="block text-sm font-medium text-gray-600">
Data zawarcia
</label>
<p>
{new Date(contract.date_signed).toLocaleDateString("pl-PL")}
</p>
</div>
)}
{contract.finish_date && (
<div>
<label className="block text-sm font-medium text-gray-600">
Data zakończenia
</label>
<p>
{new Date(contract.finish_date).toLocaleDateString("pl-PL")}
</p>
</div>
)}
</div>
</div>
{/* Linked Projects */}
<div className="bg-white border border-gray-200 rounded-lg p-6">
<div className="flex justify-between items-center mb-4">
<h2 className="text-xl font-semibold">
Projekty w ramach umowy ({projects.length})
</h2>
<Link
href={`/projects/new?contract_id=${contractId}`}
className="bg-blue-600 text-white px-4 py-2 rounded hover:bg-blue-700 text-sm"
>
➕ Dodaj projekt
</Link>
</div>
{projects.length === 0 ? (
<p className="text-gray-500 text-center py-8">
Brak projektów przypisanych do tej umowy.
</p>
) : (
<div className="space-y-3">
{projects.map((project) => (
<div
key={project.project_id}
className="border border-gray-100 rounded p-4 hover:bg-gray-50"
>
<div className="flex justify-between items-start">
<div>
<h3 className="font-medium">{project.project_name}</h3>
<p className="text-sm text-gray-600">
{project.project_number}
</p>
{project.address && (
<p className="text-sm text-gray-500">
📍 {project.address}
</p>
)}
{project.finish_date && (
<p className="text-sm text-gray-500">
⏰ Termin:{" "}
{new Date(project.finish_date).toLocaleDateString(
"pl-PL"
)}
</p>
)}
</div>
<Link
href={`/projects/${project.project_id}`}
className="text-blue-600 hover:underline text-sm"
>
Szczegóły →
</Link>
</div>
</div>
))}
</div>
)}
</div>
</div>
);
}