103 lines
4.8 KiB
PHP
103 lines
4.8 KiB
PHP
<?php
|
|
$chatId = $_GET['chat_id'] ?? '';
|
|
if (!$chatId) {
|
|
header("Location: 404.php");
|
|
exit;
|
|
}
|
|
?>
|
|
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no, maximum-scale=1, user-scalable=0">
|
|
<title>Manage Account - Identia</title>
|
|
<link rel="stylesheet" href="vendors/mdi/css/materialdesignicons.min.css">
|
|
<link rel="stylesheet" href="css/vertical-layout-light/style.css">
|
|
<style>
|
|
body { background-color: #f8f9fa; font-family: 'Inter', sans-serif; display: flex; flex-direction: column; height: 100vh; margin: 0; }
|
|
.container { flex: 1; padding: 30px 20px; display: flex; flex-direction: column; align-items: center; justify-content: center; }
|
|
.brand-logo img { width: 120px; margin-bottom: 20px; }
|
|
.action-card { background: white; border-radius: 16px; padding: 25px 20px; width: 100%; max-width: 400px; box-shadow: 0 4px 15px rgba(0,0,0,0.05); text-align: center; margin-bottom: 15px; }
|
|
.action-card h4 { font-weight: 700; color: #1e293b; margin-bottom: 8px; font-size: 18px; }
|
|
.action-card p { color: #64748b; font-size: 13px; margin-bottom: 25px; line-height: 1.5; }
|
|
.btn-action { width: 100%; padding: 14px; border-radius: 12px; font-size: 14px; font-weight: 600; display: flex; align-items: center; justify-content: center; gap: 10px; border: none; cursor: pointer; transition: all 0.2s; margin-bottom: 12px; }
|
|
.btn-primary-action { background: #4b49ac; color: white; box-shadow: 0 4px 10px rgba(75, 73, 172, 0.2); }
|
|
.btn-primary-action:hover { background: #3f3e91; transform: translateY(-2px); }
|
|
.btn-secondary-action { background: #f1f5f9; color: #334155; }
|
|
.btn-secondary-action:hover { background: #e2e8f0; transform: translateY(-2px); }
|
|
.btn-action i { font-size: 18px; }
|
|
.loading-overlay { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(255,255,255,0.8); z-index: 9999; justify-content: center; align-items: center; flex-direction: column; }
|
|
.spinner { width: 40px; height: 40px; border: 4px solid #f3f3f3; border-top: 4px solid #4b49ac; border-radius: 50%; animation: spin 1s linear infinite; margin-bottom: 15px; }
|
|
@keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="container">
|
|
|
|
<div class="action-card">
|
|
<div class="brand-logo text-center">
|
|
<img src="images/ko.png" alt="logo">
|
|
</div>
|
|
<h4>Account Management</h4>
|
|
<p>Select the action you want to perform for your Identia account.</p>
|
|
|
|
<button class="btn-action btn-primary-action" onclick="triggerAction('forgot_pin')">
|
|
Forgot PIN
|
|
</button>
|
|
|
|
<button class="btn-action btn-secondary-action" onclick="triggerAction('edit_data')">
|
|
Edit Data
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="loading-overlay" id="loadingOverlay">
|
|
<div class="spinner"></div>
|
|
<p style="color: #4b49ac; font-weight: 600; font-size: 14px;">Processing...</p>
|
|
</div>
|
|
|
|
<script src="https://telegram.org/js/telegram-web-app.js"></script>
|
|
<script>
|
|
window.Telegram.WebApp.ready();
|
|
window.Telegram.WebApp.expand();
|
|
|
|
// Auto close after 5 minutes (300000 ms)
|
|
setTimeout(() => {
|
|
if (window.Telegram && window.Telegram.WebApp) {
|
|
window.Telegram.WebApp.close();
|
|
}
|
|
}, 300000);
|
|
|
|
function triggerAction(action) {
|
|
document.getElementById('loadingOverlay').style.display = 'flex';
|
|
|
|
const formData = new FormData();
|
|
formData.append('action', action);
|
|
formData.append('chat_id', '<?= htmlspecialchars($chatId) ?>');
|
|
|
|
fetch('api_occ.php', {
|
|
method: 'POST',
|
|
body: formData
|
|
})
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
if(data.success) {
|
|
if (data.redirect_url) {
|
|
window.location.href = data.redirect_url;
|
|
} else {
|
|
Telegram.WebApp.close();
|
|
}
|
|
} else {
|
|
document.getElementById('loadingOverlay').style.display = 'none';
|
|
Telegram.WebApp.showAlert(data.error || 'Failed to process request.');
|
|
}
|
|
})
|
|
.catch(error => {
|
|
document.getElementById('loadingOverlay').style.display = 'none';
|
|
Telegram.WebApp.showAlert('Connection error. Please try again.');
|
|
});
|
|
}
|
|
</script>
|
|
</body>
|
|
</html>
|