|
|
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
|
|
|
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
|
|
<html>
|
|
|
<head>
|
|
|
<!-- 设置页面的内容类型为HTML格式，字符编码为UTF-8，指定页面使用的编程语言为Java -->
|
|
|
<title>文件列表</title>
|
|
|
<!-- 引入layui框架的样式文件，用于设置页面的整体样式风格，使页面呈现出layui框架定义的外观效果 -->
|
|
|
<link rel="stylesheet" href="./css/layui.css">
|
|
|
<!-- 引入自定义的样式文件，可能用于覆盖或补充layui样式，实现针对本页面特定的样式需求 -->
|
|
|
<link rel="stylesheet" href="./css/style.css">
|
|
|
<!-- 引入layui框架的JavaScript文件，这是使用layui框架各种功能组件（如表单验证、元素操作等）的基础 -->
|
|
|
<script src="./layui.js"></script>
|
|
|
<!-- 引入jQuery库的压缩版本，jQuery是一个广泛使用的JavaScript库，方便进行DOM操作、事件处理以及与页面元素交互等操作 -->
|
|
|
<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
|
|
|
</head>
|
|
|
<body class="layui-layout-body" style="background-color: #F2F2F2">
|
|
|
<!-- 包含名为“filterLogin.jsp”的JSP页面，通常用于进行登录状态的过滤判断，比如验证用户是否已登录等相关逻辑处理 -->
|
|
|
<jsp:include page="/filterLogin.jsp"></jsp:include>
|
|
|
<!-- 包含名为“WEB-INF/admin/aHeader.jsp”的JSP页面，一般用于引入页面的头部部分，可能包含页面的通用头部元素，如页面标题、导航栏等 -->
|
|
|
<jsp:include page="/WEB-INF/admin/aHeader.jsp"></jsp:include>
|
|
|
<!-- 包含名为“WEB-INF/admin/adminNav.jsp”的JSP页面，主要用于引入管理员导航栏部分，展示管理员相关操作的导航菜单选项 -->
|
|
|
<jsp:include page="/WEB-INF/admin/adminNav.jsp"></jsp:include>
|
|
|
<div class="layui-layout layui-layout-admin">
|
|
|
<div class="layui-body">
|
|
|
<!-- 页面的内容主体区域，在这里放置页面主要展示和交互的内容 -->
|
|
|
<div style="padding: 15px;">
|
|
|
<!-- 使用layui的面包屑组件来展示当前页面在整个系统中的层级路径，方便用户了解所处位置 -->
|
|
|
<span class="layui-breadcrumb">
|
|
|
<!-- 面包屑的第一项，代表顶层分类，点击可跳转到管理员相关的根页面（此处具体跳转功能取决于href属性对应的实际路径设置，当前为空） -->
|
|
|
<a href="">管理员</a>
|
|
|
<!-- 面包屑的第二项，代表系统设置分类，点击可跳转到系统设置相关页面（同样，具体跳转依赖href属性实际设置，当前为空） -->
|
|
|
<a href="">系统设置</a>
|
|
|
<!-- 面包屑的第三项，显示当前页面具体名称为“文件列表” -->
|
|
|
<a><cite>文件列表</cite></a>
|
|
|
</span>
|
|
|
<!-- 使用layui的表格组件创建一个表格，设置了lay-filter属性为“test”，方便后续通过layui框架对表格进行交互操作 -->
|
|
|
<table class="layui-table" lay-filter="test">
|
|
|
<thead>
|
|
|
<tr>
|
|
|
<!-- 定义表格表头的第一列，标题显示为“ID”，用于展示文件相关记录的序号或唯一标识等 -->
|
|
|
<th>ID</th>
|
|
|
<!-- 定义表格表头的第二列，标题显示为“文件名”，用于展示文件的名称信息 -->
|
|
|
<th>文件名</th>
|
|
|
<!-- 定义表格表头的第三列，标题显示为“文件路径”，用于展示文件在服务器或存储系统中的具体存放路径 -->
|
|
|
<th>文件路径</th>
|
|
|
<!-- 定义表格表头的第四列，标题显示为“文件大小”，用于展示文件所占的存储空间大小 -->
|
|
|
<th>文件大小</th>
|
|
|
<!-- 定义表格表头的第五列，标题显示为“操作”，通常用于放置针对文件进行相关操作的按钮等元素 -->
|
|
|
<th>操作</th>
|
|
|
</tr>
|
|
|
</thead>
|
|
|
<!-- 使用JSTL的forEach标签循环遍历名为“fileLists”的集合（应该是在后台传递过来的文件相关数据集合） -->
|
|
|
<c:forEach items="${fileLists}" var="filelist" varStatus="f">
|
|
|
<tr>
|
|
|
<!-- 在表格行中显示当前循环的序号（从1开始计数），通过EL表达式“${f.count}”获取并展示 -->
|
|
|
<td>${f.count}</td>
|
|
|
<!-- 在表格行中显示当前循环对象（filelist）中的文件名属性值，通过EL表达式“${filelist.fileName}”获取并展示 -->
|
|
|
<td>${filelist.fileName}</td>
|
|
|
<!-- 在表格行中显示当前循环对象（filelist）中的文件路径属性值，通过EL表达式“${filelist.filePath}”获取并展示 -->
|
|
|
<td>${filelist.filePath}</td>
|
|
|
<!-- 在表格行中显示当前循环对象（filelist）中的文件大小属性值，通过EL表达式“${filelist.fileSize}”获取并展示 -->
|
|
|
<td>${filelist.fileSize}</td>
|
|
|
<td>
|
|
|
<!-- 在表格行的操作列中添加一个下载按钮，按钮样式为layui的普通按钮样式（layui-btn-normal），
|
|
|
点击按钮会跳转到“${pageContext.request.contextPath}/downloadServlet?filename=${filelist.fileName}”路径，
|
|
|
通过URL参数传递文件名信息给对应的Servlet用于实现文件下载功能 -->
|
|
|
<a class="layui-btn layui-btn-normal" href="${pageContext.request.contextPath}/downloadServlet?filename=${filelist.fileName}">下载</a>
|
|
|
<!-- 在表格行的操作列中添加一个删除按钮，按钮样式为layui的危险按钮样式（layui-btn-danger），
|
|
|
点击按钮会跳转到“${pageContext.request.contextPath}/deleteFileServlet?filename=${filelist.fileName}”路径，
|
|
|
通过URL参数传递文件名信息给对应的Servlet用于实现文件删除功能 -->
|
|
|
<a class="layui-btn layui-btn-danger" href="${pageContext.request.contextPath}/deleteFileServlet?filename=${filelist.fileName}">删除</a>
|
|
|
</td>
|
|
|
</tr>
|
|
|
</c:forEach>
|
|
|
</table>
|
|
|
<!-- 包含名为“footer.jsp”的JSP页面，一般用于引入页面底部部分，可能包含版权信息、联系方式等通用的底部元素 -->
|
|
|
<jsp:include page="/footer.jsp"></jsp:include>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
|
|
|
<!-- 使用jQuery选择器选择特定的DOM元素（此处是导航栏中特定位置的元素），并为其添加“layui-this”类名，通常用于设置该元素的选中状态样式等（具体样式效果取决于对应的CSS定义） -->
|
|
|
<script type="text/javascript">
|
|
|
$("#nav li:nth-child(5) dl dd:nth-child(4)").addClass("layui-this");
|
|
|
$("#nav li:nth-child(5)").addClass("layui-nav-itemed");
|
|
|
</script>
|
|
|
<!-- 使用layui框架的“element”模块，调用其“init”方法进行相关初始化操作，“element”模块常用于实现页面的交互元素（如折叠面板、导航栏等）的功能初始化 -->
|
|
|
<script>
|
|
|
//JavaScript代码区域
|
|
|
layui.use('element', function(){
|
|
|
var element = layui.element;
|
|
|
element.init();
|
|
|
});
|
|
|
</script>
|
|
|
</body>
|
|
|
</html> |
