Bug 31028: Add ability to report catalog concerns from the OPAC

This patch adds the ability for patrons to report catalog concerns via
the opac.

Test plan
1) Enable the new `OpacCatalogConcerns` system preference
2) Navigate to the record details page of a biblio record on the OPAC
3) You should see a new 'Report a concern' option in the right side
   actions box
4) If not logged in you should have the login modal displayed and upon a
   successful login you should be redirected back to the details page
   with a new model displayed for entering concern details
5) Submit your concern with a title and details.

Signed-off-by: David Nind <david@davidnind.com>
Signed-off-by: Helen Oliver <HOliver@tavi-port.ac.uk>

Signed-off-by: Kyle M Hall <kyle@bywatersolutions.com>
Signed-off-by: Tomas Cohen Arazi <tomascohen@theke.io>

koha-tmpl/opac-tmpl/bootstrap/en/includes/modals/catalog_concern.inc

@@ -0,0 +1,31 @@
+<!-- Add concern modal -->
+<div class="modal" id="addConcernModal" tabindex="-1" role="dialog" aria-labelledby="addConcernModalLabel" aria-hidden="true">
+    <div class="modal-dialog modal-lg">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h3 class="modal-title" id="addConcernModalLabel">Report a concern</h3>
+                <button type="button" class="closebtn" data-dismiss="modal" aria-label="Close">
+                    <span aria-hidden="true">&times;</span>
+                </button>
+            </div>
+            <div class="modal-body">
+                <fieldset id="concern_fieldset">
+                    <div class="form-group">
+                        <label for="concern_title">Title: </label>
+                        <input type="text" name="concern_title" id="concern_title" required="required"/>
+                    </div>
+                    <div class="form-group">
+                        <label for="concern_body">Please describe your concerns: </label>
+                        <textarea class="form-control" name="concern_body" id="concern_body" required="required" rows="15"></textarea>
+                    </div>
+                </fieldset>
+            </div>
+            <div class="modal-footer">
+                <input type="hidden" name="biblio_id" id="concern_biblio" value="[% biblio.biblionumber | html %]">
+                <input type="hidden" name="reporter_id" id="concern_reporter" value="[% borrowernumber | html %]">
+                <button type="submit" id="addConfirm" class="btn btn-primary">Submit</button>
+                <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
+            </div>
+        </div>
+    </div>
+</div>

koha-tmpl/opac-tmpl/bootstrap/en/includes/opac-bottom.inc

@@ -124,6 +124,9 @@
 [% Asset.js("lib/bootstrap/js/bootstrap.bundle.min.js") | $raw %]
 [% Asset.js("lib/fontfaceobserver.min.js") | $raw %]
 [% Asset.js("lib/enquire.min.js") | $raw %]
+<script>
+    let logged_in_user_id = "[% logged_in_user.borrowernumber | html %]";
+</script>
 [% Asset.js("js/global.js") | $raw %]
 [% IF ( OPACAmazonCoverImages || SyndeticsCoverImages ) %]
     <script>

koha-tmpl/opac-tmpl/bootstrap/en/includes/opac-detail-sidebar.inc

@@ -42,6 +42,10 @@
         <li><a class="suggest_for_purchase btn btn-link btn-lg" href="/cgi-bin/koha/opac-suggestions.pl?op=add&biblionumber=[% biblio.biblionumber | url %]"><i class="fa fa-fw fa-gift" aria-hidden="true"></i> Suggest for purchase</a></li>
     [% END %]
 
+    [% IF Koha.Preference('OpacCatalogConcerns') %]
+        <li><a class="report_a_concern btn btn-link btn-lg" href="#" data-toggle="modal" data-target="#addConcernModal"><i class="fa fa-fw fa-warning" aria-hidden="true"></i> Report a concern</a></li>
+    [% END %]
+
     [% IF ( OpacHighlightedWords && query_desc ) %]
     <li>
         <a href="#" class="highlight_toggle btn btn-link btn-lg" id="highlight_toggle_off"><i class="fa fa-fw fa-pencil" aria-hidden="true"></i> Unhighlight</a>

koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-detail.tt

@@ -1438,7 +1438,14 @@
     </div> <!-- /.modal-dialog -->
 </div> <!-- /.modal -->
 
+[% IF Koha.Preference('OpacCatalogConcerns') %]
+    [% INCLUDE 'modals/catalog_concern.inc' %]
+[% END %]
+
 [% BLOCK jsinclude %]
+    [% IF Koha.Preference('OpacCatalogConcerns') %]
+        [% Asset.js("js/modals/catalog_concern.js") | $raw %]
+    [% END %]
     [% INCLUDE 'datatables.inc' %]
     [% INCLUDE 'columns_settings.inc' %]
     [% INCLUDE greybox.inc %]

koha-tmpl/opac-tmpl/bootstrap/js/modals/catalog_concern.js

@@ -0,0 +1,47 @@
+$(document).ready(function() {
+
+    // Detect that we were redirected here after login and re-open modal
+    let urlParams = new URLSearchParams(window.location.search);
+    if (urlParams.has('modal')) {
+        let modal = urlParams.get('modal');
+        history.replaceState && history.replaceState(
+            null, '', location.pathname + location.search.replace(/[\?&]modal=[^&]+/, '').replace(/^&/, '?')
+        );
+        if (modal == 'concern') {
+            $("#addConcernModal").modal('show');
+        }
+    }
+
+    $('#addConcernModal').on('show.bs.modal', function(e) {
+        if (logged_in_user_id === "") {
+            $('#modalAuth').append('<input type="hidden" name="return" value="' + window.location.pathname + window.location.search + '&modal=concern" />');
+            $('#loginModal').modal('show');
+            return false;
+        }
+    });
+
+    $('#addConcernModal').on('click', '#addConfirm', function(e) {
+        let concern_title = $('#concern_title').val();
+        let concern_body = $('#concern_body').val();
+        let biblio_id = $('#concern_biblio').val();
+        let reporter_id = $('#concern_reporter').val();
+
+        params = {
+            title: concern_title,
+            body: concern_body,
+            biblio_id: biblio_id,
+            reporter_id: reporter_id,
+        };
+
+        $.ajax({
+            url: '/api/v1/public/tickets',
+            type: 'POST',
+            data: JSON.stringify(params),
+            success: function(data) {
+                $('#addConcernModal').modal('hide');
+                $('#concern_body').val('');
+            },
+            contentType: "json"
+        });
+    });
+});