# TaskFlow - Ứng dụng Quản lý Công việc Cá nhân

Ứng dụng To-do List hiện đại với hệ thống xác thực người dùng, cho phép mỗi user quản lý công việc của riêng mình.

## 🚀 Tính năng

### Xác thực & Phân quyền
- ✅ Đăng ký / đăng nhập bằng Email & Password
- ✅ Đăng nhập bằng Google OAuth
- ✅ Mỗi user chỉ xem và thao tác trên công việc của chính mình
- ✅ Đăng xuất

### Quản lý Công việc (CRUD)
- ✅ Tạo công việc mới (tiêu đề, mô tả, trạng thái, deadline)
- ✅ Sửa công việc
- ✅ Xóa công việc
- ✅ Xem danh sách công việc

### Tìm kiếm – Lọc – Sắp xếp
- ✅ Tìm kiếm theo tiêu đề
- ✅ Lọc theo trạng thái (Todo / In Progress / Done)
- ✅ Lọc theo deadline (hôm nay, tuần này, quá hạn)
- ✅ Sắp xếp theo deadline, trạng thái, thời gian tạo

### Giao diện
- ✅ Responsive (desktop + mobile)
- ✅ Màu sắc rõ ràng cho từng trạng thái
- ✅ Hiển thị deadline sắp đến & quá hạn
- ✅ Loading states, empty states, thông báo

## 🛠 Tech Stack

| Layer | Technology |
|-------|------------|
| Frontend | Next.js 14 (App Router) + TypeScript |
| Styling | Tailwind CSS |
| Auth | NextAuth.js (Credentials + Google OAuth) |
| Database | PostgreSQL + Prisma ORM |
| Validation | Zod |

## 📁 Cấu trúc Project

```
todo-app/
├── prisma/
│   ├── schema.prisma      # Database schema
│   └── seed.ts            # Seed data
├── src/
│   ├── app/
│   │   ├── api/
│   │   │   ├── auth/      # NextAuth handlers
│   │   │   └── tasks/     # Tasks CRUD API
│   │   ├── login/         # Login page
│   │   ├── register/      # Register page
│   │   ├── layout.tsx
│   │   ├── page.tsx       # Main dashboard
│   │   └── globals.css
│   ├── components/
│   │   ├── ui/            # Reusable UI components
│   │   ├── tasks/         # Task-related components
│   │   ├── Navbar.tsx
│   │   └── Providers.tsx
│   ├── lib/
│   │   ├── auth.ts        # NextAuth config
│   │   ├── prisma.ts      # Prisma client
│   │   ├── utils.ts       # Utility functions
│   │   └── validations.ts # Zod schemas
│   ├── types/             # TypeScript types
│   └── middleware.ts      # Auth middleware
└── package.json
```

## 🔧 Hướng dẫn cài đặt

### 1. Clone và cài đặt dependencies

```bash
cd todo-app
npm install
```

### 2. Cấu hình biến môi trường

Copy file `.env.example` thành `.env` và cập nhật các giá trị:

```bash
cp .env.example .env
```

```env
# Database (PostgreSQL)
DATABASE_URL="postgresql://user:password@localhost:5432/todoapp?schema=public"

# NextAuth
NEXTAUTH_URL="http://localhost:3000"
NEXTAUTH_SECRET="your-super-secret-key-here"

# Google OAuth (lấy từ Google Cloud Console)
GOOGLE_CLIENT_ID="your-google-client-id"
GOOGLE_CLIENT_SECRET="your-google-client-secret"
```

### 3. Thiết lập Google OAuth

1. Vào [Google Cloud Console](https://console.cloud.google.com/)
2. Tạo project mới hoặc chọn project có sẵn
3. Vào **APIs & Services** > **Credentials**
4. Tạo **OAuth 2.0 Client IDs**
5. Thêm Authorized redirect URIs:
   - `http://localhost:3000/api/auth/callback/google`
6. Copy Client ID và Client Secret vào file `.env`

### 4. Khởi tạo Database

```bash
# Generate Prisma client
npm run db:generate

# Push schema to database
npm run db:push

# (Optional) Seed sample data
npm run db:seed
```

### 5. Chạy ứng dụng

```bash
npm run dev
```

Mở [http://localhost:3000](http://localhost:3000) để xem kết quả.

## 📊 API Endpoints

### Authentication

| Method | Endpoint | Mô tả |
|--------|----------|-------|
| POST | `/api/auth/register` | Đăng ký tài khoản mới |
| POST | `/api/auth/[...nextauth]` | NextAuth handlers |

### Tasks (Yêu cầu xác thực)

| Method | Endpoint | Mô tả |
|--------|----------|-------|
| GET | `/api/tasks` | Lấy danh sách tasks của user |
| POST | `/api/tasks` | Tạo task mới |
| GET | `/api/tasks/:id` | Lấy chi tiết task |
| PUT | `/api/tasks/:id` | Cập nhật task |
| DELETE | `/api/tasks/:id` | Xóa task |

**Query Parameters cho GET /api/tasks:**
- `search` - Tìm kiếm theo tiêu đề
- `status` - Lọc theo trạng thái (TODO, IN_PROGRESS, DONE)
- `deadline` - Lọc theo deadline (today, this_week, overdue)
- `sortBy` - Sắp xếp theo (deadline, status, createdAt)
- `sortOrder` - Thứ tự (asc, desc)

## 🔐 Bảo mật

- **Middleware Protection**: API routes được bảo vệ bằng NextAuth middleware
- **User Isolation**: Mỗi task được gắn với `userId`, API chỉ trả về tasks của user hiện tại
- **Password Hashing**: Mật khẩu được hash bằng bcrypt
- **Input Validation**: Tất cả input được validate bằng Zod

## 🎨 Trạng thái Task

| Status | Label | Màu |
|--------|-------|-----|
| TODO | Chưa làm | 🟡 Vàng |
| IN_PROGRESS | Đang làm | 🔵 Xanh dương |
| DONE | Hoàn thành | 🟢 Xanh lá |
| Overdue | Quá hạn | 🔴 Đỏ |

## 📱 Screenshots

### Dashboard
- Thống kê tổng quan
- Bộ lọc và tìm kiếm
- Danh sách công việc

### Task Form
- Tạo / sửa công việc
- Chọn trạng thái
- Đặt deadline

### Authentication
- Đăng nhập / Đăng ký
- Google OAuth

## 🚀 Deploy

### Vercel (Recommended)

1. Push code lên GitHub
2. Import project vào [Vercel](https://vercel.com)
3. Thêm biến môi trường
4. Deploy!

### Docker

```bash
docker-compose up -d
```

## 📝 Demo Account

- **Email**: demo@example.com
- **Password**: demo123456

## 📄 License

MIT License