10185101272
/
Personal-Collections-Website
1
0
Fork 0
Code Issues 0 Pull Requests 0 Releases 0 Wiki Activity
Browse Source

update login, register and forget

master
LOGIC0805 4 years ago
parent
82d7842426
commit
e792c926ef
6 changed files with 403 additions and 0 deletions
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. +62
    -0
      front-end/forget.html
  2. +60
    -0
      front-end/login.html
  3. +62
    -0
      front-end/register.html
  4. +217
    -0
      front-end/static/css/home.css
  5. +2
    -0
      front-end/static/js/jquery-3.5.1.min.js
  6. BIN
      front-end/static/video/video.mp4

+ 62
- 0
front-end/forget.html View File

@ -0,0 +1,62 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="static/css/home.css">
<title>忘记密码</title>
<script src="static/js/jquery-3.5.1.min.js"></script>
<script src="http://api.html5media.info/1.1.8/html5media.min.js"></script>
<script type="text/javascript">
function forget(obj){
var phonenum = $(obj).parent().prev().prev().prev().prev().children("#phonenum").val();
var username = $(obj).parent().prev().prev().prev().children("#username").val();
var password = $(obj).parent().prev().prev().children("#password").val();
var password1 = $(obj).parent().prev().children("#password1").val();
var url = "http://127.0.0.1:5000/forget";
$.ajax({
type: "POST",
url: url,
data: {
phonenum: phonenum,
username: username,
password: password,
password1: password1
},
success: function(data){
alert(data.msg);
if(data.code == 0){
var newurl = "http://127.0.0.1:5000/login";
window.location = newurl;
}
},
error: function(XMLHttpRequest, textStatus, errorThrown) {
alert(XMLHttpRequest.status);
alert(XMLHttpRequest.readyState);
alert(textStatus);
window.location = url;
}
});
}
</script>
</head>
<body>
<div class="background">
<video autoplay loop muted>
<source src="static/video/video.mp4" type="video/mp4" />
Your Browser is no longer supported.
</video>
</div>
<div class="login">
<div class="logo_1"></div>
<div class="form-item">
<p style="padding-bottom:15px"><input id="phonenum" oninput="value=value.replace(/[^\d]/g,'')" autocomplete="off" placeholder="电话号码" name="phonenum"></p>
<p style="padding-bottom:15px"><input id="username" type="text" autocomplete="off" placeholder="用户名" name="username"></p>
<p style="padding-bottom:15px"><input id="password" type="password" autocomplete="off" placeholder="登录密码" name="password"></p>
<p style="padding-bottom:15px"><input id="password1" type="password" autocomplete="off" placeholder="确认登录密码" name="password1"></p>
<p><input type="submit" id="register" value="修改密码" onclick="forget(this)" style="padding-left:0;margin-left:0;width:350px;background-color:white;color:#1f6f4a;cursor:pointer"></p>
</div>
</div>
</body>
</html>

+ 60
- 0
front-end/login.html View File

@ -0,0 +1,60 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="static/css/home.css">
<title>登录</title>
<script src="static/js/jquery-3.5.1.min.js"></script>
<script src="http://api.html5media.info/1.1.8/html5media.min.js"></script>
<script type="text/javascript">
function login(obj){
var phonenum = $(obj).parent().prev().prev().children("#phonenum").val();
var password = $(obj).parent().prev().children("#password").val();
var url = "http://127.0.0.1:5000/login";
$.ajax({
type: "POST",
url: url,
data: {
phonenum: phonenum,
password: password
},
success: function(data){
alert(data.msg);
if(data.code == 0){
var newurl = "http://127.0.0.1:5000/self%3Fphonenum%3D" + phonenum;
window.location = newurl;
}
},
error: function(XMLHttpRequest, textStatus, errorThrown) {
alert(XMLHttpRequest.status);
alert(XMLHttpRequest.readyState);
alert(textStatus);
window.location = url;
}
});
}
</script>
</head>
<body>
<div class="background">
<video autoplay loop muted>
<source src="static/video/video.mp4" type="video/mp4" />
Your Browser is no longer supported.
</video>
</div>
<div class="login">
<div class="logo_1"></div>
<div class="form-item">
<p style="padding-bottom:30px"><input id="phonenum" oninput="value=value.replace(/[^\d]/g,'')" autocomplete="off" placeholder="电话号码" name="phonenum"></p>
<p style="padding-bottom:30px"><input id="password" type="password" autocomplete="off" placeholder="登录密码" name="password"></p>
<p><input type="submit" value="登录" id="login" onclick="login(this)" style="padding-left:0;margin-left:0;width:350px;background-color:white;color:#1f6f4a;cursor:pointer"></p>
</div>
<div class="reg-bar">
<a class="reg" href="http://127.0.0.1:5000/register">立即注册</a>
<a class="forget" href="http://127.0.0.1:5000/forget">忘记密码</a>
</div>
</div>
</body>
</html>

