fix(report): use Axios blob for authenticated downloads; remove dead closeDownloadMenu

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Ubuntu 2026-04-26 00:26:19 +00:00
parent 0235bd51e8
commit b78c3721f2
1 changed files with 32 additions and 7 deletions

View File

@ -141,14 +141,14 @@
</svg> </svg>
</button> </button>
<div v-if="showDownloadMenu" class="download-menu"> <div v-if="showDownloadMenu" class="download-menu">
<a :href="getReportDownloadUrl(reportId, 'md')" download class="download-option" @click="showDownloadMenu = false"> <button class="download-option" @click="downloadReport('md')">
<svg viewBox="0 0 24 24" width="14" height="14" fill="none" stroke="currentColor" stroke-width="2"> <svg viewBox="0 0 24 24" width="14" height="14" fill="none" stroke="currentColor" stroke-width="2">
<path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path> <path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path>
<polyline points="14 2 14 8 20 8"></polyline> <polyline points="14 2 14 8 20 8"></polyline>
</svg> </svg>
<span>Markdown (.md)</span> <span>Markdown (.md)</span>
</a> </button>
<a :href="getReportDownloadUrl(reportId, 'pdf')" download class="download-option" @click="showDownloadMenu = false"> <button class="download-option" @click="downloadReport('pdf')">
<svg viewBox="0 0 24 24" width="14" height="14" fill="none" stroke="currentColor" stroke-width="2"> <svg viewBox="0 0 24 24" width="14" height="14" fill="none" stroke="currentColor" stroke-width="2">
<path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path> <path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path>
<polyline points="14 2 14 8 20 8"></polyline> <polyline points="14 2 14 8 20 8"></polyline>
@ -157,7 +157,7 @@
<polyline points="10 9 9 9 8 9"></polyline> <polyline points="10 9 9 9 8 9"></polyline>
</svg> </svg>
<span>PDF (.pdf)</span> <span>PDF (.pdf)</span>
</a> </button>
</div> </div>
</div> </div>
@ -427,7 +427,8 @@
import { ref, computed, watch, onMounted, onUnmounted, nextTick, h, reactive } from 'vue' import { ref, computed, watch, onMounted, onUnmounted, nextTick, h, reactive } from 'vue'
import { useRouter } from 'vue-router' import { useRouter } from 'vue-router'
import { useI18n } from 'vue-i18n' import { useI18n } from 'vue-i18n'
import { getAgentLog, getConsoleLog, getReportDownloadUrl } from '../api/report' import { getAgentLog, getConsoleLog } from '../api/report'
import service from '../api'
const router = useRouter() const router = useRouter()
const { t } = useI18n() const { t } = useI18n()
@ -441,8 +442,6 @@ const props = defineProps({
const emit = defineEmits(['add-log', 'update-status']) const emit = defineEmits(['add-log', 'update-status'])
// Download menu // Download menu
const closeDownloadMenu = () => { showDownloadMenu.value = false }
const handleClickOutside = (e) => { const handleClickOutside = (e) => {
if (!e.target.closest('.download-wrapper')) showDownloadMenu.value = false if (!e.target.closest('.download-wrapper')) showDownloadMenu.value = false
} }
@ -454,6 +453,27 @@ const goToInteraction = () => {
} }
} }
const downloadReport = async (format) => {
showDownloadMenu.value = false
try {
const resp = await service.get(
`/api/report/${props.reportId}/download`,
{ params: { format }, responseType: 'blob' }
)
const blob = resp instanceof Blob ? resp : new Blob([resp])
const url = URL.createObjectURL(blob)
const a = document.createElement('a')
a.href = url
a.download = `${props.reportId}.${format}`
document.body.appendChild(a)
a.click()
document.body.removeChild(a)
URL.revokeObjectURL(url)
} catch (err) {
console.error('Download failed:', err)
}
}
// State // State
const agentLogs = ref([]) const agentLogs = ref([])
const consoleLogs = ref([]) const consoleLogs = ref([])
@ -5256,6 +5276,11 @@ watch(() => props.reportId, (newId) => {
color: #D1D5DB; color: #D1D5DB;
text-decoration: none; text-decoration: none;
transition: background 0.15s ease; transition: background 0.15s ease;
background: none;
border: none;
width: 100%;
text-align: left;
cursor: pointer;
} }
.download-option:hover { .download-option:hover {