test/vpn-panel
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Initial commit: VPN panel on Go, PostgreSQL 17, Docker, Xray-core

Browse Source
This commit is contained in:
vpn-panel
2026-05-21 18:55:14 +03:00
commit 3c2f5226d1
27 changed files with 1778 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/embed.go
+9
View File
@@ -0,0 +1,9 @@
package web
import "embed"
//go:embed static/*
var Static embed.FS
//go:embed templates/*
var Templates embed.FS
web/static/css/style.css
+293
View File
@@ -0,0 +1,293 @@
:root {
--bg: #0a0e14;
--surface: #121820;
--border: #1e2a3a;
--text: #e6edf5;
--muted: #8b9cb3;
--accent: #3d9eff;
--accent2: #7c5cff;
--success: #3dd68c;
--error: #f07178;
--radius: 12px;
--font: "Outfit", system-ui, sans-serif;
--mono: "JetBrains Mono", monospace;
}
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body {
font-family: var(--font);
background: var(--bg);
color: var(--text);
min-height: 100vh;
line-height: 1.6;
}
.bg-grid {
position: fixed;
inset: 0;
background-image:
linear-gradient(rgba(61, 158, 255, 0.03) 1px, transparent 1px),
linear-gradient(90deg, rgba(61, 158, 255, 0.03) 1px, transparent 1px);
background-size: 48px 48px;
pointer-events: none;
z-index: 0;
}
.header {
position: relative;
z-index: 10;
display: flex;
align-items: center;
justify-content: space-between;
padding: 1rem 2rem;
border-bottom: 1px solid var(--border);
background: rgba(10, 14, 20, 0.85);
backdrop-filter: blur(12px);
}
.logo {
display: flex;
align-items: center;
gap: 0.5rem;
text-decoration: none;
color: var(--text);
font-weight: 700;
font-size: 1.15rem;
}
.logo-icon { color: var(--accent); font-size: 1.4rem; }
.logo-badge {
font-size: 0.65rem;
font-family: var(--mono);
background: linear-gradient(135deg, var(--accent), var(--accent2));
color: #fff;
padding: 0.15rem 0.45rem;
border-radius: 4px;
text-transform: uppercase;
letter-spacing: 0.05em;
}
.nav { display: flex; align-items: center; gap: 1.25rem; }
.nav a { color: var(--muted); text-decoration: none; font-weight: 500; transition: color 0.2s; }
.nav a:hover { color: var(--text); }
.nav-user { color: var(--accent); font-size: 0.9rem; font-family: var(--mono); }
.btn-nav {
background: var(--accent) !important;
color: #fff !important;
padding: 0.4rem 1rem;
border-radius: 8px;
}
.main {
position: relative;
z-index: 1;
max-width: 1100px;
margin: 0 auto;
padding: 2rem;
}
.flash {
position: relative;
z-index: 20;
max-width: 1100px;
margin: 1rem auto 0;
padding: 0.85rem 1.25rem;
border-radius: var(--radius);
font-weight: 500;
}
.flash-success { background: rgba(61, 214, 140, 0.15); border: 1px solid var(--success); color: var(--success); }
.flash-error { background: rgba(240, 113, 120, 0.15); border: 1px solid var(--error); color: var(--error); }
.hero { text-align: center; padding: 4rem 1rem 3rem; position: relative; }
.hero-glow {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 400px;
height: 400px;
background: radial-gradient(circle, rgba(61, 158, 255, 0.12) 0%, transparent 70%);
pointer-events: none;
}
.hero-label {
font-family: var(--mono);
font-size: 0.8rem;
color: var(--accent);
text-transform: uppercase;
letter-spacing: 0.15em;
margin-bottom: 1rem;
}
.hero h1 {
font-size: clamp(2rem, 5vw, 3rem);
font-weight: 700;
line-height: 1.2;
margin-bottom: 1rem;
}
.gradient-text {
background: linear-gradient(135deg, var(--accent), var(--accent2));
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
}
.hero-desc { color: var(--muted); max-width: 560px; margin: 0 auto 2rem; font-size: 1.05rem; }
.hero-desc a { color: var(--accent); }
.hero-actions { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; }
.btn {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 0.75rem 1.5rem;
border-radius: 10px;
font-weight: 600;
text-decoration: none;
border: none;
cursor: pointer;
font-family: inherit;
font-size: 1rem;
transition: transform 0.15s, box-shadow 0.15s;
}
.btn:hover { transform: translateY(-1px); }
.btn-primary {
background: linear-gradient(135deg, var(--accent), var(--accent2));
color: #fff;
box-shadow: 0 4px 24px rgba(61, 158, 255, 0.35);
}
.btn-ghost {
background: transparent;
color: var(--text);
border: 1px solid var(--border);
}
.btn-block { width: 100%; }
.pill {
display: inline-block;
padding: 0.5rem 1rem;
border-radius: 999px;
font-size: 0.9rem;
font-family: var(--mono);
}
.pill-ok { background: rgba(61, 214, 140, 0.15); color: var(--success); border: 1px solid var(--success); }
.stats {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
gap: 1rem;
margin-bottom: 3rem;
}
.stat-card {
background: var(--surface);
border: 1px solid var(--border);
border-radius: var(--radius);
padding: 1.5rem;
text-align: center;
}
.stat-value {
display: block;
font-size: 1.75rem;
font-weight: 700;
font-family: var(--mono);
color: var(--accent);
}
.stat-label { font-size: 0.85rem; color: var(--muted); }
.features h2 { text-align: center; margin-bottom: 1.5rem; font-size: 1.5rem; }
.feature-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
gap: 1rem;
}
.feature-card {
background: var(--surface);
border: 1px solid var(--border);
border-radius: var(--radius);
padding: 1.25rem;
}
.feature-card h3 { font-size: 1rem; margin-bottom: 0.5rem; color: var(--accent); }
.feature-card p { font-size: 0.9rem; color: var(--muted); }
.cta-banner {
margin-top: 2rem;
padding: 2rem;
text-align: center;
background: linear-gradient(135deg, rgba(61, 158, 255, 0.08), rgba(124, 92, 255, 0.08));
border: 1px solid var(--border);
border-radius: var(--radius);
}
.cta-banner h2 { margin-bottom: 0.5rem; }
.cta-banner p { color: var(--muted); margin-bottom: 1.25rem; }
.auth-page {
display: flex;
justify-content: center;
padding: 3rem 1rem;
}
.auth-card {
width: 100%;
max-width: 420px;
background: var(--surface);
border: 1px solid var(--border);
border-radius: var(--radius);
padding: 2rem;
}
.auth-card h1 { font-size: 1.5rem; margin-bottom: 0.5rem; }
.auth-sub { color: var(--muted); font-size: 0.9rem; margin-bottom: 1.5rem; }
.auth-warn { color: var(--error); margin-bottom: 1rem; }
.auth-footer { margin-top: 1.5rem; text-align: center; font-size: 0.9rem; }
.auth-footer a { color: var(--muted); }
.form label { display: block; margin-bottom: 1rem; }
.form label span { display: block; font-size: 0.85rem; color: var(--muted); margin-bottom: 0.35rem; }
.form input {
width: 100%;
padding: 0.7rem 1rem;
background: var(--bg);
border: 1px solid var(--border);
border-radius: 8px;
color: var(--text);
font-family: inherit;
font-size: 1rem;
}
.form input:focus {
outline: none;
border-color: var(--accent);
box-shadow: 0 0 0 3px rgba(61, 158, 255, 0.2);
}
.footer {
position: relative;
z-index: 1;
text-align: center;
padding: 2rem;
color: var(--muted);
font-size: 0.85rem;
border-top: 1px solid var(--border);
}
.footer a { color: var(--accent); text-decoration: none; }
web/templates/index.html
+71
View File
@@ -0,0 +1,71 @@
{{define "content"}}
<section class="hero">
<div class="hero-glow"></div>
<p class="hero-label">Панель управления VPN</p>
<h1>Управляйте <span class="gradient-text">Xray</span> из одного места</h1>
<p class="hero-desc">
Централизованная панель на базе
<a href="https://github.com/XTLS/Xray-core" target="_blank" rel="noopener">Xray-core</a>:
пользователи, ноды, конфигурации и мониторинг.
</p>
<div class="hero-actions">
{{if .User}}
<span class="pill pill-ok">Вы вошли как {{.User.Email}}</span>
{{else if .CanRegister}}
<a href="/register" class="btn btn-primary">Создать администратора</a>
<a href="/login" class="btn btn-ghost">Войти</a>
{{else}}
<a href="/login" class="btn btn-primary">Войти в панель</a>
{{end}}
</div>
</section>
<section class="stats">
<article class="stat-card">
<span class="stat-value">{{if .HasAdmin}}1{{else}}0{{end}}</span>
<span class="stat-label">Администратор</span>
</article>
<article class="stat-card">
<span class="stat-value">{{.UserCount}}</span>
<span class="stat-label">Пользователей</span>
</article>
<article class="stat-card">
<span class="stat-value">{{.XrayVersion}}</span>
<span class="stat-label">Ядро</span>
</article>
<article class="stat-card">
<span class="stat-value">{{if .Installed}}✓{{else}}—{{end}}</span>
<span class="stat-label">Установка</span>
</article>
</section>
<section class="features">
<h2>Возможности</h2>
<div class="feature-grid">
<div class="feature-card">
<h3>VLESS / REALITY</h3>
<p>Поддержка современных протоколов Xray: VLESS, XTLS Vision, REALITY.</p>
</div>
<div class="feature-card">
<h3>PostgreSQL 17</h3>
<p>Надёжное хранение пользователей и настроек в PostgreSQL.</p>
</div>
<div class="feature-card">
<h3>Docker</h3>
<p>Развёртывание панели и БД через Docker Compose за минуты.</p>
</div>
<div class="feature-card">
<h3>Один админ</h3>
<p>При первом запуске регистрируется единственный администратор панели.</p>
</div>
</div>
</section>
{{if not .HasAdmin}}
<section class="cta-banner">
<h2>Первый запуск</h2>
<p>Администратор ещё не создан. Зарегистрируйте единственную учётную запись администратора.</p>
<a href="/register" class="btn btn-primary">Регистрация администратора</a>
</section>
{{end}}
{{end}}
web/templates/layout.html
+43
View File
@@ -0,0 +1,43 @@
{{define "layout"}}<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{{.Title}} — VPN Panel</title>
<link rel="stylesheet" href="/static/css/style.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;600&family=Outfit:wght@300;400;600;700&display=swap" rel="stylesheet">
</head>
<body>
<div class="bg-grid"></div>
<header class="header">
<a href="/" class="logo">
<span class="logo-icon">◈</span>
<span>VPN Panel</span>
<span class="logo-badge">Xray</span>
</a>
<nav class="nav">
<a href="/">Главная</a>
{{if .User}}
<span class="nav-user">{{.User.Email}}</span>
<a href="/logout">Выход</a>
{{else}}
<a href="/login">Вход</a>
{{if .CanRegister}}<a href="/register" class="btn-nav">Регистрация</a>{{end}}
{{end}}
</nav>
</header>
{{if .Flash}}
<div class="flash flash-{{.Flash.Level}}">{{.Flash.Message}}</div>
{{end}}
<main class="main">
{{template "content" .}}
</main>
<footer class="footer">
<p>Ядро: <a href="https://github.com/XTLS/Xray-core" target="_blank" rel="noopener">Xray-core</a> · {{.Domain}} · © {{.Year}}</p>
</footer>
</body>
</html>{{end}}
web/templates/login.html
+19
View File
@@ -0,0 +1,19 @@
{{define "content"}}
<section class="auth-page">
<div class="auth-card">
<h1>Вход в панель</h1>
<form method="post" action="/login" class="form">
<label>
<span>Email</span>
<input type="email" name="email" required autocomplete="email">
</label>
<label>
<span>Пароль</span>
<input type="password" name="password" required autocomplete="current-password">
</label>
<button type="submit" class="btn btn-primary btn-block">Войти</button>
</form>
<p class="auth-footer"><a href="/">← На главную</a></p>
</div>
</section>
{{end}}
web/templates/register.html
+30
View File
@@ -0,0 +1,30 @@
{{define "content"}}
<section class="auth-page">
<div class="auth-card">
<h1>Регистрация администратора</h1>
<p class="auth-sub">Допускается только <strong>один</strong> администратор. После создания регистрация будет закрыта.</p>
{{if .CanRegister}}
<form method="post" action="/register" class="form">
<label>
<span>Email</span>
<input type="email" name="email" required autocomplete="email" placeholder="admin@example.com">
</label>
<label>
<span>Пароль (мин. 8 символов)</span>
<input type="password" name="password" required minlength="8" autocomplete="new-password">
</label>
<label>
<span>Подтверждение пароля</span>
<input type="password" name="password_confirm" required minlength="8" autocomplete="new-password">
</label>
<button type="submit" class="btn btn-primary btn-block">Создать администратора</button>
</form>
{{else}}
<p class="auth-warn">Администратор уже существует.</p>
<a href="/login" class="btn btn-ghost btn-block">Войти</a>
{{end}}
<p class="auth-footer"><a href="/">← На главную</a></p>
</div>
</section>
{{end}}