11.14

标签：username console border 11.14 let document data

本次我们连着上次的代码继续实现，剩下最后一个教学副院长类

后端

PresidentController

package com.example.controller;

import com.example.pojo.Result;
import com.example.service.PresidentService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.*;

@RestController
@RequestMapping("/president")
public class PresidentController {
    @Autowired
    private PresidentService presidentService;

    @GetMapping("/getCollege/{username}")
    public Result getCollege(@PathVariable("username") String username) {
        return Result.success(presidentService.getCollege(username));
    }

    @GetMapping("/getTest/{pro}")
    public Result getTest(@PathVariable("pro") String pro) {
        return Result.success(presidentService.getTest(pro));
    }

    @PostMapping("/pass/{cardID}/{professional}/{f}/{audi}")
    public Result pass(@PathVariable("cardID") String cardID, @PathVariable("professional") String professional, @PathVariable("f") String f, @PathVariable("audi") int audi) {
        presidentService.pass(cardID, professional, f, audi);
        return Result.success(presidentService.getById(cardID));
    }
}

PresidentService

package com.example.service;


import com.example.mapper.PresidentMapper;
import com.example.pojo.Result;
import com.example.pojo.Teacher;
import com.example.pojo.Test;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;

import java.util.List;

@Service
public class PresidentService {
    @Autowired
    private PresidentMapper presidentMapper;

    public Teacher getCollege(String username) {
        return presidentMapper.getCollege(username);
    }

    public List<Test> getTest(String pro) {
        return presidentMapper.getTest(pro);
    }

    public void pass(String cardID, String professional, String f, int audi) {
        presidentMapper.pass(cardID, professional, f, audi);
    }

    public Test getById(String cardID) {
        return presidentMapper.getById(cardID);
    }
}

PresidentMapper

package com.example.mapper;

import com.example.pojo.Teacher;
import com.example.pojo.Test;
import org.apache.ibatis.annotations.Mapper;
import org.apache.ibatis.annotations.Select;
import org.apache.ibatis.annotations.Update;

import java.util.List;

@Mapper
public interface PresidentMapper {
    @Select("select * from test.testteacher where TeacherID=#{username}")
    Teacher getCollege(String username);

    @Select("select * from test.test1 where CourseCollege=#{pro}")
    List<Test> getTest(String pro);

    @Update("update  test.test1 set Reasonable=#{professional},ReasonableConclusion=#{f},AuditStatus=#{audi} where CardId=#{cardID}")
    void pass(String cardID, String professional, String f, int audi);

    @Select("select * from test.test1 where CardId=#{cardID}")
    Test getById(String cardID);
}

前端

1selectAll,html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>浏览审批卡</title>
    <style>
        .reSet {
            background-color: #4CAF50;
            color: white;
            border: none;
            padding: 10px 20px;
            text-align: center;
            text-decoration: none;
            display: inline-block;
            font-size: 16px;
            margin: 4px 2px;
            cursor: pointer;
        }

        .form table tr td {
            width: 100px;
            height: 30px;
            border: 1px solid #000;
            text-align: center;
        }

        button {
            display: block;
            margin-top: 10px;
            padding: 10px;
            background-color: #007bff;
            color: #fff;
            border: none;
            border-radius: 3px;
            cursor: pointer;
        }
    </style>
</head>
<body>
<h1 style="text-align: center">浏览审批卡信息</h1>
<div class="centered-form">
    <div class="bordered-form">
        <div class="form">
            <div id="container">

            </div>
        </div>
    </div>
</div>
</body>
<script>
    var urlParams = new URLSearchParams(window.location.search);
    var username = urlParams.get('username');
    console.log("用户名为:" + username);
    const requestUrl = `http://localhost:8080/president/getCollege/${username}`;
    fetch(requestUrl,
        {
            method: 'GET',
            headers: {
                'Content-Type': 'application/json'
            },
        })
        .then(response => response.json())
        .then(data => {
            if (data.msg === 'success') {
                console.log(data.data.college);
                getAll(data.data.college);
            } else {
                alert("找不到所对应的学院");
            }
        })
        .catch(error => {
            alert("请求失败，请重试");
            console.error(error);
        });
</script>
<script>
    function getAll(pro) {
        console.log("pro  " + pro);
        const requestUrl = `http://localhost:8080/president/getTest/${pro}`;
        fetch(requestUrl,
            {
                method: 'GET',
                headers: {
                    'Content-Type': 'application/json'
                },
            })
            .then(response => response.json())
            .then(data => {
                if (data.msg === 'success') {
                    console.log("555");
                    generateTable(data.data);
                } else {
                    alert("当前不存在结果");
                }
            })
            .catch(error => {
                alert("请求失败2，请重试");
                console.error(error);
            });
    }
