|
|
@ -32,25 +32,58 @@
|
|
|
|
<body>
|
|
|
|
<body>
|
|
|
|
<div class="background-container">
|
|
|
|
<div class="background-container">
|
|
|
|
<div style="width: 710px; height: 446px; left: 25%; top: 177px; position: absolute; background: rgba(217, 217, 217, 0.10); box-shadow: -38.53333282470703px 38.53333282470703px 38.53333282470703px rgba(255, 255, 255, 0.10) inset; border: 1px rgba(249, 249, 249, 0.51) solid; backdrop-filter: blur(77.07px)"></div>
|
|
|
|
<div style="width: 710px; height: 446px; left: 25%; top: 177px; position: absolute; background: rgba(217, 217, 217, 0.10); box-shadow: -38.53333282470703px 38.53333282470703px 38.53333282470703px rgba(255, 255, 255, 0.10) inset; border: 1px rgba(249, 249, 249, 0.51) solid; backdrop-filter: blur(77.07px)"></div>
|
|
|
|
<div style="width: 171px; height: 36px; left: 32%; top: 435px; position: absolute">
|
|
|
|
|
|
|
|
<label for="confirm_password">确认密码:</label>
|
|
|
|
|
|
|
|
<input type="password" id="confirm_password" name="confirm_password" required>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div style="width: 65px; height: 38px; left: 35%; top: 201px; position: absolute; color: #001AFF; font-size: 32px; font-family: Inter; font-weight: 700; word-wrap: break-word" >注册</div>
|
|
|
|
<div style="width: 65px; height: 38px; left: 35%; top: 201px; position: absolute; color: #001AFF; font-size: 32px; font-family: Inter; font-weight: 700; word-wrap: break-word" >注册</div>
|
|
|
|
<div style="width: 282px; height: 56px; left: 30%; top: 503px; position: absolute" class="login-button" onclick="redirectToLogin()">
|
|
|
|
|
|
|
|
<div style="width: 282px; height: 56px; left: 0px; top: 0px; position: absolute; background: linear-gradient(180deg, #152DA9 0%, #E7642A 100%); border-radius: 71px"></div>
|
|
|
|
|
|
|
|
<div style="left: 43%; top: 16px; position: absolute; color: #FAFAF9; font-size: 20px; font-family: Inter; font-weight: 500; word-wrap: break-word">注册</div>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div style="width: 151px; height: 33px; left: 35%; top: 575px; position: absolute; color: black; font-size: 20px; font-family: Inter; font-weight: 500; word-wrap: break-word" class="sign-up-link" onclick="redirectToLogin()">已有帐号?登录</div>
|
|
|
|
<div style="width: 151px; height: 33px; left: 35%; top: 575px; position: absolute; color: black; font-size: 20px; font-family: Inter; font-weight: 500; word-wrap: break-word" class="sign-up-link" onclick="redirectToLogin()">已有帐号?登录</div>
|
|
|
|
|
|
|
|
<form id="sign-form">
|
|
|
|
<div style="width: 173px; height: 35px; left: 32%; top: 364px; position: absolute">
|
|
|
|
<div style="width: 173px; height: 35px; left: 32%; top: 364px; position: absolute">
|
|
|
|
<label for="password">密码:</label>
|
|
|
|
<label for="password">密码:</label>
|
|
|
|
<input type="password" id="password" name="password">
|
|
|
|
<input type="password" id="password" name="password" required><br><br>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div style="width: 173px; height: 35px; left: 32%; top: 294px; position: absolute">
|
|
|
|
<div style="width: 173px; height: 35px; left: 32%; top: 294px; position: absolute">
|
|
|
|
<label for="username">用户名:</label>
|
|
|
|
<label for="username">用户名:</label>
|
|
|
|
<input type="text" id="username" name="username">
|
|
|
|
<input type="text" id="username" name="username" required><br><br>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div style="width: 171px; height: 36px; left: 32%; top: 435px; position: absolute">
|
|
|
|
|
|
|
|
<label for="confirm_password">确认密码:</label>
|
|
|
|
|
|
|
|
<input type="password" id="confirm_password" name="confirm_password" required><br><br>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<button type="submit" style="width: 282px; height: 56px; left: 30%; top: 503px; border-radius: 71px; position: absolute" class="login-button" onclick="redirectToLogin()">
|
|
|
|
|
|
|
|
<div style="width: 282px; height: 56px; left: 0px; top: 0px; position: absolute; background: linear-gradient(180deg, #152DA9 0%, #E7642A 100%); border-radius: 71px"></div>
|
|
|
|
|
|
|
|
<div style="left: 43%; top: 16px; position: absolute; color: #FAFAF9; font-size: 20px; font-family: Inter; font-weight: 500; word-wrap: break-word">注册</div>
|
|
|
|
|
|
|
|
</button>
|
|
|
|
|
|
|
|
</form>
|
|
|
|
<img style="width: 499px; height: 594px; left: 50%; top: 119px; position: absolute; border-radius: 40px" src="E:\softwareengineer\work2\frontend\assets\d2.png" />
|
|
|
|
<img style="width: 499px; height: 594px; left: 50%; top: 119px; position: absolute; border-radius: 40px" src="E:\softwareengineer\work2\frontend\assets\d2.png" />
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
|
|
|
document.getElementById('sign-form').addEventListener('submit', function(event) {
|
|
|
|
|
|
|
|
event.preventDefault(); // 阻止表单默认提交行为
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const username = document.getElementById('username').value;
|
|
|
|
|
|
|
|
const password = document.getElementById('password').value;
|
|
|
|
|
|
|
|
const password2 =document.getElementById('confirm_password').value;
|
|
|
|
|
|
|
|
const signdata = {
|
|
|
|
|
|
|
|
username:username,
|
|
|
|
|
|
|
|
password:password,
|
|
|
|
|
|
|
|
password2:confirm_password
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
fetch('/sign', {
|
|
|
|
|
|
|
|
method: 'POST', // 或者 'PUT', 'PATCH' 等
|
|
|
|
|
|
|
|
headers: {
|
|
|
|
|
|
|
|
'Content-Type': 'application/json' // 发送JSON数据
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
body: JSON.stringify(signdata) // 将JavaScript对象转换为JSON字符串
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
.then(response => response.json())
|
|
|
|
|
|
|
|
.then(data => {
|
|
|
|
|
|
|
|
console.log('Success:', data);
|
|
|
|
|
|
|
|
alert('Sign Up successfully!');
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
.catch((error) => {
|
|
|
|
|
|
|
|
console.error('Error:', error);
|
|
|
|
|
|
|
|
alert('Error submitting data');
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
</script>
|
|
|
|
</body>
|
|
|
|
</body>
|
|
|
|
</html>
|
|
|
|
</html>
|