Bug 21063: Add "Columns settings" for ILL
[koha.git] / koha-tmpl / intranet-tmpl / prog / en / modules / ill / ill-requests.tt
index e57115b..6351410 100644 (file)
+[% USE raw %]
+[% USE Asset %]
 [% USE Branches %]
 [% USE Koha %]
+[% USE KohaDates %]
+[% SET footerjs = 1 %]
+[% USE AuthorisedValues %]
+[% USE ColumnsSettings %]
 
 [% INCLUDE 'doc-head-open.inc' %]
-<title>Koha &rsaquo; ILL requests  &rsaquo;</title>
+<title>Koha &rsaquo; ILL requests</title>
 [% INCLUDE 'doc-head-close.inc' %]
-<script type="text/javascript" src="[% interface %]/lib/jquery/plugins/jquery.checkboxes.min.js"></script>
-<link rel="stylesheet" type="text/css" href="[% interface %]/[% theme %]/css/datatables.css">
-[% INCLUDE 'datatables.inc' %]
-<script type="text/javascript">
-    //<![CDATA[
-    $(document).ready(function() {
-
-        // Illview Datatable setup
-
-        // Fields we don't want to display
-        var ignore = [
-            'accessurl',
-            'backend',
-            'completed',
-            'branch',
-            'capabilities',
-            'cost',
-            'medium',
-            'notesopac',
-            'notesstaff',
-            'placed',
-            'replied'
-        ];
-
-        // Fields we need to expand (flatten)
-        var expand = [
-            'metadata',
-            'patron'
-        ];
-
-        // Expanded fields
-        // This is auto populated
-        var expanded = {};
-
-        // The core fields that should be displayed first
-        var core = [
-            'metadata_Author',
-            'metadata_Title',
-            'borrowername',
-            'biblio_id',
-            'branchcode',
-            'status',
-            'updated',
-            'illrequest_id',
-            'action'
-        ];
-
-        // Extra fields that we need to tack on to the end
-        var extra = [ 'action' ];
-
-        // Remove any fields we're ignoring
-        var removeIgnore = function(dataObj) {
-            dataObj.forEach(function(thisRow) {
-                ignore.forEach(function(thisIgnore) {
-                    if (thisRow.hasOwnProperty(thisIgnore)) {
-                        delete thisRow[thisIgnore];
-                    }
-                });
-            });
-        };
-
-        // Expand any fields we're expanding
-        var expandExpand = function(row) {
-            expand.forEach(function(thisExpand) {
-                if (row.hasOwnProperty(thisExpand)) {
-                    if (!expanded.hasOwnProperty(thisExpand)) {
-                        expanded[thisExpand] = [];
-                    }
-                    var expandObj = row[thisExpand];
-                    Object.keys(expandObj).forEach(
-                        function(thisExpandCol) {
-                            var expColName = thisExpand + '_' + thisExpandCol;
-                            // Keep a list of fields that have been expanded
-                            // so we can create toggle links for them
-                            if (expanded[thisExpand].indexOf(expColName) == -1) {
-                                expanded[thisExpand].push(expColName);
-                            }
-                            expandObj[expColName] =
-                                expandObj[thisExpandCol];
-                            delete expandObj[thisExpandCol];
-                        }
-                    );
-                    $.extend(true, row, expandObj);
-                    delete row[thisExpand];
-                }
-            });
-        };
-
-        // Build a de-duped list of all column names
-        var allCols = {};
-        core.map(function(thisCore) {
-            allCols[thisCore] = 1;
-        });
-        var unionColumns = function(row) {
-            Object.keys(row).forEach(function(col) {
-                if (ignore.indexOf(col) == -1) {
-                    allCols[col] = 1;
-                }
-            });
-        };
-
-        // Some rows may not have fields that other rows have,
-        // so make sure all rows have the same fields
-        var fillMissing = function(row) {
-            Object.keys(allCols).forEach(function(thisCol) {
-                row[thisCol] = (!row.hasOwnProperty(thisCol)) ?
-                    null :
-                    row[thisCol];
-            });
-        }
-
-        // Strip the expand prefix if it exists, we do this for display
-        var stripPrefix = function(value) {
-            expand.forEach(function(thisExpand) {
-                var regex = new RegExp(thisExpand + '_', 'g');
-                value = value.replace(regex, '');
-            });
-            return value;
-        };
-
-        // Our 'render' function for borrowerlink
-        var createBorrowerLink = function(data, type, row) {
-            return '<a title="View borrower details" ' +
-                'href="/cgi-bin/koha/members/moremember.pl?' +
-                'borrowernumber='+row.borrowernumber+'">' +
-                row.patron_firstname + ' ' + row.patron_surname +
-                '</a>';
-        };
-
-        // Render function for request ID
-        var createRequestId = function(data, type, row) {
-            return row.id_prefix + row.illrequest_id;
-        };
-
-        // Render function for request status
-        var createStatus = function(data, type, row, meta) {
-            var origData = meta.settings.oInit.originalData;
-            if (origData.length > 0) {
-                return meta.settings.oInit.originalData[0].capabilities[
-                    row.status
-                ].name;
-            } else {
-                return '';
-            }
-        };
-
-        // Render function for creating a row's action link
-        var createActionLink = function(data, type, row) {
-            return '<a class="btn btn-default btn-sm" ' +
-                'href="/cgi-bin/koha/ill/ill-requests.pl?' +
-                'method=illview&amp;illrequest_id=' +
-                row.illrequest_id +
-                '">Manage request</a>' +
-                '</div>'
-        };
-
-        // Columns that require special treatment
-        var specialCols = {
-            action: {
-                name: '',
-                func: createActionLink
-            },
-            borrowername: {
-                name: 'Borrower',
-                func: createBorrowerLink
-            },
-            illrequest_id: {
-                name: 'Request number',
-                func: createRequestId
-            },
-            status: {
-                name: 'Status',
-                func: createStatus
-            },
-            biblio_id: {
-                name: 'Biblio number'
-            },
-            branchcode: {
-                name: 'Branch code'
-            }
-        };
-
-        // Helper for handling prefilter column names
-        function toColumnName(myVal) {
-            return myVal
-                .replace(/^filter/, '')
-                .replace(/([A-Z])/g, "_$1")
-                .replace(/^_/,'').toLowerCase();
-        };
-
-        // Toggle request attributes in Illview
-        $('#toggle_requestattributes').click(function() {
-            $('#requestattributes').toggleClass('content_hidden');
-        });
-
-        // Filter partner list
-        $('#partner_filter').keyup(function() {
-            var needle = $('#partner_filter').val();
-            $('#partners > option').each(function() {
-                var regex = new RegExp(needle, 'i');
-                if (
-                    needle.length == 0 ||
-                    $(this).is(':selected') ||
-                    $(this).text().match(regex)
-                ) {
-                    $(this).show();
-                } else {
-                    $(this).hide();
-                }
-            });
-        });
-
-        // Get our data from the API and process it prior to passing
-        // it to datatables
-        var ajax = $.ajax(
-            '/api/v1/illrequests?embed=metadata,patron,capabilities,branch'
-            ).done(function() {
-                var data = JSON.parse(ajax.responseText);
-                // Make a copy, we'll be removing columns next and need
-                // to be able to refer to data that has been removed
-                var dataCopy = $.extend(true, [], data);
-                // Remove all columns we're not interested in
-                removeIgnore(dataCopy);
-                // Expand columns that need it and create an array
-                // of all column names
-                $.each(dataCopy, function(k, row) {
-                    expandExpand(row);
-                    unionColumns(row);
-                });
-                // Append any extra columns we need to tag on
-                if (extra.length > 0) {
-                    extra.forEach(function(thisExtra) {
-                        allCols[thisExtra] = 1;
-                    });
-                };
-                // Different requests will have different columns,
-                // make sure they all have the same
-                $.each(dataCopy, function(k, row) {
-                    fillMissing(row);
-                });
-
-                // Assemble an array of column definitions for passing
-                // to datatables
-                var colData = [];
-                Object.keys(allCols).forEach(function(thisCol) {
-                    // We may have defined a pretty name for this column
-                    var colName = (
-                        specialCols.hasOwnProperty(thisCol) &&
-                        specialCols[thisCol].hasOwnProperty('name')
-                    ) ?
-                        specialCols[thisCol].name :
-                        thisCol;
-                    // Create the table header for this column
-                    var str = '<th>' + stripPrefix(colName) + '</th>';
-                    $(str).appendTo('#illview-header');
-                    // Create the base column object
-                    var colObj = {
-                        name: thisCol,
-                        className: thisCol
-                    };
-                    // We may need to process the data going in this
-                    // column, so do it if necessary
-                    if (
-                        specialCols.hasOwnProperty(thisCol) &&
-                        specialCols[thisCol].hasOwnProperty('func')
-                    ) {
-                        colObj.render = specialCols[thisCol].func;
-                    } else {
-                        colObj.data = thisCol
-                    }
-                    colData.push(colObj);
-                });
-
-                // Create the toggle links for all metadata fields
-                var links = [];
-                expanded.metadata.forEach(function(thisExpanded) {
-                    if (core.indexOf(thisExpanded) == -1) {
-                        links.push(
-                            '<a href="#" class="toggle-vis" data-column="' +
-                            thisExpanded + '">' + stripPrefix(thisExpanded) +
-                            '</a>'
-                        );
-                    }
-                });
-                $('#column-toggle').append(links.join(' | '));
-
-                // Initialise the datatable
-                var myTable = $('#ill-requests').DataTable($.extend(true, {}, dataTablesDefaults, {
-                    aoColumnDefs: [  // Last column shouldn't be sortable or searchable
-                        {
-                            aTargets: [ 'action' ],
-                            bSortable: false,
-                            bSearchable: false
-                        },
-                    ],
-                    aaSorting: [[ 6, 'desc' ]], // Default sort, updated descending
-                    processing: true, // Display a message when manipulating
-                    language: {
-                        loadingRecords: "Please wait - loading requests...",
-                        zeroRecords: "No requests were found"
-                    },
-                    iDisplayLength: 10, // 10 results per page
-                    sPaginationType: "full_numbers", // Pagination display
-                    deferRender: true, // Improve performance on big datasets
-                    data: dataCopy,
-                    columns: colData,
-                    originalData: data // Enable render functions to access
-                                       // our original data
-                }));
-
-                // Reset columns to default
-                var resetColumns = function() {
-                    Object.keys(allCols).forEach(function(thisCol) {
-                        myTable.column(thisCol + ':name').visible(core.indexOf(thisCol) != -1);
-                    });
-                    myTable.columns.adjust().draw(false);
-                };
-
-                // Handle the click event on a toggle link
-                $('a.toggle-vis').on('click', function(e) {
-                    e.preventDefault();
-                    var column = myTable.column(
-                        $(this).data('column') + ':name'
-                    );
-                    column.visible(!column.visible());
-                });
-
-                // Reset column toggling
-                $('#reset-toggle').click(function() {
-                    resetColumns();
-                });
-
-                // Handle a prefilter request and do the prefiltering
-                var filters = $('#ill-requests').data();
-                if (typeof filters !== 'undefined') {
-                    var filterNames = Object.keys(filters).filter(
-                        function(thisData) {
-                            return thisData.match(/^filter/);
-                        }
-                    );
-                    filterNames.forEach(function(thisFilter) {
-                        var filterName = toColumnName(thisFilter) + ':name';
-                        var regex = '^'+filters[thisFilter]+'$';
-                        myTable.columns(filterName).search(regex, true, false);
-                    });
-                    myTable.draw();
-                }
-
-                // Initialise column hiding
-                resetColumns();
-
-            }
-        );
-
-    });
-    //]]>
-</script>
 </head>
 
 <body id="illrequests" class="ill">
 
 <div id="doc3" class="yui-t2">
     <div id="bd">
