{% extends "base.html" %}
{% load static %}
{% load i18n %}

{% block content %}
        <div class="card">
            <div class="card-body">
                <h5 class="card-title">Need help?</h5>
                <p class="card-text">Raise a ticket and we will get back to you as soon as possible.</p>
                <a href="{% url 'create_ticket' request.dealer.slug %}" class="btn btn-phoenix-primary">Raise a Ticket</a>
            </div>
        </div>

{% if messages %}
    {% for message in messages %}
    <div class="alert alert-{{ message.tags }} alert-dismissible fade show" role="alert">
        {{ message }}
        <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
    </div>
    {% endfor %}
{% endif %}

<div class="card">
        <div class="card-body">
                <h5 class="card-title">Tickets</h5>
<div class="table-responsive">
    <table class="table table-striped table-hover">
        <thead class="">
            <tr>
                <th>ID</th>
                <th>Subject</th>
                <th>Status</th>
                <th>Priority</th>
                <th>Created</th>

                <th>Actions</th>
            </tr>
        </thead>
        <tbody>
            {% for ticket in tickets %}
            <tr>
                <td>#{{ ticket.id }}</td>
                <td>{{ ticket.subject }}</td>
                <td>
                    <span class="badge
                        {% if ticket.status == 'open' %}bg-primary
                        {% elif ticket.status == 'in_progress' %}bg-info
                        {% elif ticket.status == 'resolved' %}bg-success
                        {% else %}bg-secondary{% endif %}">
                        {{ ticket.get_status_display }}
                    </span>
                </td>
                <td>
                    <span class="badge
                        {% if ticket.priority == 'low' %}bg-success
                        {% elif ticket.priority == 'medium' %}bg-warning
                        {% elif ticket.priority == 'high' %}bg-danger
                        {% else %}bg-dark{% endif %}">
                        {{ ticket.get_priority_display }}
                    </span>
                </td>
                <td>{{ ticket.created_at|date:"M d, Y H:i" }}</td>

                <td>
                    <a href="{% url 'ticket_detail' request.dealer.slug ticket.id %}" class="btn btn-sm btn-outline-primary">
                        View
                    </a>
                </td>
            </tr>
            {% empty %}
            <tr>
                <td colspan="6" class="text-center">No tickets found.</td>
            </tr>
            {% endfor %}
        </tbody>
    </table>
</div>
</div>
</div>
{% endblock %}