BookStack Code Mirror - bookstack/blob - resources/js/components/list-sort-control.js

   1 /**
   2  * ListSortControl
   3  * Manages the logic for the control which provides list sorting options.
   4  * @extends {Component}
   5  */
   6 class ListSortControl {
   7
   8     setup() {
   9         this.elem = this.$el;
  10         this.menu = this.$refs.menu;
  11
  12         this.sortInput = this.$refs.sort;
  13         this.orderInput = this.$refs.order;
  14         this.form = this.$refs.form;
  15
  16         this.setupListeners();
  17     }
  18
  19     setupListeners() {
  20         this.menu.addEventListener('click', event => {
  21             if (event.target.closest('[data-sort-value]') !== null) {
  22                 this.sortOptionClick(event);
  23             }
  24         });
  25
  26         this.elem.addEventListener('click', event => {
  27             if (event.target.closest('[data-sort-dir]') !== null) {
  28                 this.sortDirectionClick(event);
  29             }
  30         });
  31     }
  32
  33     sortOptionClick(event) {
  34         const sortOption = event.target.closest('[data-sort-value]');
  35         this.sortInput.value = sortOption.getAttribute('data-sort-value');
  36         event.preventDefault();
  37         this.form.submit();
  38     }
  39
  40     sortDirectionClick(event) {
  41         const currentDir = this.orderInput.value;
  42         this.orderInput.value = (currentDir === 'asc') ? 'desc' : 'asc';
  43         event.preventDefault();
  44         this.form.submit();
  45     }
  46
  47 }
  48
  49 export default ListSortControl;