MDL-72545 reportbuilder: reload form fragment after filter reset.

Instead of performing a page reload after resetting report filters,
we can use the fragment API to re-render the form after the user
presses the reset button.
This commit is contained in:
Paul Holden
2021-09-24 08:20:38 +01:00
parent 214adb7984
commit 8f3c7e6e8c
7 changed files with 84 additions and 10 deletions
+19
View File
@@ -29,3 +29,22 @@ Feature: View task logs report and use its filters
| name | match | nonmatch |
| task\\clean_events | Cleanup event monitor events | Incoming email pickup |
| task\\pickup_task | Incoming email pickup | Cleanup event monitor events |
@javascript
Scenario: Reset task log filters
Given I log in as "admin"
And I change window size to "large"
And I navigate to "Server > Tasks > Task logs" in site administration
When I click on "Filters" "button"
And I set the following fields in the "Result" "core_reportbuilder > Filter" to these values:
| Result operator | Is equal to |
| Result value | Fail |
And I click on "Apply" "button" in the "[data-region='report-filters']" "css_element"
Then I should see "Filters applied"
And I should see "Nothing to display"
And I click on "Reset" "button" in the "[data-region='report-filters']" "css_element"
And I should see "Filters reset"
And "[data-region='report-filters']" "css_element" should be visible
And the following fields in the "Result" "core_reportbuilder > Filter" match these values:
| Result operator | Is any value |
And I should not see "Nothing to display"
+1 -1
View File
@@ -1,2 +1,2 @@
function _typeof(a){"@babel/helpers - typeof";if("function"==typeof Symbol&&"symbol"==typeof Symbol.iterator){_typeof=function(a){return typeof a}}else{_typeof=function(a){return a&&"function"==typeof Symbol&&a.constructor===Symbol&&a!==Symbol.prototype?"symbol":typeof a}}return _typeof(a)}define ("core_reportbuilder/filters",["exports","core/event_dispatcher","core/notification","core/pending","core/str","core/toast","core_form/dynamicform","core_reportbuilder/local/events","core_reportbuilder/local/selectors","core_reportbuilder/local/repository/filters"],function(a,b,c,d,e,f,g,h,i,j){"use strict";Object.defineProperty(a,"__esModule",{value:!0});a.init=void 0;c=m(c);d=m(d);g=m(g);h=l(h);i=l(i);function k(){if("function"!=typeof WeakMap)return null;var a=new WeakMap;k=function(){return a};return a}function l(a){if(a&&a.__esModule){return a}if(null===a||"object"!==_typeof(a)&&"function"!=typeof a){return{default:a}}var b=k();if(b&&b.has(a)){return b.get(a)}var c={},d=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var e in a){if(Object.prototype.hasOwnProperty.call(a,e)){var f=d?Object.getOwnPropertyDescriptor(a,e):null;if(f&&(f.get||f.set)){Object.defineProperty(c,e,f)}else{c[e]=a[e]}}}c.default=a;if(b){b.set(a,c)}return c}function m(a){return a&&a.__esModule?a:{default:a}}var n=function(a){var k=document.querySelector(i.forSystemReport(a)),l=k.querySelector(i.regions.filtersForm),m=new g.default(l,"\\core_reportbuilder\\form\\filter");m.addEventListener(m.events.FORM_SUBMITTED,function(a){a.preventDefault();(0,b.dispatchEvent)(h.tableReload,{},k);(0,e.get_string)("filtersapplied","core_reportbuilder").then(f.add).catch(c.default.exception)});m.addEventListener(m.events.NOSUBMIT_BUTTON_PRESSED,function(b){b.preventDefault();var g=new d.default("core_reportbuilder/filters:reset");(0,j.reset)(a).then(function(){return(0,e.get_string)("filtersreset","core_reportbuilder")}).then(f.add).then(function(){g.resolve();window.location.reload()}).catch(c.default.exception)});document.querySelector("#region-main").style.overflowX="visible"};a.init=n});
function _typeof(a){"@babel/helpers - typeof";if("function"==typeof Symbol&&"symbol"==typeof Symbol.iterator){_typeof=function(a){return typeof a}}else{_typeof=function(a){return a&&"function"==typeof Symbol&&a.constructor===Symbol&&a!==Symbol.prototype?"symbol":typeof a}}return _typeof(a)}define ("core_reportbuilder/filters",["exports","core/event_dispatcher","core/fragment","core/notification","core/pending","core/str","core/templates","core/toast","core_form/dynamicform","core_reportbuilder/local/events","core_reportbuilder/local/selectors","core_reportbuilder/local/repository/filters"],function(a,b,c,d,e,f,g,h,i,j,k,l){"use strict";Object.defineProperty(a,"__esModule",{value:!0});a.init=void 0;d=o(d);e=o(e);g=o(g);i=o(i);j=n(j);k=n(k);function m(){if("function"!=typeof WeakMap)return null;var a=new WeakMap;m=function(){return a};return a}function n(a){if(a&&a.__esModule){return a}if(null===a||"object"!==_typeof(a)&&"function"!=typeof a){return{default:a}}var b=m();if(b&&b.has(a)){return b.get(a)}var c={},d=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var e in a){if(Object.prototype.hasOwnProperty.call(a,e)){var f=d?Object.getOwnPropertyDescriptor(a,e):null;if(f&&(f.get||f.set)){Object.defineProperty(c,e,f)}else{c[e]=a[e]}}}c.default=a;if(b){b.set(a,c)}return c}function o(a){return a&&a.__esModule?a:{default:a}}var p=function(a,m){var n=document.querySelector(k.forSystemReport(a)),o=n.querySelector(k.regions.filtersForm),p=new i.default(o,"\\core_reportbuilder\\form\\filter");p.addEventListener(p.events.FORM_SUBMITTED,function(a){a.preventDefault();(0,b.dispatchEvent)(j.tableReload,{},n);(0,f.get_string)("filtersapplied","core_reportbuilder").then(h.add).catch(d.default.exception)});p.addEventListener(p.events.NOSUBMIT_BUTTON_PRESSED,function(i){i.preventDefault();var k=new e.default("core_reportbuilder/filters:reset");(0,l.reset)(a).then(function(){return(0,f.get_string)("filtersreset","core_reportbuilder")}).then(h.add).then(function(){return(0,c.loadFragment)("core_reportbuilder","filters_form",m,{reportid:a,parameters:n.dataset.parameter})}).then(function(a,c){g.default.replaceNodeContents(o,a,c);(0,b.dispatchEvent)(j.tableReload,{},n);return k.resolve()}).catch(d.default.exception)});document.querySelector("#region-main").style.overflowX="visible"};a.init=p});
//# sourceMappingURL=filters.min.js.map
File diff suppressed because one or more lines are too long
+13 -5
View File
@@ -22,9 +22,11 @@
*/
import {dispatchEvent} from 'core/event_dispatcher';
import {loadFragment} from 'core/fragment';
import Notification from 'core/notification';
import Pending from 'core/pending';
import {get_string as getString} from 'core/str';
import Templates from 'core/templates';
import {add as addToast} from 'core/toast';
import DynamicForm from 'core_form/dynamicform';
import * as reportEvents from 'core_reportbuilder/local/events';
@@ -36,8 +38,9 @@ import {reset as resetFilters} from 'core_reportbuilder/local/repository/filters
*
* @method
* @param {Number} reportId
* @param {Number} contextId
*/
export const init = reportId => {
export const init = (reportId, contextId) => {
const reportElement = document.querySelector(reportSelectors.forSystemReport(reportId));
const filterFormContainer = reportElement.querySelector(reportSelectors.regions.filtersForm);
const filterForm = new DynamicForm(filterFormContainer, '\\core_reportbuilder\\form\\filter');
@@ -63,10 +66,15 @@ export const init = reportId => {
resetFilters(reportId)
.then(() => getString('filtersreset', 'core_reportbuilder'))
.then(addToast)
.then(() => {
pendingPromise.resolve();
window.location.reload();
return;
.then(() => loadFragment('core_reportbuilder', 'filters_form', contextId, {
reportid: reportId,
parameters: reportElement.dataset.parameter,
}))
.then((html, js) => {
Templates.replaceNodeContents(filterFormContainer, html, js);
dispatchEvent(reportEvents.tableReload, {}, reportElement);
return pendingPromise.resolve();
})
.catch(Notification.exception);
});
@@ -71,12 +71,14 @@ class select extends base {
*/
public function setup_form(MoodleQuickForm $mform): void {
$elements = [];
$elements['operator'] = $mform->createElement('select', $this->name . '_operator', null, $this->get_operators());
$elements['operator'] = $mform->createElement('select', $this->name . '_operator',
get_string('filterfieldoperator', 'core_reportbuilder', $this->get_header()), $this->get_operators());
// If a multi-dimensional array is passed, we need to use a different element type.
$options = $this->get_select_options();
$element = (count($options) == count($options, COUNT_RECURSIVE) ? 'select' : 'selectgroups');
$elements['value'] = $mform->createElement($element, $this->name . '_value', null, $options);
$elements['value'] = $mform->createElement($element, $this->name . '_value',
get_string('filterfieldvalue', 'core_reportbuilder', $this->get_header()), $options);
$mform->addElement('group', $this->name . '_group', '', $elements, '', false);
+44
View File
@@ -0,0 +1,44 @@
<?php
// This file is part of Moodle - http://moodle.org/
//
// Moodle is free software: you can redistribute it and/or modify
// it under the terms of the GNU General Public License as published by
// the Free Software Foundation, either version 3 of the License, or
// (at your option) any later version.
//
// Moodle is distributed in the hope that it will be useful,
// but WITHOUT ANY WARRANTY; without even the implied warranty of
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
// GNU General Public License for more details.
//
// You should have received a copy of the GNU General Public License
// along with Moodle. If not, see <http://www.gnu.org/licenses/>.
/**
* Callback methods for reportbuilder component
*
* @package core_reportbuilder
* @copyright 2021 Paul Holden <[email protected]>
* @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
*/
declare(strict_types=1);
use core_reportbuilder\form\filter;
/**
* Return the filters form fragment
*
* @param array $params
* @return string
*/
function core_reportbuilder_output_fragment_filters_form(array $params): string {
$filtersform = new filter(null, null, 'post', '', [], true, [
'reportid' => $params['reportid'],
'parameters' => $params['parameters'],
]);
$filtersform->set_data_for_dynamic_submission();
return $filtersform->render();
}
@@ -22,6 +22,7 @@
Example context (json):
{
"id": 3,
"contextid": 1,
"filtersform": "form"
}
}}
@@ -48,6 +49,6 @@
{{#js}}
require(['core_reportbuilder/filters'], function(filters) {
filters.init('{{id}}');
filters.init({{id}}, {{contextid}});
});
{{/js}}