liyansheng
/
computer-web
Archived
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

add<样式优化>

v2.5
liyansheng 2025-01-14 16:01:14 +08:00
parent 571d1ebdeb
commit 95fe28b1b3
13 changed files with 716 additions and 435 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

53
src/main/webapp/addComputer.jsp
View File

@ -1,24 +1,53 @@
<%@ page contentType="text/html; charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://www.liyansheng.top/cdn/watermark.js"></script>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>电脑产品发布</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
</head>
<body>
<h1>电脑产品发布</h1>
<form action="/computer?action=add" method="post">
<label for="name">名称: </label><br>
<input type="text" id="name" name="name"><br><br>
<label for="price">价格: </label><br>
<input type="text" id="price" name="price"><br><br>
<label for="stock">库存: </label><br>
<input type="text" id="stock" name="stock"><br><br>
<input type="submit" value="确定">
</form>
<br>
<a href="/computer?action=list">返回电脑列表</a>
<div class="container mt-5">
<!-- 页头 -->
<div class="card shadow mb-4">
<div class="card-header bg-primary text-white text-center">
<h2>电脑产品发布</h2>
</div>
</div>
<!-- 发布表单 -->
<div class="card shadow">
<div class="card-body">
<form action="/computer?action=add" method="post">
<div class="mb-3">
<label for="name" class="form-label">名称</label>
<input type="text" class="form-control" id="name" name="name" required>
</div>
<div class="mb-3">
<label for="price" class="form-label">价格</label>
<input type="text" class="form-control" id="price" name="price" required>
</div>
<div class="mb-3">
<label for="stock" class="form-label">库存</label>
<input type="text" class="form-control" id="stock" name="stock" required>
</div>
<div class="text-center">
<button type="submit" class="btn btn-success btn-lg">确定</button>
</div>
</form>
</div>
</div>
<!-- 返回按钮 -->
<div class="text-center mt-4">
<a href="/computer?action=list" class="btn btn-primary">返回电脑列表</a>
</div>
</div>
</body>
</html>

139
src/main/webapp/cart.jsp
View File

@ -2,75 +2,90 @@
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://www.liyansheng.top/cdn/watermark.js"></script>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>购物车</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
<script src="https://www.liyansheng.top/cdn/watermark.js"></script>
</head>
<body>
<div>
<h2>电脑商城</h2>
<p>你好！${sessionScope.user.username}</p>
<c:if test="${sessionScope.user!= null}">
<a href="/computer?action=list">电脑选购</a>
<c:if test="${sessionScope.user.role == 'user'}">
<a href="/cart?action=list">我的购物车</a>
<a href="/orders?action=my">我的订单</a>
</c:if>
<c:if test="${sessionScope.user.role == 'admin'}">
<a href="/user?action=list">用户列表</a>
<a href="/orders?action=all">所有订单</a>
</c:if>
<a href="/logout">退出</a>
<div class="container mt-5">
<!-- 顶部导航 -->
<div class="card shadow">
<div class="card-header bg-primary text-white text-center">
<h2>电脑商城</h2>
</div>
<div class="card-body">
<p class="text-center">你好！<strong>${sessionScope.user.username}</strong></p>
<c:if test="${sessionScope.user != null}">
<div class="d-grid gap-2 d-md-flex justify-content-md-center">
<a href="/computer?action=list" class="btn btn-outline-primary">电脑选购</a>
<c:if test="${sessionScope.user.role == 'user'}">
<a href="/cart?action=list" class="btn btn-outline-primary">我的购物车</a>
<a href="/orders?action=my" class="btn btn-outline-primary">我的订单</a>
</c:if>
<c:if test="${sessionScope.user.role == 'admin'}">
<a href="/user?action=list" class="btn btn-outline-primary">用户列表</a>
<a href="/orders?action=all" class="btn btn-outline-primary">所有订单</a>
</c:if>
<a href="/logout" class="btn btn-danger">退出</a>
</div>
</c:if>
<c:if test="${sessionScope.user == null}">
<p class="text-center">请登录后查看更多内容~</p>
<div class="d-grid gap-2 d-md-flex justify-content-md-center">
<a href="/register" class="btn btn-outline-primary">注册</a>
<a href="/login" class="btn btn-outline-primary">登录</a>
</div>
</c:if>
</div>
</div>
<!-- 页面标题 -->
<h1 class="text-center text-primary mb-4">购物车</h1>
<!-- 商品列表 -->
<c:if test="${not empty computers}">
<table class="table table-bordered table-striped">
<thead class="table-primary">
<tr>
<th>ID</th>
<th>名称</th>
<th>价格</th>
<th>操作</th>
</tr>
</thead>
<tbody>
<c:forEach var="computer" items="${computers}">
<tr>
<td>${computer.id}</td>
<td>${computer.name}</td>
<td>${computer.price}</td>
<td>
<a href="/cart?action=remove&id=${computer.id}" class="btn btn-danger btn-sm">移出</a>
</td>
</tr>
</c:forEach>
</tbody>
</table>
<hr>
<!-- 一键下单按钮 -->
<div class="text-center">
<a href="/orders?action=add" class="btn btn-success btn-lg">一键下单</a>
</div>
</c:if>
<c:if test="${sessionScope.user == null}">
<p>请登录后查看更多内容~</p>
<br>
<a href="/register">注册</a>
<a href="/login">登录</a>
<!-- 空购物车提示 -->
<c:if test="${empty computers}">
<div class="alert alert-warning text-center" role="alert">
购物车为空，暂无商品可下单。
</div>
</c:if>
</div>
<h1>购物车</h1>
<c:if test="${not empty computers}">
<table border="1">
<thead>
<tr>
<th>ID</th>
<th>Name</th>
<th>Price</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
<c:forEach var="computer" items="${computers}">
<tr>
<td>${computer.id}</td>
<td>${computer.name}</td>
<td>${computer.price}</td>
<td>
<a href="/cart?action=remove&id=${computer.id}">移出</a>
</td>
</tr>
</c:forEach>
</tbody>
</table>
<hr>
</c:if>
<c:if test="${not empty computers}">
<a href="/orders?action=add">
<button>一键下单</button>
</a>
</c:if>
<c:if test="${empty computers}">
<p>购物车为空，暂无商品可下单。</p>
</c:if>
<br>
<br/>
<br>
</body>
</html>
</html>

