mirror of
https://github.com/LibreQoE/LibreQoS.git
synced 2026-11-02 20:30:15 -06:00
Fix shaped devices editor paging and UI (FIXES #919)
This commit is contained in:
1 parent
9edad2f145
commit
6baebeab5d
2 files changed
+920
-484
No files matched your search
File diff suppressed because it is too large.
Load diff
@@ -6,12 +6,153 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<button id="btnSaveDevices" class="btn btn-outline-primary mb-3">
|
||||
<i class="fa fa-save"></i> Save Changes
|
||||
</button>
|
||||
<div id="shapedDeviceTable"></div>
|
||||
<div class="card">
|
||||
<div class="card-header d-flex flex-wrap align-items-center justify-content-between gap-3">
|
||||
<div>
|
||||
<h5 class="mb-0">Shaped Devices</h5>
|
||||
<div class="small text-body-secondary" id="sdSummary">Loading devices...</div>
|
||||
</div>
|
||||
<div class="d-flex flex-wrap gap-2">
|
||||
<button id="btnAddDevice" class="btn btn-primary">
|
||||
<i class="fa fa-plus"></i> Add Device
|
||||
</button>
|
||||
<button id="btnSaveDevices" class="btn btn-outline-primary">
|
||||
<i class="fa fa-save"></i> Save Changes
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="row g-2 align-items-center mb-3">
|
||||
<div class="col-12 col-lg-6">
|
||||
<div class="input-group">
|
||||
<span class="input-group-text"><i class="fa fa-search"></i></span>
|
||||
<input id="sdSearch" type="text" class="form-control" placeholder="Search device/circuit/parent/MAC/IP...">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 col-md-4 col-lg-3">
|
||||
<select id="sdPageSize" class="form-select">
|
||||
<option value="25" selected>25 rows</option>
|
||||
<option value="50">50 rows</option>
|
||||
<option value="100">100 rows</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="alert alert-info py-2 small mb-3">
|
||||
SQM overrides can be set per direction. Leave a side blank to use the global default; set to "none" to disable that side.
|
||||
</div>
|
||||
|
||||
<nav class="mt-3" aria-label="Shaped devices pages (top)">
|
||||
<ul id="sdPaginationTop" class="pagination pagination-sm mb-0"></ul>
|
||||
</nav>
|
||||
|
||||
<div id="sdTableContainer" class="table-responsive" style="max-height: 65vh; overflow-y: auto;">
|
||||
<div class="text-center py-5">
|
||||
<div class="spinner-border" role="status">
|
||||
<span class="visually-hidden">Loading...</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<nav class="mt-3" aria-label="Shaped devices pages">
|
||||
<ul id="sdPagination" class="pagination pagination-sm mb-0"></ul>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal fade" id="sdEditModal" tabindex="-1" aria-labelledby="sdEditModalLabel" aria-hidden="true">
|
||||
<div class="modal-dialog modal-lg modal-dialog-scrollable">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="sdEditModalLabel">Edit Device</h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<form id="sdEditForm">
|
||||
<div class="row g-3">
|
||||
<div class="col-md-6">
|
||||
<label for="sdModalCircuitId" class="form-label">Circuit ID</label>
|
||||
<input type="text" class="form-control" id="sdModalCircuitId">
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label for="sdModalCircuitName" class="form-label">Circuit Name</label>
|
||||
<input type="text" class="form-control" id="sdModalCircuitName">
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label for="sdModalDeviceId" class="form-label">Device ID</label>
|
||||
<input type="text" class="form-control" id="sdModalDeviceId">
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label for="sdModalDeviceName" class="form-label">Device Name</label>
|
||||
<input type="text" class="form-control" id="sdModalDeviceName">
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label for="sdModalParentNode" class="form-label">Parent Node</label>
|
||||
<select class="form-select" id="sdModalParentNode"></select>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label for="sdModalMac" class="form-label">MAC</label>
|
||||
<input type="text" class="form-control" id="sdModalMac">
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label for="sdModalIpv4" class="form-label">IPv4 (one per line)</label>
|
||||
<textarea class="form-control" id="sdModalIpv4" rows="3" placeholder="192.168.0.1/32"></textarea>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label for="sdModalIpv6" class="form-label">IPv6 (one per line)</label>
|
||||
<textarea class="form-control" id="sdModalIpv6" rows="3" placeholder="2001:db8::1/128"></textarea>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label for="sdModalDownloadMin" class="form-label">Download Min Mbps</label>
|
||||
<input type="number" step="0.1" class="form-control" id="sdModalDownloadMin">
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label for="sdModalUploadMin" class="form-label">Upload Min Mbps</label>
|
||||
<input type="number" step="0.1" class="form-control" id="sdModalUploadMin">
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label for="sdModalDownloadMax" class="form-label">Download Max Mbps</label>
|
||||
<input type="number" step="0.1" class="form-control" id="sdModalDownloadMax">
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label for="sdModalUploadMax" class="form-label">Upload Max Mbps</label>
|
||||
<input type="number" step="0.1" class="form-control" id="sdModalUploadMax">
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label for="sdModalSqmDown" class="form-label">SQM Down</label>
|
||||
<select class="form-select" id="sdModalSqmDown">
|
||||
<option value="">(default)</option>
|
||||
<option value="cake">cake</option>
|
||||
<option value="fq_codel">fq_codel</option>
|
||||
<option value="none">none</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label for="sdModalSqmUp" class="form-label">SQM Up</label>
|
||||
<select class="form-select" id="sdModalSqmUp">
|
||||
<option value="">(default)</option>
|
||||
<option value="cake">cake</option>
|
||||
<option value="fq_codel">fq_codel</option>
|
||||
<option value="none">none</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<label for="sdModalComment" class="form-label">Comment</label>
|
||||
<textarea class="form-control" id="sdModalComment" rows="2"></textarea>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
|
||||
<button type="button" class="btn btn-primary" id="sdModalSave">Save changes</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
Reference in new issue
Block a user