app/template/admin/Product/category.twig line 1

Open in your IDE?
  1. {% extends '@admin/default_frame.twig' %}
  3. {% set menus = ['product', 'class_category'] %}
  5. {% block title %}{{ 'admin.product.category_management'|trans }}{% endblock %}
  6. {% block sub_title %}{{ 'admin.product.product_management'|trans }}{% endblock %}
  8. {% form_theme form '@admin/Form/bootstrap_4_horizontal_layout.html.twig' %}
  10. {% block stylesheet %}
  11.     <link rel="stylesheet" href="{{ asset('/html/user_data/assets/css/fileupload/jquery.fileupload.css', 'admin') }}">
  12.     <link rel="stylesheet" href="{{ asset('/html/user_data/assets/css/fileupload/jquery.fileupload-ui.css', 'admin') }}">
  13.     <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
  15.     <style>
  16.         .c-directoryTree ul > li > ul li:not(:last-of-type) > label:before,
  17.         .c-directoryTree ul > li > ul li:last-of-type > label:before {
  18.             margin-right: 1.6em;
  19.         }
  20.     </style>
  21. {% endblock stylesheet %}
  23. {% block javascript %}
  25.     <!--<script src="{{ asset('/html/user_data/assets/js/vendor/jquery.ui/jquery.ui.core.min.js', 'admin') }}"></script>-->
  26.     <!--<script src="{{ asset('/html/user_data/assets/js/vendor/jquery.ui/jquery.ui.widget.min.js', 'admin') }}"></script>-->
  27.     <!--<script src="{{ asset('/html/user_data/assets/js/vendor/jquery.ui/jquery.ui.mouse.min.js', 'admin') }}"></script>-->
  28.     <!--<script src="{{ asset('/html/user_data/assets/js/vendor/jquery.ui/jquery.ui.sortable.min.js', 'admin') }}"></script>-->
  29.     <script src="{{ asset('/html/user_data/assets/js/vendor/jquery.ui/jquery.ui.widget.js', 'admin') }}"></script>
  30.     <script src="{{ asset('/html/user_data/assets/js/vendor/fileupload/jquery.iframe-transport.js', 'admin') }}"></script>
  31.     <script src="{{ asset('/html/user_data/assets/js/vendor/fileupload/jquery.fileupload.js', 'admin') }}"></script>
  32.     <script src="{{ asset('/html/user_data/assets/js/vendor/fileupload/jquery.fileupload-process.js', 'admin') }}"></script>
  33.     <script src="{{ asset('/html/user_data/assets/js/vendor/fileupload/jquery.fileupload-validate.js', 'admin') }}"></script>
  35.     <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
  36.     <script>
  37.         //var bootstrapTooltip = $.fn.tooltip.noConflict();
  38.         //if ($.fn.tooltip && $.fn.tooltip.noConflict) {
  39.           //  var bootstrapTooltip = $.fn.tooltip.noConflict();
  40.         //}
  41.     </script>
  42.     <script>
  44.         //$.fn.tooltip = bootstrapTooltip;
  46.         $(document).on('drop dragover', function(e) {
  47.             e.preventDefault();
  48.         });
  50.         $(function() {
  51.             // 初期表示時のsort noを保持.
  52.             var oldSortNos = [];
  53.             $('.sortable-item').each(function() {
  54.                 oldSortNos.push(this.dataset.sortNo);
  55.             });
  56.             oldSortNos.sort(function(a, b) {
  57.                 return a - b;
  58.             }).reverse();
  59.             // 並び替え後にsort noを更新
  60.             var updateSortNo = function() {
  61.                 var newSortNos = {};
  62.                 var i = 0;
  63.                 $('.sortable-item').each(function() {
  64.                     newSortNos[this.dataset.id] = oldSortNos[i];
  65.                     i++;
  66.                 });
  67.                 $.ajax({
  68.                     url: '{{ url('admin_product_category_sort_no_move') }}',
  69.                     type: 'POST',
  70.                     data: newSortNos
  71.                 }).always(function() {
  72.                     $(".modal-backdrop").remove();
  73.                 });
  74.             };
  75.             // 最初と最後の↑↓を再描画
  76.             var redrawDisableAllows = function() {
  77.                 var items = $('.sortable-item');
  78.                 items.find('a.action-up').removeClass('disabled');
  79.                 items.find('a.action-down').removeClass('disabled');
  80.                 items.first().find('a.action-up').addClass('disabled');
  81.                 items.last().find('a.action-down').addClass('disabled');
  82.             };
  83.             // オーバレイ後, 表示順の更新を行う
  84.             var moveSortNo = function() {
  85.                 $('body').append($('<div class="modal-backdrop show"></div>'));
  86.                 updateSortNo();
  87.                 redrawDisableAllows();
  88.             };
  89.             // Drag and Drop
  90.             $('.sortable-container').sortable({
  91.                 items: '> .sortable-item',
  92.                 cursor: 'move',
  93.                 update: function(e, ui) {
  94.                     moveSortNo();
  95.                 }
  96.             });
  97.             // Up
  98.             $('.sortable-item').on('click', 'a.action-up', function(e) {
  99.                 e.preventDefault();
  100.                 var current = $(this).parents("li");
  101.                 if (current.prev().hasClass('sortable-item')) {
  102.                     current.prev().before(current);
  103.                     moveSortNo();
  104.                 }
  105.             });
  106.             // Down
  107.             $('.sortable-item').on('click', 'a.action-down', function(e) {
  108.                 e.preventDefault();
  109.                 var current = $(this).parents("li");
  110.                 if (current.next().hasClass('sortable-item')) {
  111.                     current.next().after(current);
  112.                     moveSortNo();
  113.                 }
  114.             });
  116.             var groupItem = $('.list-group-item');
  117.             groupItem.on('click', 'a.action-edit', function(e) {
  118.                 e.preventDefault();
  119.                 var current = $(this).parents('li');
  120.                 current.find('.mode-view').addClass('d-none');
  121.                 current.find('.mode-edit').removeClass('d-none');
  122.             });
  124.             groupItem.on('click', 'button.action-edit-cancel', function(e) {
  125.                 e.preventDefault();
  126.                 var current = $(this).parents('li');
  127.                 current.find('[data-origin-value]').each(function(e) {
  128.                     $(this).val($(this).attr('data-origin-value'));
  129.                 });
  130.                 current.find('.mode-view').removeClass('d-none');
  131.                 current.find('.mode-edit').addClass('d-none');
  132.             });
  134.             groupItem.find('.is-invalid').each(function(e) {
  135.                 e.preventDefault();
  136.                 var current = $(this).parents("li");
  137.                 current.find('.mode-view').addClass('d-none');
  138.                 current.find('.mode-edit').removeClass('d-none');
  139.             });
  141.             // 削除モーダルのhrefとmessageの変更
  142.             $('#DeleteModal').on('shown.bs.modal', function(event) {
  143.                 var target = $(event.relatedTarget);
  144.                 // hrefの変更
  145.                 $(this).find('[data-method="delete"]').attr('href', target.data('url'));
  147.                 // messageの変更
  148.                 $(this).find('p.modal-message').text(target.data('message'));
  149.             });
  151.             var hideThumbnail = function() {
  152.                 if ($('#thumb div').length > 0) {
  153.                     $('#icon_no_image').css('display', 'none');
  154.                 } else {
  155.                     $('#icon_no_image').css('display', '');
  156.                 }
  157.             };
  159.             var proto_img = '<div class="c-form__fileUploadThumbnail" style="background-image:url(\'__path__\');">' +
  160.                 '<a class="delete-image"><i class="fa fa-times" aria-hidden="true"></i></a>' +
  161.                 '</div>';
  162.             var category_image = $('#{{ form.category_image.vars.id }}').val();
  163.             if (category_image != '') {
  164.                 var filename = $('#{{ form.category_image.vars.id }}').val();
  165.                 {# if (category_image == '{{ oldCategoryImage }}') { #}
  166.                 var path = '{{ asset('', 'save_image') }}' + filename;
  167.                 //} else {
  168.                 {# var path = '{{ asset('', 'temp_image') }}' + filename; #}
  169.                 //}
  170.                 var $img = $(proto_img.replace(/__path__/g, path));
  171.                 $('#{{ form.category_image.vars.id }}').val(filename);
  173.                 $('#thumb').append($img);
  174.                 hideThumbnail();
  175.             }
  176.             hideThumbnail();
  178.             $('.file-upload').fileupload({
  179.                 url: "{{ url('admin_product_category_image_add') }}",
  180.                 type: 'post',
  181.                 dataType: 'json',
  182.                 dropZone: $('#upload-zone'),
  183.                 done: function(e, data) {
  184.                     $('.progress', $(this).parent()).hide();
  185.                     var path = '{{ asset('', 'temp_image') }}/' + data.result.filename;
  186.                     var $img = $(proto_img.replace(/__path__/g, path));
  187.                     $('.category-image', $(this).parent()).val(data.result.filename);
  188.                     $('.upload-image', $(this).parent()).append($img);
  189.                     $('img', $(this).parent()).remove();
  191.                     hideThumbnail();
  192.                 },
  193.                 fail: function(e, data) {
  194.                     alert('{{ 'admin.common.upload_error'|trans }}');
  195.                 },
  196.                 always: function(e, data) {
  197.                     $('.progress').hide();
  198.                     $('.progress .progress-bar').width('0%');
  199.                 },
  200.                 start: function(e, data) {
  201.                     if ($('.c-form__fileUploadThumbnail').length >= 1) {
  202.                         $.each($('.delete-image'), function(index, delete_image) {
  203.                             delete_image.click();
  204.                         });
  205.                     }
  206.                     $('.progress', $(this).parent()).show();
  207.                     $('#thumb', $(this).parent()).find('div').remove();
  208.                     $('#{{ form.category_image.vars.id }}').val('');
  209.                 },
  210.                 acceptFileTypes: /(\.|\/)(gif|jpe?g|png)$/i,
  211.                 maxFileSize: 10000000,
  212.                 maxNumberOfFiles: 1,
  213.                 progressall: function(e, data) {
  214.                     var progress = parseInt(data.loaded / data.total * 100, 10);
  215.                     $('.progress .progress-bar', $(this).parent()).css(
  216.                         'width',
  217.                         progress + '%'
  218.                     );
  219.                 },
  220.                 processalways: function(e, data) {
  221.                     if (data.files.error) {
  222.                         alert("{{ 'admin.common.upload_error'|trans }}");
  223.                     }
  224.                 }
  225.             });
  227.             $('#thumb').on('click', '.delete-image', function() {
  228.                 $('#{{ form.category_image.vars.id }}').val('');
  229.                 var thumbnail = $(this).parents('div.c-form__fileUploadThumbnail');
  230.                 $(thumbnail).remove();
  231.                 hideThumbnail();
  232.             });
  234.             $(document).on('click', '.delete-image', function() {
  235.                 var thumbnail = $(this).parents('div.c-form__fileUploadThumbnail');
  236.                 $(thumbnail).remove();
  237.                 $(this).parent().find('img').remove();
  238.                 $(this).parent().find('.category-image').val('');
  239.                 $(this).hide();
  240.             });
  241.         });
  242.     </script>
  243. {% endblock %}
  245. {% block main %}
  246.     <div class="c-outsideBlock">
  247.         <div class="c-outsideBlock__contents mb-2">
  248.             <div class="row">
  249.                 <div class="col-6">
  250.                     <nav aria-label="breadcrumb" role="navigation">
  251.                         <ol class="breadcrumb mb-2 p-0">
  252.                             <li class="breadcrumb-item">
  253.                                 <a href="{{ url('admin_product_category') }}">
  254.                                     {{ 'admin.product.category_all'|trans }}
  255.                                 </a>
  256.                             </li>
  257.                             {% for ParentCategory in TargetCategory.path %}
  258.                                 {% if ParentCategory.id is not null %}
  259.                                     <li class="breadcrumb-item active" aria-current="page">
  260.                                         <a href="{{ url('admin_product_category_show', { parent_id : ParentCategory.id }) }}">
  261.                                             {{ ParentCategory.name }}
  262.                                         </a>
  263.                                     </li>
  264.                                 {% endif %}
  265.                             {% endfor %}
  266.                         </ol>
  267.                     </nav>
  268.                 </div>
  269.                 <div class="col-6 text-right">
  270.                     <div class="btn-group" role="group">
  271.                         <a class="btn btn-ec-regular" href="{{ url('admin_product_category_export') }}">
  272.                             <i class="fa fa-cloud-download mr-1 text-secondary"></i>
  273.                             <span>{{ 'admin.common.csv_download'|trans }}</span>
  274.                         </a>
  275.                         <a class="btn btn-ec-regular" href="{{ url('admin_setting_shop_csv', { id : constant('\\Eccube\\Entity\\Master\\CsvType::CSV_TYPE_CATEGORY') }) }}">
  276.                             <i class="fa fa-cog mr-1 text-secondary"></i>
  277.                             <span>{{ 'admin.setting.shop.csv_setting'|trans }}</span>
  278.                         </a>
  279.                     </div>
  280.                 </div>
  281.             </div>
  282.         </div>
  283.     </div>
  284.     <div class="c-contentsArea__cols">
  285.         <div class="c-contentsArea__primaryCol">
  286.             <div id="ex-primaryCol" class="c-primaryCol">
  287.                 <div class="card rounded border-0 mb-4">
  288.                     <div class="card-body p-0">
  289.                         <div class="card rounded border-0">
  290.                             <ul class="list-group list-group-flush sortable-container">
  291.                                 <li class="list-group-item">
  292.                                     <form role="form" name="form1" id="form1" method="post"
  293.                                           action="{% if TargetCategory.id %}{{ path('admin_product_category_edit', {id: TargetCategory.id}) }}{% elseif Parent %}{{ url('admin_product_category_show', {'parent_id': Parent.id}) }}{% else %}{{ url('admin_product_category') }}{% endif %}"
  294.                                           enctype="multipart/form-data">
  295.                                         {% if TargetCategory.hierarchy <= eccube_config.eccube_category_nest_level %}
  296.                                             {{ form_widget(form._token) }}
  297.                                             <div class="form-row mb-3">
  298.                                                 <div class="col-auto align-self-center mr-3"><span>カテゴリ名</span></div>
  299.                                                 <div class="col-7">
  300.                                                     {{ form_widget(form.name) }}
  301.                                                     {{ form_errors(form.name) }}
  302.                                                 </div>
  303.                                                 <div class="col-12 align-self-center"><span>詳細</span></div>
  304.                                                 <div class="col-12">
  305.                                                     {{ form_widget(form.free_area) }}
  306.                                                     {{ form_errors(form.free_area) }}
  307.                                                 </div>
  308.                                                 <div class="col-12 align-self-center"><span>カテゴリ画像</span></div>
  309.                                                 <div class="col-12 mb-2">
  310.                                                     <div class="progress" style="display: none;">
  311.                                                         <div class="progress-bar progress-bar-striped progress-bar-animated" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"></div>
  312.                                                     </div>
  313.                                                     <div id="thumb" class="c-form__fileUploadThumbnails clearfix"></div>
  314.                                                     <div class="upload-image"></div>
  315.                                                     {{ form_widget(form.category_image, { attr : {'class': 'category-image', style : 'display:none;' } }) }}
  316.                                                     {{ form_widget(form.category_file, { attr : {'class': 'file-upload', 'class': 'file-upload', accept : 'image/*', style : 'display:none;' } }) }}
  317.                                                     {{ form_errors(form.category_image) }}
  319.                                                     <a class="btn btn-ec-regular" onclick="$('#admin_category_category_file').click()">
  320.                                                         {{ 'admin.common.file_select'|trans }}
  321.                                                     </a>
  322.                                                 </div>
  323.                                                 <div class="col-auto">
  324.                                                     <button class="btn btn-ec-regular" type="submit">
  325.                                                         {{ 'admin.common.create__new'|trans }}
  326.                                                     </button>
  327.                                                 </div>
  328.                                             </div>
  329.                                             {# エンティティ拡張の自動出力 #}
  330.                                             {% for f in form if f.vars.eccube_form_options.auto_render %}
  331.                                                 {% if f.vars.eccube_form_options.form_theme %}
  332.                                                     {% form_theme f f.vars.eccube_form_options.form_theme %}
  333.                                                     {{ form_row(f) }}
  334.                                                 {% else %}
  335.                                                     <div class="form-row mb-3">
  336.                                                         <div class="col-3">
  337.                                                             <span>{{ f.vars.label|trans }}</span>
  338.                                                         </div>
  339.                                                         <div class="col">
  340.                                                             {{ form_widget(f) }}
  341.                                                             {{ form_errors(f) }}
  342.                                                         </div>
  343.                                                     </div>
  344.                                                 {% endif %}
  345.                                             {% endfor %}
  346.                                         {% endif %}
  347.                                     </form>
  348.                                 </li>
  349.                                 
  350.                                 
  351.                                 {% for Category in Categories %}
  352.                                     {% if Category.id == 630 or Category.id == 722 or Category.id == 730 or Category.id == 742 %}
  353.                                         <li class="list-group-item">
  354.                                             <p class="alert alert-warning">
  355.                                             ※レアリティの追加や並び替えを行う場合は、システム改修が必要となります。作業をご希望の際は、必ず事前にご連絡くださいますようお願いいたします。
  356.                                             </p>
  357.                                         </li>
  358.                                     {% endif %}
  359.                                 {% endfor %}
  360.                                 
  361.                                 <li class="list-group-item">
  362.                                     <div class="row">
  363.                                         <div class="col-auto"><strong>&nbsp;</strong></div>
  364.                                         <div class="col-auto"><strong>{{ 'admin.common.id'|trans }}</strong></div>
  365.                                         <div class="col-2"><strong>{{ 'admin.product.category'|trans }}</strong></div>
  366.                                     </div>
  367.                                 </li>
  368.                                 {% if Categories|length > 0 %}
  369.                                     {% for Category in Categories %}
  370.                                         <li id="ex-category-{{ Category.id }}" class="list-group-item sortable-item" data-id="{{ Category.id }}" data-sort-no="{{ Category.sort_no }}">
  371.                                             {% if Category.id != TargetCategory.id %}
  372.                                                 <div class="row justify-content-around mode-view">
  373.                                                     <div class="col-auto d-flex align-items-center"><i class="fa fa-bars text-ec-gray"></i></div>
  374.                                                     <div class="col-auto d-flex align-items-center">{{ Category.id }}</div>
  375.                                                     <div class="col d-flex align-items-center">
  376.                                                         <a href="{{ url('admin_product_category_show',  { parent_id : Category.id }) }}">{{ Category.name }}</a>
  377.                                                         {% if Category.category_image %}
  378.                                                             <div class="ml-5">
  379.                                                                 <img src="{{ asset(Category.category_image, 'save_image') }}" width="50px">
  380.                                                             </div>
  381.                                                         {% endif %}
  383.                                                     </div>
  384.                                                     <div class="col-auto text-right">
  385.                                                         <a class="btn btn-ec-actionIcon action-up mr-2 {% if loop.first %} disabled {% endif %}" href=""
  386.                                                            data-tooltip="true" data-placement="top"
  387.                                                            title="{{ 'admin.common.up'|trans }}">
  388.                                                             <i class="fa fa-arrow-up fa-lg text-secondary"></i>
  389.                                                         </a>
  390.                                                         <a class="btn btn-ec-actionIcon action-down mr-2 {% if loop.last %} disabled {% endif %}" href=""
  391.                                                            data-tooltip="true" data-placement="top"
  392.                                                            title="{{ 'admin.common.down'|trans }}">
  393.                                                             <i class="fa fa-arrow-down fa-lg text-secondary"></i>
  394.                                                         </a>
  395.                                                         <a class="btn btn-ec-actionIcon mr-2 action-edit"
  396.                                                            href="{{ url('admin_product_category_edit', {id: Category.id}) }}"
  397.                                                            data-tooltip="true" data-placement="top"
  398.                                                            title="{{ 'admin.common.edit'|trans }}">
  399.                                                             <i class="fa fa-pencil fa-lg text-secondary"></i>
  400.                                                         </a>
  401.                                                         <div class="d-inline-block mr-2" data-tooltip="true" data-placement="top"
  402.                                                              title="{{ 'admin.common.delete'|trans }}">
  403.                                                             <a class="btn btn-ec-actionIcon{% if Category.Children|length > 0 or Category.hasProductCategories %} disabled{% endif %}"
  404.                                                                data-bs-toggle="modal" data-bs-target="#DeleteModal"
  405.                                                                data-url="{{ url('admin_product_category_delete', {id: Category.id}) }}"
  406.                                                                data-message="{{ 'admin.common.delete_modal__message'|trans({ "%name%" : Category.name }) }}">
  407.                                                                 <i class="fa fa-close fa-lg text-secondary"></i>
  408.                                                             </a>
  409.                                                         </div>
  410.                                                         <!--<div class="d-inline-block mr-2" data-tooltip="true" data-placement="top"
  411.                                                             title="削除">
  412.                                                             <a class="btn btn-ec-actionIcon"
  413.                                                             data-bs-toggle="modal" data-bs-target="#DeleteModal"
  414.                                                             data-url="https://tcg-mana.com/management/product/category/6/delete"
  415.                                                             data-message="この操作はあとから取り消すことができません。「フルーツ」を削除してよろしいですか？">
  416.                                                                 <i class="fa fa-close fa-lg text-secondary"></i>
  417.                                                             </a>
  418.                                                         </div>-->
  419.                                                     </div>
  420.                                                 </div>
  421.                                                 <form class="form-row d-none mode-edit" method="POST" action="{{ (Parent and Parent.id) ? url('admin_product_category_show', {'parent_id': Parent.id}) : url('admin_product_category') }}" enctype="multipart/form-data">
  422.                                                     {{ form_widget(forms[Category.id]._token) }}
  423.                                                     <div class="col-auto align-self-center mr-3"><span>カテゴリ名</span></div>
  424.                                                     <div class="col-7">
  425.                                                         {{ form_widget(forms[Category.id].name, {'attr': {'data-origin-value': forms[Category.id].name.vars.value}}) }}
  426.                                                         {{ form_errors(forms[Category.id].name) }}
  427.                                                     </div>
  428.                                                     <div class="col-12 align-self-center"><span>詳細</span></div>
  429.                                                     <div class="col-12">
  430.                                                         {{ form_widget(forms[Category.id].free_area, {'attr': {'data-origin-value': forms[Category.id].free_area.vars.value}}) }}
  431.                                                         {{ form_errors(forms[Category.id].free_area) }}
  432.                                                     </div>
  433.                                                     <div class="col-12 align-self-center"><span>カテゴリ画像</span></div>
  434.                                                     <div class="col-12 mb-2">
  435.                                                         <div class="progress" style="display: none;">
  436.                                                             <div class="progress-bar progress-bar-striped progress-bar-animated" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"></div>
  437.                                                         </div>
  438.                                                         <div class="upload-image"></div>
  439.                                                         {% if forms[Category.id].category_image.vars.value %}
  440.                                                             <img src="{{ asset(forms[Category.id].category_image.vars.value, 'save_image') }}" width="150px">
  441.                                                         {% endif %}
  442.                                                         {{ form_widget(forms[Category.id].category_image, {'attr': {'class': 'category-image', 'data-origin-value': forms[Category.id].category_image.vars.value}}) }}
  443.                                                         {{ form_errors(forms[Category.id].category_image) }}
  444.                                                         {{ form_widget(forms[Category.id].category_file, { attr : { 'class': 'file-upload', accept : 'image/*', style : 'display:none;' } }) }}
  445.                                                         <a class="btn btn-ec-regular mr-2" onclick="$('#{{ forms[Category.id].category_file.vars.id }}').click()">
  446.                                                             {{ 'admin.common.file_select'|trans }}
  447.                                                         </a>
  448.                                                         <a class="btn btn-ec-regular mr-2 delete-image" {% if not forms[Category.id].category_image.vars.value %}style="display: none"{% endif %}>
  449.                                                             削除
  450.                                                         </a>
  451.                                                     </div>
  452.                                                     <div class="col-auto align-items-center">
  453.                                                         <button class="btn btn-ec-conversion" type="submit">{{ 'admin.common.decision'|trans }}</button>
  454.                                                     </div>
  455.                                                     <div class="col-auto align-items-center">
  456.                                                         <button class="btn btn-ec-sub action-edit-cancel" type="button">{{ 'admin.common.cancel'|trans }}</button>
  457.                                                     </div>
  458.                                                     {# エンティティ拡張の自動出力 #}
  459.                                                     {% for f in forms[Category.id] if f.vars.eccube_form_options.auto_render %}
  460.                                                         <div class="col-auto align-items-center" style="width:90%; padding-top: 10px;">
  461.                                                             <div class="row">
  462.                                                                 <div class="col-3">
  463.                                                                     <span>{{ f.vars.label|trans }}</span>
  464.                                                                 </div>
  465.                                                                 <div class="col-9">
  466.                                                                     {{ form_widget(f) }}
  467.                                                                     {{ form_errors(f) }}
  468.                                                                 </div>
  469.                                                             </div>
  470.                                                         </div>
  471.                                                     {% endfor %}
  472.                                                 </form>
  473.                                             {% endif %}
  474.                                         </li>
  475.                                     {% endfor %}
  476.                                 {% endif %}
  477.                             </ul>
  478.                             <!-- 削除モーダル -->
  479.                             <div class="modal fade" id="DeleteModal" tabindex="-1" role="dialog"
  480.                                  aria-labelledby="DeleteModal" aria-hidden="true">
  481.                                 <div class="modal-dialog" role="document">
  482.                                     <div class="modal-content">
  483.                                         <div class="modal-header">
  484.                                             <h5 class="modal-title font-weight-bold">
  485.                                                 {{ 'admin.common.delete_modal__title'|trans }}
  486.                                             </h5>
  487.                                             <button class="close" type="button" data-bs-dismiss="modal" aria-label="Close">
  488.                                                 <span aria-hidden="true">×</span>
  489.                                             </button>
  490.                                         </div>
  491.                                         <div class="modal-body text-left">
  492.                                             <p class="text-left modal-message"><!-- jsでメッセージを挿入 --></p>
  493.                                         </div>
  494.                                         <div class="modal-footer">
  495.                                             <button class="btn btn-ec-sub" type="button" data-bs-dismiss="modal">
  496.                                                 {{ 'admin.common.cancel'|trans }}
  497.                                             </button>
  498.                                             <a class="btn btn-ec-delete" href="#" {{ csrf_token_for_anchor() }}
  499.                                                data-method="delete" data-confirm="false">
  500.                                                 {{ 'admin.common.delete'|trans }}
  501.                                             </a>
  502.                                         </div>
  503.                                     </div>
  504.                                 </div>
  505.                             </div>
  509.                         </div>
  510.                     </div>
  511.                 </div>
  512.                 <p>{{ 'admin.common.drag_and_drop_description'|trans }}</p>
  513.             </div>
  514.         </div>
  516.         {% macro tree(Category, TargetId, level, Ids) %}
  517.             {% import _self as selfMacro %}
  518.             {% set level = level + 1 %}
  519.             <li>
  520.                 <label {% if (Category.children|length > 0) and (Category.id not in Ids) %}class="collapsed"
  521.                        {% endif %}data-toggle="collapse"
  522.                        href="#directory_category{{ Category.id }}"
  523.                        aria-expanded="{% if Category.id in Ids %}true{% endif %}"
  524.                        aria-controls="directory_category{{ Category.id }}"></label>
  525.                 <span>
  526.                     <a href="{{ url('admin_product_category_show', { parent_id : Category.id }) }}"{% if (Category.id == TargetId) %} class="font-weight-bold"{% endif %}>{{ Category.name }}
  527.                         ({{ Category.children|length }})</a></span>
  528.                 {% if Category.children|length > 0 %}
  529.                     <ul class="collapse list-unstyled {% if Category.id in Ids %}show{% endif %}"
  530.                         id="directory_category{{ Category.id }}">
  531.                         {% for ChildCategory in Category.children %}
  532.                             {{ selfMacro.tree(ChildCategory, TargetId, level, Ids) }}
  533.                         {% endfor %}
  534.                     </ul>
  535.                 {% endif %}
  536.             </li>
  537.         {% endmacro %}
  539.         <div class="c-contentsArea__secondaryCol">
  540.             <div id="ex-secondaryCol" class="c-secondaryCol">
  541.                 <div class="card rounded border-0 mb-4">
  542.                     <div class="card-header">
  543.                         <span class="card-title"><a href="{{ url('admin_product_category') }}">{{ 'admin.product.category_all'|trans }}</a></span>
  544.                     </div>
  545.                     <div class="card-body">
  546.                         <div class="c-directoryTree mb-3">
  547.                             {% import _self as renderMacro %}
  548.                             {% for TopCategory in TopCategories %}
  549.                                 <ul class="list-unstyled">
  550.                                     {{ renderMacro.tree(TopCategory, TargetCategory.Parent.id | default(null), 0, Ids) }}
  551.                                 </ul>
  552.                             {% endfor %}
  553.                         </div>
  554.                     </div>
  555.                 </div>
  556.             </div>
  557.         </div>
  558.     </div>
  559. {% endblock %}