Skip to content

zrstars/Development-Project-Management-Web-Apps

BranchesTags

Repository files navigation

ProjectFlow Dashboard

ProjectFlow

A modern project management web application built with Laravel

Features • Screenshots • Getting Started • Usage • Structure • Contributing • License

PHP Laravel SQLite Chart.js License

Overview

ProjectFlow is a full-stack project management dashboard designed to help teams track projects, manage risks, issues, and activities in one centralized platform. Built with Laravel and featuring a custom glassmorphism UI design, it provides real-time analytics and role-based access control for different team members.

This project was built to explore Laravel's MVC architecture, Eloquent relationships, middleware-based authorization, and responsive dashboard design patterns.

Features

Dashboard & Analytics

  • Summary cards — Total, active, completed, and at-risk project counts
  • Interactive charts — Status distribution (doughnut), risk severity (bar), PM workload (bar), and progress overview (horizontal bar) powered by Chart.js
  • Important items panel — Displays flagged risks and issues with their associated project names
  • Upcoming activities — Shows pending tasks with due date countdowns

Project Management

  • Full CRUD operations for projects
  • Track progress, budget, priority, status, and timeline
  • R/I/A indicators — See risk, issue, and activity counts per project at a glance
  • Detail view with related risks, issues, and activities

Risk & Issue Tracking

  • Separate modules for risks and issues
  • Severity levels: Low, Medium, High, Critical
  • Status workflow tracking (Open → Investigating → Resolved → Closed)
  • Important flag — Mark critical items to appear on the dashboard
  • Mitigation plans for risks, resolution notes for issues

Activity Management

  • Task assignments with due dates and assignees
  • Status tracking: Pending, In Progress, Completed
  • Overdue detection with visual indicators

User Management & Authentication

  • Session-based authentication
  • 4 user roles: Super Admin, Admin, Project Manager, Assistant PM
  • Role-based access control — User management is restricted to Super Admin and Admin only
  • User status management (Active/Inactive)

UI/UX

  • Glassmorphism design — Frosted glass effects with backdrop-filter
  • Dark theme — Easy on the eyes for extended use
  • Animated login page with floating gradient orbs
  • Responsive layout — Works on desktop, tablet, and mobile
  • Color-coded badges for status, priority, severity, and roles
  • Modal-based forms with smooth animations
  • Toast notifications for user feedback

Screenshots

🖥️ Click to view all screenshots

Login Page

Login

Dashboard

Dashboard

Projects

Projects

Project Detail

Project Detail

Risks

Risks

Issues

Issues

Activities

Activities

User Management

Users

Getting Started

Prerequisites

Make sure your system has the following installed:

  • PHP >= 8.2
  • Composer >= 2.x
  • Node.js >= 18.x (optional, for Vite asset compilation)
  • SQLite (usually bundled with PHP)

Installation

  1. Clone the repository

    git clone https://github.com/zrstars/Development-Project-Management-Web-Apps.git
cd Development-Project-Management-Web-Apps

  2. Install PHP dependencies

    composer install

  3. Configure environment

    cp .env.example .env
php artisan key:generate

  4. Create the database

    touch database/database.sqlite

  5. Run migrations and seed data

    php artisan migrate --seed

  6. Start the development server

    php artisan serve

  7. Open your browser and visit http://localhost:8000

Default Accounts

Role Email Password
Super Admin superadmin@projectflow.com admin123
Admin admin@projectflow.com admin123
Project Manager pm@projectflow.com pm123
Assistant PM apm@projectflow.com apm123

Usage

Role Permissions

Feature Super Admin Admin Project Manager Assistant PM
View Dashboard ✅ ✅ ✅ ✅
Manage Projects ✅ ✅ ✅ ✅
Manage Risks ✅ ✅ ✅ ✅
Manage Issues ✅ ✅ ✅ ✅
Manage Activities ✅ ✅ ✅ ✅
Manage Users ✅ ✅ ❌ ❌

Key Workflows

