From 588a302d14cd585bd8d6dfd9240f72248e51c045 Mon Sep 17 00:00:00 2001 From: Franco Fichtner Date: Fri, 22 May 2026 11:35:57 +0200 Subject: [PATCH] ipsec: restyle the connections page for clarity Co-authored-by: Stephan de Wit --- .../OPNsense/IPsec/forms/dialogConnection.xml | 10 + .../app/views/OPNsense/IPsec/connections.volt | 301 +++++++++--------- 2 files changed, 157 insertions(+), 154 deletions(-) diff --git a/src/opnsense/mvc/app/controllers/OPNsense/IPsec/forms/dialogConnection.xml b/src/opnsense/mvc/app/controllers/OPNsense/IPsec/forms/dialogConnection.xml index b5a3632f9c..a17d31810e 100644 --- a/src/opnsense/mvc/app/controllers/OPNsense/IPsec/forms/dialogConnection.xml +++ b/src/opnsense/mvc/app/controllers/OPNsense/IPsec/forms/dialogConnection.xml @@ -1,4 +1,9 @@
+ + + header + true + connection.uuid @@ -248,4 +253,9 @@ text + + buttons + ConnectionDialog + true +
diff --git a/src/opnsense/mvc/app/views/OPNsense/IPsec/connections.volt b/src/opnsense/mvc/app/views/OPNsense/IPsec/connections.volt index 80b4fd1e1e..2f29203d5e 100644 --- a/src/opnsense/mvc/app/views/OPNsense/IPsec/connections.volt +++ b/src/opnsense/mvc/app/views/OPNsense/IPsec/connections.volt @@ -1,5 +1,5 @@ {# - # Copyright (c) 2022-2024 Deciso B.V. + # Copyright (c) 2022-2026 Deciso B.V. # All rights reserved. # # Redistribution and use in source and binary forms, with or without modification, @@ -86,33 +86,48 @@ $(".hidden_attr").closest('tr').hide(); + $('a[data-toggle="tab"]').on('shown.bs.tab', function (e) { + if ($(e.relatedTarget).attr('href') == '.edit_connection') { + $("#connection_details").hide(); + } + }); + $("#ConnectionDialog").click(function(){ - $("#connection_details").hide(); + const $tab = $(this); + + $("#grid-locals").bootgrid("clear"); + $("#grid-remotes").bootgrid("clear"); + $("#grid-children").bootgrid("clear"); + ajaxGet("/api/ipsec/connections/connection_exists/" + $("#connection\\.uuid").val(), {}, function(data){ if (data.exists) { $("#connection_details").show(); $("#grid-locals").bootgrid("reload"); $("#grid-remotes").bootgrid("reload"); $("#grid-children").bootgrid("reload"); + } else { + $("#connection_details").hide(); } }); - $(this).show(); + + $tab.show(); }); - $("#ConnectionDialog").change(function(){ - if ($("#connection_details").is(':visible')) { - $("#tab_connections").click(); - $("#ConnectionDialog").hide(); - } else { - $("#ConnectionDialog").click(); - } + $("#ConnectionDialog").change(function() { + $("#ConnectionDialog").click(); + }); + $("#btn_ConnectionDialog_cancel").click(function () { + $("#tab_connections").click(); + $("#ConnectionDialog").hide(); + $("#connection_details").hide(); }); $("#connection\\.description").change(function(){ if ($(this).val() !== '') { - $("#ConnectionDialog").text($(this).val()); + // XXX wrong on clone + $("#ConnectionDialog").text('Connections: ' + $(this).val()); } else { - $("#ConnectionDialog").text('-'); + $("#ConnectionDialog").text('Connections: [new]'); } }); @@ -126,6 +141,7 @@ ajaxCall('/api/ipsec/connections/toggle/' + enabled, {}, function (data, status) { $("#enable").removeClass("pending"); }); + $(document).trigger("settings-changed"); } }); ajaxGet('/api/ipsec/connections/is_enabled', {}, function (data, status) { @@ -135,13 +151,8 @@ $("#enable").removeClass("pending"); }); - /** - * reconfigure - */ $("#reconfigureAct").SimpleActionButton({ - onAction: function(data, status){ - updateServiceControlUI('ipsec'); - } + onAction: function() { $("#btn_ConnectionDialog_cancel").click(); } }); $(".cipher_tooltip").change(function(){ @@ -177,10 +188,7 @@
- +
- + @@ -222,143 +239,24 @@
{{ lang._('ID') }}{{ lang._('UUID') }} {{ lang._('Enabled') }} {{ lang._('Description') }} {{ lang._('Local') }}
-
- -
-
-
- -
+
-
-
-

{{ lang._('General settings')}}

-
-
+
-
-
-
-
-
-
-
-
-

{{ lang._('Local Authentication')}}

-
-
- - - - - - - - - - - - - - - - - - - -
{{ lang._('ID') }}{{ lang._('Enabled') }}{{ lang._('Round') }}{{ lang._('Authentication') }}{{ lang._('Description') }}{{ lang._('Commands') }}
- -
-
-
-
-

{{ lang._('Remote Authentication')}}

-
-
- - - - - - - - - - - - - - - - - - - -
{{ lang._('ID') }}{{ lang._('Enabled') }}{{ lang._('Round') }}{{ lang._('Authentication') }}{{ lang._('Description') }}{{ lang._('Commands') }}
- -
-
-
-
-
-
-

{{ lang._('Children')}}

-
-
- - - - - - - - - - - - - - - - - - - -
{{ lang._('ID') }}{{ lang._('Enabled') }}{{ lang._('Description') }}{{ lang._('Local Nets') }}{{ lang._('Remote Nets') }}{{ lang._('Commands') }}
- - -
-
-
-
-
-
- -
-
+
- +
- + @@ -376,12 +274,106 @@
{{ lang._('ID') }}{{ lang._('UUID') }} {{ lang._('Enabled') }} {{ lang._('Name') }} {{ lang._('Commands') }}
-
- +
+
@@ -390,3 +382,4 @@ {{ partial("layout_partials/base_dialog",['fields':formDialogRemote,'id':'DialogRemote','label':lang._('Edit Remote')])}} {{ partial("layout_partials/base_dialog",['fields':formDialogChild,'id':'DialogChild','label':lang._('Edit Child')])}} {{ partial("layout_partials/base_dialog",['fields':formDialogPool,'id':'DialogPool','label':lang._('Edit Pool')])}} +{{ partial('layout_partials/base_apply_button', {'data_endpoint': '/api/ipsec/service/reconfigure', 'data_service_widget': 'ipsec'})}}