Polish TreeView

This commit is contained in:
Jose Gonzalez 2023-01-30 13:39:27 +01:00
parent deb69a0659
commit 6496c08f28
10 changed files with 114 additions and 108 deletions

View File

@ -669,7 +669,6 @@ class Tree
}
$module['statusImageHTML'] = ui_print_status_image($statusType, htmlspecialchars($statusTitle), true);
$module['statusImageHTML'] = 'cipote';
// HTML of the server type image.
$module['serverTypeHTML'] = ui_print_servertype_icon((int) $module['server_type']);

View File

@ -55,7 +55,7 @@ function treeview_printModuleTable($id_module, $server_data=false, $no_head=fals
$table = new StdClass();
$table->width = '100%';
$table->class = 'floating_form margin-top-10';
$table->class = 'floating_form';
$table->id = 'tree_view_module_data';
$table->style = [];
$table->style['title'] = 'height: 32px; width: 30%; padding-right: 5px; text-align: end;';
@ -70,6 +70,21 @@ function treeview_printModuleTable($id_module, $server_data=false, $no_head=fals
$row['data'] = $cellName;
$table->data['name'] = $row;
// Edit module button.
$row = [];
$row['title'] = html_print_button(
__('Edit module'),
'edit_module_link',
false,
'window.location.assign(\''.$console_url.'index.php?sec=gagente&sec2=godmode/agentes/configurar_agente&id_agente='.$module['id_agente'].'&tab=module&edit_module=1&id_agent_module='.$module['id_agente_modulo'].$url_hash.'\')',
[
'mode' => 'link',
'style' => 'float: right;justify-content: end;padding: 0;',
],
true
);
$table->data['edit_button'] = $row;
// Interval.
$row = [];
$row['title'] = __('Interval');
@ -304,20 +319,8 @@ function treeview_printModuleTable($id_module, $server_data=false, $no_head=fals
$row['data'] = $time_elapsed;
$table->data['tags'] = $row;
// Edit module button.
$row = [];
$row['title'] = html_print_button(
__('Edit module'),
'edit_module_link',
false,
'window.location.assign(\''.$console_url.'index.php?sec=gagente&sec2=godmode/agentes/configurar_agente&id_agente='.$module['id_agente'].'&tab=module&edit_module=1&id_agent_module='.$module['id_agente_modulo'].$url_hash.'\')',
[ 'mode' => 'link' ],
true
);
$table->data['edit_button'] = $row;
$table->colspan['edit_button'] = 2;
// Title.
echo '<span style="position: relative; top: 12px; left: 12px;" class="subsection_header_title">'.__('Module information').'</span>';
echo '<span id="fixedBottomHeadTitle" style="display:none">'.__('Module information').'</span>';
// End of table.
html_print_table($table);
@ -562,7 +565,7 @@ function treeview_printTable($id_agente, $server_data=[], $no_head=false)
$table = new StdClass();
$table->width = '100%';
$table->class = 'floating_form';
$table->class = 'floating_form border-bottom-gray';
$table->id = 'tree_view_agent_detail';
$table->style = [];
$table->style['title'] = 'height: 32px; width: 30%; padding-right: 5px; text-align: end;';
@ -603,6 +606,22 @@ function treeview_printTable($id_agente, $server_data=[], $no_head=false)
$row['data'] = $cellName;
$table->data['name'] = $row;
// Edit agent button.
$row = [];
$row['title'] = html_print_button(
__('Edit agent'),
'edit_agent_link',
false,
$urlAgent,
[
'mode' => 'link',
'style' => 'float: right;justify-content: end;padding: 0;',
],
true
);
$row['data'] = '';
$table->data['edit_button'] = $row;
// Addresses.
$ips = [];
$addresses = agents_get_addresses($id_agente);
@ -670,7 +689,7 @@ function treeview_printTable($id_agente, $server_data=[], $no_head=false)
$row['title'] = __('Next agent contact');
$row['data'] = ui_progress(
$progress,
'100%',
'80%',
'1.2',
'#ececec',
true,
@ -680,19 +699,6 @@ function treeview_printTable($id_agente, $server_data=[], $no_head=false)
);
$table->data['next_contact'] = $row;
// Edit agent button.
$row = [];
$row['title'] = html_print_button(
__('Edit agent'),
'edit_agent_link',
false,
$urlAgent,
[ 'mode' => 'link' ],
true
);
$table->data['edit_button'] = $row;
$table->colspan['edit_button'] = 2;
// End of table.
$agent_table = html_print_table($table, true);
/*
@ -716,28 +722,10 @@ function treeview_printTable($id_agente, $server_data=[], $no_head=false)
$agent_table .= $go_to_agent;
}
*/
// Title.
echo '<span id="fixedBottomHeadTitle" style="display:none">'.__('Agent information').'</span>';
// Print agent data toggle.
ui_toggle(
$agent_table,
'<span class="subsection_header_title">'.__('Agent data').'</span>',
'',
'',
false,
false,
'',
'white-box-content',
'white_table_graph',
'',
'',
false,
false,
false,
'',
'',
null,
null,
true
);
echo $agent_table;
// Advanced data.
$table = new StdClass();
@ -829,7 +817,6 @@ function treeview_printTable($id_agente, $server_data=[], $no_head=false)
// End of table advanced.
$table_advanced = html_print_table($table, true);
echo '<hr>';
ui_toggle(
$table_advanced,
'<span class="subsection_header_title">'.__('Advanced information').'</span>',
@ -838,8 +825,8 @@ function treeview_printTable($id_agente, $server_data=[], $no_head=false)
true,
false,
'',
'white-box-content',
'white_table_graph margin-top-20'
'white-box-content border-bottom-gray',
'white_table_graph margin-top-10 margin-bottom-10'
);
if ($config['agentaccess']) {
@ -850,7 +837,6 @@ function treeview_printTable($id_agente, $server_data=[], $no_head=false)
false
);
$access_graph .= '</div>';
echo '<hr>';
ui_toggle(
$access_graph,
'<span class="subsection_header_title">'.__('Agent access rate (24h)').'</span>',
@ -859,8 +845,8 @@ function treeview_printTable($id_agente, $server_data=[], $no_head=false)
true,
false,
'',
'white-box-content',
'white_table_graph margin-top-20'
'white-box-content border-bottom-gray',
'white_table_graph margin-top-10 margin-bottom-10'
);
}
@ -878,7 +864,6 @@ function treeview_printTable($id_agente, $server_data=[], $no_head=false)
$server_id
);
$events_graph .= '</div><br>';
echo '<hr>';
ui_toggle(
$events_graph,
'<span class="subsection_header_title">'.__('Events (24h)').'</span>',
@ -888,18 +873,18 @@ function treeview_printTable($id_agente, $server_data=[], $no_head=false)
false,
'',
'white-box-content',
'white_table_graph margin-top-20'
'white_table_graph margin-bottom-10 border-bottom-gray'
);
// Table network interfaces
// Table network interfaces.
$network_interfaces_by_agents = agents_get_network_interfaces([$agent]);
$network_interfaces = [];
if (!empty($network_interfaces_by_agents) && !empty($network_interfaces_by_agents[$id_agente])) {
if (empty($network_interfaces_by_agents) === false && empty($network_interfaces_by_agents[$id_agente]) === false) {
$network_interfaces = $network_interfaces_by_agents[$id_agente]['interfaces'];
}
if (!empty($network_interfaces)) {
if (empty($network_interfaces) === false) {
$table = new stdClass();
$table->id = 'agent_interface_info';
$table->class = 'databox';
@ -911,10 +896,10 @@ function treeview_printTable($id_agente, $server_data=[], $no_head=false)
$table->data = [];
foreach ($network_interfaces as $interface_name => $interface) {
if (!empty($interface['traffic'])) {
$permission = check_acl($config['id_user'], $agent['id_grupo'], 'RR');
if (empty($interface['traffic']) === false) {
$permission = (bool) check_acl($config['id_user'], $agent['id_grupo'], 'RR');
if ($permission) {
if ($permission === true) {
$params = [
'interface_name' => $interface_name,
'agent_id' => $id_agente,
@ -922,14 +907,14 @@ function treeview_printTable($id_agente, $server_data=[], $no_head=false)
'traffic_module_out' => $interface['traffic']['out'],
];
if (defined('METACONSOLE') && !empty($server_id)) {
if (is_metaconsole() === true && empty($server_id) === false) {
$params['server'] = $server_id;
}
$params_json = json_encode($params);
$params_encoded = base64_encode($params_json);
$url = ui_get_full_url('operation/agentes/interface_traffic_graph_win.php', false, false, false);
$graph_url = "$url?params=$params_encoded";
$graph_url = $url.'?params='.$params_encoded;
$win_handle = dechex(crc32($interface['status_module_id'].$interface_name));
$graph_link = "<a href=\"javascript:winopeng_var('".$graph_url."','".$win_handle."', 800, 480)\">";
@ -955,7 +940,7 @@ function treeview_printTable($id_agente, $server_data=[], $no_head=false)
$table->data[] = $data;
}
// End of table network interfaces
// End of table network interfaces.
$table_interfaces = html_print_table($table, true);
$table_interfaces .= '<br>';

View File

@ -2917,6 +2917,7 @@ function get_shape_status_set($type)
case STATUS_ALERT_NOT_FIRED_BALL:
case STATUS_ALERT_DISABLED_BALL:
$return = ['class' => 'status_small_balls'];
// $return = ['class' => 'status_balls'];
break;
default:

View File

@ -44,6 +44,7 @@
self._width = params.width || 300;
self._height = params.height || 400;
self._headTitle = params.headTitle || "";
self.setWidth = function(width) {
if (typeof width !== "number" || width <= 0)
@ -103,6 +104,11 @@
var headBody = $("<div></div>");
headBody.addClass("fixed-bottom-box-head-body");
headBody.append(
$(
'<span id="fixed-bottom-box-head-title" class="subsection_header_title"></span>'
)
);
var headClose = $("<span></span>");
headClose.addClass("fixed-bottom-box-head-close").click(function(event) {
self.close();

View File

@ -622,6 +622,10 @@ var TreeController = {
data: postData,
success: function(data, textStatus, xhr) {
callback(null, data);
console.log(data);
$("#fixed-bottom-box-head-title").html(
$("#fixedBottomHeadTitle").html()
);
},
error: function(xhr, textStatus, errorThrown) {
callback(errorThrown);
@ -730,11 +734,9 @@ var TreeController = {
typeof element.statusImageHTML != "undefined" &&
element.statusImageHTML.length > 0
) {
console.log("es aqui pollito agente");
var $statusImage = $(element.statusImageHTML);
$statusImage.addClass("node-icon");
$statusImage.addClass("node-status");
//$statusImage.addClass("agent-status");
$content.append($statusImage);
}
@ -906,7 +908,7 @@ var TreeController = {
element.elementDescription != ""
) {
$content.append(
'<span style="flex: 1 1 50%;">' +
'<span class="node-service-name" style="">' +
element.elementDescription +
"</span>"
);
@ -915,13 +917,15 @@ var TreeController = {
element.description != ""
) {
$content.append(
'<span style="flex: 1 1 50%;">' +
'<span class="node-service-name" style="flex: 1 1 50%;">' +
element.description +
"</span>"
);
} else {
$content.append(
'<span style="flex: 1 1 50%;">' + element.name + "</span>"
'<span class="node-service-name" style="flex: 1 1 50%;">' +
element.name +
"</span>"
);
}
} else {
@ -977,14 +981,14 @@ var TreeController = {
break;
case "module":
$content.addClass("module");
//console.log(element); $statusImage.addClass("node-status");
// Status image
if (
typeof element.statusImageHTML != "undefined" &&
element.statusImageHTML.length > 0
) {
var $statusImage = $(element.statusImageHTML);
$statusImage.addClass("module-status");
$statusImage.addClass("node-icon").addClass("node-status");
$content.append($statusImage);
} else {
@ -1047,7 +1051,6 @@ var TreeController = {
});
actionButtons.append(graphImageHistogram);
//$content.append(graphImageHistogram);
}
// Graph pop-up
@ -1101,7 +1104,6 @@ var TreeController = {
});
actionButtons.append($graphImage);
//$content.append($graphImage);
}
// Data pop-up
@ -1140,7 +1142,6 @@ var TreeController = {
});
actionButtons.append($dataImage);
//$content.append($dataImage);
}
}
}
@ -1176,7 +1177,6 @@ var TreeController = {
.css("cursor", "pointer");
actionButtons.append($alertsImage);
//$content.append($alertsImage);
}
$content.append(actionButtons);

View File

@ -2,12 +2,7 @@ div.fixed-bottom-box {
background: #fff;
height: -webkit-fill-available;
height: -moz-fill-available;
border-radius: 10px 10px 0 0;
-moz-border-radius: 10px 10px 0 0;
-webkit-border-radius: 10px 10px 0 0;
-o-border-radius: 10px 10px 0 0;
-ms-border-radius: 10px 10px 0 0;
-khtml-border-radius: 10px 10px 0 0;
border-left: 1px solid #aeaeae;
}
/* Overrides */
@ -29,8 +24,8 @@ div.fixed-bottom-box > div.fixed-bottom-box-head {
height: 40px;
line-height: 30px;
vertical-align: middle;
position: absolute;
border-bottom: 1px solid #aeaeae;
box-sizing: border-box;
border-bottom: 1px solid #eaeaea;
}
div.fixed-bottom-box
@ -38,10 +33,10 @@ div.fixed-bottom-box
> div.fixed-bottom-box-head-body {
height: inherit;
line-height: inherit;
color: #ffffff;
background-color: #fff;
font-weight: bold;
vertical-align: middle;
text-align: center;
border-bottom: 1px solid #eaeaea;
}
div.fixed-bottom-box
@ -54,7 +49,7 @@ div.fixed-bottom-box
background-position: center;
position: absolute;
top: 10px;
right: 20px;
right: 10px;
}
div.fixed-bottom-box
@ -94,5 +89,10 @@ div.fixed-bottom-box > div.fixed-bottom-box-content {
width: 100% !important;
height: 100% !important;
max-height: 100% !important;
border-left: 1px solid #aeaeae;
}
#fixed-bottom-box-head-title {
position: absolute;
top: 10px;
left: 20px;
}

View File

@ -10986,6 +10986,7 @@ pre.external_tools_output {
padding-bottom: 17px;
}
.border-bottom-gray,
.table-about .about-last-tr {
border-bottom: 1px solid #eaeaea;
}

View File

@ -5,7 +5,7 @@
width: 100%;
display: inline-block;
display: flex;
border-radius: 8px;
border-radius: 4px;
line-height: 24px;
font-size: 11pt;
}

View File

@ -8,9 +8,10 @@
flex-direction: row;
flex-wrap: wrap;
align-items: center;
width: calc(100% - 25px);
border: 1px solid #aeaeae;
border-radius: 8px;
width: calc(100% - 24px);
border: 1px solid #eaeaea;
border-radius: 4px;
background-color: #fff;
margin-bottom: 8px;
}
@ -33,7 +34,7 @@
width: 40px;
display: inline-block;
box-sizing: border-box;
border-right: 1px solid #aeaeae;
border-right: 1px solid #eaeaea;
}
.tree-node .node-icon .node-icon-container {
@ -62,7 +63,7 @@
.tree-group {
margin-left: 24px;
padding-top: 1px;
/*padding-top: 1px;*/
}
.tree-node {
@ -73,7 +74,7 @@
background-repeat: repeat-y;
*/
min-height: 26px;
margin-top: 8px;
margin-top: 1px;
}
div.tree-node {
@ -88,8 +89,9 @@ div.tree-node span {
background: 0 0;
}
.node-content {
border: 1px solid #aeaeae;
border-radius: 8px;
border: 1px solid #eaeaea;
background-color: #fff;
border-radius: 4px;
width: calc(100% - 50px);
box-sizing: border-box;
height: 40px;
@ -190,19 +192,30 @@ div.tree-node span {
flex: 1 1 80%;
position: relative;
font-weight: bold;
font-size: 11pt;
}
.tree-node > .node-content > .module-name-parent.module-only-caption {
top: 9px;
}
.node-service > .node-service-name {
flex: 1 1 50%;
font-size: 11pt;
font-weight: bold;
}
.tree-node > .node-content.module-only-caption > .module-name {
top: 7px;
}
.node-content.module:not(.module-only-caption) .module-name {
margin-left: 3.5em;
font-weight: normal;
}
/*.node-content.module.module-only-caption:not(:first-of-type) {
margin-top: 8px;
}*/
.tree-node > .node-content > .module-name-alias {
font-size: 12pt;
font-weight: normal;
@ -210,6 +223,9 @@ div.tree-node span {
margin-left: 3.3em;
}
.tree-node > .node-content.module-only-caption > .module-name-alias {
margin-left: 1em;
}
.tree-node > .node-content > .module-name-parent {
font-size: 12pt;
margin-left: 0.5em;
@ -269,10 +285,9 @@ div.tree-node span {
div#tree-controller-recipient {
text-align: left;
width: 65%;
/* width: 98%; */
width: calc((100% - 34%) - 20px);
margin-top: 10px;
margin-left: 10px;
margin-left: 20px;
}
.tree-controller-recipient {
@ -307,7 +322,7 @@ div#tree-controller-recipient {
flex-direction: row;
align-items: center;
width: calc(100% - 50px);
margin: 8px 0 0 8px;
margin: 1px 0 0 8px;
}
.node-content .module-button {
@ -331,5 +346,5 @@ div#tree-controller-recipient {
.tree-root > .tree-node {
margin-top: 0;
margin-bottom: 10px;
margin-bottom: 2px;
}

View File

@ -333,7 +333,7 @@ if (is_metaconsole() === true) {
}
enterprise_hook('close_meta_frame');
$infoHeadTitle = 'Sombra oscura';
?>
<?php if (is_metaconsole() === false) { ?>
@ -438,11 +438,10 @@ enterprise_hook('close_meta_frame');
break;
}
}
treeController.init({
recipient: $("div#tree-controller-recipient"),
detailRecipient: $.fixedBottomBox({ width: 400, height: window.innerHeight * 0.9 }),
detailRecipient: $.fixedBottomBox({ width: 400, height: window.innerHeight * 0.9, headTitle: "<?php echo $infoHeadTitle; ?>" }),
page: parameters['page'],
emptyMessage: "<?php echo __('No data found'); ?>",
foundMessage: foundMessage,