Nemcio/Grav-Admin-Plugin
1
0
Fork 0
mirror of https://github.com/getgrav/grav-plugin-admin.git synced 2025-11-05 04:46:03 +01:00
Code Issues Packages Projects Releases Activity

Lists now features two new YAML options sortby: [field] (default: disabled) and sortby_dir: [asc|desc] (default: asc) which will display a new Sorting button in the list allowing to automatically reindex the collection based on the given sort field set.

Browse Source
This commit is contained in:
Djamil Legato
2016-08-01 16:40:04 -07:00
parent 1d55ffc616
commit d0972b0454
4 changed files with 47 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
CHANGELOG.md
View File

@@ -5,6 +5,7 @@
* Get fresh media list for `Controller::getListMedia()` rather that cache so always latest.
* Add translation strings for the new system.force_ssl option
* Lists now features a new YAML option `controls: [top|bottom|both]` (default: bottom) which will display the "Add Item" button at the Top and/or Bottom position relative to the list. When the Top button is pressed, a new item will be added at the beginning of the list, when the Bottom button is pressed, a new item will be appended to the list.
* Lists now features two new YAML options `sortby: [field]` (default: disabled) and `sortby_dir: [asc|desc]` (default: asc) which will display a new Sorting button in the list allowing to automatically reindex the collection based on the given sort field set.
1. [](#bugfix)
* Fixed issue in Admin favicon URL [#704](https://github.com/getgrav/grav-plugin-admin/issues/704)
* Fixed issue in `selfupgrade` where the package would get downloaded in the wrong destination

40
themes/grav/app/forms/fields/collections.js
View File

@@ -17,6 +17,7 @@ export default class CollectionsField {
list.on('click', '> .collection-actions [data-action="add"]', (event) => this.addItem(event));
list.on('click', '> ul > li > .item-actions [data-action="delete"]', (event) => this.removeItem(event));
list.on('click', '> .collection-actions [data-action-sort="date"]', (event) => this.sortItems(event));
list.on('input', '[data-key-observe]', (event) => this.observeKey(event));
list.find('[data-collection-holder]').each((index, container) => {
@@ -43,9 +44,11 @@ export default class CollectionsField {
let items = list.closest('[data-type="collection"]').find('> ul > [data-collection-item]');
let topAction = list.closest('[data-type="collection"]').find('[data-action-add="top"]');
let sortAction = list.closest('[data-type="collection"]').find('[data-action="sort"]');
if (items.length && topAction.length) {
topAction.parent().removeClass('hidden');
if (items.length) {
if (topAction.length) { topAction.parent().removeClass('hidden'); }
if (sortAction.length && items.length > 1) { sortAction.removeClass('hidden'); }
}
// refresh toggleables in a list
@@ -62,10 +65,39 @@ export default class CollectionsField {
let items = list.closest('[data-type="collection"]').find('> ul > [data-collection-item]');
let topAction = list.closest('[data-type="collection"]').find('[data-action-add="top"]');
let sortAction = list.closest('[data-type="collection"]').find('[data-action="sort"]');
if (!items.length && topAction.length) {
topAction.parent().addClass('hidden');
if (!items.length) {
if (topAction.length) { topAction.parent().addClass('hidden'); }
}
if (sortAction.length && items.length <= 1) { sortAction.addClass('hidden'); }
}
sortItems(event) {
let button = $(event.currentTarget);
let sortby = button.data('action-sort');
let sortby_dir = button.data('action-sort-dir') || 'asc';
let list = $(button.closest('[data-type="collection"]'));
let items = list.closest('[data-type="collection"]').find('> ul > [data-collection-item]');
items.sort((a, b) => {
let A = $(a).find('[name$="[' + sortby + ']"]');
let B = $(b).find('[name$="[' + sortby + ']"]');
let sort;
if (sortby_dir == 'asc') {
sort = (A.val() < B.val()) ? -1 : (A.val() > B.val()) ? 1 : 0;
} else {
sort = (A.val() > B.val()) ? -1 : (A.val() < B.val()) ? 1 : 0
}
return sort;
}).each((_, container) => {
$(container).parent().append(container);
});
this.reindex(list);
}
observeKey(event) {

2
themes/grav/js/admin.min.js vendored
View File

File diff suppressed because one or more lines are too long

9
themes/grav/templates/forms/fields/list/list.html.twig
View File

@@ -3,6 +3,7 @@
{% set value = (value is null ? field.default : value) %}
{% set name = field.name %}
{% set btnLabel = field.btnLabel is defined ? field.btnLabel : "PLUGIN_ADMIN.ADD_ITEM" %}
{% set btnSortLabel = field.btnSortLabel is defined ? field.btnSortLabel : "PLUGIN_ADMIN.SORT_BY" %}
{% set fieldControls = field.controls|default('bottom') %}
{% block contents %}
@@ -38,6 +39,10 @@
<div class="form-list-wrapper {{ field.size }}" data-type="collection">
{% if fieldControls in ['top', 'both'] %}
<div class="collection-actions{{ not value|length ? ' hidden' : '' }}">
{% if field.sortby %}
<button class="button{{ not value|length ? ' hidden' : '' }}" type="button" data-action="sort" data-action-sort="{{ field.sortby }}" data-action-sort-dir="{{ field.sortby_dir|default('asc') }}"
{% if field.disabled or isDisabledToggleable %}disabled="disabled"{% endif %}><i class="fa fa-sort-amount-{{ field.sortby_dir|default('asc') }}"></i> {{ btnSortLabel|e|tu }} '{{ field.sortby }}'</button>
{% endif %}
<button class="button" type="button" data-action="add" data-action-add="top"
{% if field.disabled or isDisabledToggleable %}disabled="disabled"{% endif %}><i class="fa fa-plus"></i> {{ btnLabel|e|tu }}</button>
</div>
@@ -90,6 +95,10 @@
</ul>
{% if fieldControls in ['bottom', 'both'] %}
<div class="collection-actions">
{% if field.sortby %}
<button class="button{{ not value|length ? ' hidden' : '' }}" type="button" data-action="sort" data-action-sort="{{ field.sortby }}" data-action-sort-dir="{{ field.sortby_dir|default('asc') }}"
{% if field.disabled or isDisabledToggleable %}disabled="disabled"{% endif %}><i class="fa fa-sort-amount-{{ field.sortby_dir|default('asc') }}"></i> {{ btnSortLabel|e|tu }} '{{ field.sortby }}'</button>
{% endif %}
<button class="button" type="button" data-action="add" data-action-add="bottom"
{% if field.disabled or isDisabledToggleable %}disabled="disabled"{% endif %}><i class="fa fa-plus"></i> {{ btnLabel|e|tu }}</button>
</div>