+ 62
- 0
front-end/register.html View File

@ -0,0 +1,62 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="static/css/home.css">
<title>注册</title>
<script src="static/js/jquery-3.5.1.min.js"></script>
<script src="http://api.html5media.info/1.1.8/html5media.min.js"></script>
<script type="text/javascript">
function register(obj){
var phonenum = $(obj).parent().prev().prev().prev().prev().children("#phonenum").val();
var username = $(obj).parent().prev().prev().prev().children("#username").val();
var password = $(obj).parent().prev().prev().children("#password").val();
var password1 = $(obj).parent().prev().children("#password1").val();
var url = "http://127.0.0.1:5000/register";
$.ajax({
type: "POST",
url: url,
data: {
phonenum: phonenum,
username: username,
password: password,
password1: password1
},
success: function(data){
alert(data.msg);
if(data.code == 0){
var newurl = "http://127.0.0.1:5000/login";
window.location = newurl;
}
},
error: function(XMLHttpRequest, textStatus, errorThrown) {
alert(XMLHttpRequest.status);
alert(XMLHttpRequest.readyState);
alert(textStatus);
window.location = url;
}
});
}
</script>
</head>
<body>
<div class="background">
<video autoplay loop muted>
<source src="static/video/video.mp4" type="video/mp4" />
Your Browser is no longer supported.
</video>
</div>
<div class="login">
<div class="logo_1"></div>
<div class="form-item">
<p style="padding-bottom:15px"><input id="phonenum" oninput="value=value.replace(/[^\d]/g,'')" autocomplete="off" placeholder="电话号码" name="phonenum"></p>
<p style="padding-bottom:15px"><input id="username" type="text" autocomplete="off" placeholder="用户名" name="username"></p>
<p style="padding-bottom:15px"><input id="password" type="password" autocomplete="off" placeholder="登录密码" name="password"></p>
<p style="padding-bottom:15px"><input id="password1" type="password" autocomplete="off" placeholder="确认登录密码" name="password1"></p>
<p><input type="submit" id="register" value="注册" onclick="register(this)" style="padding-left:0;margin-left:0;width:350px;background-color:white;color:#1f6f4a;cursor:pointer"></p>
</div>
</div>
</body>
</html>

+ 217
- 0
front-end/static/css/home.css View File

