From 2ab0ff8e9d45dfe6a0f1aee15bf9329d6fbef906 Mon Sep 17 00:00:00 2001
From: Owen Leonard <oleonard@myacpl.org>
Date: Tue, 25 Oct 2022 11:46:12 +0000
Subject: [PATCH] Bug 31960: Information on job detail view is misaligned

This patch updates the structure of the background jobs template so that
HTML processed in the report includes is well styled. The patch does
this by breaking the report and detail includes out of the fieldset and
putting them in a separate section.

This patch also adds the page-section class to the table view of current
and past background jobs.

Note: The patch includes indentation changes, so please ignore
whitespace when viewing the diff.

To test, apply the patch and go to Administration -> Manage jobs.

- The table of jobs (even if empty) should be contained in a
  page-section style white box.
- Test various processes which trigger a backgroud job:
  - Batch item modification
  - Batch item deletion
  - Batch hold deletion
  - Batch record modification
  ... etc.
- After each process has been started, view the details of the job.
- The information about the job shold be displayed well, with separate
  sections for "Report" and "Detailed messages."

Signed-off-by: Lucas Gass <lucas@bywatersolutions.com>
---
 .../prog/en/modules/admin/background_jobs.tt  | 100 ++++++++++--------
 1 file changed, 53 insertions(+), 47 deletions(-)

diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/admin/background_jobs.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/admin/background_jobs.tt
index 74386ddec9..0554cd3ae4 100644
--- a/koha-tmpl/intranet-tmpl/prog/en/modules/admin/background_jobs.tt
+++ b/koha-tmpl/intranet-tmpl/prog/en/modules/admin/background_jobs.tt
@@ -73,38 +73,42 @@
 
     [% PROCESS "background_jobs/${job.type}.inc" %]
 
-    <fieldset class="rows" style="display:none;">
-        <ol>
-            <li><span class="label">Job ID: </span>[% job.id | html %]</li>
-            <li>
-                <label for="job_status">Status: </label>
-                <span id="job_status_description"></span>
-            </li>
-            <li><label for="job_progress">Progress: </label>[% job.progress || 0 | html %] / [% job.size | html %]</li>
-            <li>
-                <label for="job_type">Type: </label>
-                <span id="job_type_description"></span>
-            </li>
-            <li>
-                <label for="job_enqueued_on">Queued: </label>
-                [% job.enqueued_on | $KohaDates with_hours = 1 %]
-            </li>
-            <li>
-                <label for="job_started_on">Started: </label>
-                [% job.started_on | $KohaDates with_hours = 1 %]
-            </li>
-            <li>
-                <label for="job_ended_on">Ended: </label>
-                [% job.ended_on | $KohaDates with_hours = 1 %]
-            </li>
-            <li><label for="job_data">Report: </label>
-                [% IF job.status != 'new' %][% PROCESS 'report' %][% END %]
-            </li>
-            <li><label for="job_data">Detailed messages: </label>
-                [% IF job.status != 'new' %][% PROCESS 'detail' %][% END %]
-            </li>
-        </ol>
-    </fieldset>
+    <div id="job_details" style="display:none">
+        <fieldset class="rows">
+            <ol>
+                <li><span class="label">Job ID: </span>[% job.id | html %]</li>
+                <li>
+                    <label for="job_status">Status: </label>
+                    <span id="job_status_description"></span>
+                </li>
+                <li><label for="job_progress">Progress: </label>[% job.progress || 0 | html %] / [% job.size | html %]</li>
+                <li>
+                    <label for="job_type">Type: </label>
+                    <span id="job_type_description"></span>
+                </li>
+                <li>
+                    <label for="job_enqueued_on">Queued: </label>
+                    [% job.enqueued_on | $KohaDates with_hours = 1 %]
+                </li>
+                <li>
+                    <label for="job_started_on">Started: </label>
+                    [% job.started_on | $KohaDates with_hours = 1 %]
+                </li>
+                <li>
+                    <label for="job_ended_on">Ended: </label>
+                    [% job.ended_on | $KohaDates with_hours = 1 %]
+                </li>
+            </ol>
+        </fieldset>
+        <div class="page-section">
+            <h2>Report</h2>
+            [% IF job.status != 'new' %][% PROCESS 'report' %][% END %]
+        </div>
+        <div class="page-section">
+            <h3>Detailed messages: </h3>
+            [% IF job.status != 'new' %][% PROCESS 'detail' %][% END %]
+        </div>
+    </div> <!-- /#job_details -->
 
     [% IF CAN_user_parameters_manage_background_jobs %]
         <fieldset class="action">
@@ -127,20 +131,22 @@
         <label for="include_last_hour">Only include jobs started in the last hour</label>
     </div>
 
-    <table id="table_jobs">
-        <thead>
-            <tr>
-                <th>Job ID</th>
-                <th data-filter="job_statuses">Status</th>
-                <th>Progress</th>
-                <th data-filter="job_types">Type</th>
-                <th>Queued</th>
-                <th>Started</th>
-                <th>Ended</th>
-                <th class="noExport">Actions</th>
-            </tr>
-        </thead>
-    </table>
+    <div class="page-section">
+        <table id="table_jobs">
+            <thead>
+                <tr>
+                    <th>Job ID</th>
+                    <th data-filter="job_statuses">Status</th>
+                    <th>Progress</th>
+                    <th data-filter="job_types">Type</th>
+                    <th>Queued</th>
+                    <th>Started</th>
+                    <th>Ended</th>
+                    <th class="noExport">Actions</th>
+                </tr>
+            </thead>
+        </table>
+    </div>
 [% END %]
 
             </main>
@@ -237,7 +243,7 @@
             [% IF op == 'view' %]
                 $("#job_status_description").html( get_job_status("[% job.status | html %]") );
                 $("#job_type_description").html( get_job_type("[% job.type | html %]") );
-                $("fieldset.rows").show();
+                $("#job_details").show();
             [% END %]
 
             let additional_filters = {
-- 
2.30.2