+        [% IF query_type == 'illlist' %]
+        <div id="illfilter_yui_column" class="yui-b">
+            <form method="get" id="illfilter_form">
+                <fieldset class="brief">
+                    <h3>Filters</h3>
+                    <ol>
+                        <li>
+                            <label for="illfilter_status">Status:</label>
+                            <select name="illfilter_status" id="illfilter_status">
+                                <option value=""></option>
+                            </select>
+                        </li>
+                        <li>
+                            <label for="illfilter_dateplaced_start">Date placed between:</label>
+                            <input type="text" name="illfilter_dateplaced_start" id="illfilter_dateplaced_start" class="datepicker" />
+                        </li>
+                        <li>
+                            <label for="illfilter_dateplaced_end">and:</label>
+                            <input type="text" name="illfilter_dateplaced_end" id="illfilter_dateplaced_end" class="datepicker" />
+                        </li>
+                        <li>
+                            <label for="illfilter_datemodified_start">Updated between:</label>
+                            <input type="text" name="illfilter_datemodified_start" id="illfilter_datemodified_start" class="datepicker" />
+                        </li>
+                        <li>
+                            <label for="illfilter_datemodified_end">and:</label>
+                            <input type="text" name="illfilter_datemodified_end" id="illfilter_datemodified_end" class="datepicker" />
+                        </li>
+                        <li>
+                            <label for="illfilter_branchname">Library:</label>
+                            <select name="illfilter_branchname" id="illfilter_branchname">
+                                <option value=""></option>
+                            </select>
+                        </li>
+                        <li>
+                            <label for="illfilter_patron">Patron:</label>
+                            <input type="text" name="illfilter_patron" id="illfilter_patron" />
+                        </li>
+                    </ol>
+                    <fieldset class="action">
+                        <input type="submit" value="Search" />
+                        <input type="button" value="Clear" id="clear_search" />
+                    </fieldset>
+                </fieldset>
+            </form>
+        </div>
+        [% END %]
         <div id="yui-main">
             <div id="interlibraryloans" class="yui-b">
-        [% IF !backends_available %]
+        [% IF !backends_available || !has_branch %]
             <div class="dialog message">ILL module configuration problem. Take a look at the <a href="/cgi-bin/koha/about.pl#sysinfo">about page</a></div>
         [% ELSE %]
                 [% INCLUDE 'ill-toolbar.inc' %]
                     <!-- Dispatch on Status -->
                     <p>We encountered an error:</p>
                     <p>
-                      <pre>[% whole.message %] ([% whole.status %])</pre>
+                      <pre>[% whole.message | html %] ([% whole.status | html %])</pre>
                     </p>
                 [% END %]
 
                 [% IF query_type == 'create' %]
                     <h1>New ILL request</h1>
-                    [% IF whole.stage == 'copyrightclearance' %]
-                        <div>
-                            <p>
-                                [% Koha.Preference('ILLModuleCopyrightClearance') %]
-                            </p>
-                            <a href="?method=create&stage=copyrightclearance&backend=[% whole.value.backend %]"
-                               class="btn btn-sm btn-default btn-group"><i class="fa fa-check">Yes</i></a>
-                            <a href="/cgi-bin/koha/ill/ill-requests.pl"
-                               class="btn btn-sm btn-default btn-group"><i class="fa fa-times">No</i></a>
-                        </div>
-                    [% ELSE %]
-                        [% PROCESS $whole.template %]
-                    [% END %]
+                    [% PROCESS $whole.template %]
 
                 [% ELSIF query_type == 'confirm' %]
                     <h1>Confirm ILL request</h1>
 
                 [% ELSIF query_type == 'generic_confirm' %]
                     <h1>Place request with partner libraries</h1>
