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:
@@ -51,6 +51,10 @@
|
|||||||
<a :href="'/domains/' + report.domain" class="btn btn-outline btn-sm">
|
<a :href="'/domains/' + report.domain" class="btn btn-outline btn-sm">
|
||||||
Back to Domain
|
Back to Domain
|
||||||
</a>
|
</a>
|
||||||
|
<button class="btn btn-error btn-sm"
|
||||||
|
@click="deleteReport(report.domain, report.report_id)">
|
||||||
|
Delete Report
|
||||||
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</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) {
|
formatDate(timestamp) {
|
||||||
if (!timestamp) return '—';
|
if (!timestamp) return '—';
|
||||||
return new Date(timestamp * 1000).toLocaleString();
|
return new Date(timestamp * 1000).toLocaleString();
|
||||||
|
|||||||
@@ -95,11 +95,17 @@
|
|||||||
</div>
|
</div>
|
||||||
{% endcall %}
|
{% endcall %}
|
||||||
{% call td("text-right") %}
|
{% call td("text-right") %}
|
||||||
|
<div class="inline-flex gap-2 justify-end">
|
||||||
<a :href="`/reports/${report.report_id}`">
|
<a :href="`/reports/${report.report_id}`">
|
||||||
{% call button(variant="outline", size="sm") %}
|
{% call button(variant="outline", size="sm") %}
|
||||||
View Details
|
View Details
|
||||||
{% endcall %}
|
{% endcall %}
|
||||||
</a>
|
</a>
|
||||||
|
<button class="btn btn-error btn-sm"
|
||||||
|
@click="deleteReport(report.domain, report.report_id)">
|
||||||
|
Delete
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
{% endcall %}
|
{% endcall %}
|
||||||
{% endcall %}
|
{% endcall %}
|
||||||
</template>
|
</template>
|
||||||
@@ -174,6 +180,32 @@ function reportsApp() {
|
|||||||
} finally {
|
} finally {
|
||||||
this.loading = false;
|
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.');
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user