app/template/default/Block/new_item.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. {% block stylesheet %}
  12.     <style>
  13.         .stamps-listItem {
  14.          margin: 10px 0;
  15.         }
  16.         .stamps-top-buttons {
  17.           width: 100%;
  18.         }
  19.         .ec-newItemRole .ec-newItemRole__listItemTitle {
  20.             font-size: 20px;
  21.         }
  22.         .ec-newItemRole .ec-newItemRole__listItemPrice{
  23.             font-size: 20px;
  24.         }
  25.     </style>
  26. {% endblock %}
  28. {% block javascript %}
  29.     <script>
  30.         $(function() {
  32.             $('.add-cart').on('click', function(e) {
  33.                 var $form = $(this).parent();
  35.                 // 個数チェック
  36.                 var $quantity = $form.children().find('.quantity');
  37.                 if ($quantity.val() < 1) {
  38.                     $quantity[0].setCustomValidity('{{ 'front.product.invalid_quantity'|trans }}');
  39.                     setTimeout(function() {
  40.                         loadingOverlay('hide');
  41.                     }, 100);
  42.                     return true;
  43.                 } else {
  44.                     $quantity[0].setCustomValidity('');
  45.                 }
  46.                 e.preventDefault();
  47.                 $.ajax({
  48.                     url: $form.attr('action'),
  49.                     type: $form.attr('method'),
  50.                     data: $form.serialize(),
  51.                     dataType: 'json',
  52.                     beforeSend: function(xhr, settings) {
  53.                         // Buttonを無効にする
  54.                         $('.add-cart').prop('disabled', true);
  55.                     }
  56.                 }).done(function(data) {
  57.                     // レスポンス内のメッセージをalertで表示
  58.                     $.each(data.messages, function() {
  59.                         $('#ec-modal-header').html(this);
  60.                     });
  62.                     $('#ec-modal-checkbox').prop('checked', true);
  64.                     // カートブロックを更新する
  65.                     $.ajax({
  66.                         url: '{{ url('block_cart') }}',
  67.                         type: 'GET',
  68.                         dataType: 'html'
  69.                     }).done(function(html) {
  70.                         $('.ec-headerRole__cart').html(html);
  71.                     });
  72.                 }).fail(function(data) {
  73.                     alert('{{ 'front.product.add_cart_error'|trans }}');
  74.                 }).always(function(data) {
  75.                     // Buttonを有効にする
  76.                     $('.add-cart').prop('disabled', false);
  77.                 });
  78.             });
  79.         });
  80.     </script>
  81. {% endblock %}
  83. <div class="ec-role">
  84.   <div class="ec-newItemRole">
  85.     <div class="ec-newItemRole__list">
  86.       <div class="row">
  87.         <div class="col-12">
  88.           <div class="row">
  89.             {% for Product in products %}
  90.             <div class="col-xs-12 col-md-6 stamps-listItem">
  91.               {# 商品画像 #}
  92.               <a href="{{ url('product_detail', {'id': Product.id}) }}">
  93.                 <img src="{{ asset(Product.main_list_image|no_image_product, 'save_image') }}">
  94.               </a>
  95.               {# 商品名 #}
  96.               <a href="{{ url('product_detail', {'id': Product.id}) }}">
  97.                 <p class="ec-newItemRole__listItemTitle">{{ Product.name }}</p>
  98.               </a>
  99.               {# 商品価格 #}
  100.               <p class="ec-newItemRole__listItemPrice">
  101.                 {% if Product.hasProductClass %} 
  102.                   {% if Product.getPrice02Min == Product.getPrice02Max %}
  103.                     {{ Product.getPrice02IncTaxMin|price }}
  104.                   {% else %}
  105.                     {{ Product.getPrice02IncTaxMin|price }} ～ {{ Product.getPrice02IncTaxMax|price }}
  106.                  {% endif %}
  107.                  {% else %}
  108.                    {{ Product.getPrice02IncTaxMin|price }}
  109.                 {% endif %}
  110.               </p>
  112.               <div class="row">
  113.                 <div class="col-lg-6">
  115.                  {# カート投入ボタン #}
  116.                  {% set form = forms[Product.id] %}
  117.                  <form name="form{{ Product.id }}" id="productForm{{ Product.id }}" action="{{ url('product_add_cart', {id:Product.id}) }}" method="post" >
  118.                      <div class="ec-productRole__actions">
  119.                          {% if form.classcategory_id1 is defined %}
  120.                              <div class="ec-select">
  121.                                  {{ form_widget(form.classcategory_id1) }}
  122.                                  {{ form_errors(form.classcategory_id1) }}
  123.                              </div>
  124.                              {% if form.classcategory_id2 is defined %}
  125.                                  <div class="ec-select">
  126.                                      {{ form_widget(form.classcategory_id2) }}
  127.                                      {{ form_errors(form.classcategory_id2) }}
  128.                                  </div>
  129.                              {% endif %}
  130.                          {% endif %}
  131.                          <div class="ec-numberInput">{# <span>{{ 'common.quantity'|trans }}</span> #}
  132.                              {{ form_widget(form.quantity, {'type': 'hidden', 'attr': {'class': 'quantity'}}) }}
  133.                              {{ form_errors(form.quantity) }}
  134.                          </div>
  135.                      </div>
  136.                      {{ form_rest(form) }}
  137.                      <input type="image" src="{{ asset('assets/imgs/button-cart.png','user_data') }}" class="add-cart stamps-top-buttons" data-cartid="{{ Product.id }}" form="productForm{{ Product.id }}" style="" onClick="">
  138.                  </form>
  140.                 </div>
  141.                 <div class="col-lg-6">
  142.                   {# 「レポートを見る」ボタン #}
  143.                     <a href="{{ url('product_detail', {'id': Product.id}) }}#report">
  144.                       <img src="{{ asset('assets/imgs/button-report.png','user_data') }}" class="go-report stamps-top-buttons"  style="" onClick=""/>
  145.                     </a>
  146.                   </a>
  147.                 </div>
  148.               </div>
  149.             </div>
  150.             {% endfor %}
  151.           </div>
  152.         </div>
  153.       </div>
  154.     </div>
  155.   </div>
  156. </div>
  158. <div class="ec-modal">
  159.     <input type="checkbox" id="ec-modal-checkbox" class="checkbox">
  160.     <div class="ec-modal-overlay">
  161.         <label for="ec-modal-checkbox" class="ec-modal-overlay-close"></label>
  162.         <div class="ec-modal-wrap">
  163.             <label for="ec-modal-checkbox" class="ec-modal-close"><span class="ec-icon"><img src="{{ asset('assets/icon/cross-dark.svg') }}" alt=""/></span></label>
  164.             <div id="ec-modal-header" class="text-center">{{ 'front.product.add_cart_complete'|trans }}</div>
  165.             <div class="ec-modal-box">
  166.                 <div class="ec-role">
  167.                     <label for="ec-modal-checkbox" class="ec-inlineBtn--cancel">{{ 'front.product.continue'|trans }}</label>
  168.                     <a href="{{ url('cart') }}" class="ec-inlineBtn--action">{{ 'common.go_to_cart'|trans }}</a>
  169.                 </div>
  170.             </div>
  171.         </div>
  172.     </div>
  173. </div>