feat: add delete buttons to reports list and report detail pages

- Add "Delete" button to reports list table (reports.html): clicking
  shows a confirmation dialog then calls the existing DELETE API.
  On success, the row is removed from the table without a page reload.
  Domain filter dropdown is pruned if the domain has no remaining reports.

- Add "Delete Report" button to report detail page (report_detail.html):
  clicking shows a confirmation dialog then calls the DELETE API.
  On success, redirects to /reports.

The backend DELETE endpoint and re-upload-after-delete (deduplication
exemption) were already in place and covered by existing tests.

Agent-Logs-Url: https://github.com/christianlouis/dmarq/sessions/d6c0078b-9338-49f0-87bd-32238fbde237

Co-authored-by: christianlouis <361235+christianlouis@users.noreply.github.com>
This commit is contained in:
copilot-swe-agent[bot]
2026-03-30 00:37:53 +00:00
parent e75fde4311
commit 61cb428f54
2 changed files with 62 additions and 5 deletions
+25
View File
@@ -51,6 +51,10 @@
<a :href="'/domains/' + report.domain" class="btn btn-outline btn-sm">
Back to Domain
</a>
<button class="btn btn-error btn-sm"
@click="deleteReport(report.domain, report.report_id)">
Delete Report
</button>
</div>
</div>
@@ -247,6 +251,27 @@ function reportDetailApp(reportId) {
}
},
async deleteReport(domain, reportId) {
if (!confirm(`Delete report "${reportId}" for domain "${domain}"?\n\nThis will remove the report from the system. You can re-import it afterwards.`)) {
return;
}
try {
const response = await fetch(
`/api/v1/reports/domain/${encodeURIComponent(domain)}/reports/${encodeURIComponent(reportId)}`,
{ method: 'DELETE' }
);
if (response.ok) {
window.location.href = '/reports';
} else {
const data = await response.json().catch(() => ({}));
alert('Failed to delete report: ' + (data.detail || response.statusText));
}
} catch (error) {
console.error('Error deleting report:', error);
alert('Network error — could not delete report.');
}
},
formatDate(timestamp) {
if (!timestamp) return '—';
return new Date(timestamp * 1000).toLocaleString();
+37 -5
View File
@@ -95,11 +95,17 @@
</div>
{% endcall %}
{% call td("text-right") %}
<a :href="`/reports/${report.report_id}`">
{% call button(variant="outline", size="sm") %}
View Details
{% endcall %}
</a>
<div class="inline-flex gap-2 justify-end">
<a :href="`/reports/${report.report_id}`">
{% call button(variant="outline", size="sm") %}
View Details
{% endcall %}
</a>
<button class="btn btn-error btn-sm"
@click="deleteReport(report.domain, report.report_id)">
Delete
</button>
</div>
{% endcall %}
{% endcall %}
</template>
@@ -174,6 +180,32 @@ function reportsApp() {
} finally {
this.loading = false;
}
},
async deleteReport(domain, reportId) {
if (!confirm(`Delete report "${reportId}" for domain "${domain}"?\n\nThis will remove the report from the system. You can re-import it afterwards.`)) {
return;
}
try {
const response = await fetch(
`/api/v1/reports/domain/${encodeURIComponent(domain)}/reports/${encodeURIComponent(reportId)}`,
{ method: 'DELETE' }
);
if (response.ok) {
this.reports = this.reports.filter(
r => !(r.domain === domain && r.report_id === reportId)
);
if (!this.reports.some(r => r.domain === domain)) {
this.domains = this.domains.filter(d => d !== domain);
}
} else {
const data = await response.json().catch(() => ({}));
alert('Failed to delete report: ' + (data.detail || response.statusText));
}
} catch (error) {
console.error('Error deleting report:', error);
alert('Network error — could not delete report.');
}
}
}
}