rustdesk-api-server/api/templates/reg.html

143 lines
5.4 KiB
Python
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title>注册_RustDeskWeb</title>
<link rel="stylesheet" href="{% static 'layui/css/layui.css' %}">
<link rel="stylesheet" href="{% static 'layui/css/style.css' %}">
<link rel="icon" href="../frame/static/image/code.png">
</head>
<body>
<div class="login-main">
<header class="layui-elip" style="width: 82%">注册页</header>
<!-- 表单选项 -->
<form class="layui-form">
<div class="layui-input-inline">
<!-- 用户名 -->
<div class="layui-inline" style="width: 85%">
<input type="text" id="user" name="account" required lay-verify="required" placeholder="请输入用户名" autocomplete="off" class="layui-input">
</div>
<!-- 对号 -->
<div class="layui-inline">
<i class="layui-icon" id="ri" style="color: green;font-weight: bolder;" hidden></i>
</div>
<!-- 错号 -->
<div class="layui-inline">
<i class="layui-icon" id="wr" style="color: red; font-weight: bolder;" hidden></i>
</div>
</div>
<!-- 密码 -->
<div class="layui-input-inline">
<div class="layui-inline" style="width: 85%">
<input type="password" id="pwd" name="password" required lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input">
</div>
<!-- 对号 -->
<div class="layui-inline">
<i class="layui-icon" id="pri" style="color: green;font-weight: bolder;" hidden></i>
</div>
<!-- 错号 -->
<div class="layui-inline">
<i class="layui-icon" id="pwr" style="color: red; font-weight: bolder;" hidden></i>
</div>
</div>
<!-- 确认密码 -->
<div class="layui-input-inline">
<div class="layui-inline" style="width: 85%">
<input type="password" id="rpwd" name="repassword" required lay-verify="required" placeholder="请确认密码" autocomplete="off" class="layui-input">
</div>
<!-- 对号 -->
<div class="layui-inline">
<i class="layui-icon" id="rpri" style="color: green;font-weight: bolder;" hidden></i>
</div>
<!-- 错号 -->
<div class="layui-inline">
<i class="layui-icon" id="rpwr" style="color: red; font-weight: bolder;" hidden></i>
</div>
</div>
<div class="layui-input-inline login-btn" style="width: 85%">
<button type="submit" lay-submit lay-filter="sub" class="layui-btn">注册</button>
</div>
<hr style="width: 85%" />
<p style="width: 85%"><a href="/api/user_action?action=login" class="fl">已有账号立即登录</a></p>
</form>
</div>
<script src={% static "layui/layui.js" %}></script>
<script type="text/javascript">
layui.use(['form','jquery','layer'], function () {
var form = layui.form;
var $ = layui.jquery;
var layer = layui.layer;
//添加表单失焦事件
//验证表单
$('#user').blur(function() {
var user = $(this).val();
});
// you code ...
// 为密码添加正则验证
$('#pwd').blur(function() {
var reg = /^[\w\S]{8,20}$/;
if(!($('#pwd').val().match(reg))){
//layer.msg('请输入合法密码');
$('#pwr').removeAttr('hidden');
$('#pri').attr('hidden','hidden');
layer.msg('请输入8~20位密码。可以包含字母、数字和特殊字符。');
}else {
$('#pri').removeAttr('hidden');
$('#pwr').attr('hidden','hidden');
}
});
//验证两次密码是否一致
$('#rpwd').blur(function() {
if($('#pwd').val() != $('#rpwd').val()){
$('#rpwr').removeAttr('hidden');
$('#rpri').attr('hidden','hidden');
layer.msg('两次输入密码不一致!');
}else {
$('#rpri').removeAttr('hidden');
$('#rpwr').attr('hidden','hidden');
};
});
//
//添加表单监听事件,提交注册信息
form.on('submit(sub)', function() {
$.ajax({
url:'/api/user_action?action=register',
type:'post',
dataType:'json',
data:{
user:$('#user').val(),
pwd:$('#pwd').val(),
},
success:function(data){
if (data.code == 1) {
layer.msg('注册成功,请前往登录页登录。');
///location.href = "login.html";
}else {
layer.msg(data.msg);
}
}
})
//防止页面跳转
return false;
});
});
</script>
</body>
</html>