</script>
<script>
    function generateTable(data) {
        const tableContainer = document.getElementById("container");
        // 清空 tableContainer 中的所有子节点
        while (tableContainer.hasChildNodes()) {
            tableContainer.removeChild(tableContainer.firstChild);
        }
        const table = document.createElement("table");
        const tableBody = document.createElement("tbody");
        let row = document.createElement("tr");
        row.innerHTML = '<td>试卷审批卡编号</td><td>申请日期</td><td>课程名称</td><td>任课教师</td><td>课程编号</td><td>课程性质</td><td>学分</td><td>授课班级</td><td>授课专业</td><td>考试方式</td><td>考试日期</td><td>考试人数</td><td>出题方式</td><td>成绩组成</td><td>考核与评价方式</td><td>考核内容合理性分析</td><td>专业审查意见</td><td>专业审查结论</td><td>合理性审查意见</td><td>合理性审查结果</td><td>审核状态</td>';
        tableBody.appendChild(row);
        // 查询方式是按姓名查询或多条查询
        for (let i = 0; i < data.length; i++) {
            let s;
            if (data[i].auditStatus === 0) {
                s = "待审核";
            } else if (data[i].auditStatus === -1) {
                s = "未通过";
            } else if (data[i].auditStatus === 1) {
                s = "已符合";
            } else if (data[i].auditStatus === 2) {
                s = "已通过";
            }
            row = document.createElement("tr");
            let p1 = data[i].professional;
            let p2 = data[i].professionalConclusion;
            if (data[i].professional === null) {
                p1 = "未进行";
                p2 = "未进行";
            }
            let r1 = data[i].reasonable;
            let r2 = data[i].reasonableConclusion;
            if (data[i].reasonable === undefined || data[i].reasonable === null) {
                r1 = "未进行";
                r2 = "未进行";
            }
            console.log("9 " + data[i].auditStatus);
            console.log(s);
            row.innerHTML = `<td>${data[i].cardId}</td><td>${data[i].cardDate}</td><td>${data[i].courseName}</td><td>${data[i].courseTeacher}</td><td>${data[i].courseID}</td><td>${data[i].courseNature}</td><td>${data[i].credit}</td><td>${data[i].courseClass}</td><td>${data[i].courseMajor}</td><td>${data[i].testWay}</td><td>${data[i].testDate}</td><td>${data[i].testCount}</td><td>${data[i].testMethod}</td><td>${data[i].testGrade}</td><td>${data[i].testEvaluation}</td><td>${data[i].testAnalysis}</td><td>${p1}</td><td>${p2}</td><td>${r1}</td><td>${r2}</td><td>${s}</td>`;
            tableBody.appendChild(row);
            table.appendChild(tableBody);
            tableContainer.appendChild(table);
        }
    }
</script>
</html>

3Pass.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>合理性审查</title>
    <style>
        .reSet {
            background-color: #4CAF50;
            color: white;
            border: none;
            padding: 10px 20px;
            text-align: center;
            text-decoration: none;
            display: inline-block;
            font-size: 16px;
            margin: 4px 2px;
            cursor: pointer;
        }

        .form {
            width: 600px;
            margin: 0 auto;
            /*border: 1px solid red;*/
        }

        .form table {
            margin: 0 auto;
        }

        .form table tr td {
            width: 100px;
            height: 30px;
            border: 1px solid #000;
            text-align: center;
        }

        button {
            display: block;
            margin-top: 10px;
            padding: 10px;
            background-color: #007bff;
            color: #fff;
            border: none;
            border-radius: 3px;
            cursor: pointer;
        }

        .centered-form {
            text-align: center;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            height: 100vh;
        }

        .bordered-form {
            border: 2px solid #000; /* 边框样式 */
            padding: 150px; /* 可选的内边距 */
            background-color: #f0f0f0; /* 可选的背景颜色 */
        }
    </style>
