Dashboard - Allow drag and drop in parent widgets (#7431)

* Dashboard - Allow drag and drop in parent widgets

* Update parent.php

* Update index.php

* Update config.php

* Update missed_calls.php

* Update recent_calls.php

* Update voicemails.php

* Update active_calls.php

* Update config.php

* Update config.php

* Update config.php

* Update voicemails.php

* Update parent.php

* Update voicemails.php

* Update parent.php

* Update parent.php

* Update index.php

---------

Co-authored-by: FusionPBX <markjcrane@gmail.com>
This commit is contained in:
Alex
2025-07-23 16:32:39 -07:00
committed by GitHub
parent f39448ba54
commit fc4b8a2652
9 changed files with 264 additions and 150 deletions

View File

@@ -70,11 +70,9 @@ $row_style["1"] = "row_style1";
//icon and count
echo "<div class='hud_content' ".($dashboard_details_state == "disabled" ?: "onclick=\"$('#hud_active_calls_details').slideToggle('fast'); toggle_grid_row_end('".$dashboard_name."')\"").">\n";
echo "<span class='hud_title'><a onclick=\"document.location.href='".PROJECT_PATH."/app/active_calls/active_calls.php'\">".$text['title']."</a></span>\n";
echo "<div class='hud_content'>\n";
echo "<div style='position: relative; display: inline-block;'>\n";
echo "<span class='hud_stat'><i class=\"fas ".$dashboard_icon." \"></i></span>\n";
echo "<span id='calls_active_count' name='calls_active_count' style=\"background-color: ".(!empty($dashboard_number_background_color) ? $dashboard_number_background_color : '#03c04a')."; color: ".(!empty($dashboard_number_text_color) ? $dashboard_number_text_color : '#ffffff')."; font-size: 12px; font-weight: bold; text-align: center; position: absolute; top: 23px; left: 24.5px; padding: 2px 7px 1px 7px; border-radius: 10px; white-space: nowrap;\">0</span>\n";
echo "</div>\n";
echo "<div style='position: relative; display: inline-block;'>\n";
echo "<span class='hud_stat'><i class=\"fas ".$dashboard_icon." \"></i></span>\n";
echo "<span id='calls_active_count' name='calls_active_count' style=\"background-color: ".(!empty($dashboard_number_background_color) ? $dashboard_number_background_color : '#03c04a')."; color: ".(!empty($dashboard_number_text_color) ? $dashboard_number_text_color : '#ffffff')."; font-size: 12px; font-weight: bold; text-align: center; position: absolute; top: 23px; left: 24.5px; padding: 2px 7px 1px 7px; border-radius: 10px; white-space: nowrap;\">0</span>\n";
echo "</div>\n";
echo "</div>\n";

View File

@@ -4,6 +4,7 @@ $array['dashboard'][$x]['dashboard_uuid'] = '9083305a-ebb4-4b67-bb9b-8c09cf03026
$array['dashboard'][$x]['dashboard_name'] = 'Call Center Agents';
$array['dashboard'][$x]['dashboard_path'] = 'call_centers/call_center_agents';
$array['dashboard'][$x]['dashboard_icon'] = '';
$array['dashboard'][$x]['dashboard_icon_color'] = '';
$array['dashboard'][$x]['dashboard_url'] = '';
$array['dashboard'][$x]['dashboard_target'] = '';
$array['dashboard'][$x]['dashboard_width'] = '';

View File

@@ -5,6 +5,7 @@ $array['dashboard'][$x]['dashboard_uuid'] = 'f1c722d5-b714-4fa2-9664-5f6d24d4466
$array['dashboard'][$x]['dashboard_name'] = 'Device Keys';
$array['dashboard'][$x]['dashboard_path'] = 'devices/device_keys';
$array['dashboard'][$x]['dashboard_icon'] = '';
$array['dashboard'][$x]['dashboard_icon_color'] = '';
$array['dashboard'][$x]['dashboard_url'] = '';
$array['dashboard'][$x]['dashboard_target'] = 'self';
$array['dashboard'][$x]['dashboard_width'] = '';

View File

@@ -105,12 +105,10 @@
//dashboard icon
if (!isset($dashboard_chart_type) || $dashboard_chart_type == "icon") {
echo "<span class='hud_content'>\n";
echo "<div style='position: relative; display: inline-block;'>\n";
echo " <div style='position: relative; display: inline-block;'>\n";
echo " <span class='hud_stat'><i class=\"fas ".$dashboard_icon." \"></i></span>\n";
echo " <span style=\"background-color: ".(!empty($dashboard_number_background_color) ? $dashboard_number_background_color : '#03c04a')."; color: ".(!empty($dashboard_number_text_color) ? $dashboard_number_text_color : '#ffffff')."; font-size: 12px; font-weight: bold; text-align: center; position: absolute; top: 23px; left: 24.5px; padding: 2px 7px 1px 7px; border-radius: 10px; white-space: nowrap;\">".$messages['new']."</span>\n";
echo " </div>\n";
echo "</span>";
}
echo "</div>\n";

View File

@@ -146,12 +146,10 @@
//dashboard icon
if (!isset($dashboard_chart_type) || $dashboard_chart_type == "icon") {
echo "<span class='hud_content'>\n";
echo "<div style='position: relative; display: inline-block;'>\n";
echo " <div style='position: relative; display: inline-block;'>\n";
echo " <span class='hud_stat'><i class=\"fas ".$dashboard_icon." \"></i></span>\n";
echo " <span style=\"background-color: ".(!empty($dashboard_number_background_color) ? $dashboard_number_background_color : '#EA4C46')."; color: ".(!empty($dashboard_number_text_color) ? $dashboard_number_text_color : '#ffffff')."; font-size: 12px; font-weight: bold; text-align: center; position: absolute; top: 23px; left: 24.5px; padding: 2px 7px 1px 7px; border-radius: 10px; white-space: nowrap;\">".$num_rows."</span>\n";
echo " </div>\n";
echo "</span>";
}
echo "</div>\n";

View File

@@ -144,12 +144,10 @@
//dashboard icon
if (!isset($dashboard_chart_type) || $dashboard_chart_type == "icon") {
echo "<div class='hud_content'>\n";
echo " <div style='position: relative; display: inline-block;'>\n";
echo " <span class='hud_stat'><i class=\"fas ".$dashboard_icon." \"></i></span>\n";
echo " <span style=\"background-color: ".(!empty($dashboard_number_background_color) ? $dashboard_number_background_color : '#417ed3')."; color: ".(!empty($dashboard_number_text_color) ? $dashboard_number_text_color : '#ffffff')."; font-size: 12px; font-weight: bold; text-align: center; position: absolute; top: 23px; left: 24.5px; padding: 2px 7px 1px 7px; border-radius: 10px; white-space: nowrap;\">".$num_rows."</span>\n";
echo " </div>\n";
echo "</div>";
}
echo "</div>\n";

View File

@@ -5,6 +5,7 @@ $array['dashboard'][$x]['dashboard_uuid'] = '3b0cbb2f-733d-4646-8332-7d108808f2f
$array['dashboard'][$x]['dashboard_name'] = 'Contacts';
$array['dashboard'][$x]['dashboard_path'] = 'dashboard/icon';
$array['dashboard'][$x]['dashboard_icon'] = 'fa-regular fa-address-card';
$array['dashboard'][$x]['dashboard_icon_color'] = '#0292ff';
$array['dashboard'][$x]['dashboard_url'] = '/core/contacts/contacts.php';
$array['dashboard'][$x]['dashboard_target'] = 'self';
$array['dashboard'][$x]['dashboard_width'] = '';

View File

@@ -1,3 +1,4 @@
<?php
/*
FusionPBX
@@ -105,10 +106,10 @@
$sql .= "dashboard_details_state, ";
$sql .= "dashboard_order, ";
$sql .= "cast(dashboard_enabled as text), ";
$sql .= "dashboard_description ";
$sql .= "dashboard_description, ";
$sql .= "dashboard_parent_uuid ";
$sql .= "from v_dashboard as d ";
$sql .= "where dashboard_enabled = 'true' ";
$sql .= "and dashboard_parent_uuid is null ";
$sql .= "and dashboard_uuid in (";
$sql .= " select dashboard_uuid from v_dashboard_groups where group_uuid in (";
$sql .= " ".$group_uuids_in." ";
@@ -123,13 +124,25 @@
//set the variables from the http values
if (isset($_POST["widget_order"])) {
$widgets = explode(",", $_POST["widget_order"]);
$dashboard_order = '0';
$x = 0;
foreach ($widgets as $widget) {
list($widget_id, $parent_id, $order) = explode("|", $widget);
$parent_uuid = null;
foreach ($dashboard as $row) {
$dashboard_name = trim(preg_replace("/[^a-z]/", '_', strtolower($row['dashboard_name'])),'_');
if ($widget == $dashboard_name) {
$dashboard_order = $dashboard_order + 10;
if ($widget_id == $dashboard_name) {
if (!empty($parent_id)) {
//find parent uuid
foreach ($dashboard as $parent_row) {
$parent_dashboard_name = trim(preg_replace("/[^a-z]/", '_', strtolower($parent_row['dashboard_name'])), '_');
if ($parent_dashboard_name === $parent_id) {
$parent_uuid = $parent_row['dashboard_uuid'];
break;
}
}
}
$array['dashboard'][$x]['dashboard_uuid'] = $row['dashboard_uuid'];
$array['dashboard'][$x]['dashboard_name'] = $row['dashboard_name'];
$array['dashboard'][$x]['dashboard_icon'] = $row['dashboard_icon'];
@@ -140,8 +153,10 @@
$array['dashboard'][$x]['dashboard_target'] = $row['dashboard_target'];
$array['dashboard'][$x]['dashboard_width'] = $row['dashboard_width'];
$array['dashboard'][$x]['dashboard_height'] = $row['dashboard_height'];
$array['dashboard'][$x]['dashboard_order'] = $dashboard_order;
$array['dashboard'][$x]['dashboard_order'] = $order;
$array['dashboard'][$x]['dashboard_parent_uuid'] = $parent_uuid;
$x++;
break;
}
}
}
@@ -386,6 +401,11 @@ foreach ($dashboard as $row) {
echo " height: 195px;\n";
echo "}\n";
}
if ($row['dashboard_column_span'] > 1) {
echo "#".$dashboard_name." div.parent_widgets.hud_content {\n";
echo " justify-content: space-evenly;\n";
echo "}\n";
}
}
?>
@@ -576,12 +596,13 @@ function toggle_grid_row_end_all() {
$widget_name = $dashboard_path_array[1];
$path_array = glob(dirname(__DIR__, 2).'/*/'.$application_name.'/resources/dashboard/'.$widget_name.'.php');
echo "<div class='widget' style='grid-row-end: span ".$dashboard_row_span.";' data-state='".$dashboard_details_state."' id='".$dashboard_name_id."' draggable='false'>\n";
if (file_exists($path_array[0])) {
include $path_array[0];
if (empty($row['dashboard_parent_uuid'])) {
echo "<div class='widget' style='grid-row-end: span ".$dashboard_row_span.";' data-state='".$dashboard_details_state."' id='".$dashboard_name_id."' draggable='false'>\n";
if (file_exists($path_array[0])) {
include $path_array[0];
}
echo "</div>\n";
}
echo "</div>\n";
$x++;
}
echo "</div>\n";
@@ -632,8 +653,9 @@ function toggle_grid_row_end_all() {
</style>
<script>
var widgets = document.getElementById('widgets');
var sortable;
const widgets = document.getElementById('widgets');
let sortable;
//make widgets draggable
function edit_mode(state) {
@@ -642,39 +664,85 @@ function toggle_grid_row_end_all() {
$('.hud_box').addClass('editable');
$('#btn_back, #btn_save').show();
$('div.widget').attr('draggable',true).addClass('editable');
$('div.parent_widget').attr('draggable',true).addClass('editable');
function update_widget_order() {
let widget_ids_list = [];
let order = 10;
document.querySelectorAll('#widgets > div.widget[id]').forEach(widget => {
const widget_id = widget.id;
//add the widgets to the list
widget_ids_list.push(`${widget_id}|null|${order}`);
order += 10;
//add the nested widgets to the list
const nested_container = widget.querySelector('.parent_widgets');
if (nested_container) {
nested_container.querySelectorAll(':scope > div.parent_widget[id]').forEach(nested => {
const child_id = nested.id;
widget_ids_list.push(`${child_id}|${widget_id}|${order}`);
order += 10;
});
}
});
document.getElementById('widget_order').value = widget_ids_list;
}
sortable = Sortable.create(widgets, {
group: 'nested',
animation: 150,
draggable: ".widget",
draggable: '.widget',
preventOnFilter: true,
ghostClass: 'ghost',
onSort: function (evt) {
let widget_ids = document.querySelectorAll("#widgets > div[id]");
let widget_ids_list = [];
for (let i = 0; i < widget_ids.length; i++) {
widget_ids_list.push(widget_ids[i].id);
}
document.getElementById('widget_order').value = widget_ids_list;
onSort: update_widget_order,
onAdd: function (evt) {
evt.item.classList.add('widget');
update_widget_order();
},
onRemove: function (evt) {
evt.item.classList.remove('widget');
update_widget_order();
},
});
// set initial widget order
let widget_ids = document.querySelectorAll("#widgets > div[id]");
let widget_ids_list = [];
for (let i = 0; i < widget_ids.length; i++) {
widget_ids_list.push(widget_ids[i].id);
}
document.getElementById('widget_order').value = widget_ids_list;
document.querySelectorAll('.parent_widgets').forEach(function(container) {
Sortable.create(container, {
group: 'nested',
animation: 150,
draggable: '.parent_widget',
ghostClass: 'ghost',
fallbackOnBody: true,
onSort: update_widget_order,
onAdd: function (evt) {
evt.item.classList.add('parent_widget');
update_widget_order();
},
onRemove: function (evt) {
evt.item.classList.remove('parent_widget');
update_widget_order();
},
});
});
}
else { // off
$('div.widget').attr('draggable',false).removeClass('editable');
$('div.parent_widget').attr('draggable',false).removeClass('editable');
$('.hud_box').removeClass('editable');
$('#btn_back, #btn_save').hide();
$('span#expand_contract, #btn_edit, #btn_add').show();
sortable.option('disabled', true);
document.querySelectorAll('.parent_widgets').forEach(el => {
const nested_sortable = Sortable.get(el);
if (nested_sortable) {
nested_sortable.option('disabled', true);
}
});
}
}

View File

@@ -23,6 +23,7 @@
$sql .= "dashboard_name, ";
$sql .= "dashboard_path, ";
$sql .= "dashboard_icon, ";
$sql .= "dashboard_icon_color, ";
$sql .= "dashboard_url, ";
$sql .= "dashboard_target, ";
$sql .= "dashboard_width, ";
@@ -38,9 +39,12 @@
$sql .= "dashboard_label_background_color_hover, ";
$sql .= "dashboard_number_text_color, ";
$sql .= "dashboard_number_text_color_hover, ";
$sql .= "dashboard_number_background_color, ";
$sql .= "dashboard_background_color, ";
$sql .= "dashboard_background_color_hover, ";
$sql .= "dashboard_detail_background_color, ";
$sql .= "dashboard_background_gradient_style, ";
$sql .= "dashboard_background_gradient_angle, ";
$sql .= "dashboard_column_span, ";
$sql .= "dashboard_row_span, ";
$sql .= "dashboard_details_state, ";
@@ -62,110 +66,125 @@
$window_parameters .= "width=".$dashboard_width.",height=".$dashboard_height;
}
//dashboard settings
echo "<style>\n";
foreach ($parent_widgets as $row) {
$dashboard_name = trim(preg_replace("/[^a-z]/", '_', strtolower($row['dashboard_name'])),'_');
if (!empty($row['dashboard_label_text_color']) || !empty($row['dashboard_label_background_color'])) {
echo "#".$dashboard_name." .hud_title {\n";
if (!empty($row['dashboard_label_text_color'])) { echo " color: ".$row['dashboard_label_text_color'].";\n"; }
if (!empty($row['dashboard_label_background_color'])) { echo " background-color: ".$row['dashboard_label_background_color'].";\n"; }
echo "}\n";
}
if (!empty($row['dashboard_label_text_color_hover']) || !empty($row['dashboard_label_background_color_hover'])) {
echo "#".$dashboard_name.":hover .hud_title {\n";
if (!empty($row['dashboard_label_text_color_hover'])) { echo " color: ".$row['dashboard_label_text_color_hover'].";\n"; }
if (!empty($row['dashboard_label_background_color_hover'])) { echo " background-color: ".$row['dashboard_label_background_color_hover'].";\n"; }
echo "}\n";
}
if (!empty($row['dashboard_number_text_color'])) {
echo "#".$dashboard_name." .hud_stat {\n";
echo " color: ".$row['dashboard_number_text_color'].";\n";
echo "}\n";
}
if (!empty($row['dashboard_number_text_color_hover'])) {
echo "#".$dashboard_name.":hover .hud_stat {\n";
echo " color: ".$row['dashboard_number_text_color_hover'].";\n";
echo "}\n";
}
if (!empty($row['dashboard_background_color'])) {
$background_color = json_decode($row['dashboard_background_color'], true);
echo "#".$dashboard_name." {\n";
echo " background: ".$background_color[0].";\n";
echo " background-image: linear-gradient(to right, ".$background_color[1]." 0%, ".$background_color[0]." 30%, ".$background_color[0]." 70%, ".$background_color[1]." 100%);\n";
echo "}\n";
}
if (!empty($row['dashboard_background_color_hover'])) {
$background_color_hover = json_decode($row['dashboard_background_color_hover'], true);
echo "#".$dashboard_name.":hover {\n";
echo " background: ".$background_color_hover[0].";\n";
echo " background-image: linear-gradient(to right, ".$background_color_hover[1]." 0%, ".$background_color_hover[0]." 30%, ".$background_color_hover[0]." 70%, ".$background_color_hover[1]." 100%);\n";
echo "}\n";
}
if (!empty($row['dashboard_detail_background_color'])) {
$detail_background_color = json_decode($row['dashboard_detail_background_color'], true);
echo "#".$dashboard_name." .hud_details {\n";
echo " background: ".$detail_background_color[0].";\n";
echo " background-image: linear-gradient(to right, ".$detail_background_color[1]." 0%, ".$detail_background_color[0]." 30%, ".$detail_background_color[0]." 70%, ".$detail_background_color[1]." 100%);\n";
echo "}\n";
}
if ($row['dashboard_label_enabled'] == 'false') {
echo "#".$dashboard_name." .hud_title {\n";
echo " display: none;\n";
echo "}\n";
echo "#".$dashboard_name." .hud_content {\n";
echo " align-content: center;\n";
echo "}\n";
}
if ($row['dashboard_path'] == "dashboard/icon") {
echo "#".$dashboard_name.",\n";
echo "#".$dashboard_name." span.hud_title,\n";
echo "#".$dashboard_name." span.hud_stat {\n";
echo " transition: .4s;\n";
echo " border-radius: 5px;\n";
echo "}\n";
}
switch ($row['dashboard_row_span']) {
case 1:
echo "#".$dashboard_name." .hud_content {\n";
echo " height: 89.5px;\n";
echo "}\n";
echo "#".$dashboard_name." .hud_stat {\n";
echo " line-height: 0;\n";
echo " font-size: 30pt;\n";
echo "}\n";
echo "#".$dashboard_name." .hud_chart {\n";
echo " height: 54px;\n";
echo " width: 180px;\n";
echo " padding-top: 0;\n";
echo "}\n";
echo "#".$dashboard_name." div.hud_content .fas {\n";
echo " line-height: 0;\n";
echo " font-size: 24pt;\n";
echo "}\n";
break;
case 2:
echo "#".$dashboard_name." .hud_content {\n";
echo " height: 195px;\n";
echo "}\n";
break;
case 3:
echo "#".$dashboard_name." .hud_content {\n";
echo " height: 300.5px;\n";
echo "}\n";
break;
}
?>
<style>
div.parent_widgets .hud_content {
align-content: center;
}
div.parent_widgets {
row-gap: 1rem;
}
div.parent_widget div.hud_box:first-of-type {
min-width: 120px;
flex: 0 0 33.3333%;
box-sizing: border-box;
box-shadow: none;
-webkit-transition: .1s;
-moz-transition: .1s;
transition: .1s;
}
div.parent_widget:has(i) div.hud_box {
max-height: 89.5px;
}
div.parent_widget:hover:has(i) div.hud_box,
div.parent_widget.editable:hover:has(i) div.hud_box {
transform: scale(1.05, 1.05);
-webkit-transition: .1s;
-moz-transition: .1s;
transition: .1s;
}
/* dashboard settings */
<?php
foreach ($parent_widgets as $row) {
$dashboard_name = trim(preg_replace("/[^a-z]/", '_', strtolower($row['dashboard_name'])),'_');
if (!empty($row['dashboard_icon_color'])) {
echo "#".$dashboard_name." .hud_stat:has(i) {\n";
echo " color: ".$row['dashboard_icon_color'].";\n";
echo "}\n";
}
echo "</style>\n";
if (!empty($row['dashboard_label_text_color']) || !empty($row['dashboard_label_background_color'])) {
echo "#".$dashboard_name." .hud_title {\n";
if (!empty($row['dashboard_label_text_color'])) { echo " color: ".$row['dashboard_label_text_color'].";\n"; }
if (!empty($row['dashboard_label_background_color'])) { echo " background-color: ".$row['dashboard_label_background_color'].";\n"; }
echo "}\n";
}
if (!empty($row['dashboard_label_text_color_hover']) || !empty($row['dashboard_label_background_color_hover'])) {
echo "#".$dashboard_name.":hover .hud_title {\n";
if (!empty($row['dashboard_label_text_color_hover'])) { echo " color: ".$row['dashboard_label_text_color_hover'].";\n"; }
if (!empty($row['dashboard_label_background_color_hover'])) { echo " background-color: ".$row['dashboard_label_background_color_hover'].";\n"; }
echo "}\n";
}
if (!empty($row['dashboard_number_text_color'])) {
echo "#".$dashboard_name." .hud_stat {\n";
echo " color: ".$row['dashboard_number_text_color'].";\n";
echo "}\n";
}
if (!empty($row['dashboard_number_text_color_hover'])) {
echo "#".$dashboard_name.":hover .hud_stat {\n";
echo " color: ".$row['dashboard_number_text_color_hover'].";\n";
echo "}\n";
}
if (!empty($row['dashboard_background_color'])) {
$background_color = json_decode($row['dashboard_background_color'], true);
echo "#".$dashboard_name." {\n";
echo " background: ".$background_color[0].";\n";
echo " background-image: linear-gradient(to right, ".$background_color[1]." 0%, ".$background_color[0]." 30%, ".$background_color[0]." 70%, ".$background_color[1]." 100%);\n";
echo "}\n";
}
if (!empty($row['dashboard_background_color_hover'])) {
$background_color_hover = json_decode($row['dashboard_background_color_hover'], true);
echo "#".$dashboard_name.":hover {\n";
echo " background: ".$background_color_hover[0].";\n";
echo " background-image: linear-gradient(to right, ".$background_color_hover[1]." 0%, ".$background_color_hover[0]." 30%, ".$background_color_hover[0]." 70%, ".$background_color_hover[1]." 100%);\n";
echo "}\n";
}
if (!empty($row['dashboard_detail_background_color'])) {
$detail_background_color = json_decode($row['dashboard_detail_background_color'], true);
echo "#".$dashboard_name." .hud_details {\n";
echo " background: ".$detail_background_color[0].";\n";
echo " background-image: linear-gradient(to right, ".$detail_background_color[1]." 0%, ".$detail_background_color[0]." 30%, ".$detail_background_color[0]." 70%, ".$detail_background_color[1]." 100%);\n";
echo "}\n";
}
if ($row['dashboard_label_enabled'] == 'false') {
echo "#".$dashboard_name." .hud_title {\n";
echo " display: none;\n";
echo "}\n";
echo "#".$dashboard_name." .hud_content {\n";
echo " align-content: center;\n";
echo "}\n";
}
if ($row['dashboard_path'] == "dashboard/icon") {
echo "#".$dashboard_name.",\n";
echo "#".$dashboard_name." span.hud_title,\n";
echo "#".$dashboard_name." span.hud_stat {\n";
echo " transition: .4s;\n";
echo " border-radius: 5px;\n";
echo "}\n";
}
}
?>
</style>
<?php
//include the dashboards
echo "<div class='hud_box' style='width: 100%; overflow: scroll;'>\n";
echo " <div class='hud_content'>\n";
echo "<div class='hud_box' style='overflow: scroll;'>\n";
echo " <div class='parent_widgets hud_content'>\n";
$x = 0;
foreach ($parent_widgets as $row) {
$dashboard_name = $row['dashboard_name'];
$dashboard_label = $row['dashboard_name'];
//set the variables
$dashboard_uuid = $row['dashboard_uuid'] ?? '';
$dashboard_name = $row['dashboard_name'] ?? '';
$dashboard_label = $row['dashboard_name'] ?? '';
$dashboard_icon = $row['dashboard_icon'] ?? '';
$dashboard_url = $row['dashboard_url'] ?? '';
$dashboard_target = $row['dashboard_target'] ?? '';
@@ -174,18 +193,50 @@
$dashboard_content = $row['dashboard_content'] ?? '';
$dashboard_content_text_align = $row['dashboard_content_text_align'] ?? '';
$dashboard_content_details = $row['dashboard_content_details'] ?? '';
//$dashboard_chart_type = $row['dashboard_chart_type'] ?? "doughnut";
$dashboard_label_text_color = $row['dashboard_label_text_color'] ?? $settings->get('theme', 'dashboard_label_text_color');
$dashboard_number_text_color = $row['dashboard_number_text_color'] ?? $settings->get('theme', 'dashboard_number_text_color');
//$dashboard_details_state = $row['dashboard_details_state'] ?? "expanded";
//$dashboard_row_span = $row['dashboard_row_span'] ?? 2;
//if ($dashboard_details_state == "expanded") {
// $dashboard_row_span += 3;
//}
$dashboard_chart_type = $row['dashboard_chart_type'] ?? "doughnut";
$dashboard_label_text_color = $row['dashboard_label_text_color'] ?? $settings->get('theme', 'dashboard_label_text_color', '');
$dashboard_number_text_color = $row['dashboard_number_text_color'] ?? $settings->get('theme', 'dashboard_number_text_color', '');
$dashboard_number_background_color = $row['dashboard_number_background_color'] ?? $settings->get('theme', 'dashboard_number_background_color', '');
$dashboard_details_state = $row['dashboard_details_state'] ?? "expanded";
$dashboard_row_span = $row['dashboard_row_span'] ?? 2;
echo "<div class='icon_widget' style='width: 120px; margin: 15px 15px 8px 15px;' id='".trim(preg_replace("/[^a-z]/", '_', strtolower($dashboard_name)),'_')."' onclick=\"window.open('".$dashboard_url."', '".$dashboard_target."', '".$window_parameters."')\" draggable='false'>\n";
echo " <span class='hud_title'>".escape($dashboard_label)."</span>";
echo " <span class='hud_stat' style='padding: 0 0 7px 0;'><i class=\"fas ".$dashboard_icon."\" style='font-size: 24pt;'></i></span>\n";
//define the regex patterns
$uuid_pattern = '/[^-A-Fa-f0-9]/';
$number_pattern = '/[^-A-Za-z0-9()*#]/';
$text_pattern = '/[^a-zA-Z0-9 _\-\/.\?:\=#\n]/';
//sanitize the data
$dashboard_uuid = preg_replace($uuid_pattern, '', $dashboard_uuid);
$dashboard_name = trim(preg_replace($text_pattern, '', $dashboard_name));
$dashboard_name_id = trim(preg_replace("/[^a-z_]/", '_', strtolower($dashboard_name)),'_');
$dashboard_icon = preg_replace($text_pattern, '', $dashboard_icon);
$dashboard_url = trim(preg_replace($text_pattern, '', $dashboard_url));
$dashboard_target = trim(preg_replace($text_pattern, '', $dashboard_target));
$dashboard_width = trim(preg_replace($text_pattern, '', $dashboard_width));
$dashboard_height = trim(preg_replace($text_pattern, '', $dashboard_height));
$dashboard_content = preg_replace($text_pattern, '', $dashboard_content);
$dashboard_content = str_replace("\n", '<br />', $dashboard_content);
$dashboard_content_text_align = trim(preg_replace($text_pattern, '', $dashboard_content_text_align));
$dashboard_content_details = preg_replace($text_pattern, '', $dashboard_content_details);
$dashboard_content_details = str_replace("\n", '<br />', $dashboard_content_details);
$dashboard_chart_type = preg_replace($text_pattern, '', $dashboard_chart_type);
$dashboard_label_text_color = preg_replace($text_pattern, '', $dashboard_label_text_color);
$dashboard_number_text_color = preg_replace($text_pattern, '', $dashboard_number_text_color);
$dashboard_number_background_color = preg_replace($text_pattern, '', $dashboard_number_background_color);
$dashboard_details_state = preg_replace($text_pattern, '', $dashboard_details_state);
$dashboard_row_span = preg_replace($number_pattern, '', $dashboard_row_span);
$dashboard_path = preg_replace($text_pattern, '', strtolower($row['dashboard_path']));
//find the application and widget
$dashboard_path_array = explode('/', $dashboard_path);
$application_name = $dashboard_path_array[0];
$parent_widget_name = $dashboard_path_array[1];
$path_array = glob(dirname(__DIR__, 4).'/*/'.$application_name.'/resources/dashboard/'.$parent_widget_name.'.php');
echo "<div class='parent_widget' onclick=\"".(!empty($dashboard_url && $dashboard_path == "dashboard/icon") ? "window.open('". $dashboard_url ."', '". $dashboard_target ."', '". $window_parameters ."')" : "")."\" id='".$dashboard_name_id."' draggable='false'>\n";
if (file_exists($path_array[0])) {
include $path_array[0];
}
echo "</div>\n";
}