Files
wevads-platform/scripts/quick-access-settings.php
2026-02-26 04:53:11 +01:00

384 lines
20 KiB
PHP
Executable File

<?php
if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['config'])) {
$config = json_decode($_POST['config'], true);
file_put_contents(__DIR__ . '/data/quick-access-config.json', json_encode($config, JSON_PRETTY_PRINT | JSON_UNESCAPED_SLASHES));
echo json_encode(['success' => true]);
exit;
}
$config = json_decode(file_get_contents(__DIR__ . '/data/quick-access-config.json'), true);
?>
<!DOCTYPE html>
<html>
<head>
<title>Quick Access & Inbox Settings - WEVAL</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<style>
body { background: #1a1a2e; color: #fff; padding: 20px; }
.card { background: #16213e; border-radius: 10px; padding: 20px; margin-bottom: 20px; }
.btn-cyan { background: linear-gradient(135deg, #06b6d4, #0891b2); border: none; color: #fff; }
.btn-cyan:hover { background: linear-gradient(135deg, #0891b2, #0e7490); color: #fff; }
.nav-tabs > li > a { color: #888; background: transparent; border: none; }
.nav-tabs > li.active > a { color: #06b6d4; background: rgba(6,182,212,0.1); border: 1px solid #06b6d4; border-bottom: none; }
.tab-content { padding: 20px 0; }
.qa-item { background: rgba(6,182,212,0.1); border-radius: 8px; padding: 15px; margin: 10px 0; display: flex; align-items: center; }
.qa-item i.fa { font-size: 24px; margin-right: 15px; color: #67e8f9; }
.isp-card { background: rgba(6,182,212,0.1); border-radius: 8px; padding: 15px; margin: 10px 0; }
.account-badge { display: inline-block; background: #f59e0b; color: #fff; padding: 5px 12px; border-radius: 4px; margin: 3px; font-size: 12px; }
.account-badge .delete-account { margin-left: 8px; cursor: pointer; color: #fff; }
.modal-content { background: #16213e; color: #fff; }
.form-control { background: #1a1a2e; border: 1px solid #333; color: #fff; }
.form-control:focus { background: #1a1a2e; border-color: #06b6d4; color: #fff; }
.icon-grid { max-height: 200px; overflow-y: auto; background: #1a1a2e; border: 1px solid #333; border-radius: 4px; padding: 10px; }
.icon-option { display: inline-block; width: 40px; height: 40px; text-align: center; line-height: 40px; cursor: pointer; border-radius: 4px; margin: 2px; }
.icon-option:hover { background: rgba(6,182,212,0.2); }
.icon-option.selected { background: rgba(6,182,212,0.4); }
</style>
</head>
<body>
<div class="container">
<h2><i class="fa fa-cogs"></i> Quick Access & Inbox Extractor Settings</h2>
<ul class="nav nav-tabs">
<li class="active"><a data-toggle="tab" href="#tab-quickaccess"><i class="fa fa-th-large"></i> Quick Access</a></li>
<li><a data-toggle="tab" href="#tab-inbox"><i class="fa fa-envelope"></i> Inbox Extractor</a></li>
</ul>
<div class="tab-content">
<div id="tab-quickaccess" class="tab-pane fade in active">
<div class="card">
<h4>Raccourcis Quick Access <button class="btn btn-cyan btn-sm pull-right" onclick="showAddQA()"><i class="fa fa-plus"></i> Ajouter</button></h4>
<div id="qa-list"></div>
</div>
</div>
<div id="tab-inbox" class="tab-pane fade">
<div class="card">
<h4>ISPs configurés <button class="btn btn-cyan btn-sm pull-right" onclick="showAddISP()"><i class="fa fa-plus"></i> Ajouter ISP</button></h4>
<div id="isp-list"></div>
</div>
</div>
</div>
<button class="btn btn-cyan btn-lg" onclick="saveConfig()"><i class="fa fa-save"></i> Sauvegarder</button>
<a href="/dashboard" class="btn btn-default btn-lg"><i class="fa fa-arrow-left"></i> Retour</a>
</div>
<!-- Modal Ajouter Quick Access -->
<div class="modal fade" id="modalAddQA">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" style="color:#fff">&times;</button>
<h4>Ajouter un raccourci</h4>
</div>
<div class="modal-body">
<div class="form-group">
<label>Label</label>
<input type="text" id="qa-label" class="form-control" placeholder="Dashboard, Send Page...">
</div>
<div class="form-group">
<label>URL</label>
<input type="text" id="qa-url" class="form-control" placeholder="/dashboard">
</div>
<div class="form-group">
<label>Choisir une icône</label>
<div class="icon-grid" id="icon-picker"></div>
<input type="hidden" id="qa-icon">
</div>
<div class="form-group">
<label>Couleur</label>
<input type="color" id="qa-color" class="form-control" value="#67e8f9" style="height:40px;padding:5px;">
</div>
</div>
<div class="modal-footer">
<button class="btn btn-default" data-dismiss="modal">Annuler</button>
<button class="btn btn-cyan" onclick="addQA()">Ajouter</button>
</div>
</div>
</div>
</div>
<!-- Modal Ajouter ISP -->
<div class="modal fade" id="modalAddISP">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" style="color:#fff">&times;</button>
<h4>Ajouter un ISP</h4>
</div>
<div class="modal-body">
<div class="form-group">
<label>Nom ISP</label>
<input type="text" id="isp-name" class="form-control" placeholder="Gmail, Videotron..." oninput="autoFillISP()">
</div>
<div class="form-group">
<label>Serveur IMAP</label>
<input type="text" id="isp-imap" class="form-control" placeholder="imap.gmail.com">
</div>
<div class="form-group">
<label>URL Favicon</label>
<input type="text" id="isp-icon" class="form-control" placeholder="https://www.google.com/favicon.ico">
</div>
</div>
<div class="modal-footer">
<button class="btn btn-default" data-dismiss="modal">Annuler</button>
<button class="btn btn-cyan" onclick="addISP()">Ajouter</button>
</div>
</div>
</div>
</div>
<!-- Modal Ajouter Compte -->
<div class="modal fade" id="modalAddAccount">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" style="color:#fff">&times;</button>
<h4>Ajouter un compte à <span id="account-isp-name"></span></h4>
</div>
<div class="modal-body">
<input type="hidden" id="account-isp-index">
<div class="form-group">
<label>Label (nom court)</label>
<input type="text" id="account-label" class="form-control" placeholder="johndoe">
</div>
<div class="form-group">
<label>Email</label>
<input type="email" id="account-email" class="form-control" placeholder="johndoe@gmail.com">
</div>
<div class="form-group">
<label>Mot de passe</label>
<input type="text" id="account-pass" class="form-control" placeholder="password123">
</div>
</div>
<div class="modal-footer">
<button class="btn btn-default" data-dismiss="modal">Annuler</button>
<button class="btn btn-cyan" onclick="addAccount()">Ajouter</button>
</div>
</div>
</div>
</div>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
<script>
var config = <?php echo json_encode($config); ?>;
// Liste des icônes populaires
var popularIcons = [
"fa-dashboard", "fa-home", "fa-cog", "fa-cogs", "fa-wrench", "fa-sliders",
"fa-send", "fa-paper-plane", "fa-envelope", "fa-inbox", "fa-mail-forward",
"fa-server", "fa-database", "fa-cloud", "fa-cloud-upload", "fa-cloud-download",
"fa-users", "fa-user", "fa-user-plus", "fa-group", "fa-address-book",
"fa-list", "fa-th", "fa-th-large", "fa-th-list", "fa-table",
"fa-bar-chart", "fa-line-chart", "fa-pie-chart", "fa-area-chart", "fa-signal",
"fa-file", "fa-file-text", "fa-folder", "fa-folder-open", "fa-archive",
"fa-download", "fa-upload", "fa-share", "fa-link", "fa-external-link",
"fa-search", "fa-filter", "fa-sort", "fa-refresh", "fa-repeat",
"fa-plus", "fa-minus", "fa-edit", "fa-trash", "fa-times",
"fa-check", "fa-check-circle", "fa-exclamation", "fa-warning", "fa-info-circle",
"fa-lock", "fa-unlock", "fa-key", "fa-shield", "fa-eye",
"fa-clock-o", "fa-calendar", "fa-bell", "fa-flag", "fa-bookmark",
"fa-star", "fa-heart", "fa-thumbs-up", "fa-comment", "fa-comments",
"fa-globe", "fa-map-marker", "fa-phone", "fa-mobile", "fa-laptop",
"fa-desktop", "fa-tablet", "fa-hdd-o", "fa-usb", "fa-wifi",
"fa-bolt", "fa-rocket", "fa-magic", "fa-fire", "fa-flash",
"fa-money", "fa-credit-card", "fa-shopping-cart", "fa-dollar", "fa-euro",
"fa-play", "fa-pause", "fa-stop", "fa-forward", "fa-backward",
"fa-code", "fa-terminal", "fa-bug", "fa-github", "fa-bitbucket"
];
var ispDefaults = {
'telekom': { imap: 'secureimap.t-online.de', icon: 'https://www.t-online.de/favicon.ico' },
'hotmail': { imap: 'imap-mail.outlook.com', icon: 'https://www.microsoft.com/favicon.ico' },
'live': { imap: 'imap-mail.outlook.com', icon: 'https://www.microsoft.com/favicon.ico' },
'msn': { imap: 'imap-mail.outlook.com', icon: 'https://www.microsoft.com/favicon.ico' },
'aol': { imap: 'imap.aol.com', icon: 'https://www.aol.com/favicon.ico' },
'gmx': { imap: 'imap.gmx.net', icon: 'https://www.gmx.net/favicon.ico' },
'web.de': { imap: 'imap.web.de', icon: 'https://www.web.de/favicon.ico' },
'icloud': { imap: 'imap.mail.me.com', icon: 'https://www.apple.com/favicon.ico' },
'free': { imap: 'imap.free.fr', icon: 'https://www.free.fr/favicon.ico' },
'sfr': { imap: 'imap.sfr.fr', icon: 'https://www.sfr.fr/favicon.ico' },
'laposte': { imap: 'imap.laposte.net', icon: 'https://www.laposte.net/favicon.ico' },
'comcast': { imap: 'imap.comcast.net', icon: 'https://www.xfinity.com/favicon.ico' },
'att': { imap: 'imap.mail.att.net', icon: 'https://www.att.com/favicon.ico' },
'verizon': { imap: 'incoming.verizon.net', icon: 'https://www.verizon.com/favicon.ico' },
'cox': { imap: 'imap.cox.net', icon: 'https://www.cox.com/favicon.ico' },
'shaw': { imap: 'imap.shaw.ca', icon: 'https://www.shaw.ca/favicon.ico' },
'bell': { imap: 'imap.bell.net', icon: 'https://www.bell.ca/favicon.ico' },
'rogers': { imap: 'imap.rogers.com', icon: 'https://www.rogers.com/favicon.ico' },
'gmail': { imap: 'imap.gmail.com', icon: 'https://www.google.com/favicon.ico' },
'outlook': { imap: 'imap-mail.outlook.com', icon: 'https://www.microsoft.com/favicon.ico' },
'yahoo': { imap: 'imap.mail.yahoo.com', icon: 'https://www.yahoo.com/favicon.ico' },
'videotron': { imap: 'imap.videotron.ca', icon: 'https://cdn.brandfetch.io/idnkqLZ3vt/theme/dark/symbol.png' },
't-online': { imap: 'secureimap.t-online.de', icon: 'https://www.t-online.de/favicon.ico' },
'spectrum': { imap: 'imap.charter.net', icon: 'https://cdn.brandfetch.io/idxAg10C0L/theme/dark/symbol.png' },
'orange': { imap: 'imap.orange.fr', icon: 'https://www.orange.fr/favicon.ico' }
};
// Render icon picker
function renderIconPicker() {
var html = '';
popularIcons.forEach(function(icon) {
html += '<span class="icon-option" data-icon="' + icon + '" onclick="selectIcon(\'' + icon + '\')"><i class="fa ' + icon + '" style="font-size:18px;color:#67e8f9;"></i></span>';
});
$('#icon-picker').html(html);
}
function selectIcon(icon) {
$('#qa-icon').val(icon);
$('.icon-option').removeClass('selected');
$('.icon-option[data-icon="' + icon + '"]').addClass('selected');
}
// ========== QUICK ACCESS ==========
function renderQA() {
var html = '';
if (config.quickAccess && config.quickAccess.length > 0) {
config.quickAccess.forEach(function(item, i) {
html += '<div class="qa-item">';
html += '<i class="fa ' + item.icon + '" style="color:' + (item.color || '#67e8f9') + '"></i>';
html += '<div style="flex:1"><strong>' + item.label + '</strong><br><small style="color:#888">' + item.url + '</small></div>';
html += '<button class="btn btn-xs btn-danger" onclick="deleteQA(' + i + ')"><i class="fa fa-trash"></i></button>';
html += '</div>';
});
} else {
html = '<p style="color:#888">Aucun raccourci configuré</p>';
}
$('#qa-list').html(html);
}
function showAddQA() {
$('#qa-label, #qa-url').val('');
$('#qa-icon').val('');
$('#qa-color').val('#67e8f9');
$('.icon-option').removeClass('selected');
renderIconPicker();
$('#modalAddQA').modal('show');
}
function addQA() {
var label = $('#qa-label').val();
var url = $('#qa-url').val();
var icon = $('#qa-icon').val();
var color = $('#qa-color').val();
if (!label || !url) { alert('Label et URL requis'); return; }
if (!icon) { alert('Veuillez choisir une icône'); return; }
if (!config.quickAccess) config.quickAccess = [];
config.quickAccess.push({ label: label, url: url, icon: icon, color: color });
$('#modalAddQA').modal('hide');
renderQA();
}
function deleteQA(index) {
if (confirm('Supprimer ce raccourci ?')) {
config.quickAccess.splice(index, 1);
renderQA();
}
}
// ========== INBOX EXTRACTOR ==========
function autoFillISP() {
var name = $('#isp-name').val().toLowerCase();
for (var key in ispDefaults) {
if (name.indexOf(key) !== -1) {
$('#isp-imap').val(ispDefaults[key].imap);
$('#isp-icon').val(ispDefaults[key].icon);
break;
}
}
}
function renderISPs() {
var html = '';
if (config.inboxExtractor && config.inboxExtractor.length > 0) {
config.inboxExtractor.forEach(function(isp, i) {
html += '<div class="isp-card">';
html += '<strong><img src="' + isp.icon + '" style="width:16px;margin-right:8px;" onerror="this.style.display=\'none\'">' + isp.name + '</strong>';
html += ' <small style="color:#888">(' + (isp.imap || 'N/A') + ')</small>';
html += '<button class="btn btn-xs btn-danger pull-right" onclick="deleteISP(' + i + ')"><i class="fa fa-trash"></i></button>';
html += '<button class="btn btn-xs btn-cyan pull-right" style="margin-right:5px" onclick="showAddAccount(' + i + ')"><i class="fa fa-plus"></i> Compte</button>';
html += '<div style="margin-top:10px">';
if (isp.accounts && isp.accounts.length > 0) {
isp.accounts.forEach(function(acc, j) {
html += '<span class="account-badge">' + acc.label + ' <i class="fa fa-times delete-account" onclick="deleteAccount(' + i + ',' + j + ')"></i></span>';
});
} else {
html += '<em style="color:#888">Aucun compte - cliquez "+ Compte" pour ajouter</em>';
}
html += '</div></div>';
});
} else {
html = '<p style="color:#888">Aucun ISP configuré</p>';
}
$('#isp-list').html(html);
}
function showAddISP() {
$('#isp-name, #isp-imap, #isp-icon').val('');
$('#modalAddISP').modal('show');
}
function addISP() {
var name = $('#isp-name').val();
var imap = $('#isp-imap').val();
var icon = $('#isp-icon').val();
if (!name || !imap) { alert('Nom et IMAP requis'); return; }
if (!config.inboxExtractor) config.inboxExtractor = [];
config.inboxExtractor.push({ name: name, imap: imap, icon: icon, accounts: [] });
$('#modalAddISP').modal('hide');
renderISPs();
}
function deleteISP(index) {
if (confirm('Supprimer cet ISP et tous ses comptes ?')) {
config.inboxExtractor.splice(index, 1);
renderISPs();
}
}
function showAddAccount(ispIndex) {
$('#account-isp-index').val(ispIndex);
$('#account-isp-name').text(config.inboxExtractor[ispIndex].name);
$('#account-label, #account-email, #account-pass').val('');
$('#modalAddAccount').modal('show');
}
function addAccount() {
var ispIndex = parseInt($('#account-isp-index').val());
var label = $('#account-label').val();
var email = $('#account-email').val();
var pass = $('#account-pass').val();
if (!label || !email || !pass) { alert('Tous les champs sont requis'); return; }
var isp = config.inboxExtractor[ispIndex];
if (!isp.accounts) isp.accounts = [];
isp.accounts.push({ label: label, email: email, pass: pass, imap: isp.imap });
$('#modalAddAccount').modal('hide');
renderISPs();
}
function deleteAccount(ispIndex, accIndex) {
config.inboxExtractor[ispIndex].accounts.splice(accIndex, 1);
renderISPs();
}
// ========== SAVE ==========
function saveConfig() {
$.post('', { config: JSON.stringify(config) }, function(res) {
alert('Configuration sauvegardée !');
});
}
$(document).ready(function() {
renderQA();
renderISPs();
renderIconPicker();
});
</script>
<?php include("includes/chatbot-widget.php"); ?>
</body>
</html>