📝 Flask Task Manager (with Status Workflow, Progress Bar & MySQL)

A complete Task Management System built using Flask, MySQL, Bootstrap, and Jinja2, featuring:

Full CRUD operations
Status workflow with color-coded badges
In-Progress tasks with real progress bar
REST API for AJAX updates
View page (read-only mode)
Icons, favicons, and clean UI
MySQL database integration
Fully modular Flask Blueprint structure

🚀 Features

✅ Task Management

Create tasks
Edit title, description, status, due date
Delete tasks
Read-only View Info page

🎨 Status Colors (Bootstrap)

Status	Color
`not-assigned`	🔴 Red (danger)
`assigned`	🔵 Blue (primary)
`started`	🔷 Light Blue (info)
`in-progress`	🟡 Yellow (warning)
`finalaudit`	⚪ Gray (secondary)
`completed`	🟢 Green (success)

📊 Progress Bar Logic

Only visible when status = in-progress
Progress editable in task list page only
View Page is read-only
When progress hits 100%, task auto-moves to finalaudit
All other statuses have no progress bar

🔌 REST API (AJAX Enabled)

Update status
Update progress
JSON responses
Validation (no progress allowed unless in-progress)

📦 Project Structure

flask_task_manager/ │ ├── app.py ├── requirements.txt ├── init_db.sql ├── README.md ├── .env.example ├── .gitignore │ ├── app/ │ ├── init.py │ ├── routes.py │ ├── api.py │ ├── db.py │ │ │ ├── templates/ │ │ ├── base.html │ │ ├── tasks.html │ │ ├── task_detail.html │ │ ├── add_task.html │ │ ├── edit_task.html │ │ │ ├── static/ │ ├── css/ │ ├── js/ │ ├── favicon.ico │ ├── favicon_32.png │ ├── favicon_256.png

yaml

⚙️ Installation & Setup

1️⃣ Clone or download the project

git clone cd flask_task_manager

2️⃣ Create a Python virtual environment

Windows:

python -m venv venv
.\venv\Scripts\Activate.ps1
Linux/macOS:
python3 -m venv venv
source venv/bin/activate
3️⃣ Install required packages
css
pip install -r requirements.txt
🛢️ MySQL Database Setup
4️⃣ Import the database schema
Make sure MySQL is running, then:

mysql -u root -p < init_db.sql
This creates:

taskdb database

tasks table

🔐 Environment Variables
Create a .env file in the project root:

ini
DB_HOST=127.0.0.1
DB_PORT=3306
DB_USER=root
DB_PASSWORD=your_password
DB_NAME=taskdb
SECRET_KEY=changeme
FLASK_ENV=development
▶️ Run the Application
Start the Flask server:

nginx
python app.py
Open in browser:

👉 http://127.0.0.1:5000

🔄 Status Workflow
scss
not-assigned → assigned → started → in-progress → finalaudit → completed
Progress is available only in in-progress.

🧠 REST API Endpoints
✔ Update Progress
POST /api/tasks/<id>/progress
Body: { "progress": 45 }
✔ Update Status
POST /api/tasks/<id>/status
Body: { "status": "in-progress" }
Responses use JSON.

🔍 View Task (Read-Only)
URL:

/tasks/<task_id>/view
Shows:

details

status badge

progress bar (if in-progress)

NO editing

🎨 Favicons
Place favicon files inside:

arduino
app/static/
Add in <head> of base.html:

html
<link rel="icon" href="{{ url_for('static', filename='favicon.ico') }}">
<link rel="icon" sizes="32x32" href="{{ url_for('static', filename='favicon_32.png') }}">
<link rel="icon" sizes="256x256" href="{{ url_for('static', filename='favicon_256.png') }}">
🧹 .gitignore
venv/
__pycache__/
.env
*.pyc
📸 Screenshots (optional)
Add screenshots here to showcase UI:

/screenshots/tasks_page.png
/screenshots/view_page.png
📜 License
Open-source for learning and development.

FilesExpand file tree

README.md

Latest commit

History