D-Net
/
dnet-applications
16
1
Fork 0
Code Issues Pull Requests Releases Wiki Activity

sorting and filtering

This commit is contained in:
Michele Artini 2024-11-28 14:20:52 +01:00
parent f25d89bc4a
commit 6d491345fe
2 changed files with 50 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

68
apps/dnet-orgs-database-application/src/main/resources/static/resources/html/parts/org_results_page.html
View File

@ -21,29 +21,53 @@
<h4 ng-if="orgs.totalElements == 0" class="text-center">No results</h4>
<div ng-if="orgs.totalElements > 0">
<div class="mb-4 text-center">
<div class="btn-group">
<button class="btn btn-sm btn-outline-primary" ng-click="gotoPage(orgs.number - 1, orgs.size)" ng-disabled="orgs.first">&laquo; Previous</button>
<div class="dropdown">
<button class="btn btn-sm btn-outline-primary dropdown-toggle" type="button" data-toggle="dropdown">Page {{orgs.number + 1}} of {{orgs.totalPages}}</button>
<div class="dropdown-menu">
<a class="dropdown-item" href="javascript:void(0)" ng-click="gotoPage(i, orgs.size)" ng-repeat="i in availablePages()">Page {{i + 1}}</a>
</div>
<div class="mb-2">
<div class="dropdown float-left">
<button class="btn btn-sm btn-outline-primary dropdown-toggle" type="button" data-toggle="dropdown">Sort by</button>
<div class="dropdown-menu">
<small>
<h6 class="dropdown-header">Ascending</h6>
<a class="dropdown-item ml-2" href="javascript:void(0)" ng-click="changeSort('name', 'asc')"><b>name</b></a>
<a class="dropdown-item ml-2" href="javascript:void(0)" ng-click="changeSort('country', 'asc')"><b>country</b></a>
<a class="dropdown-item ml-2" href="javascript:void(0)" ng-click="changeSort('type', 'asc')"><b>type</b></a>
<a class="dropdown-item ml-2" href="javascript:void(0)" ng-click="changeSort('status', 'asc')"><b>status</b></a>
<h6 class="dropdown-header">Descending</h6>
<a class="dropdown-item ml-2" href="javascript:void(0)" ng-click="changeSort('name', 'desc')"><b>name</b></a>
<a class="dropdown-item ml-2" href="javascript:void(0)" ng-click="changeSort('country', 'desc')"><b>country</b></a>
<a class="dropdown-item ml-2" href="javascript:void(0)" ng-click="changeSort('type', 'desc')"><b>type</b></a>
<a class="dropdown-item ml-2" href="javascript:void(0)" ng-click="changeSort('status', 'desc')"><b>status</b></a>
<a class="dropdown-item ml-2" href="javascript:void(0)" ng-click="changeSort('n_similar_dups', 'desc')"><b># accepted dups</b></a>
<a class="dropdown-item ml-2" href="javascript:void(0)" ng-click="changeSort('n_suggested_dups', 'desc')"><b># suggested dups</b></a>
<a class="dropdown-item ml-2" href="javascript:void(0)" ng-click="changeSort('n_different_dups', 'desc')"><b># rejected dups</b></a>
</small>
</div>
<div class="dropdown">
<button class="btn btn-sm btn-outline-primary dropdown-toggle" type="button" data-toggle="dropdown">Size {{orgs.size}}</button>
<div class="dropdown-menu">
<a class="dropdown-item" href="javascript:void(0)" ng-click="gotoPage(0, 10)">Size 10</a>
<a class="dropdown-item" href="javascript:void(0)" ng-click="gotoPage(0, 25)">Size 25</a>
<a class="dropdown-item" href="javascript:void(0)" ng-click="gotoPage(0, 50)">Size 50</a>
<a class="dropdown-item" href="javascript:void(0)" ng-click="gotoPage(0, 100)">Size 100</a>
<a class="dropdown-item" href="javascript:void(0)" ng-click="gotoPage(0, 200)">Size 200</a>
<a class="dropdown-item" href="javascript:void(0)" ng-click="gotoPage(0, 500)">Size 500</a>
</div>
</div>
<button class="btn btn-sm btn-outline-primary" ng-click="gotoPage(orgs.number + 1, orgs.size)" ng-disabled="orgs.last">Next &raquo;</button>
</div>
<div class="text-center">
<div class="btn-group">
<button class="btn btn-sm btn-outline-primary" ng-click="gotoPage(orgs.number - 1, orgs.size)" ng-disabled="orgs.first">&laquo; Previous</button>
<div class="dropdown">
<button class="btn btn-sm btn-outline-primary dropdown-toggle" type="button" data-toggle="dropdown">Page {{orgs.number + 1}} of {{orgs.totalPages}}</button>
<div class="dropdown-menu">
<a class="dropdown-item" href="javascript:void(0)" ng-click="gotoPage(i, orgs.size)" ng-repeat="i in availablePages()">Page {{i + 1}}</a>
</div>
</div>
<div class="dropdown">
<button class="btn btn-sm btn-outline-primary dropdown-toggle" type="button" data-toggle="dropdown">Size {{orgs.size}}</button>
<div class="dropdown-menu">
<a class="dropdown-item" href="javascript:void(0)" ng-click="gotoPage(0, 10)">Size 10</a>
<a class="dropdown-item" href="javascript:void(0)" ng-click="gotoPage(0, 25)">Size 25</a>
<a class="dropdown-item" href="javascript:void(0)" ng-click="gotoPage(0, 50)">Size 50</a>
<a class="dropdown-item" href="javascript:void(0)" ng-click="gotoPage(0, 100)">Size 100</a>
<a class="dropdown-item" href="javascript:void(0)" ng-click="gotoPage(0, 200)">Size 200</a>
<a class="dropdown-item" href="javascript:void(0)" ng-click="gotoPage(0, 500)">Size 500</a>
</div>
</div>
<button class="btn btn-sm btn-outline-primary" ng-click="gotoPage(orgs.number + 1, orgs.size)" ng-disabled="orgs.last">Next &raquo;</button>
</div>
</div>
<input type="text" class="form-control mt-2" ng-model="orgsFilter" placeholder="Filter in current page..." />
</div>
<p ng-if="mode == 'select-modal'">Click the <b>organization name</b> to select the organization</p>
@ -60,7 +84,7 @@
</tr>
</thead>
<tbody>
<tr ng-repeat="o in orgs.content" class="d-flex">
<tr ng-repeat="o in orgs.content | filter:orgsFilter" class="d-flex">
<td class="col-6">
<span class="badge badge-warning" ng-if="showStatus && o.status != 'approved'">{{o.status}}</span>

4
apps/dnet-orgs-database-application/src/main/resources/static/resources/js/organizations.js
View File

@ -268,6 +268,10 @@ orgsModule.directive('orgResultsPage', function($http, $location, $route, $route
}
}
scope.changeSort = function(orderBy, orderType) {
scope.gotoPageAndSort(0, $routeParams.size, orderBy, orderType);
}
scope.gotoPage = function(page, pageSize) {
scope.gotoPageAndSort(page, pageSize, $routeParams.orderBy, $routeParams.orderType);
}