+                  [% IF error %]
+                    [% IF error == 'no_target_email' %]
+                        <div class="alert">
+                            No target email addresses found. Either select at least
+                            one partner or check your ILL partner library records.
+                        </div>
+                    [% ELSIF error == 'no_library_email' %]
+                        <div class="alert">
+                            Your library has no usable email address. Please set it.
+                        </div>
+                    [% ELSIF error == 'unkown_error' %]
+                        <div class="alert">
+                            Unknown error processing your request. Contact your administrator.
+                        </div>
+                    [% END %]
+                  [% END %]
                     <!-- Start of GENERIC_EMAIL case -->
                     [% IF whole.value.partners %]
-                       [% ill_url = here_link _ "?method=illview&illrequest_id=" _ request.illrequest_id %]
-                        <form method="POST" action=[% here_link %]>
+                       [% ill_url = "/cgi-bin/koha/ill/ill-requests.pl?method=illview&illrequest_id=" _ request.illrequest_id %]
+                        <form method="POST" action="/cgi-bin/koha/ill/ill-requests.pl">
                             <fieldset class="rows">
                                 <legend>Interlibrary loan request details</legend>
                                 <ol>
                                     <li>
                                         <label for="partner_filter">Filter partner libraries:</label>
-                                        <input type="text" id="partner_filter">
+                                        <input type="text" id="partner_filter" />
                                     </li>
                                     <li>
-                                        <label for="partners">Select partner libraries:</label>
-                                        <select size="5" multiple="true" id="partners"
-                                                name="partners">
+                                        <label for="partners" class="required">Select partner libraries:</label>
+                                        <select size="5" multiple="true" id="partners" name="partners" required="required">
                                             [% FOREACH partner IN whole.value.partners %]
-                                                <option value=[% partner.email %]>
+                                                <option value=[% partner.email | html %]>
                                                     [% partner.branchcode _ " - " _ partner.surname %]
                                                 </option>
                                             [% END %]
 
                                     </li>
                                     <li>
-                                        <label for="subject">Subject Line</label>
-                                        <input type="text" name="subject"
-                                               id="subject" type="text"
-                                               value="[% whole.value.draft.subject %]"/>
+                                        <label for="subject" class="required">Subject line:</label>
+                                        <input type="text" name="subject" id="subject" type="text" value="[% whole.value.draft.subject | html %]" required="required" />
                                     </li>
                                     <li>
-                                        <label for="body">Email text:</label>
-                                        <textarea name="body" id="body" rows="20" cols="80">[% whole.value.draft.body %]</textarea>
+                                        <label for="body" class="required">Email text:</label>
+                                        <textarea name="body" id="body" rows="20" cols="80" required="required">[% whole.value.draft.body | html %]</textarea>
                                     </li>
                                 </ol>
                                 <input type="hidden" value="generic_confirm" name="method">
                                 <input type="hidden" value="draft" name="stage">
-                                <input type="hidden" value="[% request.illrequest_id %]" name="illrequest_id">
+                                <input type="hidden" value="[% request.illrequest_id | html %]" name="illrequest_id">
                             </fieldset>
                             <fieldset class="action">
                                 <input type="submit" class="btn btn-default" value="Send email"/>
-                                <span><a href="[% ill_url %]" title="Return to request details">Cancel</a></span>
+                                <span><a href="[% ill_url | url %]" title="Return to request details">Cancel</a></span>
                             </fieldset>
                         </form>
                     [% ELSE %]
                             <legend>Interlibrary loan request details</legend>
                             <p>No partners have been defined yet. Please create appropriate patron records (by default ILLLIBS category).</p>
                             <p>Be sure to provide email addresses for these patrons.</p>
-                            <p><span><a href="[% ill_url %]" title="Return to request details">Cancel</a></span></p>
+                            <p><span><a href="[% ill_url | url %]" title="Return to request details">Cancel</a></span></p>
                         </fieldset>
                     [% END %]
                 <!-- generic_confirm ends here -->
 
                 [% ELSIF query_type == 'edit_action' %]
-                    <form method="POST" action=[% here_link %]>
+                    <form method="POST" action="/cgi-bin/koha/ill/ill-requests.pl">
                         <fieldset class="rows">
                             <legend>Request details</legend>
                             <ol>
+                                [% type = request.get_type %]
                                 <li class="borrowernumber">
-                                    <label for="borrowernumber">Borrower number:</label>
-                                    <input name="borrowernumber" id="borrowernumber" type="text" value="[% request.borrowernumber %]">
+                                    <label for="borrowernumber">Patron ID:</label>
+                                    [% request.borrowernumber | html %]
                                 </li>
                                 <li class="biblio_id">
-                                    <label for="biblio_id" class="biblio_id">Biblio number:</label>
-                                    <input name="biblio_id" id="biblio_id" type="text" value="[% request.biblio_id %]">
+                                    <label for="biblio_id" class="biblio_id">Bibliographic record ID:</label>
+                                    <input name="biblio_id" id="biblio_id" type="text" value="[% request.biblio_id | html %]">
                                 </li>
                                 <li class="branchcode">
-                                    <label for="branchcode" class="branchcode">Branch:</label>
-                                    <select name="branchcode" id="branch">
-                                        [% FOREACH branch IN branches %]
-                                            [% IF ( branch.branchcode == request.branchcode ) %]
-                                                <option value="[% branch.branchcode %]" selected="selected">
-                                                    [% branch.branchname %]
-                                                </option>
-                                            [% ELSE %]
-                                                <option value="[% branch.branchcode %]">
-                                                    [% branch.branchname %]
-                                                </option>
-                                            [% END %]
-                                        [% END %]
+                                    <label for="library" class="branchcode">Library:</label>
+                                    <select name="branchcode" id="library">
+                                        [% PROCESS options_for_libraries libraries => Branches.all( selected => request.branchcode ) %]
                                     </select>
                                 </li>
                                 <li class="status">
                                     <label class="status">Status:</label>
                                     [% stat = request.status %]
-                                    [% request.capabilities.$stat.name %]
+                                    [% current_alias = request.status_alias %]
+                                    <select id="status_alias" name="status_alias">
+                                        [% IF !current_alias %]
+                                        <option value="" selected>
+                                        [% ELSE %]
+                                        <option value="">
+                                        [% END %]
+                                            [% request.capabilities.$stat.name | html %]
+                                        </option>
+                                        [% FOREACH alias IN AuthorisedValues.Get('ILLSTATUS') %]
+                                            [% IF alias.authorised_value == current_alias %]
+                                            <option value="[% alias.authorised_value | html %]" selected>
+                                            [% ELSE %]
+                                            <option value="[% alias.authorised_value | html %]">
+                                            [% END %]
+                                                [% alias.lib | html %]
+                                            </option>
+                                        [% END %]
+                                    </select>
                                 </li>
                                 <li class="updated">
                                     <label class="updated">Last updated:</label>
-                                    [% request.updated %]
+                                    [% request.updated | $KohaDates  with_hours => 1 %]
                                 </li>
                                 <li class="medium">
                                     <label class="medium">Request type:</label>
