Project Management Panel

A comprehensive project management system built with Next.js for managing construction/engineering projects, contracts, and tasks.

Features

📋 Project Management

• Create and manage projects with detailed information
• Link projects to contracts
• Track project deadlines and progress
• Add custom notes and contact information

📄 Contract Management

• Create and manage contracts
• Track contract details including customer and investor information
• Link multiple projects to contracts
• Monitor contract deadlines

✅ Task Management

• Create task templates for reusable workflows
• Add tasks to projects (both template-based and custom)
• Track task status and priorities
• Monitor task deadlines and completion

📊 Dashboard

• Overview of project statistics
• Recent projects display
• Task completion tracking
• Quick access to pending items

🔐 Authentication & Authorization

• Complete user authentication system with NextAuth.js
• Role-based access control (Admin, User, Guest roles)
• Secure session management
• Password-based authentication
• User registration and management

👥 User Management

• Admin interface for user administration
• Create, edit, and delete user accounts
• Role assignment and permission management
• User activity monitoring

📋 Audit Logging

• Comprehensive logging of all user actions
• Security event tracking
• System activity monitoring
• Audit trail for compliance and debugging

Tech Stack

• Framework: Next.js 15.1.8
• Database: SQLite with better-sqlite3
• Authentication: NextAuth.js
• Styling: Tailwind CSS
• Date Handling: date-fns
• Frontend: React 19
• Mapping: Leaflet with React-Leaflet
• Container: Docker & Docker Compose

Getting Started

Prerequisites

• Node.js (version 16 or higher)
• npm or yarn
• Docker (optional, for containerized development)

Installation

Option 1: Local Development

1. Clone the repository

git clone <repository-url>
cd panel

2. Install dependencies

npm install

3. Start the development server

npm run dev

4. Open http://localhost:3000 in your browser

Option 2: Docker Development

1. Clone the repository

git clone <repository-url>
cd panel

2. Start with Docker Compose

docker-compose up

3. Open http://localhost:3000 in your browser

Database Setup

The application uses SQLite database which will be automatically initialized on first run. The database file is located at data/database.sqlite.

Admin Setup

To create an initial admin user:

npm run create-admin

This will create an admin user account. Access the admin panel at /admin/users to manage users and roles.

Project Structure

src/
├── app/                    # Next.js app router pages
│   ├── admin/             # Admin dashboard and user management
│   ├── api/               # API routes
│   │   ├── admin/         # Admin-related endpoints (e.g., user management)
│   │   ├── all-project-tasks/ # Get all project tasks endpoint
│   │   ├── audit-logs/    # Audit log endpoints
│   │   ├── auth/          # Authentication endpoints
│   │   ├── contracts/     # Contract management endpoints
│   │   ├── notes/         # Notes management endpoints
│   │   ├── projects/      # Project management endpoints
│   │   ├── project-tasks/ # Task management endpoints
│   │   ├── task-notes/    # Task-specific notes endpoints
│   │   └── tasks/         # Task template endpoints
│   ├── auth/              # Authentication pages (login, etc.)
│   ├── contracts/         # Contract pages
│   ├── projects/          # Project pages
│   ├── project-tasks/     # Project-specific task pages
│   └── tasks/             # Task management pages
├── components/            # Reusable React components
│   ├── auth/              # Authentication-related components
│   ├── ui/                # UI components (Button, Card, etc.)
│   ├── AuditLogViewer.js  # Component to view audit logs
│   ├── ContractForm.js    # Contract form component
│   ├── NoteForm.js        # Note form component
│   ├── ProjectForm.js     # Project form component
│   ├── ProjectTaskForm.js # Project task form component
│   ├── ProjectTasksSection.js # Project tasks section component
│   ├── TaskForm.js        # Task form component
│   └── TaskTemplateForm.js # Task template form component
├── lib/                  # Utility functions
│   ├── queries/          # Database query functions
│   ├── auditLog.js       # Audit logging utilities
│   ├── auth.js           # Authentication helpers
│   ├── db.js             # Database connection
│   ├── init-db.js        # Database initialization
│   └── userManagement.js # User management functions
└── middleware.js         # Next.js middleware for auth and routing

Available Scripts

