app/template/default/Block/category_nav_sp.twig line 1

Open in your IDE?
  1. {#
  2. This file is part of EC-CUBE
  4. Copyright(c) EC-CUBE CO.,LTD. All Rights Reserved.
  6. http://www.ec-cube.co.jp/
  8. For the full copyright and license information, please view the LICENSE
  9. file that was distributed with this source code.
  10. #}
  11. {% set Categories = repository('Eccube\\Entity\\Category').getList() %}
  13. {% block javascript %}
  14.     <script>
  15.         $(function() {
  16.             $('.ec-headerCategoryArea .ec-itemNav__nav li > a').on('click', function() {
  17.                 $categoryItem = $(this).parent('.haschild');
  18.                 $categoryList = $categoryItem.children('.category_child');
  19.                 $childrenIcon = $(this).children('.only-opend');
  20.                 if ($categoryList.length > 0){
  21.                     if ($categoryList.css('display') == 'none') {
  22.                         $categoryList.slideDown(300);
  23.                         $childrenIcon.addClass('active');
  24.                     } else {
  25.                         $categoryList.slideUp(250);
  26.                         $childrenIcon.removeClass('active');
  27.                     }
  28.                     return false;
  29.                 }
  30.             });
  31.         });
  32.     </script>
  33. {% endblock %}
  36. {% macro tree(Category) %}
  37.     {% from _self import tree %}
  38.     <a href="{{ url('product_list') }}?category_id={{ Category.id }}#tab-link">
  39.         {{ Category.name }}
  40.         {% if Category.children|length == 0 %}
  41.             <img src="{{ asset('assets/icon/icon_arrow_red.svg') }}" class="ec-itemNav__iconlink" alt="矢印アイコン">
  42.         {% else %}
  43.             <img src="{{ asset('assets/icon/icon_add.svg') }}" class="ec-itemNav__iconlink only-opend" alt="プラスアイコン">
  44.             <img src="{{ asset('assets/icon/icon_minus.svg') }}" class="ec-itemNav__iconlink" alt="マイナスアイコン">
  45.         {% endif %}
  46.     </a>
  47.     {% if Category.children|length > 0 %}
  48.         <ul style="display: none;" class="category_child">
  49.             <li>
  50.                 <a href="{{ url('product_list') }}?category_id={{ Category.id }}">
  51.                     <span>すべて</span>
  52.                     <img src="{{ asset('assets/icon/icon_arrow_red.svg') }}" class="ec-itemNav__iconlink" alt="矢印アイコン">
  53.                 </a>
  54.             </li>
  55.             {% for ChildCategory in Category.children %}
  56.                 <li>
  57.                     {{ tree(ChildCategory) }}
  58.                 </li>
  59.             {% endfor %}
  60.         </ul>
  61.     {% endif %}
  62. {% endmacro %}
  64. {# @see https://github.com/bolt/bolt/pull/2388 #}
  65. {% from _self import tree %}
  67. <div class="ec-headerCategoryArea">
  68.     <div class="ec-headerCategoryArea__heading">
  69.         <p>{{ 'カテゴリから探す'|trans }}</p>
  70.         <span class="ec-headerCategoryArea__toggle">すべて開く</span>
  71.     </div>
  72.     <div class="ec-itemNav">
  73.         <ul class="ec-itemNav__nav">
  74.             {% for Category in Categories %}
  75.                 <li>
  76.                     {{ tree(Category) }}
  77.                 </li>
  78.             {% endfor %}
  79.         </ul>
  80.     </div>
  81. </div>