Init Repo

2026-02-28 03:22:04 +08:00
commit de59b57ee7
883 changed files with 156857 additions and 0 deletions
@@ -0,0 +1,97 @@
+# Task 18: EditableTaskStatus Custom Status Support Implementation
+
+## Overview
+Updated all EditableTaskStatus components (task, shot, and asset) to support custom task statuses with color indicators.
+
+## Changes Made
+
+### 1. Task EditableTaskStatus Component (`frontend/src/components/task/EditableTaskStatus.vue`)
+- Added `projectId` prop to fetch custom statuses
+- Fetches both system and custom statuses from the API
+- Displays color indicators next to each status option
+- Supports both TaskStatus enum and custom status strings
+- Uses TaskStatusBadge component with custom color support
+
+### 2. Shot EditableTaskStatus Component (`frontend/src/components/shot/EditableTaskStatus.vue`)
+- Added `projectId` prop to fetch custom statuses
+- Fetches both system and custom statuses from the API
+- Displays color indicators next to each status option
+- Supports both TaskStatus enum and custom status strings
+- Updated to use task TaskStatusBadge for custom color support
+
+### 3. Asset EditableTaskStatus Component (`frontend/src/components/asset/EditableTaskStatus.vue`)
+- Added `projectId` prop to fetch custom statuses
+- Fetches both system and custom statuses from the API
+- Displays color indicators next to each status option
+- Supports both TaskStatus enum and custom status strings
+- Updated to use task TaskStatusBadge for custom color support
+
+### 4. Task Columns (`frontend/src/components/task/columns.ts`)
+- Updated to pass `projectId` to EditableTaskStatus component
+- Task object already contains `project_id` field
+
+### 5. Shot Columns (`frontend/src/components/shot/columns.ts`)
+- Updated `ShotColumnMeta` interface to include `projectId`
+- Updated column creation to pass `projectId` to EditableTaskStatus component
+
+### 6. Shot Browser (`frontend/src/components/shot/ShotBrowser.vue`)
+- Updated `shotColumns` computed to include `projectId` in meta
+
+### 7. Asset Browser (`frontend/src/components/asset/AssetBrowser.vue`)
+- Updated all EditableTaskStatus usages to pass `projectId` prop
+- Updated `handleTaskStatusUpdate` to accept string instead of TaskStatus enum
+
+## Features
+
+### Custom Status Display
+- All three EditableTaskStatus components now fetch and display custom statuses
+- Custom statuses are shown alongside system statuses in the dropdown
+- Each status option shows a color indicator (small colored circle) next to the badge
+
+### Status Object Support
+- Components now support both string status IDs and status objects
+- Status objects include: `id`, `name`, `color`, and `is_system` properties
+- TaskStatusBadge component handles custom colors automatically
+
+### Loading States
+- Shows loading indicator while fetching custom statuses
+- Disables dropdown during status updates and status loading
+
+### Error Handling
+- Gracefully handles API errors when fetching statuses
+- Reverts to original status if update fails
+- Logs errors to console for debugging
+
+## API Integration
+
+### Endpoints Used
+- `GET /projects/{projectId}/task-statuses` - Fetches all statuses (system + custom)
+- `PUT /tasks/{taskId}/status` - Updates task status
+
+### Response Format
+```typescript
+{
+  statuses: CustomTaskStatus[]        // Custom statuses
+  system_statuses: SystemTaskStatus[] // System statuses
+  default_status_id: string          // Default status ID
+}
+```
+
+## Type Safety
+- All components properly typed with TypeScript
+- StatusOption interface for unified status representation
+- Proper type conversions between TaskStatus enum and string
+
+## Requirements Validated
+- ✅ 7.1: Fetch custom statuses for current project
+- ✅ 7.2: Display both system and custom statuses in dropdown
+- ✅ 7.3: Show color indicator next to each status option
+- ✅ 7.4: Update task status via API
+
+## Testing Recommendations
+1. Create a project with custom statuses
+2. Verify custom statuses appear in all three contexts (tasks, shots, assets)
+3. Verify color indicators display correctly
+4. Verify status updates work with both system and custom statuses
+5. Test with projects that have no custom statuses
+6. Test loading states and error handling