75
src/main/webapp/checkOrder.jsp
View File

@ -1,25 +1,70 @@
<%@ page contentType="text/html; charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://www.liyansheng.top/cdn/watermark.js"></script>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>订单确认</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
<script src="https://www.liyansheng.top/cdn/watermark.js"></script>
</head>
<body>
<h1>订单确认</h1>
<form action="/orders" method="post">
<label for="price">总金额: </label><br>
<input type="text" id="price" name="price" value="${order.totalPrice}" readonly><br><br>
<label for="address">地址: </label><br>
<input type="text" id="address" name="address" value="${order.address}" required><br><br>
<label for="remark">商品信息: </label><br>
<textarea id="remark" name="remark" rows="15" cols="30" readonly>${order.remark}</textarea><br><br>
<input type="submit" value="我已确认">
</form>
<br>
<div class="container mt-5">
<!-- 页面标题 -->
<div class="card shadow">
<div class="card-header bg-primary text-white text-center">
<h1>订单确认</h1>
</div>
<div class="card-body">
<form action="/orders" method="post" class="needs-validation" novalidate>
<!-- 总金额 -->
<div class="mb-3">
<label for="price" class="form-label">总金额</label>
<input type="text" id="price" name="price" class="form-control" value="${order.totalPrice}" readonly>
</div>
<!-- 地址 -->
<div class="mb-3">
<label for="address" class="form-label">地址</label>
<input type="text" id="address" name="address" class="form-control" value="${order.address}" required>
<div class="invalid-feedback">请输入有效的地址。</div>
</div>
<!-- 商品信息 -->
<div class="mb-3">
<label for="remark" class="form-label">商品信息</label>
<textarea id="remark" name="remark" class="form-control" rows="5" readonly>${order.remark}</textarea>
</div>
<!-- 确认按钮 -->
<div class="d-grid">
<button type="submit" class="btn btn-success">我已确认</button>
</div>
</form>
</div>
</div>
</div>
<script>
// 前端表单验证
(function () {
'use strict';
const forms = document.querySelectorAll('.needs-validation');
Array.from(forms).forEach(form => {
form.addEventListener('submit', event => {
if (!form.checkValidity()) {
event.preventDefault();
event.stopPropagation();
}
form.classList.add('was-validated');
}, false);
});
})();
</script>
</body>
</html>
</html>

156
src/main/webapp/computerList.jsp
View File