-                                    [% request.medium %]
+                                    [% IF type %][% type | html %][% ELSE %]<span>N/A</span>[% END %]
                                 </li>
                                 <li class="cost">
                                     <label class="cost">Cost:</label>
-                                    [% request.cost %]
+                                    [% IF request.cost %][% request.cost | html %][% ELSE %]<span>N/A</span>[% END %]
+                                </li>
+                                <li class="price_paid">
+                                    <label class="price_paid">Price paid:</label>
+                                    <input name="price_paid" id="price_paid" type="text" value="[% request.price_paid | html %]">
                                 </li>
                                 <li class="req_id">
                                     <label class="req_id">Request number:</label>
-                                    [% request.id_prefix _ request.illrequest_id %]
+                                    [% request.id_prefix _ request.illrequest_id | html %]
                                 </li>
                                 <li class="notesstaff">
                                     <label for="notesstaff" class="notesstaff">Staff notes:</label>
-                                    <textarea name="notesstaff" id="notesstaff" rows="5">[% request.notesstaff %]</textarea>
+                                    <textarea name="notesstaff" id="notesstaff" rows="5">[% request.notesstaff | html %]</textarea>
                                 </li>
                                 <li class="notesopac">
                                     <label for="notesopac" class="notesopac">Opac notes:</label>
-                                    <textarea name="notesopac" id="notesopac" rows="5">[% request.notesopac %]</textarea>
+                                    <textarea name="notesopac" id="notesopac" rows="5">[% request.notesopac | html %]</textarea>
                                 </li>
                             </ol>
                         </fieldset>
                         <fieldset class="action">
                             <input type="hidden" value="edit_action" name="method">
                             <input type="hidden" value="form" name="stage">
-                            <input type="hidden" value="[% request.illrequest_id %]" name="illrequest_id">
+                            <input type="hidden" value="[% request.illrequest_id | html %]" name="illrequest_id">
+                            <input type="hidden" value="[% request.borrowernumber | html %]" name="borrowernumber">
                             <input type="submit" value="Submit">
-                            <a class="cancel" href="/cgi-bin/koha/ill/ill-requests.pl?method=illview&amp;illrequest_id=[% request.id %]">Cancel</a>
+                            <a class="cancel" href="/cgi-bin/koha/ill/ill-requests.pl?method=illview&amp;illrequest_id=[% request.id | html %]">Cancel</a>
                         </fieldset>
                     </form>
 
 
                     <div class="dialog alert">
                         <h3>Are you sure you wish to delete this request?</h3>
-                        <p>
-                            <a class="btn btn-default btn-sm approve" href="?method=delete&amp;illrequest_id=[% request.id %]&amp;confirmed=1"><i class="fa fa-fw fa-check"></i>Yes</a>
-                            <a class="btn btn-default btn-sm deny" href="?method=illview&amp;illrequest_id=[% request.id %]"><i class="fa fa-fw fa-remove"></i>No</a>
-                        </p>
+                        <form action="/cgi-bin/koha/ill/ill-requests.pl" method="post">
+                            <input type="hidden" name="method" value="delete" />
+                            <input type="hidden" name="confirmed" value="1" />
+                            <input type="hidden" name="illrequest_id" value="[% request.id | html %]" />
+                            <button type="submit" class="btn btn-default btn-sm approve"><i class="fa fa-fw fa-check"></i> Yes, delete</button>
+                        </form>
+                        <a class="btn btn-default btn-sm deny" href="/cgi-bin/koha/ill/ill-requests.pl?method=illview&amp;illrequest_id=[% request.id | html %]"><i class="fa fa-fw fa-remove"></i>No, do not delete</a>
                     </div>
 
-
                 [% ELSIF query_type == 'illview' %]
-                    [% actions = request.available_actions %]
-                    [% capabilities = request.capabilities %]
                     [% req_status = request.status %]
+
+                    [% IF error %]
+                      [% IF error == 'migrate_target' %]
+                          <div class="alert">
+                              The backend you tried to migrate to does not yet support migrations, please try again with an alternative target.
+                          </div>
+                      [% END %]
+                    [% END %]
+
                     <h1>Manage ILL request</h1>
-                    <div id="toolbar" class="btn-toolbar">
-                        <a title="Edit request" id="ill-toolbar-btn-edit-action" class="btn btn-sm btn-default" href="/cgi-bin/koha/ill/ill-requests.pl?method=edit_action&amp;illrequest_id=[% request.illrequest_id %]">
+                    <div id="request-toolbar" class="btn-toolbar">
+                        <a title="Edit request" id="ill-toolbar-btn-edit-action" class="btn btn-sm btn-default" href="/cgi-bin/koha/ill/ill-requests.pl?method=edit_action&amp;illrequest_id=[% request.illrequest_id | html %]">
                         <span class="fa fa-pencil"></span>
                         Edit request
                         </a>
-                        [% FOREACH action IN actions %]
-                            [% IF action.method != 0 %]
-                                <a title="[% action.ui_method_name %]" id="ill-toolbar-btn-[% action.id | lower %]" class="btn btn-sm btn-default" href="/cgi-bin/koha/ill/ill-requests.pl?method=[% action.method %]&amp;illrequest_id=[% request.illrequest_id %]">
-                                <span class="fa [% action.ui_method_icon %]"></span>
-                                [% action.ui_method_name %]
+                        [% FOREACH action IN request.available_actions %]
+                            [% IF action.method == 'migrate' %]
+                                [% IF backends.size > 2 %]
+                                    <div class="dropdown btn-group">
+                                        <button class="btn btn-sm btn-default dropdown-toggle" type="button" id="ill-migrate-dropdown" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
+                                            <i class="fa [% action.ui_method_icon | html %]"></i> [% action.ui_method_name | html %] <span class="caret"></span>
+                                        </button>
+                                        <ul class="dropdown-menu" aria-labelledby="ill-migrate-dropdown">
+                                            [% FOREACH backend IN backends %]
+                                                [% IF backend != request.backend %]
+                                                    <li><a href="/cgi-bin/koha/ill/ill-requests.pl?method=[% action.method | uri %]&amp;illrequest_id=[% request.illrequest_id | uri %]&amp;backend=[% backend | uri %]">[% backend | html %]</a></li>
+                                                [% END %]
+                                            [% END %]
+                                        </ul>
+                                    </div>
+                                [% ELSIF backends.size == 2 %]
+                                    [% FOREACH backend IN backends %]
+                                        [% IF backend != request.backend %]
+                                            <a title="[% action.ui_method_name | html %]" id="ill-toolbar-btn-[% action.id | lower | html %]" class="btn btn-sm btn-default" href="/cgi-bin/koha/ill/ill-requests.pl?method=[% action.method | uri %]&amp;illrequest_id=[% request.illrequest_id | uri %]&amp;backend=[% backend | uri %]">
+                                            <span class="fa [% action.ui_method_icon | html %]"></span>
+                                            [% action.ui_method_name | html %]
+                                            </a>
+                                        [% END %]
+                                    [% END %]
+                                [% END %]
+                            [% ELSIF action.method != 0 %]
+                                <a title="[% action.ui_method_name | html %]" id="ill-toolbar-btn-[% action.id | lower | html %]" class="btn btn-sm btn-default" href="/cgi-bin/koha/ill/ill-requests.pl?method=[% action.method | uri %]&amp;illrequest_id=[% request.illrequest_id | uri %]">
+                                <span class="fa [% action.ui_method_icon | html %]"></span>
+                                [% action.ui_method_name | html %]
                                 </a>
                             [% END %]
                         [% END %]
