欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

简单作业管理系统设计

程序员文章站 2024-01-27 14:00:46
...

作业管理系统

源码:github

系统设计

使用人员:
老师 (添加学生,布置作业,检查作业)
学生 (提交相对应作业)

流程图
简单作业管理系统设计
完整详细的结构功能可参考代码注释

功能分布

mysql相关函数

函数 作用
addStudentHomework() 提交作业到数据库
addStudent() 添加学生到数据库
addHomework() 添加作业到数据库
selectAllhw() 从数据库找出已布置的所有作业
selectStudentHomeworkbyid() 从数据库找出某作业已提交的所有答案
selectHomeworkbyid() 从数据库找出某作业
selectAllstudent() 从数据库找出所有学生

界面设计

  1. 主界面:

用户选择四个主要功能的使用,使用超链接进行对其它jsp或servlet的连接
简单作业管理系统设计

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
  <title>欢迎使用本系统!</title>
</head>
<body>

<div align="center">
    <h2>请选择你要进行的操作:</h2>
    <ul>
        <a href="function/Add_student.jsp">添加学生</a>
        <a href="function/Add_homework.jsp">布置作业</a>
        <a href="${pageContext.request.contextPath}/Add_student_homework">提交作业</a>
        <a href="${pageContext.request.contextPath}/show_homework">查询情况</a>
</ul>
</div>

</body>
</html>

本摘要只粘贴部分代码,完整源码和代码结构存储于github

  1. 添加学生
    输入学生的学号和姓名即,点击提交即可成功添加学生。若想检查已添加的学生可点击下方超链接进行查看简单作业管理系统设计
    Add_student.jsp
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>添加学生</title>
</head>
<body>
<div align="center">
    <h2>新学生信息</h2>
    <form action="${pageContext.request.contextPath}/Add_student" method="post">
            请输入学号:<input type="number" name="sid" maxlength="20" style="font-family: arial" required><br/>
            请输入姓名:<input type="text" name="sname" maxlength="20" style="font-family: arial" required><br/>


             <input type="reset" value="清空">
             <input type="submit" value="提交"><br/>

    </form>
    <a align="center" href="show_student.jsp">查看已添加学生</a>
</div>
</body>
</html>

简单作业管理系统设计
show_student.jsp

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>添加学生</title>
</head>
<body>
<div align="center">
    <h2>新学生信息</h2>
    <form action="${pageContext.request.contextPath}/Add_student" method="post">
            请输入学号:<input type="number" name="sid" maxlength="20" style="font-family: arial" required><br/>
            请输入姓名:<input type="text" name="sname" maxlength="20" style="font-family: arial" required><br/>


             <input type="reset" value="清空">
             <input type="submit" value="提交"><br/>

    </form>
    <a align="center" href="show_student.jsp">查看已添加学生</a>
</div>
</body>
</html>

若添加成功可跳出确认界面,用户可选择返回首页或查看学生名单简单作业管理系统设计
3. 布置作业
用户可以从首页进入,选择布置新的作业
简单作业管理系统设计
需输入的信息有作业id作业题目作业内容。作业内容有140字的限制,输入完成后可进行提交。提交成功有提示图和超链接,点击可返回首页
Add_homework.jsp

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>布置作业</title>
</head>
<body>
<div align="center">
<h2>输入新作业相关信息</h2>
    <form action="${pageContext.request.contextPath}/Add_homework" method="post">
        请输入作业id:<input type="number" name="hid" maxlength="20" required><br/>
        请输入作业题目:<input type="text" name="title" maxlength="20" required><br/>

        请输入作业内容:<textarea cols="13" rows="10" name="content" onpropertychange="if(this.scrollHeight>10) this.style.posHeight=this.scrollHeight+5"
                      required>输入内容不得超过140个字</textarea><br/>

        <input type="reset" value="清空">
        <input type="submit" value="提交"><br/>
    </form>
</div>
</body>
</html>

简单作业管理系统设计
4. 提交作业
用户从主界面选择提交作业时,首先会选出当前所有已布置的作业:
简单作业管理系统设计
用户找到自己想要提交的作业后便可点击最右提交按钮,进行作业的作答和提交。
Add_student_homework_1.jsp

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>提交作业列表</title>
    <%--    将指定的作业id传给/submit,以便提交作业--%>

    <script>
        function jump(id) {
            let homework = document.getElementById('homeworkId')
            homework.setAttribute("value",id)
            let sub = document.getElementById('sub')
            sub.submit()
        }
    </script>
</head>
<body>
<div align="center">
<h2>已布置作业</h2>

<form id="sub" method="get" action="${pageContext.request.contextPath}/submit_homework">

    <input id="homeworkId" name="id" type="hidden">

    <table align="center" width="960" border="1" cellpadding="1" cellspacing="1">
        <tr align="center" bgcolor="#7fffd4" height="50">
            <th>作业编号</th>
            <th>作业题目</th>
            <th>作业内容</th>
            <th>提交作业</th>
        </tr>

        <%
            List<Homework> list = (List<Homework>)request.getAttribute("list");
            if (list == null || list.size() <= 0){
//                out.print("None data");
            }else {
                for (Homework homework : list) {
        %>
        <tr>
            <td width="5%"><%=homework.getId()%></td>
            <td width="20%" style="word-break: break-all;word-wrap: break-word"><%=homework.getTitle()%></td>
            <td width="65%" style="word-break: break-all;word-wrap: break-word"><%=homework.getContent()%></td>
            <td width="10%"><input type="button" value="提交作业" onclick="jump(<%=homework.getId()%>)"> </td>
        </tr>

        <%
                }
            }
        %>

    </table>
