mirror of
https://github.com/fusionpbx/fusionpbx.git
synced 2025-12-30 00:53:50 +00:00
Dashboard Edit - Replace chart type dropdown with icon buttons (#7462)
* Dashboard Edit - Replace chart type dropdown with buttons with icons * Update css.php * Update template.php
This commit is contained in:
@@ -826,20 +826,37 @@
|
||||
echo $text['label-dashboard_chart_type']."\n";
|
||||
echo "</td>\n";
|
||||
echo "<td class='vtable' style='position: relative;' align='left'>\n";
|
||||
echo " <select name='dashboard_chart_type' class='formfld'>\n";
|
||||
echo " <option value='doughnut'>".$text['label-doughnut']."</option>\n";
|
||||
if ($dashboard_chart_type == 'line' || $dashboard_path == 'system/system_cpu_status') {
|
||||
echo " <option value='line' ".($dashboard_chart_type == "line" ? "selected='selected'" : null).">".$text['label-line']."</option>\n";
|
||||
}
|
||||
echo " <div style='display: flex; gap: 8px;'>\n";
|
||||
echo " <label class='chart_type_button' title='".$text['label-number']."'>\n";
|
||||
echo " <input type='radio' style='display: none;' name='dashboard_chart_type' value='number' ".($dashboard_chart_type == 'number' ? 'checked' : '').">\n";
|
||||
echo " <i class='fas fa-hashtag'></i>\n";
|
||||
echo " </label>\n";
|
||||
echo " <label class='chart_type_button' title='".$text['label-doughnut']."'>\n";
|
||||
echo " <input type='radio' style='display: none;' name='dashboard_chart_type' value='doughnut' ".($dashboard_chart_type == 'doughnut' ? 'checked' : '').">\n";
|
||||
echo " <i class='fas fa-chart-pie'></i>\n";
|
||||
echo " </label>\n";
|
||||
if ($dashboard_chart_type == "icon" || in_array($dashboard_path, ['active_calls/active_calls', 'domains/domains', 'xml_cdr/missed_calls', 'voicemails/voicemails', 'xml_cdr/recent_calls', 'registrations/registrations'])) {
|
||||
echo " <option value='icon' ".($dashboard_chart_type == "icon" ? "selected='selected'" : null).">".$text['label-icon']."</option>\n";
|
||||
echo " <label class='chart_type_button' title='".$text['label-icon']."'>\n";
|
||||
echo " <input type='radio' style='display: none;' name='dashboard_chart_type' value='icon' ".($dashboard_chart_type == 'icon' ? 'checked' : '').">\n";
|
||||
echo " <div style='position: relative; display: inline-block;'>\n";
|
||||
echo " <i class='fas fa-envelope'></i>\n";
|
||||
echo " <span style=\"background: #4099FF; color: #ffffff; font-size: 9px; font-weight: bold; text-align: center; position: absolute; top: 11px; left: 14px; padding: 0px 4px; border-radius: 10px; white-space: nowrap;\">1</span>\n";
|
||||
echo " </div>\n";
|
||||
echo " </label>\n";
|
||||
}
|
||||
if ($dashboard_chart_type == 'line' || $dashboard_path == 'system/system_cpu_status') {
|
||||
echo " <label class='chart_type_button' title='".$text['label-line']."'>\n";
|
||||
echo " <input type='radio' style='display: none;' name='dashboard_chart_type' value='line' ".($dashboard_chart_type == 'line' ? 'checked' : '').">\n";
|
||||
echo " <i class='fas fa-chart-line'></i>\n";
|
||||
echo " </label>\n";
|
||||
}
|
||||
echo " <option value='number' ".($dashboard_chart_type == "number" ? "selected='selected'" : null).">".$text['label-number']."</option>\n";
|
||||
if ($dashboard_chart_type == "progress_bar" || $dashboard_path == "system/system_status") {
|
||||
echo " <option value='progress_bar' ".($dashboard_chart_type == "progress_bar" ? "selected='selected'" : null).">".$text['label-progress_bar']."</option>\n";
|
||||
echo " <label class='chart_type_button' title='".$text['label-progress_bar']."'>\n";
|
||||
echo " <input type='radio' style='display: none;' name='dashboard_chart_type' value='progress_bar' ".($dashboard_chart_type == 'progress_bar' ? 'checked' : '').">\n";
|
||||
echo " <i class='fas fa-bars-progress'></i>\n";
|
||||
echo " </label>\n";
|
||||
}
|
||||
echo " </select>\n";
|
||||
echo "<br />\n";
|
||||
echo " </div>\n";
|
||||
echo $text['description-dashboard_chart_type']."\n";
|
||||
echo "</td>\n";
|
||||
echo "</tr>\n";
|
||||
|
||||
@@ -3206,6 +3206,30 @@ else { //default: white
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
/* DASHBOARD EDIT **********************************************************************/
|
||||
|
||||
.chart_type_button {
|
||||
padding: 8px 16px;
|
||||
border: 1px solid rgba(0,0,0,0.1);
|
||||
border-radius: 5px;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.chart_type_button:has(input:checked) {
|
||||
background-color: #F0F4FE;
|
||||
border-color: #8EACF9;
|
||||
}
|
||||
|
||||
.chart_type_button:hover {
|
||||
background-color: rgba(0,0,0,0.03);
|
||||
}
|
||||
|
||||
.chart_type_button i {
|
||||
font-size: 15pt;
|
||||
}
|
||||
|
||||
/* PLUGINS ********************************************************************/
|
||||
|
||||
/* bootstrap colorpicker */
|
||||
|
||||
@@ -20,7 +20,7 @@
|
||||
<link rel='stylesheet' type='text/css' href='{$project_path}/resources/bootstrap/css/bootstrap-tempusdominus.min.css.php'>
|
||||
<link rel='stylesheet' type='text/css' href='{$project_path}/resources/bootstrap/css/bootstrap-colorpicker.min.css.php'>
|
||||
<link rel='stylesheet' type='text/css' href='{$project_path}/resources/fontawesome/css/all.min.css.php'>
|
||||
<link rel='stylesheet' type='text/css' href='{$project_path}/themes/default/css.php?updated=202508060330'>
|
||||
<link rel='stylesheet' type='text/css' href='{$project_path}/themes/default/css.php?updated=202508190400'>
|
||||
{*//link to custom css file *}
|
||||
{if !empty($settings.theme.custom_css)}
|
||||
<link rel='stylesheet' type='text/css' href='{$settings.theme.custom_css}'>
|
||||
|
||||
Reference in New Issue
Block a user