https://www.nissen.co.jp/_DEFAULT/top/js/240222/category_list.js

1function scroll_top(scroll_item) {
2  var position = scroll_item.offset().top;
3  $('body,html').stop().animate(
4    {
5      scrollTop: position,
6    },
7    0,
8    'swing',
9  );
10}
11
12function acd(ele) {
13  if (ele.className.indexOf('menuopen') != -1) {
14    ele.classList.remove('menuopen');
15    $(ele.getAttribute('rel')).slideUp(250);
16  } else {
17    ele.classList.add('menuopen');
18    $(ele.getAttribute('rel')).slideDown(250, function () {
19      scroll_top($(ele));
20    });
21  }
22
23  $('.category__list--acc').each(function () {
24    if ($(this).attr('id') != ele.id) {
25      if ($(this).hasClass('menuopen')) {
26        $($(this).attr('rel')).slideUp(250);
27        $(this).removeClass('menuopen');
28      }
29    }
30  });
31}
32
33function acd_child(ele) {
34  var index = $(ele).index();
35  var category_parent_id = $(ele).parent().parent().attr('id');
36  if ($(ele).hasClass('menuopen')) {
37    $(ele).removeClass('menuopen');
38    $(ele).parent().next().children().eq(index).slideUp(250);
39  } else {
40    $('.category__item-child').removeClass('menuopen');
41    $('.category__item-detail').removeClass('menuopen');
42
43    $('#' + category_parent_id + ' .category__item-child-list').each(function () {
44      if ($(this).attr('rel') != $(ele).attr('rel')) {
45        if ($(this).hasClass('menuopen')) {
46          $('#' + $(this).attr('rel')).slideUp(250);
47          $(this).removeClass('menuopen');
48        }
49      }
50    });
51    $(ele).addClass('menuopen');
52    $(ele)
53      .parent()
54      .next()
55      .children()
56      .eq(index)
57      .slideDown(250, function () {
58        scroll_top($(ele));
59      });
60  }
61}
62
63function category_list(ele, flag, param, num, cateId, query, url, column) {
64  if (flag && ele) {

65    $('#' + ele.id).css('pointerEvents', 'none');
66    axios
67      .get('/api/v1/item/search/json?' + param)
68      .then(function (resp) {
69        if (resp.data.itemSearchInfoXML.rcd == 200) {
70          var array_params = [];
71          var ta_params = '?ta=';
72          if(param.indexOf(',') != -1) {
73            array_params = param.split(',');
74            var filter_array_params = array_params.filter(function(array_param) {
75              return array_param.indexOf('SH') == -1;
76            });
77          }
78
79          var category_lists = resp.data.itemSearchInfoXML.itemSearchInfo.facet.itcaFcList;
80          var child_list = '';
81          var array_cateId = cateId.split(',');
82
83          var filteredCategories = category_lists.filter(function (category) {
84            return cateId === '' || array_cateId.indexOf(category.f.id) !== -1;
85          });
86
87          var chunkSize = parseInt(column, 10);
88
89          var chunked_categories = [];
90          for (var i = 0; i < filteredCategories.length; i += chunkSize) {
91            chunked_categories.push(filteredCategories.slice(i, i + chunkSize));
92          }
93
94          for (var i = 0; i < chunked_categories.length; i++) {
95            child_list += '<ul class="category__item-child">';
96

97            chunked_categories[i].forEach(function(chunked_category) {
98              child_list += '<li class="category__item-child-list" onclick="acd_child(this)" rel="category_' + i+1 + '_' + chunked_category.f.id + '">';
99              child_list += '  <span class="category__item-child-list-text">' + chunked_category.f.nm + '</span>';
100              child_list += '  <span class="category__item-child-list-acc"><svg id="icon-acc" class="icon-acc" width="60" height="60" viewBox="0 0 60 60"><rect class="icon-acc__cls-1" y="27" width="60" height="6"></rect><path class="icon-acc__cls-2" d="M33,0V60H27V0h6Z"></path></svg></span>';
101              child_list += '</li>';
102            });
103
104            child_list += '</ul>';
105            child_list += '<ul class="category__item-detail">';
106
107            chunked_categories[i].forEach(function(chunked_category) {
108              var set_ta_params = array_params.length > 0 ? ta_params + filter_array_params.join(',') : '';
109
110              child_list += '  <li id="category_' + i+1 + '_' + chunked_category.f.id + '" class="category__item-detail-list">';
111              child_list += '    <ul class="category__item-detail-list-wrap">';
112              child_list += '      <li class="category__item-detail-list-li category__item-detail-list-li--wd">';
113              child_list += '        <a href="' + url + 'category/' + chunked_category.f.id + '/' + set_ta_params + '" class="category__item-detail-list-li-link category__item-detail-list-li-link--wd">';
114              child_list += '          <span class="category__item-detail-list-li-link-text">' + chunked_category.f.nm + 'をすべて見る</span>';
115              child_list += '        </a>';
116              child_list += '      </li>';
117
118              var childListArray = chunked_category.f.childL || [];
119              for (var j = 0; j < childListArray.length; j++) {
120                child_list += '    <li class="category__item-detail-list-li">';
121                child_list += '      <a href="' + url + 'category/' + chunked_category.f.id + '/' + chunked_category.f.childL[j].f.id + '/' + set_ta_params + '" class="category__item-detail-list-li-link">';
122                child_list += '        <span class="category__item-detail-list-li-link-text">' + chunked_category.f.childL[j].f.nm + '</span>';
123                child_list += '      </a>';
124                child_list += '    </li>';
125              }
126              child_list += '    </ul>';
127              child_list += '  </li>';
128            });
129            child_list += '</ul>';
130          }
131
132          document.getElementById('category__item__ul--' + num).insertAdjacentHTML('beforeend', child_list);
133          ele.setAttribute('onclick', "category_list(this, false,'','')");
134          acd(ele);
135
136          setTimeout(function () {
137            $('#' + ele.id).css('pointerEvents', 'auto');
138          }, 300);
139        } else {
140          console.log('category/search(error)');
141          console.log(resp.data.itemSearchInfoXML.rcd);
142        }
143      })
144      .catch(function (err) {
145        console.log(err);
146      });
147  } else {
148    acd(ele);
149  }
150}