https://gsrm.ru/local/templates/gsrm/js/documents-select.js

1const selectRoots = document.querySelectorAll('.documents__select');
2
3if (selectRoots.length) {
4  const closeSelect = (toggle, content) => {
5    toggle.classList.remove('documents__select-title_open');
6    content.classList.remove('documents__select-content_open');
7  };
8
9  selectRoots.forEach((root) => {
10    const toggle = root.querySelector('[data-select-toggle]') || root.querySelector('.documents__select-title');
11    const content = root.querySelector('[data-select-content]') || root.querySelector('.documents__select-content');
12    const label = root.querySelector('[data-select-label]');
13    const elems = root.querySelectorAll('.documents__select-elem');
14    const hiddenInputName = root.classList.contains('documents__select_search') ? 'search_by' : null;
15    const hiddenInput = hiddenInputName ? document.querySelector(`input[name="${hiddenInputName}"]`) : null;
16
17    if (!toggle || !content) {
18      return;
19    }
20
21    toggle.addEventListener('click', () => {
22      const isOpen = toggle.classList.contains('documents__select-title_open');
23
24      selectRoots.forEach((otherRoot) => {
25        const otherToggle = otherRoot.querySelector('[data-select-toggle]') || otherRoot.querySelector('.documents__select-title');
26        const otherContent = otherRoot.querySelector('[data-select-content]') || otherRoot.querySelector('.documents__select-content');
27
28        if (otherToggle && otherContent) {
29          closeSelect(otherToggle, otherContent);
30        }
31      });
32
33      if (!isOpen) {
34        toggle.classList.add('documents__select-title_open');
35        content.classList.add('documents__select-content_open');
36      }
37    });
38
39    elems.forEach((elem) => {
40      elem.addEventListener('click', () => {
41        if (hiddenInput && elem.dataset.selectValue) {
42          hiddenInput.value = elem.dataset.selectValue;
43        }
44
45        if (label && elem.dataset.selectText) {
46          label.textContent = elem.dataset.selectText;
47        }
48
49        elems.forEach((button) => {
50          button.classList.remove('filter-elem_active');
51        });
52
53        elem.classList.add('filter-elem_active');
54        closeSelect(toggle, content);
55      });
56    });
57  });
58
59  addEventListener('click', (e) => {
60    selectRoots.forEach((root) => {
61      const toggle = root.querySelector('[data-select-toggle]') || root.querySelector('.documents__select-title');
62      const content = root.querySelector('[data-select-content]') || root.querySelector('.documents__select-content');
63
64      if (toggle && content && !root.contains(e.target)) {
65        closeSelect(toggle, content);
66      }
67    });
68  });
69}