Spaces:
Running
Running
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Settings - Janus Scanner Pro</title> | |
| <link rel="icon" type="image/x-icon" href="/static/favicon.ico"> | |
| <link rel="stylesheet" href="style.css"> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script> | |
| </head> | |
| <body class="bg-black text-terminal-green"> | |
| <div class="scanline"></div> | |
| <custom-navbar></custom-navbar> | |
| <main class="container mx-auto px-4 py-8 relative z-10"> | |
| <section class="text-center mb-12"> | |
| <h2 class="text-3xl font-bold text-accent mb-4">[CONFIGURATION SYSTÈME]</h2> | |
| <p class="text-gray-400 max-w-2xl mx-auto"> | |
| Configuration des paramètres d'analyse et des clés API. | |
| </p> | |
| </section> | |
| <!-- API Configuration --> | |
| <div class="bg-secondary border border-gray-700 rounded-lg p-6 mb-8"> | |
| <h3 class="card-title mb-4"> | |
| <i data-feather="key" class="inline mr-2"></i> | |
| CONFIGURATION API | |
| </h3> | |
| <div class="space-y-4"> | |
| <div> | |
| <label class="block text-gray-300 mb-2">OpenRouter API Key</label> | |
| <input type="password" id="apiKeyInput" placeholder="sk-or-v1-..." | |
| class="w-full bg-gray-800 px-4 py-2 rounded border border-gray-600 focus:border-accent focus:outline-none"> | |
| <p class="text-xs text-gray-500 mt-1">Clé API nécessaire pour l'analyse IA avancée</p> | |
| </div> | |
| <button id="saveApiKeyBtn" class="btn"> | |
| SAUVEGARDER CLÉ API | |
| </button> | |
| <button id="testApiBtn" class="btn btn-secondary ml-2"> | |
| TESTER CONNEXION | |
| </button> | |
| </div> | |
| <div id="apiTestResult" class="mt-4 hidden"></div> | |
| </div> | |
| <!-- Analysis Parameters --> | |
| <div class="bg-secondary border border-gray-700 rounded-lg p-6 mb-8"> | |
| <h3 class="card-title mb-4"> | |
| <i data-feather="sliders" class="inline mr-2"></i> | |
| PARAMÈTRES D'ANALYSE | |
| </h3> | |
| <div class="grid grid-cols-1 md:grid-cols-2 gap-6"> | |
| <div> | |
| <label class="block text-gray-300 mb-2">Seuil d'Alerte Haut Risque (%)</label> | |
| <input type="number" id="highRiskThreshold" value="70" min="50" max="90" | |
| class="w-full bg-gray-800 px-4 py-2 rounded border border-gray-600 focus:border-accent focus:outline-none"> | |
| </div> | |
| <div> | |
| <label class="block text-gray-300 mb-2">Seuil d'Alerte Moyen Risque (%)</label> | |
| <input type="number" id="mediumRiskThreshold" value="40" min="20" max="60" | |
| class="w-full bg-gray-800 px-4 py-2 rounded border border-gray-600 focus:border-accent focus:outline-none"> | |
| </div> | |
| <div> | |
| <label class="block text-gray-300 mb-2">Montant Transaction Suspect (€)</label> | |
| <input type="number" id="suspiciousAmount" value="5000" min="1000" | |
| class="w-full bg-gray-800 px-4 py-2 rounded border border-gray-600 focus:border-accent focus:outline-none"> | |
| </div> | |
| <div> | |
| <label class="block text-gray-300 mb-2">Mode d'Analyse</label> | |
| <select id="analysisMode" class="w-full bg-gray-800 px-4 py-2 rounded border border-gray-600 focus:border-accent focus:outline-none"> | |
| <option value="standard">Standard</option> | |
| <option value="aggressive">Agressif (IA Avancée)</option> | |
| <option value="stealth">Furtif (Anonyme Maximum)</option> | |
| </select> | |
| </div> | |
| </div> | |
| <button id="saveParamsBtn" class="btn mt-4"> | |
| SAUVEGARDER PARAMÈTRES | |
| </button> | |
| </div> | |
| <!-- Security Settings --> | |
| <div class="bg-secondary border border-gray-700 rounded-lg p-6 mb-8"> | |
| <h3 class="card-title mb-4"> | |
| <i data-feather="shield" class="inline mr-2"></i> | |
| SÉCURITÉ | |
| </h3> | |
| <div class="space-y-4"> | |
| <div class="flex items-center justify-between"> | |
| <label class="text-gray-300">Mode Furtif (TOR)</label> | |
| <input type="checkbox" id="stealthMode" checked class="w-4 h-4"> | |
| </div> | |
| <div class="flex items-center justify-between"> | |
| <label class="text-gray-300">Journalisation Désactivée</label> | |
| <input type="checkbox" id="noLogging" checked class="w-4 h-4"> | |
| </div> | |
| <div class="flex items-center justify-between"> | |
| <label class="text-gray-300">Chiffrement PDF</label> | |
| <input type="checkbox" id="pdfEncryption" checked class="w-4 h-4"> | |
| </div> | |
| <div> | |
| <label class="block text-gray-300 mb-2">Mot de passe PDF</label> | |
| <input type="password" id="pdfPassword" placeholder="Laissez vide pour générer automatiquement" | |
| class="w-full bg-gray-800 px-4 py-2 rounded border border-gray-600 focus:border-accent focus:outline-none"> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Alert Contacts --> | |
| <div class="bg-secondary border border-gray-700 rounded-lg p-6 mb-8"> | |
| <h3 class="card-title mb-4"> | |
| <i data-feather="users" class="inline mr-2"></i> | |
| CONTACTS ALERTES | |
| </h3> | |
| <div class="space-y-4"> | |
| <div> | |
| <label class="block text-gray-300 mb-2">Email Procureur</label> | |
| <input type="email" id="procureurEmail" placeholder="procureur@justice.gouv.fr" | |
| class="w-full bg-gray-800 px-4 py-2 rounded border border-gray-600 focus:border-accent focus:outline-none"> | |
| </div> | |
| <div> | |
| <label class="block text-gray-300 mb-2">Email TRACFIN</label> | |
| <input type="email" id="tracfinEmail" placeholder="alerte@tracfin.gouv.fr" | |
| class="w-full bg-gray-800 px-4 py-2 rounded border border-gray-600 focus:border-accent focus:outline-none"> | |
| </div> | |
| <div> | |
| <label class="block text-gray-300 mb-2">Email Douanes</label> | |
| <input type="email" id="douaneEmail" placeholder="douane@douane.gouv.fr" | |
| class="w-full bg-gray-800 px-4 py-2 rounded border border-gray-600 focus:border-accent focus:outline-none"> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- System Status --> | |
| <div class="bg-secondary border border-accent rounded-lg p-6"> | |
| <h3 class="card-title mb-4"> | |
| <i data-feather="activity" class="inline mr-2"></i> | |
| STATUT SYSTÈME | |
| </h3> | |
| <div class="grid grid-cols-1 md:grid-cols-3 gap-4"> | |
| <div class="text-center p-4 bg-gray-900 rounded border border-green-500"> | |
| <i data-feather="shield" class="text-green-500 mx-auto mb-2"></i> | |
| <div class="text-green-500 font-semibold">SÉCURITÉ</div> | |
| <div class="text-sm text-gray-400">Activée</div> | |
| </div> | |
| <div class="text-center p-4 bg-gray-900 rounded border border-blue-500"> | |
| <i data-feather="cpu" class="text-blue-500 mx-auto mb-2"></i> | |
| <div class="text-blue-500 font-semibold">IA ANALYSE</div> | |
| <div class="text-sm text-gray-400" id="aiStatus">En attente de clé API</div> | |
| </div> | |
| <div class="text-center p-4 bg-gray-900 rounded border border-purple-500"> | |
| <i data-feather="database" class="text-purple-500 mx-auto mb-2"></i> | |
| <div class="text-purple-500 font-semibold">BASE DE DONNÉES</div> | |
| <div class="text-sm text-gray-400">Locale</div> | |
| </div> | |
| </div> | |
| <div class="mt-4 text-center"> | |
| <button id="clearDataBtn" class="btn btn-secondary"> | |
| <i data-feather="trash-2" class="inline mr-2"></i> | |
| VIDER DONNÉES LOCALES | |
| </button> | |
| </div> | |
| </div> | |
| </main> | |
| <custom-footer></custom-footer> | |
| <script src="components/navbar.js"></script> | |
| <script src="components/footer.js"></script> | |
| <script src="components/api-status.js"></script> | |
| <script src="script.js"></script> | |
| <script> | |
| document.addEventListener('DOMContentLoaded', function() { | |
| feather.replace(); | |
| // Load saved settings | |
| const settings = JSON.parse(localStorage.getItem('janusSettings') || '{}'); | |
| const alertConfig = JSON.parse(localStorage.getItem('alertConfig') || '{}'); | |
| // Populate form fields | |
| if (settings.apiKey) { | |
| document.getElementById('apiKeyInput').value = settings.apiKey; | |
| } | |
| // Analysis parameters | |
| document.getElementById('highRiskThreshold').value = settings.highRiskThreshold || 70; | |
| document.getElementById('mediumRiskThreshold').value = settings.mediumRiskThreshold || 40; | |
| document.getElementById('suspiciousAmount').value = settings.suspiciousAmount || 5000; | |
| document.getElementById('analysisMode').value = settings.analysisMode || 'standard'; | |
| // Security settings | |
| document.getElementById('stealthMode').checked = settings.stealthMode !== false; | |
| document.getElementById('noLogging').checked = settings.noLogging !== false; | |
| document.getElementById('pdfEncryption').checked = settings.pdfEncryption !== false; | |
| // Alert contacts | |
| document.getElementById('procureurEmail').value = settings.procureurEmail || ''; | |
| document.getElementById('tracfinEmail').value = settings.tracfinEmail || ''; | |
| document.getElementById('douaneEmail').value = settings.douaneEmail || ''; | |
| // Update AI status | |
| updateAIStatus(); | |
| // Save API Key | |
| document.getElementById('saveApiKeyBtn').addEventListener('click', function() { | |
| const apiKey = document.getElementById('apiKeyInput').value.trim(); | |
| if (!apiKey) { | |
| alert('Veuillez entrer une clé API valide'); | |
| return; | |
| } | |
| const settings = JSON.parse(localStorage.getItem('janusSettings') || '{}'); | |
| settings.apiKey = apiKey; | |
| localStorage.setItem('janusSettings', JSON.stringify(settings)); | |
| alert('Clé API sauvegardée avec succès!'); | |
| updateAIStatus(); | |
| }); | |
| // Test API Connection | |
| document.getElementById('testApiBtn').addEventListener('click', async function() { | |
| const apiKey = document.getElementById('apiKeyInput').value.trim(); | |
| if (!apiKey) { | |
| alert('Veuillez d\'abord sauvegarder une clé API'); | |
| return; | |
| } | |
| const btn = this; | |
| btn.disabled = true; | |
| btn.innerHTML = '<i data-feather="loader" class="animate-spin inline mr-2"></i>Test en cours...'; | |
| feather.replace(); | |
| try { | |
| const response = await fetch('https://openrouter.ai/api/v1/models', { | |
| headers: { | |
| 'Authorization': `Bearer ${apiKey}`, | |
| 'HTTP-Referer': window.location.href, | |
| 'X-Title': 'Janus Scanner Pro' | |
| } | |
| }); | |
| const resultDiv = document.getElementById('apiTestResult'); | |
| resultDiv.classList.remove('hidden'); | |
| if (response.ok) { | |
| resultDiv.innerHTML = '<div class="text-green-500 p-3 bg-green-900 bg-opacity-30 rounded border border-green-500">✅ Connexion API réussie!</div>'; | |
| updateAIStatus(); | |
| } else { | |
| resultDiv.innerHTML = `<div class="text-red-500 p-3 bg-red-900 bg-opacity-30 rounded border border-red-500">❌ Erreur API: ${response.status}</div>`; | |
| } | |
| } catch (error) { | |
| const resultDiv = document.getElementById('apiTestResult'); | |
| resultDiv.classList.remove('hidden'); | |
| resultDiv.innerHTML = `<div class="text-red-500 p-3 bg-red-900 bg-opacity-30 rounded border border-red-500">❌ Erreur de connexion: ${error.message}</div>`; | |
| } finally { | |
| btn.disabled = false; | |
| btn.innerHTML = 'TESTER CONNEXION'; | |
| feather.replace(); | |
| } | |
| }); | |
| // Save Parameters | |
| document.getElementById('saveParamsBtn').addEventListener('click', function() { | |
| const settings = JSON.parse(localStorage.getItem('janusSettings') || '{}'); | |
| settings.highRiskThreshold = parseInt(document.getElementById('highRiskThreshold').value); | |
| settings.mediumRiskThreshold = parseInt(document.getElementById('mediumRiskThreshold').value); | |
| settings.suspiciousAmount = parseInt(document.getElementById('suspiciousAmount').value); | |
| settings.analysisMode = document.getElementById('analysisMode').value; | |
| settings.stealthMode = document.getElementById('stealthMode').checked; | |
| settings.noLogging = document.getElementById('noLogging').checked; | |
| settings.pdfEncryption = document.getElementById('pdfEncryption').checked; | |
| settings.pdfPassword = document.getElementById('pdfPassword').value; | |
| settings.procureurEmail = document.getElementById('procureurEmail').value; | |
| settings.tracfinEmail = document.getElementById('tracfinEmail').value; | |
| settings.douaneEmail = document.getElementById('douaneEmail').value; | |
| localStorage.setItem('janusSettings', JSON.stringify(settings)); | |
| alert('Paramètres sauvegardés avec succès!'); | |
| }); | |
| // Clear Local Data | |
| document.getElementById('clearDataBtn').addEventListener('click', function() { | |
| if (confirm('⚠️ Êtes-vous sûr de vouloir supprimer toutes les données locales?\nCela effacera l\'historique et les paramètres.')) { | |
| localStorage.removeItem('scanHistory'); | |
| localStorage.removeItem('janusSettings'); | |
| localStorage.removeItem('alertConfig'); | |
| alert('Données locales supprimées!'); | |
| } | |
| }); | |
| function updateAIStatus() { | |
| const settings = JSON.parse(localStorage.getItem('janusSettings') || '{}'); | |
| const aiStatus = document.getElementById('aiStatus'); | |
| if (settings.apiKey) { | |
| aiStatus.textContent = 'API Configurée'; | |
| aiStatus.className = 'text-sm text-green-400'; | |
| } else { | |
| aiStatus.textContent = 'En attente de clé API'; | |
| aiStatus.className = 'text-sm text-yellow-400'; | |
| } | |
| } | |
| }); | |
| </script> | |
| </body> | |
| </html> |