• npm run dev - Start development server
• npm run build - Build for production
• npm run start - Start production server
• npm run lint - Run ESLint

Docker Commands

• docker-compose up - Start the application with Docker
• docker-compose down - Stop the Docker containers
• docker-compose up --build - Rebuild and start the application

Database Schema

The application uses the following main tables:

• contracts - Contract information
• projects - Project details linked to contracts
• tasks - Task templates
• project_tasks - Tasks assigned to specific projects
• notes - Project notes and updates
• users - User accounts and roles for authentication
• sessions - User session management
• audit_logs - Detailed logs for security and tracking

API Endpoints

Projects

• GET /api/projects - Get all projects
• POST /api/projects - Create new project
• GET /api/projects/[id] - Get project by ID
• PUT /api/projects/[id] - Update project
• DELETE /api/projects/[id] - Delete project

Contracts

• GET /api/contracts - Get all contracts
• POST /api/contracts - Create new contract
• GET /api/contracts/[id] - Get contract by ID
• PUT /api/contracts/[id] - Update contract
• DELETE /api/contracts/[id] - Delete contract

Tasks

• GET /api/tasks - Get task templates
• POST /api/tasks - Create new task template
• GET /api/tasks/[id] - Get task template by ID
• PUT /api/tasks/[id] - Update task template
• DELETE /api/tasks/[id] - Delete task template
• GET /api/tasks/templates - Get all task templates

Project Tasks

• GET /api/project-tasks - Get project tasks or task templates
• POST /api/project-tasks - Create new project task
• PATCH /api/project-tasks/[id] - Update task status
• DELETE /api/project-tasks/[id] - Delete task
• GET /api/all-project-tasks - Get all project tasks across all projects

Notes

• POST /api/notes - Create new note
• DELETE /api/notes - Delete note

Audit Logs

• GET /api/audit-logs - Get all audit logs
• POST /api/audit-logs/log - Create a new audit log entry
• GET /api/audit-logs/stats - Get audit log statistics

Admin

• GET /api/admin/users - Get all users
• POST /api/admin/users - Create a new user
• PUT /api/admin/users/[id] - Update a user
• DELETE /api/admin/users/[id] - Delete a user

Advanced Map Features

This project includes a powerful map system for project locations, supporting multiple dynamic base layers and transparent overlays:

Base Layers (8 total)

• OpenStreetMap (default street map)
• 🇵🇱 Polish Orthophoto (Standard Resolution) - WMTS aerial imagery
• 🇵🇱 Polish Orthophoto (High Resolution) - WMTS high-res aerial imagery
• 🌍 Google Satellite - Global satellite imagery
• 🌍 Google Hybrid - Satellite imagery with road overlays
• 🌍 Google Roads - Google Maps road view
• Satellite (Esri) - Alternative satellite imagery
• Topographic - CartoDB topographic maps

Overlay Layers (6 total with transparency)

• 📋 Polish Cadastral Data (WMS, property boundaries - 80% opacity)
• 🏗️ Polish Spatial Planning (WMS, zoning data - 70% opacity)
• 🛣️ LP-Portal Roads (WMS, road network - 90% opacity)
• 🏷️ LP-Portal Street Names (WMS, street labels - 100% opacity)
• 📐 LP-Portal Parcels (WMS, property parcels - 60% opacity)
• 📍 LP-Portal Survey Markers (WMS, survey points - 80% opacity)

Users can switch layers using the map control (📚 icon). WMTS/WMS layers are configured dynamically using OGC GetCapabilities, making it easy to add new sources. See docs/MAP_LAYERS.md for details on adding and configuring map layers.

UI/UX

• Modern, responsive interface built with React 19 and Tailwind CSS
• Intuitive dashboards, search, and filter components
• Modular, reusable UI components for forms, lists, and maps

Extensibility & Testing

• Modular codebase: easily add new features, endpoints, or UI components
• Automated tests: Playwright for E2E, Jest and Testing Library for unit/integration
• Dockerized for consistent development and deployment

Contributing

1. Fork the repository
2. Create a feature branch (git checkout -b feature/amazing-feature)
3. Commit your changes (git commit -m 'Add some amazing feature')
4. Push to the branch (git push origin feature/amazing-feature)
5. Open a Pull Request

License

This project is private and proprietary.