diff --git a/pandora_console/include/functions_ui.php b/pandora_console/include/functions_ui.php index cc3b40ffbb..1d43cebe28 100755 --- a/pandora_console/include/functions_ui.php +++ b/pandora_console/include/functions_ui.php @@ -2911,6 +2911,113 @@ function ui_progress( } +/** + * Generates a progress bar CSS based. + * Requires css progress.css + * + * @param integer $progress Progress. + * @param string $width Width. + * @param integer $height Height in 'em'. + * @param string $color 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, + * ], + * ]. + * + * @return string HTML code. + */ +function ui_progress_extend( + $progress, + $width='100%', + $height='2.5', + $color='#82b92e', + $return=true, + $text='', + $ajax=false +) { + if (!$progress) { + $progress = 0; + } + + if ($progress > 100) { + $progress = 100; + } + + if ($progress < 0) { + $progress = 0; + } + + if (empty($text)) { + $text = $progress.'%'; + } + + ui_require_css_file('progress'); + $output .= '<span class="progress_main" data-label="'.$text; + $output .= '" style="width: '.$width.'; height: '.$height.'em; border: 1px solid '.$color.'">'; + $output .= '<span class="progress" style="width: '.$progress.'%; background: '.$color.'"></span>'; + $output .= '</span>'; + + if ($ajax !== false && is_array($ajax)) { + $output .= '<script type="text/javascript"> + $(document).ready(function() { + 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) { + echo $output; + } + + return $output; +} + + /** * Generate needed code to print a datatables jquery plugin. * diff --git a/pandora_console/include/styles/omnishell.css b/pandora_console/include/styles/omnishell.css index 27a972425b..4d41cb3cd5 100644 --- a/pandora_console/include/styles/omnishell.css +++ b/pandora_console/include/styles/omnishell.css @@ -4,8 +4,28 @@ border: none; } +.remove_agent { + background-image: url("../../images/darrowleft.png"); + background-repeat: no-repeat; + border: none; +} + .edit_yaml { margin-left: 39px; margin-top: 10px; margin-bottom: 10px; } + +li > input[type="text"] { + border: 1px solid lightgrey; + border-radius: 0; + font-family: "lato-bolder", "Open Sans", sans-serif; + font-weight: lighter; + padding: 0px 0px 2px 0px; + box-sizing: border-box; + margin-bottom: 4px; +} + +.margin_button { + margin-right: 5px; +}