From 53369baeef54773d5c824f9bbf48ed4d75a1b432 Mon Sep 17 00:00:00 2001
From: Frank <frank@wuenscheonline.de>
Date: Tue, 30 Dec 2025 08:55:00 +0100
Subject: [PATCH] Export allowes now PDF, VTT and Bamort format

---
 frontend/src/components/CharacterDetails.vue  |   8 +-
 .../{ExportPdfDialog.vue => ExportDialog.vue} | 100 +++++++++++++++++-
 frontend/src/locales/de                       |  10 +-
 frontend/src/locales/en                       |  10 +-
 4 files changed, 116 insertions(+), 12 deletions(-)
 rename frontend/src/components/{ExportPdfDialog.vue => ExportDialog.vue} (66%)

diff --git a/frontend/src/components/CharacterDetails.vue b/frontend/src/components/CharacterDetails.vue
index 4657283..5469b72 100644
--- a/frontend/src/components/CharacterDetails.vue
+++ b/frontend/src/components/CharacterDetails.vue
@@ -3,7 +3,7 @@
     <!-- Character Header -->
     <div class="character-header">
       <div class="header-content">
-        <button @click="showExportDialog = true" class="export-button-small" :title="$t('export.exportPDF')">
+        <button @click="showExportDialog = true" class="export-button-small" :title="$t('export.title')">
           📄
         </button>
         <h2>{{ $t('char') }}: {{ character.name }} ({{ $t(currentView) }})</h2>
@@ -11,7 +11,7 @@
     </div>
 
     <!-- Export Dialog -->
-    <ExportPdfDialog 
+    <ExportDialog 
       :characterId="id" 
       :showDialog="showExportDialog"
       @update:showDialog="showExportDialog = $event"
@@ -169,7 +169,7 @@
 
 <script>
 import API from '../utils/api'
-import ExportPdfDialog from "./ExportPdfDialog.vue";
+import ExportDialog from "./ExportDialog.vue";
 import DatasheetView from "./DatasheetView.vue"; // Component for character stats
 import SkillView from "./SkillView.vue"; // Component for character history
 import WeaponView from "./WeaponView.vue"; // Component for character history