@ -1,44 +1,55 @@
<%@ page contentType="text/html; charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html lang="en">
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://www.liyansheng.top/cdn/watermark.js"></script>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>电脑产品列表</title>
</head>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>电脑产品列表</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
<script src="https://www.liyansheng.top/cdn/watermark.js"></script>
</head>
<body>
<div>
<body>
<div class="container mt-5">
<!-- 顶部导航 -->
<div class="card shadow">
<div class="card-header bg-primary text-white text-center">
<h2>电脑商城</h2>
<p>你好！${sessionScope.user.username}</p>
<c:if test="${sessionScope.user!= null}">
<a href="/computer?action=list">电脑选购</a>
<c:if test="${sessionScope.user.role == 'user'}">
<a href="/cart?action=list">我的购物车</a>
<a href="/orders?action=my">我的订单</a>
</c:if>
<c:if test="${sessionScope.user.role == 'admin'}">
<a href="/user?action=list">用户列表</a>
<a href="/orders?action=all">所有订单</a>
</c:if>
<a href="/logout">退出</a>
</div>
<div class="card-body">
<p class="text-center">你好！<strong>${sessionScope.user.username}</strong></p>
<c:if test="${sessionScope.user != null}">
<div class="d-grid gap-2 d-md-flex justify-content-md-center">
<a href="/computer?action=list" class="btn btn-outline-primary">电脑选购</a>
<c:if test="${sessionScope.user.role == 'user'}">
<a href="/cart?action=list" class="btn btn-outline-primary">我的购物车</a>
<a href="/orders?action=my" class="btn btn-outline-primary">我的订单</a>
</c:if>
<c:if test="${sessionScope.user.role == 'admin'}">
<a href="/user?action=list" class="btn btn-outline-primary">用户列表</a>
<a href="/orders?action=all" class="btn btn-outline-primary">所有订单</a>
</c:if>
<a href="/logout" class="btn btn-danger">退出</a>
</div>
</c:if>
<c:if test="${sessionScope.user == null}">
<p>请登录后查看更多内容~</p>
<br>
<a href="/register">注册</a>
<a href="/login">登录</a>
<p class="text-center">请登录后查看更多内容~</p>
<div class="d-grid gap-2 d-md-flex justify-content-md-center">
<a href="/register" class="btn btn-outline-primary">注册</a>
<a href="/login" class="btn btn-outline-primary">登录</a>
</div>
</c:if>
</div>
<h1>电脑产品列表</h1>
<table border="1">
<thead>
</div>
<!-- 产品列表 -->
<div class="mt-4">
<h1 class="text-center">电脑产品列表</h1>
<table class="table table-bordered table-striped text-center mt-3">
<thead class="table-primary">
<tr>
<th>ID</th>
<th>名称</th>
@ -56,56 +67,59 @@
<td>${computer.stock}</td>
<td>
<c:if test="${sessionScope.user.role == 'admin'}">
<a href="/computer?action=edit&id=${computer.id}">编辑</a> |
<a href="/computer?action=delete&id=${computer.id}">删除</a>
<a href="/computer?action=edit&id=${computer.id}" class="btn btn-sm btn-warning">编辑</a>
<a href="/computer?action=delete&id=${computer.id}" class="btn btn-sm btn-danger">删除</a>
</c:if>
<c:if test="${sessionScope.user.role == 'user'}">
<a href="/cart?action=add&id=${computer.id}">加购</a>
<a href="/cart?action=add&id=${computer.id}" class="btn btn-sm btn-success">加购</a>
</c:if>
</td>
</tr>
</c:forEach>
</tbody>
</table>
<div>
<!-- 首页链接 -->
<a href="/computer?action=list&page=1">首页</a>
</div>
<!-- 上一页链接 -->
<c:if test="${currentPage > 1}">
<a href="/computer?action=list&page=${currentPage - 1}">上一页</a>
</c:if>
<!-- 分页导航 -->
<div class="d-flex justify-content-center mt-4">
<nav aria-label="Page navigation">
<ul class="pagination">
<li class="page-item"><a href="/computer?action=list&page=1" class="page-link">首页</a></li>
<c:if test="${currentPage > 1}">
<li class="page-item">
<a href="/computer?action=list&page=${currentPage - 1}" class="page-link">上一页</a>
</li>
</c:if>
<c:forEach var="i" begin="1" end="${totalPages}">
<li class="page-item ${i == currentPage ? 'active' : ''}">
<a href="/computer?action=list&page=${i}" class="page-link">${i}</a>
</li>
</c:forEach>
<c:if test="${currentPage < totalPages}">
<li class="page-item">
<a href="/computer?action=list&page=${currentPage + 1}" class="page-link">下一页</a>
</li>
</c:if>
<li class="page-item"><a href="/computer?action=list&page=${totalPages}" class="page-link">尾页</a></li>
</ul>
</nav>
</div>
<!-- 分页页码 -->
<c:forEach var="i" begin="1" end="${totalPages}">
<a href="/computer?action=list&page=${i}"
style="margin: 0 5px; ${i == currentPage ? 'font-weight:bold;' : ''}">
${i}
</a>
</c:forEach>
<!-- 下一页链接 -->
<c:if test="${currentPage < totalPages}">
<a href="/computer?action=list&page=${currentPage + 1}">下一页</a>
</c:if>
<!-- 尾页链接 -->
<a href="/computer?action=list&page=${totalPages}">尾页</a>
</div>
<hr>
<p style="color: red;">${requestScope.msg}</p>
<br />
<!-- 底部功能 -->
<div class="text-center mt-4">
<c:if test="${sessionScope.user.role == 'user'}">
<a href="/cart?action=list">我的购物车</a>
<a href="/cart?action=list" class="btn btn-outline-primary">我的购物车</a>
</c:if>
<c:if test="${sessionScope.user.role == 'admin'}">
<a href="/computer?action=add">发布电脑产品</a>
<a href="/computer?action=add" class="btn btn-outline-primary">发布电脑产品</a>
</c:if>
<br>
</body>
</div>
</html>
<!-- 消息提示 -->
<div class="text-center text-danger mt-3">
<p>${requestScope.msg}</p>
</div>
</div>
</body>
</html>

