Merge branch 'ent-12497-usabilidad-implementar-boton-mas-operaciones' into 'develop'

Ent 12497 usabilidad implementar boton mas operaciones See merge request artica/pandorafms!6955
2024-02-22 16:20:13 +00:00 · 2024-02-22 16:20:13 +00:00 · f9b6008296
parent 702341d5ed f36ea56ad7
commit f9b6008296
6 changed files with 214 additions and 9 deletions
--- a/pandora_console/godmode/agentes/configurar_agente.php
+++ b/pandora_console/godmode/agentes/configurar_agente.php
@ -816,6 +816,23 @@ if ($id_agente) {

    $helper = ($help_header === 'main_tab') ? 'main_tab' : '';
    $pure = (int) get_parameter('pure');
+    $menu_tabs = [];
+    // Agent details.
+    $menu_tab_url = '<a href="index.php?sec=gsetup&sec2=godmode/setup/setup&section=general">'.__('General setup').'</a>';
+    array_push($menu_tabs, $menu_tab_url);
+    // Agent details.
+    $menu_tab_url = '<a href="index.php?sec=view&sec2=operation/agentes/estado_agente">'.__('Agent detail').'</a>';
+    array_push($menu_tabs, $menu_tab_url);
+    // Manage agents.
+    $menu_tab_url = '<a href="index.php?sec=gagente&sec2=godmode/agentes/modificar_agente">'.__('Manage agents').'</a>';
+    array_push($menu_tabs, $menu_tab_url);
+    // Events.
+    $menu_tab_url = '<a href="index.php?sec=eventos&sec2=operation/events/events">'.__('View events').'</a>';
+    array_push($menu_tabs, $menu_tab_url);
+    // Events.
+    $menu_tab_url = '<a href="index.php?sec=reporting&sec2=godmode/reporting/reporting_builder">'.__('Custom reports').'</a>';
+    array_push($menu_tabs, $menu_tab_url);
+    $dots = dot_tab($menu_tabs);
    if ($pure === 0) {
        ui_print_standard_header(
            __('Agent setup view').' ( '.strtolower(agents_get_alias($id_agente)).' )',
@ -837,7 +854,9 @@ if ($id_agente) {
                    'link'  => '',
                    'label' => $tab_name,
                ],
-            ]
+            ],
+            [],
+            $dots
        );
    }
 } else {
@ -857,7 +876,9 @@ if ($id_agente) {
                'link'  => 'index.php?sec=gagente&sec2=godmode/agentes/modificar_agente',
                'label' => __('Manage agents'),
            ],
-        ]
+        ],
+        [],
+        $dots
    );
 }

--- a/pandora_console/godmode/setup/setup.php
+++ b/pandora_console/godmode/setup/setup.php
@ -386,6 +386,28 @@ switch ($section) {
    break;
 }

+$menu_tabs = [];
+// Agent details.
+$menu_tab_url = '<a href="index.php?sec=gsetup&sec2=godmode/setup/setup&section=general">'.__('General setup').'</a>';
+array_push($menu_tabs, $menu_tab_url);
+// Agent details.
+$menu_tab_url = '<a href="index.php?sec=view&sec2=operation/agentes/estado_agente">'.__('Agent detail').'</a>';
+array_push($menu_tabs, $menu_tab_url);
+
+// Manage agents.
+$menu_tab_url = '<a href="index.php?sec=gagente&sec2=godmode/agentes/modificar_agente">'.__('Manage agents').'</a>';
+array_push($menu_tabs, $menu_tab_url);
+
+// Events.
+$menu_tab_url = '<a href="index.php?sec=eventos&sec2=operation/events/events">'.__('View events').'</a>';
+array_push($menu_tabs, $menu_tab_url);
+
+// Events.
+$menu_tab_url = '<a href="index.php?sec=reporting&sec2=godmode/reporting/reporting_builder">'.__('Custom reports').'</a>';
+array_push($menu_tabs, $menu_tab_url);
+
+$dots = dot_tab($menu_tabs);
+
 // Header.
 ui_print_standard_header(
    __('Setup').' &raquo; '.$subpage,
@ -403,7 +425,9 @@ ui_print_standard_header(
            'link'  => '',
            'label' => $subpage,
        ],
-    ]
+    ],
+    [],
+    $dots
 );

 if (isset($config['error_config_update_config'])) {
--- a/pandora_console/include/functions_html.php
+++ b/pandora_console/include/functions_html.php
@ -7741,3 +7741,45 @@ function print_email_test_modal_window($id)

    echo '<div id="email_test_'.$id.'" title="'.__('Check mail configuration').'" class="invisible">'.html_print_table($table_mail_test, true).$submitButton.'</div>';
 }
