@extends('adminlte.app')

@section('content')

<div class="content-wrapper pb-3">
    <div class="content-header">
        <div class="container-fluid">
            <div class="row mb-2">
                <div class="col-sm-6">
                    <h1 class="m-0">Veículos</h1>
                </div>
            </div>
        </div>
    </div>

    @if ($message = Session::get('success'))
        <div class="alert alert-success"><p>{{ $message }}</p></div>
    @endif

    @if ($message = Session::get('error'))
        <div class="alert alert-danger"><p>{{ $message }}</p></div>
    @endif

    <div class="card mx-3 mt-3">
        <div class="card-header">
            <div class="row">  
                <div class="col-3">
                    Lista de Veículos
                </div>
                <div class="col-md-9 text-right">
                    @if($permissao->criar_veiculos)
                        <a href="{{ route('cartrack_vehicles_create') }}">
                            <button class="btn btn-primary rounded">Novo Veículo</button>
                        </a>
                    @endif
                </div>
            </div>
        </div>

        <div class="card-body">
            <div class="row ">
                <div class="col-sm-12 table-responsive px-2">
                    <table class="table table-striped table-bordered table-hover" id="tabelaveiculos">
                        <thead>
                            <tr>
                                <th>Matrícula</th>
                                <th>Marca</th>
                                <th>Modelo</th>
                                <th>Ano</th>
                                <th>Tipo</th>
                                <th>Categoria</th>
                                <th>Estado</th>
                                <th>Base</th>
                                <th>Proprietário</th>
                                <th>Motorista Atual</th>
                                <th>Alertas</th>
                                <th>Status Atual</th>
                                <th>Ações</th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach($veiculos as $veiculo)
                                <tr>
                                    <td>{{ $veiculo->matricula }}</td>
                                    <td>{{ $veiculo->marca }}</td>
                                    <td>{{ $veiculo->modelo }}</td>
                                    <td>{{ $veiculo->ano }}</td>
                                    <td>@if($veiculo->tipo_viatura == "rigido") Rígido @elseif($veiculo->tipo_viatura == "com_atrelado") Com Atrelado @else - @endif</td>
                                    <td>{{ $veiculo->tipoVeiculo->nome ?? '-' }}</td>
                                    <td>{{ $veiculo->estado }}</td>
                                    <td>{{ $veiculo->base_operacional }}</td>
                                    <td>{{ $veiculo->proprietario }}</td>
                                    <td>
                                        @if($veiculo->motorista_atual)
                                            {{ trim(($veiculo->motorista_atual->first_name ?? '') . ' ' . ($veiculo->motorista_atual->last_name ?? '')) }}
                                        @else
                                            -
                                        @endif
                                    </td>
                                    <td>
                                        @if($veiculo->alerta_vencimentos['bloqueado'])
                                            <span class="badge badge-danger">Bloqueado</span>
                                        @elseif($veiculo->alerta_vencimentos['tem_alertas'])
                                            <span class="badge badge-warning">{{ count($veiculo->alerta_vencimentos['alertas']) }} alerta(s)</span>
                                        @else
                                            <span class="badge badge-success">Sem alertas</span>
                                        @endif
                                    </td>
                                    <td>
                                        {{ $veiculo->ultimoStatus->status ?? '-' }}
                                    </td>

                                    <td class="d-flex justify-content-center">

                                        <button type="button"
                                            class="btn btn-info btn-sm mr-1"
                                            onclick="funcChamaModalStatusVeiculo({{ $veiculo->id }})"
                                            title="Status do Veículo">
                                            <i class="fas fa-car"></i>
                                          
                                        </button>

                                        <button type="button"
                                            class="btn btn-info btn-sm mr-1"
                                            data-toggle="modal"
                                            data-target="#veiculoDocumentosModal{{ $veiculo->id }}"
                                            title="Documentos">
                                            <i class="fas fa-paperclip"></i>
                                            <span class="ml-1">{{ $veiculo->documentos->count() }}</span>
                                        </button>

                                        <button type="button"
                                            class="btn btn-warning btn-sm mr-1"
                                            data-toggle="modal"
                                            data-target="#veiculoInspecoesModal{{ $veiculo->id }}"
                                            title="Inspeções e vencimentos">
                                            <i class="fas fa-clipboard-check"></i>
                                            <span class="ml-1">{{ $veiculo->inspecoesControles->count() }}</span>
                                        </button>

                                        @if($permissao->alterar_veiculos)
                                            <a href="{{ route('cartrack_vehicles_edit', $veiculo->id) }}"
                                               class="btn btn-primary btn-sm"
                                               title="Editar">
                                                <i class="fas fa-pencil-alt"></i>
                                            </a>
                                        @endif

                                        @if($permissao->excluir_veiculos)
                                            <form method="POST"
                                                action="{{ route('cartrack_vehicles_delete', $veiculo->id) }}"
                                                  onsubmit="return confirm('Deseja realmente excluir o veículo?')">
                                                @csrf
                                                @method('DELETE')

                                                <button class="btn btn-danger btn-sm ml-1" title="Excluir">
                                                    <i class="fa fa-trash"></i>
                                                </button>
                                            </form>
                                        @endif

                                    </td>
                                </tr>
                            @endforeach
                        </tbody>
                    </table>
                    <button type="button"
                        id="btnChamaModalStatusVeiculo"
                        class="btn btn-info btn-sm mr-1 d-none"
                        data-toggle="modal"
                        data-target="#modalStatusVeiculo"
                        title="Status do Veículo">
                        <i class="fas fa-car"></i>
                        
                    </button>
                    
                    @foreach($veiculos as $veiculo)
                        <x-cartrack.modal-documentos
                            :modal-id="'veiculoDocumentosModal' . $veiculo->id"
                            :titulo="$veiculo->matricula ?: (($veiculo->marca ?? '') . ' ' . ($veiculo->modelo ?? 'Veículo'))"
                            :documentos="$veiculo->documentos"
                            documentavel-type="veiculo"
                            :documentavel-id="$veiculo->id"
                            :pode-anexar="$permissao->alterar_veiculos"
                        />

                        <x-cartrack.modal-inspecoes-controles
                            :modal-id="'veiculoInspecoesModal' . $veiculo->id"
                            :titulo="$veiculo->matricula ?: (($veiculo->marca ?? '') . ' ' . ($veiculo->modelo ?? 'Veículo'))"
                            :inspecoes="$veiculo->inspecoesControles"
                            :pode-gerir="$permissao->alterar_veiculos"
                            :association-value="'veiculo:' . $veiculo->id"
                        />
                    @endforeach
                    <x-cartrack.modal-status-veiculo />
                </div>
            </div>
        </div>
    </div>