+                        <a title="Display supplier metadata" id="ill-request-display-metadata" class="btn btn-sm btn-default pull-right" href="#">
+                            <span class="fa fa-eye"></span>
+                            Display supplier metadata
+                        </a>
+                        <a title="ILL request log" id="ill-request-display-log" class="btn btn-sm btn-default pull-right" href="#">
+                            <span class="fa fa-calendar"></span>
+                            ILL request log
+                        </a>
                     </div>
-                    <div id="ill-view-panel" class="panel panel-default">
+                    <div class="ill-view-panel panel panel-default">
                         <div class="panel-heading">
                             <h3>Request details</h3>
                         </div>
                         <div class="panel-body">
                             <h4>Details from library</h4>
                             <div class="rows">
-                                <div class="orderid">
-                                    <span class="label orderid">Order ID:</span>
-                                    [% request.orderid || "N/A" %]
-                                </div>
-                                <div class="borrowernumber">
-                                    <span class="label borrowernumber">Borrower:</span>
-                                    [% borrowerlink = "/cgi-bin/koha/members/moremember.pl" _ "?borrowernumber=" _ request.patron.borrowernumber %]
-                                    <a href="[% borrowerlink %]" title="View borrower details">
-                                    [% request.patron.firstname _ " " _ request.patron.surname _ " [" _ request.patron.cardnumber _ "]" %]
-                                    </a>
-                                </div>
+                                <ol>
+                                    <li class="orderid">
+                                        <span class="label orderid">Order ID:</span>
+                                        [% IF request.orderid %][% request.orderid | html %][% ELSE %]<span>N/A</span>[% END %]
+                                    </li>
+                                    <li class="borrowernumber">
+                                        <span class="label borrowernumber">Patron:</span>
+                                        [% borrowerlink = "/cgi-bin/koha/members/moremember.pl" _ "?borrowernumber=" _ request.patron.borrowernumber %]
+                                        <a href="[% borrowerlink | url %]" title="View borrower details">
+                                        [% request.patron.firstname _ " " _ request.patron.surname _ " [" _ request.patron.cardnumber _ "]" | html %]
+                                        </a>
+                                    </li>
 
-                                <div class="biblio_id">
-                                    <span class="label biblio_id">Biblio number:</span>
-                                    [% request.biblio_id || "N/A" %]
-                                </div>
-                                <div class="branchcode">
-                                    <span class="label branchcode">Branch:</span>
-                                    [% Branches.GetName(request.branchcode) %]
-                                </div>
-                                <div class="status">
-                                    <span class="label status">Status:</span>
-                                    [% capabilities.$req_status.name %]
-                                </div>
-                                <div class="updated">
-                                    <span class="label updated">Last updated:</span>
-                                    [% request.updated %]
+                                    <li class="biblio_id">
+                                        <span class="label biblio_id">Bibliographic record ID:</span>
+                                        [% IF request.biblio_id %]
+                                            <a href="/cgi-bin/koha/catalogue/detail.pl?biblionumber=[% request.biblio_id | uri %]">[% request.biblio_id | html %]</a>
+                                        [% ELSE %]
+                                            <span>N/A</span>
+                                        [% END %]
+                                    </li>
+                                    <li class="branchcode">
+                                        <span class="label branchcode">Library:</span>
+                                        [% Branches.GetName(request.branchcode) | html %]
+                                    </li>
+                                    <li class="status">
+                                        <span class="label status">Status:</span>
+                                        [% IF request.statusalias %]
+                                            [% request.statusalias.lib | html %]
+                                        [% ELSE %]
+                                            [% request.capabilities.$req_status.name | html%]
+                                        [% END %]
+                                    </li>
+                                    <li class="updated">
+                                        <span class="label updated">Last updated:</span>
+                                        [% request.updated | $KohaDates  with_hours => 1 %]
+                                    </li>
+                                    <li class="medium">
+                                        <span class="label medium">Request type:</span>
+                                        [% type = request.get_type %]
+                                        [% IF type %][% type | html %][% ELSE %]<span>N/A</span>[% END %]
+                                    </li>
+                                    <li class="cost">
+                                        <span class="label cost">Cost:</span>
+                                        [% IF request.cost %][% request.cost | html %][% ELSE %]<span>N/A</span>[% END %]
+                                    </li>
+                                    <li class="price_paid">
+                                        <span class="label price_paid">Price paid:</span>
+                                        [% IF request.price_paid %][% request.price_paid | html %][% ELSE %]<span>N/A</span>[% END %]
+                                    </li>
+                                    <li class="req_id">
+                                        <span class="label req_id">Request number:</span>
+                                        [% request.id_prefix _ request.illrequest_id | html %]
+                                    </li>
+                                    <li class="notesstaff">
+                                        <span class="label notes_staff">Staff notes:</span>
+                                        <p>[% request.notesstaff | html %]</p>
+                                    </li>
+                                    <li class="notesopac">
+                                        <span class="label notes_opac">Notes:</span>
+                                        <p>[% request.notesopac | html %]</p>
+                                    </li>
+                                </ol>
+                            </div>
+                            <div class="rows">
+                                <h4>Details from supplier ([% request.backend | html %])</h4>
+                                <ol>
+                                    [% FOREACH meta IN request.metadata %]
+                                        <li class="requestmeta-[% meta.key.replace('\s','_') | html %]">
+                                            <span class="label">[% meta.key | html %]:</span>
+                                            [% meta.value | html %]
+                                        </li>
+                                    [% END %]
+                                </ol>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div id="dataPreview" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="dataPreviewLabel" aria-hidden="true">
+                        <div class="modal-dialog">
+                            <div class="modal-content">
+                                <div class="modal-header">
+                                    <button type="button" class="closebtn" data-dismiss="modal" aria-hidden="true">×</button>
+                                    <h3 id="dataPreviewLabel"> Supplier metadata</h3>
                                 </div>
-                                <div class="medium">
-                                    <span class="label medium">Request type:</span>
-                                    [% request.medium %]
+                                <div class="modal-body">
+                                    <div id="requestattributes">
+                                        [% FOREACH attr IN request.illrequestattributes %]
+                                        <div class="requestattr-[% attr.type | html %]">
+                                            <span class="label">[% attr.type | html %]:</span>
+                                            [% attr.value | html %]
+                                        </div>
+                                            [% END %]
+                                    </div>
                                 </div>
-                                <div class="cost">
-                                    <span class="label cost">Cost:</span>
-                                    [% request.cost || "N/A" %]
+                                <div class="modal-footer">
+                                    <button class="btn btn-default" data-dismiss="modal" aria-hidden="true">Close</button>
                                 </div>
-                                <div class="req_id">
-                                    <span class="label req_id">Request number:</span>
-                                    [% request.id_prefix _ request.illrequest_id %]
+                            </div>
+                        </div>
+                    </div>
+
+                    <div id="requestLog" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="dataPreviewLabel" aria-hidden="true">
+                        <div class="modal-dialog">
+                            <div class="modal-content">
+                                <div class="modal-header">
+                                    <button type="button" class="closebtn" data-dismiss="modal" aria-hidden="true">×</button>
+                                    <h3 id="requestLogLabel"> Request log</h3>
                                 </div>
-                                <div class="notesstaff">
-                                    <span class="label notes_staff">Staff notes:</span>
-                                    <pre>[% request.notesstaff %]</pre>
+                                <div class="modal-body">
+                                [% IF request.logs.size > 0 %]
+                                    [% FOREACH log IN request.logs %]
+                                        [% tpl = log.template %]
+                                        [% INCLUDE $tpl log=log %]
+                                    [% END %]
+                                [% ELSE %]
+                                    There are no recorded logs for this request
+                                [% END %]
                                 </div>
