mirror of
https://github.com/cwinfo/powerdns-admin.git
synced 2024-11-09 15:10:27 +00:00
Added additional UI alerts / messaging to handle success / failure scenarios.
This commit is contained in:
Matt Scott
parent
e132ced669
commit
69ce3cb88a
@ -6,6 +6,10 @@ let AuthenticationSettingsModel = function (user_data, api_url, csrf_token, sele
|
|||||||
self.selector = selector;
|
self.selector = selector;
|
||||||
self.loading = false;
|
self.loading = false;
|
||||||
self.saving = false;
|
self.saving = false;
|
||||||
|
self.saved = false;
|
||||||
|
self.save_failed = false;
|
||||||
|
self.messages = [];
|
||||||
|
self.messages_class = 'info';
|
||||||
self.tab_active = '';
|
self.tab_active = '';
|
||||||
self.tab_default = 'local';
|
self.tab_default = 'local';
|
||||||
|
|
||||||
@ -107,6 +111,10 @@ let AuthenticationSettingsModel = function (user_data, api_url, csrf_token, sele
|
|||||||
self.init = function (autoload) {
|
self.init = function (autoload) {
|
||||||
self.loading = ko.observable(self.loading);
|
self.loading = ko.observable(self.loading);
|
||||||
self.saving = ko.observable(self.saving);
|
self.saving = ko.observable(self.saving);
|
||||||
|
self.saved = ko.observable(self.saved);
|
||||||
|
self.save_failed = ko.observable(self.save_failed);
|
||||||
|
self.messages = ko.observableArray(self.messages);
|
||||||
|
self.messages_class = ko.observable(self.messages_class);
|
||||||
self.tab_active = ko.observable(self.tab_active);
|
self.tab_active = ko.observable(self.tab_active);
|
||||||
self.tab_default = ko.observable(self.tab_default);
|
self.tab_default = ko.observable(self.tab_default);
|
||||||
self.update(user_data);
|
self.update(user_data);
|
||||||
@ -742,59 +750,33 @@ let AuthenticationSettingsModel = function (user_data, api_url, csrf_token, sele
|
|||||||
|
|
||||||
self.onDataLoaded = function (result) {
|
self.onDataLoaded = function (result) {
|
||||||
if (result.status == 0) {
|
if (result.status == 0) {
|
||||||
console.log('Error loading settings.');
|
self.messages_class('danger');
|
||||||
|
self.messages(result.messages);
|
||||||
if (result.messages.length) {
|
|
||||||
for (let i = 0; i < result.messages.length; i++) {
|
|
||||||
let message = result.messages[i];
|
|
||||||
console.log(message);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
self.loading(false);
|
self.loading(false);
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
|
|
||||||
self.update(result.data);
|
self.update(result.data);
|
||||||
|
self.messages_class('info');
|
||||||
console.log('Settings loaded.');
|
self.messages(result.messages);
|
||||||
|
|
||||||
if (result.messages.length) {
|
|
||||||
for (let i = 0; i < result.messages.length; i++) {
|
|
||||||
let message = result.messages[i];
|
|
||||||
console.log(message);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
self.loading(false);
|
self.loading(false);
|
||||||
}
|
}
|
||||||
|
|
||||||
self.onDataSaved = function (result) {
|
self.onDataSaved = function (result) {
|
||||||
if (result.status == 0) {
|
if (result.status == 0) {
|
||||||
console.log('Error saving settings.');
|
self.saved(false);
|
||||||
|
self.save_failed(true);
|
||||||
if (result.messages.length) {
|
self.messages_class('danger');
|
||||||
for (let i = 0; i < result.messages.length; i++) {
|
self.messages(result.messages);
|
||||||
let message = result.messages[i];
|
|
||||||
console.log(message);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
self.saving(false);
|
self.saving(false);
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
|
|
||||||
self.update(result.data);
|
self.update(result.data);
|
||||||
|
self.saved(true);
|
||||||
console.log('Settings saved.');
|
self.save_failed(false);
|
||||||
|
self.messages_class('info');
|
||||||
if (result.messages.length) {
|
self.messages(result.messages);
|
||||||
for (let i = 0; i < result.messages.length; i++) {
|
|
||||||
let message = result.messages[i];
|
|
||||||
console.log(message);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
self.saving(false);
|
self.saving(false);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -40,16 +40,33 @@
|
|||||||
data-bind="text: (loading() ? 'Loading' : 'Saving') + ' settings...'"></div>
|
data-bind="text: (loading() ? 'Loading' : 'Saving') + ' settings...'"></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
{% if result %}
|
<!-- /.overlay-wrapper -->
|
||||||
<div
|
<div class="alert alert-dismissible alert-success" style="display: none;"
|
||||||
class="alert {% if result['status'] %}alert-success{% else %}alert-danger{% endif %} alert-dismissible">
|
data-bind="visible: saved">
|
||||||
<button type="button" class="close" data-dismiss="alert" aria-hidden="true">
|
<button type="button" class="close" aria-hidden="true"
|
||||||
×
|
data-bind="click: saved(false)">×
|
||||||
</button>
|
</button>
|
||||||
{{ result['msg'] }}
|
<h5><i class="icon fas fa-check"></i> Saved!</h5>
|
||||||
|
These settings have been saved to the database.
|
||||||
|
</div>
|
||||||
|
<div class="alert alert-dismissible alert-danger" style="display: none;"
|
||||||
|
data-bind="visible: save_failed">
|
||||||
|
<button type="button" class="close" aria-hidden="true"
|
||||||
|
data-bind="click: save_failed(false)">×
|
||||||
|
</button>
|
||||||
|
<h5><i class="icon fas fa-ban"></i> Error!</h5>
|
||||||
|
These settings could <strong>not</strong> be saved to the database!
|
||||||
|
</div>
|
||||||
|
<div class="alert alert-dismissible" style="display: none;"
|
||||||
|
data-bind="visible: messages().length, class: 'alert alert-dismissible alert-' + messages_class()">
|
||||||
|
<button type="button" class="close" aria-hidden="true"
|
||||||
|
data-bind="click: messages([])">×
|
||||||
|
</button>
|
||||||
|
<h5><i class="icon fas fa-info"></i> Additional Information</h5>
|
||||||
|
<ul data-bind="foreach: messages">
|
||||||
|
<li data-bind="text: $data"></li>
|
||||||
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
{% endif %}
|
|
||||||
|
|
||||||
<div class="nav-tabs-custom">
|
<div class="nav-tabs-custom">
|
||||||
<ul class="nav nav-tabs" role="tablist">
|
<ul class="nav nav-tabs" role="tablist">
|
||||||
<li class="nav-item">
|
<li class="nav-item">
|
||||||
@ -89,7 +106,8 @@
|
|||||||
</ul>
|
</ul>
|
||||||
<div class="tab-content">
|
<div class="tab-content">
|
||||||
|
|
||||||
<div data-tab="local" data-bind="class: 'tab-pane' + (tab_active() == 'local' ? ' active' : '')">
|
<div data-tab="local"
|
||||||
|
data-bind="class: 'tab-pane' + (tab_active() == 'local' ? ' active' : '')">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-12 col-sm-6 col-lg-4">
|
<div class="col-12 col-sm-6 col-lg-4">
|
||||||
<div class="card">
|
<div class="card">
|
||||||
@ -280,7 +298,8 @@
|
|||||||
</div>
|
</div>
|
||||||
<!-- /.tab-pane -->
|
<!-- /.tab-pane -->
|
||||||
|
|
||||||
<div data-tab="ldap" data-bind="class: 'tab-pane' + (tab_active() == 'ldap' ? ' active' : '')">
|
<div data-tab="ldap"
|
||||||
|
data-bind="class: 'tab-pane' + (tab_active() == 'ldap' ? ' active' : '')">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-12 col-sm-6 col-lg-4">
|
<div class="col-12 col-sm-6 col-lg-4">
|
||||||
{% if error %}
|
{% if error %}
|
||||||
@ -991,7 +1010,8 @@
|
|||||||
</div>
|
</div>
|
||||||
<!-- /.tab-pane -->
|
<!-- /.tab-pane -->
|
||||||
|
|
||||||
<div data-tab="azure" data-bind="class: 'tab-pane' + (tab_active() == 'azure' ? ' active' : '')">
|
<div data-tab="azure"
|
||||||
|
data-bind="class: 'tab-pane' + (tab_active() == 'azure' ? ' active' : '')">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-12 col-sm-6 col-lg-4">
|
<div class="col-12 col-sm-6 col-lg-4">
|
||||||
<div class="card">
|
<div class="card">
|
||||||
@ -1293,7 +1313,8 @@
|
|||||||
</div>
|
</div>
|
||||||
<!-- /.tab-pane -->
|
<!-- /.tab-pane -->
|
||||||
|
|
||||||
<div data-tab="oidc" data-bind="class: 'tab-pane' + (tab_active() == 'oidc' ? ' active' : '')">
|
<div data-tab="oidc"
|
||||||
|
data-bind="class: 'tab-pane' + (tab_active() == 'oidc' ? ' active' : '')">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-12 col-sm-6 col-lg-4">
|
<div class="col-12 col-sm-6 col-lg-4">
|
||||||
<div class="card">
|
<div class="card">
|
||||||
@ -1531,46 +1552,3 @@
|
|||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
{% block modals %}
|
|
||||||
<div class="modal fade modal-warning" id="modal_confirm" data-keyboard="false" data-backdrop="static">
|
|
||||||
<div class="modal-dialog">
|
|
||||||
<div class="modal-content">
|
|
||||||
<div class="modal-header">
|
|
||||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close" id="X">
|
|
||||||
<span aria-hidden="true">×</span>
|
|
||||||
</button>
|
|
||||||
<h4 class="modal-title">Confirmation</h4>
|
|
||||||
</div>
|
|
||||||
<div class="modal-body">
|
|
||||||
<p></p>
|
|
||||||
</div>
|
|
||||||
<div class="modal-footer">
|
|
||||||
<button type="button" class="btn btn-default pull-left" id="button_cancel" name="purge" value="OFF"
|
|
||||||
data-dismiss="modal">Cancel
|
|
||||||
</button>
|
|
||||||
<button type="button" class="btn btn-success" id="button_confirm">Confirm</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="modal fade modal-warning" id="modal_warning" data-keyboard="false" data-backdrop="static">
|
|
||||||
<div class="modal-dialog">
|
|
||||||
<div class="modal-content">
|
|
||||||
<div class="modal-header">
|
|
||||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close" id="warning_X">
|
|
||||||
<span aria-hidden="true">×</span>
|
|
||||||
</button>
|
|
||||||
<h4 class="modal-title">Warning</h4>
|
|
||||||
</div>
|
|
||||||
<div class="modal-body">
|
|
||||||
<p></p>
|
|
||||||
</div>
|
|
||||||
<div class="modal-footer">
|
|
||||||
<button type="button" class="btn btn-success" id="button_warning_confirm">Yes I understand</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{% endblock %}
|
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user