ui: use space in apply box for the apply reminder (#10103)

Co-authored-by: Stephan de Wit <stephan.de.wit@deciso.com>

(cherry picked from commit 854238a1fc)
(cherry picked from commit 2edab3dbff)
(cherry picked from commit 9b21321593)
(cherry picked from commit 1d404f97f8)
This commit is contained in:
Franco Fichtner 2026-05-22 10:46:14 +02:00
parent 2185cc02a2
commit 7dabdc3368
9 changed files with 32 additions and 29 deletions

View file

@ -684,7 +684,7 @@
</select>
</div>
</div>
<table id="grid-aliases" class="table table-condensed table-hover table-striped table-responsive" data-editDialog="DialogAlias" data-editAlert="change_message_base_form">
<table id="grid-aliases" class="table table-condensed table-hover table-striped table-responsive" data-editDialog="DialogAlias">
<thead>
<tr>
<th data-column-id="uuid" data-type="string" data-identifier="true" data-visible="false">{{ lang._('ID') }}</th>

View file

@ -602,6 +602,7 @@
$el.SimpleFileUploadDlg({
onAction: function () {
$("#{{formGridFilterRule['table_id']}}").bootgrid('reload');
$(document).trigger("settings-changed");
}
});
},
@ -654,7 +655,7 @@
function(data, status) {
if (data.status === "ok") {
$("#{{ formGridFilterRule['table_id'] }}").bootgrid("reload");
$("#change_message_base_form").stop(true, false).slideDown(1000).delay(2000).slideUp(2000);
$(document).trigger("settings-changed");
}
},
function(xhr, textStatus, errorThrown) {
@ -681,7 +682,7 @@
function(data) {
if (data.status === "ok") {
$("#{{ formGridFilterRule['table_id'] }}").bootgrid("reload");
$("#change_message_base_form").stop(true, false).slideDown(1000).delay(2000).slideUp(2000);
$(document).trigger("settings-changed");
}
},
function(xhr, textStatus, errorThrown) {

View file

@ -360,7 +360,7 @@
function(data, status) {
if (data.status === "ok") {
$("#{{ formGridRule['table_id'] }}").bootgrid("reload");
$("#change_message_base_form").stop(true, false).slideDown(1000).delay(2000).slideUp(2000);
$(document).trigger("settings-changed");
}
},
function(xhr, textStatus, errorThrown) {
@ -387,7 +387,7 @@
function(data) {
if (data.status === "ok") {
$("#{{ formGridRule['table_id'] }}").bootgrid("reload");
$("#change_message_base_form").stop(true, false).slideDown(1000).delay(2000).slideUp(2000);
$(document).trigger("settings-changed");
}
},
function(xhr, textStatus, errorThrown) {

View file

@ -32,12 +32,7 @@ $( document ).ready(function() {
$("#unbound\\.acls\\.default_action").change(function() {
saveFormToEndpoint(url="/api/unbound/settings/set", formid="frm_AclSettings", function() {
/* Mimic bootgrid behaviour to nudge users towards reconfiguring */
$("#AclChangeMessage").slideDown(1000, function() {
setTimeout(function() {
$("#AclChangeMessage").slideUp(2000);
}, 2000);
});
$(document).trigger("settings-changed");
});
});
});

View file

@ -38,7 +38,9 @@
});
$(".forwarding-enabled").click(function() {
saveFormToEndpoint(url="/api/unbound/settings/set", formid='frm_ForwardingSettings');
saveFormToEndpoint(url="/api/unbound/settings/set", formid='frm_ForwardingSettings', function () {
$(document).trigger("settings-changed");
});
let checked = ($(this).is(':checked'));
toggleNameservers(checked);

View file

@ -1,23 +1,19 @@
<section class="page-content-main">
<div class="content-box grid-bottom-reserve">
<div class="col-md-12">
<br/>
<div id="{{ message_id|default('change_message_base_form') }}" class="alert alert-info" style="display: none" role="alert">
{{ lang._(data_change_message_content | default('After changing settings, please remember to apply them.')) }}
</div>
<button class="btn btn-primary" id="{{ button_id|default('reconfigureAct') }}"
data-endpoint="{{ data_endpoint }}"
data-label="{{ lang._(data_label|default('Apply')) }}"
data-error-title="{{ lang._(data_error_title|default('Error reconfiguring service.')) }}"
<section class="page-content-main grid-bottom-reserve">
<div class="alert content-box" style="display: flex; align-items: center; margin-bottom: 0;">
<button class="btn btn-primary __mr" id="{{ button_id|default('reconfigureAct') }}"
data-endpoint="{{ data_endpoint }}"
data-label="{{ lang._(data_label|default('Apply')) }}"
data-error-title="{{ lang._(data_error_title|default('Error reconfiguring service.')) }}"
{% if data_service_widget is defined %}
data-service-widget="{{ data_service_widget }}"
data-service-widget="{{ data_service_widget }}"
{% endif %}
{% if data_grid_reload is defined %}
data-grid-reload="{{ data_grid_reload }}"
data-grid-reload="{{ data_grid_reload }}"
{% endif %}
type="button">
</button>
<br/><br/>
type="button">
</button>
<div id="change_message_base_form" style="display: none">
{{ lang._(data_change_message_content | default('After changing settings, please remember to apply them.')) }}
</div>
</div>
</section>

View file

@ -1,5 +1,5 @@
{# requires getFormGrid() input to render #}
<table id="{{ table_id }}" class="table table-condensed table-hover table-striped" style="visibility: hidden" data-editDialog="{{ edit_dialog_id }}" data-editAlert="{{ edit_alert_id }}">
<table id="{{ table_id }}" class="table table-condensed table-hover table-striped" style="visibility: hidden" data-editDialog="{{ edit_dialog_id }}">
<thead>
<tr>
{% for field in fields %}

View file

@ -2041,6 +2041,9 @@ class UIBootgrid {
* animate alert when saved
*/
showSaveAlert() {
$(document).trigger("settings-changed");
// XXX backwards compatibility
let editAlert = this.$compatElement.attr('data-editAlert');
if (editAlert !== undefined) {
$("#" + editAlert).slideDown(1000, function () {

View file

@ -647,6 +647,10 @@ $.fn.SimpleActionButton = function (params) {
let hideCheckTimeout;
$(document).on("settings-changed", function () {
$('#change_message_base_form').show().parent('.alert').addClass('alert-info').removeClass('content-box');
});
this_button.on('click', function () {
const icon = this_button.find('.reload_progress');
@ -684,6 +688,8 @@ $.fn.SimpleActionButton = function (params) {
setIcon(icon, 'fa fa-check fa-spinner fa-pulse', 'fa fa-spinner fa-pulse');
} else {
setIcon(icon, 'fa fa-spinner fa-pulse', 'fa fa-check');
$("#change_message_base_form").hide();
this_button.parent('.alert').addClass('content-box').removeClass('alert-info');
hideCheckTimeout = setTimeout(function () {
setIcon(icon, 'fa fa-check', '');