app/template/default/Cart/index.twig line 1

Open in your IDE?
  1. {% extends 'default_frame.twig' %}
  3. {% set body_class = 'cart_page' %}
  5. {% block main %}
  6.   <div class="ec-registerRole">
  7.     <div class="kaso_h1title">
  8.       <p>Shopping Cart</p>
  9.       <h1>ショッピングカート</h1>
  10.     </div>
  12.     <div class="ec-cartRole">
  13.       <div class="ec-cartRole__progress">
  14.         <ul class="ec-progress">
  15.           {% set step = 1 %}
  16.           <li class="ec-progress__item is-complete">
  17.             <div class="ec-progress__number">{{ step }}{% set step = step + 1 %}
  18.             </div>
  19.             <div class="ec-progress__label">{{ 'カートの商品'|trans }}
  20.             </div>
  21.           </li>
  22.           {% if is_granted('ROLE_USER') == false %}
  23.             <li class="ec-progress__item">
  24.               <div class="ec-progress__number">{{ step }}{% set step = step + 1 %}
  25.               </div>
  26.               <div class="ec-progress__label">{{ 'お客様情報'|trans }}
  27.               </div>
  28.             </li>
  29.           {% endif %}
  30.           <li class="ec-progress__item">
  31.             <div class="ec-progress__number">{{ step }}{% set step = step + 1 %}
  32.             </div>
  33.             <div class="ec-progress__label">{{ 'ご注文手続き'|trans }}
  34.             </div>
  35.           </li>
  36.           <li class="ec-progress__item">
  37.             <div class="ec-progress__number">{{ step }}{% set step = step + 1 %}
  38.             </div>
  39.             <div class="ec-progress__label">{{ 'ご注文内容確認'|trans }}
  40.             </div>
  41.           </li>
  42.           <li class="ec-progress__item">
  43.             <div class="ec-progress__number">{{ step }}{% set step = step + 1 %}
  44.             </div>
  45.             <div class="ec-progress__label">{{ '完了'|trans }}
  46.             </div>
  47.           </li>
  48.         </ul>
  49.       </div>
  50.       {% set productStr = app.session.flashbag.get('eccube.front.request.product') %}
  51.       {% for error in app.session.flashbag.get('eccube.front.request.error') %}
  52.         {% set idx = loop.index0 %}
  53.         <div class="ec-cartRole__error">
  54.           <div class="ec-alert-warning">
  55.             <div class="ec-alert-warning__icon"><img src="{{ asset('assets/icon/exclamation-white.svg') }}"></div>
  56.             <div class="ec-alert-warning__text">
  57.               {% if productStr[idx] is defined %}
  58.                 {{ error|trans({'%product%':productStr[idx]})|nl2br }}
  59.               {% else %}
  60.                 {{ error|trans|nl2br }}
  61.               {% endif %}
  62.             </div>
  63.           </div>
  64.         </div>
  65.       {% endfor %}
  66.       {% for error in app.session.flashbag.get('eccube.front.cart.error') %}
  67.         <div class="ec-cartRole__error">
  68.           <div class="ec-alert-warning">
  69.             <div class="ec-alert-warning__icon"><img src="{{ asset('assets/icon/exclamation-white.svg') }}"></div>
  70.             <div class="ec-alert-warning__text">
  71.               {{ error|trans|nl2br }}
  72.             </div>
  73.           </div>
  74.         </div>
  75.       {% endfor %}
  76.       {% if totalQuantity > 0 %}
  77.         <div class="ec-cartRole__totalText">
  78.           <p>
  79.             {% if hasNegotiatedItems %}
  80.               <span style="color: #666; text-decoration: line-through;">{{ totalPrice|price }}</span><br>
  81.               {{ '商品の合計金額は「<strong style="color: #28a745;">%price%</strong>」です。'|trans({ '%price%': negotiatedTotalPrice|price })|raw }}
  82.               <span style="color: #28a745; font-size: 0.9em;"><i class="fa-solid fa-circle-check"></i> 交渉価格適用</span>
  83.             {% else %}
  84.               {{ '商品の合計金額は「<strong>%price%</strong>」です。'|trans({ '%price%': totalPrice|price })|raw }}
  85.             {% endif %}
  86.           </p>
  87.         </div>
  88.         {% if Carts|length > 1 %}
  89.           <div class="ec-cartRole__error">
  90.             <div class="ec-alert-warning">
  91.               <div class="ec-alert-warning__text">
  92.                 {{ '同時購入できない商品がカートに含まれています。'|trans|nl2br }}
  93.               </div>
  94.             </div>
  95.           </div>
  96.         {% endif %}
  98.         <form name="form" id="form_cart" class="ec-cartRole" method="post" action="{{ url('cart') }}">
  100.           {% for CartIndex,Cart in Carts %}
  101.             {% set cartKey = Cart.cart_key %}
  102.             {% for error in app.session.flashbag.get('eccube.front.cart.' ~ cartKey ~ '.request.error') %}
  103.               <div class="ec-cartRole__error">
  104.                 <div class="ec-alert-warning">
  105.                   <div class="ec-alert-warning__icon"><img src="{{ asset('assets/icon/exclamation-white.svg') }}"></div>
  106.                   <div class="ec-alert-warning__text">
  107.                     {{ error|trans|nl2br }}
  108.                   </div>
  109.                 </div>
  110.               </div>
  111.             {% endfor %}
  113.             <div class="ec-cartRole__cart">
  114.               <div class="ec-cartTable">
  115.                 <ol class="ec-cartHeader">
  116.                   <li class="ec-cartHeader__label">{{ '削除'|trans }}</li>
  117.                   <li class="ec-cartHeader__label">{{ '商品内容'|trans }}</li>
  118.                   <li class="ec-cartHeader__label">{{ '数量'|trans }}</li>
  119.                   <li class="ec-cartHeader__label">{{ '小計'|trans }}</li>
  120.                 </ol>
  121.                 {% for CartItem in Cart.CartItems %}
  122.                   {% set ProductClass = CartItem.ProductClass %}
  123.                   {% set Product = ProductClass.Product %}
  124.                   <ul class="ec-cartRow">
  125.                     <li class="ec-cartRow__delColumn">
  126.                       <a
  127.                         href="{{ url('cart_handle_item', {'operation': 'remove', 'productClassId': ProductClass.id }) }}" {{ csrf_token_for_anchor() }}
  128.                         class="ec-icon" data-method="put" data-message="カートから商品を削除してもよろしいですか?">
  129.                         <img src="{{ asset('assets/icon/cross.svg') }}" alt="delete">
  130.                       </a>
  131.                     </li>
  132.                     <li class="ec-cartRow__contentColumn">
  133.                       <div class="ec-cartRow__img">
  134.                         <a target="_blank" href="{{ url('product_detail', {id : Product.id} ) }}">
  135.                           <img src="{{ asset(Product.MainListImage|no_image_product, 'save_image') }}"
  136.                                alt="{{ Product.name }}"/>
  137.                         </a>
  138.                       </div>
  139.                       <div class="ec-cartRow__summary">
  140.                         <div class="ec-cartRow__name">
  141.                           <a target="_blank"
  142.                              href="{{ url('product_detail', {id : Product.id} ) }}">{{ Product.name }}</a>
  143.                           {% if ProductClass.ClassCategory1 and ProductClass.ClassCategory1.id %}
  144.                             <br>{{ ProductClass.ClassCategory1.ClassName.name }}：{{ ProductClass.ClassCategory1 }}
  145.                           {% endif %}
  146.                           {% if ProductClass.ClassCategory2 and ProductClass.ClassCategory2.id %}
  147.                             <br>{{ ProductClass.ClassCategory2.ClassName.name }}：{{ ProductClass.ClassCategory2 }}
  148.                           {% endif %}
  149.                         </div>
  150.                         {% if negotiationPrices[Product.id] is defined %}
  151.                           <div class="ec-cartRow__unitPrice" style="font-weight: bold; color: #28a745;">
  152.                             <i class="fa-solid fa-circle-check"></i> 価格交渉成立<br>
  153.                             <span style="color: #666; text-decoration: line-through;">{{ CartItem.price|price }}</span><br>
  154.                             <span style="color: #28a745;">交渉価格：{{ negotiationPrices[Product.id]|price }}</span>
  155.                           </div>
  156.                           <div class="ec-cartRow__sutbtotalSP">
  157.                             {{ '小計：'|trans }}<span style="color: #666; text-decoration: line-through;">{{ CartItem.total_price|price }}</span><br>
  158.                             <span style="color: #28a745; font-weight: bold;">→ {{ negotiatedSubtotals[Product.id]|price }}</span>
  159.                           </div>
  160.                         {% else %}
  161.                           <div class="ec-cartRow__unitPrice">{{ CartItem.price|price }}</div>
  162.                           <div class="ec-cartRow__sutbtotalSP">{{ '小計：'|trans }}{{ CartItem.total_price|price }}</div>
  163.                         {% endif %}
  164.                       </div>
  165.                     </li>
  166.                     <li class="ec-cartRow__amountColumn">
  167.                       <div class="ec-cartRow__amount">{{ CartItem.quantity|number_format }}</div>
  168.                       <div class="ec-cartRow__amountSP">{{ '数量：'|trans }}{{ CartItem.quantity|number_format }}</div>
  169.                       <div class="ec-cartRow__amountUpDown">
  170.                         {% if CartItem.quantity > 1 %}
  171.                           <a
  172.                             href="{{ url('cart_handle_item', {'operation': 'down', 'productClassId': ProductClass.id}) }}" {{ csrf_token_for_anchor() }}
  173.                             class="ec-cartRow__amountDownButton load-overlay" data-method="put" data-confirm="false">
  174.                             <span class="ec-cartRow__amountDownButton__icon"><img
  175.                                 src="{{ asset('assets/icon/minus-dark.svg') }}" alt="reduce"></span>
  176.                           </a>
  177.                         {% else %}
  178.                           <div class="ec-cartRow__amountDownButtonDisabled">
  179.                             <span class="ec-cartRow__amountDownButton__icon"><img
  180.                                 src="{{ asset('assets/icon/minus.svg') }}" alt="reduce"></span>
  181.                           </div>
  182.                         {% endif %}
  183.                         <a
  184.                           href="{{ url('cart_handle_item', {'operation': 'up', 'productClassId': ProductClass.id}) }}" {{ csrf_token_for_anchor() }}
  185.                           class="ec-cartRow__amountUpButton load-overlay" data-method="put" data-confirm="false">
  186.                           <span class="ec-cartRow__amountUpButton__icon"><img
  187.                               src="{{ asset('assets/icon/plus-dark.svg') }}" alt="increase"></span>
  188.                         </a>
  189.                       </div>
  190.                     </li>
  191.                     <li class="ec-cartRow__subtotalColumn">
  192.                       {% if negotiationPrices[Product.id] is defined %}
  193.                         <div class="ec-cartRow__sutbtotal">
  194.                           <span style="color: #666; text-decoration: line-through; font-size: 0.9em;">{{ CartItem.total_price|price }}</span><br>
  195.                           <span style="color: #28a745; font-weight: bold;">{{ negotiatedSubtotals[Product.id]|price }}</span>
  196.                         </div>
  197.                       {% else %}
  198.                         <div class="ec-cartRow__sutbtotal">{{ CartItem.total_price|price }}</div>
  199.                       {% endif %}
  200.                     </li>
  201.                   </ul>
  202.                 {% endfor %}
  203.               </div>
  204.             </div>
  205.             <div class="ec-cartRole__progress">
  206.               {% if BaseInfo.delivery_free_amount and BaseInfo.delivery_free_quantity %}
  207.                 <br/>
  208.                 {% if is_delivery_free[cartKey] %}
  209.                   {{ '現在送料無料です。'|trans }}
  210.                 {% else %}
  211.                   {{ 'あと「<strong>%price%</strong>」または「<strong>%quantity%個</strong>」のお買い上げで<strong class="ec-color-red">送料無料</strong>になります。'|trans({ '%price%': least[cartKey]|price, '%quantity%': quantity[cartKey]|number_format })|raw }}
  212.                 {% endif %}
  213.               {% elseif BaseInfo.delivery_free_amount %}
  214.                 <br/>
  215.                 {% if is_delivery_free[cartKey] %}
  216.                   {{ '現在送料無料です。'|trans }}
  217.                 {% else %}
  218.                   {{ 'あと「<strong>%price%</strong>」のお買い上げで<strong class="ec-color-red">送料無料</strong>になります。'|trans({ '%price%': least[cartKey]|price })|raw }}
  219.                 {% endif %}
  220.               {% elseif BaseInfo.delivery_free_quantity %}
  221.                 <br/>
  222.                 {% if is_delivery_free[cartKey] %}
  223.                   {{ '現在送料無料です。'|trans }}
  224.                 {% else %}
  225.                   {{ 'あと「<strong>%quantity%個</strong>」のお買い上げで<strong class="ec-color-red">送料無料</strong>になります。'|trans({ '%quantity%': quantity[cartKey]|number_format })|raw }}
  226.                 {% endif %}
  227.               {% endif %}
  228.             </div>
  229.             <div class="ec-cartRole__actions">
  230.               <div class="ec-cartRole__total">
  231.                 {% if hasNegotiatedItems and negotiatedCartTotals[cartKey] is defined and negotiatedCartTotals[cartKey] != Cart.totalPrice %}
  232.                   {{ '合計：'|trans }}<span style="color: #666; text-decoration: line-through; font-size: 0.9em;">{{ Cart.totalPrice|price }}</span><br>
  233.                   <span class="ec-cartRole__totalAmount" style="color: #28a745;">
  234.                     <i class="fa-solid fa-circle-check"></i> {{ negotiatedCartTotals[cartKey]|price }}
  235.                   </span>
  236.                 {% else %}
  237.                   {{ '合計：'|trans }}<span class="ec-cartRole__totalAmount">{{ Cart.totalPrice|price }}</span>
  238.                 {% endif %}
  239.               </div>
  240.               <a class="ec-blockBtn--action"
  241.                  href="{{ path('cart_buystep', {'cart_key':cartKey}) }}">{{ 'レジに進む'|trans }}</a>
  242.               {% if loop.last %}
  243.                 {% if app.session.get('header_footer_layout') == 'plaza' %}
  244.                   <a class="ec-blockBtn--cancel"
  245.                      href="{{ path('plaza_product_list') }}">{{ 'お買い物を続ける'|trans }}</a>
  246.                 {% else %}
  247.                   <a class="ec-blockBtn--cancel" href="{{ path('homepage') }}">{{ 'お買い物を続ける'|trans }}</a>
  248.                 {% endif %}
  249.               {% endif %}
  250.             </div>
  251.           {% endfor %}
  252.         </form>
  253.       {% else %}
  254.         {% for CartIndex,Cart in Carts %}
  255.           {% set cartKey = Cart.cart_key %}
  256.           {% for error in app.session.flashbag.get('eccube.front.cart.' ~ cartKey ~ '.request.error') %}
  257.             <div class="ec-cartRole__error">
  258.               <div class="ec-alert-warning">
  259.                 <div class="ec-alert-warning__icon"><img src="{{ asset('assets/icon/exclamation-white.svg') }}"></div>
  260.                 <div class="ec-alert-warning__text">
  261.                   {{ error|trans|nl2br }}
  262.                 </div>
  263.               </div>
  264.             </div>
  265.           {% endfor %}
  266.         {% endfor %}
  267.         <div class="ec-role">
  268.           <div class="ec-off3Grid">
  269.             <div class="ec-off3Grid__cell">
  270.               <div class="ec-alert-warning">
  271.                 <div class="ec-alert-warning__icon"><img src="{{ asset('assets/icon/exclamation-white.svg') }}"></div>
  272.                 <div class="ec-alert-warning__text">{{ '現在カート内に商品はございません。'|trans }}</div>
  273.               </div>
  274.             </div>
  275.           </div>
  276.         </div>
  277.       {% endif %}
  278.     </div>
  279.   </div>
  280. {% endblock %}