app/template/admin/Product/product.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. {% extends '@admin/default_frame.twig' %}
  13. {% set menus = ['product', 'product_edit'] %}
  15. {% block title %}{{ 'admin.product.product_registration'|trans }}{% endblock %}
  16. {% block sub_title %}{{ 'admin.product.product_management'|trans }}{% endblock %}
  18. {% form_theme form '@admin/Form/bootstrap_4_horizontal_layout.html.twig' %}
  20. {% block stylesheet %}
  21.     {{ parent() }}
  22.     <link rel="stylesheet" href="/html/user_data/assets/css/custom_admin.css">
  23. {% endblock %}
  25. {% block javascript %}
  26.     <script>
  27.         $(document).on('drop dragover', function(e) {
  28.             e.preventDefault();
  29.         });
  31.         $(function() {
  32.             {% if has_class == false %}
  33.             if ($("#{{ form.class.stock_unlimited.vars.id }}").prop("checked")) {
  34.                 $("#{{ form.class.stock.vars.id }}").attr("disabled", "disabled").val('');
  35.             } else {
  36.                 $("#{{ form.class.stock.vars.id }}").removeAttr("disabled");
  37.             }
  38.             $("#{{ form.class.stock_unlimited.vars.id }}").on("click change", function() {
  39.                 if ($(this).prop("checked")) {
  40.                     $("#{{ form.class.stock.vars.id }}").attr("disabled", "disabled").val('');
  41.                 } else {
  42.                     $("#{{ form.class.stock.vars.id }}").removeAttr("disabled");
  43.                 }
  44.             });
  45.             {% endif %}
  47.             // ファイルアップロード
  48.             // see https://pqina.nl/filepond/
  49.             var inputFileElement = document.querySelector('input[type=file]');
  50.             {% if eccube_config.locale == 'ja' or eccube_config.locale == 'en' %}
  51.             FilePond.setOptions(FilePondLocale_{{ eccube_config.locale }});
  52.             {% endif %}
  53.             FilePond.setOptions({
  54.                 server: {
  55.                     process: {
  56.                         url: '{{ path('admin_product_image_process') }}',
  57.                         headers: {
  58.                             'ECCUBE-CSRF-TOKEN': $('meta[name="eccube-csrf-token"]').attr('content'),
  59.                             'X-Requested-With': 'XMLHttpRequest'
  60.                         }
  61.                     },
  62.                     load: {
  63.                         url: '{{ path('admin_product_image_load') }}?source=',
  64.                         headers: {
  65.                             'X-Requested-With': 'XMLHttpRequest'
  66.                         }
  67.                     },
  68.                     revert: {
  69.                         url: '{{ path('admin_product_image_revert') }}',
  70.                         headers: {
  71.                             'ECCUBE-CSRF-TOKEN': $('meta[name="eccube-csrf-token"]').attr('content'),
  72.                             'X-Requested-With': 'XMLHttpRequest'
  73.                         }
  74.                     }
  75.                 }
  76.             });
  77.             var pond = FilePond.create(inputFileElement, {
  78.                 allowFileTypeValidation: true,
  79.                 acceptedFileTypes: [
  80.                     'image/gif',
  81.                     'image/png',
  82.                     'image/jpeg'
  83.                 ],
  84.                 allowFileSizeValidation: true,
  85.                 maxFileSize: 10000000,
  86.                 maxFiles: 10,
  87.                 allowBrowse: true,
  88.                 allowDrop: true,
  89.                 allowReorder: true,
  90.                 labelIdle: '<i class="fa fa-cloud-upload fa-3x text-ec-lightGray mx-3 align-middle" aria-hidden="true" style="font-size: 40px"></i>{{ 'admin.common.drag_and_drop_image_description'|trans }}<span class="filepond--label-action">{{ 'admin.common.file_select'|trans }}</span>',
  91.                 styleItemPanelAspectRatio: 0.5625,
  92.                 // 保存されている画像のロード
  93.                 files: [
  94.                     {% for image in form.images %}
  95.                     {
  96.                         source: '{{ image.vars.value }}',
  97.                         options: {
  98.                             type: 'local'
  99.                         }
  100.                     },
  101.                     {% endfor %}
  102.                     // 追加してすぐの画像のロード. バリデーションエラーの場合など.
  103.                     {% for add_image in form.add_images %}
  104.                     {
  105.                         source: '{{ add_image.vars.value }}',
  106.                         options: {
  107.                             type: 'local'
  108.                         }
  109.                     },
  110.                     {% endfor %}
  111.                 ]
  112.             });
  113.             // 画像が追加されたら add_images にファイル名を追加する
  114.             var proto_add = '{{ form_widget(form.add_images.vars.prototype) }}';
  115.             pond.on('processfile', function(error, file) {
  116.                 if (error) {
  117.                     console.log(error);
  118.                 } else {
  119.                     $('#upload-zone').append(
  120.                         $(proto_add.replace(/__name__/g, file.id))
  121.                             .val(file.serverId)
  122.                             .addClass('add_images')
  123.                     );
  124.                 }
  125.             });
  126.             // 画像が削除されたら delete_images にファイル名を追加する
  127.             var proto_del = '{{ form_widget(form.delete_images.vars.prototype) }}';
  128.             pond.on('removefile', function(error, file) {
  129.                 if (error) {
  130.                     console.log(error);
  131.                 } else {
  132.                     // file.serverId にはアップロードしたファイル名が格納される.
  133.                     if (file.serverId) {
  134.                         $('#upload-zone').append(
  135.                             $(proto_del.replace(/__name__/g, file.id))
  136.                                 .val(file.serverId)
  137.                                 .addClass('del_images')
  138.                         );
  139.                     }
  140.                     // 追加してすぐ削除した画像があれば削除する
  141.                     $('#upload-zone').find('#admin_product_add_images_' + file.id).remove(); // 追加してすぐ削除した画像
  142.                     $('#upload-zone').find('.add_images[value="' + file.filename + '"]').remove(); // 追加後, バリデーションエラーが発生した後に削除した画像
  143.                 }
  144.             });
  145.             pond.on('initfile', function() {
  146.                 $('#product_image_error').hide();
  147.             });
  148.             pond.on('error', function(error, file) {
  149.                 var message = '{{ 'admin.common.upload_error'|trans }}';
  150.                 if (error.main !== undefined) {
  151.                     message = `${error.main}: ${error.sub}`;
  152.                 }
  153.                 $('#product_image_error')
  154.                     .show()
  155.                     .find('.form-error-message').text(message);
  157.                 // エラーメッセージが表示されてからプレビューエリアのエラーメッセージを非表示にする
  158.                 setTimeout(function() {
  159.                     $('.filepond--file-status').hide();
  160.                 }, 300);
  161.             });
  163.             // バリデーションエラーが出た場合に画像を保持するための hidden を追加しておく
  164.             var proto_image = '{{ form_widget(form.images.vars.prototype) }}';
  165.             {% for image in form.images %}
  166.                 $('#upload-zone').append(
  167.                     $(proto_image.replace(/__name__/g, '{{ loop.index0 }}'))
  168.                         .val('{{ image.vars.value }}')
  169.                         .addClass('images')
  170.                 );
  171.             {% endfor %}
  172.             {% for add_image in form.add_images %}
  173.                 $('#upload-zone').append(
  174.                     $('{{ form_widget(add_image) }}')
  175.                         .val('{{ add_image.vars.value }}')
  176.                         .addClass('add_images')
  177.                 );
  178.             {% endfor %}
  179.             {% for delete_image in form.delete_images %}
  180.                 $('#upload-zone').append(
  181.                     $('{{ form_widget(delete_image) }}').addClass('del_images')
  182.                 );
  183.             {% endfor %}
  185.             // タグ管理
  186.             var mainTags = $('#allTags');
  187.             var adminProductTag = $('#admin_product_Tag');
  188.             $('input', adminProductTag).each(function() {
  189.                 if ($(this).is(':checked')) {
  190.                     $('button[data-tag-id="' + $(this).val() + '"]').removeClass('btn-outline-secondary').addClass('btn-outline-primary');
  191.                 }
  192.             });
  193.             mainTags.on('click', 'button.btn', function() {
  194.                 var btnTag = $(this);
  195.                 var tagId = btnTag.data('tag-id');
  196.                 if (btnTag.hasClass('btn-outline-primary')) {
  197.                     btnTag.removeClass('btn-outline-primary').addClass('btn-outline-secondary');
  198.                     $('input[value="' + tagId + '"]', mainTags).prop('checked', false);
  199.                 } else {
  200.                     btnTag.removeClass('btn-outline-secondary').addClass('btn-outline-primary');
  201.                     $('input[value="' + tagId + '"]', mainTags).prop('checked', true);
  202.                 }
  203.             });
  205.             var confirmFormChange = function(form, target, modal) {
  206.                 var returnLink = form.find('input[type="hidden"][name*="return_link"]'),
  207.                     saveBtn = modal.find('a[data-action="save"]'),
  208.                     cancelBtn = modal.find('a[data-action="cancel"]');
  209.                 modal.on('hidden.bs.modal', function() {
  210.                     returnLink.val('');
  211.                 });
  212.                 saveBtn.on('click', function() {
  213.                     returnLink.val($(this).data('return-link'));
  214.                     $(this).addClass('disabled');
  215.                     form.submit();
  216.                 });
  217.                 target.on('click', function() {
  218.                     modal.find('.modal-body .screen-name').text($(this).attr('title'));
  219.                     modal.modal('show');
  220.                     saveBtn.data('return-link', $(this).attr('href'));
  221.                     cancelBtn.attr('href', $(this).attr('href'));
  222.                     return false;
  223.                 });
  224.             };
  225.             confirmFormChange($('#form1'), $('a[data-action="confirm"]'), $('#confirmFormChangeModal'))
  226.         });
  228.         // searchWordの実行
  229.         $('#search-category').on('input', function () {
  230.             searchWord($(this).val(), $('.category-li'));
  231.         });
  233.         //カテゴリ選択に連動したおすすめ度入力フィールドの表示・非表示
  234. document.addEventListener('DOMContentLoaded', function () {
  235.     // すべてのチェックボックスを取得
  236.     const categoryCheckboxes = document.querySelectorAll('input[type="checkbox"][id^="admin_product_category_"]');
  238.     // 初期状態でおすすめ度フィールドを表示・非表示
  239.     categoryCheckboxes.forEach(checkbox => {
  240.         toggleRecommendRankField(checkbox); // 初期状態を設定
  241.     });
  243.     // チェックボックスの状態が変わったらおすすめ度フィールドを切り替え
  244.     categoryCheckboxes.forEach(checkbox => {
  245.         checkbox.addEventListener('change', function () {
  246.             toggleRecommendRankField(this);
  247.         });
  248.     });
  250.     function toggleRecommendRankField(checkbox) {
  251.         const recommendRankField = document.getElementById('recommend_rank_field_' + checkbox.value);
  253.         if (recommendRankField) {
  254.             // チェック状態に応じて表示を切り替え
  255.             recommendRankField.style.display = checkbox.checked ? 'block' : 'none';
  256.             console.log(
  257.                 `Field for category ${checkbox.value} is now ${
  258.                     checkbox.checked ? 'visible' : 'hidden'
  259.                 }`
  260.             );
  261.         } else {
  262.             console.warn(`No field found for category ID: ${checkbox.value}`);
  263.         }
  264.     }
  265. });
  267.         // おすすめ度の「レアリティ」、「販売」「買い取り」を非表示
  268.         document.addEventListener('DOMContentLoaded', function() {
  269.             const recommendRankFields = document.querySelectorAll('li[id^="recommend_rank_field_"]');
  271.         
  272.             recommendRankFields.forEach(function(field) {
  273.                 const labelElement = field.querySelector('label');
  274.                 
  275.                 //「レアリティ」の非表示
  276.                 if (labelElement && labelElement.textContent.includes('レアリティ のおすすめ度')) {
  277.                     // 「レアリティ」の要素を非表示
  278.                     field.querySelector('input[type="number"]').style.display = 'none';
  279.                     labelElement.style.display = 'none';
  280.                 }
  282.                 
  283.                 //「販売」「買い取り」を非表示
  284.                 if (labelElement && labelElement.textContent.includes('販売 のおすすめ度')) {
  285.                     // 「販売」の要素を非表示
  286.                     field.querySelector('input[type="number"]').style.display = 'none';
  287.                     //labelElement.style.display = 'none';
  288.                 }
  289.                 if (labelElement && labelElement.textContent.includes('買い取り のおすすめ度')) {
  290.                     // 「買い取り」の要素を非表示
  291.                     field.querySelector('input[type="number"]').style.display = 'none';
  292.                     //labelElement.style.display = 'none';
  293.                 }
  294.                 
  295.             });
  296.         });
  297.         document.addEventListener('DOMContentLoaded', function() {
  298.             // クリック可能領域全体にイベントリスナーを追加
  299.             document.querySelectorAll('.clickable-area').forEach(function(toggle) {
  300.                 toggle.addEventListener('click', function(event) {
  301.                     // checkbox-label-wrapper内の要素がクリックされた場合はアコーディオンを操作しない
  302.                     if (event.target.closest('.checkbox-label-wrapper')) {
  303.                         return;
  304.                     }
  305.         
  306.                     var parent = this.closest('.parent-category');
  307.                     // open クラスをトグルして、子カテゴリの表示/非表示を切り替え
  308.                     parent.classList.toggle('open');
  309.         
  310.                     // アイコンの切り替え
  311.                     var icon = this.querySelector('i');
  312.                     if (parent.classList.contains('open')) {
  313.                         icon.classList.remove('fa-angle-down');
  314.                         icon.classList.add('fa-angle-up');
  315.                     } else {
  316.                         icon.classList.remove('fa-angle-up');
  317.                         icon.classList.add('fa-angle-down');
  318.                     }
  319.                 });
  320.             });
  321.         });
  322.     </script>
  323. {% endblock javascript %}
  325. {% block main %}
  326.     <!-- 移動確認モーダル-->
  327.     <div class="modal fade" id="confirmFormChangeModal" tabindex="-1" role="dialog"
  328.          aria-labelledby="confirmFormChangeModal" aria-hidden="true">
  329.         <div class="modal-dialog" role="document">
  330.             <div class="modal-content">
  331.                 <div class="modal-header">
  332.                     <h5 class="modal-title">{{ 'admin.common.move_to_confirm_title'|trans }}</h5>
  333.                     <button class="btn-close" type="button" data-bs-dismiss="modal" aria-label="Close">
  335.                     </button>
  336.                 </div>
  337.                 <div class="modal-body">
  338.                     <p class="screen-name"></p>
  339.                 </div>
  340.                 <div class="modal-footer">
  341.                     <a class="btn btn-ec-conversion" data-action="save" href="javascript:void(0)">
  342.                         {{ 'admin.common.move_to_confirm_save_and_move'|trans }}
  343.                     </a>
  344.                     <a class="btn btn-ec-sub" data-action="cancel" href="javascript:void(0)">
  345.                         {{ 'admin.common.move_to_confirm_move_only'|trans }}
  346.                     </a>
  347.                 </div>
  348.             </div>
  349.         </div>
  350.     </div>
  351.     <form role="form" name="form1" id="form1" method="post" action="" novalidate enctype="multipart/form-data">
  352.         {{ form_widget(form._token) }}
  353.         {{ form_widget(form.return_link) }}
  354.         <div class="c-contentsArea__cols">
  355.             <div class="c-contentsArea__primaryCol">
  356.                 <div class="c-primaryCol">
  357.                     <div class="card rounded border-0 mb-4">
  358.                         <div class="card-header">
  359.                             <div class="row">
  360.                                 <div class="col-8">
  361.                                     <div class="d-inline-block">
  362.                                     <span class="card-title">
  363.                                         {{ 'admin.product.product__card_title'|trans }}
  364.                                     </span>
  365.                                     </div>
  366.                                 </div>
  367.                                 <div class="col-4 text-end">
  368.                                     <a data-bs-toggle="collapse" href="#basicConfig" aria-expanded="false"
  369.                                        aria-controls="basicConfig">
  370.                                         <i class="fa fa-angle-up fa-lg"></i>
  371.                                     </a>
  372.                                 </div>
  373.                             </div>
  374.                         </div>
  375.                         <div class="collapse show ec-cardCollapse" id="basicConfig">
  376.                             <div class="card-body">
  377.                                 {% if Product.id %}
  378.                                     <div class="row">
  379.                                         <div class="col-3">
  380.                                             <div class="d-inline-block" data-bs-toggle="tooltip" data-bs-placement="top" title="{{ 'tooltip.product.product_id'|trans }}">
  381.                                                 <span>{{ 'admin.product.product_id'|trans }}</span>
  382.                                                 <i class="fa fa-question-circle fa-lg ms-1"></i>
  383.                                             </div>
  384.                                         </div>
  385.                                         <div class="col">
  386.                                             <p>{{ Product.id }}</p>
  387.                                         </div>
  388.                                     </div>
  389.                                 {% endif %}
  390.                                 <div class="row">
  391.                                     <div class="col-3">
  392.                                         <div class="d-inline-block">
  393.                                             <span>{{ 'admin.product.name'|trans }}</span>
  394.                                             <span class="badge bg-primary ms-1">
  395.                                                 {{ 'admin.common.required'|trans }}
  396.                                             </span>
  397.                                         </div>
  398.                                     </div>
  399.                                     <div class="col mb-2">
  400.                                         {{ form_widget(form.name) }}
  401.                                         {{ form_errors(form.name) }}
  402.                                     </div>
  403.                                 </div>
  404.                                 {% if has_class == false %}
  405.                                     <div class="row">
  406.                                         <div class="col-3">
  407.                                             <div class="d-inline-block" data-bs-toggle="tooltip" data-bs-placement="top" title="{{ 'tooltip.product.sale_type'|trans }}">
  408.                                                 <span>{{ 'admin.product.sale_type'|trans }}</span>
  409.                                                 <i class="fa fa-question-circle fa-lg ms-1"></i>
  410.                                                 <span class="badge bg-primary ms-1">
  411.                                                     {{ 'admin.common.required'|trans }}
  412.                                                 </span>
  413.                                             </div>
  414.                                         </div>
  415.                                         <div class="col mb-2">
  416.                                             {{ form_widget(form.class.sale_type) }}
  417.                                         </div>
  418.                                     </div>
  419.                                 {% endif %}
  420.                                 <div class="row">
  421.                                     <div class="col-3">
  422.                                         <div class="d-inline-block" data-bs-toggle="tooltip" data-bs-placement="top" title="{{ 'tooltip.product.image'|trans }}">
  423.                                             <span>{{ 'admin.product.image'|trans }}</span>
  424.                                             <i class="fa fa-question-circle fa-lg ms-1"></i>
  425.                                             <br>{{ 'admin.product.image_size'|trans }}
  426.                                         </div>
  427.                                     </div>
  428.                                     <div class="col mb-2">
  429.                                         <p id="message"></p>
  430.                                         <div id="upload-zone" class="rounded">
  431.                                             {{ form_widget(form.product_image, { attr : { style : 'display:none;' } }) }}
  432.                                             {{ form_errors(form.product_image) }}
  433.                                         </div><!-- /#upload-zone -->
  434.                                         <span class="invalid-feedback" id="product_image_error" style="display: none">
  435.                                             <span class="d-block">
  436.                                                 <span class="form-error-icon badge bg-danger text-uppercase">{{ 'Error'|trans({}, 'validators') }}</span>
  437.                                                 <span class="form-error-message"></span>
  438.                                             </span>
  439.                                         </span>
  440.                                     </div>
  441.                                 </div>
  442.                                 <div class="row">
  443.                                     <div class="col-3">
  444.                                         <div class="d-inline-block" data-bs-toggle="tooltip" data-bs-placement="top"
  445.                                              title="{{ 'tooltip.product.description_detail'|trans }}">
  446.                                             <span>{{ 'admin.product.description_detail'|trans }}</span>
  447.                                             <i class="fa fa-question-circle fa-lg ms-1"></i>
  448.                                         </div>
  449.                                     </div>
  450.                                     <div class="col">
  451.                                         {{ form_widget(form.description_detail, { attr : { rows : "8"} }) }}
  452.                                         {{ form_errors(form.description_detail) }}
  453.                                         <div class="d-inline-block mb-2" data-bs-toggle="collapse" href="#addComment"
  454.                                              role="button" aria-expanded="false" aria-controls="addComment">
  455.                                             <a>
  456.                                                 <i class="fa fa-plus-square-o fw-bold me-1"></i>
  457.                                                 <span class="fw-bold text-ec-black">
  458.                                                     {{ 'admin.product.description_list__add'|trans }}
  459.                                                 </span>
  460.                                             </a>
  461.                                         </div>
  462.                                     </div>
  463.                                 </div>
  464.                                 <div class="collapse ec-collapse" id="addComment">
  465.                                     <div class="row bg-ec-formGray pt-3 mb-2">
  466.                                         <div class="col-3">
  467.                                             <div class="d-inline-block" data-bs-toggle="tooltip" data-bs-placement="top"
  468.                                                  title="{{ 'tooltip.product.description_list'|trans }}">
  469.                                                 <span>{{ 'admin.product.description_list'|trans }}</span>
  470.                                                 <i class="fa fa-question-circle fa-lg ms-1"></i>
  471.                                             </div>
  472.                                         </div>
  473.                                         <div class="col mb-4">
  474.                                             <div>
  475.                                                 {{ form_widget(form.description_list, { attr : { rows : "4"} }) }}
  476.                                                 {{ form_errors(form.description_list) }}
  477.                                             </div>
  478.                                         </div>
  479.                                     </div>
  480.                                 </div>
  481.                                 {% if has_class == false %}
  482.                                     <div class="row">
  483.                                         <div class="col-3">
  484.                                             <div class="d-inline-block">
  485.                                                 <span>{{ 'admin.product.sale_price'|trans }}</span>
  486.                                                 <span class="badge bg-primary ms-1">
  487.                                                     {{ 'admin.common.required'|trans }}
  488.                                                 </span>
  489.                                             </div>
  490.                                         </div>
  491.                                         <div class="col mb-2">
  492.                                             <div>
  493.                                                 {{ form_widget(form.class.price02) }}
  494.                                                 {{ form_errors(form.class.price02) }}
  495.                                             </div>
  496.                                         </div>
  497.                                     </div>
  498.                                     <div class="row">
  499.                                         <div class="col-3">
  500.                                             <div class="d-inline-block" data-bs-toggle="tooltip" data-bs-placement="top"
  501.                                                  title="{{ 'tooltip.product.normal_price'|trans }}">
  502.                                                 <span>{{ 'admin.product.normal_price'|trans }}</span>
  503.                                                 <i class="fa fa-question-circle fa-lg ms-1"></i>
  504.                                             </div>
  505.                                         </div>
  506.                                         <div class="col mb-2">
  507.                                             <div>
  508.                                                 {{ form_widget(form.class.price01) }}
  509.                                                 {{ form_errors(form.class.price01) }}
  510.                                             </div>
  511.                                         </div>
  512.                                     </div>
  513.                                     <div class="row">
  514.                                         <div class="col-3">
  515.                                             <div class="d-inline-block">
  516.                                                 <span>{{ 'admin.product.stock'|trans }}</span>
  517.                                                 <span class="badge bg-primary ms-1">
  518.                                                     {{ 'admin.common.required'|trans }}
  519.                                                 </span>
  520.                                             </div>
  521.                                         </div>
  522.                                         <div class="col">
  523.                                             <div>
  524.                                                 {{ form_widget(form.class.stock) }}
  525.                                                 {{ form_errors(form.class.stock) }}
  526.                                                 {# TODO: form_layoutの調整 #}
  527.                                                 {#<div class="form-check mb-2">#}
  528.                                                 {#<input class="form-check-input"#}
  529.                                                 {#id="{{ form.class.stock_unlimited.vars.id }}"#}
  530.                                                 {#name="{{ form.class.stock_unlimited.vars.full_name }}"#}
  531.                                                 {#type="checkbox"#}
  532.                                                 {#value="{{ form.class.stock_unlimited.vars.value }}">#}
  533.                                                 {#<label class="form-check-label"#}
  534.                                                 {#for="{{ form.class.stock_unlimited.vars.id }}">#}
  535.                                                 {#{{ 'admin.product.product.stock_unlimited'|trans }}#}
  536.                                                 {#</label>#}
  537.                                                 {#</div>#}
  538.                                                 {{ form_widget(form.class.stock_unlimited) }}
  539.                                                 {{ form_errors(form.class.stock_unlimited) }}
  540.                                             </div>
  541.                                         </div>
  542.                                     </div>
  543.                                 {% endif %}
  544.                                 <div class="row">
  545.                                     <div class="col-3">
  546.                                         <div class="d-inline-block" data-bs-toggle="tooltip" data-bs-placement="top"
  547.                                              title="{{ 'tooltip.product.search_word'|trans }}">
  548.                                             <span>{{ 'admin.product.search_word'|trans }}</span>
  549.                                             <i class="fa fa-question-circle fa-lg ms-1"></i>
  550.                                         </div>
  551.                                     </div>
  552.                                     <div class="col mb-2">
  553.                                         <div>
  554.                                             {{ form_widget(form.search_word) }}
  555.                                             {{ form_errors(form.search_word) }}
  556.                                         </div>
  557.                                     </div>
  558.                                 </div>
  560.                                 {% if has_class == false %}
  561.                                     <div class="row">
  562.                                         <div class="col-3">
  563.                                             <div class="d-inline-block" data-bs-toggle="tooltip" data-bs-placement="top"
  564.                                                  title="{{ 'tooltip.product.product_code'|trans }}">
  565.                                                 <span>{{ 'admin.product.product_code'|trans }}</span>
  566.                                                 <i class="fa fa-question-circle fa-lg ms-1"></i>
  567.                                             </div>
  568.                                         </div>
  569.                                         <div class="col mb-2">
  570.                                             <div>
  571.                                                 {{ form_widget(form.class.code) }}
  572.                                                 {{ form_errors(form.class.code) }}
  573.                                             </div>
  574.                                         </div>
  575.                                     </div>
  576.                                     <div class="row">
  577.                                         <div class="col-3">
  578.                                             <div class="d-inline-block" data-bs-toggle="tooltip" data-bs-placement="top"
  579.                                                  title="{{ 'tooltip.product.sale_limit'|trans }}">
  580.                                                 <span>{{ 'admin.product.sale_limit'|trans }}</span>
  581.                                                 <i class="fa fa-question-circle fa-lg ms-1"></i>
  582.                                             </div>
  583.                                         </div>
  584.                                         <div class="col mb-2">
  585.                                             <div>
  586.                                                 {{ form_widget(form.class.sale_limit) }}
  587.                                                 {{ form_errors(form.class.sale_limit) }}
  588.                                             </div>
  589.                                         </div>
  590.                                     </div>
  591.                                     <div class="row">
  592.                                         <div class="col-3">
  593.                                             <div class="d-inline-block" data-bs-toggle="tooltip" data-bs-placement="top"
  594.                                                  title="{{ 'tooltip.product.delivery_duration'|trans }}">
  595.                                                 <span>{{ 'admin.product.delivery_duration'|trans }}</span>
  596.                                                 <i class="fa fa-question-circle fa-lg ms-1"></i>
  597.                                             </div>
  598.                                         </div>
  599.                                         <div class="col mb-2">
  600.                                             <div>
  601.                                                 {{ form_widget(form.class.delivery_duration) }}
  602.                                                 {{ form_errors(form.class.delivery_duration) }}
  603.                                             </div>
  604.                                         </div>
  605.                                     </div>
  607.                                     {% if BaseInfo.option_product_delivery_fee %}
  608.                                         <div class="row">
  609.                                             <div class="col-3">
  610.                                                 <div class="d-inline-block">
  611.                                                     <span>{{ 'admin.product.delivery_fee'|trans }}</span>
  612.                                                 </div>
  613.                                             </div>
  614.                                             <div class="col mb-2">
  615.                                                 <div>
  616.                                                     {{ form_widget(form.class.delivery_fee) }}
  617.                                                     {{ form_errors(form.class.delivery_fee) }}
  618.                                                 </div>
  619.                                             </div>
  620.                                         </div>
  621.                                     {% endif %}
  622.                                     {% if BaseInfo.option_product_tax_rule %}
  623.                                         <div class="row">
  624.                                             <div class="col-3">
  625.                                                 <div class="d-inline-block">
  626.                                                     <span>{{ 'admin.product.tax_rate'|trans }}</span>
  627.                                                 </div>
  628.                                             </div>
  629.                                             <div class="col mb-2">
  630.                                                 <div>
  631.                                                     {{ form_widget(form.class.tax_rate) }}
  632.                                                     {{ form_errors(form.class.tax_rate) }}
  633.                                                 </div>
  634.                                             </div>
  635.                                         </div>
  636.                                     {% endif %}
  637.                                 {% endif %}
  639.                                 {# エンティティ拡張の自動出力 #}
  640.                                 {% for f in form|filter(f => f.vars.eccube_form_options.auto_render) %}
  641.                                     {% if f.vars.eccube_form_options.form_theme %}
  642.                                         {% form_theme f f.vars.eccube_form_options.form_theme %}
  643.                                         {{ form_row(f) }}
  644.                                     {% else %}
  645.                                         <div class="row">
  646.                                             <div class="col-3">
  647.                                                 <span>{{ f.vars.label|trans }}</span>
  648.                                             </div>
  649.                                             <div class="col mb-2">
  650.                                                 <div>
  651.                                                     {{ form_widget(f) }}
  652.                                                     {{ form_errors(f) }}
  653.                                                 </div>
  654.                                             </div>
  655.                                         </div>
  656.                                     {% endif %}
  657.                                 {% endfor %}
  659.                                 {% if has_class == false %}
  660.                                     {% for f in form.class|filter(f => f.vars.eccube_form_options.auto_render) %}
  661.                                         {% if f.vars.eccube_form_options.form_theme %}
  662.                                             {% form_theme f f.vars.eccube_form_options.form_theme %}
  663.                                             {{ form_row(f) }}
  664.                                         {% else %}
  665.                                             <div class="row">
  666.                                                 <div class="col-3">
  667.                                                     <span>{{ f.vars.label|trans }}</span>
  668.                                                 </div>
  669.                                                 <div class="col mb-2">
  670.                                                     <div>
  671.                                                         {{ form_widget(f) }}
  672.                                                         {{ form_errors(f) }}
  673.                                                     </div>
  674.                                                 </div>
  675.                                             </div>
  676.                                         {% endif %}
  677.                                     {% endfor %}
  678.                                 {% endif %}
  680.                             </div>
  681.                         </div>
  682.                     </div>
  683.                     {% if id is not null %}
  684.                         <div class="card rounded border-0 mb-4">
  685.                             <div class="card-header">
  686.                                 <div class="row">
  687.                                     <div class="col-8">
  688.                                         <div class="d-inline-block" data-bs-toggle="tooltip" data-bs-placement="top"
  689.                                              title="{{ 'tooltip.product.product_class'|trans }}">
  690.                                         <span class="card-title">
  691.                                             {{ 'admin.product.product_class__card_title'|trans }}
  692.                                             <i class="fa fa-question-circle fa-lg ms-1"></i>
  693.                                         </span>
  694.                                         </div>
  695.                                     </div>
  696.                                     <div class="col-4 text-end">
  697.                                         <a data-bs-toggle="collapse" href="#standardConfig" aria-expanded="false"
  698.                                            aria-controls="standardConfig">
  699.                                             <i class="fa fa-angle-up fa-lg"></i>
  700.                                         </a>
  701.                                     </div>
  702.                                 </div>
  703.                             </div>
  704.                             <div class="collapse show ec-cardCollapse" id="standardConfig">
  705.                                 <div class="card-body">
  706.                                     {% if has_class == true %}
  707.                                         <table class="table table-striped">
  708.                                             <thead class="table-active">
  709.                                             <th class="ps-3 pt-2 pb-2">{{ 'admin.product.class_category1__short'|trans }}</th>
  710.                                             <th class="pt-2 pb-2">{{ 'admin.product.class_category2__short'|trans }}</th>
  711.                                             <th class="pt-2 pb-2">{{ 'admin.product.product_code__short'|trans }}</th>
  712.                                             <th class="pt-2 pb-2">{{ 'admin.product.stock'|trans }}</th>
  713.                                             <th class="pe-3 pt-2 pb-2">{{ 'admin.product.price'|trans }}</th>
  714.                                             </thead>
  715.                                             <tbody>
  716.                                             {% for Class in Product.ProductClasses %}
  717.                                                 {% if Class.visible == 1 %}
  718.                                                     <tr>
  719.                                                         <td class="ps-3">{% if Class.hasClassCategory1 %}{{ Class.ClassCategory1.name }}{% endif %}</td>
  720.                                                         <td>{% if Class.hasClassCategory2 %}{{ Class.ClassCategory2.name }}{% endif %}</td>
  721.                                                         <td>{{ Class.code }}</td>
  722.                                                         <td>{% if Class.stock_unlimited %}{{ 'admin.product.stock_unlimited__short'|trans }}{% else %}{{ Class.stock }}{% endif %}</td>
  723.                                                         <td class="pe-3">{{ Class.price02|price }}</td>
  724.                                                     </tr>
  725.                                                 {% endif %}
  726.                                             {% endfor %}
  727.                                             </tbody>
  728.                                         </table>
  729.                                     {% endif %}
  731.                                     <div class="d-block text-center text-center">
  732.                                         <a href="{{ path('admin_product_product_class', { 'id' : id }) }}" class="btn btn-ec-regular" data-action="confirm"
  733.                                            title="{{ 'admin.common.move_to_confirm_message'|trans({
  734.                                                '%name%' : 'admin.product.product_class_registration'|trans
  735.                                            }) }}">{{ 'admin.product.product_class__confirm_of_product'|trans }}</a>
  736.                                     </div>
  737.                                 </div>
  738.                             </div>
  739.                         </div>
  740.                     {% endif %}
  741.                     <div class="card rounded border-0 mb-4">
  742.                         <div class="card-header">
  743.                             <div class="row">
  744.                                 <div class="col-8">
  745.                                     <div class="d-inline-block" data-bs-toggle="tooltip" data-bs-placement="top"
  746.                                          title="{{ 'tooltip.product.free_area'|trans }}">
  747.                                         <span class="card-title">{{ 'admin.product.free_area__card_title'|trans }}</span>
  748.                                         <i class="fa fa-question-circle fa-lg ms-1"></i>
  749.                                     </div>
  750.                                 </div>
  751.                                 <div class="col-4 text-end">
  752.                                     <a data-bs-toggle="collapse" href="#freeArea" aria-expanded="false"
  753.                                        aria-controls="freeArea">
  754.                                         <i class="fa fa-angle-up fa-lg"></i>
  755.                                     </a>
  756.                                 </div>
  757.                             </div>
  758.                         </div>
  759.                         <div class="collapse show ec-cardCollapse" id="freeArea">
  760.                             <div class="card-body">
  761.                                 <div class="row">
  762.                                     <div class="col-3">
  763.                                         <span>{{ 'admin.product.free_area'|trans }}</span>
  764.                                     </div>
  765.                                     <div class="col-9">
  766.                                         <div>
  767.                                             {{ form_widget(form.free_area, {id: 'wysiwyg-area', attr : { rows : "8"} }) }}
  768.                                             {{ form_errors(form.free_area) }}
  769.                                         </div>
  770.                                     </div>
  771.                                 </div>
  772.                             </div>
  773.                         </div>
  775.                     </div>
  776.                 </div>
  777.             </div>
  778.             <div class="c-contentsArea__secondaryCol">
  779.                 <div class="c-secondaryCol">
  780.                     {% if id is not null %}
  781.                         <div class="card rounded border-0 mb-4">
  782.                             <div class="collapse show ec-cardCollapse" id="preview">
  783.                                 <div class="card-body">
  784.                                     <div class="d-block text-center">
  785.                                         <a class="btn w-100 btn-ec-regular"
  786.                                            target="_blank"
  787.                                            href="{{ url('product_detail', {id:id}) }}"
  788.                                            title="{{ 'admin.product.preview'|trans }}">{{ 'admin.product.preview'|trans }}</a>
  789.                                     </div>
  790.                                 </div>
  791.                             </div>
  792.                         </div>
  793.                     {% endif %}
  794.                     <div class="card rounded border-0 mb-4">
  795.                         <div class="card-header">
  796.                             <div class="row">
  797.                                 <div class="col-8">
  798.                                     <div class="d-inline-block">
  799.                                         <span class="card-title">{{ 'admin.product.category__product_card_title'|trans }}</span>
  800.                                     </div>
  801.                                 </div>
  802.                                 <div class="col-4 text-end">
  803.                                     <a data-bs-toggle="collapse" href="#category" aria-expanded="false" aria-controls="category">
  804.                                         <i class="fa fa-angle-up fa-lg"></i>
  805.                                     </a>
  806.                                 </div>
  807.                             </div>
  808.                         </div>
  809.                         <div class="collapse show ec-cardCollapse" id="category">
  810.                             <div class="card-body">
  811.                                 <div class="c-directoryTree--register rounded border mb-3 p-3">
  812.                                     {% macro tree(ChoicedIds, Category, form) %}
  813.                                         {% import _self as selfMacro %}
  814.                                         <li class="parent-category">
  815.                                             <div class="category-content clickable-area" data-category-id="{{ Category.id }}">
  816.                                                 <div class="checkbox-label-wrapper">
  817.                                                     <input type="checkbox" id="admin_product_category_{{ Category.id }}" name="admin_product[Category][]" value="{{ Category.id }}" {% if Category.id in ChoicedIds %}checked{% endif %}>
  818.                                                     <label for="admin_product_category_{{ Category.id }}">{{ Category.name }}</label>
  819.                                                 </div>
  820.                                                 {% if Category.children|length > 0 %}
  821.                                                     <span class="toggle-category" data-category-id="{{ Category.id }}">
  822.                                                         <i class="fa fa-angle-down fa-lg"></i>
  823.                                                     </span>
  824.                                                 {% endif %}
  825.                                             </div>
  826.                                             {% if Category.children|length > 0 %}
  827.                                                 <ul class="list-unstyled child-categories">
  828.                                                     {% for childCategory in Category.children %}
  829.                                                         {{ selfMacro.tree(ChoicedIds, childCategory, form) }}
  830.                                                     {% endfor %}
  831.                                                 </ul>
  832.                                             {% endif %}
  833.                                         </li>
  834.                                     {% endmacro %}
  835.                                     {% import _self as renderMacro %}
  836.                                     <ul class="list-unstyled">
  837.                                         {% for TopCategory in TopCategories %}
  838.                                             {{ renderMacro.tree(ChoicedCategoryIds, TopCategory, form.Category) }}
  839.                                         {% endfor %}
  840.                                     </ul>
  841.                                     {{ form_errors(form.Category) }}
  842.                                 </div>
  843.                             </div>
  844.                         </div>
  845.                     </div>
  846.                     <div class="card rounded border-0 mb-4">
  847.                         <div class="card-header">
  848.                             <div class="row">
  849.                                 <div class="col-8">
  850.                                     <span class="card-title">カテゴリごとのおすすめ度設定</span>
  851.                                 </div>
  852.                                 <div class="col-4 text-end">
  853.                                     <a data-bs-toggle="collapse" href="#recommend_rank" aria-expanded="false" aria-controls="recommend_rank">
  854.                                         <i class="fa fa-angle-up fa-lg"></i>
  855.                                     </a>
  856.                                 </div>
  857.                             </div>
  858.                         </div>
  859.                         <div class="collapse show ec-cardCollapse" id="recommend_rank">
  860.                             <div class="card-body">
  861.                                 <p class="text-muted">※数字が大きい順にソートされます</p>
  862.                                 <ul id="recommend_rank_fields" class="list-unstyled">
  863.                                     {% macro renderRecommendRank(ChoicedIds, Category, ranks) %}
  864.                                         {% set category_id = Category.id %}
  865.                                         <li id="recommend_rank_field_{{ category_id }}" style="display: none;">
  866.                                             <label>
  867.                                             {% if category_id == 428 or category_id == 217 %}
  868.                                             <strong>■ {{ Category.name }} のおすすめ度</strong>
  869.                                             {% else %}
  870.                                             <a href="/products/list?category_id={{ category_id }}" target="_blank">{{ Category.name }}</a> のおすすめ度
  871.                                             {% endif %}
  872.                                             </label>
  873.                                             <input type="number" name="recommend_rank_{{ category_id }}" class="form-control"
  874.                                                    placeholder="0～100範囲で設定"
  875.                                                    value="{{ ranks[category_id] | default('') }}">
  876.                                             {% if Category.children|length > 0 %}
  877.                                                 <ul class="list-unstyled ms-3">
  878.                                                     {% for childCategory in Category.children %}
  879.                                                         {{ _self.renderRecommendRank(ChoicedIds, childCategory, ranks) }}
  880.                                                     {% endfor %}
  881.                                                 </ul>
  882.                                             {% endif %}
  883.                                         </li>
  884.                                         {% endmacro %}
  886.                                     {% import _self as renderMacro %}
  887.                                     {% for TopCategory in TopCategories %}
  888.                                         <ul class="list-unstyled">
  889.                                             {{ renderMacro.renderRecommendRank(ChoicedCategoryIds, TopCategory, recommendRanks) }}
  890.                                         </ul>
  891.                                     {% endfor %}
  892.                                 </ul>
  893.                                 
  894.                             </div>
  895.                         </div>
  896.                     </div>
  897.                     <div class="card rounded border-0 mb-4">
  898.                         <div class="card-header">
  899.                             <div class="row">
  900.                                 <div class="col-8">
  901.                                     <div class="d-inline-block">
  902.                                         <span class="card-title">
  903.                                             {{ 'admin.product.tag__product_card_title'|trans }}
  904.                                         </span>
  905.                                     </div>
  906.                                 </div>
  907.                                 <div class="col-4 text-end">
  908.                                     <a data-bs-toggle="collapse" href="#tag" aria-expanded="false" aria-controls="tag">
  909.                                         <i class="fa fa-angle-up fa-lg"></i>
  910.                                     </a>
  911.                                 </div>
  912.                             </div>
  913.                         </div>
  915.                         <div class="collapse show ec-cardCollapse" id="tag">
  916.                             <div class="card-body">
  917.                                 {% if(Tags|length > 0) %}
  918.                                     {% for Tag in Tags %}
  919.                                         <div class="d-inline-block mb-2 me-2">
  920.                                             <button class="btn btn-outline-primary" type="button">{{ Tag.name }}</button>
  921.                                         </div>
  922.                                     {% endfor %}
  923.                                 {% endif %}
  925.                                 <div class="d-block mb-3" data-bs-toggle="collapse" href="#allTags" role="button"
  926.                                      aria-expanded="false" aria-controls="allTags">
  927.                                     <a>
  928.                                         <i class="fa fa-plus-square-o fw-bold me-1"></i>
  929.                                         <span class="fw-bold">{{ 'admin.product.save_tag'|trans }}</span>
  930.                                     </a>
  931.                                 </div>
  932.                                 <div class="collapse p-3 bg-ec-lightGray mb-3 ec-collapse" id="allTags">
  933.                                     <div class="d-none">
  934.                                         {{ form_widget(form.Tag) }}
  935.                                     </div>
  936.                                     {% if(TagsList|length > 0) %}
  937.                                         {% for Tag in TagsList %}
  938.                                             <div class="d-inline-block mb-2 me-2">
  939.                                                 <button class="btn btn-outline-secondary" type="button"
  940.                                                         data-tag-id="{{ Tag.id }}">{{ Tag.name }}</button>
  941.                                             </div>
  942.                                         {% endfor %}
  943.                                     {% endif %}
  945.                                     <div class="d-block mb-3" data-bs-toggle="collapse" href="#allTags" role="button"
  946.                                          aria-expanded="false" aria-controls="allTags"></div>
  947.                                 </div>
  949.                                 <div class="d-block text-center">
  950.                                     <a href="{{ path('admin_product_tag') }}"
  951.                                        class="btn w-100 btn-ec-regular"
  952.                                        data-action="confirm"
  953.                                        title="{{ 'admin.common.move_to_confirm_message'|trans({
  954.                                            '%name%' : 'admin.product.tag_management'|trans }) }}">{{ 'admin.product.move_to_tag'|trans }}</a>
  955.                                 </div>
  956.                             </div>
  957.                         </div>
  958.                     </div>
  959.                     <div class="card rounded border-0 mb-4">
  960.                         <div class="card-header">
  961.                             <div class="row">
  962.                                 <div class="col-8">
  963.                                     <span class="card-title">{{ 'admin.product.create_date__card_title'|trans }}</span>
  964.                                 </div>
  965.                                 <div class="col-4 text-end">
  966.                                     <a data-bs-toggle="collapse" href="#update" aria-expanded="false"
  967.                                        aria-controls="update">
  968.                                         <i class="fa fa-angle-up fa-lg"></i>
  969.                                     </a>
  970.                                 </div>
  971.                             </div>
  972.                         </div>
  973.                         <div class="collapse show ec-cardCollapse" id="update">
  974.                             <div class="card-body">
  975.                                 <div class="row mb-2">
  976.                                     <div class="col">
  977.                                         <i class="fa fa-flag me-1"></i>
  978.                                         <span>{{ 'admin.common.create_date'|trans }}</span>
  979.                                     </div>
  980.                                     <div class="col">
  981.                                         <span>：{{ Product.create_date|date_min }}</span>
  982.                                     </div>
  983.                                 </div>
  984.                                 <div class="row mb-2">
  985.                                     <div class="col">
  986.                                         <i class="fa fa-refresh me-1"></i>
  987.                                         <span>{{ 'admin.common.update_date'|trans }}</span>
  988.                                     </div>
  989.                                     <div class="col">
  990.                                         <span>：{{ Product.update_date|date_min }}</span>
  991.                                     </div>
  992.                                 </div>
  993.                                 <div class="row mb-2">
  994.                                     <div class="col">
  995.                                         <i class="fa fa-user me-1"></i>
  996.                                         <span>{{ 'admin.common.last_updater'|trans }}</span>
  997.                                     </div>
  998.                                     <div class="col">
  999.                                         <span>：{{ Product.Creator ? Product.Creator.name }}</span>
  1000.                                     </div>
  1001.                                 </div>
  1002.                             </div>
  1003.                         </div>
  1004.                     </div>
  1005.                     <div class="card rounded border-0 mb-4">
  1006.                         <div class="card-header">
  1007.                             <div class="row">
  1008.                                 <div class="col-8">
  1009.                                     <div class="d-inline-block" data-bs-toggle="tooltip" data-bs-placement="top"
  1010.                                          title="{{ 'tooltip.product.shop_memo'|trans }}">
  1011.                                         <span class="card-title">
  1012.                                             {{ 'admin.common.shop_memo'|trans }}
  1013.                                             <i class="fa fa-question-circle fa-lg ms-1"></i>
  1014.                                         </span>
  1015.                                     </div>
  1016.                                 </div>
  1017.                                 <div class="col-4 text-end">
  1018.                                     <a data-bs-toggle="collapse" href="#shopMemo" aria-expanded="false"
  1019.                                        aria-controls="shopMemo">
  1020.                                         <i class="fa fa-angle-up fa-lg"></i>
  1021.                                     </a>
  1022.                                 </div>
  1023.                             </div>
  1024.                         </div>
  1025.                         <div class="collapse show ec-cardCollapse" id="shopMemo">
  1026.                             <div class="card-body">
  1027.                                 {{ form_widget(form.note, { attr : { rows : "8"} }) }}
  1028.                                 {{ form_errors(form.note) }}
  1029.                             </div>
  1030.                         </div>
  1031.                     </div>
  1032.                 </div>
  1033.             </div>
  1034.         </div>
  1035.         <div class="c-conversionArea">
  1036.             <div class="c-conversionArea__container">
  1037.                 <div class="row justify-content-between align-items-center">
  1038.                     <div class="col-6">
  1039.                         <div class="c-conversionArea__leftBlockItem">
  1040.                             <a class="c-baseLink" href="{{ path('admin_product_page', { page_no : app.session.get('eccube.admin.product.search.page_no')|default('1') } ) }}"
  1041.                                data-action="confirm" title="{{ 'admin.common.move_to_confirm_message'|trans({'%name%' : 'admin.product.product_list'|trans }) }}">
  1042.                                 <i class="fa fa-backward" aria-hidden="true"></i><span>{{ 'admin.product.product_list'|trans }}</span>
  1043.                             </a>
  1044.                         </div>
  1045.                     </div>
  1046.                     <div class="col-6">
  1047.                         <div id="ex-conversion-action" class="row align-items-center justify-content-end">
  1048.                             <div class="col-auto">
  1049.                                 {{ form_widget(form.Status) }}
  1050.                                 {{ form_errors(form.Status) }}
  1051.                             </div>
  1052.                             <div class="col-auto">
  1053.                                 <button class="btn btn-ec-conversion px-5" type="submit">{{ 'admin.common.registration'|trans }}</button>
  1054.                             </div>
  1055.                         </div>
  1056.                     </div>
  1057.                 </div>
  1058.             </div>
  1059.         </div>
  1060.     </form>
  1061. {% endblock %}