esxi_web_cum

在 ESXi 虚拟机管理页面中展示所有虚拟机,并按名称排序,并在控制台输出排序前和排序后的表格内容,并将虚拟机列表高度设置为855px

  1. // ==UserScript==
  2. // @name esxi_web_cum
  3. // @license MIT
  4. // @namespace http://tampermonkey.net/
  5. // @version 1.3
  6. // @description 在 ESXi 虚拟机管理页面中展示所有虚拟机,并按名称排序,并在控制台输出排序前和排序后的表格内容,并将虚拟机列表高度设置为855px
  7. // @match https://192.168.3.50/*
  8. // ==/UserScript==
  9.  
  10. (function() {
  11. 'use strict';
  12.  
  13. // 检查表格数据是否加载完成
  14. const isTableDataLoaded = () => {
  15. const table = document.querySelector('table.k-selectable');
  16. return table && table.querySelectorAll('tbody tr').length > 0;
  17. };
  18.  
  19. // 模拟点击箭头图标展开下拉菜单
  20. const triggerArrowheadClick = (observer) => {
  21. const arrowheadIcon = document.querySelector('span.k-icon.k-i-arrowhead-s');
  22. if (arrowheadIcon) {
  23. console.log("找到箭头图标,正在触发点击展开下拉菜单...");
  24. arrowheadIcon.click();
  25. observer.disconnect(); // 停止观察
  26. observeSortAscButton(); // 开始监听“按升序排序”按钮
  27. } else {
  28. console.log("未找到箭头图标。");
  29. }
  30. };
  31.  
  32. // 模拟点击“按升序排序”图标
  33. const clickSortAscButton = () => {
  34. const sortAscButton = document.querySelector('span.k-sprite.k-i-sort-asc');
  35. if (sortAscButton) {
  36. console.log("找到 '按升序排序' 按钮,正在触发点击...");
  37. sortAscButton.click();
  38. // 排序完成后设置高度
  39. setTimeout(setContentHeight, 500); // 延迟 500 毫秒以确保排序完成
  40. } else {
  41. console.log("未找到 '按升序排序' 按钮。");
  42. }
  43. };
  44.  
  45. const setContentHeight = () => {
  46. const gridContainer = document.querySelector('div.ui-resizable.k-grid.k-widget.k-reorderable.k-grid-scroll');
  47. const gridContent = document.querySelector('div.k-grid-content');
  48.  
  49. if (gridContainer) {
  50. console.log("排序完成,强制设置gridContainer高度为855px...");
  51. gridContainer.style.setProperty("height", "855px", "important");
  52.  
  53. if (gridContent) {
  54. const adjustedHeight = `${gridContainer.offsetHeight - 98}px`;
  55. console.log(`设置gridContent高度为: ${adjustedHeight}...`);
  56. gridContent.style.setProperty("height", adjustedHeight, "important");
  57. } else {
  58. console.log("未找到 'div.k-grid-content' 元素。");
  59. }
  60. } else {
  61. console.log("未找到 'div.ui-resizable.k-grid.k-widget.k-reorderable.k-grid-scroll' 元素。");
  62. }
  63. };
  64.  
  65. // 使用 MutationObserver 监听“按升序排序”按钮的出现
  66. const observeSortAscButton = () => {
  67. const sortObserver = new MutationObserver(() => {
  68. if (document.querySelector('span.k-sprite.k-i-sort-asc')) {
  69. clickSortAscButton(); // 触发点击“按升序排序”按钮
  70. sortObserver.disconnect(); // 停止观察
  71. }
  72. });
  73. sortObserver.observe(document.body, { childList: true, subtree: true });
  74. };
  75.  
  76. // 监听 DOM 变化,等待表格加载完成后点击箭头图标
  77. const observer = new MutationObserver(() => {
  78. if (isTableDataLoaded()) {
  79. console.log("表格数据已加载,尝试点击箭头图标...");
  80. triggerArrowheadClick(observer); // 数据加载后点击箭头图标
  81. }
  82. });
  83.  
  84. // 开始观察整个文档的子节点变化
  85. observer.observe(document.body, { childList: true, subtree: true });
  86. })();
  87.