batiskaf/batiskaf/templates/jinja2/product.jinja

{% extends 'base.jinja' %}
{% block meta_description %}
Купить {{ product.title }} в интернет-магазине снаряжения для дайвинга и подводной охоты Батискаф-Казахстан.
{% endblock %}
{% block meta_keywords %}
{{ product.title }}, {% for parent in category.get_parents() %}{{ parent.title }}, {% endfor %}{{ category.title }}, Товар, Цена, Купить, Фото, Интернет-Магазин, Батискаф-Казахстан
{% endblock %}
{% block title %}
{{ product.title }} :
{% for parent in category.get_parents() %}{{ parent.title }} > {% endfor %}{{ category.title }}
{% endblock %}
{% block content %}
<div class=" breadcrumbs">
    <ol class="breadcrumb breadcrumb-arrow">
        <li><a href="/">Главная</a></li>
        {% for parent in category.get_parents() %}
        <li><a href="{{ parent.get_absolute_url() }}">{{ parent.title }}</a></li>
        {% endfor %}
        <li class=""><a href="{{ category.get_absolute_url() }}">{{ category.title }}</a></li>
        <li class="active"><span>{{ product.title }}</span></li>
    </ol>
</div>
<div class="row">
    <div class="product-thumbnails col-xs-6">
        <div class="product-min-thumbnails col-xs-2">
            {% for image in product.images.all() %}
            {% set im = image.image|thumbnail("80x80") %}
            {% set im_big = image.image|thumbnail("398x398") %}
            <a href="/static/{{ im_big.url }}" data-big-url="/static/{{ image.image.url }}"><img
                src="/static/{{ im.url }}" alt="{{ product.title }}" title="{{ product.title }}"
                class="img-thumbnail"/></a>
                {% endfor %}
            </div>
            <div class="product-big-thumbnail col-xs-10">
                <div class="product-big-thumbnail-container">
                    {% set im = product.main_image()|thumbnail("398x398") %}
                    <!-- <a href="/static/{{ product.main_image().url }}" id="product-big-image-url"> -->
                    <img src="/static/{{ im.url }}" alt="{{ product.title }}" title="{{ product.title }}" width="398"
                    height="392" id='product-big-img' class=""
                    data-zoom-image='/static/{{ product.main_image().url }}'/>
                    <!-- </a> -->
                </div>
            </div>
        </div>

        <div class="col-xs-6 product-short-description">

            <h4>{{ product.title }}</h4>



            <div class="product-detail-price">
                <span class="product-detail-price-span">{{ product.min_price() }}</span> ₸
            </div>
            <br/>

            {% set variant = product.variations.filter(in_stock__gt=0).order_by('price').first() %}
            {% if not variant %}
            {% set variant = product.variations.order_by('price').first() %}
            {% endif %}
            <div class="product-variations">
                <p>Варианты товара:</p>
                <select name="product-variations-selecter" class="product-variations-selecter">
                    {% for variation in product.variations.order_by('price') %}
                    <option {% if variation.pk == variant.pk %}selected='selected'{% endif %}
                    value="{{ variation.pk }}" data-price="{{ variation.get_price() }}"
                    data-count="{{ variation.in_stock }}">{{ variation.variation }}
                    - {{ variation.get_price() }}
                    ₸
                </option>
                {% endfor %}
            </select>
        </div>

        {% if 'suits' in request.path %}


        <div>
            <a href="/size/" class="text-success" target="_blank">Подобрать размер &rarr;</a>

        </div>
        {% endif %}
        <div class="product-in-stock">
            <select name="product-count-selecter" class="product-count-selecter">
                {% for count_val in range(variant.in_stock) %}
                <option value="{{ count_val + 1 }}">{{ count_val + 1 }} шт.</option>
                {% endfor %}
            </select>
            <br/>

            <div class="row">
                <div class="itogo col-xs-6">
                    Итого: <span class="itogo-span">{{ product.min_price() }}</span> ₸
                </div>
                <div class="col-xs-6 text-right">
                    <a href="/store/cart/add/?pk={{ variant.pk }}&count=1&next={{ product.get_absolute_url() }}"
                    class="btn btn-warning btn-block" id="product-add-to-cart-link"><span
                    class="glyphicon glyphicon-shopping-cart" aria-hidden="true"></span> Добавить в корзину</a>
                </div>
            </div>

        </div>

        <div class="product-not-in-stock">
            Товара нет в наличии <br/><br/><br/>
            <a class=" btn btn-danger btn-block order-order-link" href="#order-form" data-itemid="{{ product.pk }}"
            style="max-width: 200px"><span><span
            class="glyphicon glyphicon-import" aria-hidden="true"></span> Заказать</span></a>
        </div>
        <br/>
        <div class="tags">
            <h5 class="text-left">
                Поделиться ссылкой:</h5>

                <script type="text/javascript" src="//yastatic.net/share/share.js" charset="utf-8"></script>
                <div class="yashare-auto-init" data-yashareL10n="ru" data-yashareType="small"
                data-yashareQuickServices="vkontakte,facebook,twitter,odnoklassniki,moimir,gplus"
                data-yashareLink="http://batiskaf-kz.kz{{ object.get_absolute_url() }}"
                data-yashareTitle="{{ object.title }}" data-yashareTheme="counter"></div>

            </div>
        </div>


    </div>

    <div class=" text-left product-description">
        {{ product.description|linebreaks|safe }}
    </div>
    <hr class="dashed"/>
    <h3 class="">
    Отзывы о товаре {{ product.title }}
</h3><br/>
    <div class="well well-lg news-container">





 <ul class="media-list">
{% if product.feedback.all() %}

                {% for comment in product.feedback.all() %}

                    <li class="media">
<a name="comment{{ comment.pk }}"></a>
                <div class="media-body">
                  <h4 class="media-heading text-left">
                      {% for i in range(1,6) %}
                      <input name="star{{ comment.pk }}" type="radio" class="star" disabled="disabled" {% if i == comment.stars %}checked="checked"{% endif %}/>
                      {% endfor %}


                      {{ comment.name }} пишет: <small><a
                          href="{{ request.get_full_path() }}#comment{{ comment.pk }}">#</a></small></h4>
                  <p>{{ comment.created.strftime('%d.%m.%Y %H:%M') }}</p>
                  <p>{{ comment.text|striptags }}</p>
                  <!-- Nested media object -->

                </div>
              </li>

                {% endfor %}
                </ul>
            {% else %}
                <div class="alert alert-warning alert-dismissable">
                    <strong>Пока нет ни одного отзыва!</strong> Вы можете <a href="#comment">стать первым</a>!
                </div>
            {% endif %}

        </div>
    <hr/>
    <div class="comment">
            <a name="comment"></a>
            <h4 class="text-center">
                Оставить отзыв:</h4>

            <div class="comment-form col-xs-6 col-xs-offset-3">
                <form action="" class="form" method="post"><input type="hidden" name="csrfmiddlewaretoken"
                                                                  value="{{ csrf_token }}">
                    {{ form|bootstrap }}
                    <div class="form-group text-left">
                        <button type="submit" name="comment-send" class="btn btn-primary"><span
                                class="glyphicon glyphicon-comment" aria-hidden="true"></span> Отправить
                        </button>
                    </div>
                </form>
            </div>
        </div>



    {% endblock %}