mirror
/
wagtail
kopia lustrzana https://github.com/wagtail/wagtail
1
0
Forkuj 0
Kod Zgłoszenia Packages Projekty Wydania Wiki Aktywność

[refactor] Refactor existing bulk action code for reusability

pull/7618/head
Shohan 2021-07-16 20:57:59 +05:30 zatwierdzone przez Matt Westcott
rodzic 539dc79af5
commit b7f24a2d81
6 zmienionych plików z 42 dodań i 35 usunięć
Pokaż statystyki Ściągnij plik aktualizacji Ściągnij plik porównania Expand all files Collapse all files

2
client/scss/components/_listing.scss
Wyświetl plik

@ -544,7 +544,7 @@ footer.bulk-actions-choices {
margin: 0 5px;
}
.num-pages-in-listing {
.num-objects-in-listing {
color: $color-teal-light;
}

44
client/src/entrypoints/admin/bulk-actions.js
Wyświetl plik

@ -4,12 +4,12 @@ const BULK_ACTION_PAGE_CHECKBOX_INPUT = 'bulk-action-checkbox';
const BULK_ACTION_SELECT_ALL_CHECKBOX_TH = 'bulk-actions-filter-checkbox';
const BULK_ACTION_FILTERS_CLASS = `${BULK_ACTION_SELECT_ALL_CHECKBOX_TH} .c-dropdown__item a`;
const BULK_ACTION_CHOICES_DIV = 'bulk-actions-choices';
const BULK_ACTION_NUM_PAGES_SPAN = 'num-pages';
const BULK_ACTION_NUM_PAGES_IN_LISTING = 'num-pages-in-listing';
const BULK_ACTION_NUM_OBJECTS_SPAN = 'num-objects';
const BULK_ACTION_NUM_OBJECTS_IN_LISTING = 'num-objects-in-listing';
const checkedState = {
checkedPages: new Set(),
numPages: 0,
checkedObjects: new Set(),
numObjects: 0,
selectAllInListing: false,
shouldShowAllInListingText: true
};
@ -28,22 +28,22 @@ function SelectBulkActionsFilter(e) {
/* Event listener for individual page checkbox */
function SelectBulkActionsCheckboxes(e) {
if (checkedState.selectAllInListing) checkedState.selectAllInListing = false;
const prevLength = checkedState.checkedPages.size;
if (e.target.checked) checkedState.checkedPages.add(+e.target.dataset.pageId);
const prevLength = checkedState.checkedObjects.size;
if (e.target.checked) checkedState.checkedObjects.add(+e.target.dataset.objectId);
else {
/* unchecks `Select all` checkbox as soon as one page is unchecked */
document.querySelectorAll(`.${BULK_ACTION_SELECT_ALL_CHECKBOX_TH} input`).forEach(_el => {
const el = _el;
el.checked = false;
});
checkedState.checkedPages.delete(+e.target.dataset.pageId);
checkedState.checkedObjects.delete(+e.target.dataset.objectId);
}
if (checkedState.checkedPages.size === 0) {
if (checkedState.checkedObjects.size === 0) {
/* when all checkboxes are unchecked */
document.querySelector(`.${BULK_ACTION_CHOICES_DIV}`).classList.add('hidden');
document.querySelectorAll(`.${BULK_ACTION_PAGE_CHECKBOX_INPUT}`).forEach(el => el.classList.remove('show'));
} else if (checkedState.checkedPages.size === 1 && prevLength === 0) {
} else if (checkedState.checkedObjects.size === 1 && prevLength === 0) {
/* when 1 checkbox is checked for the first time */
document.querySelectorAll(`.${BULK_ACTION_PAGE_CHECKBOX_INPUT}`).forEach(el => {
el.classList.add('show');
@ -51,43 +51,43 @@ function SelectBulkActionsCheckboxes(e) {
document.querySelector(`.${BULK_ACTION_CHOICES_DIV}`).classList.remove('hidden');
}
if (checkedState.checkedPages.size === checkedState.numPages) {
if (checkedState.checkedObjects.size === checkedState.numObjects) {
/* when all checkboxes in the page are checked */
document.querySelectorAll(`.${BULK_ACTION_SELECT_ALL_CHECKBOX_TH} input`).forEach(_el => {
const el = _el;
el.checked = true;
});
if (checkedState.shouldShowAllInListingText) {
document.querySelector(`.${BULK_ACTION_NUM_PAGES_IN_LISTING}`).classList.remove('u-hidden');
document.querySelector(`.${BULK_ACTION_NUM_OBJECTS_IN_LISTING}`).classList.remove('u-hidden');
}
} else {
if (checkedState.shouldShowAllInListingText) {
document.querySelector(`.${BULK_ACTION_NUM_PAGES_IN_LISTING}`).classList.add('u-hidden');
document.querySelector(`.${BULK_ACTION_NUM_OBJECTS_IN_LISTING}`).classList.add('u-hidden');
}
}
if (checkedState.checkedPages.size > 0) {
if (checkedState.checkedObjects.size > 0) {
/* Update text on number of pages */
let numPagesSelected = '';
const numCheckPages = checkedState.checkedPages.size;
const numCheckPages = checkedState.checkedObjects.size;
if (numCheckPages === 1) {
numPagesSelected = wagtailConfig.STRINGS.NUM_PAGES_SELECTED_SINGULAR;
} else {
if (numCheckPages === checkedState.numPages) {
if (numCheckPages === checkedState.numObjects) {
numPagesSelected = wagtailConfig.STRINGS.NUM_PAGES_SELECTED_ALL.replace('{0}', numCheckPages);
} else {
numPagesSelected = wagtailConfig.STRINGS.NUM_PAGES_SELECTED_PLURAL.replace('{0}', numCheckPages);
}
}
document.querySelector(`.${BULK_ACTION_NUM_PAGES_SPAN}`).textContent = numPagesSelected;
document.querySelector(`.${BULK_ACTION_NUM_OBJECTS_SPAN}`).textContent = numPagesSelected;
}
}
function selectAllPageIdsInListing() {
checkedState.selectAllInListing = true;
document.querySelector(`.${BULK_ACTION_NUM_PAGES_SPAN}`).
document.querySelector(`.${BULK_ACTION_NUM_OBJECTS_SPAN}`).
textContent = `${wagtailConfig.STRINGS.NUM_PAGES_SELECTED_ALL_IN_LISTING}.`;
document.querySelector(`.${BULK_ACTION_NUM_PAGES_IN_LISTING}`).classList.add('u-hidden');
document.querySelector(`.${BULK_ACTION_NUM_OBJECTS_IN_LISTING}`).classList.add('u-hidden');
}
/* Event listener for filter dropdown options */
@ -134,8 +134,8 @@ function BulkActionEventListeners(e) {
const parentPageId = document.querySelector(`.${BULK_ACTION_SELECT_ALL_CHECKBOX_TH}`).dataset.parentId;
queryString += `&id=all&childOf=${parentPageId}`;
} else {
checkedState.checkedPages.forEach(pageId => {
queryString += `&id=${pageId}`;
checkedState.checkedObjects.forEach(objectId => {
queryString += `&id=${objectId}`;
});
}
window.location.href = `${url}${queryString}`;
@ -146,7 +146,7 @@ function BulkActionEventListeners(e) {
function addBulkActionListeners() {
document.querySelectorAll(`.${BULK_ACTION_PAGE_CHECKBOX_INPUT}`)
.forEach(el => {
checkedState.numPages++;
checkedState.numObjects++;
el.addEventListener('change', SelectBulkActionsCheckboxes);
});
document.querySelectorAll(`.${BULK_ACTION_SELECT_ALL_CHECKBOX_TH} input`).forEach(el => {
@ -158,7 +158,7 @@ function addBulkActionListeners() {
document.querySelectorAll(`.${BULK_ACTION_CHOICES_DIV} .bulk-action-btn`).forEach(
elem => elem.addEventListener('click', BulkActionEventListeners)
);
const selectAllInListingText = document.querySelector(`.${BULK_ACTION_NUM_PAGES_IN_LISTING}`);
const selectAllInListingText = document.querySelector(`.${BULK_ACTION_NUM_OBJECTS_IN_LISTING}`);
if (selectAllInListingText) selectAllInListingText.addEventListener('click', selectAllPageIdsInListing);
else checkedState.shouldShowAllInListingText = false;
}

8
wagtail/admin/templates/wagtailadmin/bulk_actions/footer.html
Wyświetl plik

@ -4,8 +4,10 @@
<div class="bulk-actions-filter-checkbox">
<input type="checkbox" aria-label='{% trans "Bulk action checkbox" %}' />
</div>
<ul>{% page_bulk_action_choices %}</ul>
<span class="num-pages"></span>
<a class="num-pages-in-listing u-hidden" href='#'>{{ select_all_obj_text }}</a>
<ul>{% bulk_action_choices bulk_action_register_hook %}</ul>
<span class="num-objects"></span>
{% if select_all_obj_text %}
<a class="num-objects-in-listing u-hidden" href='#'>{{ select_all_obj_text }}</a>
{% endif %}
</div>
</footer>

2
wagtail/admin/templates/wagtailadmin/bulk_actions/listing_checkbox_cell.html
Wyświetl plik

@ -4,5 +4,5 @@
{% if obj_type == 'page' %}
data-page-status="{% if obj.live %}live{% else %}draft{% endif %}"
{% endif %}
data-page-id="{{obj.id}}" class="bulk-action-checkbox" aria-label="{{checkbox_aria_label}}" type="checkbox" />
data-object-id="{{obj.id}}" class="bulk-action-checkbox" aria-label="{{checkbox_aria_label}}" type="checkbox" />
</td>

2
wagtail/admin/templates/wagtailadmin/bulk_actions/select_all_checkbox_cell.html
Wyświetl plik

@ -1,7 +1,7 @@
{% load i18n wagtailadmin_tags %}
<th class="bulk-actions-filter-checkbox" data-parent-id="{{ parent.id }}">
<div>
{% trans "Bulk action checkbox" as aria_label }
{% trans "Bulk action checkbox" as aria_label %}
<input type="checkbox" aria-label="{{aria_label}}" />
{% bulk_action_filters %}
</div>

19
wagtail/admin/templatetags/wagtailadmin_tags.py
Wyświetl plik

@ -504,15 +504,20 @@ def bulk_action_filters(context):
@register.inclusion_tag("wagtailadmin/pages/listing/_buttons.html",
takes_context=True)
def page_bulk_action_choices(context):
def bulk_action_choices(context, hook_name):
corresponding_urls = {
'register_page_bulk_action': 'wagtailadmin_bulk_action',
}
if hook_name not in corresponding_urls:
return {'buttons': []}
corresponding_url = corresponding_urls[hook_name]
bulk_actions_list = []
bulk_actions = hooks.get_hooks('register_page_bulk_action')
bulk_actions = hooks.get_hooks(hook_name)
for action_func in bulk_actions:
action = action_func(context.request)
bulk_actions_list.append(action)
button_hooks = hooks.get_hooks('construct_page_bulk_action_choices')
for hook in button_hooks:
hook(context.request, bulk_actions_list)
bulk_actions_list.sort(key=lambda x: x.action_priority)
@ -524,7 +529,7 @@ def page_bulk_action_choices(context):
bulk_action_buttons = [
PageListingButton(
action.display_name,
reverse('wagtailadmin_bulk_action', args=[action.action_type]) + '?' + urlencode({'next': action.next_url}),
reverse(corresponding_url, args=[action.action_type]) + '?' + urlencode({'next': action.next_url}),
attrs={'aria-label': action.aria_label},
priority=action.action_priority,
classes=action.classes | {'bulk-action-btn'},
@ -542,7 +547,7 @@ def page_bulk_action_choices(context):
btn_classes={'button', 'button-small'},
buttons_data=[{
'label': action.display_name,
'url': reverse('wagtailadmin_bulk_action', args=[action.action_type]) + '?' + urlencode({'next': action.next_url}),
'url': reverse(corresponding_url, args=[action.action_type]) + '?' + urlencode({'next': action.next_url}),
'attrs': {'aria-label': action.aria_label},
'priority': action.action_priority,
'classes': {'bulk-action-btn'},