</div>

<!-- DataTables  & Plugins -->
<script src={{ asset('/plugins/datatables/jquery.dataTables.min.js') }}></script>
<script src={{ asset('/plugins/datatables-bs4/js/dataTables.bootstrap4.min.js') }}></script>
<script src={{ asset('/plugins/datatables-responsive/js/dataTables.responsive.min.js') }}></script>
<script src={{ asset('/plugins/datatables-responsive/js/responsive.bootstrap4.min.js') }}></script>
<script src={{ asset('/plugins/datatables-buttons/js/dataTables.buttons.min.js') }}></script>
<script src={{ asset('/plugins/datatables-buttons/js/buttons.bootstrap4.min.js') }}></script>
<script src={{ asset('/plugins/jszip/jszip.min.js') }}></script>
<script src={{ asset('/plugins/pdfmake/pdfmake.min.js') }}></script>
<script src={{ asset('/plugins/pdfmake/vfs_fonts.js') }}></script>
<script src={{ asset('/plugins/datatables-buttons/js/buttons.html5.min.js') }}></script>
<script src={{ asset('/plugins/datatables-buttons/js/buttons.print.min.js') }}></script>
<script src={{ asset('/plugins/datatables-buttons/js/buttons.colVis.min.js') }}></script>

{{-- DataTables --}}

