ispt4.0_laravel/resources/views/createProject.blade.php

195 lines
7.0 KiB
PHP

@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>
// `;
// } --}}