omnishell minor changes
This commit is contained in:
fbsanchez
parent
192fd10dd8
commit
546b8dc448
|
|
@ -2915,119 +2915,73 @@ function ui_progress(
|
|||
* Generates a progress bar CSS based.
|
||||
* Requires css progress.css
|
||||
*
|
||||
* @param array $progress Progress.
|
||||
* @param string $width Width.
|
||||
* @param integer $height Height in 'em'.
|
||||
* @param array $color status color.
|
||||
* @param boolean $return Return or paint (if false).
|
||||
* @param boolean $text Text to be displayed,by default progress %.
|
||||
* @param array $ajax Ajax: [ 'page' => 'page', 'data' => 'data' ] Sample:
|
||||
* [
|
||||
* 'page' => 'operation/agentes/ver_agente', Target page.
|
||||
* 'interval' => 100 / $agent["intervalo"], Ask every interval seconds.
|
||||
* 'data' => [ Data to be sent to target page.
|
||||
* 'id_agente' => $id_agente,
|
||||
* 'refresh_contact' => 1,
|
||||
* ],
|
||||
* ].
|
||||
* @param array $data With following content:
|
||||
*
|
||||
* 'slices' => [
|
||||
* 'label' => [ // Name of the slice
|
||||
* 'value' => value
|
||||
* 'color' => color of the slice.
|
||||
* ]
|
||||
* ],
|
||||
* 'width' => Width
|
||||
* 'height' => Height in 'em'
|
||||
* 'return' => Boolean, return or paint.
|
||||
*
|
||||
* @return string HTML code.
|
||||
*/
|
||||
function ui_progress_extend(
|
||||
$progress,
|
||||
$width='100%',
|
||||
$height='2.5',
|
||||
$color='#82b92e',
|
||||
$return=true,
|
||||
$text='',
|
||||
$ajax=false
|
||||
array $data
|
||||
) {
|
||||
if (!$progress['total']) {
|
||||
$progress = 0;
|
||||
if (is_array($data) === false) {
|
||||
// Failed.
|
||||
return false;
|
||||
}
|
||||
|
||||
$totalW = ($progress['total'] * 100);
|
||||
if ($totalW > 100) {
|
||||
$totalW = 100;
|
||||
if (is_array($data['slices']) === false) {
|
||||
// Failed.
|
||||
return false;
|
||||
}
|
||||
|
||||
if ($totalW < 0) {
|
||||
$totalW = 0;
|
||||
if (isset($data['width']) === false) {
|
||||
$data['width'] = '100';
|
||||
}
|
||||
|
||||
if (empty($text)) {
|
||||
$text = $totalW.'%';
|
||||
if (isset($data['height']) === false) {
|
||||
$data['height'] = '1.3';
|
||||
}
|
||||
|
||||
$total = array_reduce(
|
||||
$data['slices'],
|
||||
function ($carry, $item) {
|
||||
$carry += $item['value'];
|
||||
return $carry;
|
||||
}
|
||||
);
|
||||
if ($total == 0) {
|
||||
return null;
|
||||
}
|
||||
|
||||
$badW = (($progress['bad'] * 100 ) / $progress['total']);
|
||||
$goodW = (($progress['good'] * 100 ) / $progress['total']);
|
||||
$unknownW = (($progress['unknown'] * 100 ) / $progress['total']);
|
||||
ui_require_css_file('progress');
|
||||
$output .= '<div class="progress_main" data-label="total"';
|
||||
$output .= '" style="width: '.$totalW.'%;display:flex; height: '.$height.'em;">';
|
||||
$output .= '<div id="unknow_div" onmouseover="Mouseover()" class="progress_main text_over" data-label="Pending"';
|
||||
$output .= '" style="width: '.$unknownW.'%; height: '.$height.'em; background-color: '.COL_UNKNOWN.'; "></div>';
|
||||
$output .= '<div class="progress_main" data-label="Success"';
|
||||
$output .= '" style="width: '.$goodW.'%; height: '.$height.'em; background-color: '.COL_NORMAL.';"></div>';
|
||||
$output .= '<div class="progress_main" data-label="Error"';
|
||||
$output .= '" style="width: '.$badW.'%; height: '.$height.'em; background-color: '.COL_CRITICAL.';"></div>';
|
||||
|
||||
// Main container.
|
||||
$output .= '<div class="progress_main" ';
|
||||
$output .= '" style="width:'.$data['width'].'%;';
|
||||
$output .= ' height:'.$data['height'].'em;">';
|
||||
|
||||
foreach ($data['slices'] as $label => $def) {
|
||||
$width = ($def['value'] * 100 / $total);
|
||||
$output .= '<div class="progress forced_title" ';
|
||||
$output .= ' data-title="'.$label.': '.$def['value'].'" ';
|
||||
$output .= ' data-use_title_for_force_title="1"';
|
||||
$output .= ' style="width:'.$width.'%;';
|
||||
$output .= ' background-color:'.$def['color'].';';
|
||||
$output .= '">';
|
||||
$output .= '</div>';
|
||||
}
|
||||
|
||||
$output .= '</div>';
|
||||
|
||||
if ($ajax !== false && is_array($ajax)) {
|
||||
$output .= '<script type="text/javascript">
|
||||
|
||||
$(document).ready(function() {
|
||||
function
|
||||
document.getElementById("#unknow_div").onmouseover = function() {
|
||||
document.getElementById("#unknow_div").append( $( "<span> ***</span>" ) );
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
setInterval(() => {
|
||||
last = $(".progress_main").attr("data-label").split(" ")[0]*1;
|
||||
width = $(".progress").width() / $(".progress").parent().width() * 100;
|
||||
width_interval = '.$ajax['interval'].';
|
||||
if (last % 10 == 0) {
|
||||
$.post({
|
||||
url: "'.ui_get_full_url('ajax.php', false, false, false).'",
|
||||
data: {';
|
||||
if (is_array($ajax['data'])) {
|
||||
foreach ($ajax['data'] as $token => $value) {
|
||||
$output .= '
|
||||
'.$token.':"'.$value.'",';
|
||||
}
|
||||
}
|
||||
|
||||
$output .= '
|
||||
page: "'.$ajax['page'].'"
|
||||
},
|
||||
success: function(data) {
|
||||
try {
|
||||
val = JSON.parse(data);
|
||||
$(".progress_main").attr("data-label", val["last_contact"]+" s");
|
||||
$(".progress").width(val["progress"]+"%");
|
||||
} catch (e) {
|
||||
console.error(e);
|
||||
$(".progress_text").attr("data-label", (last -1) + " s");
|
||||
if (width < 100) {
|
||||
$(".progress").width((width+width_interval) + "%");
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
} else {
|
||||
$(".progress_main").attr("data-label", (last -1) + " s");
|
||||
if (width < 100) {
|
||||
$(".progress").width((width+width_interval) + "%");
|
||||
}
|
||||
}
|
||||
}, 1000);
|
||||
});
|
||||
</script>';
|
||||
}
|
||||
|
||||
if (!$return) {
|
||||
if (!$data['return']) {
|
||||
echo $output;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -19,6 +19,12 @@
|
|||
height: 20px;
|
||||
}
|
||||
|
||||
.element-target-big {
|
||||
width: 100px;
|
||||
margin: 2px;
|
||||
height: 100px;
|
||||
}
|
||||
|
||||
.status-normal {
|
||||
background-color: #add570;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -4,6 +4,7 @@
|
|||
position: relative;
|
||||
width: 100%;
|
||||
display: inline-block;
|
||||
display: flex;
|
||||
}
|
||||
.progress_main:before {
|
||||
content: attr(data-label);
|
||||
|
|
|
|||
Loading…
Reference in New Issue