56
src/main/webapp/editComputer.jsp
View File

@ -1,26 +1,54 @@
<%@ page contentType="text/html; charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://www.liyansheng.top/cdn/watermark.js"></script>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>更新电脑信息</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
</head>
<body>
<h1>更新电脑信息</h1>
<form action="/computer?action=edit" method="post">
<input type="hidden" name="id" value="${computer.id}">
<label for="name">名称: </label><br>
<input type="text" id="name" name="name" value="${computer.name}"><br><br>
<label for="price">价格: </label><br>
<input type="text" id="price" name="price" value="${computer.price}"><br><br>
<label for="stock">库存: </label><br>
<input type="text" id="stock" name="stock" value="${computer.stock}"><br><br>
<input type="submit" value="提交修改">
</form>
<br>
<a href="/computer?action=list">返回电脑列表</a>
<div class="container mt-5">
<!-- 页头 -->
<div class="card shadow mb-4">
<div class="card-header bg-primary text-white text-center">
<h2>更新电脑信息</h2>
</div>
</div>
<!-- 更新表单 -->
<div class="card shadow">
<div class="card-body">
<form action="/computer?action=edit" method="post">
<input type="hidden" name="id" value="${computer.id}">
<div class="mb-3">
<label for="name" class="form-label">名称</label>
<input type="text" class="form-control" id="name" name="name" value="${computer.name}" required>
</div>
<div class="mb-3">
<label for="price" class="form-label">价格</label>
<input type="text" class="form-control" id="price" name="price" value="${computer.price}" required>
</div>
<div class="mb-3">
<label for="stock" class="form-label">库存</label>
<input type="text" class="form-control" id="stock" name="stock" value="${computer.stock}" required>
</div>
<div class="text-center">
<button type="submit" class="btn btn-success btn-lg">提交修改</button>
</div>
</form>
</div>
</div>
<!-- 返回按钮 -->
<div class="text-center mt-4">
<a href="/computer?action=list" class="btn btn-primary">返回电脑列表</a>
</div>
</div>
</body>
</html>

75
src/main/webapp/index.jsp
View File

@ -1,33 +1,52 @@
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<body>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>电脑商城</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
<script src="https://www.liyansheng.top/cdn/watermark.js"></script>
<div>
<h2>电脑商城</h2>
<p>你好！${sessionScope.user.username}</p>
<c:if test="${sessionScope.user!= null}">
<a href="/computer?action=list">电脑选购</a>
<c:if test="${sessionScope.user.role == 'user'}">
<a href="/cart?action=list">我的购物车</a>
<a href="/orders?action=my">我的订单</a>
</c:if>
<c:if test="${sessionScope.user.role == 'admin'}">
<a href="/user?action=list">用户列表</a>
<a href="/orders?action=all">所有订单</a>
</c:if>
<a href="/logout">退出</a>
</c:if>
<c:if test="${sessionScope.user == null}">
<p>请登录后查看更多内容~</p>
<br>
<a href="/register">注册</a>
<a href="/login">登录</a>
</c:if>
</head>
<body>
<div class="container mt-5">
<div class="card shadow">
<div class="card-header bg-primary text-white text-center">
<h2>电脑商城</h2>
</div>
<div class="card-body">
<p class="text-center">你好！<strong>${sessionScope.user.username}</strong></p>
<c:if test="${sessionScope.user != null}">
<div class="d-grid gap-2 d-md-flex justify-content-md-center mb-3">
<a href="/computer?action=list" class="btn btn-outline-primary">电脑选购</a>
<c:if test="${sessionScope.user.role == 'user'}">
<a href="/cart?action=list" class="btn btn-outline-primary">我的购物车</a>
<a href="/orders?action=my" class="btn btn-outline-primary">我的订单</a>
</c:if>
<c:if test="${sessionScope.user.role == 'admin'}">
<a href="/user?action=list" class="btn btn-outline-primary">用户列表</a>
<a href="/orders?action=all" class="btn btn-outline-primary">所有订单</a>
</c:if>
<a href="/logout" class="btn btn-danger">退出</a>
</div>
</c:if>
<c:if test="${sessionScope.user == null}">
<p class="text-center">请登录后查看更多内容~</p>
<div class="d-grid gap-2 d-md-flex justify-content-md-center">
<a href="/register" class="btn btn-outline-primary">注册</a>
<a href="/login" class="btn btn-outline-primary">登录</a>
</div>
</c:if>
</div>
</div>
</div>
</body>
</html>
</html>

