[Redizajn 1KA] Status --> Parapodatki - v1

This commit is contained in:
tejagerjovic 2022-04-01 05:25:53 +02:00
parent 99a48cdc1f
commit 4c20e27c2f
4 changed files with 130 additions and 45 deletions

View File

@ -39,13 +39,13 @@ class SurveyParaGraph{
$paraData = $this->collectParaGraphDataNew(); $paraData = $this->collectParaGraphDataNew();
echo '<p>'.$lang['srv_para_graph_text'].'</p>'; //echo '<p>'.$lang['srv_para_graph_text'].'</p>';
// PC, tablica, mobi // PC, tablica, mobi
echo '<fieldset><legend>'.$lang['srv_para_graph_device'].'</legend>'; echo '<fieldset><legend>'.$lang['srv_para_graph_device'].'</legend>';
// Filter po napravi /* Filter po napravi
echo '<div style="margin:5px 0 15px 5px;">'; echo '<div style="margin:5px 0 15px 5px;">';
echo '<label>'.$lang['srv_analiza_filter'].': </label>'; echo '<label>'.$lang['srv_analiza_filter'].': </label>';
echo '<label for="paraGraph_filter_pc"><input type="checkbox" id="paraGraph_filter_pc" '.($this->paraGraph_filter['pc']==1 ? ' checked="checked"' : '').' onClick="changeParaGraphFilter();">'.$lang['srv_para_graph_device0'].'</label>'; echo '<label for="paraGraph_filter_pc"><input type="checkbox" id="paraGraph_filter_pc" '.($this->paraGraph_filter['pc']==1 ? ' checked="checked"' : '').' onClick="changeParaGraphFilter();">'.$lang['srv_para_graph_device0'].'</label>';
@ -53,32 +53,43 @@ class SurveyParaGraph{
echo ' <label for="paraGraph_filter_tablet"><input type="checkbox" id="paraGraph_filter_tablet" '.($this->paraGraph_filter['tablet']==1 ? ' checked="checked"' : '').' onClick="changeParaGraphFilter();">'.$lang['srv_para_graph_device2'].'</label>'; echo ' <label for="paraGraph_filter_tablet"><input type="checkbox" id="paraGraph_filter_tablet" '.($this->paraGraph_filter['tablet']==1 ? ' checked="checked"' : '').' onClick="changeParaGraphFilter();">'.$lang['srv_para_graph_device2'].'</label>';
echo ' <label for="paraGraph_filter_robot"><input type="checkbox" id="paraGraph_filter_robot" '.($this->paraGraph_filter['robot']==1 ? ' checked="checked"' : '').' onClick="changeParaGraphFilter();">'.$lang['srv_para_graph_device3'].'</label>'; echo ' <label for="paraGraph_filter_robot"><input type="checkbox" id="paraGraph_filter_robot" '.($this->paraGraph_filter['robot']==1 ? ' checked="checked"' : '').' onClick="changeParaGraphFilter();">'.$lang['srv_para_graph_device3'].'</label>';
echo '&nbsp;&nbsp;&nbsp;<label>('.$lang['srv_para_graph_filteredCnt'].' '.$paraData['allCount'].')</label>'; echo '&nbsp;&nbsp;&nbsp;<label>('.$lang['srv_para_graph_filteredCnt'].' '.$paraData['allCount'].')</label>';
echo '</div>'; echo '</div>';/*/
echo '<table style="width:100%">'; echo '<table class="parapodatki_table">';
echo '<tr>'; echo '<tr>';
echo '<th nowrap>'.$lang['srv_para_graph_device0'].'</th>'; echo '<th>'.$lang['srv_para_graph_device'].'</th>';
echo '<td style="width:100%">'; echo '<th>'.$lang['srv_stevilo_enot'].'</th>';
echo ' <div class="graph_lb" style="text-align: right; float: left; width: '.($paraData['allCount']>0 ? $paraData['pcCount']/$paraData['allCount']*85 : '0').'%">&nbsp;</div>'; echo '</tr>';
echo ' <span style="display: block; margin: auto auto auto 5px; float: left">'.$paraData['pcCount'].'</span></span>';
echo '<tr>';
echo '<td>'.$lang['srv_para_graph_device0'].'</td>';
echo '<td class="graph_cell">';
echo '<div class="graph_cell">';
echo ' <div class="graph_full" style="width: '.($paraData['allCount']>0 ? $paraData['pcCount']/$paraData['allCount']*85 : '0').'%">&nbsp;</div>';
echo ' <span >'.$paraData['pcCount'].'</span>';
echo '</div>';
echo '</td>'; echo '</td>';
echo '</tr>'; echo '</tr>';
echo '<tr>'; echo '<tr>';
echo '<th nowrap>'.$lang['srv_para_graph_device1'].'</th>'; echo '<td>'.$lang['srv_para_graph_device1'].'</td>';
echo '<td style="width:100%">'; echo '<td class="graph_cell">';
echo ' <div class="graph_lb" style="text-align: right; float: left; width: '.($paraData['allCount']>0 ? $paraData['mobiCount']/$paraData['allCount']*85 : '0').'%">&nbsp;</div>'; echo '<div class="graph_cell">';
echo ' <span style="display: block; margin: auto auto auto 5px; float: left">'.$paraData['mobiCount'].'</span></span>'; echo ' <div class="graph_full" style="width: '.($paraData['allCount']>0 ? $paraData['mobiCount']/$paraData['allCount']*85 : '0').'%">&nbsp;</div>';
echo ' <span >'.$paraData['mobiCount'].'</span>';
echo '</div';
echo '</td>'; echo '</td>';
echo '</tr>'; echo '</tr>';
echo '<tr>'; echo '<tr>';
echo '<th nowrap>'.$lang['srv_para_graph_device2'].'</th>'; echo '<td>'.$lang['srv_para_graph_device2'].'</td>';
echo '<td style="width:100%">'; echo '<td class="graph_cell">';
echo ' <div class="graph_lb" style="text-align: right; float: left; width: '.($paraData['allCount']>0 ? $paraData['tabletCount']/$paraData['allCount']*85 : '0').'%">&nbsp;</div>'; echo '<div class="graph_cell">';
echo ' <span style="display: block; margin: auto auto auto 5px; float: left">'.$paraData['tabletCount'].'</span></span>'; echo ' <div class="graph_full" style="width: '.($paraData['allCount']>0 ? $paraData['tabletCount']/$paraData['allCount']*85 : '0').'%">&nbsp;</div>';
echo ' <span >'.$paraData['tabletCount'].'</span>';
echo '</div';
echo '</td>'; echo '</td>';
echo '</tr>'; echo '</tr>';
@ -87,7 +98,7 @@ class SurveyParaGraph{
echo '<th nowrap>'.$lang['srv_para_graph_device3'].'</th>'; echo '<th nowrap>'.$lang['srv_para_graph_device3'].'</th>';
echo '<td style="width:100%">'; echo '<td style="width:100%">';
echo ' <div class="graph_lb" style="text-align: right; float: left; width: '.($paraData['allCount']>0 ? $paraData['robotCount']/$paraData['allCount']*85 : '0').'%">&nbsp;</div>'; echo ' <div class="graph_lb" style="text-align: right; float: left; width: '.($paraData['allCount']>0 ? $paraData['robotCount']/$paraData['allCount']*85 : '0').'%">&nbsp;</div>';
echo ' <span style="display: block; margin: auto auto auto 5px; float: left">'.$paraData['robotCount'].'</span></span>'; echo ' <span >'.$paraData['robotCount'].'</span>';
echo '</td>'; echo '</td>';
echo '</tr>'; echo '</tr>';
@ -102,7 +113,12 @@ class SurveyParaGraph{
// Browser // Browser
echo '<fieldset><legend>'.$lang['srv_para_graph_browser'].'</legend>'; echo '<fieldset><legend>'.$lang['srv_para_graph_browser'].'</legend>';
echo '<table style="width:100%">'; echo '<table class="parapodatki_table">';
echo '<tr>';
echo '<th>'.$lang['srv_para_graph_browser'].'</th>';
echo '<th>'.$lang['srv_stevilo_enot'].'</th>';
echo '</tr>';
if(count($paraData['browser']) > 0){ if(count($paraData['browser']) > 0){
if(count($paraData['browser']) > 1) if(count($paraData['browser']) > 1)
@ -112,10 +128,12 @@ class SurveyParaGraph{
if($key != $lang['srv_para_graph_other_slo'] && $key != $lang['srv_para_graph_other_ang']){ if($key != $lang['srv_para_graph_other_slo'] && $key != $lang['srv_para_graph_other_ang']){
echo '<tr>'; echo '<tr>';
echo '<th nowrap>'.$key.'</th>'; echo '<td>'.$key.'</td>';
echo '<td style="width:100%">'; echo '<td class="graph_cell">';
echo ' <div class="graph_lb" style="text-align: right; float: left; width: '.($paraData['allCount']>0 ? $browserCnt/$paraData['allCount']*85 : '0').'%">&nbsp;</div>'; echo '<div class="graph_cell">';
echo ' <span style="display: block; margin: auto auto auto 5px; float: left">'.$browserCnt.'</span></span>'; echo ' <div class="graph_full" style="width: '.($paraData['allCount']>0 ? $browserCnt/$paraData['allCount']*85 : '0').'%">&nbsp;</div>';
echo ' <span >'.$browserCnt.'</span>';
echo '</div';
echo '</td>'; echo '</td>';
echo '</tr>'; echo '</tr>';
} }
@ -123,20 +141,24 @@ class SurveyParaGraph{
if(isset($paraData['browser'][$lang['srv_para_graph_other_slo']]) && $paraData['browser'][$lang['srv_para_graph_other_slo']] > 0){ if(isset($paraData['browser'][$lang['srv_para_graph_other_slo']]) && $paraData['browser'][$lang['srv_para_graph_other_slo']] > 0){
echo '<tr>'; echo '<tr>';
echo '<th nowrap>'.$lang['srv_para_graph_other'].'</th>'; echo '<td>'.$lang['srv_para_graph_other'].'</td>';
echo '<td style="width:100%">'; echo '<td class="graph_cell">';
echo ' <div class="graph_lb" style="text-align: right; float: left; width: '.($paraData['allCount']>0 ? $paraData['browser'][$lang['srv_para_graph_other_slo']]/$paraData['allCount']*85 : '0').'%">&nbsp;</div>'; echo '<div class="graph_cell">';
echo ' <span style="display: block; margin: auto auto auto 5px; float: left">'.$paraData['browser'][$lang['srv_para_graph_other_slo']].'</span></span>'; echo ' <div class="graph_full" style="width: '.($paraData['allCount']>0 ? $paraData['browser'][$lang['srv_para_graph_other_slo']]/$paraData['allCount']*85 : '0').'%">&nbsp;</div>';
echo ' <span >'.$paraData['browser'][$lang['srv_para_graph_other_slo']].'</span>';
echo '</div';
echo '</td>'; echo '</td>';
echo '</tr>'; echo '</tr>';
} }
if(isset($paraData['browser'][$lang['srv_para_graph_other_ang']]) && $paraData['browser'][$lang['srv_para_graph_other_ang']] > 0){ if(isset($paraData['browser'][$lang['srv_para_graph_other_ang']]) && $paraData['browser'][$lang['srv_para_graph_other_ang']] > 0){
echo '<tr>'; echo '<tr>';
echo '<th nowrap>'.$lang['srv_para_graph_other'].'</th>'; echo '<td>'.$lang['srv_para_graph_other'].'</td>';
echo '<td style="width:100%">'; echo '<td class="graph_cell">';
echo ' <div class="graph_lb" style="text-align: right; float: left; width: '.($paraData['allCount']>0 ? $paraData['browser'][$lang['srv_para_graph_other_ang']]/$paraData['allCount']*85 : '0').'%">&nbsp;</div>'; echo '<div class="graph_cell">';
echo ' <span style="display: block; margin: auto auto auto 5px; float: left">'.$paraData['browser'][$lang['srv_para_graph_other_ang']].'</span></span>'; echo ' <div class="graph_full" style="width: '.($paraData['allCount']>0 ? $paraData['browser'][$lang['srv_para_graph_other_ang']]/$paraData['allCount']*85 : '0').'%">&nbsp;</div>';
echo ' <span >'.$paraData['browser'][$lang['srv_para_graph_other_ang']].'</span>';
echo '</div';
echo '</td>'; echo '</td>';
echo '</tr>'; echo '</tr>';
} }
@ -153,7 +175,12 @@ class SurveyParaGraph{
// Operacijski sistem // Operacijski sistem
echo '<fieldset><legend>'.$lang['srv_para_graph_os'].'</legend>'; echo '<fieldset><legend>'.$lang['srv_para_graph_os'].'</legend>';
echo '<table style="width:100%">'; echo '<table class="parapodatki_table">';
echo '<tr>';
echo '<th>'.$lang['srv_para_graph_os'].'</th>';
echo '<th>'.$lang['srv_stevilo_enot'].'</th>';
echo '</tr>';
if(count($paraData['os']) > 0){ if(count($paraData['os']) > 0){
if(count($paraData['os']) > 1) if(count($paraData['os']) > 1)
@ -163,10 +190,12 @@ class SurveyParaGraph{
if($key != $lang['srv_para_graph_other_slo'] && $key != $lang['srv_para_graph_other_ang']){ if($key != $lang['srv_para_graph_other_slo'] && $key != $lang['srv_para_graph_other_ang']){
echo '<tr>'; echo '<tr>';
echo '<th nowrap>'.$key.'</th>'; echo '<td>'.$key.'</td>';
echo '<td style="width:100%">'; echo '<td class="graph_cell">';
echo ' <div class="graph_lb" style="text-align: right; float: left; width: '.($paraData['allCount']>0 ? $osCnt/$paraData['allCount']*85 : '0').'%">&nbsp;</div>'; echo '<div class="graph_cell">';
echo ' <span style="display: block; margin: auto auto auto 5px; float: left">'.$osCnt.'</span></span>'; echo ' <div class="graph_full" style="width: '.($paraData['allCount']>0 ? $osCnt/$paraData['allCount']*85 : '0').'%">&nbsp;</div>';
echo ' <span >'.$osCnt.'</span>';
echo '</div>';
echo '</td>'; echo '</td>';
echo '</tr>'; echo '</tr>';
} }
@ -174,20 +203,24 @@ class SurveyParaGraph{
if(isset($paraData['os'][$lang['srv_para_graph_other_slo']]) && $paraData['os'][$lang['srv_para_graph_other_slo']] > 0){ if(isset($paraData['os'][$lang['srv_para_graph_other_slo']]) && $paraData['os'][$lang['srv_para_graph_other_slo']] > 0){
echo '<tr>'; echo '<tr>';
echo '<th nowrap>'.$lang['srv_para_graph_other'].'</th>'; echo '<td>'.$lang['srv_para_graph_other'].'</td>';
echo '<td style="width:100%">'; echo '<td class="graph_cell">';
echo ' <div class="graph_lb" style="text-align: right; float: left; width: '.($paraData['allCount']>0 ? $paraData['os'][$lang['srv_para_graph_other_slo']]/$paraData['allCount']*85 : '0').'%">&nbsp;</div>'; echo '<div class="graph_cell">';
echo ' <span style="display: block; margin: auto auto auto 5px; float: left">'.$paraData['os'][$lang['srv_para_graph_other_slo']].'</span></span>'; echo ' <div class="graph_full" style="width: '.($paraData['allCount']>0 ? $paraData['os'][$lang['srv_para_graph_other_slo']]/$paraData['allCount']*85 : '0').'%">&nbsp;</div>';
echo ' <span >'.$paraData['os'][$lang['srv_para_graph_other_slo']].'</span>';
echo '</div>';
echo '</td>'; echo '</td>';
echo '</tr>'; echo '</tr>';
} }
if(isset($paraData['os'][$lang['srv_para_graph_other_ang']]) && $paraData['os'][$lang['srv_para_graph_other_ang']] > 0){ if(isset($paraData['os'][$lang['srv_para_graph_other_ang']]) && $paraData['os'][$lang['srv_para_graph_other_ang']] > 0){
echo '<tr>'; echo '<tr>';
echo '<th nowrap>'.$lang['srv_para_graph_other'].'</th>'; echo '<td>'.$lang['srv_para_graph_other'].'</td>';
echo '<td style="width:100%">'; echo '<td class="graph_cell">';
echo ' <div class="graph_lb" style="text-align: right; float: left; width: '.($paraData['allCount']>0 ? $paraData['os'][$lang['srv_para_graph_other_ang']]/$paraData['allCount']*85 : '0').'%">&nbsp;</div>'; echo '<div class="graph_cell">';
echo ' <span style="display: block; margin: auto auto auto 5px; float: left">'.$paraData['os'][$lang['srv_para_graph_other_ang']].'</span></span>'; echo ' <div class="graph_full" style="width: '.($paraData['allCount']>0 ? $paraData['os'][$lang['srv_para_graph_other_ang']]/$paraData['allCount']*85 : '0').'%">&nbsp;</div>';
echo ' <span >'.$paraData['os'][$lang['srv_para_graph_other_ang']].'</span>';
echo '</div>';
echo '</td>'; echo '</td>';
echo '</tr>'; echo '</tr>';
} }

View File

@ -72,7 +72,7 @@ class CrossRoad {
$first_action = NAVI_STATUS; $first_action = NAVI_STATUS;
$second_action = NAVI_STATUS_OSNOVNI; $second_action = NAVI_STATUS_OSNOVNI;
$layout_width = 'wide'; $layout_width = 'narrow';
if ($_GET['m'] == 'advanced') if ($_GET['m'] == 'advanced')
$layout_width = 'fullwidth'; $layout_width = 'fullwidth';

View File

@ -23321,6 +23321,28 @@ div.page_diagnostics table.aktivnost_paradata_table td.graph_cell div.graph_cell
margin-right: 8px; margin-right: 8px;
} }
table.parapodatki_table {
width: 100%;
white-space: nowrap;
font-size: 14px;
}
table.parapodatki_table td.graph_cell {
width: 100%;
}
table.parapodatki_table td.graph_cell div.graph_cell {
display: flex;
flex-direction: row;
align-items: center;
}
table.parapodatki_table td.graph_cell div.graph_cell .graph_full {
background-color: #1E88E5;
height: 16px;
margin-right: 8px;
}
table.parapodatki_table td.graph_cell div.graph_cell span {
font-size: inherit;
}
div.page_diagnostics .time_span_container { div.page_diagnostics .time_span_container {
position: relative; position: relative;
height: 160px; height: 160px;

View File

@ -1,4 +1,3 @@
div.page_diagnostics { div.page_diagnostics {
//Parapodatki //Parapodatki
@ -21,4 +20,35 @@ div.page_diagnostics {
} }
} }
} }
}
table.parapodatki_table {
width: 100%;
white-space: nowrap;
font-size: 14px;
td {
&.graph_cell {
width: 100%;
div.graph_cell {
display:flex;
flex-direction: row;
align-items: center;
.graph_full {
background-color: $blue;
height: 16px;
margin-right: 8px;
}
span {
font-size: inherit;
}
}
}
}
} }