SuiteConsultance/Templates/email/scraping_results.html
2025-09-20 13:18:04 +02:00

289 lines
13 KiB
HTML

{% extends "layouts/base.html" %}
{% block title %}Résultats du scraping{% endblock %}
{% block content %}
<div class="container-fluid">
<div class="row">
<div class="col-12">
<div class="d-flex justify-content-between align-items-center mb-4">
<h1 class="h3 mb-0">Résultats du scraping</h1>
<a href="{{ url_for('email_scraper_page') }}" class="btn btn-secondary">
<i class="fas fa-arrow-left"></i> Retour
</a>
</div>
<!-- Informations générales -->
<div class="row mb-4">
<div class="col-md-3">
<div class="card text-center">
<div class="card-body">
<h3 class="text-primary">{{ results.contacts|length }}</h3>
<p class="text-muted mb-0">Contacts trouvés</p>
</div>
</div>
</div>
<div class="col-md-3">
<div class="card text-center">
<div class="card-body">
<h3 class="text-info">{{ results.pages_scraped|length }}</h3>
<p class="text-muted mb-0">Pages scrapées</p>
</div>
</div>
</div>
<div class="col-md-3">
<div class="card text-center">
<div class="card-body">
<h3 class="text-warning">{{ results.errors|length }}</h3>
<p class="text-muted mb-0">Erreurs</p>
</div>
</div>
</div>
<div class="col-md-3">
<div class="card text-center">
<div class="card-body">
<small class="text-muted">Durée</small>
<p class="mb-0">
{% if results.start_time and results.end_time %}
{% set start = results.start_time | parse_datetime %}
{% set end = results.end_time | parse_datetime %}
{{ ((end - start).total_seconds() / 60) | round(1) }} min
{% else %}
N/A
{% endif %}
</p>
</div>
</div>
</div>
</div>
<!-- URL source -->
<div class="card mb-4">
<div class="card-header">
<h5 class="card-title mb-0">URL source</h5>
</div>
<div class="card-body">
<a href="{{ results.url }}" target="_blank" class="text-decoration-none">
{{ results.url }}
</a>
</div>
</div>
<!-- Contacts trouvés -->
{% if results.contacts %}
<div class="card mb-4">
<div class="card-header d-flex justify-content-between align-items-center">
<h5 class="card-title mb-0">Contacts trouvés ({{ results.contacts|length }})</h5>
<div>
<button type="button" class="btn btn-sm btn-outline-primary" onclick="selectAllContacts()">
Tout sélectionner
</button>
<button type="button" class="btn btn-sm btn-primary" onclick="createProspectsFromSelected()">
Créer prospects sélectionnés
</button>
</div>
</div>
<div class="card-body">
<div class="table-responsive">
<table class="table table-hover">
<thead>
<tr>
<th width="40"></th>
<th>Email</th>
<th>Nom</th>
<th>Entreprise</th>
<th>Téléphone</th>
<th>Localité</th>
</tr>
</thead>
<tbody>
{% for contact in results.contacts %}
<tr>
<td>
<div class="form-check">
<input class="form-check-input contact-checkbox" type="checkbox"
value="{{ contact.email }}" id="contact_{{ loop.index }}">
</div>
</td>
<td>
<strong>{{ contact.email }}</strong>
</td>
<td>
{% if contact.first_name or contact.last_name %}
{{ contact.first_name }} {{ contact.last_name }}
{% elif contact.name %}
{{ contact.name }}
{% else %}
<span class="text-muted">-</span>
{% endif %}
</td>
<td>
{% if contact.company %}
{{ contact.company }}
{% else %}
<span class="text-muted">-</span>
{% endif %}
</td>
<td>
{% if contact.phone %}
{{ contact.phone }}
{% else %}
<span class="text-muted">-</span>
{% endif %}
</td>
<td>
{% if contact.location %}
{{ contact.location }}
{% else %}
<span class="text-muted">-</span>
{% endif %}
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
</div>
</div>
{% endif %}
<!-- Pages scrapées -->
<div class="card mb-4">
<div class="card-header">
<h5 class="card-title mb-0">Pages scrapées ({{ results.pages_scraped|length }})</h5>
</div>
<div class="card-body">
<div class="table-responsive">
<table class="table table-sm">
<thead>
<tr>
<th>URL</th>
<th>Niveau</th>
<th>Contacts trouvés</th>
<th>Statut</th>
<th>Heure</th>
</tr>
</thead>
<tbody>
{% for page in results.pages_scraped %}
<tr class="{% if page.status == 'error' %}table-danger{% endif %}">
<td>
<a href="{{ page.url }}" target="_blank" class="text-decoration-none">
{{ page.url[:60] }}{% if page.url|length > 60 %}...{% endif %}
</a>
</td>
<td>
<span class="badge bg-secondary">{{ page.depth }}</span>
</td>
<td>
{% if page.contacts_found %}
<span class="badge bg-primary">{{ page.contacts_found }}</span>
{% if page.contacts and page.contacts|length > 0 %}
<small class="text-muted d-block">
{% for contact in page.contacts[:3] %}
{{ contact.email }}{% if not loop.last %}, {% endif %}
{% endfor %}
{% if page.contacts|length > 3 %}...{% endif %}
</small>
{% endif %}
{% else %}
<span class="badge bg-light text-dark">0</span>
{% endif %}
</td>
<td>
{% if page.status == 'success' %}
<span class="badge bg-success">Succès</span>
{% else %}
<span class="badge bg-danger">Erreur</span>
{% if page.error %}
<small class="text-danger d-block">{{ page.error }}</small>
{% endif %}
{% endif %}
</td>
<td>
<small class="text-muted">
{{ page.timestamp | datetime('%H:%M:%S') }}
</small>
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
</div>
</div>
<!-- Erreurs -->
{% if results.errors %}
<div class="card">
<div class="card-header">
<h5 class="card-title mb-0 text-danger">Erreurs ({{ results.errors|length }})</h5>
</div>
<div class="card-body">
{% for error in results.errors %}
<div class="alert alert-danger mb-2">{{ error }}</div>
{% endfor %}
</div>
</div>
{% endif %}
</div>
</div>
</div>
<script>
function selectAllContacts() {
const checkboxes = document.querySelectorAll('.contact-checkbox');
const allChecked = Array.from(checkboxes).every(cb => cb.checked);
checkboxes.forEach(cb => {
cb.checked = !allChecked;
});
}
function createProspectsFromSelected() {
const selectedEmails = Array.from(document.querySelectorAll('.contact-checkbox:checked'))
.map(cb => cb.value);
if (selectedEmails.length === 0) {
alert('Veuillez sélectionner au moins un contact');
return;
}
if (!confirm(`Créer ${selectedEmails.length} prospect(s) à partir des contacts sélectionnés ?`)) {
return;
}
fetch('/api/scraping/create_prospects', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({
filename: '{{ filename }}',
emails: selectedEmails
})
})
.then(response => response.json())
.then(data => {
if (data.success) {
let message = `${data.created} prospect(s) créé(s) avec succès`;
if (data.existing > 0) {
message += ` (${data.existing} contact(s) déjà existant(s))`;
}
alert(message);
// Décocher les contacts traités
document.querySelectorAll('.contact-checkbox:checked').forEach(cb => {
cb.checked = false;
});
} else {
alert(`Erreur: ${data.error}`);
}
})
.catch(error => {
console.error('Erreur:', error);
alert('Erreur lors de la création des prospects');
});
}
</script>
{% endblock %}