diff --git a/src/const.js b/src/const.js new file mode 100644 index 0000000..630e407 --- /dev/null +++ b/src/const.js @@ -0,0 +1,13 @@ +export const SortType = { + DAY: 'day', + PRICE: 'price', + TIME: 'time', +}; + +export const SORT_OPTIONS = [ + { id: 'sort-day', value: 'day', label: 'Day', isDisabled: false, isChecked: true }, + { id: 'sort-event', value: 'event', label: 'Event', isDisabled: true, isChecked: false }, + { id: 'sort-time', value: 'time', label: 'Time', isDisabled: false, isChecked: false }, + { id: 'sort-price', value: 'price', label: 'Price', isDisabled: false, isChecked: false }, + { id: 'sort-offer', value: 'offer', label: 'Offers', isDisabled: true, isChecked: false }, +]; diff --git a/src/presenter/board-presenter.js b/src/presenter/board-presenter.js index 889eb4d..2d89ea4 100644 --- a/src/presenter/board-presenter.js +++ b/src/presenter/board-presenter.js @@ -5,6 +5,7 @@ import EventListView from '../view/events-list-view.js'; import { RenderPosition } from '../render.js'; import { render } from '../framework/render.js'; import EventPresenter from './event-presenter.js'; +import {SortType} from '../const.js'; export default class BoardPresenter { #filtersContainer = null; @@ -61,22 +62,22 @@ export default class BoardPresenter { #clearTripEvents() { this.#eventPresenters.forEach((presenter) => presenter.resetView()); this.#eventPresenters.clear(); - this.#eventsListView.element.innerHTML = ''; + this.#eventsListView.element.replaceChildren(); } #getSortedEvents() { const events = [...this.#model.events]; switch (this.#currentSortType) { - case 'time': + case SortType.TIME: return events.sort( (a, b) => (new Date(b.dateTo) - new Date(b.dateFrom)) - (new Date(a.dateTo) - new Date(a.dateFrom)) ); - case 'price': + case SortType.PRICE: return events.sort((a, b) => b.basePrice - a.basePrice); - case 'day': + case SortType.DAY: default: return events.sort((a, b) => new Date(a.dateFrom) - new Date(b.dateFrom)); } diff --git a/src/view/sorts-view.js b/src/view/sorts-view.js index 0ce7c7f..5cd13ec 100644 --- a/src/view/sorts-view.js +++ b/src/view/sorts-view.js @@ -1,33 +1,23 @@ +import {SORT_OPTIONS} from '../const.js'; import AbstractView from '../framework/view/abstract-view.js'; function createSortTemplate() { return ` -
-
- - -
- -
- - -
- -
- - -
- -
- - -
- -
- - -
-
+
+ ${SORT_OPTIONS.map(({ id, value, label, isDisabled, isChecked }) => ` +
+ + +
+ `).join('')} +
`; } @@ -52,3 +42,5 @@ export default class SortsView extends AbstractView { this.#onSortTypeChange(evt.target.value); }; } + +