기능구현중

frontend/todo/index.vue

@@ -39,6 +39,8 @@
                 <label class="btn btn-outline-secondary btn-sm" for="statusProgress">진행</label>
                 <input type="radio" class="btn-check" name="status" id="statusCompleted" value="COMPLETED" v-model="filter.status" @change="loadTodos">
                 <label class="btn btn-outline-secondary btn-sm" for="statusCompleted">완료</label>
+                <input type="radio" class="btn-check" name="status" id="statusDiscarded" value="DISCARDED" v-model="filter.status" @change="loadTodos">
+                <label class="btn btn-outline-secondary btn-sm" for="statusDiscarded">폐기</label>
               </div>
             </div>
             <div class="col-2">
@@ -146,7 +148,15 @@
             </div>
           </div>
           <div class="modal-footer">
-            <button v-if="isEdit" type="button" class="btn btn-outline-danger me-auto" @click="deleteTodo">삭제</button>
+            <div class="me-auto" v-if="isEdit">
+              <button type="button" class="btn btn-success me-1" @click="completeTodo" v-if="form.status !== 'COMPLETED'">
+                <i class="bi bi-check-lg me-1"></i>완료
+              </button>
+              <button type="button" class="btn btn-outline-dark me-1" @click="discardTodo" v-if="form.status !== 'DISCARDED'">
+                <i class="bi bi-x-lg me-1"></i>폐기
+              </button>
+              <button type="button" class="btn btn-outline-danger" @click="deleteTodo">삭제</button>
+            </div>
             <button type="button" class="btn btn-secondary" @click="showModal = false">취소</button>
             <button type="button" class="btn btn-primary" @click="saveTodo" :disabled="isSaving">
               {{ isSaving ? '저장 중...' : '저장' }}
@@ -315,11 +325,36 @@ async function deleteTodo() {
   }
 }
 
+async function completeTodo() {
+  if (!editTodoId.value) return
+  try {
+    await $fetch(`/api/todo/${editTodoId.value}/complete`, { method: 'PUT' })
+    showModal.value = false
+    await loadTodos()
+  } catch (e: any) {
+    alert(e.data?.message || '완료 처리에 실패했습니다.')
+  }
+}
+
+async function discardTodo() {
+  if (!editTodoId.value) return
+  const reason = prompt('폐기 사유를 입력하세요 (선택):', '')
+  if (reason === null) return // 취소
+  try {
+    await $fetch(`/api/todo/${editTodoId.value}/discard`, { method: 'PUT', body: { reason } })
+    showModal.value = false
+    await loadTodos()
+  } catch (e: any) {
+    alert(e.data?.message || '폐기 처리에 실패했습니다.')
+  }
+}
+
 function getStatusBadge(status: string) {
   const badges: Record<string, string> = {
     PENDING: 'badge bg-secondary',
     IN_PROGRESS: 'badge bg-primary',
     COMPLETED: 'badge bg-success',
+    DISCARDED: 'badge bg-dark',
     CANCELLED: 'badge bg-dark'
   }
   return badges[status] || 'badge bg-secondary'
@@ -330,6 +365,7 @@ function getStatusLabel(status: string) {
     PENDING: '대기',
     IN_PROGRESS: '진행',
     COMPLETED: '완료',
+    DISCARDED: '폐기',
     CANCELLED: '취소'
   }
   return labels[status] || status