|
|
@@ -81,6 +81,7 @@
|
|
|
$sql .= "dashboard_background_color, \n";
|
|
|
$sql .= "dashboard_detail_background_color, \n";
|
|
|
$sql .= "dashboard_column_span, \n";
|
|
|
+ $sql .= "dashboard_row_span, \n";
|
|
|
$sql .= "dashboard_details_state, \n";
|
|
|
$sql .= "dashboard_order, \n";
|
|
|
$sql .= "cast(dashboard_enabled as text), \n";
|
|
|
@@ -221,7 +222,7 @@
|
|
|
grid-gap: 1rem;
|
|
|
}
|
|
|
|
|
|
-div.hud_container {
|
|
|
+div.hud_content {
|
|
|
display: flex;
|
|
|
flex-wrap: wrap;
|
|
|
justify-content: center;
|
|
|
@@ -233,15 +234,17 @@ div.hud_chart {
|
|
|
padding-top: 7px;
|
|
|
}
|
|
|
|
|
|
-span.hud_stat { padding-bottom: 27px; }
|
|
|
-
|
|
|
/* Dashboard settings */
|
|
|
<?php
|
|
|
foreach($dashboard as $row) {
|
|
|
$dashboard_name = str_replace(" ", "_", strtolower($row['dashboard_name']));
|
|
|
$background_color = json_decode($row['dashboard_background_color'], true);
|
|
|
$detail_background_color = json_decode($row['dashboard_detail_background_color'], true);
|
|
|
- echo "#".$dashboard_name." .hud_box .hud_container {";
|
|
|
+ $dashboard_row_span = $row['dashboard_row_span'] ?? 2;
|
|
|
+ if (!isset($row['dashboard_row_span']) && in_array($dashboard_name, ["new_messages", "missed_calls", "recent_calls"])) {
|
|
|
+ $dashboard_row_span = 1;
|
|
|
+ }
|
|
|
+ echo "#".$dashboard_name." .hud_box .hud_content {";
|
|
|
echo " background: ".$background_color[0].";";
|
|
|
echo " background-image: linear-gradient(to right, ".$background_color[1]." 0%, ".$background_color[0]." 30%, ".$background_color[0]." 70%, ".$background_color[1]." 100%);";
|
|
|
echo "}";
|
|
|
@@ -256,6 +259,35 @@ span.hud_stat { padding-bottom: 27px; }
|
|
|
echo " background: ".$detail_background_color[0].";";
|
|
|
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%);";
|
|
|
echo "}";
|
|
|
+
|
|
|
+ switch ($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.1;\n";
|
|
|
+ echo " font-size: 30pt;\n";
|
|
|
+ echo "}\n";
|
|
|
+ echo "#".$dashboard_name." .hud_chart {\n";
|
|
|
+ echo " height: 50px;\n";
|
|
|
+ echo "}\n";
|
|
|
+ echo "#".$dashboard_name." div.hud_content .fas {\n";
|
|
|
+ echo " line-height: 0.1;\n";
|
|
|
+ echo " font-size: 30pt;\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;
|
|
|
+ }
|
|
|
}
|
|
|
?>
|
|
|
|
|
|
@@ -343,9 +375,17 @@ span.hud_stat { padding-bottom: 27px; }
|
|
|
|
|
|
<script>
|
|
|
function toggle_grid_row_end(dashboard_name) {
|
|
|
- var widget = document.getElementById(dashboard_name.toLowerCase().replace(/ /g, "_"));
|
|
|
+ var widget = document.getElementById(dashboard_name.toLowerCase().replace(/ /g, '_'));
|
|
|
+ var state = widget.getAttribute('data-state');
|
|
|
var current_row_end = widget.style.gridRowEnd;
|
|
|
- widget.style.gridRowEnd = (current_row_end == 'span 2') ? 'span 5' : 'span 2';
|
|
|
+
|
|
|
+ if (state == 'expanded') {
|
|
|
+ widget.style.gridRowEnd = 'span ' + (Number(current_row_end.replace('span ', '')) - 3);
|
|
|
+ widget.dataset.state = "contracted";
|
|
|
+ } else {
|
|
|
+ widget.style.gridRowEnd = 'span ' + (Number(current_row_end.replace('span ', '')) + 3);
|
|
|
+ widget.dataset.state = 'expanded';
|
|
|
+ }
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
@@ -361,10 +401,19 @@ function toggle_grid_row_end(dashboard_name) {
|
|
|
$dashboard_chart_type = $row['dashboard_chart_type'];
|
|
|
$dashboard_heading_text_color = $row['dashboard_heading_text_color'] ?? $settings->get('theme', 'dashboard_heading_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'];
|
|
|
- $grid_row_end = (!isset($dashboard_details_state) && in_array($dashboard_name, ["New Messages", "Missed Calls", "Recent Calls"]) ? "grid-row-end: span 2;" : ($dashboard_details_state == "expanded" || empty($dashboard_details_state) ? "grid-row-end: span 5;" : "grid-row-end: span 2;"));
|
|
|
+ $dashboard_details_state = $row['dashboard_details_state'] ?? "expanded";
|
|
|
+ $dashboard_row_span = $row['dashboard_row_span'] ?? 2;
|
|
|
+ if (!isset($row['dashboard_details_state']) && in_array($dashboard_name, ["New Messages", "Missed Calls", "Recent Calls"])) {
|
|
|
+ $dashboard_details_state = "hidden";
|
|
|
+ }
|
|
|
+ if ($dashboard_details_state == "expanded") {
|
|
|
+ $dashboard_row_span += 3;
|
|
|
+ }
|
|
|
+ if (!isset($row['dashboard_row_span']) && !isset($row['dashboard_details_state']) && in_array($dashboard_name, ["New Messages", "Missed Calls", "Recent Calls"])) {
|
|
|
+ $dashboard_row_span = 1;
|
|
|
+ }
|
|
|
|
|
|
- echo "<div class='widget' style='".$grid_row_end."' id='".str_replace(" ", "_", strtolower($row['dashboard_name']))."' draggable='false'>\n";
|
|
|
+ echo "<div class='widget' style='grid-row-end: span ".$dashboard_row_span.";' data-state='".$dashboard_details_state."' id='".str_replace(" ", "_", strtolower($dashboard_name))."' draggable='false'>\n";
|
|
|
include($row['dashboard_path']);
|
|
|
echo "</div>\n";
|
|
|
$x++;
|
Alex