You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
text1/web/WEB-INF/teacher/tIndex.jsp

153 lines
18 KiB

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!-- JSP页面指令用于设置页面的相关属性
- “contentType”属性指定页面内容类型为“text/html”表明页面以HTML格式展示内容同时设置字符编码为“UTF-8”这样能确保页面可以正确处理和显示各种字符如中文等避免出现乱码情况保证页面内容正常展示。
- “language=java”说明该JSP页面内部的逻辑实现是基于Java语言的例如可以在页面中嵌入Java代码片段来与服务器端进行交互、处理业务数据等操作。 -->
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!-- 引入JSTLJavaServer Pages Standard Tag Library核心标签库通过设定“prefix”属性为“c”后续在页面里就能使用以“c”开头的各种JSTL标签了。这些标签能够方便地实现诸如循环遍历集合数据、进行条件判断、将数据输出到页面等常见功能大大增强了JSP页面在处理动态数据和展示内容方面的灵活性与便利性。 -->
<html>
<head>
<title>${html_title}</title>
<!-- 设置HTML页面的标题不过这里使用了EL表达式Expression Language意味着标题的值是动态从服务器端传递过来的具体的标题内容会根据服务器设置的“html_title”变量值来显示方便灵活地定制页面标题。 -->
<script>
//JavaScript代码区域
layui.use('element', function(){
var element = layui.element;
element.init();
// 使用Layui框架的模块加载机制加载“element”模块获取该模块的实例并赋值给变量“element”然后调用“init”方法进行初始化操作。“element”模块在Layui框架中通常用于页面元素的操作、动态渲染以及交互效果实现等通过初始化该模块可以准备好相关的DOM操作环境、绑定必要的事件等确保模块能正常工作进而实现页面中基于该模块的各种功能例如展开收起导航菜单、切换菜单项的选中状态等操作使得页面元素具备相应的交互功能。
});
</script>
<style>
.layui-card.layui-card-body.layui-icon {
display: inline-block;
width: 100%;
height: 60px;
line-height: 60px;
text-align: center;
border-radius: 2px;
font-size: 30px;
background-color: #F8F8F8;
color: #333;
transition: all.3s;
-webkit-transition: all.3s;
/* 以下是对类选择器组合“layui-card.layui-card-body.layui-icon”所匹配元素的样式设置
- “display: inline-block;”:将元素设置为行内块级元素,使其既能像行内元素一样在一行内排列,又能像块级元素一样设置宽度、高度等属性,方便布局和样式控制。
- “width: 100%;”:设置元素宽度占满其所在容器的宽度,确保在相应布局中能充分利用空间。
- “height: 60px;”和“line-height: 60px;”分别设置元素的高度以及行高为60像素使元素内的文本在垂直方向上居中显示达到美观的排版效果。
- “text-align: center;”:让元素内的文本内容在水平方向上居中显示,进一步优化排版布局。
- “border-radius: 2px;”给元素设置2像素的圆角效果使元素外观更加圆润增加视觉美感。
- “font-size: 30px;”设置元素内文本的字体大小为30像素调整文本显示的大小使其更醒目易读。
- “background-color: #F8F8F8;”:指定元素的背景颜色为浅灰色(#F8F8F8为元素提供一个特定的背景色调便于视觉区分和整体页面风格统一。
- “color: #333;”:设置元素内文本的颜色为深灰色(#333确保文本颜色与背景色搭配协调提高可读性。
- “transition: all.3s;”和“-webkit-transition: all.3s;”定义元素在进行样式变化时的过渡效果这里表示所有样式属性的变化都将在0.3秒内平滑过渡,用于实现一些动态交互时的视觉效果优化(如鼠标悬停等操作时元素样式改变的过渡效果),“-webkit-transition”是为了兼容webkit内核的浏览器如Chrome、Safari等。 */
}
.layui-card.layui-card-body {
text-align: center;
/* 对类选择器组合“layui-card.layui-card-body”所匹配元素的样式设置将元素内的文本内容在水平方向上设置为居中对齐使得在该类元素内部包含的内容整体呈现居中布局效果常用于对卡片主体内容进行排版布局保证页面整体风格统一和美观。 */
}
#notify {
text-align: left;
/* 通过ID选择器“#notify”对特定元素设置样式将匹配元素内的文本内容在水平方向上设置为左对齐这里可能是针对特定的通知内容区域进行的样式调整使其文本按照常规的阅读习惯从左到右排列方便用户查看相关信息。 */
}
</style>
</head>
<body class="layui-layout-body" style="background-color: #F2F2F2">
<!-- 为页面主体设置样式类为“layui-layout-body”同时通过内联样式设定背景颜色为“#F2F2F2”按照Layui框架的样式规范定义主体部分外观风格营造出一种浅灰色#F2F2F2的视觉背景符合项目统一的页面设计要求便于后续布局页面内容并且使页面整体视觉效果保持一致。 -->
<%--<jsp:include page="/filterLogin.jsp"></jsp:include>--%>
<!-- 此处原本是通过JSP的“include”指令包含名为“filterLogin.jsp”的页面一般这个页面用于处理用户登录验证逻辑判断用户是否已登录未登录时引导用户跳转到登录页面不过这里被注释掉了可能暂时不需要该登录验证功能或者后续会根据实际情况再启用它。 -->
<jsp:include page="/WEB-INF/teacher/tHeader.jsp"></jsp:include>
<!-- 通过JSP的“include”指令包含名为“WEB-INF/teacher/tHeader.jsp”的页面通常该页面用于定义教师端页面的头部区域包含如页面标题、导航栏、用户信息展示等元素构建出页面头部的布局结构使页面头部呈现规范的样式和功能。 -->
<jsp:include page="/WEB-INF/teacher/teacherNav.jsp"></jsp:include>
<!-- 包含名为“WEB-INF/teacher/teacherNav.jsp”的页面大概率用于展示教师端的导航菜单方便教师在不同功能模块如课程管理、学生管理、个人信息管理等间切换操作实现页面功能的导航跳转提高操作便利性。 -->
<div class="layui-layout layui-layout-admin">
<!-- 创建采用Layui框架的布局容器使用“layui-layout”和“layui-layout-admin”样式类按Layui框架提供的布局模式规划页面布局常用于后台管理系统有着清晰规范的分区结构便于组织不同功能内容比如划分出侧边栏、主体内容区、页脚等区域使页面布局更加合理有序符合后台管理系统的使用习惯和功能展示需求。 -->
<div class="layui-body">
<!-- 在Layui布局容器内定义页面主体内容区域该区域依Layui框架布局规则自适应显示用于承载具体业务相关内容像下面展示的功能列表、学校公告等信息是用户在访问页面时重点关注和进行操作的核心区域。 -->
<!-- 内容主体区域 -->
<div style="padding: 15px;">
<!-- 创建带有内边距上下左右均为15px的div容器通过设置内边距让内部内容在页面中有空白间隔使布局更美观易读便于对内部元素排版布局避免内容显得拥挤提升用户查看和操作页面内容时的体验感。 -->
<div class="layui-card">
<!-- 创建一个使用Layui框架样式的卡片元素通常用于对相关内容进行分组展示使其在页面上有一个清晰的视觉边界方便用户区分不同的功能模块或者信息板块符合Layui框架的页面布局和展示风格。 -->
<div class="layui-card-header" id="index-function">功能</div>
<!-- 创建卡片的头部区域元素设置ID为“index-function”文本内容显示为“功能”用于给卡片添加一个标题提示下面卡片主体内容所涉及的大致范畴让用户一目了然知道该部分的主要作用。 -->
<div class="layui-card-body">
<!-- 创建卡片的主体内容区域元素,用于放置具体的功能相关内容,在这里会展示一系列功能链接等元素,是卡片中实际展示核心信息的部分。 -->
<ul class="layui-row layui-col-space10 layui-this">
<!-- 创建一个使用Layui框架样式的无序列表应用“layui-row”样式类使其具备行布局的特点“layui-col-space10”样式类用于设置列表项之间的水平间距为10像素“layui-this”样式类可能是用于标记当前选中或特殊样式的状态具体取决于Layui框架的样式定义整体用于放置多个功能相关的列表项元素方便以列表形式展示各项功能入口并且实现一定的布局和样式效果。 -->
<li class="layui-col-xs3">
<!-- 创建列表项元素应用“layui-col-xs3”样式类意味着该元素在小屏幕设备如手机等上会占据3列的宽度基于Layui框架的栅格系统布局规则方便实现响应式布局根据不同设备屏幕大小合理分配空间展示功能链接等内容。 -->
<a lay-href="/mavenTemplate/student/query">
<!-- 创建一个链接元素使用了Layui框架自定义的“lay-href”属性可能是用于实现特定的链接跳转逻辑或者与Layui框架的交互功能相关链接地址指向“/mavenTemplate/student/query”点击可跳转到对应的学生信息查询功能页面用于引导用户进入相关功能操作界面。 -->
<i class="layui-icon layui-icon-survey"></i>
<!-- 创建一个图标元素应用“layui-icon”样式类以及具体的图标样式“layui-icon-survey”用于展示特定的图标这里可能是表示查询相关的图标增强功能链接的可视化效果让用户更直观地识别功能。 -->
<cite>学生信息查询</cite>
<!-- 创建一个引用cite元素用于显示具体的功能名称文本“学生信息查询”明确告知用户该链接对应的功能是什么方便用户进行操作选择。 -->
</a>
</li>
<li class="layui-col-xs3">
<a lay-href="/mavenTemplate/teacher/query">
<i class="layui-icon layui-icon-survey"></i>
<cite>教师信息查询</cite>
</a>
<!-- 与上述“学生信息查询”功能项类似,创建教师信息查询的功能链接元素,包含对应的图标展示和功能名称文本显示,链接地址指向“/mavenTemplate/teacher/query”点击可进入教师信息查询相关页面方便教师查询教师相关信息。 -->
</li>
<li class="layui-col-xs3">
<a lay-href="/mavenTemplate/class/query">
<i class="layui-icon layui-icon-survey"></i>
<cite>班级信息查询</cite>
</a>
<!-- 同样的结构,创建班级信息查询的功能链接元素,展示对应图标,显示功能名称“班级信息查询”,链接指向“/mavenTemplate/class/query”用于引导用户进入班级信息查询功能页面获取班级相关信息。 -->
</li>
<li class="layui-col-xs3">
<a lay-href="/mavenTemplate/major/query">
<i class="layui-icon layui-icon-survey"></i>
<cite>专业&amp;学院信息查询</cite>
</a>
<!-- 创建专业和学院信息查询的功能链接元素,展示图标并显示功能名称“专业&amp;学院信息查询”(这里“&amp;”是HTML中表示“&”符号的实体编码,用于正确显示“专业&学院信息查询”这样的文本内容),链接地址指向“/mavenTemplate/major/query”方便用户查询专业和学院相关信息。 -->
</li>
<li class="layui-col-xs3">
<a lay-href="/mavenTemplate/user/info">
<i class="layui-icon layui-icon-user"></i>
<cite>个人资料</cite>
</a>
<!-- 创建个人资料查看或编辑相关的功能链接元素图标样式为“layui-icon-user”表示用户相关图标显示功能名称“个人资料”链接指向“/mavenTemplate/user/info”点击可进入个人资料管理相关页面方便用户查看和修改自己的个人信息。 -->
</li>
<li class="layui-col-xs3">
<a lay-href="/mavenTemplate/user/password">
<i class="layui-icon layui-icon-set"></i>
<cite>修改密码</cite>
</a>
<!-- 创建用于修改密码的功能链接元素图标样式为“layui-icon-set”可能表示设置相关图标显示功能名称“修改密码”链接指向“/mavenTemplate/user/password”点击可进入密码修改功能页面方便用户更新自己的登录密码保障账号安全。 -->
</li>
<li class="layui-col-xs3">
<a lay-href="/mavenTemplate/user/email">
<i class="layui-icon layui-icon-set"></i>
<cite>修改邮箱</cite>
</a>
<!-- 创建修改邮箱的功能链接元素同样使用“layui-icon-set”图标样式显示功能名称“修改邮箱”链接指向“/mavenTemplate/user/email”点击可进入邮箱修改功能页面便于用户更新自己关联账号的邮箱地址等信息。 -->
</li>
<li class="layui-col-xs3">
<a lay-href="/mavenTemplate/student/modify">
<i class="layui-icon layui-icon-survey"></i>
<cite>学生信息修改</cite>
</a>
<!-- 创建学生信息修改的功能链接元素图标为“layui-icon-survey”显示功能名称“学生信息修改”链接指向“/mavenTemplate/student/modify”点击可进入对学生信息进行修改的功能页面方便教师等有权限用户对学生相关信息进行编辑更新操作。 -->
</li>
</ul>
</div>
</div>
<div class="layui-card">
<!-- 再次创建一个Layui框架样式的卡片元素用于展示另一个功能模块或者信息板块的内容这里用于展示学校最新公告相关信息通过卡片形式使其与其他内容区分开来保持页面布局的清晰性和可读性。 -->
<div class="layui-card-header">学校最新公告</div>
<!-- 创建卡片的头部区域元素,文本内容显示为“学校最新公告”,用于给该卡片添加标题,明确提示下面卡片主体内容是关于学校最新发布的公告信息,方便用户快速知晓该部分的主题。 -->
<c:forEach items="${notifys}" var="notify">
<!-- 使用JSTLJavaServer Pages Standard Tag Library的“forEach”标签来进行循环遍历操作“items”属性指定了要遍历的集合对象在这里就是名为“notifys”的集合这个集合通常是在服务器端比如对应的Servlet中通过查询数据库或者其他数据存储方式获取到的学校公告相关数据然后将这些数据封装成集合的形式再设置并传递到当前的JSP页面中来的“var”属性定义了一个变量名“notify”在每次循环的过程中会从“notifys”集合里依次取出每一个元素并将当前取出的元素赋值给这个变量方便在循环体内部使用该变量来获取元素中的具体数据内容例如公告的详细信息、发布日期等。 -->
<div class="layui-card-body" id="notify">${notify.notifyInfo}<p>${notify.notifyDate}</div>
<!-- 在循环体内部创建卡片的主体内容区域元素应用ID为“notify”与前面定义的样式选择器匹配可能用于特定的样式应用通过EL表达式输出从集合元素赋值给“notify”变量中获取的公告详细信息“${notify.notifyInfo}”)以及公告发布日期(“${notify.notifyDate}”不过这里的HTML结构不太规范应该将“<p>”标签正确闭合,如“<div class="layui-card-body" id="notify">${notify.notifyInfo}</div><p>${notify.notifyDate}</p>”这样才能正确展示公告信息和日期且符合HTML语法规范方便用户查看学校发布的每条公告的具体内容和发布时间。 -->
</c:forEach>
</div>
</div>
</div>
</div>