首先要写登录界面的sql语句：
点击查看代码
create table login(
number varchar(20),
password varchar(20)
);
点击查看代码
package work.pojo;
public class login {
private String number;
private String password;
@Override
public String toString() {
return "login{" +
"number='" + number + '\'' +
", password='" + password + '\'' +
'}';
}
public String getNumber() {
return number;
}
public void setNumber(String number) {
this.number = number;
}
public String getPassword() {
return password;
}
public void setPassword(String password) {
this.password = password;
}
}
点击查看代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>登录界面</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #e8f0fe; /* 淡蓝色背景 */
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
margin: 0;
}
h1 {
color: #333;
}
form {
background-color: white; /* 白色背景 */
padding: 20px;
border-radius: 8px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}
p {
margin: 15px 0;
}
input[type="text"],
input[type="password"] {
width: 100%;
padding: 10px;
border: 1px solid #007bff; /* 蓝色边框 */
border-radius: 4px;
box-sizing: border-box; /* 适应边框和内边距 */
}
input[type="submit"] {
background-color: #007bff; /* 蓝色按钮 */
color: white;
border: none;
padding: 10px;
border-radius: 4px;
cursor: pointer;
width: 100%;
}
input[type="submit"]:hover {
background-color: #0056b3; /* 深蓝色悬停效果 */
}
</style>
</head>
<body>
<form action="/work-demo/login" method="post">
<h1>登录</h1>
<p>身份证号码:<input type="text" name="number" id="number" required></p>
<p>密码:<input type="password" name="password" id="password" required></p>
<input type="submit" value="登录">
<p>没有账户？<a href="register.html">注册</a></p>
</form>
</body>
</html>
点击查看代码
package work.web;
import org.apache.ibatis.io.Resources;
import org.apache.ibatis.session.SqlSession;
import org.apache.ibatis.session.SqlSessionFactory;
import org.apache.ibatis.session.SqlSessionFactoryBuilder;
import work.mapper.UserMapper;
import work.pojo.login;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.io.InputStream;
import java.io.Writer;
@WebServlet("/login")
public class loginscreen extends HttpServlet {
@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
super.doGet(req, resp);
}
@Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
req.setCharacterEncoding("UTF-8"); // 解决乱码问题
resp.setContentType("text/html;charset=utf-8");
String number = req.getParameter("number");
String password = req.getParameter("password");
String resource = "mybatis-config.xml";
InputStream inputStream = Resources.getResourceAsStream(resource);
SqlSessionFactory sqlSessionFactory = new SqlSessionFactoryBuilder().build(inputStream);
SqlSession sqlSession = sqlSessionFactory.openSession();
UserMapper usermapper = sqlSession.getMapper(UserMapper.class);
login l=usermapper.selectlogin(number,password);
Writer writer = resp.getWriter();
sqlSession.commit();
sqlSession.close();
if(l!=null){
writer.write("<html><body>");
writer.write("<h2>登录成功</h2>");
writer.write("<p>3秒后将跳转到主页面...</p>");
writer.write("<script type='text/javascript'>");
writer.write("setTimeout(function() { window.location.href = './screen.html'; }, 3000);");
writer.write("</script>");
writer.write("</body></html>");
}else {
writer.write("<html><body>");
writer.write("<h2>登录失败，请重新输入</h2>");
writer.write("<p>3秒后将跳转到登录界面...</p>");
writer.write("<script type='text/javascript'>");
writer.write("setTimeout(function() { window.location.href = './login.html'; }, 3000);");
writer.write("</script>");
writer.write("</body></html>");
}
}
}
点击查看代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>主界面</title>
<style>
body {
background-color: rgba(220, 220, 220, 0.32);
font-family: Arial, sans-serif;
}
a {
display: inline-block;
width: 300px;
height: 80px;
background-color: dodgerblue;
color: white;
text-decoration: none;
text-align: center;
line-height: 80px;
font-size: 20px;
margin: 5px;
border-radius: 8px;
}
a:hover {
background-color: lightskyblue;
}
.select {
background-color: lightskyblue;
}
.search-container {
position: absolute;
top: 10px;
right: 10px;
}
.search-container input[type="text"] {
padding: 8px;
font-size: 16px;
border: 1px solid #ccc;
border-radius: 4px;
}
.search-container button {
padding: 8px;
font-size: 16px;
background-color: dodgerblue;
color: white;
border: none;
border-radius: 4px;
cursor: pointer;
}
.search-container button:hover {
background-color: lightskyblue;
}
</style>
</head>
<body>
<div class="div1">
<img src="https://www.jkheb2030.org.cn/Content/peixun/img/logo.png" >
</div>
<div class="search-container">
<input type="text" placeholder="搜索..." name="search" id="search">
<button type="submit">搜索</button>
</div>
<a href="informationadd.html">老年人信息导入</a>
<a href="assessment1.html">老年人能力定期评估</a>
<a href="select1.html">能力评估数据多条件查询</a>
<a href="ability.html">能力数据统计</a>
<a href="enter.html">能力数据导出</a>
</body>
</html>
浙公网安备 33010602011771号