246 lines
11 KiB
PHP
246 lines
11 KiB
PHP
<!DOCTYPE html>
|
|
<html lang="pt-BR">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>Upload de Documentos</title>
|
|
<style>
|
|
body { font-family: Arial, sans-serif; margin: 20px; }
|
|
.upload-form { max-width: 500px; margin: 0 auto; padding: 20px; background: #fff; }
|
|
.button { padding: 10px 20px; background: #4CAF50; color: white; border: none; }
|
|
.preview { max-width: 100%; margin: 20px 0; }
|
|
.preview img { max-width: 100%; }
|
|
#result { display: none; }
|
|
.error { color: red; }
|
|
select { width: 100%; padding: 8px; margin-bottom: 10px; }
|
|
</style>
|
|
<!-- jQuery primeiro -->
|
|
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
|
|
<!-- jQuery UI depois -->
|
|
<script src="https://code.jquery.com/ui/1.13.2/jquery-ui.min.js"></script>
|
|
<link rel="stylesheet" href="https://code.jquery.com/ui/1.13.2/themes/base/jquery-ui.css">
|
|
<!-- Fancybox por último -->
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.5.7/jquery.fancybox.min.js"></script>
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.5.7/jquery.fancybox.min.css">
|
|
</head>
|
|
<body>
|
|
<div class="upload-form">
|
|
<h2>Upload de Documentos</h2>
|
|
<?php
|
|
// Debug de inicialização
|
|
echo "<!-- Debug: Iniciando página de upload -->\n";
|
|
require_once 'config.php';
|
|
|
|
if ($conn->connect_error) {
|
|
echo "<div class='error'>Erro de conexão: " . $conn->connect_error . "</div>";
|
|
} else {
|
|
echo "<!-- Debug: Conexão OK -->\n";
|
|
}
|
|
?>
|
|
<form action="process.php" method="post" enctype="multipart/form-data" id="uploadForm">
|
|
<p>
|
|
<label>Cliente:</label><br>
|
|
<select name="client_id" required>
|
|
<?php
|
|
require_once 'config.php';
|
|
|
|
// Debug de conexão
|
|
if (!$conn) {
|
|
die("Erro de conexão: " . mysqli_connect_error());
|
|
}
|
|
|
|
// Debug da tabela
|
|
$check_table = $conn->query("SHOW TABLES LIKE 'clients'");
|
|
if ($check_table->num_rows == 0) {
|
|
die("Tabela 'clients' não encontrada!");
|
|
}
|
|
|
|
// Verificar estrutura da tabela
|
|
$check_columns = $conn->query("DESCRIBE clients");
|
|
if (!$check_columns) {
|
|
die("Erro ao verificar estrutura da tabela: " . $conn->error);
|
|
}
|
|
|
|
// Contar registros
|
|
$count = $conn->query("SELECT COUNT(*) as total FROM clients");
|
|
$total = $count->fetch_assoc()['total'];
|
|
echo "<!-- Total de clientes: " . $total . " -->";
|
|
|
|
// Query com validação e debug
|
|
$sql = "SELECT id, name FROM clients WHERE 1=1";
|
|
$result = $conn->query($sql);
|
|
|
|
if (!$result) {
|
|
die("Erro na query: " . $conn->error);
|
|
}
|
|
|
|
// Exibir clientes com verificação
|
|
echo "<option value=''>Selecione um cliente</option>";
|
|
if ($result->num_rows > 0) {
|
|
while ($row = $result->fetch_assoc()) {
|
|
echo "<option value='" . $row['id'] . "'>" .
|
|
htmlspecialchars($row['name']) . "</option>";
|
|
}
|
|
} else {
|
|
echo "<option value='' disabled>Nenhum cliente encontrado</option>";
|
|
echo "<!-- Query executada: " . $sql . " -->";
|
|
}
|
|
?>
|
|
</select>
|
|
</p>
|
|
<p>
|
|
<label>Selecione o documento:</label><br>
|
|
<input type="file" name="document[]" accept="image/*" required multiple>
|
|
<small style="color: #666;">Você pode selecionar várias imagens para unir em um único documento</small>
|
|
</p>
|
|
<p>
|
|
<label>Tipo de documento:</label><br>
|
|
<select name="doc_type" required>
|
|
<option value="cpf">CPF</option>
|
|
<option value="rg">RG</option>
|
|
<option value="cnh">CNH</option>
|
|
</select>
|
|
</p>
|
|
<input type="submit" value="Processar" class="button">
|
|
</form>
|
|
|
|
<div id="uploadStatus" style="margin: 10px 0; padding: 10px;"></div>
|
|
<div id="debug" style="margin: 10px 0; padding: 10px; background: #f5f5f5; display: none;"></div>
|
|
|
|
<div id="error" class="error">
|
|
<?php
|
|
if (isset($conn) && !$result) {
|
|
echo "Erro ao buscar clientes: " . $conn->error;
|
|
}
|
|
?>
|
|
</div>
|
|
<p><a href="index.php?page=doc_list">Ver documentos processados</a></p>
|
|
</div>
|
|
|
|
<div id="result">
|
|
<h3>Resultado do Processamento:</h3>
|
|
<div class="preview">
|
|
<h4>Documento Original:</h4>
|
|
<img id="originalImage" src="" alt="Original">
|
|
</div>
|
|
<div class="preview">
|
|
<h4>Documento Processado:</h4>
|
|
<img id="processedImage" src="" alt="Processado">
|
|
</div>
|
|
</div>
|
|
|
|
<div id="error" class="error"></div>
|
|
|
|
<script>
|
|
$(document).ready(function() {
|
|
const uploadForm = document.getElementById('uploadForm');
|
|
const fileInput = uploadForm.querySelector('input[type="file"]');
|
|
const debugDiv = document.getElementById('debug');
|
|
const statusDiv = document.getElementById('uploadStatus');
|
|
|
|
// Inicializar autocomplete do jQuery UI
|
|
$("#search").autocomplete({
|
|
source: function(request, response) {
|
|
$.getJSON("clientes/autocomplete.php", {
|
|
term: request.term
|
|
}, response);
|
|
},
|
|
minLength: 2,
|
|
select: function(event, ui) {
|
|
if (ui.item) {
|
|
window.location.href = 'index.php?page=client_details&id=' + ui.item.id;
|
|
}
|
|
}
|
|
});
|
|
|
|
fileInput.addEventListener('change', function(e) {
|
|
const files = e.target.files;
|
|
if (files.length > 0) {
|
|
debugDiv.innerHTML = `${files.length} arquivo(s) selecionado(s)`;
|
|
debugDiv.style.display = 'block';
|
|
}
|
|
});
|
|
|
|
uploadForm.onsubmit = async (e) => {
|
|
e.preventDefault();
|
|
const formData = new FormData();
|
|
|
|
// Adicionar cada arquivo individualmente
|
|
const files = fileInput.files;
|
|
Array.from(files).forEach((file, index) => {
|
|
formData.append('document[]', file);
|
|
});
|
|
|
|
// Adicionar outros campos
|
|
formData.append('client_id', document.querySelector('select[name="client_id"]').value);
|
|
formData.append('doc_type', document.querySelector('select[name="doc_type"]').value);
|
|
|
|
debugDiv.style.display = 'block';
|
|
debugDiv.innerHTML = 'Iniciando upload...<br>';
|
|
|
|
try {
|
|
const response = await fetch('index.php?page=temp_upload', {
|
|
method: 'POST',
|
|
body: formData
|
|
});
|
|
|
|
debugDiv.innerHTML += `Status: ${response.status}<br>`;
|
|
const text = await response.text();
|
|
debugDiv.innerHTML += `Resposta raw: ${text}<br>`;
|
|
|
|
const result = JSON.parse(text);
|
|
|
|
if (result.success) {
|
|
debugDiv.innerHTML += 'Upload bem sucedido, abrindo editor...<br>';
|
|
localStorage.setItem('tempImage', result.imageUrl);
|
|
localStorage.setItem('tempClientId', formData.get('client_id'));
|
|
localStorage.setItem('tempDocType', formData.get('doc_type'));
|
|
localStorage.setItem('fileCount', result.fileCount);
|
|
localStorage.setItem('allImages', JSON.stringify(result.allImages));
|
|
|
|
jQuery.fancybox.open({
|
|
src: 'editor.php',
|
|
type: 'iframe',
|
|
opts: {
|
|
baseClass: "fancybox-custom-layout",
|
|
width: '90%',
|
|
height: '90%',
|
|
margin: [20, 0],
|
|
padding: 0,
|
|
autoSize: false,
|
|
fitToView: true,
|
|
touch: false,
|
|
afterLoad: function(instance, current) {
|
|
current.$iframe.css({
|
|
'max-width': '100%',
|
|
'max-height': '90vh',
|
|
'overflow': 'auto' // Permite rolagem dentro do iframe
|
|
});
|
|
},
|
|
afterClose: () => {
|
|
localStorage.removeItem('tempImage');
|
|
localStorage.removeItem('tempClientId');
|
|
localStorage.removeItem('tempDocType');
|
|
}
|
|
}
|
|
});
|
|
} else {
|
|
throw new Error(result.message);
|
|
}
|
|
} catch (error) {
|
|
debugDiv.innerHTML += `Erro: ${error.message}<br>`;
|
|
statusDiv.innerHTML = `Erro: ${error.message}`;
|
|
}
|
|
};
|
|
});
|
|
|
|
// Receber mensagem do iframe
|
|
window.addEventListener('message', function(event) {
|
|
if (event.data.type === 'documentSaved') {
|
|
$.fancybox.close();
|
|
window.location.href = 'index.php?page=doc_list&status=success';
|
|
}
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|