-                                <div class="notesopac">
-                                    <span class="label notes_opac">Notes:</span>
-                                    <pre>[% request.notesopac %]</pre>
+                                <div class="modal-footer">
+                                    <button class="btn btn-default" data-dismiss="modal" aria-hidden="true">Close</button>
                                 </div>
                             </div>
-                            <div class="rows">
-                                <h4>Details from supplier ([% request.backend %])</h4>
-                                [% FOREACH meta IN request.metadata %]
-                                    <div class="requestmeta-[% meta.key %]">
-                                        <span class="label">[% meta.key %]:</span>
-                                        [% meta.value %]
+                        </div>
+                    </div>
+
+                    <div class="ill-view-panel panel panel-default">
+                        <div class="panel-heading">
+                            <h3>[% request.illcomments.count | html %] comments</h3>
+                        </div>
+                        <div class="panel-body">
+                            [% IF request.illcomments.count && request.illcomments.count > 0 %]
+                                [% FOREACH comment IN request.illcomments %]
+                                    <div class="rows comment_[% comment.patron.categorycode | html %]">
+                                    <h5>Comment by:
+                                    <a href="[% borrowerlink | url %]" title="View borrower details">
+                                    [% comment.patron.firstname _ " " _ comment.patron.surname _ " [" _ comment.patron.cardnumber _ "]" | html %]</a>
+                                    [% comment.timestamp | $KohaDates with_hours => 1 %]</h5>
+                                    <p>[% comment.comment | html %]</p>
                                     </div>
                                 [% END %]
-                            </div>
-                            <div class="rows">
-                                <h3><a id="toggle_requestattributes" href="#">Toggle full supplier metadata</a></h3>
-                                <div id="requestattributes" class="content_hidden">
-                                    [% FOREACH attr IN request.illrequestattributes %]
-                                        <div class="requestattr-[% attr.type %]">
-                                            <span class="label">[% attr.type %]:</span>
-                                            [% attr.value %]
-                                        </div>
-                                    [% END %]
+                            [% END %]
+                                <div class="rows">
+                                    <h3><a id="toggle_addcomment" href="#">Add comment</a></h3>
+                                    <div id="addcomment" class="content_hidden">
+                                        <form class="validated" method="post" action="/cgi-bin/koha/ill/ill-requests.pl">
+                                            <input type="hidden" value="save_comment" name="method">
+                                            <input type="hidden" value="[% csrf_token | html %]" name="csrf_token">
+                                            <input type="hidden" value="[% request.illrequest_id | html %]" name="illrequest_id">
+                                            <fieldset class="rows">
+                                                <ol>
+                                                    <li>
+                                                        <label class="required" for="comment">Comment: </label>
+                                                        <textarea class="required" required="required" cols="80" rows="10" id="comment" name="comment"></textarea>
+                                                        <span class="required">Required</span>
+                                                    </li>
+                                                </ol>
+                                            </fieldset>
+                                            <fieldset class="action">
+                                                <input type="submit" value="Submit">
+                                            </fieldset>
+                                        </form>
+                                    </div>
                                 </div>
-
-                            </div>
                         </div>
                     </div>
 
                     <div id="results">
                         <h3>Details for all requests</h3>
 
-                        <div id="column-toggle">
-                            Toggle additional columns:
-                        </div>
-                        <div id="reset-toggle"><a href="#">Reset toggled columns</a></div>
-
-                        <table
-                            [% FOREACH filter IN prefilters %]
-                            data-filter-[% filter.name %]="[% filter.value %]"
-                            [% END %]
-                            id="ill-requests">
+                        <table id="ill-requests">
                             <thead>
-                                <tr id="illview-header"></tr>
+                                <tr id="illview-header">
+                                    <th scope="col">Request ID</th>
+                                    <th scope="col">Author</th>
+                                    <th scope="col">Title</th>
+                                    <th scope="col">Article title</th>
+                                    <th scope="col">Issue</th>
+                                    <th scope="col">Volume</th>
+                                    <th scope="col">Year</th>
+                                    <th scope="col">Pages</th>
+                                    <th scope="col">Type</th>
+                                    <th scope="col">Order ID</th>
+                                    <th scope="col">Patron</th>
+                                    <th scope="col">Bibliographic record</th>
+                                    <th scope="col">Branch</th>
+                                    <th scope="col">Status</th>
+                                    <th scope="col" class="placed">&nbsp;</th>
+                                    <th scope="col" class="placed_formatted">Placed on</th>
+                                    <th scope="col" class="updated">&nbsp;</th>
+                                    <th scope="col" class="updated_formatted">Updated on</th>
+                                    <th scope="col">Replied</th>
+                                    <th scope="col" class="completed">&nbsp;</th>
+                                    <th scope="col" class="completed_formatted">Completed on</th>
+                                    <th scope="col">Access URL</th>
+                                    <th scope="col">Cost</th>
+                                    <th scope="col">Comments</th>
+                                    <th scope="col">OPAC notes</th>
+                                    <th scope="col">Staff notes</th>
+                                    <th scope="col">Backend</th>
+                                    <th scope="col" class="actions"></th>
+                                </tr>
                             </thead>
                             <tbody id="illview-body">
                             </tbody>
                     </div>
                 [% ELSE %]
                 <!-- Custom Backend Action -->
-                [% INCLUDE $whole.template %]
+                [% PROCESS $whole.template %]
 
                 [% END %]
         [% END %]
             </div>
         </div>
     </div>
-</div>
 
 [% TRY %]
 [% PROCESS backend_jsinclude %]
 [% CATCH %]
 [% END %]
 