+
+
+function dot_tab(array $tabs=[], array $jump_to=[])
+{
+    $tabs_link = '<div class="dot-tab-link">';
+    if (isset($tabs) === true) {
+        foreach ($tabs as $value) {
+            $tabs_link .= $value;
+        }
+    }
+
+    $tabs_link .= '</div>';
+
+    $tabs_jump_to = '';
+    if (isset($jump_to) === true) {
+        foreach ($jump_to as $value) {
+            $tabs_jump_to .= $value;
+        }
+    }
+
+    $output = '
+		<div class="dot-tab">
+			<div></div>
+			<div></div>
+			<div></div>
+			<div class="dot-tab-menu-overlay">
+				<div class="dot-tab-menu">
+					'.$tabs_link;
+    if ($tabs_jump_to !== '') {
+        $output .= '<div class="dot-tab-jump-to">
+					<span class="muted-text ml15">'.__('Jump to').':</span>
+					'.$tabs_jump_to.'
+					</div>';
+    }
+
+    $output .= '</div>
+			</div>
+		</div>
+	';
+
+    return $output;
+}
--- a/pandora_console/include/functions_ui.php
+++ b/pandora_console/include/functions_ui.php
@ -5232,7 +5232,8 @@ function ui_print_standard_header(
    bool $godmode=false,
    array $options=[],
    array $breadcrumbs=[],
-    array $fav_menu_config=[]
+    array $fav_menu_config=[],
+    string $dots='',
 ) {
    // For standard breadcrumbs.
    ui_require_css_file('discovery');
@ -5271,7 +5272,8 @@ function ui_print_standard_header(
        '',
        $headerInformation->printHeader(true),
        false,
-        $fav_menu_config
+        $fav_menu_config,
+        $dots
    );
    if ($return !== true) {
        echo $output;
@ -5312,7 +5314,8 @@ function ui_print_page_header(
    $alias='',
    $breadcrumbs='',
    $hide_left_small=false,
-    $fav_menu_config=[]
+    $fav_menu_config=[],
+    $dots='',
 ) {
    global $config;

@ -5443,12 +5446,22 @@ function ui_print_page_header(
            }
        }

-        $buffer .= '</ul></div>';
+        $buffer .= '</ul>';
+        if (isset($dots) === true) {
+            $buffer .= '<div id="menu_dots">'.$dots.'</div>';
+        }
+
+        $buffer .= '</div>';
    } else {
        if ($options != '') {
            $buffer .= '<div id="menu_tab"><ul class="mn"><li>';
            $buffer .= $options;
-            $buffer .= '</li></ul></div>';
+            $buffer .= '</li></ul>';
+            if (isset($dots) === true) {
+                $buffer .= '<div id="menu_dots">'.$dots.'</div>';
+            }
+
+            $buffer .= '</div>';
        }
    }

--- a/pandora_console/include/styles/pandora.css
+++ b/pandora_console/include/styles/pandora.css
@ -34,6 +34,9 @@
  --border-color: #eee;
  --border-dark-color: #e1e1e1;
  --text-color: #333;
+  --table-hover-background: #edfffe;
+  --background-main-color: #f6f7fb;
+  --border-color-4: #e5e9ed;
 }

 /*
@ -2003,6 +2006,7 @@ div.title_line {
 #menu_tab {
  margin-right: 20px;
  margin-top: 50px;
+  display: flex;
 }

 #menu_tab .mn,
@ -13592,3 +13596,82 @@ button.disabled {
 .ui-draggable-handle {
  z-index: 2 !important;
 }
+
+/* Dot tab */
+#menu_dots {
+  margin-left: 10px;
+}
+
+.dot-tab {
+  width: 24px;
+  height: 24px;
+  margin-top: 12px;
+  display: flex;
+  flex-direction: column;
+  flex-wrap: nowrap;
+  justify-content: space-between;
+  align-items: center;
+  padding: 2px;
+  box-sizing: border-box;
+  cursor: pointer;
+  position: relative;
+}
+
+.dot-tab:hover {
+  background-color: var(--background-main-color);
+}
+
+.dot-tab > div:nth-child(1),
+.dot-tab > div:nth-child(2),
+.dot-tab > div:nth-child(3) {
+  background-color: var(--text-color);
+  width: 4px;
+  height: 4px;
+}
+
+.dot-tab-menu-overlay {
+  position: absolute;
+  top: 20px;
+  right: -20px;
+  padding: 0px 10px 10px 10px;
+}
+
+.dot-tab-menu {
+  background-color: var(--secondary-color);
+  border: 1px solid var(--border-color-4);
+  border-radius: 6px;
+  min-width: 170px;
+  min-height: 20px;
+  box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.13);
+  padding: 10px 0px;
+  display: none;
+}
+
+.dot-tab:hover .dot-tab-menu {
+  display: block;
+}
+
+.dot-tab-menu a {
+  font-size: 14px;
+  line-height: 23px;
+  padding: 5px 15px;
+  display: block;
+  white-space: nowrap;
+}
+
+.dot-tab-menu a:hover {
+  background-color: var(--table-hover-background);
+  color: var(--text-color);
+  text-decoration: none;
+}
+
+.dot-tab-menu .dot-tab-link > a {
+  font-weight: 900;
+  color: black;
+}
+
+.dot-tab-menu .dot-tab-jump-to {
+  border-top: 1px solid var(--border-color-4);
+  margin-top: 10px;
+  padding-top: 15px;
+}
--- a/pandora_console/operation/agentes/ver_agente.php
+++ b/pandora_console/operation/agentes/ver_agente.php
@ -2131,6 +2131,27 @@ switch ($tab) {
 }

 if ((bool) $config['pure'] === false) {
+    $menu_tabs = [];
+    // Agent details.
+    $menu_tab_url = '<a href="index.php?sec=gsetup&sec2=godmode/setup/setup&section=general">'.__('General setup').'</a>';
+    array_push($menu_tabs, $menu_tab_url);
+    // Agent details.
+    $menu_tab_url = '<a href="index.php?sec=view&sec2=operation/agentes/estado_agente">'.__('Agent detail').'</a>';
+    array_push($menu_tabs, $menu_tab_url);
+
+    // Manage agents.
+    $menu_tab_url = '<a href="index.php?sec=gagente&sec2=godmode/agentes/modificar_agente">'.__('Manage agents').'</a>';
+    array_push($menu_tabs, $menu_tab_url);
+
+    // Events.
+    $menu_tab_url = '<a href="index.php?sec=eventos&sec2=operation/events/events">'.__('View events').'</a>';
+    array_push($menu_tabs, $menu_tab_url);
+
+    // Events.
+    $menu_tab_url = '<a href="index.php?sec=reporting&sec2=godmode/reporting/reporting_builder">'.__('Custom reports').'</a>';
+    array_push($menu_tabs, $menu_tab_url);
+
+    $dots = dot_tab($menu_tabs);
    ui_print_standard_header(
        __('Agent main view').' ( '.strtolower(agents_get_alias($id_agente)).' )',
        $icon,
@ -2157,7 +2178,8 @@ if ((bool) $config['pure'] === false) {
            'url'        => 'operation/agentes/ver_agente&id_agente='.$id_agente,
            'label'      => agents_get_alias($id_agente),
            'section'    => 'Agents',
-        ]
+        ],
+        $dots
    );
 }