Implement status toggle functionality for contact requests, updating the status display and adding error handling. Enhance the UI with a new button for marking requests as completed or reopening them.

pages/cms/kontaktanfragen.vue

@@ -58,7 +58,7 @@
               class="px-2.5 py-1 rounded-full text-xs font-semibold"
               :class="request.status === 'beantwortet' ? 'bg-green-100 text-green-800' : 'bg-yellow-100 text-yellow-800'"
             >
-              {{ request.status === 'beantwortet' ? 'Beantwortet' : 'Offen' }}
+              {{ request.status === 'beantwortet' ? 'Erledigt' : 'Offen' }}
             </span>
           </div>
 
@@ -87,7 +87,15 @@
               </div>
             </div>
 
-            <div class="mt-4 flex justify-end">
+            <div class="mt-4 flex justify-end gap-2">
+              <button
+                type="button"
+                class="px-4 py-2 border border-gray-300 text-gray-700 rounded-lg hover:bg-gray-50"
+                :disabled="togglingId === request.id"
+                @click="toggleStatus(request)"
+              >
+                {{ togglingId === request.id ? '…' : (request.status === 'beantwortet' ? 'Wieder öffnen' : 'Als erledigt markieren') }}
+              </button>
               <button
                 class="px-4 py-2 bg-primary-600 text-white rounded-lg hover:bg-primary-700"
                 @click="openReplyModal(request)"
@@ -154,6 +162,7 @@ const replyText = ref('')
 const isSendingReply = ref(false)
 const errorMessage = ref('')
 const showAnswered = ref(false)
+const togglingId = ref(null)
 
 const filteredRequests = computed(() => {
   if (showAnswered.value) return requests.value
@@ -191,6 +200,23 @@ const closeReplyModal = () => {
   errorMessage.value = ''
 }
 
+const toggleStatus = async (request) => {
+  togglingId.value = request.id
+  try {
+    await $fetch(`/api/cms/contact-requests/${request.id}/toggle-status`, {
+      method: 'PATCH'
+    })
+    await loadRequests()
+  } catch (error) {
+    console.error('Fehler beim Umschalten des Status:', error)
+    if (window.showErrorModal) {
+      window.showErrorModal('Fehler', error?.data?.statusMessage || 'Status konnte nicht geändert werden.')
+    }
+  } finally {
+    togglingId.value = null
+  }
+}
+
 const sendReply = async () => {
   if (!selectedRequest.value) return
   const text = replyText.value.trim()