Creating a Project:

  1. Go to Projects → Click New Project
  2. Fill in project details (name, manager, dates, budget, priority)
  3. Save — the project will appear in the table with R/I/A counters

Flagging Important Risks/Issues:

  1. When creating or editing a risk/issue, check "Mark as Important"
  2. Important items automatically appear in the dashboard panels

Monitoring Progress:

  1. The Dashboard provides a bird's-eye view with charts
  2. The At Risk counter tracks projects with high/critical open risks or issues

Project Structure

├── app/
│   ├── Http/
│   │   ├── Controllers/
│   │   │   ├── AuthController.php          # Login/logout
│   │   │   ├── DashboardController.php     # Dashboard + chart data API
│   │   │   ├── ProjectController.php       # Project CRUD
│   │   │   ├── RiskController.php          # Risk CRUD
│   │   │   ├── IssueController.php         # Issue CRUD
│   │   │   ├── ActivityController.php      # Activity CRUD
│   │   │   └── UserController.php          # User CRUD (admin)
│   │   └── Middleware/
│   │       └── RoleMiddleware.php          # Role-based access control
│   └── Models/
│       ├── User.php                        # User with role helpers
│       ├── Project.php                     # Project + relationships
│       ├── Risk.php                        # Risk (belongs to project)
│       ├── Issue.php                       # Issue (belongs to project)
│       └── Activity.php                    # Activity (belongs to project)
├── database/
│   ├── migrations/                         # Schema definitions
│   └── seeders/
│       └── DatabaseSeeder.php              # Sample data for demo
├── resources/views/
│   ├── auth/login.blade.php                # Login page
│   ├── layouts/app.blade.php               # Main layout + sidebar
│   ├── dashboard.blade.php                 # Dashboard with charts
│   ├── projects/{index,show}.blade.php     # Project views
│   ├── risks/index.blade.php               # Risk management
│   ├── issues/index.blade.php              # Issue tracking
│   ├── activities/index.blade.php          # Activity management
│   └── users/index.blade.php               # User management
├── public/
│   ├── css/style.css                       # Glassmorphism theme
│   └── js/app.js                           # Modal helpers
├── routes/web.php                          # All routes
└── docs/
    └── screenshots/                        # Application screenshots

Tech Stack

Layer Technology Purpose
Backend Laravel 12, PHP 8.4 MVC framework, routing, Eloquent ORM
Database SQLite Lightweight, zero-config storage
Frontend Blade Templates Server-side rendering
Styling Vanilla CSS Custom glassmorphism design system
Charts Chart.js 4.4 Interactive dashboard visualizations
Icons Font Awesome 6.5 UI iconography
Typography Inter (Google Fonts) Modern, readable typeface

Database Schema

users
├── id, name, email, password
├── role (Super Admin | Admin | Project Manager | Assistant PM)
└── status (Active | Inactive)

projects
├── id, name, description, manager
├── status, priority, progress
├── start_date, end_date, budget
├── → has many: risks, issues, activities

risks
├── id, project_id (FK), title, description
├── severity, status, mitigation
├── important (boolean), reported_date

issues
├── id, project_id (FK), title, description
├── severity, status, resolution
├── important (boolean), reported_date

activities
├── id, project_id (FK), title, description
├── assignee, due_date, status

Contributing

Contributions are welcome! If you'd like to contribute:

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

Please make sure your code follows the existing coding style and includes appropriate comments.

License

This project is licensed under the MIT License. See the LICENSE file for details.

Acknowledgments

Made with ❤️ by zrstars

About

A modern project management dashboard built with Laravel 12. Features glassmorphism UI, role-based access control, risk/issue tracking, and real-time analytics with Chart.js.

zrstars.github.io/Development-Project-Management-Web-Apps/

Topics

php laravel crud dashboard sqlite project-management role-based-access-control chart-js blade-templates glassmorphism

Resources

Readme

License

MIT license
Activity

Stars

0 stars

Watchers

0 watching

Forks

0 forks
Report repository

Releases

No releases published

Packages

 
 
 

Contributors

Languages