64
src/main/webapp/login.jsp
View File

@ -1,23 +1,49 @@
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://www.liyansheng.top/cdn/watermark.js"></script>
</head>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>电脑商城 - 用户登录</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
<script src="https://www.liyansheng.top/cdn/watermark.js"></script>
</head>
<body>
<h2>-电脑商城-用户登录</h2>
<form action="login" method="post">
<label for="username">用户名:</label>
<input type="text" id="username" name="username" required><br><br>
<label for="password">密码:</label>
<input type="password" id="password" name="password" required><br><br>
<button type="submit">登录</button>
<a href="/register">没有账号?去注册</a>
</form>
<br>
${requestScope.msg}
</body>
<body>
<div class="container mt-5">
<div class="row justify-content-center">
<div class="col-md-6">
<div class="card shadow">
<div class="card-header text-center bg-primary text-white">
<h2>电脑商城 - 用户登录</h2>
</div>
<div class="card-body">
<form action="login" method="post">
<div class="mb-3">
<label for="username" class="form-label">用户名:</label>
<input type="text" id="username" name="username" class="form-control" required>
</div>
<div class="mb-3">
<label for="password" class="form-label">密码:</label>
<input type="password" id="password" name="password" class="form-control" required>
</div>
<div class="d-grid">
<button type="submit" class="btn btn-primary">登录</button>
</div>
</form>
<div class="text-center mt-3">
<a href="/register" class="text-decoration-none">没有账号? 去注册</a>
</div>
</div>
</div>
<div class="mt-3 text-center">
${requestScope.msg}
</div>
</div>
</div>
</div>
</body>
</html>
</html>

41
src/main/webapp/msg.jsp
View File

@ -1,16 +1,35 @@
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://www.liyansheng.top/cdn/watermark.js"></script>
</head>
<head>
<script src="https://www.liyansheng.top/cdn/watermark.js"></script>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>提示</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
</head>
<body>
<h2>提示:</h2>
<h3>${sessionScope.msg}</h3>
<button onclick="window.history.back();">返回</button>
<body>
<div class="container mt-5">
<!-- 页头 -->
<div class="card shadow mb-4">
<div class="card-header bg-warning text-dark text-center">
<h2>提示</h2>
</div>
</div>
</body>
<!-- 提示消息 -->
<div class="card shadow">
<div class="card-body text-center">
<h3>${sessionScope.msg}</h3>
<div class="mt-4">
<button class="btn btn-primary btn-lg" onclick="window.history.back();">返回</button>
</div>
</div>
</div>
</div>
</body>
</html>
</html>

125
src/main/webapp/myOrder.jsp
View File

