updating config-file xml's; prepare config-details view via ajax for config-commands/files to show in configuration

Signed-off-by: Michael Kaufmann <d00p@froxlor.org>

templates/Froxlor/settings/configuration.html.twig

@@ -19,7 +19,7 @@
 {% block content %}
 	<form action="{{ action|default(filename) }}" method="post" enctype="application/x-www-form-urlencoded" class="form">
 		{% block settings %}
-			<div class="row row-cols-2 row-cols-md-2 row-cols-xl-4 g-3">
+			<div class="row row-cols-1 row-cols-md-2 row-cols-xl-4 g-3">
 				{% for stype,field in fields %}
 					<div class="col">
 						<div class="card h-100 position-relative">
@@ -57,6 +57,9 @@
 													{{ daemon.title }}
 												{% endif %}
 											</label>
+											<a class="show-config text-secondary opacity-50 float-end" role="button" data-dist="{{ distribution }}" data-section="{{ stype }}" data-daemon="{{ dtype }}" title="show config">
+												<i class="fa-regular fa-file-code"></i>
+											</a>
 										</div>
 									{% else %}
 										<div class="form-check">
@@ -82,6 +85,9 @@
 													{{ daemon.title }}
 												{% endif %}
 											</label>
+											<a class="show-config text-secondary opacity-50 float-end" role="button" data-dist="{{ distribution }}" data-section="{{ stype }}" data-daemon="{{ dtype }}" title="show config">
+												<i class="fa-regular fa-file-code"></i>
+											</a>
 										</div>
 									{% endif %}
 								{% endfor %}
@@ -103,4 +109,20 @@
 			</div>
 		</div>
 	</form>
+
+	<div class="modal fade" id="configTplShow" aria-hidden="true" aria-labelledby="configTplShowLabel" tabindex="-1">
+		<div class="modal-dialog modal-xl modal-dialog-centered modal-dialog-scrollable">
+			<div class="modal-content">
+				<div class="modal-header">
+					<h5 class="modal-title" id="configTplShowLabel"></h5>
+					<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="{{ lng('panel.modalclose') }}"></button>
+				</div>
+				<div class="modal-body text-start">
+				</div>
+				<div class="modal-footer">
+					<button class="btn btn-primary" data-bs-dismiss="modal">{{ lng('panel.modalclose') }}</button>
+				</div>
+			</div>
+		</div>
+	</div>
 {% endblock %}

templates/Froxlor/src/js/components/configfiles.js

@@ -1,4 +1,4 @@
-$(function() {
+$(function () {
 	/*
 	 * config files - select all recommended
 	 */
@@ -11,4 +11,30 @@ $(function() {
 			}
 		})
 	});
+
+	$('.show-config').on('click', function () {
+		var distro = $(this).data('dist');
+		var section = $(this).data('section');
+		var daemon = $(this).data('daemon');
+
+		$.ajax({
+			url: "lib/ajax.php?action=getConfigDetails",
+			type: "POST",
+			dataType: "json",
+			data: { distro: distro, section: section, daemon: daemon },
+			success: function (data) {
+				$('#configTplShowLabel').html(data.title);
+				$('#configTplShow .modal-body').html(data.content);
+				var myModal = new bootstrap.Modal(document.getElementById('configTplShow'));
+				myModal.show();
+			},
+			error: function (request, status, error) {
+				$('#configTplShowLabel').html('Error');
+				$('#configTplShow .modal-body').html('<div class="alert alert-danger" role="alert">' + request.responseJSON.message + '</div>');
+				var myModal = new bootstrap.Modal(document.getElementById('configTplShow'));
+				myModal.show();
+			}
+		});
+
+	});
 });

templates/Froxlor/src/js/components/tablecolumns.js

@@ -1,16 +1,16 @@
-$(document).ready(function () {
+$(function () {
 	/*
 	 * table columns - manage columns modal
 	 */
 	let form = $('#manageColumnsModal form');
 
-	form.submit(function (event) {
+	form.on('submit', function (event) {
 		$.ajax({
 			url: 'lib/ajax.php?action=updatetablelisting&listing=' + form.data('listing') + '&theme=' + window.$theme,
-			type : 'POST',
-			dataType : 'json',
-			data : form.serialize(),
-			success : function () {
+			type: 'POST',
+			dataType: 'json',
+			data: form.serialize(),
+			success: function () {
 				window.location.href = '';
 			},
 			error: function (request) {
@@ -20,13 +20,13 @@ $(document).ready(function () {
 		event.preventDefault();
 	});
 
-	$('#manageColumnsModal form #reset').click(function () {
+	$('#manageColumnsModal form #reset').on('click', function () {
 		$.ajax({
 			url: 'lib/ajax.php?action=resettablelisting&listing=' + form.data('listing') + '&theme=' + window.$theme,
-			type : 'POST',
-			dataType : 'json',
-			data : {},
-			success : function () {
+			type: 'POST',
+			dataType: 'json',
+			data: {},
+			success: function () {
 				window.location.href = '';
 			},
 			error: function (request) {