63 lines
2.2 KiB
HTML
63 lines
2.2 KiB
HTML
{% extends "base.html" %}
|
|
|
|
{% block title %}{{ t.login_heading }} | {{ t.site_name }}{% endblock title %}
|
|
|
|
{% block head_extra %}
|
|
<script src="https://telegram.org/js/telegram-web-app.js"></script>
|
|
<style>
|
|
* { box-sizing: border-box; }
|
|
body { margin: 0; min-height: 100vh; display: grid; place-items: center; padding: 1rem; background: #f5f5f5; color: #333; font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
|
|
.telegram-login-card { width: min(380px, 100%); border-radius: 8px; background: #fff; box-shadow: 0 2px 8px rgba(0,0,0,.12); padding: 2rem; text-align: center; display: grid; gap: .8rem; }
|
|
.telegram-login-card h1 { margin: 0; font-size: 1.35rem; }
|
|
.telegram-login-card p { margin: 0; color: #666; line-height: 1.45; }
|
|
.telegram-login-card a { color: #1a1a2e; font-weight: 700; }
|
|
</style>
|
|
{% endblock head_extra %}
|
|
|
|
{% block body %}
|
|
<div class="telegram-login-card">
|
|
<h1>{{ t.login_heading }}</h1>
|
|
<p id="telegram-login-status">{{ t.login_telegram_wait }}</p>
|
|
<a href="/login">{{ t.login_telegram_fallback }}</a>
|
|
</div>
|
|
|
|
<script>
|
|
(async () => {
|
|
const status = document.getElementById('telegram-login-status');
|
|
const fallback = () => window.location.replace('/login');
|
|
const webApp = window.Telegram && window.Telegram.WebApp;
|
|
|
|
try {
|
|
if (webApp) {
|
|
webApp.ready();
|
|
webApp.expand();
|
|
}
|
|
} catch (_) {}
|
|
|
|
if (!webApp || !webApp.initData) {
|
|
fallback();
|
|
return;
|
|
}
|
|
|
|
try {
|
|
const response = await fetch('/api/telegram-login/webapp', {
|
|
method: 'POST',
|
|
credentials: 'same-origin',
|
|
headers: { 'content-type': 'application/json' },
|
|
body: JSON.stringify({ init_data: webApp.initData }),
|
|
});
|
|
const data = await response.json().catch(() => ({}));
|
|
if (!response.ok) {
|
|
status.textContent = data.error || data.detail || '{{ t.login_telegram_failed }}';
|
|
setTimeout(fallback, 1800);
|
|
return;
|
|
}
|
|
window.location.replace(data.redirect_to || '/configs');
|
|
} catch (_) {
|
|
status.textContent = '{{ t.login_telegram_failed }}';
|
|
setTimeout(fallback, 1800);
|
|
}
|
|
})();
|
|
</script>
|
|
{% endblock body %}
|