@extends('Templates/templateAdmin')

@section('Main-content')
    <!-- Content Header (Page header) -->
    <!-- /.content-header -->

    @if (session('success'))
        <div class="alert alert-success" role="alert">
            {{ session('success') }}
        </div>
    @endif

    <meta name="csrf-token" content="{{ csrf_token() }}">

    <br><br>
    <div class="card">
        <div class="card-body">
            <div class="container mt-5">
                <form>
                    @csrf
                    <div class="form-group">
                        <label for="inputDocumento">Selecione um documento:</label>
                        <input type="file" class="form-control-file" id="inputDocumento" accept=".xlsx, .xls">
                    </div>
                    <button type="submit" class="btn btn-primary">Enviar</button>
                </form>

                <br><br>
                <a id="btn-download-template" href="{{ route('download') }}" class="btn btn-warning">Baixar Template</a>

                <div id="tabelaExcel" class="mt-5"></div>
            </div>

            <div id="tabelaExcel" class="mt-5"></div>
            <div id="tabelaExcel1" class="mt-5"></div>
            <div id="tabelaExcel2" class="mt-5"></div>
        </div>
    </div>

    {{-- <script>
        // Obtenha a URL da rota usando o método route()
        const downloadUrl = "{{ route('download') }}";

        // Atribua a URL ao atributo formaction do botão
        document.getElementById('btn-download-template').setAttribute('formaction', downloadUrl);

        (function() {
                const tabelaExcel1 = document.getElementById('tabelaExcel1');

                function handleFormSubmit(event) {
                    event.preventDefault(); // Previne o comportamento padrão do formulário
                    const inputFile = document.getElementById('inputDocumento').files[0];
                    const reader = new FileReader();
                    reader.readAsBinaryString(inputFile);


                    reader.onload = function() {
                        const fileData = reader.result;
                        const workbook = XLSX.read(fileData, {
                            type: 'binary'
                        });
                        const worksheet1 = workbook.Sheets[workbook.SheetNames[0]];
                        const tableData1 = XLSX.utils.sheet_to_json(worksheet1);
                        const slicedData = tableData1.slice(3); // cortar os dados a partir do array 3

                        // Enviar dados para o servidor via AJAX
                        $.ajax({
                                url: "{{ route('createEquipamentProject') }}", // rota do controlador
                                method: 'POST', // tipo de solicitação
                                data: {
                                    data: slicedData
                                }, // dados para enviar, aqui enviamos os dados cortados
                                success: function(response) {
                                    // Código para manipular a resposta, se necessário
                                },
                                error: function(jqXHR, textStatus, errorThrown) {
                                    // Código para manipular erros, se necessário
                                }
                                // });
                            }


                            const form = document.querySelector('form'); form.addEventListener('submit',
                                handleFormSubmit);
                        })();
    </script> --}}


    <script>
        const downloadUrl = "{{ route('download') }}";
    
        document.getElementById('btn-download-template').setAttribute('formaction', downloadUrl);
    
        (function() {
            const tabelaExcel1 = document.getElementById('tabelaExcel1');
    
            function handleFormSubmit(event) {
                event.preventDefault();
    
                const inputFile = document.getElementById('inputDocumento').files[0];
                const reader = new FileReader();
                reader.readAsBinaryString(inputFile);
    
                reader.onload = function() {
                    const fileData = reader.result;
                    const workbook = XLSX.read(fileData, {
                        type: 'binary'
                    });
                    const worksheet1 = workbook.Sheets[workbook.SheetNames[0]];
                    const tableData1 = XLSX.utils.sheet_to_json(worksheet1);
                    const slicedData = tableData1.slice(3);
    
                    console.log(slicedData);
    
                    $.ajax({
                        url: "{{ route('createEquipamentProject') }}",
                        method: 'POST',
                        data: {
                            data: slicedData
                        },
                        // Uncomment these for debugging
                        // success: function(response) {
                        //     console.log(response);
                        // },
                        // error: function(jqXHR, textStatus, errorThrown) {
                        //     console.log(textStatus, errorThrown);
                        // }
                    });
                }
            }
    
            const form = document.querySelector('form');
            form.addEventListener('submit', handleFormSubmit);
        })();
    </script>
    



@endsection



{{-- 
                    // reader.onload = function() {
                    //     const fileData = reader.result;
                    //     const workbook = XLSX.read(fileData, {
                    //         type: 'binary'
                    //     });
                    //     const worksheet1 = workbook.Sheets[workbook.SheetNames[0]];
                    //     const tableData1 = XLSX.utils.sheet_to_json(worksheet1);
                    //     const tabelaHtml1 = criarTabelaHtml(tableData1);
                    //     const tabelaExcel1 = document.getElementById('tabelaExcel1');
                    //     if (tabelaExcel1 !== null) {
                    //         tabelaExcel1.innerHTML = tabelaHtml1;
                    //     }
                    // };


// function criarTabelaHtml(dados) {

// const colunasObj = dados[2];
// const colunasheader = Object.keys(colunasObj).map(key =>
// colunasObj[key]);



// const colunasHtml = colunasheader.map(coluna => `<th>${coluna}</th>`).join('');

// const colunas = Object.keys(dados[2]);

// const linhasHtml = dados
// .slice(3)
// .map(linha => {
// const celulasHtml = colunas.map(coluna => {
// const valor = linha[coluna] !== undefined ? linha[coluna] : 'NULL';
// return `<td>${valor}</td>`;
// }).join('');
// return `<tr>${celulasHtml}</tr>`;
// })
// .join('');

// // console.log()
// return `
// <table class="table table-bordered">
    // <thead>
        // <tr>${colunasHtml}</tr>
        // </thead>
    // <tbody>
        // ${linhasHtml}
        // </tbody>
    // </table>
// `;
// } --}}