1<g:if test="${max && max < total && jobsListSize < total}">
2    <div id="modal-pagination" style="display: none;">
3        <div style="display:flex; justify-content: space-between; align-items: center;margin-top: 10px;">
4            <div class="gsp-pager">
5                <div class="modal-pagination">
6                    <g:set var="numPages" value="${new java.math.BigDecimal(total/max).setScale(0, java.math.RoundingMode.UP)}"/>
7                    <div class="modal-pagination-item">
8                        <a class="prevLink" style="display: none" onclick="handleModalPagination(this, ${offset-max}, ${max}, ${total});">Previous</a>
9                    </div>
10                    <g:each in="${1..numPages}" var="step">
11                        <div class="modal-pagination-item">
12                            <span style="display: ${step == 1 ? 'inline' : 'none'}" class="currentStep step-${step}">${step}</span>
13                            <a style="display: ${step == 1 ? 'none' : 'inline'}" onclick="handleModalPagination(this, ${(step-1)*max}, ${max}, ${total});" class="step step-${step}">${step}</a>
14                        </div>
15                    </g:each>
16                    <div class="modal-pagination-item">
17                        <a class="nextLink" onclick="handleModalPagination(this, ${offset+max}, ${max}, ${total});">Next</a>
18                    </div>
19                </div>
20            </div>
21            <div>
22                Showing ${offset+1}-${offset+max > total ? total : offset+max} of ${total}
23            </div>
24        </div>
25    </div>
26</g:if>
27
28<g:javascript>
29    function handleModalPagination(elem, offset, max, total) {
30        jQuery(document).ready(function() {
31        jQuery(".modal").on("hidden.bs.modal", function() {
32            jQuery(".modal-body").html("");
33        });
34        });
35        if (jQuery(elem).hasClass('active')) {
36            jQuery('#' + jobChooseModalId).modal('hide');
37            return;
38        }
39        var project = selFrameworkProject;
40        if (projectFieldId) {
41            project = jQuery('#' + projectFieldId).val();
42        }
43        jQuery(elem).button('loading').addClass('active');
44
45        jQuery.ajax({
46            url: _genUrl(appLinks.menuJobsPicker, {
47                jobsjscallback: 'true',
48                runAuthRequired: true,
49                projFilter: project,
50                offset: offset
51            }),
52            success: function (resp, status, jqxhr) {
53                var modal = jQuery('#' + jobChooseModalId);
54                jQuery(elem).button('reset').removeClass('active');
55                modal.find('#' + jobChooseModalId + "_content .job-display-tree").html(resp);
56                modal.find("#modal-pagination").show()
57                modal.find('a.step').show()
58                modal.find('span.currentStep').hide()
59                modal.find('a.step-' + ((offset/max) + 1) ).hide()
60                modal.find('span.step-' + ((offset/max) + 1) ).show()
61                if(offset+max > total) {
62                    modal.find('.nextLink').hide()
63                } else {
64                    modal.find('.nextLink').show()
65                }
66                if(offset-max < 0) {
67                    modal.find('.prevLink').hide()
68                } else {
69                    modal.find('.prevLink').show()
70                }
71            },
72            error: function (jqxhr, status, resp) {
73                showError("Error performing request: menuJobsPicker: " + resp);
74                jQuery(elem).button('reset').removeClass('active');
75            }
76        });
77    }
78</g:javascript>
79
80