Files
scadalink-design/src/ScadaLink.CentralUI/Components/Pages/SiteCalls/SiteCallsReport.razor

321 lines
16 KiB
Plaintext

@page "/site-calls/report"
@attribute [Authorize(Policy = ScadaLink.Security.AuthorizationPolicies.RequireDeployment)]
@using ScadaLink.Commons.Entities.Sites
@using ScadaLink.Commons.Interfaces.Repositories
@using ScadaLink.Commons.Messages.Audit
@using ScadaLink.Communication
@inject CommunicationService CommunicationService
@inject ISiteRepository SiteRepository
@inject IDialogService Dialog
@inject ILogger<SiteCallsReport> Logger
<div class="container-fluid mt-3">
<ToastNotification @ref="_toast" />
<div class="d-flex justify-content-between align-items-center mb-3">
<h4 class="mb-0">Site Calls</h4>
<button class="btn btn-outline-secondary btn-sm" @onclick="RefreshAll" disabled="@_loading">
@if (_loading) { <span class="spinner-border spinner-border-sm me-1" role="status"></span> }
Refresh
</button>
</div>
@* ── Filters ── *@
<div class="card mb-3">
<div class="card-body py-2">
<div class="row g-2 align-items-end">
<div class="col-auto">
<label class="form-label small mb-1" for="sc-status">Status</label>
<select id="sc-status" class="form-select form-select-sm" style="min-width: 130px;"
@bind="_statusFilter">
<option value="">All</option>
<option value="Submitted">Submitted</option>
<option value="Forwarded">Forwarded</option>
<option value="Attempted">Attempted</option>
<option value="Delivered">Delivered</option>
<option value="Parked">Parked</option>
<option value="Failed">Failed</option>
<option value="Discarded">Discarded</option>
</select>
</div>
<div class="col-auto">
<label class="form-label small mb-1" for="sc-channel">Channel</label>
<select id="sc-channel" class="form-select form-select-sm" style="min-width: 130px;"
@bind="_channelFilter">
<option value="">All</option>
<option value="ApiOutbound">ApiOutbound</option>
<option value="DbOutbound">DbOutbound</option>
</select>
</div>
<div class="col-auto">
<label class="form-label small mb-1" for="sc-site">Source site</label>
<select id="sc-site" class="form-select form-select-sm" style="min-width: 150px;"
@bind="_siteFilter">
<option value="">Any</option>
@foreach (var site in _sites)
{
<option value="@site.SiteIdentifier">@site.Name</option>
}
</select>
</div>
<div class="col-auto">
<label class="form-label small mb-1" for="sc-from">From</label>
<input id="sc-from" type="datetime-local" class="form-control form-control-sm"
@bind="_fromFilter" />
</div>
<div class="col-auto">
<label class="form-label small mb-1" for="sc-to">To</label>
<input id="sc-to" type="datetime-local" class="form-control form-control-sm"
@bind="_toFilter" />
</div>
<div class="col">
<label class="form-label small mb-1" for="sc-search">Target keyword</label>
<input id="sc-search" type="search" class="form-control form-control-sm"
placeholder="Exact target…" @bind="_targetFilter" />
</div>
<div class="col-auto">
<div class="form-check mb-1">
<input class="form-check-input" type="checkbox" id="sc-stuck-only"
@bind="_stuckOnly" />
<label class="form-check-label small" for="sc-stuck-only">Stuck only</label>
</div>
</div>
<div class="col-auto">
<button class="btn btn-outline-secondary btn-sm" @onclick="ClearFilters"
disabled="@(!HasActiveFilters)">Clear</button>
</div>
<div class="col-auto">
<button class="btn btn-primary btn-sm" @onclick="Search" disabled="@_loading"
data-test="site-calls-query">
@if (_loading) { <span class="spinner-border spinner-border-sm me-1" role="status"></span> }
Query
</button>
</div>
</div>
</div>
</div>
@if (_listError != null)
{
<div class="alert alert-danger">@_listError</div>
}
@* ── Site call list ── *@
@if (_siteCalls == null)
{
@if (_loading)
{
<div class="text-muted small">Loading…</div>
}
}
else if (_siteCalls.Count == 0)
{
<div class="card">
<div class="card-body text-center text-muted py-5">
<div class="fs-5 mb-1">No site calls</div>
<div class="small">No cached calls match the current filters.</div>
</div>
</div>
}
else
{
<div class="table-responsive">
<table class="table table-sm table-hover align-middle">
<thead class="table-light">
<tr>
<th>Tracked operation</th>
<th>Source site</th>
<th>Channel</th>
<th>Target</th>
<th>Status</th>
<th class="text-end">Retries</th>
<th>Last error</th>
<th>Created</th>
<th>Updated</th>
<th class="text-end">Actions</th>
</tr>
</thead>
<tbody>
@foreach (var c in _siteCalls)
{
<tr @key="c.TrackedOperationId" class="@(c.IsStuck ? "table-warning" : "")"
style="cursor: pointer;" @ondblclick="() => ShowDetail(c)"
title="Double-click for full detail">
<td><code class="small" title="@c.TrackedOperationId">@ShortId(c.TrackedOperationId)</code></td>
<td><span class="small">@SiteName(c.SourceSite)</span></td>
<td>@c.Channel</td>
<td>@c.Target</td>
<td>
<span class="badge @StatusBadgeClass(c.Status)">@c.Status</span>
@if (c.IsStuck)
{
<span class="badge bg-warning text-dark ms-1">Stuck</span>
}
</td>
<td class="text-end font-monospace">@c.RetryCount</td>
<td>
@if (!string.IsNullOrEmpty(c.LastError))
{
<div class="small text-danger text-truncate" style="max-width: 280px;"
title="@c.LastError">@c.LastError</div>
}
else
{
<span class="text-muted">—</span>
}
</td>
<td><TimestampDisplay Value="@AsOffset(c.CreatedAtUtc)" Format="yyyy-MM-dd HH:mm" /></td>
<td><TimestampDisplay Value="@AsOffset(c.UpdatedAtUtc)" Format="yyyy-MM-dd HH:mm" /></td>
<td class="text-end" @ondblclick:stopPropagation="true">
@* The TrackedOperationId is the audit CorrelationId, so the
link deep-links into the central Audit Log pre-filtered to
this cached call's lifecycle events. *@
<a class="btn btn-outline-secondary btn-sm me-1"
href="/audit/log?correlationId=@c.TrackedOperationId"
data-test="audit-link-@c.TrackedOperationId">
View audit history
</a>
@* Retry/Discard relay only on Parked rows — central relays the
action to the owning site; Failed and other statuses are not
actionable from central. *@
@if (c.Status == "Parked")
{
<button class="btn btn-outline-success btn-sm me-1"
@onclick="() => RetrySiteCall(c)" disabled="@_actionInProgress">
Retry
</button>
<button class="btn btn-outline-danger btn-sm"
@onclick="() => DiscardSiteCall(c)" disabled="@_actionInProgress">
Discard
</button>
}
</td>
</tr>
}
</tbody>
</table>
</div>
@* Keyset paging — the Task 4 query response carries a (CreatedAtUtc, Id)
cursor rather than page numbers, so we keep a stack of cursors to step
backwards and the response's NextAfter* cursor to step forwards. *@
<div class="d-flex justify-content-between align-items-center">
<span class="text-muted small">
@* No "of N" total: keyset paging has no cheap total-count, so
the label is intentionally page-number-only. Do not "fix"
this by adding a total — that would require a COUNT(*). *@
Page @(_cursorStack.Count + 1) · @_siteCalls.Count rows
</span>
<div>
<button class="btn btn-outline-secondary btn-sm me-1"
@onclick="PrevPage" disabled="@(_cursorStack.Count == 0 || _loading)"
data-test="site-calls-prev">Previous</button>
<button class="btn btn-outline-secondary btn-sm"
@onclick="NextPage" disabled="@(!HasNextPage || _loading)"
data-test="site-calls-next">Next</button>
</div>
</div>
}
</div>
@* ── Row detail modal ── *@
@if (_detailSiteCall != null)
{
var d = _detailSiteCall;
<div class="modal show d-block" tabindex="-1" style="background: rgba(0,0,0,0.4);"
@onclick="CloseDetail">
<div class="modal-dialog modal-dialog-scrollable modal-lg" @onclick:stopPropagation="true">
<div class="modal-content">
<div class="modal-header">
<h6 class="modal-title">Site Call Detail — @ShortId(d.TrackedOperationId)</h6>
<button type="button" class="btn-close" aria-label="Close"
@onclick="CloseDetail"></button>
</div>
<div class="modal-body">
@if (_detailLoading)
{
<div class="text-muted small">
<span class="spinner-border spinner-border-sm me-1" role="status"></span>
Loading details…
</div>
}
else if (_detailError != null)
{
<div class="text-danger small">@_detailError</div>
}
else if (_detail != null)
{
var det = _detail;
<dl class="row mb-0">
<dt class="col-sm-3">Tracked operation</dt>
<dd class="col-sm-9"><code>@det.TrackedOperationId</code></dd>
<dt class="col-sm-3">Source site</dt>
<dd class="col-sm-9">@SiteName(det.SourceSite)</dd>
<dt class="col-sm-3">Channel</dt>
<dd class="col-sm-9">@det.Channel</dd>
<dt class="col-sm-3">Target</dt>
<dd class="col-sm-9">@det.Target</dd>
<dt class="col-sm-3">Status</dt>
<dd class="col-sm-9">
<span class="badge @StatusBadgeClass(det.Status)">@det.Status</span>
</dd>
<dt class="col-sm-3">Retry count</dt>
<dd class="col-sm-9 font-monospace">@det.RetryCount</dd>
<dt class="col-sm-3">HTTP status</dt>
<dd class="col-sm-9">@(det.HttpStatus?.ToString() ?? "—")</dd>
<dt class="col-sm-3">Created</dt>
<dd class="col-sm-9">
<TimestampDisplay Value="@AsOffset(det.CreatedAtUtc)" Format="yyyy-MM-dd HH:mm:ss" />
</dd>
<dt class="col-sm-3">Updated</dt>
<dd class="col-sm-9">
<TimestampDisplay Value="@AsOffset(det.UpdatedAtUtc)" Format="yyyy-MM-dd HH:mm:ss" />
</dd>
<dt class="col-sm-3">Terminal</dt>
<dd class="col-sm-9">
<TimestampDisplay Value="@AsOffset(det.TerminalAtUtc)"
Format="yyyy-MM-dd HH:mm:ss" NullText="—" />
</dd>
<dt class="col-sm-3">Ingested (central)</dt>
<dd class="col-sm-9">
<TimestampDisplay Value="@AsOffset(det.IngestedAtUtc)" Format="yyyy-MM-dd HH:mm:ss" />
</dd>
@if (!string.IsNullOrEmpty(det.LastError))
{
<dt class="col-sm-3">Last error</dt>
@* Plain text — never a MarkupString. *@
<dd class="col-sm-9 text-danger">@det.LastError</dd>
}
</dl>
}
</div>
<div class="modal-footer">
@if (d.Status == "Parked")
{
<button class="btn btn-outline-success btn-sm"
@onclick="() => RetryFromDetail(d)" disabled="@_actionInProgress">
Retry
</button>
<button class="btn btn-outline-danger btn-sm"
@onclick="() => DiscardFromDetail(d)" disabled="@_actionInProgress">
Discard
</button>
}
<button class="btn btn-outline-secondary btn-sm" @onclick="CloseDetail">Close</button>
</div>
</div>
</div>
</div>
}