c8f03dd932
功能特性: - Markdown 编辑与实时预览 - 代码语法高亮 - 目录树形结构管理 - 图片粘贴上传 - Markdown 文件导入导出 - 笔记密码保护 - 前后端分离架构 技术栈: - Go + Gin + GORM + SQLite - 原生 HTML/CSS/JavaScript - Highlight.js
141 строка
4.3 KiB
HTML
141 строка
4.3 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="zh-CN">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>后台管理登录 - 云笔记</title>
|
|
<style>
|
|
* { margin: 0; padding: 0; box-sizing: border-box; }
|
|
body {
|
|
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
|
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
|
min-height: 100vh;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
}
|
|
.login-box {
|
|
background: #fff;
|
|
padding: 40px;
|
|
border-radius: 12px;
|
|
box-shadow: 0 20px 60px rgba(0,0,0,0.3);
|
|
width: 100%;
|
|
max-width: 400px;
|
|
}
|
|
.login-box h1 {
|
|
text-align: center;
|
|
color: #333;
|
|
margin-bottom: 30px;
|
|
font-size: 24px;
|
|
}
|
|
.form-group {
|
|
margin-bottom: 20px;
|
|
}
|
|
.form-group label {
|
|
display: block;
|
|
margin-bottom: 8px;
|
|
color: #666;
|
|
font-size: 14px;
|
|
}
|
|
.form-group input {
|
|
width: 100%;
|
|
padding: 12px 16px;
|
|
border: 2px solid #e1e1e1;
|
|
border-radius: 8px;
|
|
font-size: 16px;
|
|
transition: border-color 0.3s;
|
|
}
|
|
.form-group input:focus {
|
|
outline: none;
|
|
border-color: #667eea;
|
|
}
|
|
.btn-login {
|
|
width: 100%;
|
|
padding: 14px;
|
|
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
|
color: #fff;
|
|
border: none;
|
|
border-radius: 8px;
|
|
font-size: 16px;
|
|
cursor: pointer;
|
|
transition: transform 0.2s;
|
|
}
|
|
.btn-login:hover {
|
|
transform: translateY(-2px);
|
|
}
|
|
.btn-login:disabled {
|
|
opacity: 0.7;
|
|
cursor: not-allowed;
|
|
}
|
|
.error-msg {
|
|
color: #dc3545;
|
|
font-size: 14px;
|
|
margin-top: 10px;
|
|
text-align: center;
|
|
display: none;
|
|
}
|
|
.back-link {
|
|
display: block;
|
|
text-align: center;
|
|
margin-top: 20px;
|
|
color: #667eea;
|
|
text-decoration: none;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="login-box">
|
|
<h1>后台管理登录</h1>
|
|
<form id="loginForm">
|
|
<div class="form-group">
|
|
<label>管理密码</label>
|
|
<input type="password" id="password" placeholder="请输入管理密码" required>
|
|
</div>
|
|
<button type="submit" class="btn-login" id="loginBtn">登 录</button>
|
|
<p class="error-msg" id="errorMsg"></p>
|
|
</form>
|
|
<a href="/" class="back-link">返回前台</a>
|
|
</div>
|
|
|
|
<script>
|
|
const form = document.getElementById('loginForm');
|
|
const password = document.getElementById('password');
|
|
const loginBtn = document.getElementById('loginBtn');
|
|
const errorMsg = document.getElementById('errorMsg');
|
|
|
|
form.addEventListener('submit', async (e) => {
|
|
e.preventDefault();
|
|
errorMsg.style.display = 'none';
|
|
loginBtn.disabled = true;
|
|
loginBtn.textContent = '登录中...';
|
|
|
|
try {
|
|
const formData = new FormData();
|
|
formData.append('password', password.value);
|
|
|
|
const res = await fetch('/admin/login', {
|
|
method: 'POST',
|
|
body: formData
|
|
});
|
|
|
|
const data = await res.json();
|
|
|
|
if (data.code === 0) {
|
|
window.location.href = '/admin/';
|
|
} else {
|
|
errorMsg.textContent = data.message;
|
|
errorMsg.style.display = 'block';
|
|
loginBtn.disabled = false;
|
|
loginBtn.textContent = '登 录';
|
|
}
|
|
} catch (err) {
|
|
errorMsg.textContent = '登录失败,请重试';
|
|
errorMsg.style.display = 'block';
|
|
loginBtn.disabled = false;
|
|
loginBtn.textContent = '登 录';
|
|
}
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|