+[% MACRO jsinclude BLOCK %]
+    [% INCLUDE 'datatables.inc' %]
+    [% INCLUDE 'columns_settings.inc' %]
+    [% INCLUDE 'calendar.inc' %]
+    [% Asset.js("lib/jquery/plugins/jquery.checkboxes.min.js") | $raw %]
+    <script>
+        $(document).ready(function() {
+
+            // Illview Datatable setup
+
+            var columns_settings = [% ColumnsSettings.GetColumns( 'illrequests', 'ill-requests', 'ill-requests', 'json' ) %];
+
+            var table;
+
+            // Filters that are active
+            var activeFilters = {};
+
+            // Fields we need to expand (flatten)
+            var expand = [
+                'metadata',
+                'patron',
+                'library'
+            ];
+
+            // Expanded fields
+            // This is auto populated
+            var expanded = {};
+
+            // Filterable columns
+            var filterable = {
+                status: {
+                    prep: function(tableData, oData) {
+                        var uniques = {};
+                        tableData.forEach(function(row) {
+                            var resolvedName;
+                            if (row.status_alias) {
+                                resolvedName = row.status_alias.lib;
+                            } else {
+                                resolvedName = getStatusName(
+                                    oData[0].capabilities[row.status].name
+                                );
+                            }
+                            uniques[resolvedName] = 1
+                        });
+                        Object.keys(uniques).sort().forEach(function(unique) {
+                            $('#illfilter_status').append(
+                                '<option value="' + unique  +
+                                '">' + unique +  '</option>'
+                            );
+                        });
+                    },
+                    listener: function() {
+                        var me = 'status';
+                        $('#illfilter_status').change(function() {
+                            var sel = $('#illfilter_status option:selected').val();
+                            if (sel && sel.length > 0) {
+                                activeFilters[me] = function() {
+                                    table.api().column(13).search(sel);
+                                }
+                            } else {
+                                if (activeFilters.hasOwnProperty(me)) {
+                                    delete activeFilters[me];
+                                }
+                            }
+                        });
+                    },
+                    clear: function() {
+                        $('#illfilter_status').val('');
+                    }
+                },
+                pickupBranch: {
+                    prep: function(tableData, oData) {
+                        var uniques = {};
+                        tableData.forEach(function(row) {
+                            uniques[row.library_branchname] = 1
+                        });
+                        Object.keys(uniques).sort().forEach(function(unique) {
+                            $('#illfilter_branchname').append(
+                                '<option value="' + unique  +
+                                '">' + unique +  '</option>'
+                            );
+                        });
+                    },
+                    listener: function() {
+                        var me = 'pickupBranch';
+                        $('#illfilter_branchname').change(function() {
+                            var sel = $('#illfilter_branchname option:selected').val();
+                            if (sel && sel.length > 0) {
+                                activeFilters[me] = function() {
+                                    table.api().column(12).search(sel);
+                                }
+                            } else {
+                                if (activeFilters.hasOwnProperty(me)) {
+                                    delete activeFilters[me];
+                                }
+                            }
+                        });
+                    },
+                    clear: function() {
+                        $('#illfilter_branchname').val('');
+                    }
+                },
+                patron: {
+                    listener: function() {
+                        var me = 'patron';
+                        $('#illfilter_patron').change(function() {
+                            var val = $('#illfilter_patron').val();
+                            if (val && val.length > 0) {
+                                activeFilters[me] = function() {
+                                    table.api().column(10).search(val);
+                                }
+                            } else {
+                                if (activeFilters.hasOwnProperty(me)) {
+                                    delete activeFilters[me];
+                                }
+                            }
+                        });
+                    },
+                    clear: function() {
+                        $('#illfilter_patron').val('');
+                    }
+                },
+                dateModified: {
+                    clear: function() {
+                        $('#illfilter_datemodified_start, #illfilter_datemodified_end').val('');
+                    }
+                },
+                datePlaced: {
+                    clear: function() {
+                        $('#illfilter_dateplaced_start, #illfilter_dateplaced_end').val('');
+                    }
+                }
+            };
+
+            // Expand any fields we're expanding
+            var expandExpand = function(row) {
+                expand.forEach(function(thisExpand) {
+                    if (row.hasOwnProperty(thisExpand)) {
+                        if (!expanded.hasOwnProperty(thisExpand)) {
+                            expanded[thisExpand] = [];
+                        }
+                        var expandObj = row[thisExpand];
+                        Object.keys(expandObj).forEach(
+                            function(thisExpandCol) {
+                                var expColName = thisExpand + '_' + thisExpandCol.replace(/\s/g,'_');
+                                // Keep a list of fields that have been expanded
+                                // so we can create toggle links for them
+                                if (expanded[thisExpand].indexOf(expColName) == -1) {
+                                    expanded[thisExpand].push(expColName);
+                                }
+                                expandObj[expColName] =
+                                    expandObj[thisExpandCol];
+                                delete expandObj[thisExpandCol];
+                            }
+                        );
+                        $.extend(true, row, expandObj);
+                        delete row[thisExpand];
+                    }
+                });
+            };
+
+            // Strip the expand prefix if it exists, we do this for display
+            var stripPrefix = function(value) {
+                expand.forEach(function(thisExpand) {
+                    var regex = new RegExp(thisExpand + '_', 'g');
+                    value = value.replace(regex, '');
+                });
+                return value;
+            };
+
+            // Our 'render' function for borrowerlink
+            var createPatronLink = function(data, type, row) {
+                var patronLink = '<a title="' + _("View borrower details") + '" ' +
+                    'href="/cgi-bin/koha/members/moremember.pl?' +
+                    'borrowernumber='+row.borrowernumber+'">';
+                if ( row.patron_firstname ) {
+                    patronLink = patronLink + row.patron_firstname + ' ';
+                }
+                patronLink = patronLink + row.patron_surname +
+                    ' (' + row.patron_cardnumber + ')' + '</a>';
+                return patronLink;
+            };
+
+            // Our 'render' function for biblio_id
+            var createBiblioLink = function(data, type, row) {
+                return (row.biblio_id) ?
+                    '<a title="' + _("View biblio details") + '" ' +
+                    'href="/cgi-bin/koha/catalogue/detail.pl?biblionumber=' +
+                    row.biblio_id + '">' +
+                    row.biblio_id +
+                    '</a>' : '';
+            };
+
+            // Our 'render' function for title
+            var createTitle = function(data, type, row) {
+                return (
+                    row.hasOwnProperty('metadata_container_title') &&
+                    row.metadata_container_title
+                ) ? row.metadata_container_title : row.metadata_title;
+            };
+
+            // Render function for request ID
+            var createRequestId = function(data, type, row) {
+                return row.id_prefix + row.illrequest_id;
+            };
+
+            // Render function for type
+            var createType = function(data, type, row) {
+                if (!row.hasOwnProperty('metadata_Type') || !row.metadata_Type) {
+                    if (row.hasOwnProperty('medium') && row.medium) {
+                        row.metadata_Type = row.medium;
+                    } else {
+                        row.metadata_Type = null;
+                    }
+                }
+                return row.metadata_Type;
+            };
+
+            // Render function for request status
+            var createStatus = function(data, type, row, meta) {
+                if (row.status_alias) {
+                    return row.status_alias.lib
+                        ? row.status_alias.lib
+                        : row.status_alias.authorised_value;
+                } else {
+                    var origData = meta.settings.oInit.originalData;
+                    if (origData.length > 0) {
+                        var status_name = meta.settings.oInit.originalData[0].capabilities[
+                            row.status
+                        ].name;
+                        return getStatusName(status_name);
+                    } else {
+                        return '';
+                    }
+                }
+            };
+
+            var getStatusName = function(origName) {
+                switch( origName ) {
+                    case "New request":
+                        return _("New request");
+                    case "Requested":
+                        return _("Requested");
+                    case "Requested from partners":
+                        return _("Requested from partners");
+                    case "Request reverted":
+                        return _("Request reverted");
+                    case "Queued request":
+                        return _("Queued request");
+                    case "Cancellation requested":
+                        return _("Cancellation requested");
+                    case "Completed":
+                        return _("Completed");
+                    case "Delete request":
+                        return _("Delete request");
+                    default:
+                        return origName;
+                }
+            };
+
+            // Render function for creating a row's action link
+            var createActionLink = function(data, type, row) {
+                return '<a class="btn btn-default btn-sm" ' +
+                    'href="/cgi-bin/koha/ill/ill-requests.pl?' +
+                    'method=illview&amp;illrequest_id=' +
+                    row.illrequest_id +
+                    '">' + _("Manage request") + '</a>';
+            };
+
+            // Columns that require special treatment
+            var specialCols = {
+                action: {
+                    func: createActionLink,
+                    skipSanitize: true
+                },
+                illrequest_id: {
+                    func: createRequestId
+                },
+                status: {
+                    func: createStatus
+                },
+                biblio_id: {
+                    name: _("Bibliograpic record ID"),
+                    func: createBiblioLink,
+                    skipSanitize: true
+                },
+                metadata_title: {
+                    func: createTitle
+                },
+                metadata_Type: {
+                    func: createType
+                },
+                updated: {
+                    name: _("Updated on"),
+                },
+                patron: {
+                    skipSanitize: true,
+                    func: createPatronLink
+                }
+            };
+
+            // Display the modal containing request supplier metadata
+            $('#ill-request-display-log').on('click', function(e) {
+                e.preventDefault();
+                $('#requestLog').modal({show:true});
+            });
+
+            // Toggle request attributes in Illview
+            $('#toggle_requestattributes').on('click', function(e) {
+                e.preventDefault();
+                $('#requestattributes').toggleClass('content_hidden');
+            });
+
+            // Toggle new comment form in Illview
+            $('#toggle_addcomment').on('click', function(e) {
+                e.preventDefault();
+                $('#addcomment').toggleClass('content_hidden');
+            });
+
+            // Filter partner list
+            $('#partner_filter').keyup(function() {
+                var needle = $('#partner_filter').val();
+                $('#partners > option').each(function() {
+                    var regex = new RegExp(needle, 'i');
+                    if (
+                        needle.length == 0 ||
+                        $(this).is(':selected') ||
+                        $(this).text().match(regex)
+                    ) {
+                        $(this).show();
+                    } else {
+                        $(this).hide();
+                    }
+                });
+            });
+
+            // Display the modal containing request supplier metadata
+            $('#ill-request-display-metadata').on('click', function(e) {
+                e.preventDefault();
+                $('#dataPreview').modal({show:true});
+            });
+
+            // Allow us to chain Datatable render helpers together, so we
+            // can use our custom functions and render.text(), which
+            // provides us with data sanitization
+            $.fn.dataTable.render.multi = function(renderArray) {
+                return function(d, type, row, meta) {
+                    for(var r = 0; r < renderArray.length; r++) {
+                        var toCall = renderArray[r].hasOwnProperty('display') ?
+                            renderArray[r].display :
+                            renderArray[r];
+                        d = toCall(d, type, row, meta);
+                    }
+                    return d;
+                }
+            }
+
+            // Get our data from the API and process it prior to passing
+            // it to datatables
+            var ajax = $.ajax(
+                '/api/v1/illrequests?embed=metadata,patron,capabilities,library,status_alias,comments'
+                ).done(function() {
+                    var data = JSON.parse(ajax.responseText);
+                    // Make a copy, we'll be removing columns next and need
+                    // to be able to refer to data that has been removed
+                    var dataCopy = $.extend(true, [], data);
+                    // Expand columns that need it and create an array
+                    // of all column names
+                    $.each(dataCopy, function(k, row) {
+                        expandExpand(row);
+                    });
+
+                    // Assemble an array of column definitions for passing
+                    // to datatables
+                    var colData = [];
+                    columns_settings.forEach(function(thisCol) {
+                        var colName = thisCol.columnname;
+                        // Create the base column object
+                        var colObj = $.extend({}, thisCol);
+                        colObj.name = colName;
+                        colObj.className = colName;
+                        colObj.defaultContent = '';
+
+                        // We may need to process the data going in this
+                        // column, so do it if necessary
+                        if (
+                            specialCols.hasOwnProperty(colName) &&
+                            specialCols[colName].hasOwnProperty('func')
+                        ) {
+                            var renderArray = [
+                                specialCols[colName].func
+                            ];
+                            if (!specialCols[colName].skipSanitize) {
+                                renderArray.push(
+                                    $.fn.dataTable.render.text()
+                                );
+                            }
+
+                            colObj.render = $.fn.dataTable.render.multi(
+                                renderArray
+                            );
+                        } else {
+                            colObj.data = colName;
+                            colObj.render = $.fn.dataTable.render.text()
+                        }
+                        // Make sure properties that aren't present in the API
+                        // response are populated with null to avoid Datatables
+                        // choking on their absence
+                        dataCopy.forEach(function(thisData) {
+                            if (!thisData.hasOwnProperty(colName)) {
+                                thisData[colName] = null;
+                            }
+                        });
+                        colData.push(colObj);
+                    });
+
+                    // Initialise the datatable
+                    table = KohaTable("ill-requests", {
+                        'aoColumnDefs': [
+                            { // Last column shouldn't be sortable or searchable
+                                'aTargets': [ 'actions' ],
+                                'bSortable': false,
+                                'bSearchable': false
+                            },
+                            { // When sorting 'placed', we want to use the
+                              // unformatted column
+                              'aTargets': [ 'placed_formatted'],
+                              'iDataSort': 14
+                            },
+                            { // When sorting 'updated', we want to use the
+                              // unformatted column
+                              'aTargets': [ 'updated_formatted'],
+                              'iDataSort': 16
+                            },
+                            { // When sorting 'completed', we want to use the
+                              // unformatted column
+                              'aTargets': [ 'completed_formatted'],
+                              'iDataSort': 19
+                            }
+                        ],
+                        'aaSorting': [[ 16, 'desc' ]], // Default sort, updated descending
+                        'processing': true, // Display a message when manipulating
+                        'sPaginationType': "full_numbers", // Pagination display
+                        'deferRender': true, // Improve performance on big datasets
+                        'data': dataCopy,
+                        'columns': colData,
+                        'originalData': data, // Enable render functions to access
+                                              // our original data
+                        'initComplete': function() {
+
+                            // Prepare any filter elements that need it
+                            for (var el in filterable) {
+                                if (filterable.hasOwnProperty(el)) {
+                                    if (filterable[el].hasOwnProperty('prep')) {
+                                        filterable[el].prep(dataCopy, data);
+                                    }
+                                    if (filterable[el].hasOwnProperty('listener')) {
+                                        filterable[el].listener();
+                                    }
+                                }
+                            }
+
+                        }
+                    }, columns_settings);
+
+                    // Custom date range filtering
+                    $.fn.dataTable.ext.search.push(function(settings, data, dataIndex) {
+                        var placedStart = $('#illfilter_dateplaced_start').datepicker('getDate');
+                        var placedEnd = $('#illfilter_dateplaced_end').datepicker('getDate');
+                        var modifiedStart = $('#illfilter_datemodified_start').datepicker('getDate');
+                        var modifiedEnd = $('#illfilter_datemodified_end').datepicker('getDate');
+                        var rowPlaced = data[14] ? new Date(data[14]) : null;
+                        var rowModified = data[16] ? new Date(data[16]) : null;
+                        var placedPassed = true;
+                        var modifiedPassed = true;
+                        if (placedStart && rowPlaced && rowPlaced < placedStart) {
+                            placedPassed = false
+                        };
+                        if (placedEnd && rowPlaced && rowPlaced > placedEnd) {
+                            placedPassed = false;
+                        }
+                        if (modifiedStart && rowModified && rowModified < modifiedStart) {
+                            modifiedPassed = false
+                        };
+                        if (modifiedEnd && rowModified && rowModified > modifiedEnd) {
+                            modifiedPassed = false;
+                        }
+
+                        return placedPassed && modifiedPassed;
+
+                    });
+
+                }
+            );
+
+            var clearSearch = function() {
+                table.api().search('').columns().search('');
+                activeFilters = {};
+                for (var filter in filterable) {
+                    if (
+                        filterable.hasOwnProperty(filter) &&
+                        filterable[filter].hasOwnProperty('clear')
+                    ) {
+                        filterable[filter].clear();
+                    }
+                }
+                table.api().draw();
+            };
+
+            // Apply any search filters, or clear any previous
+            // ones
+            $('#illfilter_form').submit(function(event) {
+                event.preventDefault();
+                table.api().search('').columns().search('');
+                for (var active in activeFilters) {
+                    if (activeFilters.hasOwnProperty(active)) {
+                        activeFilters[active]();
+                    }
+                }
+                table.api().draw();
+            });
+
+            // Clear all filters
+            $('#clear_search').click(function() {
+                clearSearch();
+            });
+
+        });
+    </script>
+[% END %]
+
 [% INCLUDE 'intranet-bottom.inc' %]