tyler.durden/pandorafms
1
0
Fork 0
mirror of https://github.com/pandorafms/pandorafms.git synced 2025-07-31 01:35:36 +02:00
Code Issues Packages Projects Releases Wiki Activity

Added basic chart 3

Browse Source
This commit is contained in:
Daniel Maya 2021-08-03 15:46:01 +02:00
parent 71fc8bd6e3
commit 318edda041
11 changed files with 193 additions and 49 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
pandora_console/include/functions_graph.php
View File

@ -829,6 +829,10 @@ function grafico_modulo_sparse($params)
$params['stacked'] = 0;
}
if (isset($params['basic_chart']) === false) {
$params['basic_chart'] = false;
}
$font_size = $config['font_size'];
// If is metaconsole set 10pt size value.

16
pandora_console/include/graphs/flot/pandora.flot.js
View File

@ -1006,6 +1006,7 @@ function pandoraFlotArea(
var force_integer = 0;
var divisor = params.divisor;
var maximum_y_axis = params.maximum_y_axis;
var basic_chart = params.basic_chart;
if (typeof divisor === "undefined") {
divisor = 1000;
@ -2010,11 +2011,8 @@ function pandoraFlotArea(
grid: {
hoverable: true,
clickable: true,
borderWidth: 1,
borderColor: "#C1C1C1",
backgroundColor: background_color,
color: grid_color,
autoHighlight: true
color: grid_color
},
xaxis: {
min: min_x,
@ -2054,6 +2052,16 @@ function pandoraFlotArea(
}
};
if (basic_chart === true) {
options.grid.borderWidth = 0;
options.grid.backgroundColor = "rgba(255,255,255,0)";
options.grid.autoHighlight = false;
options.xaxis.show = false;
options.xaxis.tickLength = 0;
options.yaxis.show = false;
options.yaxis.tickLength = 0;
}
if (typeof maximum_y_axis !== "undefined" && maximum_y_axis != 0) {
options.yaxis.max = maximum_y_axis;
}

1
pandora_console/include/rest-api/models/VisualConsole/Item.php
View File

@ -1778,6 +1778,7 @@ class Item extends CachedModel
'legendBackgroundColor',
'legendColor',
'titleColor',
'moduleNameColor',
]
),
null

113
pandora_console/include/rest-api/models/VisualConsole/Items/BasicChart.php
View File

@ -47,7 +47,10 @@ final class BasicChart extends Item
{
$return = parent::decode($data);
$return['type'] = BASIC_CHART;
$return['period'] = static::extractPeriod($data);
$return['period'] = $this->extractPeriod($data);
$return['value'] = $this->extractValue($data);
$return['status'] = $this->extractStatus($data);
$return['moduleNameColor'] = $this->extractModuleNameColor($data);
return $return;
}
@ -69,6 +72,60 @@ final class BasicChart extends Item
}
/**
* Extract value.
*
* @param array $data Unknown input data structure.
*
* @return mixed String representing value or null.
*/
private static function extractValue(array $data)
{
return static::notEmptyStringOr(
static::issetInArray(
$data,
['value']
),
'0'
);
}
/**
* Extract status value.
*
* @param array $data Unknown input data structure.
*
* @return mixed String representing status value or null.
*/
private static function extractStatus(array $data)
{
return static::notEmptyStringOr(
static::issetInArray(
$data,
['status']
),
COL_UNKNOWN
);
}
/**
* Extract label color value.
*
* @param array $data Unknown input data structure.
*
* @return mixed String representing the grid color (not empty) or null.
*/
private static function extractModuleNameColor(array $data): string
{
return static::notEmptyStringOr(
static::issetInArray($data, ['moduleNameColor', 'border_color']),
'#3f3f3f'
);
}
/**
* Fetch a vc item data structure from the database using a filter.
*
@ -134,7 +191,7 @@ final class BasicChart extends Item
*/
$width = (int) $data['width'];
$height = (int) $data['height'];
$height = ((int) $data['height'] * 0.6);
// Module graph.
if ($moduleId === null) {
@ -165,6 +222,7 @@ final class BasicChart extends Item
'show_title' => false,
'dashboard' => true,
'server_id' => $metaconsoleId,
'basic_chart' => true,
];
if ($imageOnly !== false) {
@ -179,40 +237,9 @@ final class BasicChart extends Item
\metaconsole_restore_db();
}
$module_data = db_get_row_sql(
'SELECT * FROM tagente_modulo
WHERE id_agente_modulo = '.$moduleId
);
$data['value'] = \modules_get_last_value($moduleId);
$data['status'] = \modules_get_color_status(modules_get_agentmodule_last_status($moduleId));
$data_module_graph = [];
$data_module_graph['history_db'] = db_search_in_history_db(
$date_array['start_date']
);
$data_module_graph['agent_name'] = modules_get_agentmodule_agent_name(
$moduleId
);
$data_module_graph['agent_alias'] = modules_get_agentmodule_agent_alias(
$moduleId
);
$data_module_graph['agent_id'] = $module_data['id_agente'];
$data_module_graph['module_name'] = $module_data['nombre'];
$data_module_graph['id_module_type'] = $module_data['id_tipo_modulo'];
$data_module_graph['module_type'] = modules_get_moduletype_name(
$data_module_graph['id_module_type']
);
$data_module_graph['uncompressed'] = is_module_uncompressed(
$data_module_graph['module_type']
);
$data_module_graph['w_min'] = $module_data['min_warning'];
$data_module_graph['w_max'] = $module_data['max_warning'];
$data_module_graph['w_inv'] = $module_data['warning_inverse'];
$data_module_graph['c_min'] = $module_data['min_critical'];
$data_module_graph['c_max'] = $module_data['max_critical'];
$data_module_graph['c_inv'] = $module_data['critical_inverse'];
$data_module_graph['unit'] = $module_data['unit'];
// hd($data_module_graph, true);
// hd($date_array, true);
return $data;
}
@ -228,7 +255,6 @@ final class BasicChart extends Item
*/
public static function getFormInputs(array $values): array
{
hd('entraaaaaaaaaaaaaa siiiiiiiiiii', true);
// Default values.
$values = static::getDefaultGeneralValues($values);
@ -236,7 +262,7 @@ final class BasicChart extends Item
$inputs = Item::getFormInputs($values);
if (is_array($inputs) !== true) {
throw new Exception(
throw new \Exception(
'[BasicChart]::getFormInputs parent class return is not an array'
);
}
@ -271,7 +297,6 @@ final class BasicChart extends Item
'label' => __('Module'),
'arguments' => [
'type' => 'autocomplete_module',
'fields' => $fields,
'name' => 'moduleId',
'selected' => $values['moduleId'],
'return' => true,
@ -293,6 +318,18 @@ final class BasicChart extends Item
],
];
// module name color.
$inputs[] = [
'label' => __('Module name color'),
'arguments' => [
'wrapper' => 'div',
'name' => 'moduleNameColor',
'type' => 'color',
'value' => $values['moduleNameColor'],
'return' => true,
],
];
// Inputs LinkedVisualConsole.
$inputsLinkedVisualConsole = self::inputsLinkedVisualConsole(
$values

5
pandora_console/include/rest-api/models/VisualConsole/View.php
View File

@ -529,9 +529,10 @@ class View extends \HTML
$data['agentAlias'] = \get_parameter('agentAlias');
$data['moduleId'] = \get_parameter('moduleId');
$data['period'] = \get_parameter('period');
$data['moduleNameColor'] = \get_parameter('moduleNameColor');
if ($itemId === 0) {
$data['height'] = 150;
$data['width'] = 300;
$data['height'] = 110;
$data['width'] = 375;
}
break;

10
pandora_console/include/visual-console-client/vc.main.css
View File

@ -547,6 +547,16 @@ div.module-graph {
justify-content: center;
}
div.basic-chart {
width: 100%;
height: 100%;
display: flex;
flex-direction: row;
flex-wrap: wrap;
align-items: flex-end;
justify-content: center;
}
div.module-graph .gauge_d3_class {
flex: 1 1 100px;
float: none !important;

2
pandora_console/include/visual-console-client/vc.main.css.map
View File

File diff suppressed because one or more lines are too long

4
pandora_console/include/visual-console-client/vc.main.min.js vendored
View File

File diff suppressed because one or more lines are too long

2
pandora_console/include/visual-console-client/vc.main.min.js.map
View File

File diff suppressed because one or more lines are too long

75
visual_console_client/src/items/BasicChart.ts
View File

@ -16,6 +16,9 @@ export type BasicChartProps = {
type: ItemType.BASIC_CHART;
html: string;
period: number | null;
value: number | null;
status: string;
moduleNameColor: string;
} & ItemProps &
WithModuleProps &
LinkedVisualConsoleProps;
@ -43,6 +46,11 @@ export function basicChartPropsDecoder(
? data.html
: decodeBase64(data.encodedHtml),
period: parseIntOr(data.period, null),
value: parseFloat(data.value),
status: stringIsEmpty(data.status) ? "#B2B2B2" : data.status,
moduleNameColor: stringIsEmpty(data.moduleNameColor)
? "#3f3f3f"
: data.moduleNameColor,
...modulePropsDecoder(data), // Object spread. It will merge the properties of the two objects.
...linkedVCPropsDecoder(data) // Object spread. It will merge the properties of the two objects.
};
@ -51,9 +59,41 @@ export function basicChartPropsDecoder(
export default class BasicChart extends Item<BasicChartProps> {
protected createDomElement(): HTMLElement {
const element = document.createElement("div");
const header = document.createElement("div");
header.style.height = "40%";
header.style.width = "100%";
header.style.display = "flex";
const moduleName = document.createElement("h2");
moduleName.textContent = this.props.moduleName;
moduleName.style.margin = "0";
moduleName.style.padding = "0";
moduleName.style.height = "100%";
moduleName.style.width = "80%";
moduleName.style.display = "flex";
moduleName.style.alignItems = "center";
moduleName.style.fontSize = `2.5vmin`;
moduleName.style.marginLeft = "3%";
moduleName.style.color = `${this.props.moduleNameColor}`;
header.appendChild(moduleName);
const moduleValue = document.createElement("h2");
moduleValue.textContent = `${this.props.value}`;
moduleValue.style.margin = "0";
moduleValue.style.padding = "0";
moduleValue.style.height = "100%";
moduleValue.style.width = "20%";
moduleValue.style.display = "flex";
moduleValue.style.alignItems = "center";
moduleValue.style.justifyContent = "center";
moduleValue.style.fontSize = `2.5vmin`;
moduleValue.style.color = this.props.status;
moduleValue.style.textDecoration = "none !important";
header.appendChild(moduleValue);
element.innerHTML = this.props.html;
element.className = "module-graph";
element.className = "basic-chart";
if (
this.props.agentDisabled === true ||
this.props.moduleDisabled === true
@ -86,12 +126,45 @@ export default class BasicChart extends Item<BasicChartProps> {
}
element.innerHTML = this.props.html;
element.insertBefore(header, element.firstChild);
return element;
}
protected updateDomElement(element: HTMLElement): void {
const header = document.createElement("div");
header.style.height = "40%";
header.style.width = "100%";
header.style.display = "flex";
const moduleName = document.createElement("h2");
moduleName.textContent = this.props.moduleName;
moduleName.style.margin = "0";
moduleName.style.padding = "0";
moduleName.style.height = "100%";
moduleName.style.width = "80%";
moduleName.style.display = "flex";
moduleName.style.alignItems = "center";
moduleName.style.fontSize = `2.5vmin`;
moduleName.style.marginLeft = "3%";
moduleName.style.color = `${this.props.moduleNameColor}`;
header.appendChild(moduleName);
const moduleValue = document.createElement("h2");
moduleValue.textContent = `${this.props.value}`;
moduleValue.style.margin = "0";
moduleValue.style.padding = "0";
moduleValue.style.height = "100%";
moduleValue.style.width = "20%";
moduleValue.style.display = "flex";
moduleValue.style.alignItems = "center";
moduleValue.style.justifyContent = "center";
moduleValue.style.fontSize = `2.5vmin`;
moduleValue.style.color = this.props.status;
header.appendChild(moduleValue);
element.innerHTML = this.props.html;
element.insertBefore(header, element.firstChild);
// Remove the overview graph.
const legendP = element.getElementsByTagName("p");

10
visual_console_client/src/main.css
View File

@ -547,6 +547,16 @@ div.module-graph {
justify-content: center;
}
div.basic-chart {
width: 100%;
height: 100%;
display: flex;
flex-direction: row;
flex-wrap: wrap;
align-items: flex-end;
justify-content: center;
}
div.module-graph .gauge_d3_class {
flex: 1 1 100px;
float: none !important;