@extends('adminlte.app')

@section('content')
    <style>
        :root{
        --tfuel-primary:#0aa6c6;
        --tfuel-dark:#0a2d3a;
        --tfuel-accent:#00b97c;
        --tfuel-warn:#f0ad4e;
        --tfuel-danger:#dc3545;
        --tfuel-soft:#f7fafc;
        }

        body { background:#f4f6f9; }

        .kpi-card{
        background:#fff;
        border-radius:12px;
        box-shadow: 0 6px 14px rgba(0,0,0,0.08);
        padding:14px 16px;
        display:flex;
        align-items:center;
        justify-content:space-between;
        }
        .kpi-left{ display:flex; align-items:center; gap:12px; }
        .kpi-icon{
        width:42px; height:42px; border-radius:10px;
        background: var(--tfuel-primary); color:#fff;
        display:flex; align-items:center; justify-content:center;
        font-size:18px;
        }
        .kpi-title{ font-size:11px; color:#6c757d; text-transform:uppercase; font-weight:700; }
        .kpi-value{ font-size:20px; font-weight:800; margin:2px 0; }
        .kpi-sub{ font-size:11px; color:#8a9099; }

        .panel-card{
        background:#fff;
        border-radius:12px;
        box-shadow: 0 6px 14px rgba(0,0,0,0.08);
        padding:12px;
        }
        .panel-row{
        display:grid;
        grid-template-columns: repeat(4, 1fr);
        gap:8px;
        }
        .panel-item{
        border-radius:10px;
        padding:12px;
        text-align:center;
        font-weight:700;
        font-size:14px;
        }
        .panel-item small{ display:block; font-weight:400; color:#6c757d; margin-top:4px; }

        .panel-danger{ background:#fff2f2; color:#dc3545; }
        .panel-warn{ background:#fff9ea; color:#f0ad4e; }
        .panel-ok{ background:#f0fff7; color:#00b97c; }
        .panel-dark{ background:#f1f3f5; color:#343a40; }

        .section-card{
        background:#fff;
        border-radius:12px;
        box-shadow: 0 6px 14px rgba(0,0,0,0.08);
        margin-top:16px;
        }
        .section-card .card-header{
        font-weight:700;
        background:#f8f9fa;
        border-bottom:1px solid #e5e7eb;
        }

        .mini-kpi{
        background:#fff;
        border:1px solid #e5e7eb;
        border-radius:12px;
        padding:12px;
        text-align:center;
        }
        .mini-kpi .label{ font-size:12px; color:#6c757d; }
        .mini-kpi .value{ font-size:18px; font-weight:700; }

        .table-centered th, .table-centered td {
        text-align:center;
        vertical-align:middle;
        }

        .progress { height: 8px; background:#e2e8f0; }

        .skeleton{
            width:100px;
            height:24px;
            border-radius:4px;
            background: linear-gradient(90deg,#eee,#a8b0f5,#eee);
            background-size:200% 100%;
            animation: skeleton 1.2s infinite;
        }

        @keyframes skeleton{
            0%{background-position:200% 0}
            100%{background-position:-200% 0}
        }
    </style>
    <div class="content-wrapper pb-3">

        <section class="content-header">
            <div class="container-fluid">
                <h3 class="m-0 font-weight-bold">Visão Gerencial - Sondagens</h3>
                <small class="text-muted">Stocks e autonomia em litros</small>
            </div>
        </section>

        <section class="content">
            <div class="container-fluid">

                <!-- KPIs principais (litros) -->
                <div class="row">
                    <div class="col-lg-3 col-md-6 mb-3">
                        <div class="kpi-card">
                        <div class="kpi-left">
                            <div class="kpi-icon"><i class="fas fa-gas-pump"></i></div>
                            <div>
                            <div class="kpi-title">Stock Útil (L)</div>
                            <div id="kpi-estoque-util" class="kpi-value">
                                <div class="skeleton"></div>
                            </div>
                            <div class="kpi-sub">Hoje</div>
                            </div>
                        </div>
                        </div>
                    </div>

                    <div class="col-lg-3 col-md-6 mb-3">
                        <div class="kpi-card">
                        <div class="kpi-left">
                            <div class="kpi-icon">
                                <img src="/img/logo_quadrada.png" alt="Tfuel" style="width:50px;height:50px;">
                            </div>
                            <div>
                            <div class="kpi-title">TFuel</div>
                            <div id="kpi-estoque-tfuel" class="kpi-value">
                                <div class="skeleton"></div>
                            </div>
                            <div class="kpi-sub">Hoje</div>
                            </div>
                        </div>
                        </div>
                    </div>

                    <div class="col-lg-3 col-md-6 mb-3">
                        <div class="kpi-card">
                        <div class="kpi-left">
                            <div class="kpi-icon">
                                <img src="/img/logo-bp.jpeg" alt="BP" style="width:50px;height:50px;">
                            </div>
                            <div>
                            <div class="kpi-title">BP</div>
                            <div id="kpi-estoque-bp" class="kpi-value">
                                <div class="skeleton"></div>
                            </div>
                            <div class="kpi-sub">Hoje</div>
                            </div>
                        </div>
                        </div>
                    </div>

                    <div class="col-lg-3 col-md-6 mb-3">
                        <div class="kpi-card">
                        <div class="kpi-left">
                            <div class="kpi-icon" style="background:#00b97c;"><i class="fas fa-truck-loading"></i></div>
                            <div>
                            <div class="kpi-title">Pedidos Pendentes (L)</div>
                            <div id="kpi-pedidos-pendentes" class="kpi-value">
                                <div class="skeleton"></div>
                            </div>
                            <div class="kpi-sub">Em aberto</div>
                            </div>
                        </div>
                        </div>
                    </div>
                </div>
<div class="d-none">
                <!-- Painel de risco -->
                <div class="panel-card mb-3">
                    <div class="d-flex align-items-center mb-2">
                        <i class="fas fa-exclamation-circle text-danger mr-2"></i>
                        <strong>Painel de Risco de Stock</strong>
                    </div>
                    <div class="panel-row">
                        <div class="panel-item panel-danger">2 Tanques<small>Risco Ruptura - Necessita Ação Imediata</small></div>
                        <div class="panel-item panel-warn">6 Tanques<small>Precisam Atenção</small></div>
                        <div class="panel-item panel-ok">18 Tanques<small>Operacionais e Aut. &gt; 7D</small></div>
                        <div class="panel-item panel-dark">7 Tanques<small>Sondagens Atrasadas</small></div>
                    </div>
                </div>

                <!-- Dias de autonomia -->
                <div class="card section-card">
                    <div class="card-header">Dias de Autonomia (Resumo)</div>
                    <div class="card-body">
                        <div class="row">
                        <div class="col-md-3"><div class="mini-kpi"><div class="label">Média Geral</div><div class="value">6,1 dias</div></div></div>
                        <div class="col-md-3"><div class="mini-kpi"><div class="label">Mediana</div><div class="value">5,0 dias</div></div></div>
                        <div class="col-md-3"><div class="mini-kpi"><div class="label">Mínimo</div><div class="value">1 dia</div></div></div>
                        <div class="col-md-3"><div class="mini-kpi"><div class="label">% ≤ 2 dias</div><div class="value">18%</div></div></div>
                        </div>
                    </div>
                </div>

                <!-- Capacidade e ocupação por combustíveis -->
                <div class="card section-card">
                    <div class="card-header">Capacidade e Ocupação por Combustível</div>
                    <div class="card-body p-0">
                        <table class="table table-bordered table-sm table-centered">
                        <thead>
                            <tr>
                            <th>Combustível</th>
                            <th>Stock Útil (L)</th>
                            <th>Capacidade (L)</th>
                            <th>Ocupação</th>
                            <th>Autonomia Média (dias)</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                            <td>GA</td><td>62.300</td><td>130.000</td>
                            <td>
                                <div class="progress"><div class="progress-bar bg-warning" style="width:48%"></div></div>
                                48%
                            </td>
                            <td>5,2</td>
                            </tr>
                            <tr>
                            <td>GAD.</td><td>31.800</td><td>70.000</td>
                            <td>
                                <div class="progress"><div class="progress-bar bg-success" style="width:45%"></div></div>
                                45%
                            </td>
                            <td>8,6</td>
                            </tr>
                            <tr>
                            <td>GA-V</td><td>22.500</td><td>55.000</td>
                            <td>
                                <div class="progress"><div class="progress-bar bg-success" style="width:41%"></div></div>
                                41%
                            </td>
                            <td>28,4</td>
                            </tr>
                            <tr>
                            <td>S/C95</td><td>9.800</td><td>35.000</td>
                            <td>
                                <div class="progress"><div class="progress-bar bg-warning" style="width:28%"></div></div>
                                28%
                            </td>
                            <td>16,1</td>
                            </tr>
                            <tr>
                            <td>GPL</td><td>810</td><td>8.000</td>
                            <td>
                                <div class="progress"><div class="progress-bar bg-danger" style="width:10%"></div></div>
                                10%
                            </td>
                            <td>3</td>
                            </tr>
                        </tbody>
                        </table>
                    </div>
                </div>

                <!-- Visualização de sondagens -->
                <div class="card section-card">
                    <div class="card-header">Sondagens</div>
                    <div class="card-body">

                        <!-- Tabs -->
                        <ul class="nav nav-tabs" role="tablist">
                        <li class="nav-item"><a class="nav-link active" data-toggle="tab" href="#por-posto" role="tab">Por Posto</a></li>
                        <li class="nav-item"><a class="nav-link" data-toggle="tab" href="#todas" role="tab">Todas Juntas</a></li>
                        </ul>

                        <div class="tab-content pt-3">

                        <!-- Por Posto -->
                        <div class="tab-pane fade show active" id="por-posto" role="tabpanel">
                            <div class="card collapsed-card mb-2">
                            <div class="card-header">
                                <h3 class="card-title">02-Aljustrel</h3>
                                <div class="card-tools"><button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-plus"></i></button></div>
                            </div>
                            <div class="card-body p-0">
                                <table class="table table-bordered table-sm table-centered">
                                <thead><tr><th>Produto</th><th>Data Última Sondagem</th><th>Última Sondagem</th><th>Pendente</th><th>Capacidade</th><th>Reabastecer antes de</th><th>Novo SLA</th></tr></thead>
                                <tbody>
                                    <tr><td>GA</td><td>10/02/2026 - 21:29:54</td><td>9200</td><td>0</td><td>24.000</td><td>20/02/2026</td><td>10</td></tr>
                                    <tr><td>DIESEL ULTIMATE</td><td>10/02/2026 - 21:29:54</td><td>5600</td><td>0</td><td>24.000</td><td>20/02/2026</td><td>11</td></tr>
                                    <tr><td>GA-V</td><td>10/02/2026 - 21:29:54</td><td>3400</td><td>0</td><td>24.000</td><td>10/04/2026</td><td>68</td></tr>
                                </tbody>
                                </table>
                            </div>
                            </div>
                        </div>

                        <!-- Todas juntas -->
                        <div class="tab-pane fade" id="todas" role="tabpanel">
                            <div class="table-responsive">
                            <table class="table table-bordered table-sm table-centered">
                                <thead>
                                <tr><th>Posto</th><th>Produto</th><th>Data Última Sondagem</th><th>Última Sondagem</th><th>Pendente</th><th>Capacidade</th><th>Reabastecer antes de</th><th>Novo SLA</th></tr>
                                </thead>
                                <tbody>
                                <tr><td>02-Aljustrel</td><td>GA</td><td>10/02/2026 - 21:29:54</td><td>9200</td><td>0</td><td>24.000</td><td>20/02/2026</td><td>10</td></tr>
                                <tr><td>07-Moura</td><td>GA</td><td>10/02/2026 - 19:24:45</td><td>10000</td><td>0</td><td>30.000</td><td>22/02/2026</td><td>5</td></tr>
                                <tr><td>08-Couço</td><td>DIESEL ULTIMATE</td><td>10/02/2026 - 22:13:19</td><td>2800</td><td>0</td><td>10.000</td><td>14/02/2026</td><td>5</td></tr>
                                <tr><td>DS</td><td>GA</td><td>11/02/2026 - 09:43:17</td><td>3800</td><td>0</td><td>34.000</td><td>11/02/2026</td><td>1</td></tr>
                                </tbody>
                            </table>
                            </div>
                        </div>

                        </div>

                    </div>
                </div>
</div>
            </div>
        </section>

        <!-- Content Header (Page header) -->
        <div class="content-header">
            <div class="container-fluid">
                <div class="row mb-2">
                    <div class="col-sm-6">
                        <h1 class="m-0">Sondagens</h1>
                    </div><!-- /.col -->
                    <div class="col-sm-6">
                
                    </div><!-- /.col -->
                </div><!-- /.row -->
            </div><!-- /.container-fluid -->
        </div>
        <!-- /.content-header -->

        @if ($message = Session::get('success'))
            <div class="alert alert-success">
                <p>{{ $message }}</p>
            </div>
        @endif
        @if ($message = Session::get('danger'))
            <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-4">
                        Pedido Automático
                    </div>
          
                </div>

            </div>

            <div class="row ml-3 align-items-end py-3">
                <div class="col-sm-3">
                    <label for="previsao_alteracao_precos">Previsão de Alteração de Preços</label>
                    <select name="previsao_alteracao_precos" id="previsao_alteracao_precos" class="form-control select2" required>
                        <option value="">Selecione</option>
                        <option value="1">Subida</option>
                        <option value="2">Descida</option>
                    </select>
                </div>
                <div class="col-sm-3">
                    <select name="fator_c" id="fator_c" class="form-control select2" required>
                        <option value="0">Fator C</option>
                        <option value="0.10">10%</option>
                        <option value="0.20">20%</option>
                        <option value="0.30">30%</option>
                        <option value="0.40">40%</option>
                        <option value="0.50">50%</option>
                        <option value="0.60">60%</option>
                        <option value="0.70">70%</option>
                        <option value="0.80">80%</option>
                        <option value="0.90">90%</option>
                        <option value="1.00">100%</option>
                    </select>
                </div>
                <div class="col-sm-3">
                    <button class="btn btn-primary rounded mx-auto d-block col-12" id="btn_pedido_automatico">Analisar Sondagens com IA e sugerir Pedidos</button>
                    <button class="btn btn-primary rounded mx-auto col-12 d-none" id="btn_pedido_automaticoModal" data-toggle="modal" data-target="#modalAguarde">Só abre o modal</button>
                </div>
            </div>

            <div id="divPedidosAutomaticos" class="mt-4"></div>
        </div>


        <div class="card mx-3 mt-3">
            <div class="card-header">
                <div class="row">  
                    <div class="col-4">
                        Últimas sondagens
                    </div>
          
                </div>

            </div>

            <form id="form-sondagem" action="{{route('sondagensTanques')}}" method="POST">
                @csrf

                <div class="row ml-3 align-items-end">
                    <div class="col-sm-3">
                        <div class="form-group">
                            <label for="postos">Postos</label>
                            <select name="posto_id" id="posto_id" class="form-control select2">
                                <option value="Todos">Todos</option>
                                @foreach ($postos as $posto)
                                    <option value="{{ $posto->id }}">{{ $posto->nome_posto }}</option>
                                @endforeach
                            </select>
                        </div>
                    </div>
                    <div class="col-sm-3">
                        <div class="form-group">
                            <label for="data">Data</label>
                            <input type="date" name="data" id="data" class="form-control" value="{{$data ?? ''}}"  >
                        </div>
                    </div>
                    <div class="col-sm-3">
                        <div class="form-group">
                            <button type="submit" class="btn btn-primary rounded mx-auto d-block col-12">Consultar</button>
                        </div>
                    </div>
                </div>
            </form>

            <div id="resultado-sondagem">
                    @foreach ($postos as $posto)
                        <div class="resultado-posto mb-3" id="posto-{{ $posto->id }}">
                            <strong>{{ $posto->nome }}</strong>
                            <div class="conteudo"></div>
                        </div>
                    @endforeach
            </div>

        </div>

        {{-- Modal com "Aguarde ..." --}}
        <div class="modal fade" id="modalAguarde" tabindex="-1" aria-labelledby="modalAguardeLabel" aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content">
                <div class="modal-header bg-dark text-white">
                    <h5 class="modal-title" id="modalAguardeLabel">Gerando pedidos com IA</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <p id="mensagemAguardeXml">Aguarde ...</p>
                </div>
                <div class="modal-footer">
                    <button type="button" id="btnCancelarmodalAguarde" class="btn btn-secondary d-none" data-dismiss="modal">Fechar</button>
                </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>
    

    <script>
    var table = $('.tabelashow').DataTable( {
        
        "paging": true,
        "lengthChange": true,
        "searching": true,
        "ordering": true,
        "info": true,
        "autoWidth": false,
        "responsive": true,
        "order": [],
        "buttons": [ "csv", "excel", "pdf", {"extend":"print","text":"Imprimir"}, {"extend":"colvis","text":"Colunas"}],
        "lengthMenu": [[8, 10, 25, 50, -1], [8, 10, 25, 50, "All"]],
                    "bJQueryUI": true,
                    "oLanguage": {
                        "sProcessing":   "Processando...",
                        "sLengthMenu":   "Registros _MENU_ ",
                        "sZeroRecords":  "Não foram encontrados resultados",
                        "sInfo":         "Mostrando de _START_ até _END_ de _TOTAL_ registros",
                        "sInfoEmpty":    "Mostrando de 0 até 0 de 0 registros",
                        "sInfoFiltered": "",
                        "sInfoPostFix":  "",
                        "sSearch":       "Buscar:",
                        "sUrl":          "",
                        "oPaginate": {
                            "sFirst":    "Primeiro",
                            "sPrevious": "Anterior",
                            "sNext":     "Seguinte",
                            "sLast":     "Último"
                        }
                    }

    } )
    .buttons().container().appendTo('#tabelashow_wrapper .col-md-6:eq(0)');


     let todosPostos = @json($postos);

    $(document).ready(function () {

        $.ajax({
            url: '{{ route("dashboard_sondagens_tanques") }}',
            method: 'get',
            data: {
               
            },
            success: function(response) {
               $('#kpi-estoque-util').text(response.estoqueUtil);  
               $('#kpi-estoque-tfuel').text(response.estoqueTfuel);
               $('#kpi-estoque-bp').text(response.estoqueBp);   
               $('#kpi-pedidos-pendentes').text(response.litrosPedidosPendentes);
            }
        });

        $('#form-sondagem').on('submit', function (e) {
            e.preventDefault();

            const dataForm = $(this).serialize();
            const url = $(this).attr('action');
            const postoSelecionado = $('#posto_id').val();

            // Limpa antes de carregar
            $('#resultado-sondagem').empty();

            let postosParaConsultar = [];

            if (postoSelecionado === 'Todos') {
                postosParaConsultar = todosPostos;
            } else {
                const encontrado = todosPostos.find(p => p.id == postoSelecionado);
                if (encontrado) {
                    postosParaConsultar.push(encontrado);
                }
            }

            postosParaConsultar.forEach(posto => {
                // Cria um container para o posto
                const divId = `posto-${posto.id}`;
                $('#resultado-sondagem').append(`
                    <div id="${divId}" class="mb-3">
                        <div class="conteudo">
                            <p class="text-lg bg-primary mx-4 px-2 w-100 py-2 mb-0">
                                <i class="fas fa-spinner fa-spin"></i> Aguarde, carregando posto ${posto.nome_posto}...
                            </p>
                        </div>
                    </div>
                `);

                const container = $(`#${divId} .conteudo`);

                $.ajax({
                    url: url,
                    method: 'POST',
                    data: dataForm + '&posto_id=' + posto.id,
                    headers: {
                        'X-CSRF-TOKEN': '{{ csrf_token() }}'
                    },
                    success: function (response) {
                        container.html(response);
                    },
                    error: function () {
                        container.html('<div class="alert alert-danger">Erro ao buscar dados para o posto ' + posto.nome_posto + '.</div>');
                    }
                });
            });
        });

    });

    $('#btn_pedido_automatico').on('click', function() {

        const previsao = $('#previsao_alteracao_precos').val();
        const fatorC = $('#fator_c').val();
       

        if (!previsao) {
            alert('Selecione a previsão.');
            return;
        }

        $('#btn_pedido_automaticoModal').click();

        $.ajax({
            url: '{{ route("pedidos_automaticos.analisar") }}',
            method: 'POST',
            data: {
                previsao_alteracao_precos: previsao,
                fator_c: fatorC,
                _token: '{{ csrf_token() }}'
            },
            success: function(response) {

                console.log(response);

                let pedidos = response.pedidos;

                let agrupado = pedidos.reduce((acc, item) => {

                    if (!acc[item.posto_id]) {
                        acc[item.posto_id] = {
                            posto: item.posto,
                            produtos: []
                        };
                    }

                    acc[item.posto_id].produtos.push(item);

                    return acc;

                }, {});

                let html = '';

                Object.keys(agrupado).forEach(postoId => {

                    let posto = agrupado[postoId];

                    html += `
                        <div class="card mb-4">
                            <div class="card-header bg-primary text-white">
                                <strong>${posto.posto}</strong>
                            </div>
                            <div class="card-body">
                                <table class="table table-sm table-bordered">
                                    <thead>
                                        <tr>
                                            <th>Pedido</th>
                                            <th>Produto</th>
                                            <th>Data Descarga</th>
                                            <th style="width:150px;">Quantidade</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                    `;

                  posto.produtos.forEach(prod => {

                        html += `
                            <tr style="background-color: ${prod.background_color}">
                                <td>${prod.ordem_pedido}º Pedido</td>
                                <td>${prod.produto}</td>
                                <td>
                                    <input type="date"
                                        id="data_descarga_${prod.ordem_pedido}_${prod.posto_id}_${prod.posto_combustivel_id}_${prod.produto_id}"
                                        class="form-control data-descarga-input"
                                        value="${prod.data_descarga}"
                                        data-posto-id="${prod.posto_id}"
                                        data-posto-combustivel-id="${prod.posto_combustivel_id}"
                                        data-produto-id="${prod.produto_id}"
                                        data-ordem-pedido="${prod.ordem_pedido}">
                                </td>
                                <td>
                                    <input type="number"
                                        id="quantidade_${prod.posto_id}_${prod.posto_combustivel_id}_${prod.produto_id}"
                                        class="form-control quantidade-input"
                                        data-posto-id="${prod.posto_id}"
                                        data-posto-combustivel-id="${prod.posto_combustivel_id}"
                                        data-produto-id="${prod.produto_id}"
                                        data-ordem-pedido="${prod.ordem_pedido}"
                                        value="${prod.quantidade_sugerida}">
                                </td>
                            </tr>
                        `;
                    });

                    html += `
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    `;
                });

                html += `
                        <div class="text-end mb-5">
                            <button class="btn btn-primary rounded mx-auto d-block col-3" id="btnConfirmarTodos">
                                Confirmar Pedidos
                            </button>
                        </div>
                    `;

                $('#divPedidosAutomaticos').html(html);

                $('#btnCancelarmodalAguarde').click();
            }
        });
    });

    $(document).on('click', '#btnConfirmarTodos', function() {

        let pedidosConfirmar = [];

        $('#btn_pedido_automaticoModal').click();

        $('.quantidade-input').each(function() {

            let postoId = $(this).data('posto-id');
            let postoCombustivelId = $(this).data('posto-combustivel-id');
            let produtoId = $(this).data('produto-id');
            let quantidade = $(this).val();
            let ordemPedido = $(this).data('ordem-pedido');


            let dataDescarga = $('#data_descarga_' + ordemPedido + '_' + postoId + '_' + postoCombustivelId + '_' + produtoId).val();
            console.log('data_descarga_' + ordemPedido + '_' + postoId + '_' + postoCombustivelId + '_' + produtoId);
            pedidosConfirmar.push({
                posto_id: postoId,
                posto_combustivel_id: postoCombustivelId,
                produto_id: produtoId,
                quantidade: quantidade,
                data_descarga: dataDescarga
            });

        });

        console.log(pedidosConfirmar);

        $.ajax({
            url: '{{ route("pedidos_automaticos.confirmar") }}',
            method: 'POST',
            data: {
                pedidos: pedidosConfirmar,
                _token: '{{ csrf_token() }}'
            },
            success: function(response) {
                alert('Pedidos confirmados com sucesso!');
                $('#divPedidosAutomaticos').empty();
                $('#btnCancelarmodalAguarde').click();
            }
        });

    });

</script>

@endsection