diff --git a/lib/public/views/lhcPeriods/ActiveColumns/lhcPeriodsActiveColumns.js b/lib/public/views/lhcPeriods/ActiveColumns/lhcPeriodsActiveColumns.js index 6f757e25d0..6c312fbecf 100644 --- a/lib/public/views/lhcPeriods/ActiveColumns/lhcPeriodsActiveColumns.js +++ b/lib/public/views/lhcPeriods/ActiveColumns/lhcPeriodsActiveColumns.js @@ -30,8 +30,8 @@ export const lhcPeriodsActiveColumns = { name: 'Name', visible: true, sortable: true, - filter: ({ namesFilterModel }) => textFilter( - namesFilterModel, + filter: ({ filteringModel }) => textFilter( + filteringModel.get('names'), { class: 'w-75 mt1', placeholder: 'e.g. LHC22a, lhc23b, ...' }, ), classes: 'w-15', @@ -92,8 +92,8 @@ export const lhcPeriodsActiveColumns = { visible: true, sortable: true, format: (_, lhcPeriod) => formatLhcPeriodYear(lhcPeriod.name), - filter: ({ yearsFilterModel }) => textFilter( - yearsFilterModel, + filter: ({ filteringModel }) => textFilter( + filteringModel.get('years'), { class: 'w-75 mt1', placeholder: 'e.g. 2022, 2023, ...' }, ), classes: 'w-7', @@ -104,8 +104,8 @@ export const lhcPeriodsActiveColumns = { visible: true, sortable: true, format: (pdpBeamTypes) => pdpBeamTypes.length > 0 ? pdpBeamTypes.join(',') : '-', - filter: ({ pdpBeamTypesFilterModel }) => textFilter( - pdpBeamTypesFilterModel, + filter: ({ filteringModel }) => textFilter( + filteringModel.get('pdpBeamTypes'), { class: 'w-75 mt1', placeholder: 'e.g. pp, PbPb' }, ), classes: 'w-7', diff --git a/lib/public/views/lhcPeriods/Overview/LhcPeriodsOverviewModel.js b/lib/public/views/lhcPeriods/Overview/LhcPeriodsOverviewModel.js index eb2d5e48cd..e6073eb68f 100644 --- a/lib/public/views/lhcPeriods/Overview/LhcPeriodsOverviewModel.js +++ b/lib/public/views/lhcPeriods/Overview/LhcPeriodsOverviewModel.js @@ -11,6 +11,7 @@ * or submit itself to any jurisdiction. */ +import { FilteringModel } from '../../../components/Filters/common/FilteringModel.js'; import { TextTokensFilterModel } from '../../../components/Filters/common/filters/TextTokensFilterModel.js'; import { OverviewPageModel } from '../../../models/OverviewModel.js'; import { buildUrl } from '/js/src/index.js'; @@ -27,27 +28,33 @@ export class LhcPeriodsOverviewModel extends OverviewPageModel { constructor() { super(); - this._namesFilterModel = new TextTokensFilterModel(); - this._registerFilter(this._namesFilterModel); - this._yearsFilterModel = new TextTokensFilterModel(); - this._registerFilter(this._yearsFilterModel); - this._pdpBeamTypesFilterModel = new TextTokensFilterModel(); - this._registerFilter(this._pdpBeamTypesFilterModel); + this._filteringModel = new FilteringModel({ + names: new TextTokensFilterModel(), + years: new TextTokensFilterModel(), + pdpBeamTypes: new TextTokensFilterModel(), + }); + + this._filteringModel.visualChange$.bubbleTo(this); + this._filteringModel.observe(() => { + this._pagination.silentlySetCurrentPage(1); + this.load(); + }); } /** * @inheritdoc */ getRootEndpoint() { - const params = { - filter: { - names: this._namesFilterModel.normalized, - years: this._yearsFilterModel.normalized, - pdpBeamTypes: this._pdpBeamTypesFilterModel.normalized, - }, - }; + return buildUrl('/api/lhcPeriodsStatistics', { filter: this._filteringModel.normalized }); + } - return buildUrl('/api/lhcPeriodsStatistics', params); + /** + * Return the model managing all filters + * + * @return {FilteringModel} the filtering model + */ + get filteringModel() { + return this._filteringModel; } /** @@ -66,30 +73,6 @@ export class LhcPeriodsOverviewModel extends OverviewPageModel { }); } - /** - * Returns lhc periods names filter model - * @return {TextTokensFilterModel} lhc periods names filter model - */ - get namesFilterModel() { - return this._namesFilterModel; - } - - /** - * Returns lhc periods years filter model - * @return {TextTokensFilterModel} lhc periods years filter model - */ - get yearsFilterModel() { - return this._yearsFilterModel; - } - - /** - * Returns lhc periods beam type filter model - * @return {TextTokensFilterModel} lhc periods beam type filter model - */ - get pdpBeamTypesFilterModel() { - return this._pdpBeamTypesFilterModel; - } - /** * Reset this model to its default * @@ -97,23 +80,7 @@ export class LhcPeriodsOverviewModel extends OverviewPageModel { */ reset() { super.reset(); - this._namesFilterModel.reset(); - this._yearsFilterModel.reset(); - this._pdpBeamTypesFilterModel.reset(); - } - - /** - * Register a new filter model - * @param {FilterModel} filterModel the filter model to register - * @return {void} - * @private - */ - _registerFilter(filterModel) { - filterModel.visualChange$.bubbleTo(this); - filterModel.observe(() => { - this._pagination.silentlySetCurrentPage(1); - this.load(); - }); + this._filteringModel.reset(); } /** @@ -121,6 +88,6 @@ export class LhcPeriodsOverviewModel extends OverviewPageModel { * @return {boolean} true if any filter is active */ isAnyFilterActive() { - return !this._namesFilterModel.isEmpty || !this._yearsFilterModel.isEmpty || !this._pdpBeamTypesFilterModel.isEmpty; + return this._filteringModel.isAnyFilterActive(); } }