https://cdn.bukowskis.com/assets/src/backoffice/terms_in_category-…4f75ae215a113ec9c54983d48d725356a1952f71.js

1/* global $:false */
2
3import Mountable from 'src/shared/mountable'
4import Sortable from 'sortablejs'
5
6export default class TermsInCategory extends Mountable {
7  static selector = '.js-terms-in-category'
8
9  mount () {
10    this.categoryId = this.el.dataset.categoryId
11    this.baseUrl = `/backoffice/condition_categories/${this.categoryId}/condition_terms`
12    this.sortable = Sortable.create(this.el, {
13      group: {
14        name: 'condition-terms',
15        put: (to, from, el) => {
16          return this.elementInSortable(el) ? false : true
17        }
18      },
19      dataIdAttr: 'data-condition-term-id',
20      removeOnSpill: true,
21      sort: false,
22      onAdd: this.addTerm.bind(this),
23      onRemove: this.removeTerm.bind(this),
24      onSpill: this.removeTerm.bind(this)
25    })
26  }
27
28  unmount() {
29    this.sortable.destroy()
30  }
31
32  elementInSortable (element) {
33    return this.sortable.toArray().includes(element.dataset.conditionTermId)
34  }
35
36  async addTerm (event) {
37    await fetch(this.baseUrl, {
38      method: 'POST',
39      headers: {
40        'Content-Type': 'application/json',
41        'X-CSRF-Token': document.querySelector('meta[name="csrf-token"]')?.content
42      },
43      body: JSON.stringify({ condition_term: { id: event.item.dataset.conditionTermId }})
44    })
45  }
46
47  async removeTerm (event) {
48    const termId = event.item.dataset.conditionTermId
49    const url =  `${this.baseUrl}/${termId}`
50    await fetch(url, {
51      method: 'DELETE',
52      headers: {
53        'Content-Type': 'application/json',
54        'X-CSRF-Token': document.querySelector('meta[name="csrf-token"]')?.content
55      }
56    })
57  }
58};