</form>
</div>
</body>
</html>

简单作业管理系统设计
需要输入的内容有学生id学生姓名作答内容。作答完成后点击提交即可,若有错误可选择左下角按钮一键清空。提交成功会出现成功提示和返回首页超链接。

Add_student_homework_1.jsp

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>提交作业(学生)</title>
</head>
<body>
<div align="center">
    <h2>提交作业</h2>
    <form method="post" action="${pageContext.request.contextPath}/submit_homework">
        <table align="center"  border="1" width="960" cellpadding="1" cellspacing="1">
            <%
                Homework homework = (Homework) request.getAttribute("homework");

            %>
            <tr>
                <th width="10%" bgcolor="#7fffd4">作业题目:</th>
                <td width="90%"><%=homework.getTitle()%></td>
            </tr>
            <tr>
                <th width="10%" bgcolor="#7fffd4">作业内容:</th>
                <td width="90%"><%=homework.getContent()%></td>
            </tr>
            <tr>
                <th width="10%" bgcolor="#7fffd4">学号:</th>
                <td width="90%"><input type="number" name="studentId"
                                       maxlength="20" style="font-family: Arial;  width: 100%" required>
                </td>
            </tr>
            <input type="hidden" name="title" value="<%=homework.getTitle()%>">
            <input type="hidden" name="homeworkId" value="<%=homework.getId()%>">
            <input type="hidden" name="content" value="<%=homework.getContent()%>">
            <tr>
                <th width="10%" bgcolor="#7fffd4">答案内容</th>
                <td width="90%"><textarea rows="10" name="student_answer"  style="width: 100%" onpropertychange="if(this.scrollHeight>10) this.style.posHeight=this.scrollHeight+5"
                                          required></textarea></td>
            </tr>
            <tr style="border: none">
                <td align="center"><input type="reset" value="清空"></td>
                <td align="center"><input type="submit" value="提交"></td>
            </tr>
        </table>


    </form>
</div>
</body>
</html>

简单作业管理系统设计

  1. 查看详情
    用户还可查看所有作业的提交情况,同样是从首页进入,点击最后一个查询情况超链接。首先我们可以查看目前所有的已布置作业。
    简单作业管理系统设计
    check_homework.jsp
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>已布置作业</title>

    <script>
        function jump(id) {
            let homework = document.getElementById('homeworkId')
            homework.setAttribute("value",id)
            let choose = document.getElementById('choose')
            choose.submit()
        }
    </script>

</head>
<body>
<div align="center">
<h2>已布置作业</h2>

<form id="choose" method="get" action="${pageContext.request.contextPath}/submitted_homework">

    <input id="homeworkId" name="id" type="hidden">

    <table align="center" width="960" border="1"
           cellpadding="1" cellspacing="1">

        <tr align="center" bgcolor="#7fffd4" height="50">
            <th width="5%">作业编号</th>
            <th width="20%">作业题目</th>
            <th width="65">作业内容</th>
            <th width="10%">已提交作业</th>
        </tr>

        <%
            List<Homework> list = (List<Homework>)request.getAttribute("homework");
            if (list == null || list.size() <= 0){
               out.print("None data");
            }else {
                for (Homework homework : list) {
        %>
        <tr align="center" bgcolor="white" height="30">
            <td><%=homework.getId()%></td>
            <td><%=homework.getTitle()%></td>
            <td><%=homework.getContent()%></td>
            <td><input type="button" value="已提交作业" onclick="jump(<%=homework.getId()%>)"> </td>
        </tr>

        <%
                }
            }
        %>

    </table>
</form>
</div>
</body>
</html>

之后我们便可点击已提交作业按钮进行查询,显示的结果为对应作业的所有已提交答案

check_situation.jsp

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>作业情况</title>
</head>
<body>
<div align="center">
<h2>该题目已提交作业</h2>

<table align="center" width="960" border="1"
       cellpadding="1" cellspacing="1">
    <tr align="center" bgcolor="#7fffd4" height="50">

        <td>学生学号</td>
        <td>作业编号</td>
        <td>作业题目</td>
        <td>作业内容</td>
        <td>学生答案</td>
        <td>创建时间</td>
    </tr>
    <%
        List<StudentHomework> list = (List<StudentHomework>)request.getAttribute("list");
        if(null == list || list.size() <= 0){
            out.print("None data.");
        }else {
            for (StudentHomework sh : list){
    %>
    <tr align="center" bgcolor="white" height="30">

        <td><%=sh.getStudentId()%></td>
        <td><%=sh.getHomeworkId()%></td>
        <td><%=sh.getHomeworkTitle()%></td>
        <td><%=sh.getHomeworkContent()%></td>
        <td><%=sh.getStudentAnswer()%></td>
        <td><%=sh.getCreateTime()%></td>
    </tr>
    <%
            }
        }
    %>
</table>
</div>
</body>
</html>

简单作业管理系统设计

感想

在之前并没有使用过jsp和Servlet,tomcat虽然使用过但已经忘记了不少,这一次虽然做的只是很简单也很粗陋的一个小系统,还是学到了不少新东西,感慨学海无涯,人生一定要一直钻研才有着无限的乐趣啊。