<script>
    $('#tabelaveiculos').DataTable({
        paging: true,
        lengthChange: true,
        searching: true,
        ordering: true,
        info: true,
        autoWidth: false,
        responsive: true,
        order: [[0, "asc"]],
        buttons: ["csv", "excel", "pdf", {extend:"print", text:"Imprimir"}, {extend:"colvis", text:"Colunas"}],
        lengthMenu: [[-1, 10, 25, 50], ["Todos", 10, 25, 50]],
        pageLength: 10,
        language: {
            sProcessing: "Processando...",
            sLengthMenu: "Registros _MENU_",
            sZeroRecords: "Nenhum resultado encontrado",
            sInfo: "Mostrando _START_ até _END_ de _TOTAL_",
            sSearch: "Buscar:",
            oPaginate: {
                sNext: "Próximo",
                sPrevious: "Anterior"
            }
        }
    }).buttons().container().appendTo('#tabelaveiculos_wrapper .col-md-6:eq(0)');

    const statusVeiculoCampos = [
        { key: 'battery_percentage', label: 'Bateria', type: 'percentage' },
        { key: 'bearing', label: 'Direção', type: 'number' },
        { key: 'created_at', label: 'Criado em', type: 'datetime' },
        { key: 'event_ts', label: 'Data do evento', type: 'datetime' },
        { key: 'fuel_consumed', label: 'Combustível Consumido', type: 'decimal' },
        { key: 'fuel_level', label: 'Nível de Combustível', type: 'decimal' },
        { key: 'fuel_percentage', label: 'Combustível (%)', type: 'percentage' },
        { key: 'id', label: 'ID do Status', type: 'number' },
        { key: 'idling', label: 'Em marcha lenta', type: 'boolean' },
        { key: 'ignition', label: 'Ignição', type: 'boolean' },
        { key: 'io_disarm', label: 'Desarme', type: 'text' },
        { key: 'io_panic', label: 'Pânico', type: 'text' },
        { key: 'latitude', label: 'Latitude', type: 'coordinate' },
        { key: 'longitude', label: 'Longitude', type: 'coordinate' },
        { key: 'odometer', label: 'Odômetro', type: 'number' },
        { key: 'position_description', label: 'Posição', type: 'text' },
        { key: 'rpm', label: 'RPM', type: 'number' },
        { key: 'speed', label: 'Velocidade', type: 'number' },
        { key: 'updated_at', label: 'Atualizado em', type: 'datetime' },
        { key: 'veiculo_id', label: 'ID do Veículo', type: 'number' }
    ];

    const statusVeiculoResumo = [
        { key: 'battery_percentage', label: 'Bateria', type: 'percentage' },
        { key: 'fuel_percentage', label: 'Combustível', type: 'percentage' },
        { key: 'fuel_consumed', label: 'Consumo', type: 'decimal' },
        { key: 'speed', label: 'Velocidade', type: 'number' },
        { key: 'rpm', label: 'RPM', type: 'number' },
        { key: 'ignition', label: 'Ignição', type: 'boolean' }
    ];

    function escapeHtmlStatusVeiculo(valor) {
        if (valor === null || valor === undefined) {
            return '';
        }

        return String(valor)
            .replace(/&/g, '&amp;')
            .replace(/</g, '&lt;')
            .replace(/>/g, '&gt;')
            .replace(/"/g, '&quot;')
            .replace(/'/g, '&#039;');
    }

    function formatarDataStatusVeiculo(valor) {
        if (!valor) {
            return 'Sem informação';
        }

        const data = new Date(valor);

        if (Number.isNaN(data.getTime())) {
            return valor;
        }

        return new Intl.DateTimeFormat('pt-PT', {
            day: '2-digit',
            month: '2-digit',
            year: 'numeric',
            hour: '2-digit',
            minute: '2-digit',
            second: '2-digit'
        }).format(data);
    }

    function formatarDataCurtaStatusVeiculo(valor) {
        if (!valor) {
            return 'Sem informação';
        }

        const data = new Date(valor);

        if (Number.isNaN(data.getTime())) {
            return valor;
        }

        return new Intl.DateTimeFormat('pt-PT', {
            day: '2-digit',
            month: '2-digit',
            year: 'numeric'
        }).format(data);
    }

    function formatarNumeroStatusVeiculo(valor, casasDecimais) {
        const numero = Number(valor);

        if (Number.isNaN(numero)) {
            return valor;
        }

        return new Intl.NumberFormat('pt-PT', {
            minimumFractionDigits: casasDecimais,
            maximumFractionDigits: casasDecimais
        }).format(numero);
    }

    function formatarValorStatusVeiculo(campo, valor) {
        if (valor === null || valor === undefined || valor === '') {
            return 'Sem informação';
        }

        switch (campo.type) {
            case 'boolean':
                return valor ? 'Sim' : 'Não';
            case 'datetime':
                return formatarDataStatusVeiculo(valor);
            case 'percentage':
                return `${formatarNumeroStatusVeiculo(valor, 0)}%`;
            case 'decimal':
                return formatarNumeroStatusVeiculo(valor, 2);
            case 'coordinate':
                return formatarNumeroStatusVeiculo(valor, 6);
            case 'number':
                return formatarNumeroStatusVeiculo(valor, 0);
            default:
                return valor;
        }
    }

    function formatarTextoStatusVeiculo(valor) {
        if (valor === null || valor === undefined || valor === '') {
            return 'Sem informação';
        }

        return String(valor);
    }

    function formatarDiasStatusVeiculo(dias, vencido) {
        if (dias === null || dias === undefined || dias === '') {
            return 'Sem informação';
        }

        const numero = Number(dias);

        if (Number.isNaN(numero)) {
            return dias;
        }

        if (vencido) {
            return `Vencido há ${Math.abs(numero)} dia(s)`;
        }

        return `Vence em ${numero} dia(s)`;
    }

    function atualizarMapaStatusVeiculo(latitude, longitude) {
        const latitudeNumero = Number(latitude);
        const longitudeNumero = Number(longitude);

        if (Number.isNaN(latitudeNumero) || Number.isNaN(longitudeNumero)) {
            $('#statusVeiculoMapaTexto').text('Coordenadas indisponíveis para exibir o mapa.');
            $('#statusVeiculoMapaIframe').attr('src', 'https://maps.google.com/maps?q=0,0&z=1&output=embed');
            $('#statusVeiculoMapaLink').attr('href', 'https://maps.google.com');
            return;
        }

        const urlMapa = `https://maps.google.com/maps?q=${latitudeNumero},${longitudeNumero}&z=15&output=embed`;
        const urlMapaExterno = `https://maps.google.com/?q=${latitudeNumero},${longitudeNumero}`;

        $('#statusVeiculoMapaTexto').text(`Latitude ${formatarNumeroStatusVeiculo(latitudeNumero, 6)} | Longitude ${formatarNumeroStatusVeiculo(longitudeNumero, 6)}`);
        $('#statusVeiculoMapaIframe').attr('src', urlMapa);
        $('#statusVeiculoMapaLink').attr('href', urlMapaExterno);
    }

    function renderizarDadosVeiculo(veiculo) {
        const camposVeiculo = [
            { label: 'Código interno', valor: veiculo.codigo_interno },
            { label: 'Matrícula', valor: veiculo.matricula },
            { label: 'Marca / Modelo', valor: [veiculo.marca, veiculo.modelo].filter(Boolean).join(' / ') },
            { label: 'Ano', valor: veiculo.ano },
            { label: 'Tipo de viatura', valor: veiculo.tipo_viatura },
            { label: 'Estado', valor: veiculo.estado },
            { label: 'Base operacional', valor: veiculo.base_operacional },
            { label: 'Proprietário', valor: veiculo.proprietario },
            { label: 'Motorista atual', valor: veiculo.motorista_atual },
            { label: 'VIN', valor: veiculo.vin },
            { label: 'Total de documentos', valor: veiculo.total_documentos },
            { label: 'Total de inspeções', valor: veiculo.total_inspecoes }
        ];

        const html = camposVeiculo.map(function(campo) {
            const valor = formatarTextoStatusVeiculo(campo.valor);
            const classeValor = valor === 'Sem informação' ? 'status-veiculo-field-value status-veiculo-empty' : 'status-veiculo-field-value';

            return `
                <div class="col-12 col-md-6 col-xl-4 mb-3">
                    <div class="status-veiculo-field">
                        <span class="status-veiculo-field-label">${escapeHtmlStatusVeiculo(campo.label)}</span>
                        <p class="${classeValor}">${escapeHtmlStatusVeiculo(valor)}</p>
                    </div>
                </div>
            `;
        }).join('');

        $('#statusVeiculoDadosVeiculo').html(html);
    }

    function renderizarAlertasStatusVeiculo(alertaResumo) {
        if (!alertaResumo || (!alertaResumo.bloqueado && !alertaResumo.tem_alertas)) {
            $('#statusVeiculoAlertas').html(`
                <div class="status-veiculo-alert-box status-veiculo-alert-success">
                    Sem alertas operacionais para documentos e inspeções críticas.
                </div>
            `);
            return;
        }

        let html = '';

        if (alertaResumo.bloqueado && Array.isArray(alertaResumo.bloqueios) && alertaResumo.bloqueios.length) {
            html += `
                <div class="status-veiculo-alert-box status-veiculo-alert-danger">
                    <strong>Bloqueio operacional ativo.</strong>
                    <ul>${alertaResumo.bloqueios.map(function(alerta) {
                        return `<li>${escapeHtmlStatusVeiculo(alerta.mensagem || 'Bloqueio identificado.')}</li>`;
                    }).join('')}</ul>
                </div>
            `;
        }

        if (alertaResumo.tem_alertas && Array.isArray(alertaResumo.alertas) && alertaResumo.alertas.length) {
            html += `
                <div class="status-veiculo-alert-box status-veiculo-alert-warning">
                    <strong>Alertas automáticos de vencimento.</strong>
                    <ul>${alertaResumo.alertas.map(function(alerta) {
                        return `<li>${escapeHtmlStatusVeiculo(alerta.mensagem || 'Alerta identificado.')}</li>`;
                    }).join('')}</ul>
                </div>
            `;
        }

        $('#statusVeiculoAlertas').html(html);
    }

    function renderizarHistoricoStatusVeiculo(containerId, itens, tipo) {
        if (!Array.isArray(itens) || !itens.length) {
            $(containerId).html(`
                <div class="status-veiculo-field text-center py-4">
                    <span class="status-veiculo-empty">Nenhum ${tipo === 'documento' ? 'documento' : 'inspeção'} encontrado.</span>
                </div>
            `);
            return;
        }

        const html = itens.map(function(item) {
            const titulo = escapeHtmlStatusVeiculo(item.tipo || (tipo === 'documento' ? 'Documento' : 'Inspeção'));
            const meta = [];

            if (tipo === 'documento') {
                meta.push(`Número: ${escapeHtmlStatusVeiculo(formatarTextoStatusVeiculo(item.numero))}`);
                meta.push(`Estado: ${escapeHtmlStatusVeiculo(formatarTextoStatusVeiculo(item.estado))}`);
                meta.push(`Emissão: ${escapeHtmlStatusVeiculo(formatarDataCurtaStatusVeiculo(item.data_emissao))}`);
                meta.push(`Validade: ${escapeHtmlStatusVeiculo(formatarDataCurtaStatusVeiculo(item.data_validade))}`);
                meta.push(`Prazo: ${escapeHtmlStatusVeiculo(formatarDiasStatusVeiculo(item.dias_para_vencer, item.esta_vencido))}`);
            } else {
                meta.push(`Resultado: ${escapeHtmlStatusVeiculo(formatarTextoStatusVeiculo(item.resultado))}`);
                meta.push(`Entidade: ${escapeHtmlStatusVeiculo(formatarTextoStatusVeiculo(item.entidade_executante))}`);
                meta.push(`Relatório: ${escapeHtmlStatusVeiculo(formatarTextoStatusVeiculo(item.numero_relatorio))}`);
                meta.push(`Última inspeção: ${escapeHtmlStatusVeiculo(formatarDataCurtaStatusVeiculo(item.data_ultima))}`);
                meta.push(`Próxima inspeção: ${escapeHtmlStatusVeiculo(formatarDataCurtaStatusVeiculo(item.data_proxima))}`);
                meta.push(`Prazo: ${escapeHtmlStatusVeiculo(formatarDiasStatusVeiculo(item.dias_para_vencer, item.esta_vencida))}`);
            }

            let alertaHtml = '';

            if (item.alerta && item.alerta.mensagem) {
                const classeAlerta = item.alerta.bloqueia_alocacao
                    ? 'status-veiculo-history-alert status-veiculo-history-alert-danger'
                    : 'status-veiculo-history-alert status-veiculo-history-alert-warning';

                alertaHtml = `<div class="${classeAlerta}">${escapeHtmlStatusVeiculo(item.alerta.mensagem)}</div>`;
            }

            return `
                <div class="status-veiculo-history-item">
                    <div class="status-veiculo-history-title">${titulo}</div>
                    ${meta.map(function(linha) {
                        return `<div class="status-veiculo-history-meta">${linha}</div>`;
                    }).join('')}
                    ${alertaHtml}
                </div>
            `;
        }).join('');

        $(containerId).html(`<div class="status-veiculo-history-list">${html}</div>`);
    }

    function renderizarStatusVeiculo(data) {
        const statusData = data || {};

        const resumoHtml = statusVeiculoResumo.map(function(campo) {
            return `
                <div class="col-12 col-sm-6 col-xl-4 mb-3">
                    <div class="status-veiculo-summary-card">
                        <span class="status-veiculo-summary-label">${campo.label}</span>
                        <span class="status-veiculo-summary-value">${formatarValorStatusVeiculo(campo, statusData[campo.key])}</span>
                    </div>
                </div>
            `;
        }).join('');

        const camposHtml = statusVeiculoCampos.map(function(campo) {
            const valor = formatarValorStatusVeiculo(campo, statusData[campo.key]);
            const classeValor = valor === 'Sem informação' ? 'status-veiculo-field-value status-veiculo-empty' : 'status-veiculo-field-value';

            return `
                <div class="col-12 col-md-6 col-xl-4 mb-3">
                    <div class="status-veiculo-field">
                        <span class="status-veiculo-field-label">${campo.label}</span>
                        <p class="${classeValor}">${valor}</p>
                    </div>
                </div>
            `;
        }).join('');

        $('#statusVeiculoDescricao').text(statusData.position_description || 'Os dados mais recentes recebidos da integração Cartrack.');
        $('#statusVeiculoUltimoEvento').text(formatarDataStatusVeiculo(statusData.event_ts));
        $('#statusVeiculoResumo').html(resumoHtml);
        $('#statusVeiculoCampos').html(camposHtml);
        atualizarMapaStatusVeiculo(statusData.latitude, statusData.longitude);
    }

    function funcChamaModalStatusVeiculo(veiculoId) {
        $('#statusVeiculoDescricao').text('Carregando leitura atual do veículo...');
        $('#statusVeiculoUltimoEvento').text('--');
        $('#statusVeiculoResumo').html('');
        $('#statusVeiculoDadosVeiculo').html(`
            <div class="col-12">
                <div class="status-veiculo-field text-center py-4">
                    <span class="status-veiculo-empty">Carregando dados do veículo...</span>
                </div>
            </div>
        `);
        $('#statusVeiculoMapaTexto').text('Carregando coordenadas do veículo...');
        $('#statusVeiculoMapaIframe').attr('src', 'https://maps.google.com/maps?q=0,0&z=1&output=embed');
        $('#statusVeiculoMapaLink').attr('href', 'https://maps.google.com');
        $('#statusVeiculoAlertas').html(`
            <div class="status-veiculo-field text-center py-4">
                <span class="status-veiculo-empty">Carregando alertas de vencimento...</span>
            </div>
        `);
        $('#statusVeiculoDocumentosHistorico').html(`
            <div class="status-veiculo-field text-center py-4">
                <span class="status-veiculo-empty">Carregando documentos...</span>
            </div>
        `);
        $('#statusVeiculoInspecoesHistorico').html(`
            <div class="status-veiculo-field text-center py-4">
                <span class="status-veiculo-empty">Carregando inspeções...</span>
            </div>
        `);
        $('#statusVeiculoCampos').html(`
            <div class="col-12">
                <div class="status-veiculo-field text-center py-4">
                    <span class="status-veiculo-empty">Carregando informações do veículo...</span>
                </div>
            </div>
        `);

        $.ajax({
            url: '/integracoes/cartrack/vehicles/' + veiculoId + '/status',
            method: 'GET',
            success: function(data) {
                const historico = data.historico || {};

                renderizarStatusVeiculo(data.status || {});
                renderizarDadosVeiculo(data.veiculo || {});
                renderizarAlertasStatusVeiculo(data.alerta_vencimentos || null);
                renderizarHistoricoStatusVeiculo('#statusVeiculoDocumentosHistorico', historico.documentos || [], 'documento');
                renderizarHistoricoStatusVeiculo('#statusVeiculoInspecoesHistorico', historico.inspecoes || [], 'inspecao');
                $('#btnChamaModalStatusVeiculo').click();
            },
            error: function() {
                $('#statusVeiculoDescricao').text('Não foi possível obter a leitura do veículo.');
                $('#statusVeiculoMapaTexto').text('Não foi possível carregar a localização do veículo.');
                $('#statusVeiculoDadosVeiculo').html(`
                    <div class="col-12">
                        <div class="status-veiculo-field text-center py-4">
                            <span class="status-veiculo-empty">Erro ao carregar os dados do veículo.</span>
                        </div>
                    </div>
                `);
                $('#statusVeiculoAlertas').html(`
                    <div class="status-veiculo-field text-center py-4">
                        <span class="status-veiculo-empty">Erro ao carregar os alertas de vencimento.</span>
                    </div>
                `);
                $('#statusVeiculoDocumentosHistorico').html(`
                    <div class="status-veiculo-field text-center py-4">
                        <span class="status-veiculo-empty">Erro ao carregar o histórico de documentos.</span>
                    </div>
                `);
                $('#statusVeiculoInspecoesHistorico').html(`
                    <div class="status-veiculo-field text-center py-4">
                        <span class="status-veiculo-empty">Erro ao carregar o histórico de inspeções.</span>
                    </div>
                `);
                $('#statusVeiculoCampos').html(`
                    <div class="col-12">
                        <div class="status-veiculo-field text-center py-4">
                            <span class="status-veiculo-empty">Erro ao carregar o status do veículo.</span>
                        </div>
                    </div>
                `);
                alert('Erro ao carregar o status do veículo.');
            }
        });
        
    }



</script>

@endsection