</head>
<body>
<h1 style="text-align: center">专业性审查</h1>
<!--边框居中-->
<div class="centered-form">
    <!--    增加边框-->
    <div class="bordered-form">
        <!--        调整边框大小-->
        <div class="form">
            <form id="pass">
                <label for="cardID">请输入要审查的id号</label>
                <input type="text" id="cardID" name="cardID" required>
                <br>
                <label>学院意见</label>
                <br>
                <label for="class1">考核内容与各课程目标要求掌握的内容的覆盖度：</label>
                <div id="class1">
                    <label><input type="radio" name="class1" value="全覆盖">全覆盖</label>
                    <label><input type="radio" name="class1" value="部分">部分</label>
                    <label><input type="radio" name="class1" value="基本覆盖">基本覆盖</label>
                    <label><input type="radio" name="class1" value="有待提高">有待提高</label>
                </div>
                <label for="purpose">考核方式课程目标要求达到的能力的有效性：</label>
                <div id="purpose">
                    <label><input type="radio" name="purpose" value="非常有效">非常有效</label>
                    <label><input type="radio" name="purpose" value="有效">有效</label>
                    <label><input type="radio" name="purpose" value="基本有效">基本有效</label>
                    <label><input type="radio" name="purpose" value="有待提高">有待提高</label>
                </div>
                <label for="final">试卷合理性审查最终意见:</label>
                <div id="final">
                    <label><input type="radio" name="final" value="通过">通过</label>
                    <label><input type="radio" name="final" value="不通过">不通过</label>
                </div>
                <br>
                <button type="submit" style="display: block; margin: 0 auto;">审批</button>
            </form>
        </div>
    </div>
</div>
</body>
<script>
    document.getElementById('pass').addEventListener('submit', function (event) {
        event.preventDefault();
        const cardID = document.getElementById('cardID').value;
        const class1 = document.querySelectorAll('input[name="class1"]');
        let c;
        class1.forEach(radio => {
            if (radio.checked) {
                c = radio.value;
                console.log(c);
            }
        });
        const purpose = document.querySelectorAll('input[name="purpose"]');
        let p;
        purpose.forEach(radio => {
            if (radio.checked) {
                p = radio.value;
                console.log(p);
            }
        });
        const professional = c + "," + p;
        console.log(professional);
        const final = document.querySelectorAll('input[name="final"]');
        let f;
        final.forEach(radio => {
            if (radio.checked) {
                f = radio.value;
                console.log(f);
            }
        });
        let audi;
        if (f === "通过") {
            audi = 2;

        } else {
            audi = -1;
        }
        const requestUrl = `http://localhost:8080/president/pass/${cardID}/${professional}/${f}/${audi}`;
        fetch(requestUrl,
            {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json'
                },
            })
            .then(res => res.json())
            .then(data => {
                if (data.msg === 'success') {
                    alert("已完成信息的审查");
                    console.log(data);
                } else {
                    alert("审查失败 " + data.msg);
                }
            })
            .catch(error => {
                alert("请求失败，请重试");
                console.error(error);
            });
    })
</script>
</html>

president.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>教学副院长页面</title>
    <style>
        .form {
            width: 600px;
            margin: 0 auto;
            /*border: 1px solid red;*/
        }

        .form table {
            margin: 0 auto;
        }

        .form table tr td {
            width: 100px;
            height: 30px;
            border: 1px solid #000;
            text-align: center;
        }

        button {
            display: block;
            margin-top: 10px;
            padding: 10px;
            background-color: #007bff;
            color: #fff;
            border: none;
            border-radius: 3px;
            cursor: pointer;
        }
    </style>
</head>
<body>
<h1 style="text-align: center">教学副院长信息管理</h1>
<div class="form">
    <table border="1px" cellspacing="0" width="600px">
        <tr>
            <th>编号</th>
            <th>功能</th>
        </tr>
        <tr>
            <td>1</td>
            <td>
                <button id="selectAll">浏览审批卡</button>
            </td>
        </tr>
        <tr>
            <td>2</td>
            <td>
                <button id="selectTest">查询考试信息</button>
            </td>
        </tr>
        <tr>
            <td>3</td>
            <td>
                <button id="pass">试卷专业性审查</button>
            </td>
        </tr>
    </table>
</div>
</body>
<script>
    var urlParams = new URLSearchParams(window.location.search);
    var username = urlParams.get('username');
    console.log(username);
    document.getElementById("selectAll").addEventListener("click", function () {
        window.location.href = "1seleceAll.html?username=" + encodeURIComponent(username);
    });
    document.getElementById("selectTest").addEventListener("click", function () {
        window.location.href = "../STUDENT/student3.html";
    });
    document.getElementById('pass').addEventListener('click', function () {
        window.location.href = "3Pass.html?username=" + encodeURIComponent(username);
    });
</script>
</html>

