ocket8888 commented on a change in pull request #4769:
URL: https://github.com/apache/trafficcontrol/pull/4769#discussion_r441160474



##########
File path: 
traffic_portal/app/src/common/modules/table/servers/TableServersController.js
##########
@@ -17,405 +17,633 @@
  * under the License.
  */
 
-var TableServersController = function(servers, $scope, $state, $uibModal, 
$window, dateUtils, locationUtils, serverUtils, cdnService, serverService, 
statusService, propertiesModel, messageModel) {
-
-    let serversTable;
-
-    var getStatuses = function() {
-        statusService.getStatuses()
-            .then(function(result) {
-                $scope.statuses = result;
-            });
-    };
-
-    var queueServerUpdates = function(server) {
-        serverService.queueServerUpdates(server.id)
-            .then(
-                function() {
-                    $scope.refresh();
-                }
-            );
-    };
-
-    var clearServerUpdates = function(server) {
-        serverService.clearServerUpdates(server.id)
-            .then(
-                function() {
-                    $scope.refresh();
-                }
-            );
-    };
-
-    var queueCDNServerUpdates = function(cdnId) {
-        cdnService.queueServerUpdates(cdnId)
-            .then(
-                function() {
-                    $scope.refresh();
-                }
-            );
-    };
-
-    var clearCDNServerUpdates = function(cdnId) {
-        cdnService.clearServerUpdates(cdnId)
-            .then(
-                function() {
-                    $scope.refresh();
-                }
-            );
-    };
-
-    var confirmDelete = function(server) {
-        var params = {
-            title: 'Delete Server: ' + server.hostName,
-            key: server.hostName
-        };
-        var modalInstance = $uibModal.open({
-            templateUrl: 'common/modules/dialog/delete/dialog.delete.tpl.html',
-            controller: 'DialogDeleteController',
-            size: 'md',
-            resolve: {
-                params: function () {
-                    return params;
-                }
-            }
-        });
-        modalInstance.result.then(function() {
-            deleteServer(server);
-        }, function () {
-            // do nothing
-        });
-    };
-
-    var deleteServer = function(server) {
-        serverService.deleteServer(server.id)
-            .then(function(result) {
-                messageModel.setMessages(result.alerts, false);
-                $scope.refresh();
-            });
-    };
-
-    var confirmStatusUpdate = function(server) {
-        var modalInstance = $uibModal.open({
-            templateUrl: 
'common/modules/dialog/select/status/dialog.select.status.tpl.html',
-            controller: 'DialogSelectStatusController',
-            size: 'md',
-            resolve: {
-                server: function() {
-                    return server;
-                },
-                statuses: function() {
-                    return $scope.statuses;
-                }
-            }
-        });
-        modalInstance.result.then(function(status) {
-            updateStatus(status, server);
-        }, function () {
-            // do nothing
-        });
-    };
-
-    var updateStatus = function(status, server) {
-        serverService.updateStatus(server.id, { status: status.id, 
offlineReason: status.offlineReason })
-            .then(
-                function(result) {
-                    messageModel.setMessages(result.data.alerts, false);
-                    $scope.refresh();
-                },
-                function(fault) {
-                    messageModel.setMessages(fault.data.alerts, false);
-                }
-            );
-    };
-
-    $scope.servers = servers;
-
-    $scope.columns = [
-        { "name": "Cache Group", "visible": true, "searchable": true },
-        { "name": "CDN", "visible": true, "searchable": true },
-        { "name": "Domain", "visible": true, "searchable": true },
-        { "name": "Host", "visible": true, "searchable": true },
-        { "name": "HTTPS Port", "visible": false, "searchable": false },
-        { "name": "ID", "visible": false, "searchable": false },
-        { "name": "ILO IP Address", "visible": true, "searchable": true },
-        { "name": "ILO IP Gateway", "visible": false, "searchable": false },
-        { "name": "ILO IP Netmask", "visible": false, "searchable": false },
-        { "name": "ILO Username", "visible": false, "searchable": false },
-        { "name": "Interface Name", "visible": false, "searchable": false },
-        { "name": "IPv6 Address", "visible": true, "searchable": true },
-        { "name": "IPv6 Gateway", "visible": false, "searchable": false },
-        { "name": "Last Updated", "visible": false, "searchable": false },
-        { "name": "Mgmt IP Address", "visible": false, "searchable": false },
-        { "name": "Mgmt IP Gateway", "visible": false, "searchable": false },
-        { "name": "Mgmt IP Netmask", "visible": false, "searchable": false },
-        { "name": "Network Gateway", "visible": false, "searchable": false },
-        { "name": "Network IP", "visible": true, "searchable": true },
-        { "name": "Network MTU", "visible": false, "searchable": false },
-        { "name": "Network Subnet", "visible": false, "searchable": false },
-        { "name": "Offline Reason", "visible": false, "searchable": false },
-        { "name": "Phys Location", "visible": true, "searchable": true },
-        { "name": "Profile", "visible": true, "searchable": true },
-        { "name": "Rack", "visible": false, "searchable": false },
-        { "name": "Reval Pending", "visible": false, "searchable": false },
-        { "name": "Router Hostname", "visible": false, "searchable": false },
-        { "name": "Router Port Name", "visible": false, "searchable": false },
-        { "name": "Status", "visible": true, "searchable": true },
-        { "name": "TCP Port", "visible": false, "searchable": false },
-        { "name": "Type", "visible": true, "searchable": true },
-        { "name": "Update Pending", "visible": true, "searchable": true }
-    ];
-
-    $scope.contextMenuItems = [
-        {
-            text: 'Open in New Tab',
-            click: function ($itemScope) {
-                $window.open('/#!/servers/' + $itemScope.s.id, '_blank');
-            }
-        },
-        null, // Divider
-        {
-            text: 'Navigate to Server FQDN',
-            click: function ($itemScope) {
-                $window.open('http://' + $itemScope.s.hostName + '.' + 
$itemScope.s.domainName, '_blank');
-            }
-        },
-        null, // Divider
-        {
-            text: 'Edit',
-            click: function ($itemScope) {
-                $scope.editServer($itemScope.s.id);
-            }
-        },
-        {
-            text: 'Delete',
-            click: function ($itemScope) {
-                confirmDelete($itemScope.s);
-            }
-        },
-        null, // Divider
-        {
-            text: 'Update Status',
-            click: function ($itemScope) {
-                confirmStatusUpdate($itemScope.s);
-            }
-        },
-        {
-            text: 'Queue Server Updates',
-            displayed: function ($itemScope) {
-                return serverUtils.isCache($itemScope.s) && 
!$itemScope.s.updPending;
-            },
-            click: function ($itemScope) {
-                queueServerUpdates($itemScope.s);
-            }
-        },
-        {
-            text: 'Clear Server Updates',
-            displayed: function ($itemScope) {
-                return serverUtils.isCache($itemScope.s) && 
$itemScope.s.updPending;
-            },
-            click: function ($itemScope) {
-                clearServerUpdates($itemScope.s);
-            }
-        },
-        {
-            text: 'Show Charts',
-            displayed: function () {
-                return propertiesModel.properties.servers.charts.show;
-            },
-            hasBottomDivider: function () {
-                return true;
-            },
-            hasTopDivider: function () {
-                return true;
-            },
-            click: function ($itemScope) {
-                $window.open(propertiesModel.properties.servers.charts.baseUrl 
+ $itemScope.s.hostName, '_blank');
-            }
-        },
-        {
-            text: 'Manage Capabilities',
-            displayed: function ($itemScope) {
-                return serverUtils.isCache($itemScope.s);
-            },
-            hasTopDivider: function () {
-                return true;
-            },
-            click: function ($itemScope) {
-                locationUtils.navigateToPath('/servers/' + $itemScope.s.id + 
'/capabilities');
-            }
-        },
-        {
-            text: 'Manage Delivery Services',
-            displayed: function ($itemScope) {
-                return serverUtils.isEdge($itemScope.s) || 
serverUtils.isOrigin($itemScope.s);
-            },
-            hasTopDivider: function ($itemScope) {
-                return !serverUtils.isCache($itemScope.s);
-            },
-            click: function ($itemScope) {
-                locationUtils.navigateToPath('/servers/' + $itemScope.s.id + 
'/delivery-services');
-            }
-        },
-        {
-            text: 'View Config Files',
-            displayed: function ($itemScope) {
-                return serverUtils.isCache($itemScope.s);
-            },
-            click: function ($itemScope) {
-                locationUtils.navigateToPath('/servers/' + $itemScope.s.id + 
'/config-files');
-            }
-        }
-    ];
-
-    $scope.editServer = function(id) {
-        locationUtils.navigateToPath('/servers/' + id);
-    };
-
-    $scope.createServer = function() {
-        locationUtils.navigateToPath('/servers/new');
-    };
-
-    $scope.confirmCDNQueueServerUpdates = function(cdn) {
-        var params;
-        if (cdn) {
-            params = {
-                title: 'Queue Server Updates: ' + cdn.name,
-                message: 'Are you sure you want to queue server updates for 
all ' + cdn.name + ' servers?'
-            };
-            var modalInstance = $uibModal.open({
-                templateUrl: 
'common/modules/dialog/confirm/dialog.confirm.tpl.html',
-                controller: 'DialogConfirmController',
-                size: 'md',
-                resolve: {
-                    params: function () {
-                        return params;
-                    }
-                }
-            });
-            modalInstance.result.then(function() {
-                queueCDNServerUpdates(cdn.id);
-            }, function () {
-                // do nothing
-            });
-        } else {
-            params = {
-                title: 'Queue Server Updates',
-                message: "Please select a CDN"
-            };
-            var modalInstance = $uibModal.open({
-                templateUrl: 
'common/modules/dialog/select/dialog.select.tpl.html',
-                controller: 'DialogSelectController',
-                size: 'md',
-                resolve: {
-                    params: function () {
-                        return params;
-                    },
-                    collection: function(cdnService) {
-                        return cdnService.getCDNs();
-                    }
-                }
-            });
-            modalInstance.result.then(function(cdn) {
-                queueCDNServerUpdates(cdn.id);
-            }, function () {
-                // do nothing
-            });
-        }
-    };
-
-    $scope.confirmCDNClearServerUpdates = function(cdn) {
-        var params;
-        if (cdn) {
-            params = {
-                title: 'Clear Server Updates: ' + cdn.name,
-                message: 'Are you sure you want to clear server updates for 
all ' + cdn.name + ' servers?'
-            };
-            var modalInstance = $uibModal.open({
-                templateUrl: 
'common/modules/dialog/confirm/dialog.confirm.tpl.html',
-                controller: 'DialogConfirmController',
-                size: 'md',
-                resolve: {
-                    params: function () {
-                        return params;
-                    }
-                }
-            });
-            modalInstance.result.then(function() {
-                clearCDNServerUpdates(cdn.id);
-            }, function () {
-                // do nothing
-            });
-
-
-        } else {
-            params = {
-                title: 'Clear Server Updates',
-                message: "Please select a CDN"
-            };
-            var modalInstance = $uibModal.open({
-                templateUrl: 
'common/modules/dialog/select/dialog.select.tpl.html',
-                controller: 'DialogSelectController',
-                size: 'md',
-                resolve: {
-                    params: function () {
-                        return params;
-                    },
-                    collection: function(cdnService) {
-                        return cdnService.getCDNs();
-                    }
-                }
-            });
-            modalInstance.result.then(function(cdn) {
-                clearCDNServerUpdates(cdn.id);
-            }, function () {
-                // do nothing
-            });
-        }
-    };
-
-    $scope.refresh = function() {
-        $state.reload(); // reloads all the resolves for the view
-    };
-
-    $scope.toggleVisibility = function(colName) {
-        const col = serversTable.column(colName + ':name');
-        col.visible(!col.visible());
-        serversTable.rows().invalidate().draw();
-    };
-
-    $scope.ssh = serverUtils.ssh;
-
-    $scope.isOffline = serverUtils.isOffline;
-
-    $scope.offlineReason = serverUtils.offlineReason;
-
-    $scope.getRelativeTime = dateUtils.getRelativeTime;
-
-    $scope.navigateToPath = locationUtils.navigateToPath;
-
-    var init = function () {
-        getStatuses();
-    };
-    init();
-
-    angular.element(document).ready(function () {
-        serversTable = $('#serversTable').DataTable({
-            "lengthMenu": [[25, 50, 100, -1], [25, 50, 100, "All"]],
-            "iDisplayLength": 25,
-            "aaSorting": [],
-            "columns": $scope.columns,
-            "initComplete": function(settings, json) {
-                try {
-                    // need to create the show/hide column checkboxes and bind 
to the current visibility
-                    $scope.columns = 
JSON.parse(localStorage.getItem('DataTables_serversTable_/')).columns;
-                } catch (e) {
-                    console.error("Failure to retrieve required column info 
from localStorage (key=DataTables_serversTable_/):", e);
-                }
-            }
-        });
-    });
+var TableServersController = function(servers, $scope, $state, $uibModal, 
$window, dateUtils, locationUtils, serverUtils, cdnService, serverService, 
statusService, propertiesModel, messageModel, userModel, $document) {
+       /**** Table cell formatters/renderers ****/
 
+       // browserify can't handle classes...
+       function SSHCellRenderer() {}
+       SSHCellRenderer.prototype.init = function(params) {
+               this.eGui = document.createElement("A");
+               this.eGui.href = "ssh://" + userModel.user.username + "@" + 
params.value;
+               this.eGui.setAttribute("target", "_blank");
+               this.eGui.textContent = params.value;
+       };
+       SSHCellRenderer.prototype.getGui = function() {return this.eGui;};
+
+       function UpdateCellRenderer() {}
+       UpdateCellRenderer.prototype.init = function(params) {
+               this.eGui = document.createElement("I");
+               this.eGui.setAttribute("aria-hidden", "true");
+               this.eGui.setAttribute("title", String(params.value));
+               this.eGui.classList.add("fa", "fa-lg");
+               if (params.value) {
+                       this.eGui.classList.add("fa-clock-o");
+               } else {
+                       this.eGui.classList.add("fa-check");
+               }
+       }
+       UpdateCellRenderer.prototype.getGui = function() {return this.eGui;};
+
+       /**
+        * Gets text with which to file a status tooltip.
+        * @returns {string | undefined} The offline reason if the server is 
offline, otherwise nothing.
+        */
+       function offlineReasonTooltip(params) {
+               if (!params.value || !serverUtils.isOffline(params.value)) {
+                       return;
+               }
+               return params.data.offlineReason;
+       }
+
+       /**
+        * Formats the contents of a 'lastUpdated' column cell as "relative to 
now".
+        */
+       function dateCellFormatter(params) {
+               return dateUtils.getRelativeTime(params.value);
+       }
+
+
+       /**** Constants, scope data, etc. ****/
+
+       /** The columns of the ag-grid table */
+       const columns = [
+               {
+                       headerName: "Cache Group",
+                       field: "cachegroup",
+                       hide: false,
+                       searchable: true
+               },
+               {
+                       headerName: "CDN",
+                       field: "cdnName",
+                       hide: false,
+                       searchable: true
+               },
+               {
+                       headerName: "Domain",
+                       field: "domainName",
+                       hide: false,
+                       searchable: true
+               },
+               {
+                       headerName: "Host",
+                       field: "hostName",
+                       hide: false,
+                       searchable: true
+               },
+               {
+                       headerName: "HTTPS Port",
+                       field: "httpsPort",
+                       hide: true,
+                       searchable: false,
+                       filter: "agNumberColumnFilter"
+               },
+               {
+                       headerName: "ID",
+                       field: "id",
+                       hide: true,
+                       searchable: true,
+                       filter: "agNumberColumnFilter"
+               },
+               {
+                       headerName: "ILO IP Address",
+                       field: "iloIpAddress",
+                       hide: true,
+                       searchable: true,
+                       cellRenderer: "sshCellRenderer",
+                       onCellClicked: null
+               },
+               {
+                       headerName: "ILO IP Gateway",
+                       field: "iloIpGateway",
+                       hide: true,
+                       searchable: false,
+                       cellRenderer: "sshCellRenderer",
+                       onCellClicked: null
+               },
+               {
+                       headerName: "ILO IP Netmask",
+                       field: "iloIpNetmask",
+                       hide: true,
+                       searchable: false
+               },
+               {
+                       headerName: "ILO Username",
+                       field: "iloUsername",
+                       hide: true,
+                       searchable: false
+               },
+               {
+                       headerName: "Interface Name",
+                       field: "interfaceName",
+                       hide: true,
+                       searchable: false
+               },
+               {
+                       headerName: "IPv6 Address",
+                       field: "ipv6Address",
+                       hide: false,
+                       searchable: true
+               },
+               {
+                       headerName: "IPv6 Gateway",
+                       field: "ipv6Gateway",
+                       hide: true,
+                       searchable: false
+               },
+               {
+                       headerName: "Last Updated",
+                       field: "lastUpdated",
+                       hide: true,
+                       searchable: false,
+                       filter: "agDateColumnFilter",
+                       valueFormatter: dateCellFormatter
+               },
+               {
+                       headerName: "Mgmt IP Address",
+                       field: "mgmtIpAddress",
+                       hide: true,
+                       searchable: false
+               },
+               {
+                       headerName: "Mgmt IP Gateway",
+                       field: "mgmtIpGateway",
+                       hide: true,
+                       searchable: false,
+                       filter: true,
+                       cellRenderer: "sshCellRenderer",
+                       onCellClicked: null
+               },
+               {
+                       headerName: "Mgmt IP Netmask",
+                       field: "mgmtIpNetmask",
+                       hide: true,
+                       searchable: false,
+                       filter: true,
+                       cellRenderer: "sshCellRenderer",
+                       onCellClicked: null
+               },
+               {
+                       headerName: "Network Gateway",
+                       field: "ipGateway",
+                       hide: true,
+                       searchable: true,
+                       filter: true,
+                       cellRenderer: "sshCellRenderer",
+                       onCellClicked: null
+               },
+               {
+                       headerName: "Network IP",
+                       field: "ipAddress",
+                       hide: false,
+                       searchable: true,
+                       filter: true,
+                       cellRenderer: "sshCellRenderer",
+                       onCellClicked: null
+               },
+               {
+                       headerName: "Network MTU",
+                       field: "interfaceMtu",
+                       hide: true,
+                       searchable: false,
+                       filter: "agNumberColumnFilter"
+               },
+               {
+                       headerName: "Network Subnet",
+                       field: "ipNetmask",
+                       hide: true,
+                       searchable: false
+               },
+               {
+                       headerName: "Offline Reason",
+                       field: "offlineReason",
+                       hide: true,
+                       searchable: false

Review comment:
       those don't belong there. I actually already got rid of those properties 
by the time you made this review :P




----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
[email protected]


Reply via email to