tyler.durden
/
pandorafms
mirror of https://github.com/pandorafms/pandorafms.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'ent-11490-nuevo-widget-group-status-map' into 'develop' 

Ent 11490 Nuevo widget: group status map

See merge request artica/pandorafms!6252
This commit is contained in:
Rafael Ameijeiras 2023-09-04 07:05:49 +00:00
parent d9e21b9471 7e049cb1b5
commit 6e60eeb09b
7 changed files with 577 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
pandora_console/images/widgets/groups_status_map.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.3 KiB

16
pandora_console/include/graphs/functions_d3.php
View File

@ -83,7 +83,7 @@ function d3_relationship_graph($elements, $matrix, $width=700, $return=false, $h
}
function d3_tree_map_graph($data, $width=700, $height=700, $return=false)
function d3_tree_map_graph($data, $width=700, $height=700, $return=false, $id_container='tree_map', $child_links=false)
{
global $config;
@ -91,7 +91,7 @@ function d3_tree_map_graph($data, $width=700, $height=700, $return=false)
$data = json_encode($data);
}
$output = "<div id=\"tree_map\" style='overflow: hidden;'></div>";
$output = '<div id="'.$id_container."\" style='overflow: hidden;'></div>";
$output .= include_javascript_d3(true);
$output .= '<style type="text/css">
.cell>rect {
@ -139,8 +139,18 @@ function d3_tree_map_graph($data, $width=700, $height=700, $return=false)
}
</style>';
$output .= "<script language=\"javascript\" type=\"text/javascript\">
treeMap('#tree_map', $data, '$width', '$height');
treeMap('#$id_container', $data, '$width', '$height', $child_links);
</script>";
if ($child_links === true) {
$output .= html_print_input_image(
'resize_parent',
'/images/normal_screen.png',
1,
'background-color: white !important; padding: 4px !important;',
true,
['class' => 'resize_button invisible']
);
}
if (!$return) {
echo $output;

115
pandora_console/include/graphs/pandora.d3.js
View File

@ -402,18 +402,24 @@ function chordDiagram(recipient, elements, matrix, width, height) {
// }
// ]
// };
function treeMap(recipient, data, width, height) {
function treeMap(recipient, data, width, height, childLinks = false) {
//var isIE = BrowserDetect.browser == 'Explorer';
var isIE = true;
var chartWidth = width;
var chartHeight = height;
var consoleStyle = document.getElementById("hidden-selected_style_theme")
.value;
$("#tooltip").css(
const uniqueId = generateUniqueId();
if (document.getElementById("hidden-selected_style_theme") !== null) {
var consoleStyle = document.getElementById("hidden-selected_style_theme")
.value;
} else {
var consoleStyle = "";
}
$("#tooltip_" + uniqueId).css(
"color",
consoleStyle === "pandora_black" ? "rgb(240, 240, 240)" : "rgb(0, 0, 0)"
);
$("#tooltip").css(
$("#tooltip_" + uniqueId).css(
"background-color",
consoleStyle === "pandora_black" ? "rgb(0, 0, 0)" : "rgb(240, 240, 240)"
);
@ -431,6 +437,9 @@ function treeMap(recipient, data, width, height) {
var transitionDuration = 500;
var root;
var node;
var resize_button = $(recipient)
.parent()
.find(".resize_button");
var treemap = d3.layout
.treemap()
@ -468,6 +477,7 @@ function treeMap(recipient, data, width, height) {
.attr("class", "cell parent")
.on("click", function(d) {
zoom(d);
resize_button.show();
})
.append("svg")
.attr("class", "clip")
@ -476,6 +486,9 @@ function treeMap(recipient, data, width, height) {
})
.attr("height", headerHeight);
parentEnterTransition
.filter(function(d) {
if (d.name) return d;
})
.append("rect")
.attr("width", function(d) {
return Math.max(0.01, d.dx);
@ -483,6 +496,9 @@ function treeMap(recipient, data, width, height) {
.attr("height", headerHeight)
.style("fill", headerColor);
parentEnterTransition
.filter(function(d) {
if (d.name) return d;
})
.append("text")
.attr("class", "label")
.attr("fill", "white")
@ -490,6 +506,7 @@ function treeMap(recipient, data, width, height) {
.attr("width", function(d) {
return Math.max(0.01, d.dx);
})
.attr("style", "transition: all 0.5s ease-out;")
.attr("height", headerHeight)
.text(function(d) {
return d.name;
@ -521,6 +538,10 @@ function treeMap(recipient, data, width, height) {
// remove transition
parentCells.exit().remove();
$(resize_button).on("click", function() {
zoom(root);
$(this).hide();
});
// create children cells
var childrenCells = chart
.selectAll("g.cell.child")
@ -534,19 +555,27 @@ function treeMap(recipient, data, width, height) {
.append("g")
.attr("class", "cell child")
.on("click", function(d) {
zoom(node === d.parent ? root : d.parent);
if (childLinks) {
if (node === d.parent) {
window.location.href = d.link;
} else {
resize_button.show();
zoom(d.parent);
}
} else {
zoom(node === d.parent ? root : d.parent);
}
})
.on("mouseover", over_user)
.on("mouseout", out_user)
.on("mousemove", move_tooltip)
.append("svg")
.attr("class", "clip");
$(recipient).on("mouseover", over_user);
$(recipient).on("mouseout", out_user);
$(recipient).on("mousemove", move_tooltip);
childEnterTransition
.append("rect")
.classed("background", true)
.style("fill", function(d) {
return color(d.name);
return d.color ? d.color : color(d.name);
});
childEnterTransition
@ -608,6 +637,30 @@ function treeMap(recipient, data, width, height) {
zoom(node);
function calculateSizeText() {
$(recipient + " .parent .clip .label").each((key, node) => {
const textElement = node;
const containerWidth = parseFloat(
$(textElement)
.parent()
.attr("width")
);
const originalFontSize = 12;
textElement.style.fontSize = "16px";
const computedTextLength = textElement.getComputedTextLength();
const textWidth = computedTextLength + 8;
textElement.style.fontSize = originalFontSize + "px";
const scaleFactor = containerWidth / textWidth;
let scaledFontSize = parseFloat(originalFontSize) * scaleFactor;
scaledFontSize = scaledFontSize > 12 ? 12 : scaledFontSize;
textElement.style.fontSize = scaledFontSize + "px";
});
}
function size(d) {
return d.size;
}
@ -728,6 +781,9 @@ function treeMap(recipient, data, width, height) {
if (d3.event) {
d3.event.stopPropagation();
}
setTimeout(() => {
calculateSizeText();
}, transitionDuration);
}
function position() {
@ -746,11 +802,10 @@ function treeMap(recipient, data, width, height) {
}
function move_tooltip(d) {
x = d3.event.pageX + 10;
y = d3.event.pageY + 10;
$("#tooltip").css("left", x + "px");
$("#tooltip").css("top", y + "px");
x = d.offsetX + 40;
y = d.offsetY + 40;
$("#tooltip_" + uniqueId).css("left", x + "px");
$("#tooltip_" + uniqueId).css("top", y + "px");
}
function over_user(d) {
@ -772,17 +827,17 @@ function treeMap(recipient, data, width, height) {
}
function create_tooltip(d, x, y) {
if ($("#tooltip").length == 0) {
if ($("#tooltip_" + uniqueId).length == 0) {
$(recipient).append(
$("<div></div>")
.attr("id", "tooltip")
.html(d.tooltip_content)
.attr("id", "tooltip_" + uniqueId)
.html(d.target.__data__.tooltip_content)
);
} else {
$("#tooltip").html(d.tooltip_content);
$("#tooltip_" + uniqueId).html(d.target.__data__.tooltip_content);
}
$("#tooltip").attr(
$("#tooltip_" + uniqueId).attr(
"style",
"background: #fff;" +
"color: #111;" +
@ -805,14 +860,22 @@ function treeMap(recipient, data, width, height) {
}
function show_tooltip(d) {
x = d3.event.pageX + 10;
y = d3.event.pageY + 10;
create_tooltip(d, x, y);
x = d.offsetX + 10;
y = d.offsetY + 10;
if (d.target.__data__) {
create_tooltip(d, x, y);
}
}
function hide_tooltip() {
$("#tooltip").hide();
$("#tooltip_" + uniqueId).hide();
}
function generateUniqueId() {
const timestamp = new Date().getTime();
const randomNum = Math.floor(Math.random() * 10000);
const uniqueId = `${timestamp}-${randomNum}`;
return uniqueId;
}
}

4
pandora_console/include/lib/Dashboard/Widget.php
View File

@ -300,6 +300,10 @@ class Widget
$className .= '\GroupsStatusWidget';
break;
case 'groups_status_map':
$className .= '\GroupsStatusMapWidget';
break;
case 'maps_made_by_user':
$className .= '\MapsMadeByUser';
break;

460
pandora_console/include/lib/Dashboard/Widgets/groups_status_map.php Normal file
View File

@ -0,0 +1,460 @@
<?php
/**
* Widget Group status map Pandora FMS Console
*
* @category Console Class
* @package Pandora FMS
* @subpackage Widget Group status
* @version 1.0.0
* @license See below
*
* ______ ___ _______ _______ ________
* | __ \.-----.--.--.--| |.-----.----.-----. | ___| | | __|
* | __/| _ | | _ || _ | _| _ | | ___| |__ |
* |___| |___._|__|__|_____||_____|__| |___._| |___| |__|_|__|_______|
*
* ============================================================================
* Copyright (c) 2005-2023 Pandora FMS
* Please see https://pandorafms.com/community/ for full contribution list
* This program is free software; you can redistribute it and/or
* modify it under the terms of the GNU General Public License
* as published by the Free Software Foundation for version 2.
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU General Public License for more details.
* ============================================================================
*/
namespace PandoraFMS\Dashboard;
/**
* Group status map Widgets.
*/
class GroupsStatusMapWidget extends Widget
{
/**
* Name widget.
*
* @var string
*/
protected $name;
/**
* Title widget.
*
* @var string
*/
protected $title;
/**
* Page widget;
*
* @var string
*/
protected $page;
/**
* Class name widget.
*
* @var [type]
*/
protected $className;
/**
* Values options for each widget.
*
* @var [type]
*/
protected $values;
/**
* Configuration required.
*
* @var boolean
*/
protected $configurationRequired;
/**
* Error load widget.
*
* @var boolean
*/
protected $loadError;
/**
* Width.
*
* @var integer
*/
protected $width;
/**
* Heigth.
*
* @var integer
*/
protected $height;
/**
* Grid Width.
*
* @var integer
*/
protected $gridWidth;
/**
* Construct.
*
* @param integer $cellId Cell ID.
* @param integer $dashboardId Dashboard ID.
* @param integer $widgetId Widget ID.
* @param integer|null $width New width.
* @param integer|null $height New height.
* @param integer|null $gridWidth Grid width.
*/
public function __construct(
int $cellId,
int $dashboardId=0,
int $widgetId=0,
?int $width=0,
?int $height=0,
?int $gridWidth=0
) {
global $config;
// WARNING: Do not edit. This chunk must be in the constructor.
parent::__construct(
$cellId,
$dashboardId,
$widgetId
);
// Width.
$this->width = $width;
// Height.
$this->height = $height;
// Grid Width.
$this->gridWidth = $gridWidth;
// Options.
$this->values = $this->decoders($this->getOptionsWidget());
// Positions.
$this->position = $this->getPositionWidget();
// Page.
$this->page = basename(__FILE__);
// ClassName.
$class = new \ReflectionClass($this);
$this->className = $class->getShortName();
// Title.
$this->title = __('Group status map');
// Name.
if (empty($this->name) === true) {
$this->name = 'groups_status_map';
}
$this->overflow_scrollbars = false;
}
/**
* Decoders hack for retrocompability.
*
* @param array $decoder Values.
*
* @return array Returns the values ​​with the correct key.
*/
public function decoders(array $decoder): array
{
$values = [];
// Retrieve global - common inputs.
$values = parent::decoders($decoder);
if (isset($decoder['groups']) === true) {
$values['groupId'] = $decoder['groups'];
}
if (isset($decoder['groupId']) === true) {
$values['groupId'] = $decoder['groupId'];
}
if (isset($decoder['groupRecursion']) === true) {
$values['groupRecursion'] = $decoder['groupRecursion'];
}
return $values;
}
/**
* Generates inputs for form (specific).
*
* @return array Of inputs.
*
* @throws Exception On error.
*/
public function getFormInputs(): array
{
$values = $this->values;
// Retrieve global - common inputs.
$inputs = parent::getFormInputs();
$values['groupId'] = explode(',', $values['groupId']);
// Restrict access to group.
$inputs[] = [
'label' => __('Groups'),
'arguments' => [
'type' => 'select_groups',
'name' => 'groupId',
'returnAllGroup' => true,
'privilege' => 'AR',
'multiple' => true,
'selected' => $values['groupId'],
'return' => true,
],
];
$inputs[] = [
'label' => __('Group recursion'),
'arguments' => [
'name' => 'groupRecursion',
'id' => 'groupRecursion',
'type' => 'switch',
'value' => $values['groupRecursion'],
],
];
return $inputs;
}
/**
* Get Post for widget.
*
* @return array
*/
public function getPost():array
{
// Retrieve global - common inputs.
$values = parent::getPost();
$values['groupId'] = \get_parameter('groupId', 0);
$values['groupRecursion'] = \get_parameter_switch('groupRecursion', 0);
return $values;
}
/**
* Draw widget.
*
* @return string;
*/
public function load()
{
global $config;
$size = parent::getSize();
include_once $config['homedir'].'/include/graphs/functions_d3.php';
include_once $config['homedir'].'/include/functions_reporting.php';
include_once $config['homedir'].'/include/functions_graph.php';
$groups_array = (empty($this->values['groupId']) === false) ? explode(',', $this->values['groupId']) : [];
if ((bool) $this->values['groupRecursion'] === true && in_array('0', $groups_array) === false) {
foreach ($groups_array as $key => $group) {
$children = groups_get_children($group, false, 'AR', false);
foreach ($children as $key => $child) {
$groups_array[] = $child['id_grupo'];
}
}
}
if (is_metaconsole() === true) {
$where = '';
if (in_array('0', $groups_array) === false && count($groups_array) > 0) {
$where = ' WHERE g.id_grupo IN ('.implode(',', $groups_array).') ';
}
$servers = metaconsole_get_servers();
$rows = [];
if (isset($servers) === true && is_array($servers) === true
) {
foreach ($servers as $server) {
if (metaconsole_connect($server) == NOERR) {
$sql = 'SELECT g.id_grupo, g.nombre, estado, count(*) AS total_modules
FROM tagente a
LEFT JOIN tgrupo g ON g.id_grupo = a.id_grupo
LEFT JOIN tagente_modulo m ON a.id_agente = m.id_agente
LEFT JOIN tagente_estado es ON es.id_agente_modulo = m.id_agente_modulo
'.$where.'
GROUP BY a.id_grupo, estado';
$result = db_process_sql($sql);
if ($result !== false) {
foreach ($result as $key => $group) {
$not_exist = true;
foreach ($rows as $key2 => $row) {
if ($group['id_grupo'] === $row['id_grupo']
&& $group['estado'] === $row['estado']
) {
$rows[$key2]['total_modules'] += $group['total_modules'];
$not_exist = false;
break;
}
}
if ($not_exist === true) {
$rows[] = $group;
}
}
}
}
metaconsole_restore_db();
}
}
} else {
$where = '';
if (in_array('0', $groups_array) === false && count($groups_array) > 0) {
$where = ' WHERE g.id_grupo IN ('.implode(',', $groups_array).') ';
}
$sql = 'SELECT g.id_grupo, g.nombre, estado, count(*) AS total_modules
FROM tagente a
LEFT JOIN tgrupo g ON g.id_grupo = a.id_grupo
LEFT JOIN tagente_modulo m ON a.id_agente = m.id_agente
LEFT JOIN tagente_estado es ON es.id_agente_modulo = m.id_agente_modulo
'.$where.'
GROUP BY a.id_grupo, estado';
$rows = db_process_sql($sql);
}
if ($rows === false || (is_array($rows) === true && count($rows) === 0)) {
$output = ui_print_info_message(
[
'no_close' => true,
'message' => __('No data found.'),
]
);
return $output;
}
$level1 = [
'name' => __('Module status map'),
'children' => [],
];
$names = [];
foreach ($rows as $key => $row) {
$color = '';
$name_status = '';
switch ($row['estado']) {
case '1':
$color = '#e63c52';
$name_status = __('Critical');
break;
case '2':
$color = '#FFB900';
$name_status = __('Warning');
break;
case '0':
$color = '#82b92e';
$name_status = __('Normal');
break;
case '3':
$color = '#B2B2B2';
$name_status = __('Unknown');
break;
case '4':
$color = '#4a83f3';
$name_status = __('No data');
$row['estado'] = 6;
break;
default:
$row['estado'] = 6;
$color = '#B2B2B2';
$name_status = __('Unknown');
continue;
}
$level1['children'][$row['id_grupo']][] = [
'id' => uniqid(),
'name' => $row['estado'],
'value' => $row['total_modules'],
'color' => $color,
'tooltip_content' => $row['total_modules'].__(' Modules(%s)', $name_status),
'link' => 'index.php?sec=view&sec2=operation/agentes/status_monitor&refr=0&ag_group='.$row['id_grupo'].'&ag_freestring=&module_option=1&ag_modulename=&moduletype=&datatype=&status='.$row['estado'].'&sort_field=&sort=none&pure=',
];
$names[$row['id_grupo']] = $row['nombre'];
}
$level2 = [
'children' => [],
];
foreach ($level1['children'] as $id_grupo => $group) {
$level2['children'][] = [
'id' => uniqid(),
'name' => io_safe_output($names[$id_grupo]),
'children' => $group,
];
}
$id_container = 'tree_map_'.uniqid();
$output = d3_tree_map_graph($level2, $size['width'], $size['height'], true, $id_container, true);
return $output;
}
/**
* Get description.
*
* @return string.
*/
public static function getDescription()
{
return __('Group status map');
}
/**
* Get Name.
*
* @return string.
*/
public static function getName()
{
return 'groups_status_map';
}
/**
* Get size Modal Configuration.
*
* @return array
*/
public function getSizeModalConfiguration(): array
{
$size = [
'width' => 400,
'height' => 330,
];
return $size;
}
}

10
pandora_console/include/styles/dashboards.css
View File

@ -937,3 +937,13 @@ div.basic-chart-title span {
font-size: 20px;
font-weight: bold;
}
input.resize_button {
position: absolute;
background-color: white !important;
padding: 4px !important;
border-radius: 20px;
width: 28px;
bottom: 3%;
right: 6%;
}

2
pandora_console/operation/netflow/nf_live_view.php
View File

@ -696,7 +696,7 @@ if (empty($draw) === false) {
$config['style']
);
$netflowContainerClass = ($chart_type === 'netflow_data' || $chart_type === 'netflow_summary' || $chart_type === 'netflow_top_N') ? '' : 'white_box';
$netflowContainerClass = ($chart_type === 'netflow_data' || $chart_type === 'netflow_summary' || $chart_type === 'netflow_top_N') ? '' : 'white_box relative';
// Draw the netflow chart.
html_print_div(