This is an automated email from the ASF dual-hosted git repository.
smengcl pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/ozone.git
The following commit(s) were added to refs/heads/master by this push:
new 735bae3088b HDDS-15007. SCM Web UI search box should filter the entire
datanodes set, not just the displayed rows (#10076)
735bae3088b is described below
commit 735bae3088b4d745bce06091207fad282d6858c0
Author: Navink <[email protected]>
AuthorDate: Tue May 12 11:17:49 2026 +0530
HDDS-15007. SCM Web UI search box should filter the entire datanodes set,
not just the displayed rows (#10076)
---
.../main/resources/webapps/scm/scm-overview.html | 4 +-
.../src/main/resources/webapps/scm/scm.js | 73 ++++++++++++++--------
2 files changed, 50 insertions(+), 27 deletions(-)
diff --git
a/hadoop-hdds/server-scm/src/main/resources/webapps/scm/scm-overview.html
b/hadoop-hdds/server-scm/src/main/resources/webapps/scm/scm-overview.html
index bb2f25a1c32..dc73ebc4706 100644
--- a/hadoop-hdds/server-scm/src/main/resources/webapps/scm/scm-overview.html
+++ b/hadoop-hdds/server-scm/src/main/resources/webapps/scm/scm-overview.html
@@ -230,7 +230,7 @@ <h2>Node Status</h2>
</select>
</div>
<div class="col-md-6 text-right">
- <label>Search: </label> <input type="text" ng-model="search">
+ <label>Search: </label> <input type="text" ng-model="search"
ng-change="applyGlobalSearch()" ng-model-options="{ debounce: 300 }">
</div>
</div>
<table class="table table-bordered table-striped col-md-6">
@@ -255,7 +255,7 @@ <h2>Node Status</h2>
</tr>
</thead>
<tbody>
- <tr ng-repeat="typestat in
nodeStatus|filter:search|orderBy:columnName:reverse">
+ <tr ng-repeat="typestat in nodeStatus|orderBy:columnName:reverse">
<td ng-switch="typestat.port > 0">
<span ng-switch-when="true">
<a
href="{{typestat.protocol}}://{{typestat.hostname}}:{{typestat.port}}"
target="_blank">{{typestat.hostname}}</a>
diff --git a/hadoop-hdds/server-scm/src/main/resources/webapps/scm/scm.js
b/hadoop-hdds/server-scm/src/main/resources/webapps/scm/scm.js
index 1e44826f980..27ecc7f8155 100644
--- a/hadoop-hdds/server-scm/src/main/resources/webapps/scm/scm.js
+++ b/hadoop-hdds/server-scm/src/main/resources/webapps/scm/scm.js
@@ -55,9 +55,10 @@
$scope.reverse = false;
$scope.columnName = "hostname";
let nodeStatusCopy = [];
+ $scope.filteredNodes = [];
$scope.RecordsToDisplay = "10";
$scope.currentPage = 1;
- $scope.lastIndex = 0;
+ $scope.lastIndex = 1;
$scope.statistics = {
nodes : {
usages : {
@@ -161,10 +162,10 @@
}
});
- nodeStatusCopy = [...$scope.nodeStatus];
- $scope.totalItems = nodeStatusCopy.length;
- $scope.lastIndex = Math.ceil(nodeStatusCopy.length /
$scope.RecordsToDisplay);
- $scope.nodeStatus = nodeStatusCopy.slice(0,
$scope.RecordsToDisplay);
+ nodeStatusCopy = [...$scope.nodeStatus];
+ $scope.filteredNodes = [...nodeStatusCopy];
+ $scope.totalItems = $scope.filteredNodes.length;
+ $scope.UpdateRecordsToShow();
$scope.formatValue = function(value) {
if (value && value.includes(';')) {
@@ -244,28 +245,50 @@
$scope.statistics.containers.health.open_without_pipeline
= ctrl.scmcontainermanager.OpenContainersWithoutPipeline;
});
- /*if option is 'All' display all records else display specified
record on page*/
- $scope.UpdateRecordsToShow = () => {
- if($scope.RecordsToDisplay == 'All') {
- $scope.lastIndex = 1;
- $scope.nodeStatus = nodeStatusCopy;
+ /* Global Search Logic */
+ $scope.applyGlobalSearch = function() {
+ if (!$scope.search || $scope.search.trim() === "") {
+ // Reset to full list if search is empty
+ $scope.filteredNodes = [...nodeStatusCopy];
} else {
- $scope.lastIndex = Math.ceil(nodeStatusCopy.length /
$scope.RecordsToDisplay);
- $scope.nodeStatus = nodeStatusCopy.slice(0,
$scope.RecordsToDisplay);
- }
- $scope.currentPage = 1;
- }
- /* Page Slicing logic */
- $scope.handlePagination = (pageIndex, isDisabled) => {
- if(!isDisabled && $scope.RecordsToDisplay != 'All') {
- pageIndex = parseInt(pageIndex);
- let startIndex = 0, endIndex = 0;
- $scope.currentPage = pageIndex;
- startIndex = ($scope.currentPage - 1) *
parseInt($scope.RecordsToDisplay);
- endIndex = startIndex + parseInt($scope.RecordsToDisplay);
- $scope.nodeStatus = nodeStatusCopy.slice(startIndex,
endIndex);
+ let query = $scope.search.toLowerCase();
+ // Dynamically search across all properties in the node
object
+ $scope.filteredNodes =
nodeStatusCopy.filter(function(node) {
+ return Object.values(node).some(function(val) {
+ return val !== null && val !== undefined
+ && val.toString().toLowerCase().includes(query);
+ });
+ });
}
- }
+ $scope.totalItems = $scope.filteredNodes.length;
+ $scope.UpdateRecordsToShow(); // Re-calculate pagination
+ };
+ /* If option is 'All' display all records, else display specified
records on page */
+ $scope.UpdateRecordsToShow = () => {
+ if ($scope.RecordsToDisplay === 'All') {
+ $scope.lastIndex = 1;
+ $scope.nodeStatus = $scope.filteredNodes;
+ } else {
+ let limit = parseInt($scope.RecordsToDisplay);
+ // Use Math.max(1, ...) to ensure lastIndex never drops
to 0.
+ // This prevents the "Next" button from remaining active
on empty search results.
+ $scope.lastIndex = Math.max(1,
Math.ceil($scope.filteredNodes.length / limit));
+ $scope.nodeStatus = $scope.filteredNodes.slice(0, limit);
+ }
+ $scope.currentPage = 1;
+ };
+ /* Page Slicing logic */
+ $scope.handlePagination = (pageIndex, isDisabled) => {
+ if (!isDisabled && $scope.RecordsToDisplay !== 'All') {
+ // Force strict math with parseInt
+ pageIndex = parseInt(pageIndex);
+ let limit = parseInt($scope.RecordsToDisplay);
+ $scope.currentPage = pageIndex;
+ let startIndex = ($scope.currentPage - 1) * limit;
+ let endIndex = startIndex + limit;
+ $scope.nodeStatus =
$scope.filteredNodes.slice(startIndex, endIndex);
+ }
+ }
/*column sort logic*/
$scope.columnSort = (colName) => {
$scope.columnName = colName;
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
