{% extends 'netbox_meraki/base.html' %}
{% load static %}

{% block page_content %}
<div class="row">
    <div class="col-md-12">
        <h1>Sync Reviews</h1>
        <nav aria-label="breadcrumb">
            <ol class="breadcrumb">
                <li class="breadcrumb-item"><a href="{% url 'plugins:netbox_meraki:dashboard' %}">Dashboard</a></li>
                <li class="breadcrumb-item active">Reviews</li>
            </ol>
        </nav>
    </div>
</div>

<div class="row mt-4">
    <div class="col-md-12">
        <div class="card">
            <div class="card-header">
                <strong>All Sync Reviews</strong>
            </div>
            <div class="card-body">
                {% if reviews %}
                <div class="table-responsive">
                    <table class="table table-striped table-hover">
                        <thead>
                            <tr>
                                <th>ID</th>
                                <th>Created</th>
                                <th>Status</th>
                                <th>Total Items</th>
                                <th>Approved</th>
                                <th>Rejected</th>
                                <th>Actions</th>
                            </tr>
                        </thead>
                        <tbody>
                            {% for review in reviews %}
                            <tr>
                                <td><strong>#{{ review.pk }}</strong></td>
                                <td>{{ review.created }}</td>
                                <td>
                                    {% if review.status == 'pending' %}
                                        <span class="badge bg-warning">{{ review.status|upper }}</span>
                                    {% elif review.status == 'approved' %}
                                        <span class="badge bg-success">{{ review.status|upper }}</span>
                                    {% elif review.status == 'rejected' %}
                                        <span class="badge bg-danger">{{ review.status|upper }}</span>
                                    {% elif review.status == 'partially_approved' %}
                                        <span class="badge bg-info">PARTIALLY APPROVED</span>
                                    {% elif review.status == 'applied' %}
                                        <span class="badge bg-primary">{{ review.status|upper }}</span>
                                    {% endif %}
                                </td>
                                <td>{{ review.items_total }}</td>
                                <td><span class="badge bg-success">{{ review.items_approved }}</span></td>
                                <td><span class="badge bg-danger">{{ review.items_rejected }}</span></td>
                                <td>
                                    <a href="{% url 'plugins:netbox_meraki:review_detail' pk=review.pk %}" class="btn btn-sm btn-primary">
                                        <i class="mdi mdi-eye"></i> View
                                    </a>
                                </td>
                            </tr>
                            {% endfor %}
                        </tbody>
                    </table>
                </div>
                
                {% if is_paginated %}
                <nav aria-label="Page navigation">
                    <ul class="pagination">
                        {% if page_obj.has_previous %}
                        <li class="page-item">
                            <a class="page-link" href="?page=1">First</a>
                        </li>
                        <li class="page-item">
                            <a class="page-link" href="?page={{ page_obj.previous_page_number }}">Previous</a>
                        </li>
                        {% endif %}
                        
                        <li class="page-item active">
                            <span class="page-link">Page {{ page_obj.number }} of {{ page_obj.paginator.num_pages }}</span>
                        </li>
                        
                        {% if page_obj.has_next %}
                        <li class="page-item">
                            <a class="page-link" href="?page={{ page_obj.next_page_number }}">Next</a>
                        </li>
                        <li class="page-item">
                            <a class="page-link" href="?page={{ page_obj.paginator.num_pages }}">Last</a>
                        </li>
                        {% endif %}
                    </ul>
                </nav>
                {% endif %}
                {% else %}
                <p class="text-muted">No sync reviews found.</p>
                {% endif %}
            </div>
        </div>
    </div>
</div>

<div class="row mt-4">
    <div class="col-md-12">
        <a href="{% url 'plugins:netbox_meraki:dashboard' %}" class="btn btn-secondary">
            <i class="mdi mdi-arrow-left"></i> Back to Dashboard
        </a>
    </div>
</div>
{% endblock %}