{% load static %}
{% load i18n %}

{#<div class="title-profile-cont">#}
{#    Подписка#}
{#</div>#}


<div class="subscribe_inf">
    <div class="subscribe_inf_left_part">
        <div class="text-align-center">
            <div class="title_subscribe">{% translate "Ваш тарифный план" %}</div>
            <div class="name_subscribe">{{ subscribe_for_user.subscribe.name }}</div>
            <button class="extend_subscribe_btn">{% translate "Продлить" %}</button>
            <div class="unsubscribe_info">*{% translate "для отмены подписки создайте запрос в техподдержке" %}</div>
            <div class="subscribe_was_paid">{% translate "оплачен до:" %}  {{ subscribe_for_user.paid_period_to_DT|date:"d.m.y" }}</div>
        </div>
        <div class="wrapper_switch_cont">
{#            <div class="width-100">#}
{#                <div class="label_toggle_switch_cont">#}
{#                    <label for="id_paid_toggle">{% translate "Автопродление тарифного плана" %}</label>#}
{#                </div>#}
{#                <div class="toggle_switch_cont">#}
{#                    <input class="input_toggle_switch" id="id_paid_toggle" name="paid_toggle" type="checkbox">#}
{#                    <div class="input_toggle_switch_display"></div>#}
{#                    <div class="toggler_input_switch"></div>#}
{#                </div>#}
{#                <div class="clear_both"></div>#}
{#            </div>#}
            <div class="width-100">
                <div class="label_toggle_switch_cont">
                    <label for="id_email_toggle">{% translate "Получать уведомление на почту о завершении подписки" %}</label>
                </div>
                <div class="toggle_switch_cont">
                    <input class="input_toggle_switch"
                           onchange="updSwitchState(this)"
                           id="id_email_toggle"
                           name="email_toggle"
                           type="checkbox"
                           {% if subscribe_for_user.receive_finish_subscribe_msg == True %}checked{% endif %}
                           >
                    <div class="input_toggle_switch_display"></div>
                    <div class="toggler_input_switch"></div>
                </div>
                <div class="clear_both"></div>

            </div>
        </div>
    </div>
    <div class="subscribe_inf_right_part">
        <div class="title_options">{% translate "Опции тарифа" %}</div>
        <ul class="option_list">
            {% for opt in subscribe_for_user.subscribe.options.all %}
                <li class="items_subscribe select green" style="color: {{ subscribe.text_color }}"><text>{{ opt.name }}</text></li>
            {% endfor %}
            {% for opt_dis in subscribe_for_user.subscribe.disabled_options %}
                <li class="items_subscribe unselect red"><text>{{ opt_dis.name }}</text></li>
            {% endfor %}

        </ul>
    </div>
    <div class="clear_both"></div>
</div>
<div class="inf_about_tarif_plan_text"><div style="font-weight: 600;">{% translate "При отказе или досрочном изменении тарифного" %}</div>
    <div style="font-weight: 600;">{% translate "плана оплаченный период действия текущей подписки не пересчитывается." %}</div>
    <br><br>
    <div class="b_another_subscribes">
    {% for item in subscribes %}
        {% if item.id != subscribe_for_user.subscribe.id  %}

            <div class="another_subscribe">
                <div class="subscribe_wrpapper">
                    <div class="name_subscribe_another padding-n-width-another-subscribes">{{ item.name }}</div>
                    <div class="text_another_subscribe padding-n-width-another-subscribes">
                        {% translate "Стоимость:" %}
                        <span class="orange-text">
                                {% if item.price %}
                                    {{ item.price|floatformat }}₸
                                {% else %}
                                    {% translate "Бесплатно" %}
                                {% endif %}
                        </span>
                    </div>
                    <div class="text_another_subscribe padding-n-width-another-subscribes ">
                        {% translate "Период" %}: <span class="orange-text">{{ item.period_name }}</span>
                    </div>
                    {% if not item.order_error %}
                        <button class="read_more_about_subscribe"
                                onclick="send_subscribe(this, {{ item.id }},'{% if page.url == 'for_movers' or page.url == 'for_customers' %}a{% endif %}','{% url "profile_page" "my_subscribe" %}')">{% translate "Перейти" %}
                        </button>
                    {% endif %}
                </div>

                {% if item.order_error %}
                    <div class="error_order">
                        <div class="error_title">
                            <img class="error_icon" src="/static/img/svg/Warning.svg" alt="">
                            {% translate "Ошибка оплаты" %}
                        </div>
                        <div class="error_title">{% translate "Сообщение от банка:" %} <span class="error_text">{{ item.order_error }}</span></div>
                        <div class="read_more_about_subscribe error"
                            onclick="send_subscribe(this, {{ item.id }},'{% if page.url == 'for_movers' or page.url == 'for_customers' %}a{% endif %}','{% url "profile_page" "my_subscribe" %}')"
                        >
                            <img class="error_icon filter-orange" src="/static/img/svg/ClockCounterClockwise.svg" alt="">
                            {% translate "Повторить оплату" %}
                        </div>
                    </div>
                {% endif %}
            </div>

        {% endif %}

    {% endfor %}
    </div>