@@ -183,7 +183,7 @@ export default {
   name: "CharacterDetails",
   props: ["id"], // Receive the route parameter as a prop
   components: {
-    ExportPdfDialog,
+    ExportDialog,
     DatasheetView,
     SkillView,
     WeaponView,
diff --git a/frontend/src/components/ExportPdfDialog.vue b/frontend/src/components/ExportDialog.vue
similarity index 66%
rename from frontend/src/components/ExportPdfDialog.vue
rename to frontend/src/components/ExportDialog.vue
index f7fe023..d4e94d5 100644
--- a/frontend/src/components/ExportPdfDialog.vue
+++ b/frontend/src/components/ExportDialog.vue
@@ -2,7 +2,7 @@
   <div v-if="showDialog" class="modal-overlay" @click.self="closeDialog">
     <div class="modal-content">
       <div class="modal-header">
-        <h3>{{ $t('export.exportPDF') }}</h3>
+        <h3>{{ $t('export.title') }}</h3>
         <button @click="closeDialog" class="close-button">&times;</button>
       </div>
       <div class="modal-body">
@@ -11,6 +11,15 @@
           <p>{{ $t('export.generating') }}</p>
         </div>
         <div class="form-group">
+          <label>{{ $t('export.selectFormat') }}:</label>
+          <select v-model="selectedFormat" class="template-select" :disabled="isExporting">
+            <option value="">{{ $t('export.pleaseSelectFormat') }}</option>
+            <option value="pdf">{{ $t('export.formatPDF') }}</option>
+            <option value="vtt">{{ $t('export.formatVTT') }}</option>
+            <option value="bamort">{{ $t('export.formatBamort') }}</option>
+          </select>
+        </div>
+        <div v-if="selectedFormat === 'pdf'" class="form-group">
           <label>{{ $t('export.selectTemplate') }}:</label>
           <select v-model="selectedTemplate" class="template-select" :disabled="isExporting">
             <option value="">{{ $t('export.pleaseSelectTemplate') }}</option>
@@ -19,7 +28,7 @@
             </option>
           </select>
         </div>
-        <div class="form-group">
+        <div v-if="selectedFormat === 'pdf'" class="form-group">
           <label class="checkbox-label">
             <input type="checkbox" v-model="showUserName" :disabled="isExporting">
             {{ $t('export.showUserName') }}
@@ -30,7 +39,7 @@
         <button @click="closeDialog" class="btn-cancel" :disabled="isExporting">
           {{ $t('export.cancel') }}
         </button>
-        <button @click="exportToPDF" class="btn-export" :disabled="!selectedTemplate || isExporting">
+        <button @click="performExport" class="btn-export" :disabled="!canExport || isExporting">
           <span v-if="!isExporting">{{ $t('export.export') }}</span>
           <span v-else>{{ $t('export.exporting') }}</span>
         </button>
@@ -233,7 +242,7 @@
 import API from '../utils/api'
 
 export default {
-  name: "ExportPdfDialog",
+  name: "ExportDialog",
   props: {
     characterId: {
       type: [String, Number],
@@ -247,11 +256,19 @@ export default {
   data() {
     return {
       templates: [],
+      selectedFormat: "",
       selectedTemplate: "",
       showUserName: false,
       isExporting: false
     }
   },
+  computed: {
+    canExport() {
+      if (!this.selectedFormat) return false
+      if (this.selectedFormat === 'pdf' && !this.selectedTemplate) return false
+      return true
+    }
+  },
   async created() {
     await this.loadTemplates()
   },
@@ -269,6 +286,21 @@ export default {
       }
     },
     
+    async performExport() {
+      if (!this.selectedFormat) {
+        alert(this.$t('export.pleaseSelectFormat'))
+        return
+      }
+
+      if (this.selectedFormat === 'pdf') {
+        await this.exportToPDF()
+      } else if (this.selectedFormat === 'vtt') {
+        await this.exportToVTT()
+      } else if (this.selectedFormat === 'bamort') {
+        await this.exportToBamort()
+      }
+    },
+    
     async exportToPDF() {
       if (!this.selectedTemplate) {
         alert(this.$t('export.pleaseSelectTemplate'))
@@ -310,6 +342,66 @@ export default {
         this.isExporting = false
       }
     },
+
+    async exportToVTT() {
+      this.isExporting = true
+      
+      try {
+        // Get VTT data and trigger download
+        const response = await API.get(`/api/importer/export/vtt/${this.characterId}/file`, {
+          responseType: 'blob'
+        })
+        
+        // Create download link
+        const blob = new Blob([response.data], { type: 'application/json' })
+        const url = window.URL.createObjectURL(blob)
+        const link = document.createElement('a')
+        link.href = url
+        link.download = `character_${this.characterId}_vtt.json`
+        document.body.appendChild(link)
+        link.click()
+        document.body.removeChild(link)
+        window.URL.revokeObjectURL(url)
+        
+        this.$emit('export-success')
+        this.closeDialog()
+      } catch (error) {
+        console.error('Failed to export VTT:', error)
+        alert(this.$t('export.exportFailed') + ': ' + (error.response?.data?.error || error.message))
+      } finally {
+        this.isExporting = false
+      }
+    },
+
+    async exportToBamort() {
+      this.isExporting = true
+      
+      try {
+        // Get Bamort JSON data and trigger download
+        const response = await API.get(`/api/transfer/download/${this.characterId}`, {
+          responseType: 'blob'
+        })
+        
+        // Create download link
+        const blob = new Blob([response.data], { type: 'application/json' })
+        const url = window.URL.createObjectURL(blob)
+        const link = document.createElement('a')
+        link.href = url
+        link.download = `character_${this.characterId}_bamort.json`
+        document.body.appendChild(link)
+        link.click()
+        document.body.removeChild(link)
+        window.URL.revokeObjectURL(url)
+        
+        this.$emit('export-success')
+        this.closeDialog()
+      } catch (error) {
+        console.error('Failed to export Bamort format:', error)
+        alert(this.$t('export.exportFailed') + ': ' + (error.response?.data?.error || error.message))
+      } finally {
+        this.isExporting = false
+      }
+    },
     
     closeDialog() {
       this.$emit('update:showDialog', false)
diff --git a/frontend/src/locales/de b/frontend/src/locales/de
index 9cdd6b9..fa4169f 100644
--- a/frontend/src/locales/de
+++ b/frontend/src/locales/de
@@ -433,15 +433,21 @@ export default {
     notes: 'Notizen'
   },
   export: {
+    title: 'Figur exportieren',
+    selectFormat: 'Format wählen',
+    formatPDF: 'PDF',
+    formatVTT: 'VTT Format',
+    formatBamort: 'Bamort Format (JSON)',
     selectTemplate: 'Vorlage',
     exportPDF: 'PDF Export',
     exporting: 'Exportiere...',
     pleaseSelectTemplate: 'Bitte Vorlage auswählen',
-    exportFailed: 'PDF Export fehlgeschlagen',
+    pleaseSelectFormat: 'Bitte Format auswählen',
+    exportFailed: 'Export fehlgeschlagen',
     showUserName: 'Benutzername anzeigen',
     cancel: 'Abbrechen',
     export: 'Exportieren',
-    generating: 'PDF wird generiert...',
+    generating: 'Datei wird generiert...',
     pleaseWait: 'Bitte warten, dies kann einen Moment dauern',
     popupBlocked: 'Popup wurde blockiert. Bitte erlauben Sie Popups für diese Seite.'
   },
diff --git a/frontend/src/locales/en b/frontend/src/locales/en
index db7a837..eeeff27 100644
--- a/frontend/src/locales/en
+++ b/frontend/src/locales/en
@@ -429,15 +429,21 @@ export default {
     notes: 'Notes'
   },
   export: {
+    title: 'Export Character',
+    selectFormat: 'Select Format',
+    formatPDF: 'PDF',
+    formatVTT: 'VTT Format',
+    formatBamort: 'Bamort Format (JSON)',
     selectTemplate: 'Template',
     exportPDF: 'Export PDF',
     exporting: 'Exporting...',
     pleaseSelectTemplate: 'Please select a template',
-    exportFailed: 'PDF export failed',
+    pleaseSelectFormat: 'Please select a format',
+    exportFailed: 'Export failed',
     showUserName: 'Show username',
     cancel: 'Cancel',
     export: 'Export',
-    generating: 'Generating PDF...',
+    generating: 'Generating file...',
     pleaseWait: 'Please wait, this may take a moment',
     popupBlocked: 'Popup was blocked. Please allow popups for this site.'
   },