test.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>查询考试信息</title>
    <style>
        .reSet {
            background-color: #4CAF50;
            color: white;
            border: none;
            padding: 10px 20px;
            text-align: center;
            text-decoration: none;
            display: inline-block;
            font-size: 16px;
            margin: 4px 2px;
            cursor: pointer;
        }

        .form table tr td {
            width: 100px;
            height: 30px;
            border: 1px solid #000;
            text-align: center;
        }

        button {
            display: block;
            margin-top: 10px;
            padding: 10px;
            background-color: #007bff;
            color: #fff;
            border: none;
            border-radius: 3px;
            cursor: pointer;
        }
    </style>
</head>
<body>
<div class="centered-form">
    <!--    增加边框-->
    <div class="bordered-form">
        <!--        调整边框大小-->
        <div class="form">
            <div id="container">

            </div>
        </div>
    </div>
</div>
</body>
<script>
    var urlParams = new URLSearchParams(window.location.search);
    var courseName = urlParams.has('courseName') ? decodeURI(urlParams.get('courseName')) : '';
    var courseClass = urlParams.has('courseClass') ? decodeURI(urlParams.get('courseClass')) : '';
    var courseMajor = urlParams.has('courseMajor') ? decodeURI(urlParams.get('courseMajor')) : '';

    console.log("用户名为:" + courseName);
    const requestUrl = `http://localhost:8080/user/selectTest/${courseName}/${courseClass}/${courseMajor}`;
    fetch(requestUrl,
        {
            method: 'GET',
            headers: {
                'Content-Type': 'application/json'
            },
        })
        .then(response => response.json())
        .then(data => {
            if (data.msg === 'success') {
                alert("查询成功");
                generateTable(data.data);
            } else {
                alert("查询失败");
            }
        })
        .catch(error => {
            alert("请求失败，请重试");
            console.error(error);
        });
</script>
<script>
    function generateTable(data) {
        const tableContainer = document.getElementById("container");
        // 清空 tableContainer 中的所有子节点
        while (tableContainer.hasChildNodes()) {
            tableContainer.removeChild(tableContainer.firstChild);
        }
        const table = document.createElement("table");
        const tableBody = document.createElement("tbody");
        let row = document.createElement("tr");
        row.innerHTML = '<td>试卷审批卡编号</td><td>申请日期</td><td>课程名称</td><td>任课教师</td><td>课程编号</td><td>课程性质</td><td>学分</td><td>授课班级</td><td>授课专业</td><td>授课学院</td><td>考试方式</td><td>考试日期</td><td>考试人数</td><td>出题方式</td><td>成绩组成</td><td>考核与评价方式</td><td>考核内容合理性分析</td><td>专业审查意见</td><td>专业审查结论</td><td>合理性审查意见</td><td>合理性审查结果</td><td>审核状态</td>';
        tableBody.appendChild(row);
        // 查询方式是按姓名查询或多条查询
        for (let i = 0; i < data.length; i++) {
            let s;
            console.log("222   " + data[i].auditStatus);
            if (data[i].auditStatus === 0) {
                s = "待审核";
            } else if (data[i].auditStatus === -1) {
                s = "未通过";
            } else if (data[i].auditStatus === 1) {
                s = "已符合";
            } else if (data[i].auditStatus === 2) {
                s = "已通过";
            }
            row = document.createElement("tr");
            let p1 = data[i].professional;
            let p2 = data[i].professionalConclusion;
            if (data[i].professional === null) {
                p1 = "未进行";
                p2 = "未进行";
            }
            let r1 = data[i].reasonable;
            let r2 = data[i].reasonableConclusion;
            if (data[i].reasonable === undefined) {
                r1 = "未进行";
                r2 = "未进行";
            }
            row.innerHTML = `<td>${data[i].cardId}</td><td>${data[i].cardDate}</td><td>${data[i].courseName}</td><td>${data[i].courseTeacher}</td><td>${data[i].courseID}</td><td>${data[i].courseNature}</td><td>${data[i].credit}</td><td>${data[i].courseClass}</td><td>${data[i].courseMajor}</td><td>${data[i].courseCollege}</td><td>${data[i].testWay}</td><td>${data[i].testDate}</td><td>${data[i].testCount}</td><td>${data[i].testMethod}</td><td>${data[i].testGrade}</td><td>${data[i].testEvaluation}</td><td>${data[i].testAnalysis}</td><td>${p1}</td><td>${p2}</td><td>${r1}</td><td>${r2}</td><td>${s}</td>`;
            tableBody.appendChild(row);
            table.appendChild(tableBody);
            tableContainer.appendChild(table);
        }
    }
</script>
</html>

标签：username,console,border,11.14,let,document,data
From： https://www.cnblogs.com/zzqq1314/p/17830199.html

相关文章

赞助商

阅读排行