Estiliza pagina de upload externo - responsiva (novo47)
This commit is contained in:
rodrigo committed
1 parent
05cd7b9c79
commit
6cced3c983
11 files changed
+776
-24
No files matched your search
+165
@@ -0,0 +1,165 @@
|
||||
<!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>
|
||||
</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>
|
||||
</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.getElementById('uploadForm').onsubmit = async (e) => {
|
||||
e.preventDefault();
|
||||
|
||||
const formData = new FormData(e.target);
|
||||
const statusDiv = document.getElementById('uploadStatus');
|
||||
const debugDiv = document.getElementById('debug');
|
||||
|
||||
statusDiv.innerHTML = 'Enviando...';
|
||||
debugDiv.style.display = 'block';
|
||||
|
||||
try {
|
||||
debugDiv.innerHTML += 'Iniciando upload...<br>';
|
||||
|
||||
const response = await fetch('process.php', {
|
||||
method: 'POST',
|
||||
body: formData
|
||||
});
|
||||
|
||||
debugDiv.innerHTML += `Status da resposta: ${response.status}<br>`;
|
||||
|
||||
const text = await response.text();
|
||||
debugDiv.innerHTML += `Resposta: ${text}<br>`;
|
||||
|
||||
if (response.ok) {
|
||||
if (text.includes('Location:')) {
|
||||
window.location.href = text.split('Location: ')[1];
|
||||
} else {
|
||||
statusDiv.innerHTML = 'Upload realizado com sucesso!';
|
||||
window.location.href = 'index.php?page=doc_list&status=success';
|
||||
}
|
||||
} else {
|
||||
throw new Error(`Erro no servidor: ${text}`);
|
||||
}
|
||||
} catch (error) {
|
||||
statusDiv.innerHTML = `Erro: ${error.message}`;
|
||||
debugDiv.innerHTML += `Erro detalhado: ${error.stack}<br>`;
|
||||
}
|
||||
};
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in new issue
Block a user