d5f3990f3b
- Post-login (OAuth + dev-login) now redirects to the next upcoming service's edit page instead of /dashboard, mirroring the GET / route. - NameTagResolver now reads the real ChurchTools `responsible` shape (persons[].person.title) and resolves moderator/preacher/worship-leader by responsible ROLE ([Moderation]/[Predigt]/[Lobpreis]). This fixes missing name slides and makes the worship-leader arrangement trigger (e.g. service 12 → "Benedikt Hardt" / "Jennifer Schneider"). - NameTagSlideBuilder no longer silently drops the name slide when the configured macro id points to a missing macro; it emits the slide without a macro instead. - Song export: the "first slide" / "last slide" macro now applies only to the song's very first/last slide (global slide index across all sections), not the first slide of every section. - Export "headlines" for content-less agenda items are now emitted as proper ProPresenter playlist HEADER items instead of text presentations. - Prefix/postfix export files now also accept .probundle (unzipped: inner .pro + media embedded) in addition to .pro, both for upload validation and export injection. Full suite green (587 passed).
227 lines
9.7 KiB
Vue
227 lines
9.7 KiB
Vue
<script setup>
|
|
import { ref } from 'vue'
|
|
import { route } from 'ziggy-js'
|
|
|
|
const props = defineProps({
|
|
prefixFiles: { type: Array, default: () => [] },
|
|
postfixFiles: { type: Array, default: () => [] },
|
|
})
|
|
|
|
const prefixDragActive = ref(false)
|
|
const postfixDragActive = ref(false)
|
|
const uploading = ref(false)
|
|
const error = ref(null)
|
|
|
|
function getXsrfToken() {
|
|
return decodeURIComponent(document.cookie.match(/XSRF-TOKEN=([^;]+)/)?.[1] ?? '')
|
|
}
|
|
|
|
async function uploadFiles(type, files) {
|
|
if (!files || files.length === 0) return
|
|
uploading.value = true
|
|
error.value = null
|
|
|
|
const form = new FormData()
|
|
form.append('type', type)
|
|
for (const file of files) {
|
|
form.append('files[]', file)
|
|
}
|
|
|
|
try {
|
|
const res = await fetch(route('settings.export-pro-files.store'), {
|
|
method: 'POST',
|
|
headers: {
|
|
'X-Requested-With': 'XMLHttpRequest',
|
|
'X-XSRF-TOKEN': getXsrfToken(),
|
|
},
|
|
body: form,
|
|
})
|
|
if (!res.ok) {
|
|
const data = await res.json()
|
|
error.value = data.message || 'Upload fehlgeschlagen'
|
|
return
|
|
}
|
|
window.location.reload()
|
|
} catch {
|
|
error.value = 'Netzwerkfehler beim Upload'
|
|
} finally {
|
|
uploading.value = false
|
|
}
|
|
}
|
|
|
|
function handlePrefixChange(event) {
|
|
const files = event.target.files
|
|
if (!files || files.length === 0) return
|
|
event.target.value = ''
|
|
uploadFiles('prefix', files)
|
|
}
|
|
|
|
function handlePostfixChange(event) {
|
|
const files = event.target.files
|
|
if (!files || files.length === 0) return
|
|
event.target.value = ''
|
|
uploadFiles('postfix', files)
|
|
}
|
|
|
|
function handlePrefixDrop(event) {
|
|
prefixDragActive.value = false
|
|
uploadFiles('prefix', event.dataTransfer.files)
|
|
}
|
|
|
|
function handlePostfixDrop(event) {
|
|
postfixDragActive.value = false
|
|
uploadFiles('postfix', event.dataTransfer.files)
|
|
}
|
|
|
|
async function deleteFile(id) {
|
|
try {
|
|
await fetch(route('settings.export-pro-files.destroy', id), {
|
|
method: 'DELETE',
|
|
headers: {
|
|
'X-Requested-With': 'XMLHttpRequest',
|
|
'X-XSRF-TOKEN': getXsrfToken(),
|
|
},
|
|
})
|
|
window.location.reload()
|
|
} catch {
|
|
// silent fail
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<div class="space-y-8">
|
|
<div>
|
|
<h3 class="mb-1 text-sm font-semibold text-gray-900">Export-Dateien</h3>
|
|
<p class="text-xs text-gray-500">
|
|
Diese .pro- und .probundle-Dateien werden bei jedem Export vorne (Prefix) bzw. hinten (Postfix) an den Gottesdienst angehängt.
|
|
</p>
|
|
</div>
|
|
|
|
<div
|
|
v-if="error"
|
|
class="rounded-lg bg-red-50 p-3 text-sm text-red-700"
|
|
>
|
|
{{ error }}
|
|
</div>
|
|
|
|
<!-- Prefix section -->
|
|
<div>
|
|
<h4 class="mb-2 text-xs font-semibold uppercase tracking-wide text-gray-500">Prefix-Dateien</h4>
|
|
<p class="mb-3 text-xs text-gray-400">Werden vor dem Gottesdienst eingefügt.</p>
|
|
|
|
<label
|
|
class="mb-4 flex cursor-pointer flex-col items-center justify-center rounded-xl border-2 border-dashed p-6 transition-colors"
|
|
:class="prefixDragActive
|
|
? 'border-amber-400 bg-amber-50'
|
|
: 'border-gray-200 bg-gray-50 hover:border-amber-300 hover:bg-amber-50'"
|
|
data-testid="export-prefix-dropzone"
|
|
@dragover.prevent
|
|
@dragenter.prevent="prefixDragActive = true"
|
|
@dragleave.prevent="prefixDragActive = false"
|
|
@drop.prevent="handlePrefixDrop"
|
|
>
|
|
<svg class="mb-2 h-8 w-8 text-gray-300" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5">
|
|
<path stroke-linecap="round" stroke-linejoin="round" d="M3 16.5v2.25A2.25 2.25 0 005.25 21h13.5A2.25 2.25 0 0021 18.75V16.5m-13.5-9L12 3m0 0l4.5 4.5M12 3v13.5" />
|
|
</svg>
|
|
<span class="text-sm text-gray-500">
|
|
{{ uploading ? 'Wird hochgeladen...' : '.pro / .probundle-Dateien auswählen oder hierher ziehen' }}
|
|
</span>
|
|
<span class="mt-1 text-xs text-gray-400">Mehrere Dateien möglich</span>
|
|
<input
|
|
type="file"
|
|
class="hidden"
|
|
accept=".pro,.probundle"
|
|
multiple
|
|
:disabled="uploading"
|
|
data-testid="export-prefix-file-input"
|
|
@change="handlePrefixChange"
|
|
/>
|
|
</label>
|
|
|
|
<div v-if="prefixFiles.length > 0" class="divide-y divide-gray-100 rounded-lg border border-gray-100">
|
|
<div
|
|
v-for="file in prefixFiles"
|
|
:key="file.id"
|
|
class="flex items-center gap-3 px-3 py-2 text-sm"
|
|
>
|
|
<svg class="h-4 w-4 shrink-0 text-gray-400" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5">
|
|
<path stroke-linecap="round" stroke-linejoin="round" d="M19.5 14.25v-2.625a3.375 3.375 0 00-3.375-3.375h-1.5A1.125 1.125 0 0113.5 7.125v-1.5a3.375 3.375 0 00-3.375-3.375H8.25m2.25 0H5.625c-.621 0-1.125.504-1.125 1.125v17.25c0 .621.504 1.125 1.125 1.125h12.75c.621 0 1.125-.504 1.125-1.125V11.25a9 9 0 00-9-9z" />
|
|
</svg>
|
|
<span class="flex-1 truncate text-gray-700">{{ file.original_name }}</span>
|
|
<span class="text-xs text-gray-400">#{{ file.order + 1 }}</span>
|
|
<button
|
|
class="ml-2 text-gray-400 hover:text-red-500"
|
|
:data-testid="'export-pro-file-delete-' + file.id"
|
|
@click="deleteFile(file.id)"
|
|
>
|
|
<svg class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
|
|
<path stroke-linecap="round" stroke-linejoin="round" d="M6 18L18 6M6 6l12 12" />
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<p v-else class="text-sm text-gray-400">Noch keine Prefix-Dateien hochgeladen.</p>
|
|
</div>
|
|
|
|
<!-- Postfix section -->
|
|
<div>
|
|
<h4 class="mb-2 text-xs font-semibold uppercase tracking-wide text-gray-500">Postfix-Dateien</h4>
|
|
<p class="mb-3 text-xs text-gray-400">Werden nach dem Gottesdienst angehängt.</p>
|
|
|
|
<label
|
|
class="mb-4 flex cursor-pointer flex-col items-center justify-center rounded-xl border-2 border-dashed p-6 transition-colors"
|
|
:class="postfixDragActive
|
|
? 'border-amber-400 bg-amber-50'
|
|
: 'border-gray-200 bg-gray-50 hover:border-amber-300 hover:bg-amber-50'"
|
|
data-testid="export-postfix-dropzone"
|
|
@dragover.prevent
|
|
@dragenter.prevent="postfixDragActive = true"
|
|
@dragleave.prevent="postfixDragActive = false"
|
|
@drop.prevent="handlePostfixDrop"
|
|
>
|
|
<svg class="mb-2 h-8 w-8 text-gray-300" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5">
|
|
<path stroke-linecap="round" stroke-linejoin="round" d="M3 16.5v2.25A2.25 2.25 0 005.25 21h13.5A2.25 2.25 0 0021 18.75V16.5m-13.5-9L12 3m0 0l4.5 4.5M12 3v13.5" />
|
|
</svg>
|
|
<span class="text-sm text-gray-500">
|
|
{{ uploading ? 'Wird hochgeladen...' : '.pro / .probundle-Dateien auswählen oder hierher ziehen' }}
|
|
</span>
|
|
<span class="mt-1 text-xs text-gray-400">Mehrere Dateien möglich</span>
|
|
<input
|
|
type="file"
|
|
class="hidden"
|
|
accept=".pro,.probundle"
|
|
multiple
|
|
:disabled="uploading"
|
|
data-testid="export-postfix-file-input"
|
|
@change="handlePostfixChange"
|
|
/>
|
|
</label>
|
|
|
|
<div v-if="postfixFiles.length > 0" class="divide-y divide-gray-100 rounded-lg border border-gray-100">
|
|
<div
|
|
v-for="file in postfixFiles"
|
|
:key="file.id"
|
|
class="flex items-center gap-3 px-3 py-2 text-sm"
|
|
>
|
|
<svg class="h-4 w-4 shrink-0 text-gray-400" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5">
|
|
<path stroke-linecap="round" stroke-linejoin="round" d="M19.5 14.25v-2.625a3.375 3.375 0 00-3.375-3.375h-1.5A1.125 1.125 0 0113.5 7.125v-1.5a3.375 3.375 0 00-3.375-3.375H8.25m2.25 0H5.625c-.621 0-1.125.504-1.125 1.125v17.25c0 .621.504 1.125 1.125 1.125h12.75c.621 0 1.125-.504 1.125-1.125V11.25a9 9 0 00-9-9z" />
|
|
</svg>
|
|
<span class="flex-1 truncate text-gray-700">{{ file.original_name }}</span>
|
|
<span class="text-xs text-gray-400">#{{ file.order + 1 }}</span>
|
|
<button
|
|
class="ml-2 text-gray-400 hover:text-red-500"
|
|
:data-testid="'export-pro-file-delete-' + file.id"
|
|
@click="deleteFile(file.id)"
|
|
>
|
|
<svg class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
|
|
<path stroke-linecap="round" stroke-linejoin="round" d="M6 18L18 6M6 6l12 12" />
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<p v-else class="text-sm text-gray-400">Noch keine Postfix-Dateien hochgeladen.</p>
|
|
</div>
|
|
</div>
|
|
</template>
|