@ -2,71 +2,84 @@
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://www.liyansheng.top/cdn/watermark.js"></script>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>我的订单</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
</head>
<body>
<div>
<h2>电脑商城</h2>
<p>你好！${sessionScope.user.username}</p>
<c:if test="${sessionScope.user!= null}">
<a href="/computer?action=list">电脑选购</a>
<c:if test="${sessionScope.user.role == 'user'}">
<a href="/cart?action=list">我的购物车</a>
<a href="/orders?action=my">我的订单</a>
</c:if>
<c:if test="${sessionScope.user.role == 'admin'}">
<a href="/user?action=list">用户列表</a>
<a href="/orders?action=all">所有订单</a>
</c:if>
<a href="/logout">退出</a>
</c:if>
<c:if test="${sessionScope.user == null}">
<p>请登录后查看更多内容~</p>
<br>
<a href="/register">注册</a>
<a href="/login">登录</a>
</c:if>
</div>
<div class="container mt-5">
<!-- 顶部导航 -->
<div class="card shadow">
<div class="card-header bg-primary text-white text-center">
<h2>电脑商城</h2>
</div>
<div class="card-body">
<p class="text-center">你好！<strong>${sessionScope.user.username}</strong></p>
<c:if test="${sessionScope.user != null}">
<div class="d-grid gap-2 d-md-flex justify-content-md-center">
<a href="/computer?action=list" class="btn btn-outline-primary">电脑选购</a>
<c:if test="${sessionScope.user.role == 'user'}">
<a href="/cart?action=list" class="btn btn-outline-primary">我的购物车</a>
<a href="/orders?action=my" class="btn btn-outline-primary">我的订单</a>
</c:if>
<c:if test="${sessionScope.user.role == 'admin'}">
<a href="/user?action=list" class="btn btn-outline-primary">用户列表</a>
<a href="/orders?action=all" class="btn btn-outline-primary">所有订单</a>
</c:if>
<a href="/logout" class="btn btn-danger">退出</a>
</div>
</c:if>
<c:if test="${sessionScope.user == null}">
<p class="text-center">请登录后查看更多内容~</p>
<div class="d-grid gap-2 d-md-flex justify-content-md-center">
<a href="/register" class="btn btn-outline-primary">注册</a>
<a href="/login" class="btn btn-outline-primary">登录</a>
</div>
</c:if>
</div>
</div>
<h1>我的订单</h1>
<h3>我的订单</h3>
<div style="color: red;">
<p>${requestScope.msg}</p>
<div style="color: red;">
<p>${requestScope.msg}</p>
</div>
<div class="table-responsive">
<table class="table table-striped table-bordered">
<thead>
<tr>
<th>订单编号</th>
<th>用户ID</th>
<th>订单日期</th>
<th>总金额</th>
<th>地址</th>
<th>商品信息</th>
<th>状态</th>
</tr>
</thead>
<tbody>
<c:forEach var="order" items="${Orders}">
<tr>
<td>${order.id}</td>
<td>${order.userId}</td>
<td>${order.orderDate}</td>
<td>${order.totalPrice}</td>
<td>${order.address}</td>
<td>${order.remark}</td>
<td>${order.status}</td>
</tr>
</c:forEach>
</tbody>
</table>
</div>
</div>
<table border="1">
<thead>
<tr>
<th>订单编号</th>
<th>用户ID</th>
<th>订单日期</th>
<th>总金额</th>
<th>地址</th>
<th>商品信息</th>
<th>状态</th>
</tr>
</thead>
<tbody>
<c:forEach var="order" items="${Orders}">
<tr>
<td>${order.id}</td>
<td>${order.userId}</td>
<td>${order.orderDate}</td>
<td>${order.totalPrice}</td>
<td>${order.address}</td>
<td>${order.remark}</td>
<td>${order.status}</td>
</tr>
</c:forEach>
</tbody>
</table>
<br/>
<br>
</body>
</html>

146
src/main/webapp/orders.jsp
View File

