{% extends 'layouts/base.html' %}

{% block title %}مدیریت دسته‌بندی‌ها{% endblock %}

{% block content %}
<div class="row">
    <div class="col-lg-5 mb-4">
        <div class="card shadow-sm">
            <div class="card-body p-4">
                <h1 class="h5 mb-4">افزودن دسته‌بندی</h1>

                <form method="post" novalidate>
                    {% csrf_token %}

                    {% if form.non_field_errors %}
                        <div class="alert alert-danger">{{ form.non_field_errors }}</div>
                    {% endif %}

                    <div class="mb-3">
                        <label class="form-label">{{ form.name.label }}</label>
                        {{ form.name }}
                        {% for error in form.name.errors %}
                            <div class="text-danger small mt-1">{{ error }}</div>
                        {% endfor %}
                    </div>

                    <div class="mb-3">
                        <div class="form-check">
                            {{ form.is_active }}
                            <label class="form-check-label">{{ form.is_active.label }}</label>
                        </div>
                    </div>

                    <button type="submit" class="btn btn-dark">ذخیره</button>
                </form>
            </div>
        </div>
    </div>

    <div class="col-lg-7">
        <div class="card shadow-sm">
            <div class="card-body">
                <h2 class="h5 mb-3">لیست دسته‌بندی‌ها</h2>

                <table class="table mb-0">
                    <thead>
                        <tr>
                            <th>نام</th>
                            <th>وضعیت</th>
                        </tr>
                    </thead>
                    <tbody>
                        {% for category in categories %}
                            <tr>
                                <td>{{ category.name }}</td>
                                <td>
                                    {% if category.is_active %}
                                        <span class="badge bg-success">فعال</span>
                                    {% else %}
                                        <span class="badge bg-secondary">غیرفعال</span>
                                    {% endif %}
                                </td>
                            </tr>
                        {% empty %}
                            <tr>
                                <td colspan="2" class="text-center">هنوز دسته‌بندی ثبت نشده است.</td>
                            </tr>
                        {% endfor %}
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>
{% endblock %}