@ -0,0 +1,217 @@
*{
margin:0;
padding: 0;
font-family: arial;
box-sizing: border-box;
background-color: transparent;
}
.background{
position:relative ;
}
video{
position: fixed;
right: 0px;
bottom: 0px;
min-width: 100%;
min-height: 100%;
height: auto;
width: auto;
/*加滤镜*/
filter: blur(15px);
-webkit-filter: grayscale(100%);
filter:grayscale(10%);
z-index:-11;
}
source{
min-width: 100%;
min-height: 100%;
height: auto;
width: auto;
}
.wrapper{
position: absolute;
background-color: transparent;
width: 100%;
}
.header {
position: fixed;
display: flex;
flex-direction: row;
justify-content: space-between;
/*align-items: center;*/
width: 100%;
height: 106px;
font-size: 18px;
font-family: PingFang SC, Helvetica, Arial, sans-serif;
font-weight: 500;
}
.header .RED {
height: 25px;
margin-left: 91px;
display: flex;
align-items: center;
}
.header .RED.logo {
cursor: pointer;
margin-top: 1px;
width: 72px;
height: 25px;
position: relative;
}
.header .RED .logo .darklogo {
position: absolute;
height: 100%;
margin-top: 5px;
}
.nav {
list-style-type: none;
display: flex;
flex-direction: row;
justify-content: flex-end;
align-items: center;
/*margin: 0 76px 0 0;*/
padding: 0;
min-width: 1014px;
}
.nav .list-item{
margin: 35px;
}
.nav .list-item a{
color: white;
padding-bottom: 8px;
}
.nav .list-item a:hover{
font-weight: bold;
cursor:pointer;
}
.nav .list-item a::after{
content: "";
width: 0;
height: 3px;
background-color: #F5F5F5;
color:white;
position: absolute;
bottom: 0;
left: 50%;
transition: all .25s;
}
.nav .list-item a:hover::after,.nav .list-item a:active:after{
left: 0%;
width: 100%;
}
.nav a,a:link{
text-decoration: none;
margin-bottom: 5px;
position: relative;
}
#img1{
vertical-align: middle;
width: 10px;
height: 20px;
background: transparent;
}
.login {
position: absolute;
left: 50%;
top: 50%;
width: 430px;
height: 380px;
margin: -200px 0 0 -215px;
border: 1px solid #fff;
border-radius: 20px;
overflow: hidden;
background-color: transparent;
}
.logo_1{
margin: 50px auto 10px;
/*background: url(img/login.png) 0 0 no-repeat;*/
}
.form-item {
position: relative;
width: 360px;
margin: 0 auto;
padding-bottom: 30px;
}
.form-item input {
width: 288px;
height: 48px;
padding-left: 60px;
margin-left: 35px;
border: 1px solid #fff;
border-radius: 25px;
font-size: 18px;
color: #fff;
background-color: transparent;
outline: none;
}
.form-item button {
width: 360px;
height: 50px;
border: 0;
border-radius: 25px; font-size: 18px;
color: #1f6f4a;
outline: none;
cursor: pointer;
background-color: #fff;
}
.tip {
display: none;
position: absolute;
left: 20px;
top: 52px;
font-size: 14px;
color: #f50;
}
.reg-bar {
width: 360px;
margin: 20px auto 0;
font-size: 14px;
overflow: hidden;
}
.reg-bar a {
color: #fff;
text-decoration: none;
}
.reg-bar a:hover { text-decoration: underline; }
.reg-bar .reg { float: left; }
.reg-bar .forget { float: right; }
video::-webkit-media-controls {
display:none !important;
}
/*.dowebok ::-webkit-input-placeholder { font-size: 18px; line-height: 1.4; color: #fff;}*/
/*.dowebok :-moz-placeholder { font-size: 18px; line-height: 1.4; color: #fff;}*/
/*.dowebok ::-moz-placeholder { font-size: 18px; line-height: 1.4; color: #fff;}*/
/*.dowebok :-ms-input-placeholder { font-size: 18px; line-height: 1.4; color: #fff;}*/
/*@media screen and (max-width: 500px) {*/
/* * { box-sizing: border-box; }*/
/* .dowebok { position: static; width: auto; height: auto; margin: 0 30px; border: 0; border-radius: 0; }*/
/* .logo { margin: 50px auto; }*/
/* .form-item { width: auto; }*/
/* .form-item input, .form-item button, .reg-bar { width: 100%; }*/
/*}*/

+ 2
- 0
front-end/static/js/jquery-3.5.1.min.js
File diff suppressed because it is too large
View File


BIN
front-end/static/video/video.mp4 View File


Write Preview
Loading…
Cancel
Save