@ -8,76 +8,88 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>订单列表</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
</head>
<body>
<div>
<h2>电脑商城</h2>
<p>你好！${sessionScope.user.username}</p>
<c:if test="${sessionScope.user!= null}">
<a href="/computer?action=list">电脑选购</a>
<c:if test="${sessionScope.user.role == 'user'}">
<a href="/cart?action=list">我的购物车</a>
<a href="/orders?action=my">我的订单</a>
</c:if>
<c:if test="${sessionScope.user.role == 'admin'}">
<a href="/user?action=list">用户列表</a>
<a href="/orders?action=all">所有订单</a>
</c:if>
<a href="/logout">退出</a>
</c:if>
<c:if test="${sessionScope.user == null}">
<p>请登录后查看更多内容~</p>
<br>
<a href="/register">注册</a>
<a href="/login">登录</a>
</c:if>
</div>
<h1>订单列表</h1>
<a href="/orders?action=all">全部</a> |
<a href="/orders?action=waiting">待发货</a> |
<a href="/orders?action=sent">已发货</a>
<br>
<br>
<table border="1">
<thead>
<tr>
<th>订单编号</th>
<th>用户ID</th>
<th>订单日期</th>
<th>总金额</th>
<th>地址</th>
<th>商品信息</th>
<th>状态</th>
<th>操作</th>
</tr>
</thead>
<tbody>
<c:forEach var="order" items="${Orders}">
<tr>
<td>${order.id}</td>
<td>${order.userId}</td>
<td>${order.orderDate}</td>
<td>${order.totalPrice}</td>
<td>${order.address}</td>
<td>${order.remark}</td>
<td>${order.status}</td>
<td>
<c:if test="${order.status!= '已发货'}">
<a href="/orders?action=deliver&id=${order.id}">
点击发货 </a>
<div class="container mt-5">
<!-- 顶部导航 -->
<div class="card shadow">
<div class="card-header bg-primary text-white text-center">
<h2>电脑商城</h2>
</div>
<div class="card-body">
<p class="text-center">你好！<strong>${sessionScope.user.username}</strong></p>
<c:if test="${sessionScope.user != null}">
<div class="d-grid gap-2 d-md-flex justify-content-md-center">
<a href="/computer?action=list" class="btn btn-outline-primary">电脑选购</a>
<c:if test="${sessionScope.user.role == 'user'}">
<a href="/cart?action=list" class="btn btn-outline-primary">我的购物车</a>
<a href="/orders?action=my" class="btn btn-outline-primary">我的订单</a>
</c:if>
</td>
</tr>
</c:forEach>
</tbody>
</table>
<br />
<br>
<c:if test="${sessionScope.user.role == 'admin'}">
<a href="/user?action=list" class="btn btn-outline-primary">用户列表</a>
<a href="/orders?action=all" class="btn btn-outline-primary">所有订单</a>
</c:if>
<a href="/logout" class="btn btn-danger">退出</a>
</div>
</c:if>
<c:if test="${sessionScope.user == null}">
<p class="text-center">请登录后查看更多内容~</p>
<div class="d-grid gap-2 d-md-flex justify-content-md-center">
<a href="/register" class="btn btn-outline-primary">注册</a>
<a href="/login" class="btn btn-outline-primary">登录</a>
</div>
</c:if>
</div>
</div>
<h3>订单列表</h3>
<div class="mb-3">
<a href="/orders?action=all" class="btn btn-outline-primary">全部</a>
<a href="/orders?action=waiting" class="btn btn-outline-warning">待发货</a>
<a href="/orders?action=sent" class="btn btn-outline-success">已发货</a>
</div>
<div class="table-responsive">
<table class="table table-striped table-bordered">
<thead>
<tr>
<th>订单编号</th>
<th>用户ID</th>
<th>订单日期</th>
<th>总金额</th>
<th>地址</th>
<th>商品信息</th>
<th>状态</th>
<th>操作</th>
</tr>
</thead>
<tbody>
<c:forEach var="order" items="${Orders}">
<tr>
<td>${order.id}</td>
<td>${order.userId}</td>
<td>${order.orderDate}</td>
<td>${order.totalPrice}</td>
<td>${order.address}</td>
<td>${order.remark}</td>
<td>${order.status}</td>
<td>
<c:if test="${order.status != '已发货'}">
<a href="/orders?action=deliver&id=${order.id}" class="btn btn-success btn-sm">
点击发货
</a>
</c:if>
</td>
</tr>
</c:forEach>
</tbody>
</table>
</div>
</div>
</body>
</html>
</html>

70
src/main/webapp/register.jsp
View File

@ -1,25 +1,53 @@
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://www.liyansheng.top/cdn/watermark.js"></script>
</head>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>用户注册</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
<script src="https://www.liyansheng.top/cdn/watermark.js"></script>
</head>
<body>
<h2>用户注册</h2>
<form action="register" method="post">
<label for="username">用户名:</label>
<input type="text" id="username" name="username" required><br><br>
<label for="password">密码:</label>
<input type="password" id="password" name="password" required><br><br>
<label for="phone">电话:</label>
<input type="text" id="phone" name="phone" required><br><br>
<button type="submit">注册</button>
<a href="/login">已有账号，去登录</a>
</form>
<br>
${requestScope.msg}
</body>
<body>
<div class="container mt-5">
<div class="row justify-content-center">
<div class="col-md-6">
<div class="card shadow">
<div class="card-header text-center bg-primary text-white">
<h2>用户注册</h2>
</div>
<div class="card-body">
<form action="register" method="post">
<div class="mb-3">
<label for="username" class="form-label">用户名:</label>
<input type="text" id="username" name="username" class="form-control" required>
</div>
<div class="mb-3">
<label for="password" class="form-label">密码:</label>
<input type="password" id="password" name="password" class="form-control" required>
</div>
<div class="mb-3">
<label for="phone" class="form-label">电话:</label>
<input type="text" id="phone" name="phone" class="form-control" required>
</div>
<div class="d-grid">
<button type="submit" class="btn btn-primary">注册</button>
</div>
</form>
<div class="text-center mt-3">
<a href="/login" class="text-decoration-none">已有账号，去登录</a>
</div>
</div>
</div>
<div class="mt-3 text-center">
${requestScope.msg}
</div>
</div>
</div>
</div>
</body>
</html>
</html>

26
src/main/webapp/result.jsp
View File

