feat: implement custom fields, gantt view, calendar view, and file encryption
- Custom Fields (FEAT-001): - CustomField and TaskCustomValue models with formula support - CRUD API for custom field management - Formula engine for calculated fields - Frontend: CustomFieldEditor, CustomFieldInput, ProjectSettings page - Task list API now includes custom_values - KanbanBoard displays custom field values - Gantt View (FEAT-003): - TaskDependency model with FS/SS/FF/SF dependency types - Dependency CRUD API with cycle detection - start_date field added to tasks - GanttChart component with Frappe Gantt integration - Dependency type selector in UI - Calendar View (FEAT-004): - CalendarView component with FullCalendar integration - Date range filtering API for tasks - Drag-and-drop date updates - View mode switching in Tasks page - File Encryption (FEAT-010): - AES-256-GCM encryption service - EncryptionKey model with key rotation support - Admin API for key management - Encrypted upload/download for confidential projects - Migrations: 011 (custom fields), 012 (encryption keys), 013 (task dependencies) - Updated issues.md with completion status 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
beabigegg
@@ -0,0 +1,91 @@
|
||||
# Proposal: Add Calendar View
|
||||
|
||||
**Change ID:** `add-calendar-view`
|
||||
**Issue Reference:** `FEAT-004` (issues.md)
|
||||
**Status:** Draft
|
||||
**Author:** Claude
|
||||
**Date:** 2026-01-05
|
||||
|
||||
## Summary
|
||||
|
||||
實作行事曆視角，以月/週/日視圖呈現任務截止日期，方便使用者規劃工作時程。
|
||||
|
||||
## Motivation
|
||||
|
||||
行事曆視角提供直覺的日期導向任務規劃：
|
||||
- 快速掌握本週/本月截止的任務
|
||||
- 識別特定日期的工作量
|
||||
- 避免任務截止日期過度集中
|
||||
- 與個人行事曆習慣一致
|
||||
|
||||
目前系統需要在列表或看板中逐一檢視任務日期，無法一覽全局。
|
||||
|
||||
## Scope
|
||||
|
||||
### In Scope
|
||||
- Frontend: Calendar 元件（月視圖、週視圖、日視圖）
|
||||
- Frontend: 任務依截止日期顯示在行事曆上
|
||||
- Frontend: 點擊任務開啟詳情 Modal
|
||||
- Frontend: 拖拉任務更改截止日期
|
||||
- Frontend: 篩選器（依指派者、狀態、優先級）
|
||||
|
||||
### Out of Scope
|
||||
- 與外部行事曆（Google Calendar、Outlook）同步
|
||||
- 重複任務功能
|
||||
- 行事曆分享
|
||||
|
||||
## Design Decisions
|
||||
|
||||
### 前端函式庫選擇
|
||||
建議使用 **FullCalendar**：
|
||||
|
||||
| 函式庫 | 優點 | 缺點 |
|
||||
|--------|------|------|
|
||||
| FullCalendar | 功能完整、React 支援好、拖拉支援 | 需要 premium 功能要付費 |
|
||||
| react-big-calendar | 開源、輕量 | 功能較少 |
|
||||
| @schedule-x/react | 現代設計 | 社群較小 |
|
||||
|
||||
**建議**: 使用 FullCalendar（MIT 授權核心功能足夠）
|
||||
|
||||
### 視圖模式
|
||||
| 視圖 | 說明 |
|
||||
|------|------|
|
||||
| Month | 月曆格式，每格顯示當日任務（最多 3 個，其餘 "+N more"）|
|
||||
| Week | 週視圖，每格顯示當日所有任務 |
|
||||
| Day | 日視圖，當天任務完整列表 |
|
||||
|
||||
### 任務顯示規則
|
||||
- 依 due_date 顯示在對應日期
|
||||
- 任務卡片顯示：標題、狀態顏色標記、優先級圖示
|
||||
- 已完成任務可選顯示/隱藏
|
||||
- 已過期未完成任務特殊標記（紅色邊框）
|
||||
|
||||
### 拖拉更新日期
|
||||
- 拖拉任務至其他日期更新 due_date
|
||||
- 使用現有 PUT /api/tasks/{id} API
|
||||
- 樂觀更新，失敗時回滾
|
||||
|
||||
### API 使用
|
||||
```
|
||||
# 使用現有 API，加入日期範圍篩選
|
||||
GET /api/projects/{project_id}/tasks?due_after=2026-01-01&due_before=2026-01-31
|
||||
```
|
||||
|
||||
## Affected Specs
|
||||
|
||||
| Spec | Change Type |
|
||||
|------|-------------|
|
||||
| task-management | MODIFIED (Multiple Views requirement 行事曆細節) |
|
||||
|
||||
## Risks & Mitigations
|
||||
|
||||
| Risk | Mitigation |
|
||||
|------|------------|
|
||||
| 單日任務過多影響顯示 | 月視圖最多顯示 3 個，其餘收合 |
|
||||
| 效能問題 | 只載入當前視圖月份的任務 |
|
||||
| 與甘特圖日期衝突 | 行事曆編輯 due_date，甘特圖可編輯 start_date + due_date |
|
||||
|
||||
## Dependencies
|
||||
|
||||
- FullCalendar（或其他行事曆函式庫）
|
||||
- 現有 Task API 的 due_date 篩選支援
|
||||
@@ -0,0 +1,51 @@
|
||||
## MODIFIED Requirements
|
||||
|
||||
### Requirement: Multiple Views
|
||||
系統 SHALL 支援多維視角：看板 (Kanban)、甘特圖 (Gantt)、列表 (List)、行事曆 (Calendar)。
|
||||
|
||||
#### Scenario: 行事曆視角
|
||||
- **GIVEN** 使用者選擇行事曆視角
|
||||
- **WHEN** 系統載入專案任務
|
||||
- **THEN** 任務依截止日期顯示在行事曆上
|
||||
|
||||
#### Scenario: 行事曆視圖切換
|
||||
- **GIVEN** 使用者正在查看行事曆
|
||||
- **WHEN** 使用者切換視圖模式（月、週、日）
|
||||
- **THEN** 行事曆相應調整顯示格式
|
||||
- **AND** 任務正確顯示在對應日期
|
||||
|
||||
#### Scenario: 月視圖任務顯示
|
||||
- **GIVEN** 使用者選擇月視圖
|
||||
- **WHEN** 某日有超過 3 個任務
|
||||
- **THEN** 顯示前 3 個任務
|
||||
- **AND** 顯示 "+N more" 連結可展開查看全部
|
||||
|
||||
#### Scenario: 點擊任務查看詳情
|
||||
- **GIVEN** 使用者正在查看行事曆
|
||||
- **WHEN** 使用者點擊任務
|
||||
- **THEN** 系統開啟任務詳情 Modal
|
||||
- **AND** 可在 Modal 中編輯任務
|
||||
|
||||
#### Scenario: 拖拉調整截止日期
|
||||
- **GIVEN** 使用者正在查看行事曆
|
||||
- **WHEN** 使用者拖拉任務至其他日期
|
||||
- **THEN** 系統更新任務的 due_date
|
||||
- **AND** 任務顯示在新日期
|
||||
|
||||
#### Scenario: 已過期任務標示
|
||||
- **GIVEN** 任務的 due_date 已過期
|
||||
- **WHEN** 任務狀態不是「已完成」
|
||||
- **THEN** 任務顯示特殊標記（紅色邊框或背景）
|
||||
- **AND** 提醒使用者注意
|
||||
|
||||
#### Scenario: 日期範圍載入
|
||||
- **GIVEN** 使用者查看行事曆
|
||||
- **WHEN** 系統載入任務
|
||||
- **THEN** 只載入當前視圖日期範圍內的任務
|
||||
- **AND** 切換月份時動態載入對應任務
|
||||
|
||||
#### Scenario: 行事曆篩選
|
||||
- **GIVEN** 使用者正在查看行事曆
|
||||
- **WHEN** 使用者設定篩選條件（指派者、狀態、優先級）
|
||||
- **THEN** 行事曆只顯示符合條件的任務
|
||||
- **AND** 篩選條件在視圖切換時保留
|
||||
@@ -0,0 +1,80 @@
|
||||
# Tasks: Add Calendar View
|
||||
|
||||
## Backend Tasks
|
||||
|
||||
### 1. Add date range filter to Tasks API
|
||||
- [x] Modify GET /api/projects/{project_id}/tasks to accept `due_after` and `due_before` query params
|
||||
- [x] Add filter logic to query
|
||||
- [x] Add API tests
|
||||
- **驗證**: 可依日期範圍篩選任務 ✅
|
||||
|
||||
## Frontend Tasks
|
||||
|
||||
### 2. Install and configure FullCalendar
|
||||
- [x] Install @fullcalendar/react and related packages
|
||||
- [x] Install @fullcalendar/daygrid (month view)
|
||||
- [x] Install @fullcalendar/timegrid (week/day view)
|
||||
- [x] Install @fullcalendar/interaction (drag & drop)
|
||||
- **驗證**: 套件安裝成功 ✅
|
||||
|
||||
### 3. Create CalendarView component
|
||||
- [x] Create `frontend/src/components/CalendarView.tsx`
|
||||
- [x] Configure calendar with month/week/day views
|
||||
- [x] Style calendar to match application theme
|
||||
- [x] Add view toggle buttons
|
||||
- **驗證**: 行事曆正確渲染 ✅
|
||||
|
||||
### 4. Load and display tasks on calendar
|
||||
- [x] Fetch tasks from API with date range
|
||||
- [x] Transform tasks to FullCalendar event format
|
||||
- [x] Display task title, status color, priority icon
|
||||
- [x] Handle overdue tasks (special styling)
|
||||
- **驗證**: 任務正確顯示在對應日期 ✅
|
||||
|
||||
### 5. Implement task click to open detail modal
|
||||
- [x] Handle event click in calendar
|
||||
- [x] Open TaskDetailModal with selected task
|
||||
- [x] Refresh calendar on task update
|
||||
- **驗證**: 點擊任務開啟詳情 ✅
|
||||
|
||||
### 6. Implement drag-to-change date
|
||||
- [x] Enable drag & drop in FullCalendar
|
||||
- [x] Handle event drop to get new date
|
||||
- [x] Call PUT /api/tasks/{id} with new due_date
|
||||
- [x] Show optimistic update, rollback on error
|
||||
- **驗證**: 拖拉更新日期可正常運作 ✅
|
||||
|
||||
### 7. Add filter controls
|
||||
- [x] Add assignee filter dropdown
|
||||
- [x] Add status filter (show/hide completed)
|
||||
- [x] Add priority filter
|
||||
- [x] Persist filter in URL or localStorage
|
||||
- **驗證**: 篩選器正確過濾任務 ✅
|
||||
|
||||
### 8. Integrate Calendar view into Tasks page
|
||||
- [x] Add "Calendar" option to view toggle
|
||||
- [x] Store view preference in localStorage
|
||||
- [x] Handle view switching
|
||||
- **驗證**: 可在 List/Kanban/Gantt/Calendar 之間切換 ✅
|
||||
|
||||
## Task Dependencies
|
||||
|
||||
```
|
||||
[1] Date Range Filter API
|
||||
↓
|
||||
[2] FullCalendar Setup → [3] CalendarView Component
|
||||
↓
|
||||
[4] Task Display
|
||||
↓
|
||||
[5] Click → Modal
|
||||
↓
|
||||
[6] Drag to Change Date
|
||||
↓
|
||||
[7] Filters
|
||||
↓
|
||||
[8] View Integration
|
||||
```
|
||||
|
||||
- Task 1 (Backend) 可平行於 Tasks 2-3 (Frontend) 開發
|
||||
- Task 4 需要 Task 1 完成（需要日期範圍 API）
|
||||
- Tasks 5-8 為循序開發
|
||||
Reference in New Issue
Block a user