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

{% block title %}Journal Entry {{ entry.entry_number }}{% endblock %}

{% block content %}
<div class="container mt-4">
    <div class="card">
        <div class="card-header d-flex justify-content-between align-items-center">
            <h2 class="mb-0">Journal Entry: {{ entry.entry_number }}</h2>
            <div>
                <a href="{% url 'edit_journal_entry' entry.pk %}" class="btn btn-sm btn-primary me-2">
                    <i class="bi bi-pencil"></i> Edit
                </a>
                <a href="{% url 'journal_entry_list' %}" class="btn btn-sm btn-secondary">
                    <i class="bi bi-arrow-left"></i> Back to List
                </a>
            </div>
        </div>
        
        <div class="card-body">
            <!-- Entry Header -->
            <div class="row mb-4">
                <div class="col-md-3">
                    <strong>Date:</strong>
                    <p>{{ entry.date|date:"Y-m-d" }}</p>
                </div>
                <div class="col-md-3">
                    <strong>Status:</strong>
                    <p>
                        <span class="badge 
                            {% if entry.status == 'posted' %}bg-success
                            {% elif entry.status == 'draft' %}bg-warning text-dark
                            {% else %}bg-secondary{% endif %}">
                            {{ entry.get_status_display }}
                        </span>
                    </p>
                </div>
                <div class="col-md-3">
                    <strong>Reference:</strong>
                    <p>{{ entry.reference|default:"-" }}</p>
                </div>
                <div class="col-md-3">
                    <strong>Job:</strong>
                    <p>
                        {% if entry.job %}
                        <a href="{% url 'job_detail' entry.job.pk %}">{{ entry.job.name }}</a>
                        {% else %}-{% endif %}
                    </p>
                </div>
            </div>
            
            <div class="mb-4">
                <strong>Description:</strong>
                <p>{{ entry.description|linebreaksbr }}</p>
            </div>
            
            <!-- Transactions Table -->
            <div class="table-responsive">
                <table class="table">
                    <thead class="table-light">
                        <tr>
                            <th>Account</th>
                            <th class="text-end">Debit</th>
                            <th class="text-end">Credit</th>
                            <th>Description</th>
                        </tr>
                    </thead>
                    <tbody>
                        {% for transaction in entry.transactions.all %}
                        <tr>
                            <td>{{ transaction.account.code }} - {{ transaction.account.name }}</td>
                            <td class="text-end">{{ transaction.debit|floatformat:2 }}</td>
                            <td class="text-end">{{ transaction.credit|floatformat:2 }}</td>
                            <td>{{ transaction.description|default:"-" }}</td>
                        </tr>
                        {% endfor %}
                    </tbody>
                    <tfoot class="table-active">
                        <tr>
                            <td><strong>Total</strong></td>
                            <td class="text-end"><strong>{{ entry.transactions.all|sum_debits|floatformat:2 }}</strong></td>
                            <td class="text-end"><strong>{{ entry.transactions.all|sum_credits|floatformat:2 }}</strong></td>
                            <td></td>
                        </tr>
                    </tfoot>
                </table>
            </div>
            
            <!-- Audit Info -->
            <div class="mt-4 pt-3 border-top">
                <small class="text-muted">
                    Created by {{ entry.created_by }} on {{ entry.created_at|date:"Y-m-d H:i" }}
                    {% if entry.created_at != entry.updated_at %}
                    <br>Last updated on {{ entry.updated_at|date:"Y-m-d H:i" }}
                    {% endif %}
                </small>
            </div>
        </div>
    </div>
</div>
{% endblock %}