{% extends 'manager/base.html' %}
{% load static %}
{% load i18n %}

{% block sidebar.payment_plans %} class="active" {% endblock %}

{% block content %}
<div class="page-wrapper">
    <div class="content">
        <div class="row">
            <div class="col-sm-12">
                <h4 class="page-title">{% trans "طرح‌های پرداخت" %}</h4>
            </div>
        </div>
        
        {% if messages %}
            {% for message in messages %}
                <div class="alert alert-{% if message.tags == 'error' %}danger{% else %}{{ message.tags }}{% endif %} alert-dismissible fade show" role="alert">
                    {{ message }}
                    <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
            {% endfor %}
        {% endif %}
        
        <div class="row">
            <div class="col-md-12">
                <div class="card-box">
                    <div class="card-header">
                        <h4 class="card-title">{% trans "لیست طرح‌های پرداخت" %}</h4>
                        <div class="card-tools">
                            <a href="{% url 'panel-manager-create-payment-plan' %}" class="btn btn-primary">
                                <i class="fa fa-plus"></i> {% trans "افزودن طرح جدید" %}
                            </a>
                        </div>
                    </div>
                    <div class="card-body">
                        {% if plans %}
                            <div class="table-responsive">
                                <table class="table table-striped table-hover">
                                    <thead>
                                        <tr>
                                            <th>{% trans "نام طرح" %}</th>
                                            <th>{% trans "شناسه دیتابیس" %}</th>
                                            <th>{% trans "قیمت" %}</th>
                                            <th>{% trans "قیمت با تخفیف" %}</th>
                                            <th>{% trans "دوره اشتراک" %}</th>
                                            <th>{% trans "وضعیت" %}</th>
                                            <th>{% trans "موارد شامل" %}</th>
                                            <th>{% trans "موارد مستثنی" %}</th>
                                            <th>{% trans "عملیات" %}</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        {% for plan in plans %}
                                            <tr>
                                                <td>
                                                    <strong>{{ plan.name }}</strong>
                                                    {% if plan.promotion %}
                                                        <br><small class="text-success">{{ plan.promotion }}</small>
                                                    {% endif %}
                                                </td>
                                                <td>
                                                    <span class="badge badge-info">{{ plan.plan_database_id }}</span>
                                                </td>
                                                <td>
                                                    <span class="badge badge-primary">{{ plan.price }} {% trans "تومان" %}</span>
                                                </td>
                                                <td>
                                                    {% if plan.price_with_promotion %}
                                                        <span class="badge badge-success">{{ plan.price_with_promotion }} {% trans "تومان" %}</span>
                                                    {% else %}
                                                        <span class="text-muted">-</span>
                                                    {% endif %}
                                                </td>
                                                <td>{{ plan.subscription_period }}</td>
                                                <td>
                                                    {% if plan.is_active %}
                                                        <span class="badge badge-success">{% trans "فعال" %}</span>
                                                    {% else %}
                                                        <span class="badge badge-secondary">{% trans "غیرفعال" %}</span>
                                                    {% endif %}
                                                </td>
                                                <td>
                                                    {% if plan.items_included %}
                                                        <ul class="list-unstyled mb-0">
                                                            {% for item in plan.get_items_included_list %}
                                                                <li><i class="fa fa-check text-success"></i> {{ item }}</li>
                                                            {% endfor %}
                                                        </ul>
                                                    {% else %}
                                                        <span class="text-muted">-</span>
                                                    {% endif %}
                                                </td>
                                                <td>
                                                    {% if plan.items_excluded %}
                                                        <ul class="list-unstyled mb-0">
                                                            {% for item in plan.get_items_excluded_list %}
                                                                <li><i class="fa fa-times text-danger"></i> {{ item }}</li>
                                                            {% endfor %}
                                                        </ul>
                                                    {% else %}
                                                        <span class="text-muted">-</span>
                                                    {% endif %}
                                                </td>
                                                <td>
                                                    <div class="btn-group" role="group">
                                                        <a href="{% url 'panel-manager-edit-payment-plan' plan.id %}" 
                                                           class="btn btn-sm btn-outline-primary" 
                                                           title="{% trans 'ویرایش' %}">
                                                            <i class="fa fa-edit"></i>
                                                        </a>
                                                        <a href="{% url 'panel-manager-toggle-payment-plan' plan.id %}" 
                                                           class="btn btn-sm btn-outline-{% if plan.is_active %}warning{% else %}success{% endif %}" 
                                                           title="{% if plan.is_active %}{% trans 'غیرفعال کردن' %}{% else %}{% trans 'فعال کردن' %}{% endif %}"
                                                           onclick="return confirm('{% if plan.is_active %}{% trans 'آیا از غیرفعال کردن این طرح اطمینان دارید؟' %}{% else %}{% trans 'آیا از فعال کردن این طرح اطمینان دارید؟' %}{% endif %}')">
                                                            <i class="fa fa-{% if plan.is_active %}pause{% else %}play{% endif %}"></i>
                                                        </a>
                                                        <a href="{% url 'panel-manager-delete-payment-plan' plan.id %}" 
                                                           class="btn btn-sm btn-outline-danger" 
                                                           title="{% trans 'حذف' %}"
                                                           onclick="return confirm('{% trans 'آیا از حذف این طرح اطمینان دارید؟ این عملیات قابل بازگشت نیست.' %}')">
                                                            <i class="fa fa-trash"></i>
                                                        </a>
                                                    </div>
                                                </td>
                                            </tr>
                                        {% endfor %}
                                    </tbody>
                                </table>
                            </div>
                        {% else %}
                            <div class="text-center py-4">
                                <i class="fa fa-credit-card fa-3x text-muted mb-3"></i>
                                <h5 class="text-muted">{% trans "هیچ طرح پرداختی یافت نشد" %}</h5>
                                <p class="text-muted">{% trans "برای شروع، اولین طرح پرداخت را ایجاد کنید." %}</p>
                                <a href="{% url 'panel-manager-create-payment-plan' %}" class="btn btn-primary">
                                    <i class="fa fa-plus"></i> {% trans "افزودن طرح جدید" %}
                                </a>
                            </div>
                        {% endif %}
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}

{% block footer %}
<script>
$(document).ready(function() {
    // Auto-hide alerts after 5 seconds
    setTimeout(function() {
        $('.alert').fadeOut('slow');
    }, 5000);
});
</script>
{% endblock %}