Add archive button and confirmation dialogs to admin page

This commit is contained in:
2025-10-01 23:52:24 -04:00
parent 4b47f56b30
commit fd1f3c14bb

View File

@@ -48,6 +48,14 @@
>
Edit
</button>
<button
type="button"
@click="handleArchive"
:disabled="!selectedSermonId || archiving"
class="flex-1 px-6 py-2 bg-yellow-600 text-white rounded-md hover:bg-yellow-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-yellow-500 disabled:opacity-50 disabled:cursor-not-allowed font-medium"
>
{{ archiving ? 'Archiving...' : 'Archive' }}
</button>
<button
type="button"
@click="handleDelete"
@@ -59,11 +67,11 @@
</div>
</div>
<div v-if="deleteError" class="text-red-600 text-sm">
{{ deleteError }}
<div v-if="deleteError || archiveError" class="text-red-600 text-sm">
{{ deleteError || archiveError }}
</div>
<div v-if="deleteSuccess" class="text-green-600 text-sm">
{{ deleteSuccess }}
<div v-if="deleteSuccess || archiveSuccess" class="text-green-600 text-sm">
{{ deleteSuccess || archiveSuccess }}
</div>
</div>
@@ -245,14 +253,17 @@ definePageMeta({
middleware: 'auth'
})
// Fetch all sermons for management
const { data: allSermons, refresh: refreshSermons } = await useFetch('/api/sermons')
// Fetch all sermons for management (including archived)
const { data: allSermons, refresh: refreshSermons } = await useFetch('/api/sermons?includeArchived=true')
// Sermon management state
const selectedSermonId = ref('')
const deleteError = ref('')
const deleteSuccess = ref('')
const deleting = ref(false)
const archiving = ref(false)
const archiveError = ref('')
const archiveSuccess = ref('')
// Create sermon form state
const editingSermonId = ref<number | null>(null)
@@ -386,9 +397,40 @@ function handleEdit() {
}
}
async function handleArchive() {
if (!selectedSermonId.value) return
if (!confirm('Are you sure you want to archive this sermon? It will be moved to the previous sermons list.')) {
return
}
archiveError.value = ''
archiveSuccess.value = ''
archiving.value = true
try {
await $fetch(`/api/sermons/archive/${selectedSermonId.value}`, {
method: 'POST'
})
archiveSuccess.value = 'Sermon archived successfully!'
selectedSermonId.value = ''
await refreshSermons()
} catch (e: any) {
archiveError.value = e.data?.message || 'Failed to archive sermon'
} finally {
archiving.value = false
}
}
async function handleDelete() {
if (!selectedSermonId.value) return
if (!confirm('Are you sure you want to permanently delete this sermon?')) {
return
}
deleteError.value = ''
deleteSuccess.value = ''
deleting.value = true