105 lines
3.9 KiB
JavaScript
105 lines
3.9 KiB
JavaScript
import { apiGet } from '../api.js';
|
|
import { showToast } from '../app.js';
|
|
|
|
export async function exportPage() {
|
|
const app = document.getElementById('app');
|
|
app.innerHTML = `
|
|
<div class="page-header">
|
|
<h1>Export Data</h1>
|
|
<div class="actions"><a href="#/" class="btn">← Dashboard</a></div>
|
|
</div>
|
|
<div class="card" id="exportContent"><div class="spinner"></div></div>
|
|
`;
|
|
|
|
try {
|
|
const data = await apiGet('questionnaires.php');
|
|
renderExport(data.questionnaires || []);
|
|
} catch (e) {
|
|
showToast(e.message, 'error');
|
|
document.getElementById('exportContent').innerHTML = `<p class="error-text">${esc(e.message)}</p>`;
|
|
}
|
|
}
|
|
|
|
function renderExport(questionnaires) {
|
|
const container = document.getElementById('exportContent');
|
|
|
|
if (!questionnaires.length) {
|
|
container.innerHTML = `
|
|
<div class="empty-state">
|
|
<h3>No questionnaires</h3>
|
|
<p>Create questionnaires first to export data.</p>
|
|
</div>
|
|
`;
|
|
return;
|
|
}
|
|
|
|
container.innerHTML = `
|
|
<p style="margin-bottom:16px;color:var(--text-secondary)">
|
|
Select a questionnaire and click Export to download a CSV file with all client responses (filtered by your role's visibility).
|
|
</p>
|
|
<table class="data-table">
|
|
<thead>
|
|
<tr>
|
|
<th>Questionnaire</th>
|
|
<th>Version</th>
|
|
<th>State</th>
|
|
<th>Questions</th>
|
|
<th>Actions</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
${questionnaires.map(q => `
|
|
<tr>
|
|
<td><strong>${esc(q.name)}</strong></td>
|
|
<td>${esc(q.version || '—')}</td>
|
|
<td><span class="badge badge-${(q.state || 'draft').toLowerCase()}">${esc(q.state || 'draft')}</span></td>
|
|
<td>${q.questionCount || 0}</td>
|
|
<td>
|
|
<button class="btn btn-sm btn-primary export-btn" data-id="${q.questionnaireID}" data-name="${esc(q.name)}" data-version="${esc(q.version)}">
|
|
Export CSV
|
|
</button>
|
|
<a href="#/questionnaire/${q.questionnaireID}/results" class="btn btn-sm">View Results</a>
|
|
</td>
|
|
</tr>
|
|
`).join('')}
|
|
</tbody>
|
|
</table>
|
|
`;
|
|
|
|
container.querySelectorAll('.export-btn').forEach(btn => {
|
|
btn.addEventListener('click', async () => {
|
|
btn.disabled = true;
|
|
btn.textContent = 'Downloading...';
|
|
try {
|
|
const token = localStorage.getItem('qdb_token');
|
|
const res = await fetch(`../api/export.php?questionnaireID=${encodeURIComponent(btn.dataset.id)}&format=csv`, {
|
|
headers: { 'Authorization': `Bearer ${token}` }
|
|
});
|
|
if (!res.ok) {
|
|
const err = await res.json().catch(() => ({ error: 'Download failed' }));
|
|
throw new Error(err.error);
|
|
}
|
|
const blob = await res.blob();
|
|
const url = URL.createObjectURL(blob);
|
|
const a = document.createElement('a');
|
|
a.href = url;
|
|
a.download = `${btn.dataset.name}_v${btn.dataset.version}.csv`;
|
|
a.click();
|
|
URL.revokeObjectURL(url);
|
|
showToast('Download started', 'success');
|
|
} catch (e) {
|
|
showToast(e.message, 'error');
|
|
} finally {
|
|
btn.disabled = false;
|
|
btn.textContent = 'Export CSV';
|
|
}
|
|
});
|
|
});
|
|
}
|
|
|
|
function esc(s) {
|
|
const d = document.createElement('div');
|
|
d.textContent = s ?? '';
|
|
return d.innerHTML;
|
|
}
|