{% extends 'default_frame.twig' %}{% set body_class = 'product_page' %}{% block javascript %} <script> eccube.productsClassCategories = { {% for Product in pagination %} "{{ Product.id|escape('js') }}": {{ class_categories_as_json(Product)|raw }}{% if loop.last == false %}, {% endif %} {% endfor %} }; $(function() { // 検索条件を追加 $('.btn-condition').click(function() { $('#active_idx').val($(this).index()); }); $('.form-check-input').change(function() { $("#form1").submit(); }); // 表示件数を変更 $('.disp-number').change(function() { var dispNumber = $(this).val(); $('#disp_number').val(dispNumber); $('#pageno').val(1); $("#form1").submit(); }); // 並び順を変更 $('.order-by').change(function() { var orderBy = $(this).val(); $('#orderby').val(orderBy); $('#pageno').val(1); $("#form1").submit(); }); $('.add-cart').on('click', function(e) { var $form = $(this).parents('li').find('form'); // TODO: test 修正要 // 規格1フォームの必須チェック var $form_select = $form.parent().find('.form-select'); if ($form_select.val() == '__unselected' || $form_select.val() == '') { $form_select[0].setCustomValidity('{{ '項目が選択されていません'|trans }}'); setTimeout(function() { loadingOverlay('hide'); }, 100); return true; } else { $form_select[0].setCustomValidity(''); } // 個数フォームのチェック var $quantity = $form.parent().find('.quantity'); if ($quantity.val() < 1) { $quantity[0].setCustomValidity('{{ '1以上で入力してください。'|trans }}'); setTimeout(function() { loadingOverlay('hide'); }, 100); return true; } else { $quantity[0].setCustomValidity(''); } e.preventDefault(); $.ajax({ url: $form.attr('action'), type: $form.attr('method'), data: $form.serialize(), dataType: 'json', beforeSend: function(xhr, settings) { // Buttonを無効にする $('.add-cart').prop('disabled', true); } }).done(function(data) { // レスポンス内のメッセージをalertで表示 $.each(data.messages, function() { $('#ec-modal-header').text(this); }); $('.ec-modal').show() // カートブロックを更新する $.ajax({ url: '{{ url('block_cart') }}', type: 'GET', dataType: 'html' }).done(function(html) { $('.ec-headerRole__cart').html(html); }); }).fail(function(data) { alert('{{ 'カートへの追加に失敗しました。'|trans }}'); }).always(function(data) { // Buttonを有効にする $('.add-cart').prop('disabled', false); }); }); $('.favorite').click(function(event) { if ($(this).attr('disabled') != 'disabled') { $(this).closest('li.product').find('.list-add-favorite').submit(); } }); }); $('.ec-modal-wrap').on('click', function(e) { // モーダル内の処理は外側にバブリングさせない e.stopPropagation(); }); $('.ec-modal-overlay, .ec-modal, .ec-modal-close, .ec-inlineBtn--cancel').on('click', function() { $('.ec-modal').hide() }); </script> <script> $(document).ready(function(){ //チェックボックス処理 $(".left .list-btn .btn-condition").eq($('#active_idx').val()).addClass('active'); $(".right .item").eq($('#active_idx').val()).addClass('active'); $(".right .item").each(function(index, el) { var chk_cnt = $(this).find("input[type='checkbox']:checked").length; $('.btn-condition').eq(index).find('.chk-cnt').text(chk_cnt); if (chk_cnt > 0) { $('.btn-condition').eq(index).find('.chk-cnt').show(); } else { $('.btn-condition').eq(index).find('.chk-cnt').hide(); } }); $(".left .list-btn .btn-condition").click(function(e){ if (!$(this).hasClass("active")) { var tabNum = $(this).index(); var nthChild = tabNum+1; $(".left .list-btn .btn-condition.active").removeClass("active"); $(this).addClass("active"); $(".right .item.active").removeClass("active"); $(".right .item:nth-child("+nthChild+")").addClass("active"); } }); $(".reset").click(function(e){ $(".item input[type='checkbox']:checked").prop('checked', false); $("#form1").submit(); }); }); </script>{% endblock %}{% block main %} <div class="ec-product-page v2"> <div class="ec-banner" {% if Category.id == 118 %} style="background-color: #fff;" {% endif %}> <div class="ec-banner__inner"> <div class="inner"> {% if Category is not null %} {% if Category.id == 115 %} <h2>{{ Category.name }}</h2> {% elseif Category.id == 118 %} <h2>自社ローン対象商品<br />(分割24回のみ)</h2> {% else %} <h2>{{ Category.name }}商品一覧</h2> {% endif %} {% else %} <h2>商品一覧</h2> {% endif %} </div> </div> <div class="ec-breadcrumb" {% if Category is not null and Category.id == 115 %}style="margin-bottom: 2rem"{% endif %} {% if Category.id == 118 %} style="margin-bottom: 2rem;" {% endif %}> <ul class="ec-breadcrumb__menu"> <li class="ec-breadcrumb__item"><a href="{{ url('homepage') }}">TOP</a></li> <li class="ec-breadcrumb__item"><span>></span></li> <li class="ec-breadcrumb__item"> {% if Category is not null %} {% if Category.id == 115 %} <p>{{ Category.name }}</p> {% elseif Category.id == 118 %} <p>自社ローン対象商品(分割24回のみ)</p> {% else %} <p>{{ Category.name }}商品一覧</p> {% endif %} {% else %} <p>商品一覧</p> {% endif %} </li> </ul> </div> </div> <div class="ec-product-main"> {% if Category is null or Category.id != 115 %} {% if Category.id != 118 %} <div class="ec-product__inner v2"> <div class="inner"> <div class="ec-product__group"> <form name="form1" id="form1" method="get" action="?"> {% for item in search_form %} {% if item.vars.value is not iterable %} <input type="hidden" id="{{ item.vars.id }}" name="{{ item.vars.full_name }}" {% if item.vars.value is not empty %}value="{{ item.vars.value }}" {% endif %}/> {% endif %} {% endfor %} <div class="conditions"> <div class="left"> <div class="list-btn"> {% if Category is not null and Category.id == 7 %} <a class="btn-condition"><span>業種</span><span class="chk-cnt">1</span></a> <a class="btn-condition"><span>形</span><span class="chk-cnt">1</span></a> <a class="btn-condition"><span>馬力</span><span class="chk-cnt">1</span></a> {% else %} <a class="btn-condition"><span>機能</span><span class="chk-cnt">1</span></a> <a class="btn-condition"><span>お部屋の広さ</span><span class="chk-cnt">1</span></a> <a class="btn-condition"><span>メーカー</span><span class="chk-cnt">1</span></a> {% endif %} <a class="btn-condition"><span>価格</span><span class="chk-cnt">1</span></a> </div> <a class="reset"> <span>条件をリセット</span> <img src="{{ asset('assets/img/common/ic-reset.png') }}" alt=""> </a> <div class="count"> <p><span>検索結果</span>{{ pagination.totalItemCount }}件</p> </div> </div> <div style="flex: 1;"> <div class="right"> {% if Category is not null and Category.id == 7 %} {{ form_widget(search_form.kind, {'id': '', 'attr': {'class': 'item'}}) }} {{ form_widget(search_form.shape, {'id': '', 'attr': {'class': 'item'}}) }} {{ form_widget(search_form.power, {'id': '', 'attr': {'class': 'item'}}) }} {{ form_widget(search_form.search_price_workplace, {'id': '', 'attr': {'class': 'item'}}) }} {% else %} {{ form_widget(search_form.feature, {'id': '', 'attr': {'class': 'item'}}) }} {{ form_widget(search_form.room, {'id': '', 'attr': {'class': 'item'}}) }} {{ form_widget(search_form.maker, {'id': '', 'attr': {'class': 'item'}}) }} {{ form_widget(search_form.search_price_room, {'id': '', 'attr': {'class': 'item'}}) }} {% endif %} </div> {% if Category is not null and Category.id == 8 %} <div class="conditions__0yen"> {{ form_widget(search_form.search_0_yen, {'id': '', 'attr': {'class': 'item'}}) }} </div> {% endif %} </div> </div> </form> </div> </div> </div> {% endif %} {% else %} <form name="form1" id="form1" method="get" action="?"> {% for item in search_form %} {% if item.vars.value is not iterable %} <input type="hidden" id="{{ item.vars.id }}" name="{{ item.vars.full_name }}" {% if item.vars.value is not empty %}value="{{ item.vars.value }}" {% endif %}/> {% endif %} {% endfor %} </form> {% endif %} <div class="ec-product__inner"> <div class="inner"> <div class="ec-product__group"> {% if Category.id == 118 %} <div class="title-add"> <p>他で購入できなかった方も安心<i>!</i><br /> 高性能自社ローン限定商品<span>( 分割24回のみ) </span></p> </div> {% endif %} <div class="arrange"> {{ form_widget(search_form.orderby, {'id': '', 'attr': {'class': 'order-by'}}) }} </div> {% if pagination.totalItemCount > 0 %} <ul class="list-product" style="padding-left: 2px;"> {% for Product in pagination %} {% set isTelProduct = false %} {% set isLoanProduct = false %} {% if Product.ProductCategories is not empty %} {% for ProductCategory in Product.ProductCategories %} {% if ProductCategory.Category.id == 117 %} {% set isTelProduct = true %} {% endif %} {% if ProductCategory.Category.id == 118 %} {% set isLoanProduct = true %} {% endif %} {% endfor %} {% endif %} <li class="product" style="margin: -1px 0 0 -1px;"> <a href="{{ url('product_detail', {'id': Product.id}) }}"> <img src="{{ asset(Product.main_list_image|no_image_product, 'save_image') }}" alt="{{ Product.name }}" {% if loop.index > 5 %} loading="lazy"{% endif %}> <div class="text"> <p style="font-weight: bold;">{{ Product.name }}</p> {% if Product.description_list %} <p>{{ Product.description_list|raw|nl2br }}</p> {% endif %} </div> </a> <div class="product__price"> <div class="group"> <div class="price"> {% if Product.hasProductClass %} {% if Product.getPrice02Min == Product.getPrice02Max %} <p>{{ Product.getPrice02IncTaxMin|price }}<small>(税込)</small></p> {% else %} <p>{{ Product.getPrice02IncTaxMin|price }} ~ {{ Product.getPrice02IncTaxMax|price }}<small>(税込)</small></p> {% endif %} {% else %} <p {% if isLoanProduct == true %} class="text-b" {% endif %}> {{ Product.getPrice02IncTaxMin|price }}<small>(税込)</small> </p> {% endif %} </div> <div class="list-cate"> {% if Product.ProductCategories is not empty %} {% for ProductCategory in Product.ProductCategories %} {% if ProductCategory.Category.Parent is not empty %} {% set parentCat = ProductCategory.Category.Parent %} {% if parentCat.id == 20 %} <p>{{ ProductCategory.Category.name }}</p> {% endif %} {% endif %} {% endfor %} {% endif %} </div> <div class="num-product"> {% if Category is not null and Category.id == 7 %} {% if Product.ProductCategories is not empty %} {% for ProductCategory in Product.ProductCategories %} {% if ProductCategory.Category.Parent is not empty %} {% set parentCat = ProductCategory.Category.Parent %} {% if parentCat.id == 51 %} <p>{{ ProductCategory.Category.name }}</p> {% endif %} {% endif %} {% endfor %} {% endif %} {% else %} {% if Product.code_min is not empty %} <p>品番 {{ Product.code_min }}{% if Product.code_min != Product.code_max %} ~ {{ Product.code_max }}{% endif %}</p> {% endif %} {% endif %} </div> </div> {% if Product.stock_find %} {% set form = forms[Product.id] %} <form name="form{{ Product.id }}" id="productForm{{ Product.id }}" action="{{ url('product_add_cart', {id:Product.id}) }}" method="post"> {{ form_widget(form._token) }} {{ form_widget(form.product_id) }} {{ form_widget(form.ProductClass) }} <div class="ec-productRole__actions" style="margin-top: 1rem;"> {% if form.classcategory_id1 is defined %} <div class="ec-select"> <label class="form-label required" style="min-width: 3rem;">カラー</label> {{ form_widget(form.classcategory_id1) }} {{ form_errors(form.classcategory_id1) }} </div> {% if form.classcategory_id2 is defined %} <div class="ec-select"> {{ form_widget(form.classcategory_id2) }} {{ form_errors(form.classcategory_id2) }} </div> {% endif %} {% endif %} {% if isTelProduct != true %} <div class="ec-numberInput"> <span style="min-width: 5rem">{{ '数量'|trans }}</span> {{ form_widget(form.quantity, {'attr': {'class': 'quantity'}}) }} {{ form_errors(form.quantity) }} </div> {% endif %} </div> {# {{ form_rest(form) }} #} </form> <div class="group"> <div class="list-btn ec-productRole__btn"> {% if isTelProduct == true %} <a href="tel:080-0222-4466" class="cart cart-tel" style="border: none;"> <img src="{{ asset('assets/img/common/ic-tel2-white.png') }}" width="15" alt=""> <span>{{ '080-0222-4466'|trans }}</span> </a> {% elseif isLoanProduct == true %} <a href="{{ url('loan_examination') }}?id={{ Product.id }}" class="cart cart-loan" style="border: none;"> <span>{{ '審査のお申込み'|trans }}</span> </a> {% else %} <button type="submit" class="add-cart cart" data-cartid="{{ Product.id }}" form="productForm{{ Product.id }}" style="border: none;"> <img src="{{ asset('assets/img/common/ic-cart-v2.png') }}" alt=""> <span>カートに入れる</span> </button> {% endif %} {% if BaseInfo.option_favorite_product %} {% set is_favorite = false %} {% if is_granted('ROLE_USER') %} {% set is_favorite = repository('\\Eccube\\Entity\\CustomerFavoriteProduct').isFavorite(Customer, Product) %} {% endif %} {% if is_favorite == false %} <a href="javascript:void(0);" class="favorite"> <span></span> </a> {% else %} <a href="javascript:void(0);" class="favorite active" disabled="disabled"> <span></span> </a> {% endif %} {% endif %} </div> </div> {% if BaseInfo.option_favorite_product %} <div style="display: none;"> <form class="list-add-favorite" action="{{ url('product_add_favorite', {id:Product.id}) }}" method="post"> <div class="ec-productRole__btn"> <button type="submit" id="favorite" class="ec-blockBtn--cancel"> {{ 'お気に入りに追加'|trans }} </button> </div> </form> </div> {% endif %} {% else %} <div class="group"> <div class="list-btn ec-productRole__btn"> <button type="button" class="cart" disabled="disabled"> <img src="{{ asset('assets/img/common/ic-cart-v2.png') }}" alt=""> <span>ただいま品切れ中です。</span> </button> </div> </div> {% endif %} </div> </li> {% endfor %} </ul> <div class="pagenation"> {% include "pager.twig" with {'pages': pagination.paginationData} %} </div> {% endif %} <div class="list-btn"> {{ include('Block/list-btn.twig') }} </div> </div> </div> </div> </div> </div>{% endblock %}