{% extends "base.html" %}

{% block title %}{{ equipamento.nome }} - Cape System{% endblock %}

{% block content %}
<div class="container-fluid mt-4">
    <div class="d-flex justify-content-between align-items-center mb-4">
        <h2><i class="bi bi-tools"></i> {{ equipamento.nome }}</h2>
        <div>
            <a href="{{ url_for('editar_equipamento', id=equipamento.id) }}" class="btn btn-warning">
                <i class="bi bi-pencil"></i> Editar
            </a>
            <a href="{{ url_for('equipamentos') }}" class="btn btn-secondary">
                <i class="bi bi-arrow-left"></i> Voltar
            </a>
        </div>
    </div>

    <div class="row">
        <!-- Coluna Principal -->
        <div class="col-lg-8">
            <!-- Dados Básicos -->
            <div class="card mb-3">
                <div class="card-header">
                    <h5 class="mb-0">Dados Básicos</h5>
                </div>
                <div class="card-body">
                    <div class="row g-3">
                        <div class="col-md-4">
                            <label class="text-muted">Código</label>
                            <p class="mb-0">
                                {% if equipamento.codigo %}
                                <span class="badge bg-secondary">{{ equipamento.codigo }}</span>
                                {% else %}
                                <span class="text-muted">Não informado</span>
                                {% endif %}
                            </p>
                        </div>
                        <div class="col-md-4">
                            <label class="text-muted">Tipo</label>
                            <p class="mb-0">{{ equipamento.tipo or '-' }}</p>
                        </div>
                        <div class="col-md-4">
                            <label class="text-muted">Categoria</label>
                            <p class="mb-0">{{ equipamento.categoria or '-' }}</p>
                        </div>
                        <div class="col-md-12">
                            <label class="text-muted">Descrição</label>
                            <p class="mb-0">{{ equipamento.descricao or 'Sem descrição' }}</p>
                        </div>
                    </div>
                </div>
            </div>

            <!-- Especificações Técnicas -->
            <div class="card mb-3">
                <div class="card-header">
                    <h5 class="mb-0">Especificações Técnicas</h5>
                </div>
                <div class="card-body">
                    <div class="row g-3">
                        <div class="col-md-6">
                            <label class="text-muted">Fabricante</label>
                            <p class="mb-0">{{ equipamento.fabricante or '-' }}</p>
                        </div>
                        <div class="col-md-6">
                            <label class="text-muted">Modelo</label>
                            <p class="mb-0">{{ equipamento.modelo or '-' }}</p>
                        </div>
                        <div class="col-md-4">
                            <label class="text-muted">Ano de Fabricação</label>
                            <p class="mb-0">{{ equipamento.ano_fabricacao or '-' }}</p>
                        </div>
                        <div class="col-md-4">
                            <label class="text-muted">Número de Série</label>
                            <p class="mb-0">
                                {% if equipamento.numero_serie %}
                                <code>{{ equipamento.numero_serie }}</code>
                                {% else %}
                                -
                                {% endif %}
                            </p>
                        </div>
                        <div class="col-md-4">
                            <label class="text-muted">Nº Patrimônio</label>
                            <p class="mb-0">
                                {% if equipamento.patrimonio %}
                                <code>{{ equipamento.patrimonio }}</code>
                                {% else %}
                                -
                                {% endif %}
                            </p>
                        </div>
                        <div class="col-md-4">
                            <label class="text-muted">Potência</label>
                            <p class="mb-0">{{ equipamento.potencia or '-' }}</p>
                        </div>
                        <div class="col-md-4">
                            <label class="text-muted">Capacidade</label>
                            <p class="mb-0">{{ equipamento.capacidade or '-' }}</p>
                        </div>
                        <div class="col-md-4">
                            <label class="text-muted">Voltagem</label>
                            <p class="mb-0">{{ equipamento.voltagem or '-' }}</p>
                        </div>
                        <div class="col-md-6">
                            <label class="text-muted">Estado de Conservação</label>
                            <p class="mb-0">
                                {% if equipamento.estado_conservacao == 'Novo' %}
                                <span class="badge bg-success">{{ equipamento.estado_conservacao }}</span>
                                {% elif equipamento.estado_conservacao == 'Ótimo' %}
                                <span class="badge bg-info">{{ equipamento.estado_conservacao }}</span>
                                {% elif equipamento.estado_conservacao == 'Bom' %}
                                <span class="badge bg-primary">{{ equipamento.estado_conservacao }}</span>
                                {% elif equipamento.estado_conservacao == 'Regular' %}
                                <span class="badge bg-warning">{{ equipamento.estado_conservacao }}</span>
                                {% elif equipamento.estado_conservacao == 'Ruim' %}
                                <span class="badge bg-danger">{{ equipamento.estado_conservacao }}</span>
                                {% else %}
                                -
                                {% endif %}
                            </p>
                        </div>
                        <div class="col-md-6">
                            <label class="text-muted">Manual</label>
                            <p class="mb-0">
                                {% if equipamento.manual_url %}
                                <a href="{{ equipamento.manual_url }}" target="_blank" class="btn btn-sm btn-outline-primary">
                                    <i class="bi bi-file-pdf"></i> Visualizar Manual
                                </a>
                                {% else %}
                                -
                                {% endif %}
                            </p>
                        </div>
                    </div>
                </div>
            </div>

            <!-- Cliente/Localização -->
            <div class="card mb-3">
                <div class="card-header">
                    <h5 class="mb-0">Cliente e Localização</h5>
                </div>
                <div class="card-body">
                    <div class="row g-3">
                        <div class="col-md-6">
                            <label class="text-muted">Cliente</label>
                            <p class="mb-0">
                                {% if equipamento.pessoa %}
                                <a href="{{ url_for('ver_pessoa', id=equipamento.pessoa.id) }}">
                                    {{ equipamento.pessoa.nome }}
                                </a>
                                {% elif equipamento.cliente %}
                                {{ equipamento.cliente.nome }}
                                {% else %}
                                <span class="text-muted">Não vinculado</span>
                                {% endif %}
                            </p>
                        </div>
                        <div class="col-md-6">
                            <label class="text-muted">Localização</label>
                            <p class="mb-0">{{ equipamento.localizacao or '-' }}</p>
                        </div>
                        {% if equipamento.observacoes_localizacao %}
                        <div class="col-md-12">
                            <label class="text-muted">Observações de Localização</label>
                            <p class="mb-0">{{ equipamento.observacoes_localizacao }}</p>
                        </div>
                        {% endif %}
                    </div>
                </div>
            </div>

            <!-- Histórico de OS -->
            {% if oss %}
            <div class="card mb-3">
                <div class="card-header">
                    <h5 class="mb-0">Histórico de Ordens de Serviço</h5>
                </div>
                <div class="card-body">
                    <div class="table-responsive">
                        <table class="table table-sm table-hover">
                            <thead>
                                <tr>
                                    <th>OS</th>
                                    <th>Data</th>
                                    <th>Status</th>
                                    <th>Observação</th>
                                    <th>Ações</th>
                                </tr>
                            </thead>
                            <tbody>
                                {% for eq_os in oss %}
                                <tr>
                                    <td>
                                        <a href="{{ url_for('editar_ordem_servico', id=eq_os.ordem_servico.id) }}">
                                            OS #{{ eq_os.ordem_servico.numero_os }}
                                        </a>
                                    </td>
                                    <td>{{ eq_os.ordem_servico.data_abertura.strftime('%d/%m/%Y') }}</td>
                                    <td>
                                        {% if eq_os.ordem_servico.status == 'pendente' %}
                                        <span class="badge bg-warning">Pendente</span>
                                        {% elif eq_os.ordem_servico.status == 'em_atendimento' %}
                                        <span class="badge bg-info">Em Atendimento</span>
                                        {% elif eq_os.ordem_servico.status == 'concluido' %}
                                        <span class="badge bg-success">Concluído</span>
                                        {% elif eq_os.ordem_servico.status == 'faturado' %}
                                        <span class="badge bg-primary">Faturado</span>
                                        {% else %}
                                        <span class="badge bg-secondary">{{ eq_os.ordem_servico.status }}</span>
                                        {% endif %}
                                    </td>
                                    <td>{{ eq_os.observacoes or '-' }}</td>
                                    <td>
                                        <a href="{{ url_for('editar_ordem_servico', id=eq_os.ordem_servico.id) }}" class="btn btn-sm btn-info">
                                            <i class="bi bi-eye"></i>
                                        </a>
                                    </td>
                                </tr>
                                {% endfor %}
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
            {% endif %}

            {% if equipamento.observacoes %}
            <div class="card mb-3">
                <div class="card-header">
                    <h5 class="mb-0">Observações Gerais</h5>
                </div>
                <div class="card-body">
                    <p class="mb-0">{{ equipamento.observacoes }}</p>
                </div>
            </div>
            {% endif %}
        </div>

        <!-- Coluna Lateral -->
        <div class="col-lg-4">
            <!-- Status -->
            <div class="card mb-3">
                <div class="card-header">
                    <h5 class="mb-0">Status</h5>
                </div>
                <div class="card-body">
                    {% if equipamento.status == 'ativo' %}
                    <span class="badge bg-success fs-6">
                        <i class="bi bi-check-circle"></i> Ativo
                    </span>
                    {% elif equipamento.status == 'manutencao' %}
                    <span class="badge bg-warning fs-6">
                        <i class="bi bi-wrench"></i> Em Manutenção
                    </span>
                    {% elif equipamento.status == 'inativo' %}
                    <span class="badge bg-secondary fs-6">
                        <i class="bi bi-x-circle"></i> Inativo
                    </span>
                    {% elif equipamento.status == 'baixado' %}
                    <span class="badge bg-dark fs-6">
                        <i class="bi bi-trash"></i> Baixado
                    </span>
                    {% else %}
                    <span class="badge bg-info fs-6">{{ equipamento.status }}</span>
                    {% endif %}
                </div>
            </div>

            <!-- Garantia -->
            <div class="card mb-3">
                <div class="card-header">
                    <h5 class="mb-0"><i class="bi bi-shield-check"></i> Garantia</h5>
                </div>
                <div class="card-body">
                    {% if equipamento.data_compra %}
                    <p class="mb-2">
                        <strong>Compra:</strong><br>
                        {{ equipamento.data_compra.strftime('%d/%m/%Y') }}
                    </p>
                    {% endif %}
                    
                    {% if equipamento.data_garantia %}
                    <p class="mb-2">
                        <strong>Válida até:</strong><br>
                        {{ equipamento.data_garantia.strftime('%d/%m/%Y') }}
                    </p>
                    
                    {% if equipamento.em_garantia() %}
                    <div class="alert alert-success mb-2">
                        <i class="bi bi-shield-check"></i> <strong>Em garantia</strong>
                    </div>
                    {% else %}
                    <div class="alert alert-warning mb-2">
                        <i class="bi bi-shield-x"></i> <strong>Vencida</strong>
                    </div>
                    {% endif %}
                    {% else %}
                    <p class="text-muted mb-0">Sem informações de garantia</p>
                    {% endif %}
                    
                    {% if equipamento.fornecedor_garantia %}
                    <p class="mb-0">
                        <strong>Fornecedor:</strong><br>
                        {{ equipamento.fornecedor_garantia }}
                    </p>
                    {% endif %}
                </div>
            </div>

            <!-- Manutenção -->
            <div class="card mb-3">
                <div class="card-header">
                    <h5 class="mb-0"><i class="bi bi-wrench"></i> Manutenção</h5>
                </div>
                <div class="card-body">
                    {% if equipamento.periodicidade_manutencao %}
                    <p class="mb-2">
                        <strong>Periodicidade:</strong><br>
                        A cada {{ equipamento.periodicidade_manutencao }} dias
                    </p>
                    {% endif %}
                    
                    {% if equipamento.data_ultima_manutencao %}
                    <p class="mb-2">
                        <strong>Última Manutenção:</strong><br>
                        {{ equipamento.data_ultima_manutencao.strftime('%d/%m/%Y') }}
                    </p>
                    {% endif %}
                    
                    {% if equipamento.proxima_manutencao %}
                    <p class="mb-2">
                        <strong>Próxima Manutenção:</strong><br>
                        {{ equipamento.proxima_manutencao.strftime('%d/%m/%Y') }}
                    </p>
                    
                    {% if equipamento.precisa_manutencao() %}
                    <div class="alert alert-danger mb-0">
                        <i class="bi bi-exclamation-triangle"></i> <strong>Manutenção urgente!</strong><br>
                        <small>Vence em menos de 7 dias</small>
                    </div>
                    {% endif %}
                    {% else %}
                    <p class="text-muted mb-0">Manutenção não agendada</p>
                    {% endif %}
                </div>
            </div>

            <!-- Controle -->
            <div class="card">
                <div class="card-header">
                    <h5 class="mb-0">Controle</h5>
                </div>
                <div class="card-body">
                    <p class="mb-2">
                        <strong>Cadastrado em:</strong><br>
                        {{ equipamento.data_cadastro.strftime('%d/%m/%Y %H:%M') if equipamento.data_cadastro else '-' }}
                    </p>
                    {% if equipamento.data_atualizacao %}
                    <p class="mb-0">
                        <strong>Última atualização:</strong><br>
                        {{ equipamento.data_atualizacao.strftime('%d/%m/%Y %H:%M') }}
                    </p>
                    {% endif %}
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}