Tianyan/index.html at main · Skarie/Tianyan · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <!-- 添加视口元标签以支持响应式布局 -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>天衍云阁</title>
    <link rel="stylesheet" href="./CSS/login.css">
    <link rel="icon" href="tupianwenjian/logo.ico">
    <style>
       body{
           background-image: url('https://api.fuchenboke.cn/api/bing.php');
           /* background-size: cover; */
           /* background-position: center; */
       }
    </style>
</head>


<body>
    <div id="loginContainer" class="container">
        <h1>天衍云阁</h1>
        <form id="loginForm">
            <label for="username">用户名：</label>
            <input type="text" id="username" required placeholder="请输入用户名" />
            <label for="password">密码：</label>
            <input type="password" id="password" required placeholder="请输入密码">
            <button type="submit">登录</button>
            <p>还没有账号？<a type="button" onclick="showRegistration()">立即注册</a></p>
        </form>
    </div>
    <div id="registrationContainer" class="container hidden">
        <h2>注册</h2>
        <form id="registrationForm">
            <label for="newUsername">用户名:</label>
            <input type="text" id="newUsername" required>
            <label for="newPassword">密码:</label>
            <input type="password" id="newPassword" required>
            <button type="submit">完成注册</button>
            <!-- 添加返回按钮 -->
            <button type="button" onclick="showLogin()">返回登录</button>
        </form>
    </div>
</body>
<script src="https://api.fuchenboke.cn/api/xuehua.js"></script>
<script>
//登录表单提交
document.getElementById('loginForm').addEventListener('submit', function(event) {
    event.preventDefault();
    const username = document.getElementById('username').value;
    const password = document.getElementById('password').value;
    fetch('/api/login.php', {
        method: 'POST',
        headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
        body: `username=${encodeURIComponent(username)}&password=${encodeURIComponent(password)}`
    })
   .then(response => response.json())
   .then(data => {
    if (data.success) {
        if (data.is_admin) {
            window.location.href = './Admin/admin.html'; // 管理员跳后台
        } else {
            window.location.href = './shouye/shouye.html'; // 普通用户跳首页
        }
    } else {
        alert('登录失败：' + data.message);
    }
})
});
//注册表提交
document.getElementById('registrationForm').addEventListener('submit', function(event) {
    event.preventDefault();
    const newUsername = document.getElementById('newUsername').value;
    const newPassword = document.getElementById('newPassword').value;
    fetch('/api/register.php', {
        method: 'POST',
        headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
        body: `username=${encodeURIComponent(newUsername)}&password=${encodeURIComponent(newPassword)}`
    })
   .then(response => response.json())
   .then(data => {
        if (data.success) {
            alert('注册成功！');
            showLogin();
        } else {
            alert('注册失败：' + data.message);
        }
    });
});
// 切换显示注册界面
function showRegistration() {
    document.getElementById('loginContainer').classList.add('hidden');
    document.getElementById('registrationContainer').classList.remove('hidden');
}
// 切换显示登录界面
function showLogin() {
    document.getElementById('loginContainer').classList.remove('hidden');
    document.getElementById('registrationContainer').classList.add('hidden');
}
</script>
<script src="mian.js"></script>
</html>