refactor(ui/admin): card grid, search, kebab; LDAP scope-rule chips
LdapMappings: flex header, search filter, per-row Edit + kebab Delete,
@key, dropped Site-Scope-Rules cell in favor of a {n rule(s)} badge.
LdapMappingForm: two stacked cards (Mapping then Site Scope Rules);
scope rules render as removable chips with an inline "Add scope rule"
form; create-mode disables the scope card with an explainer; role
select gets form-text help.
DataConnections: <h4> in flex header, Bulk actions dropdown holding
Expand/Collapse, hover-visible kebab on tree nodes mirroring the
right-click context menu, aria-labels, "No connections match the
filter." inline empty state.
DataConnectionForm: Site rendered as readonly plaintext + lock-after-
creation note in edit mode; parallel Primary endpoint / Backup endpoint
headings; "Optional" badge on Backup when null; form-text on
FailoverRetryCount.
ApiKeys: search filter, Status column dropped (state now lives in the
kebab menu label "Disable"/"Enable"), Edit + kebab actions, @key,
aria-labels.
ApiKeyForm: nested card removed; fixed-text Back header; real
clipboard copy via IJSRuntime + toast confirmation.
Test selector fix in DataConnectionFormTests for the new Site
readonly-plaintext rendering.
This commit is contained in:
Joseph Doherty
@@ -6,20 +6,31 @@
|
||||
@attribute [Authorize(Policy = AuthorizationPolicies.RequireAdmin)]
|
||||
@inject IInboundApiRepository InboundApiRepository
|
||||
@inject NavigationManager NavigationManager
|
||||
@inject IJSRuntime JS
|
||||
|
||||
<div class="container-fluid mt-3">
|
||||
<div class="d-flex align-items-center mb-3">
|
||||
@if (_saved)
|
||||
{
|
||||
<a href="/admin/api-keys" class="btn btn-outline-secondary btn-sm me-2">← Back to API Keys</a>
|
||||
}
|
||||
else
|
||||
{
|
||||
<a href="/admin/api-keys" class="btn btn-outline-secondary btn-sm me-2">← Back</a>
|
||||
}
|
||||
<h4 class="mb-0">@(_saved ? "API Key Created" : (_editingKey != null ? "Edit API Key" : "Add API Key"))</h4>
|
||||
<a href="/admin/api-keys" class="btn btn-outline-secondary btn-sm me-2"
|
||||
aria-label="Back to API Keys">← Back</a>
|
||||
<span class="text-muted me-2">·</span>
|
||||
<h4 class="mb-0">
|
||||
@if (_saved)
|
||||
{
|
||||
@:API Key Created
|
||||
}
|
||||
else if (IsEditMode)
|
||||
{
|
||||
@:Edit API Key
|
||||
}
|
||||
else
|
||||
{
|
||||
@:Add API Key
|
||||
}
|
||||
</h4>
|
||||
</div>
|
||||
|
||||
<ToastNotification @ref="_toast" />
|
||||
|
||||
@if (_loading)
|
||||
{
|
||||
<LoadingSpinner IsLoading="true" />
|
||||
@@ -42,21 +53,17 @@
|
||||
}
|
||||
else
|
||||
{
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<div class="mb-2">
|
||||
<label class="form-label small">Name</label>
|
||||
<input type="text" class="form-control form-control-sm" @bind="_formName" />
|
||||
</div>
|
||||
@if (_formError != null)
|
||||
{
|
||||
<div class="text-danger small mt-2">@_formError</div>
|
||||
}
|
||||
<div class="mt-3">
|
||||
<button class="btn btn-success btn-sm me-1" @onclick="SaveKey">Save</button>
|
||||
<button class="btn btn-outline-secondary btn-sm" @onclick="GoBack">Cancel</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mb-2">
|
||||
<label class="form-label small">Name</label>
|
||||
<input type="text" class="form-control form-control-sm" @bind="_formName" />
|
||||
</div>
|
||||
@if (_formError != null)
|
||||
{
|
||||
<div class="text-danger small mt-2">@_formError</div>
|
||||
}
|
||||
<div class="mt-3">
|
||||
<button class="btn btn-success btn-sm me-1" @onclick="SaveKey">Save</button>
|
||||
<button class="btn btn-outline-secondary btn-sm" @onclick="GoBack">Cancel</button>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
@@ -64,6 +71,8 @@
|
||||
@code {
|
||||
[Parameter] public int? Id { get; set; }
|
||||
|
||||
private bool IsEditMode => _editingKey != null;
|
||||
|
||||
private ApiKey? _editingKey;
|
||||
private string _formName = string.Empty;
|
||||
private string? _formError;
|
||||
@@ -72,6 +81,8 @@
|
||||
private bool _loading = true;
|
||||
private bool _saved;
|
||||
|
||||
private ToastNotification _toast = default!;
|
||||
|
||||
protected override async Task OnInitializedAsync()
|
||||
{
|
||||
try
|
||||
@@ -128,10 +139,18 @@
|
||||
|
||||
private void GoBack() => NavigationManager.NavigateTo("/admin/api-keys");
|
||||
|
||||
private void CopyKeyToClipboard()
|
||||
private async Task CopyKeyToClipboard()
|
||||
{
|
||||
// Note: JS interop for clipboard would be needed for actual copy.
|
||||
// For now the key is displayed for manual copy.
|
||||
if (_newlyCreatedKeyValue == null) return;
|
||||
try
|
||||
{
|
||||
await JS.InvokeVoidAsync("navigator.clipboard.writeText", _newlyCreatedKeyValue);
|
||||
_toast.ShowSuccess("Copied to clipboard.");
|
||||
}
|
||||
catch
|
||||
{
|
||||
_toast.ShowError("Copy failed.");
|
||||
}
|
||||
}
|
||||
|
||||
private static string GenerateApiKey()
|
||||
|
||||
@@ -13,7 +13,7 @@
|
||||
</div>
|
||||
|
||||
<ToastNotification @ref="_toast" />
|
||||
<ConfirmDialog @ref="_confirmDialog" />
|
||||
<ConfirmDialog @ref="_confirmDialog" ConfirmButtonClass="btn-danger" />
|
||||
|
||||
@if (_loading)
|
||||
{
|
||||
@@ -25,59 +25,75 @@
|
||||
}
|
||||
else
|
||||
{
|
||||
<table class="table table-sm table-striped table-hover">
|
||||
<thead class="table-dark">
|
||||
<tr>
|
||||
<th>ID</th>
|
||||
<th>Name</th>
|
||||
<th>Key Value</th>
|
||||
<th>Status</th>
|
||||
<th style="width: 240px;">Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@if (_keys.Count == 0)
|
||||
{
|
||||
<div class="mb-3" style="max-width: 320px;">
|
||||
<input class="form-control form-control-sm"
|
||||
placeholder="Filter by name…"
|
||||
@bind="_search" @bind:event="oninput" />
|
||||
</div>
|
||||
|
||||
@if (_keys.Count == 0)
|
||||
{
|
||||
<p class="text-muted text-center">No API keys configured.</p>
|
||||
}
|
||||
else if (!FilteredKeys.Any())
|
||||
{
|
||||
<p class="text-muted small">No API keys match the filter.</p>
|
||||
}
|
||||
else
|
||||
{
|
||||
<table class="table table-sm table-striped table-hover">
|
||||
<thead class="table-dark">
|
||||
<tr>
|
||||
<td colspan="5" class="text-muted text-center">No API keys configured.</td>
|
||||
<th>ID</th>
|
||||
<th>Name</th>
|
||||
<th>Key Value</th>
|
||||
<th style="width: 160px;">Actions</th>
|
||||
</tr>
|
||||
}
|
||||
@foreach (var key in _keys)
|
||||
{
|
||||
<tr>
|
||||
<td>@key.Id</td>
|
||||
<td>@key.Name</td>
|
||||
<td><code>@MaskKeyValue(key.KeyValue)</code></td>
|
||||
<td>
|
||||
@if (key.IsEnabled)
|
||||
{
|
||||
<span class="badge bg-success">Enabled</span>
|
||||
}
|
||||
else
|
||||
{
|
||||
<span class="badge bg-secondary">Disabled</span>
|
||||
}
|
||||
</td>
|
||||
<td>
|
||||
<button class="btn btn-outline-primary btn-sm py-0 px-1 me-1"
|
||||
@onclick='() => NavigationManager.NavigateTo($"/admin/api-keys/{key.Id}/edit")'>Edit</button>
|
||||
@if (key.IsEnabled)
|
||||
{
|
||||
<button class="btn btn-outline-warning btn-sm py-0 px-1 me-1"
|
||||
@onclick="() => ToggleKey(key)">Disable</button>
|
||||
}
|
||||
else
|
||||
{
|
||||
<button class="btn btn-outline-success btn-sm py-0 px-1 me-1"
|
||||
@onclick="() => ToggleKey(key)">Enable</button>
|
||||
}
|
||||
<button class="btn btn-outline-danger btn-sm py-0 px-1"
|
||||
@onclick="() => DeleteKey(key)">Delete</button>
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
</tbody>
|
||||
</table>
|
||||
</thead>
|
||||
<tbody>
|
||||
@foreach (var key in FilteredKeys)
|
||||
{
|
||||
<tr @key="key.Id">
|
||||
<td>@key.Id</td>
|
||||
<td>
|
||||
@key.Name
|
||||
@if (!key.IsEnabled)
|
||||
{
|
||||
<span class="badge bg-secondary ms-1">Disabled</span>
|
||||
}
|
||||
</td>
|
||||
<td><code>@MaskKeyValue(key.KeyValue)</code></td>
|
||||
<td>
|
||||
<div class="d-flex gap-1">
|
||||
<button class="btn btn-outline-primary btn-sm py-0 px-2"
|
||||
@onclick='() => NavigationManager.NavigateTo($"/admin/api-keys/{key.Id}/edit")'>Edit</button>
|
||||
<div class="dropdown">
|
||||
<button class="btn btn-outline-secondary btn-sm py-0 px-2"
|
||||
data-bs-toggle="dropdown"
|
||||
aria-label="@($"More actions for {key.Name}")">⋮</button>
|
||||
<ul class="dropdown-menu dropdown-menu-end">
|
||||
<li>
|
||||
<button class="dropdown-item"
|
||||
@onclick="() => ToggleKey(key)">
|
||||
@(key.IsEnabled ? "Disable" : "Enable")
|
||||
</button>
|
||||
</li>
|
||||
<li><hr class="dropdown-divider" /></li>
|
||||
<li>
|
||||
<button class="dropdown-item text-danger"
|
||||
@onclick="() => DeleteKey(key)">
|
||||
Delete
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
</tbody>
|
||||
</table>
|
||||
}
|
||||
}
|
||||
</div>
|
||||
|
||||
@@ -85,10 +101,17 @@
|
||||
private List<ApiKey> _keys = new();
|
||||
private bool _loading = true;
|
||||
private string? _errorMessage;
|
||||
private string _search = string.Empty;
|
||||
|
||||
private ToastNotification _toast = default!;
|
||||
private ConfirmDialog _confirmDialog = default!;
|
||||
|
||||
private IEnumerable<ApiKey> FilteredKeys =>
|
||||
string.IsNullOrWhiteSpace(_search)
|
||||
? _keys
|
||||
: _keys.Where(k =>
|
||||
k.Name?.Contains(_search, StringComparison.OrdinalIgnoreCase) ?? false);
|
||||
|
||||
protected override async Task OnInitializedAsync()
|
||||
{
|
||||
await LoadDataAsync();
|
||||
|
||||
@@ -32,9 +32,11 @@
|
||||
<label class="form-label small">Site</label>
|
||||
@if (_siteLocked)
|
||||
{
|
||||
<select class="form-select form-select-sm" disabled>
|
||||
<option>@_siteName</option>
|
||||
</select>
|
||||
<input type="text"
|
||||
class="form-control form-control-plaintext form-control-sm"
|
||||
readonly
|
||||
value="@_siteName" />
|
||||
<div class="form-text">Site is locked after creation.</div>
|
||||
}
|
||||
else
|
||||
{
|
||||
@@ -52,13 +54,20 @@
|
||||
<input type="text" class="form-control form-control-sm" @bind="_formName" />
|
||||
</div>
|
||||
|
||||
<h6 class="text-muted mt-3">Primary endpoint</h6>
|
||||
<OpcUaEndpointEditor Title="Primary Endpoint"
|
||||
IdPrefix="primary"
|
||||
Config="_primaryConfig"
|
||||
IsLegacy="_primaryIsLegacy"
|
||||
Errors="_primaryErrors" />
|
||||
|
||||
<h6 class="text-muted border-bottom pb-1 mt-3">Backup Endpoint</h6>
|
||||
<h6 class="text-muted mt-3">
|
||||
Backup endpoint
|
||||
@if (!_showBackup)
|
||||
{
|
||||
<span class="badge bg-light text-muted border ms-2">Optional</span>
|
||||
}
|
||||
</h6>
|
||||
@if (!_showBackup)
|
||||
{
|
||||
<div class="mb-3">
|
||||
@@ -77,7 +86,7 @@
|
||||
<label class="form-label small">Failover Retry Count</label>
|
||||
<input type="number" class="form-control form-control-sm" style="max-width: 120px;"
|
||||
min="1" max="20" @bind="_formFailoverRetryCount" />
|
||||
<div class="form-text">Retries on active endpoint before switching to backup (default: 3)</div>
|
||||
<div class="form-text">Retries before failing over to backup endpoint.</div>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<button type="button" class="btn btn-outline-danger btn-sm"
|
||||
|
||||
@@ -8,8 +8,35 @@
|
||||
@inject NavigationManager NavigationManager
|
||||
|
||||
<div class="container-fluid mt-3">
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<h4 class="mb-0">Connections</h4>
|
||||
<div class="d-flex gap-2">
|
||||
<div class="dropdown">
|
||||
<button class="btn btn-outline-secondary btn-sm dropdown-toggle"
|
||||
data-bs-toggle="dropdown">
|
||||
Bulk actions
|
||||
</button>
|
||||
<ul class="dropdown-menu dropdown-menu-end">
|
||||
<li>
|
||||
<button class="dropdown-item" @onclick="() => _tree?.ExpandAll()">
|
||||
Expand all
|
||||
</button>
|
||||
</li>
|
||||
<li>
|
||||
<button class="dropdown-item" @onclick="() => _tree?.CollapseAll()">
|
||||
Collapse all
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<button class="btn btn-primary btn-sm"
|
||||
disabled="@(!HasSiteSelected)"
|
||||
@onclick="OnAddConnectionClicked">+ Connection</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<ToastNotification @ref="_toast" />
|
||||
<ConfirmDialog @ref="_confirmDialog" />
|
||||
<ConfirmDialog @ref="_confirmDialog" ConfirmButtonClass="btn-danger" />
|
||||
|
||||
@if (_loading)
|
||||
{
|
||||
@@ -21,21 +48,17 @@
|
||||
}
|
||||
else
|
||||
{
|
||||
<h6 class="mb-2">Connections</h6>
|
||||
<div class="d-flex align-items-center mb-2 gap-2">
|
||||
<input type="text" class="form-control form-control-sm" style="max-width: 320px;"
|
||||
<div class="mb-3" style="max-width: 320px;">
|
||||
<input type="text" class="form-control form-control-sm"
|
||||
placeholder="Search sites or connections..."
|
||||
@bind="_searchText" @bind:event="oninput" @bind:after="OnSearchChanged" />
|
||||
<div class="btn-group btn-group-sm">
|
||||
<button class="btn btn-outline-secondary"
|
||||
disabled="@(!HasSiteSelected)"
|
||||
@onclick="OnAddConnectionClicked">+ Connection</button>
|
||||
<button class="btn btn-outline-secondary" @onclick="LoadDataAsync">Refresh</button>
|
||||
<button class="btn btn-outline-secondary" @onclick="() => _tree?.ExpandAll()">Expand</button>
|
||||
<button class="btn btn-outline-secondary" @onclick="() => _tree?.CollapseAll()">Collapse</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@if (!string.IsNullOrWhiteSpace(_searchText) && _matchKeys.Count == 0 && _treeRoots.Count > 0)
|
||||
{
|
||||
<p class="text-muted small">No connections match the filter.</p>
|
||||
}
|
||||
|
||||
<TreeView @ref="_tree" TItem="DcTreeNode" Items="_treeRoots"
|
||||
ChildrenSelector="n => n.Children"
|
||||
HasChildrenSelector="n => n.Children.Count > 0"
|
||||
@@ -58,6 +81,41 @@
|
||||
<span class="tv-label" style="@labelStyle">@node.Label</span>
|
||||
<span class="badge bg-info ms-2">@node.Connection!.Protocol</span>
|
||||
}
|
||||
<span class="tv-meta">
|
||||
<div class="dropdown dc-node-actions" @onclick:stopPropagation="true">
|
||||
<button type="button"
|
||||
class="btn btn-link btn-sm p-0 dc-kebab"
|
||||
data-bs-toggle="dropdown"
|
||||
aria-label="@($"More actions for {node.Label}")">⋮</button>
|
||||
<ul class="dropdown-menu dropdown-menu-end">
|
||||
@if (node.Kind == DcNodeKind.Site)
|
||||
{
|
||||
<li>
|
||||
<button class="dropdown-item"
|
||||
@onclick="() => AddConnectionForSite(node.SiteId!.Value)">
|
||||
Add Connection here
|
||||
</button>
|
||||
</li>
|
||||
}
|
||||
else
|
||||
{
|
||||
<li>
|
||||
<button class="dropdown-item"
|
||||
@onclick='() => NavigationManager.NavigateTo($"/admin/connections/{node.Connection!.Id}/edit")'>
|
||||
Edit
|
||||
</button>
|
||||
</li>
|
||||
<li><hr class="dropdown-divider" /></li>
|
||||
<li>
|
||||
<button class="dropdown-item text-danger"
|
||||
@onclick="() => DeleteConnection(node.Connection!)">
|
||||
Delete
|
||||
</button>
|
||||
</li>
|
||||
}
|
||||
</ul>
|
||||
</div>
|
||||
</span>
|
||||
</NodeContent>
|
||||
<ContextMenu Context="node">
|
||||
@if (node.Kind == DcNodeKind.Site)
|
||||
@@ -91,6 +149,24 @@
|
||||
}
|
||||
</div>
|
||||
|
||||
<style>
|
||||
/* Kebab visible-on-hover for tree nodes; always visible at small sizes for touch. */
|
||||
.dc-node-actions .dc-kebab {
|
||||
opacity: 0;
|
||||
line-height: 1;
|
||||
padding: 0 0.25rem !important;
|
||||
color: var(--bs-secondary-color);
|
||||
}
|
||||
.tv-row:hover .dc-node-actions .dc-kebab,
|
||||
.dc-node-actions.show .dc-kebab,
|
||||
.dc-node-actions .dc-kebab:focus {
|
||||
opacity: 1;
|
||||
}
|
||||
@@media (max-width: 768px) {
|
||||
.dc-node-actions .dc-kebab { opacity: 1; }
|
||||
}
|
||||
</style>
|
||||
|
||||
@code {
|
||||
record DcTreeNode(string Key, string Label, DcNodeKind Kind, List<DcTreeNode> Children,
|
||||
int? SiteId = null, DataConnection? Connection = null);
|
||||
|
||||
@@ -1,24 +1,28 @@
|
||||
@page "/admin/ldap-mappings/create"
|
||||
@page "/admin/ldap-mappings/{Id:int}/edit"
|
||||
@using ScadaLink.Commons.Entities.Security
|
||||
@using ScadaLink.Commons.Entities.Sites
|
||||
@using ScadaLink.Commons.Interfaces.Repositories
|
||||
@using ScadaLink.Security
|
||||
@attribute [Authorize(Policy = AuthorizationPolicies.RequireAdmin)]
|
||||
@inject ISecurityRepository SecurityRepository
|
||||
@inject ISiteRepository SiteRepository
|
||||
@inject NavigationManager NavigationManager
|
||||
|
||||
<div class="container-fluid mt-3">
|
||||
<div class="mb-3">
|
||||
<button class="btn btn-outline-secondary btn-sm" @onclick="GoBack">
|
||||
<button class="btn btn-outline-secondary btn-sm"
|
||||
aria-label="Back to LDAP mappings"
|
||||
@onclick="GoBack">
|
||||
← Back
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<ConfirmDialog @ref="_confirmDialog" />
|
||||
<ConfirmDialog @ref="_confirmDialog" ConfirmButtonClass="btn-danger" />
|
||||
|
||||
<div class="card mb-3">
|
||||
<div class="card-body">
|
||||
<h6 class="card-title">@(IsEditMode ? "Edit LDAP Mapping" : "Add LDAP Mapping")</h6>
|
||||
<h5 class="card-title">Mapping</h5>
|
||||
<div class="mb-2">
|
||||
<label class="form-label small">LDAP Group Name</label>
|
||||
<input type="text" class="form-control form-control-sm" @bind="_formGroupName" />
|
||||
@@ -31,6 +35,7 @@
|
||||
<option value="Design">Design</option>
|
||||
<option value="Deployment">Deployment</option>
|
||||
</select>
|
||||
<div class="form-text">Deployment role: configure site scope below after saving.</div>
|
||||
</div>
|
||||
@if (_formError != null)
|
||||
{
|
||||
@@ -43,56 +48,60 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@if (IsEditMode && _formRole.Equals("Deployment", StringComparison.OrdinalIgnoreCase))
|
||||
{
|
||||
<div class="card mb-3">
|
||||
<div class="card-body">
|
||||
<h6 class="card-title">Site Scope Rules</h6>
|
||||
<div class="card mb-3">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title">Site Scope Rules</h5>
|
||||
|
||||
@if (!IsEditMode)
|
||||
{
|
||||
<p class="text-muted small mb-0">Save the mapping first to configure site scope.</p>
|
||||
}
|
||||
else
|
||||
{
|
||||
@if (_scopeRules.Count > 0)
|
||||
{
|
||||
<table class="table table-sm table-striped table-hover mb-3">
|
||||
<thead class="table-dark">
|
||||
<tr>
|
||||
<th>ID</th>
|
||||
<th>Site ID</th>
|
||||
<th style="width: 120px;">Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@foreach (var rule in _scopeRules)
|
||||
{
|
||||
<tr>
|
||||
<td>@rule.Id</td>
|
||||
<td>@rule.SiteId</td>
|
||||
<td>
|
||||
<button class="btn btn-outline-danger btn-sm py-0 px-1"
|
||||
@onclick="() => DeleteScopeRule(rule)">Delete</button>
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
</tbody>
|
||||
</table>
|
||||
<div class="d-flex flex-wrap gap-2 mb-3">
|
||||
@foreach (var rule in _scopeRules)
|
||||
{
|
||||
var siteName = _siteLookup.GetValueOrDefault(rule.SiteId)?.Name ?? $"Site {rule.SiteId}";
|
||||
<span class="badge bg-info text-dark d-inline-flex align-items-center">
|
||||
@siteName
|
||||
<button type="button"
|
||||
class="btn-close btn-close-white ms-2"
|
||||
style="font-size: 0.6rem;"
|
||||
aria-label="@($"Remove scope rule for {siteName}")"
|
||||
@onclick="() => DeleteScopeRule(rule)"></button>
|
||||
</span>
|
||||
}
|
||||
</div>
|
||||
}
|
||||
else
|
||||
{
|
||||
<p class="text-muted small mb-3">All sites (no restrictions)</p>
|
||||
}
|
||||
|
||||
<div class="mb-2">
|
||||
<label class="form-label small">Site ID</label>
|
||||
<input type="number" class="form-control form-control-sm" @bind="_scopeRuleSiteId" />
|
||||
<div class="row g-2 align-items-end">
|
||||
<div class="col-auto">
|
||||
<label class="form-label small">Site</label>
|
||||
<select class="form-select form-select-sm" @bind="_scopeRuleSiteId">
|
||||
<option value="0">Select site...</option>
|
||||
@foreach (var site in _sites)
|
||||
{
|
||||
<option value="@site.Id">@site.Name</option>
|
||||
}
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<button class="btn btn-success btn-sm" @onclick="AddScopeRule">Add scope rule</button>
|
||||
</div>
|
||||
</div>
|
||||
@if (_scopeRuleError != null)
|
||||
{
|
||||
<div class="text-danger small mt-2">@_scopeRuleError</div>
|
||||
}
|
||||
<div class="mt-3">
|
||||
<button class="btn btn-success btn-sm" @onclick="AddScopeRule">Add</button>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@code {
|
||||
@@ -106,6 +115,8 @@
|
||||
private string? _formError;
|
||||
|
||||
private List<SiteScopeRule> _scopeRules = new();
|
||||
private List<Site> _sites = new();
|
||||
private Dictionary<int, Site> _siteLookup = new();
|
||||
private int _scopeRuleSiteId;
|
||||
private string? _scopeRuleError;
|
||||
|
||||
@@ -113,6 +124,9 @@
|
||||
|
||||
protected override async Task OnInitializedAsync()
|
||||
{
|
||||
_sites = (await SiteRepository.GetAllSitesAsync()).ToList();
|
||||
_siteLookup = _sites.ToDictionary(s => s.Id);
|
||||
|
||||
if (Id.HasValue)
|
||||
{
|
||||
_editingMapping = await SecurityRepository.GetMappingByIdAsync(Id.Value);
|
||||
@@ -174,7 +188,7 @@
|
||||
|
||||
if (_scopeRuleSiteId <= 0)
|
||||
{
|
||||
_scopeRuleError = "Site ID must be a positive number.";
|
||||
_scopeRuleError = "Select a site to add a scope rule.";
|
||||
return;
|
||||
}
|
||||
|
||||
@@ -194,9 +208,10 @@
|
||||
|
||||
private async Task DeleteScopeRule(SiteScopeRule rule)
|
||||
{
|
||||
var siteName = _siteLookup.GetValueOrDefault(rule.SiteId)?.Name ?? $"Site {rule.SiteId}";
|
||||
var confirmed = await _confirmDialog.ShowAsync(
|
||||
$"Delete scope rule for Site {rule.SiteId}? This cannot be undone.",
|
||||
"Delete Scope Rule");
|
||||
$"Remove scope rule for '{siteName}'?",
|
||||
"Remove Scope Rule");
|
||||
if (!confirmed) return;
|
||||
|
||||
try
|
||||
|
||||
@@ -22,61 +22,75 @@
|
||||
}
|
||||
else
|
||||
{
|
||||
@* Mappings table *@
|
||||
<table class="table table-sm table-striped table-hover">
|
||||
<thead class="table-dark">
|
||||
<tr>
|
||||
<th>ID</th>
|
||||
<th>LDAP Group Name</th>
|
||||
<th>Role</th>
|
||||
<th>Site Scope Rules</th>
|
||||
<th style="width: 200px;">Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@if (_mappings.Count == 0)
|
||||
{
|
||||
<tr>
|
||||
<td colspan="5" class="text-muted text-center">No mappings configured.</td>
|
||||
</tr>
|
||||
}
|
||||
@foreach (var mapping in _mappings)
|
||||
{
|
||||
<tr>
|
||||
<td>@mapping.Id</td>
|
||||
<td>@mapping.LdapGroupName</td>
|
||||
<td><span class="badge bg-secondary">@mapping.Role</span></td>
|
||||
<td>
|
||||
@{
|
||||
var rules = _scopeRules.GetValueOrDefault(mapping.Id);
|
||||
}
|
||||
@if (rules != null && rules.Count > 0)
|
||||
{
|
||||
@foreach (var rule in rules)
|
||||
{
|
||||
<span class="badge bg-info text-dark me-1">Site @rule.SiteId</span>
|
||||
}
|
||||
}
|
||||
else
|
||||
{
|
||||
<span class="text-muted small">All sites</span>
|
||||
}
|
||||
@if (mapping.Role.Equals("Deployment", StringComparison.OrdinalIgnoreCase))
|
||||
{
|
||||
<span class="text-muted small ms-2">(manage on edit page)</span>
|
||||
}
|
||||
</td>
|
||||
<td>
|
||||
<button class="btn btn-outline-primary btn-sm py-0 px-1 me-1"
|
||||
@onclick='() => NavigationManager.NavigateTo($"/admin/ldap-mappings/{mapping.Id}/edit")'>Edit</button>
|
||||
<button class="btn btn-outline-danger btn-sm py-0 px-1"
|
||||
@onclick="() => DeleteMapping(mapping.Id)">Delete</button>
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
</tbody>
|
||||
</table>
|
||||
<div class="mb-3" style="max-width: 320px;">
|
||||
<input class="form-control form-control-sm"
|
||||
placeholder="Filter by name, LDAP group, or role…"
|
||||
@bind="_search" @bind:event="oninput" />
|
||||
</div>
|
||||
|
||||
@if (_mappings.Count == 0)
|
||||
{
|
||||
<p class="text-muted text-center">No mappings configured.</p>
|
||||
}
|
||||
else if (!FilteredMappings.Any())
|
||||
{
|
||||
<p class="text-muted small">No mappings match the filter.</p>
|
||||
}
|
||||
else
|
||||
{
|
||||
<table class="table table-sm table-striped table-hover">
|
||||
<thead class="table-dark">
|
||||
<tr>
|
||||
<th>ID</th>
|
||||
<th>LDAP Group Name</th>
|
||||
<th>Role</th>
|
||||
<th>Site Scope</th>
|
||||
<th style="width: 160px;">Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@foreach (var mapping in FilteredMappings)
|
||||
{
|
||||
var rules = _scopeRules.GetValueOrDefault(mapping.Id);
|
||||
var ruleCount = rules?.Count ?? 0;
|
||||
<tr @key="mapping.Id">
|
||||
<td>@mapping.Id</td>
|
||||
<td>@mapping.LdapGroupName</td>
|
||||
<td><span class="badge bg-secondary">@mapping.Role</span></td>
|
||||
<td>
|
||||
@if (ruleCount > 0)
|
||||
{
|
||||
<span class="badge bg-info text-dark">@ruleCount rule(s)</span>
|
||||
}
|
||||
else
|
||||
{
|
||||
<span class="text-muted small">All sites</span>
|
||||
}
|
||||
</td>
|
||||
<td>
|
||||
<div class="d-flex gap-1">
|
||||
<button class="btn btn-outline-primary btn-sm py-0 px-2"
|
||||
@onclick='() => NavigationManager.NavigateTo($"/admin/ldap-mappings/{mapping.Id}/edit")'>Edit</button>
|
||||
<div class="dropdown">
|
||||
<button class="btn btn-outline-secondary btn-sm py-0 px-2"
|
||||
data-bs-toggle="dropdown"
|
||||
aria-label="@($"More actions for {mapping.LdapGroupName}")">⋮</button>
|
||||
<ul class="dropdown-menu dropdown-menu-end">
|
||||
<li>
|
||||
<button class="dropdown-item text-danger"
|
||||
@onclick="() => DeleteMapping(mapping.Id)">
|
||||
Delete
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
</tbody>
|
||||
</table>
|
||||
}
|
||||
}
|
||||
</div>
|
||||
|
||||
@@ -85,6 +99,14 @@
|
||||
private Dictionary<int, List<SiteScopeRule>> _scopeRules = new();
|
||||
private bool _loading = true;
|
||||
private string? _errorMessage;
|
||||
private string _search = string.Empty;
|
||||
|
||||
private IEnumerable<LdapGroupMapping> FilteredMappings =>
|
||||
string.IsNullOrWhiteSpace(_search)
|
||||
? _mappings
|
||||
: _mappings.Where(m =>
|
||||
(m.LdapGroupName?.Contains(_search, StringComparison.OrdinalIgnoreCase) ?? false) ||
|
||||
(m.Role?.Contains(_search, StringComparison.OrdinalIgnoreCase) ?? false));
|
||||
|
||||
protected override async Task OnInitializedAsync()
|
||||
{
|
||||
|
||||
@@ -60,10 +60,12 @@ public class DataConnectionFormTests : BunitContext
|
||||
.First(i => i.GetAttribute("placeholder")?.StartsWith("opc.tcp") == true)
|
||||
.Change("not-a-url");
|
||||
|
||||
// Name field (the first text input that is NOT the OPC URL)
|
||||
// Name field (the first editable text input that is NOT the OPC URL).
|
||||
// Site renders as a readonly plaintext input when locked — skip it.
|
||||
cut.FindAll("input[type='text']")
|
||||
.First(i => i.GetAttribute("placeholder") is null
|
||||
|| !i.GetAttribute("placeholder")!.StartsWith("opc.tcp"))
|
||||
.First(i => !i.HasAttribute("readonly")
|
||||
&& (i.GetAttribute("placeholder") is null
|
||||
|| !i.GetAttribute("placeholder")!.StartsWith("opc.tcp")))
|
||||
.Change("My Connection");
|
||||
|
||||
await cut.FindAll("button")
|
||||
@@ -82,10 +84,11 @@ public class DataConnectionFormTests : BunitContext
|
||||
|
||||
var cut = RenderForCreateSite(1);
|
||||
|
||||
// Name
|
||||
// Name (skip readonly Site plaintext input)
|
||||
cut.FindAll("input[type='text']")
|
||||
.First(i => i.GetAttribute("placeholder") is null
|
||||
|| !i.GetAttribute("placeholder")!.StartsWith("opc.tcp"))
|
||||
.First(i => !i.HasAttribute("readonly")
|
||||
&& (i.GetAttribute("placeholder") is null
|
||||
|| !i.GetAttribute("placeholder")!.StartsWith("opc.tcp")))
|
||||
.Change("PLC-1");
|
||||
// Endpoint URL
|
||||
cut.FindAll("input[type='text']")
|
||||
|
||||
Reference in New Issue
Block a user