@ -2,19 +2,33 @@
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://www.liyansheng.top/cdn/watermark.js"></script>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>操作结果</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
</head>
<body>
<h1>操作结果</h1>
<div style="color: red;">
<p>${requestScope.msg}</p>
<body>
<div class="container mt-5">
<div class="card shadow mb-4">
<div class="card-header bg-primary text-white text-center">
<h2>操作结果</h2>
</div>
<div class="card-body">
<!-- 显示操作结果消息 -->
<div class="alert alert-danger" role="alert">
<p>${requestScope.msg}</p>
</div>
<!-- 返回按钮 -->
<a href="javascript:history.back()" class="btn btn-secondary">返回</a>
</div>
</div>
</div>
<br>
</body>
</html>

125
src/main/webapp/userList.jsp
View File

@ -2,65 +2,84 @@
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://www.liyansheng.top/cdn/watermark.js"></script>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>系统用户</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
</head>
<body>
<div>
<h2>电脑商城</h2>
<p>你好！${sessionScope.user.username}</p>
<c:if test="${sessionScope.user!= null}">
<a href="/computer?action=list">电脑选购</a>
<c:if test="${sessionScope.user.role == 'user'}">
<a href="/cart?action=list">我的购物车</a>
<a href="/orders?action=my">我的订单</a>
</c:if>
<c:if test="${sessionScope.user.role == 'admin'}">
<a href="/user?action=list">用户列表</a>
<a href="/orders?action=all">所有订单</a>
</c:if>
<a href="/logout">退出</a>
</c:if>
<c:if test="${sessionScope.user == null}">
<p>请登录后查看更多内容~</p>
<br>
<a href="/register">注册</a>
<a href="/login">登录</a>
</c:if>
</div>
<h1>系统用户</h1>
<table border="1">
<thead>
<tr>
<th>ID</th>
<th>用户名</th>
<th>手机号</th>
<th>身份标识</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
<c:forEach var="user" items="${userList}">
<tr>
<td>${user.id}</td>
<td>${user.username}</td>
<td>${user.phone}</td>
<td>${user.role}</td>
<td>
<a href="javascript:void(0)" >Delete</a>
</td>
</tr>
</c:forEach>
</tbody>
</table>
<br/>
<!-- <a href="/adduser">Add New user</a> -->
<body>
<div class="container mt-5">
<!-- 顶部导航 -->
<div class="card shadow">
<div class="card-header bg-primary text-white text-center">
<h2>电脑商城</h2>
</div>
<div class="card-body">
<p class="text-center">你好！<strong>${sessionScope.user.username}</strong></p>
<c:if test="${sessionScope.user != null}">
<div class="d-grid gap-2 d-md-flex justify-content-md-center">
<a href="/computer?action=list" class="btn btn-outline-primary">电脑选购</a>
<c:if test="${sessionScope.user.role == 'user'}">
<a href="/cart?action=list" class="btn btn-outline-primary">我的购物车</a>
<a href="/orders?action=my" class="btn btn-outline-primary">我的订单</a>
</c:if>
<c:if test="${sessionScope.user.role == 'admin'}">
<a href="/user?action=list" class="btn btn-outline-primary">用户列表</a>
<a href="/orders?action=all" class="btn btn-outline-primary">所有订单</a>
</c:if>
<a href="/logout" class="btn btn-danger">退出</a>
</div>
</c:if>
<c:if test="${sessionScope.user == null}">
<p class="text-center">请登录后查看更多内容~</p>
<div class="d-grid gap-2 d-md-flex justify-content-md-center">
<a href="/register" class="btn btn-outline-primary">注册</a>
<a href="/login" class="btn btn-outline-primary">登录</a>
</div>
</c:if>
</div>
</div>
<!-- Title Section -->
<h1 class="mb-4">系统用户</h1>
<!-- User Table -->
<div class="table-responsive">
<table class="table table-bordered table-striped">
<thead class="thead-dark">
<tr>
<th>ID</th>
<th>用户名</th>
<th>手机号</th>
<th>身份标识</th>
<th>操作</th>
</tr>
</thead>
<tbody>
<c:forEach var="user" items="${userList}">
<tr>
<td>${user.id}</td>
<td>${user.username}</td>
<td>${user.phone}</td>
<td>${user.role}</td>
<td>
<a href="javascript:void(0)" class="btn btn-danger btn-sm">删除</a>
</td>
</tr>
</c:forEach>
</tbody>
</table>
</div>
<!-- Add New User Section (Optional) -->
<!-- <a href="/adduser" class="btn btn-success btn-sm mt-3">添加新用户</a> -->
</div>
</body>
</html>