From 97dc846d65af768a8c92158d2a53218fabc01e97 Mon Sep 17 00:00:00 2001 From: magicsquirrel <1748670423@qq.com> Date: Mon, 25 Jul 2022 17:04:51 +0800 Subject: [PATCH] Connect page pagination added. --- .../dashboard/model/connect/WorkerInfo.java | 30 ++-- src/main/resources/static/src/connect.js | 135 ++++++++++++++---- .../resources/static/view/pages/connect.html | 30 ++-- 3 files changed, 139 insertions(+), 56 deletions(-) diff --git a/src/main/java/org/apache/rocketmq/dashboard/model/connect/WorkerInfo.java b/src/main/java/org/apache/rocketmq/dashboard/model/connect/WorkerInfo.java index bb7c1be..f91740d 100644 --- a/src/main/java/org/apache/rocketmq/dashboard/model/connect/WorkerInfo.java +++ b/src/main/java/org/apache/rocketmq/dashboard/model/connect/WorkerInfo.java @@ -12,15 +12,15 @@ public class WorkerInfo { private String namesrvAddr; - private List workingConnectors; + private List allocatedConnectors; - private List existingTasks; + private List allocatedTasks; - public WorkerInfo(String ipAddr, String namesrvAddr, List workingConnectors, List existingTasks) { + public WorkerInfo(String ipAddr, String namesrvAddr, List allocatedConnectors, List allocatedTasks) { this.ipAddr = ipAddr; this.namesrvAddr = namesrvAddr; - this.workingConnectors = workingConnectors; - this.existingTasks = existingTasks; + this.allocatedConnectors = allocatedConnectors; + this.allocatedTasks = allocatedTasks; } public WorkerInfo() { @@ -46,20 +46,20 @@ public class WorkerInfo { this.namesrvAddr = namesrvAddr; } - public List getWorkingConnectors() { - return workingConnectors; + public List getAllocatedConnectors() { + return allocatedConnectors; } - public void setWorkingConnectors(List workingConnectors) { - this.workingConnectors = workingConnectors; + public void setAllocatedConnectors(List allocatedConnectors) { + this.allocatedConnectors = allocatedConnectors; } - public List getExistingTasks() { - return existingTasks; + public List getAllocatedTasks() { + return allocatedTasks; } - public void setExistingTasks(List existingTasks) { - this.existingTasks = existingTasks; + public void setAllocatedTasks(List allocatedTasks) { + this.allocatedTasks = allocatedTasks; } @Override @@ -67,8 +67,8 @@ public class WorkerInfo { return "WorkerInfo{" + "ipAddr='" + ipAddr + '\'' + ", namesrvAddr='" + namesrvAddr + '\'' + - ", workingConnectors=" + workingConnectors + - ", existingTasks=" + existingTasks + + ", workingConnectors=" + allocatedConnectors + + ", existingTasks=" + allocatedTasks + '}'; } } diff --git a/src/main/resources/static/src/connect.js b/src/main/resources/static/src/connect.js index 965f784..f0ae13f 100644 --- a/src/main/resources/static/src/connect.js +++ b/src/main/resources/static/src/connect.js @@ -19,10 +19,78 @@ var module = app; module.controller('connectController', ['$scope', 'ngDialog', '$http', 'Notification', function ($scope, ngDialog, $http, Notification) { $scope.allTopicList = []; - $scope.allWorkerList = []; $scope.selectedTopic = []; - $scope.key = ""; + $scope.connectorList = []; + $scope.workerTaskList = []; + $scope.allWorkerList = []; + + $scope.respConnectors = []; + $scope.respTasks = []; + $scope.respWorkers = []; + + $scope.connectorPaginationConf = { + currentPage: 1, + totalItems: 0, + itemsPerPage: 10, + pagesLength: 15, + perPageOptions: [10], + rememberPerPage: 'perPageItems', + onChange: function () { + $scope.queryWorkerConnectorList(this.currentPage, this.totalItems); + } + }; + + $scope.taskPaginationConf = { + currentPage: 1, + totalItems: 0, + itemsPerPage: 10, + pagesLength: 15, + perPageOptions: [10], + rememberPerPage: 'perPageItems', + onChange: function () { + $scope.queryWorkerTaskList(this.currentPage, this.totalItems); + } + }; + + $scope.workerPaginationConf = { + currentPage: 1, + totalItems: 0, + itemsPerPage: 10, + pagesLength: 15, + perPageOptions: [10], + rememberPerPage: 'perPageItems', + onChange: function () { + $scope.queryWorkerList(this.currentPage, this.totalItems); + } + }; + + $scope.queryWorkerConnectorList = function (currentPage, totalItem) { + var perPage = $scope.connectorPaginationConf.itemsPerPage; + var from = (currentPage - 1) * perPage; + var to = (from + perPage) > totalItem ? totalItem : from + perPage; + $scope.connectorList = $scope.respConnectors.slice(from, to); + $scope.connectorPaginationConf.totalItems = totalItem; + + }; + + $scope.queryWorkerTaskList = function (currentPage, totalItem) { + var perPage = $scope.taskPaginationConf.itemsPerPage; + var from = (currentPage - 1) * perPage; + var to = (from + perPage) > totalItem ? totalItem : from + perPage; + $scope.workerTaskList = $scope.respTasks.slice(from, to); + $scope.taskPaginationConf.totalItems = totalItem; + + }; + + $scope.queryWorkerList = function (currentPage, totalItem) { + var perPage = $scope.workerPaginationConf.itemsPerPage; + var from = (currentPage - 1) * perPage; + var to = (from + perPage) > totalItem ? totalItem : from + perPage; + $scope.allWorkerList = $scope.respWorkers.slice(from, to); + $scope.workerPaginationConf.totalItems = totalItem; + + }; function queryTopicName() { $http({ @@ -38,53 +106,58 @@ module.controller('connectController', ['$scope', 'ngDialog', '$http', 'Notifica }); } - function queryWorkerConnectorList() { + + + $scope.showWorkerTaskList = function () { + $http({ + method: "GET", + url: "connect/workerTasks.query", + }).success(function (resp) { + if (resp.status === 0) { + console.log(resp); + + $scope.respTasks = resp.data; + $scope.queryWorkerTaskList($scope.taskPaginationConf.currentPage, $scope.respTasks.length); + + } else { + Notification.error({message: resp.errMsg, delay: 2000}); + } + }); + }; + + $scope.showWorkerConnectorList = function () { $http({ method: "GET", url: "connect/WorkerConnectors.query", }).success(function (resp) { if (resp.status === 0) { console.log(resp); - $scope.messageShowList = resp.data; + $scope.respConnectors = resp.data; + + $scope.queryWorkerConnectorList($scope.connectorPaginationConf.currentPage, $scope.respConnectors.length); } else { Notification.error({message: resp.errMsg, delay: 2000}); } }); - } + }; - function queryWorkerList() { + $scope.showWorkerList = function () { $http({ method: "GET", url: "connect/worker.query", }).success(function (resp) { - if (resp.status == 0) { + if (resp.status === 0) { console.log(resp); - $scope.allWorkerList = resp.data; - $scope.workerTaskList = resp.data; + + $scope.respWorkers = resp.data; + $scope.queryWorkerList($scope.workerPaginationConf.currentPage, $scope.respWorkers.length); + } else { Notification.error({message: resp.errMsg, delay: 2000}); } }); }; - $scope.queryWorkerTaskList = function () { - $http({ - method: "GET", - url: "connect/workerTasks.query", - }).success(function (resp) { - if (resp.status == 0) { - console.log(resp); - $scope.workerTaskList = resp.data; - } else { - Notification.error({message: resp.errMsg, delay: 2000}); - } - }); - }; - - $scope.queryWorkerConnectorList = queryWorkerConnectorList; - - $scope.queryWorkerList = queryWorkerList; - $scope.queryConnectorStatus = function (name) { $http({ @@ -121,7 +194,7 @@ module.controller('connectController', ['$scope', 'ngDialog', '$http', 'Notifica } else { Notification.error({message: resp.errMsg, delay: 2000}); } - queryWorkerConnectorList(); + $scope.showWorkerConnectorList(); }) }; @@ -139,7 +212,7 @@ module.controller('connectController', ['$scope', 'ngDialog', '$http', 'Notifica } else { Notification.error({message: resp.errMsg, delay: 2000}); } - queryWorkerConnectorList(); + $scope.queryWorkerConnectorList(); }) }; @@ -185,7 +258,7 @@ module.controller('connectController', ['$scope', 'ngDialog', '$http', 'Notifica $scope.openCreationDialog = function () { - queryWorkerList(); + $scope.showWorkerList(); queryTopicName(); ngDialog.open({ template: 'connectorCreationDialog', @@ -208,7 +281,7 @@ module.controller('connectController', ['$scope', 'ngDialog', '$http', 'Notifica if (resp.status == 0) { if (resp.data === "success") { Notification.info({message: "success!", delay: 2000}); - queryWorkerConnectorList(); + $scope.queryWorkerConnectorList(); ngDialog.close(this); } else { Notification.error(resp.data); diff --git a/src/main/resources/static/view/pages/connect.html b/src/main/resources/static/view/pages/connect.html index 6836fa5..518b894 100644 --- a/src/main/resources/static/view/pages/connect.html +++ b/src/main/resources/static/view/pages/connect.html @@ -26,7 +26,7 @@ - + @@ -81,7 +81,7 @@ @@ -106,6 +106,7 @@
+ @@ -114,23 +115,19 @@ - - - + - -
Cluster IP Namesrv Addr Operation
{{item.ipAddr}} {{item.namesrvAddr}}
+ @@ -260,6 +258,18 @@ + + + + + + + + + + + +