{% extends "base.html" %}

{% block title %}Movimentações - {{ produto.nome }}{% endblock %}

{% block content %}
<div class="container-fluid mt-4">
    <!-- Cabeçalho -->
    <div class="row mb-4">
        <div class="col-md-8">
            <h2><i class="bi bi-clock-history"></i> Histórico de Movimentações</h2>
            <p class="text-muted mb-0">Produto: <strong>{{ produto.nome }}</strong></p>
            {% if produto.codigo_produto %}
            <small class="text-muted">Código: {{ produto.codigo_produto }}</small>
            {% endif %}
        </div>
        <div class="col-md-4 text-end">
            <button type="button" class="btn btn-secondary" onclick="capeVoltarOu('{{ url_for('estoque_lista') }}')">
                <i class="bi bi-arrow-left"></i> Voltar
            </button>
            <a href="{{ url_for('editar_produto', id=produto.id) }}" class="btn btn-primary">
                <i class="bi bi-pencil"></i> Editar Produto
            </a>
        </div>
    </div>

    <!-- Informações do Produto -->
    <div class="row mb-4">
        <div class="col-md-3">
            <div class="card border-primary">
                <div class="card-body text-center">
                    <h6 class="text-muted mb-2">Estoque Atual</h6>
                    <h2 class="mb-0 text-primary">{{ "%.2f"|format(produto.estoque_atual or 0) }}</h2>
                    <small class="text-muted">{{ produto.unidade_comercial or 'UN' }}</small>
                </div>
            </div>
        </div>
        <div class="col-md-3">
            <div class="card border-warning">
                <div class="card-body text-center">
                    <h6 class="text-muted mb-2">Estoque Mínimo</h6>
                    <h2 class="mb-0 text-warning">{{ "%.2f"|format(produto.estoque_minimo or 0) }}</h2>
                    <small class="text-muted">{{ produto.unidade_comercial or 'UN' }}</small>
                </div>
            </div>
        </div>
        <div class="col-md-3">
            <div class="card border-success">
                <div class="card-body text-center">
                    <h6 class="text-muted mb-2">Valor Venda</h6>
                    <h2 class="mb-0 text-success">R$ {{ "%.2f"|format(produto.valor_venda or 0) }}</h2>
                    <small class="text-muted">por {{ produto.unidade_comercial or 'UN' }}</small>
                </div>
            </div>
        </div>
        <div class="col-md-3">
            <div class="card border-info">
                <div class="card-body text-center">
                    <h6 class="text-muted mb-2">Valor em Estoque</h6>
                    <h2 class="mb-0 text-info">R$ {{ "%.2f"|format((produto.estoque_atual or 0) * (produto.valor_venda or 0)) }}</h2>
                    <small class="text-muted">total</small>
                </div>
            </div>
        </div>
    </div>

    <!-- Status do Estoque -->
    <div class="alert {% if (produto.estoque_atual or 0) == 0 %}alert-danger{% elif (produto.estoque_atual or 0) <= (produto.estoque_minimo or 0) %}alert-warning{% else %}alert-success{% endif %}">
        <i class="bi {% if (produto.estoque_atual or 0) == 0 %}bi-x-circle{% elif (produto.estoque_atual or 0) <= (produto.estoque_minimo or 0) %}bi-exclamation-triangle{% else %}bi-check-circle{% endif %}"></i>
        <strong>Status:</strong>
        {% if (produto.estoque_atual or 0) == 0 %}
            Estoque zerado - produto indisponível
        {% elif (produto.estoque_atual or 0) <= (produto.estoque_minimo or 0) %}
            Estoque abaixo do mínimo - necessário reposição
        {% else %}
            Estoque adequado
        {% endif %}
    </div>

    <!-- Histórico de Movimentações -->
    <div class="card">
        <div class="card-header">
            <h5 class="mb-0">
                <i class="bi bi-list-ul"></i> Histórico de Movimentações
                <span class="badge bg-primary ms-2">{{ movimentos|length }}</span>
            </h5>
        </div>
        <div class="card-body p-0">
            {% if movimentos %}
            <div class="table-responsive">
                <table class="table table-hover mb-0">
                    <thead class="table-light">
                        <tr>
                            <th>Data/Hora</th>
                            <th>Tipo</th>
                            <th>Origem</th>
                            <th>Documento</th>
                            <th class="text-center">Quantidade</th>
                            <th class="text-end">Valor Unit.</th>
                            <th class="text-center">Estoque Antes</th>
                            <th class="text-center">Estoque Depois</th>
                            <th>Observações</th>
                        </tr>
                    </thead>
                    <tbody>
                        {% for mov in movimentos %}
                        <tr>
                            <td>
                                <small>{{ mov.data_movimento.strftime('%d/%m/%Y') if mov.data_movimento else 'N/A' }}</small><br>
                                <small class="text-muted">{{ mov.data_movimento.strftime('%H:%M') if mov.data_movimento else '' }}</small>
                            </td>
                            <td>
                                {% if mov.tipo == 'entrada' %}
                                <span class="badge bg-success">
                                    <i class="bi bi-arrow-down-circle"></i> Entrada
                                </span>
                                {% elif mov.tipo == 'saida' %}
                                <span class="badge bg-danger">
                                    <i class="bi bi-arrow-up-circle"></i> Saída
                                </span>
                                {% elif mov.tipo == 'ajuste' %}
                                <span class="badge bg-warning text-dark">
                                    <i class="bi bi-wrench"></i> Ajuste
                                </span>
                                {% else %}
                                <span class="badge bg-secondary">{{ mov.tipo }}</span>
                                {% endif %}
                            </td>
                            <td>
                                <small>{{ mov.origem|replace('_', ' ')|title }}</small>
                                {% if mov.referencia %}
                                <br><small class="text-muted">Ref: {{ mov.referencia }}</small>
                                {% endif %}
                            </td>
                            <td>
                                {% if mov.documento %}
                                <code>{{ mov.documento }}</code>
                                {% else %}
                                <span class="text-muted">-</span>
                                {% endif %}
                            </td>
                            <td class="text-center">
                                <strong class="{% if mov.quantidade > 0 %}text-success{% else %}text-danger{% endif %}">
                                    {{ "%+.2f"|format(mov.quantidade) }}
                                </strong>
                            </td>
                            <td class="text-end">
                                {% if mov.valor_unitario %}
                                R$ {{ "%.2f"|format(mov.valor_unitario) }}
                                {% else %}
                                <span class="text-muted">-</span>
                                {% endif %}
                            </td>
                            <td class="text-center">
                                <span class="badge bg-light text-dark">{{ "%.2f"|format(mov.estoque_anterior or 0) }}</span>
                            </td>
                            <td class="text-center">
                                <span class="badge bg-primary">{{ "%.2f"|format(mov.estoque_resultante or 0) }}</span>
                            </td>
                            <td>
                                {% if mov.observacoes %}
                                <small>{{ mov.observacoes }}</small>
                                {% else %}
                                <span class="text-muted">-</span>
                                {% endif %}
                            </td>
                        </tr>
                        {% endfor %}
                    </tbody>
                </table>
            </div>
            {% else %}
            <div class="alert alert-info m-3">
                <i class="bi bi-info-circle"></i> Nenhuma movimentação registrada para este produto.
            </div>
            {% endif %}
        </div>
    </div>

    <!-- Resumo de Movimentações -->
    {% if movimentos %}
    <div class="row mt-4">
        <div class="col-md-4">
            <div class="card border-success">
                <div class="card-body">
                    <h6 class="text-muted mb-2">Total de Entradas</h6>
                    <h4 class="mb-0 text-success">
                        {{ "%.2f"|format(movimentos|selectattr('tipo', 'equalto', 'entrada')|sum(attribute='quantidade') or 0) }}
                    </h4>
                </div>
            </div>
        </div>
        <div class="col-md-4">
            <div class="card border-danger">
                <div class="card-body">
                    <h6 class="text-muted mb-2">Total de Saídas</h6>
                    <h4 class="mb-0 text-danger">
                        {{ "%.2f"|format(movimentos|selectattr('tipo', 'equalto', 'saida')|sum(attribute='quantidade')|abs or 0) }}
                    </h4>
                </div>
            </div>
        </div>
        <div class="col-md-4">
            <div class="card border-primary">
                <div class="card-body">
                    <h6 class="text-muted mb-2">Saldo</h6>
                    <h4 class="mb-0 text-primary">
                        {{ "%.2f"|format(produto.estoque_atual or 0) }}
                    </h4>
                </div>
            </div>
        </div>
    </div>
    {% endif %}
</div>
{% endblock %}