11.10
今天实现的是专业负责人的前后端代码
HeadController
package com.example.controller; import com.example.pojo.Result; import com.example.service.HeadService; import org.springframework.beans.factory.annotation.Autowired; import org.springframework.web.bind.annotation.*; @RestController @RequestMapping("/head") public class HeadController { @Autowired private HeadService headService; @GetMapping("/getMajor/{username}") public Result getMajor(@PathVariable("username") String username) { return Result.success(headService.getMajor(username)); } @GetMapping("/getTest/{pro}") public Result getTest(@PathVariable("pro") String pro) { return Result.success(headService.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) { headService.pass(cardID, professional, f, audi); return Result.success(headService.getByID(cardID)); } }
HeadService
package com.example.service; import com.example.mapper.HeadMapper; 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 HeadService { @Autowired private HeadMapper headMapper; public Teacher getMajor(String username) { return headMapper.getMajor(username); } public List<Test> getTest(String pro) { return headMapper.getTest(pro); } public void pass(String cardID, String professional, String f, int audi) { headMapper.pass(cardID, professional, f, audi); } public Test getByID(String cardID) { return headMapper.getByID(cardID); } }
HeadMapper
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 HeadMapper { @Select("select * from testteacher where TeacherID = #{username}") Teacher getMajor(String username); @Select("select * from test1 where test1.CourseMajor =#{pro}") List<Test> getTest(String pro); @Update("update test1 set test1.Professional = #{professional},ProfessionalConclusion=#{f},AuditStatus=#{audi} where test1.CardId = #{cardID}") void pass(String cardID, String professional, String f, int audi); @Select("select * from test1 where test1.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/head/getMajor/${username}`;
fetch(requestUrl,
{
method: 'GET',
headers: {
'Content-Type': 'application/json'
},
})
.then(response => response.json())
.then(data => {
if (data.msg === 'success') {
console.log(data.data.professionals);
getAll(data.data.professionals);
} else {
alert("找不到所对应的专业");
}
})
.catch(error => {
alert("请求失败，请重试");
console.error(error);
});
</script>
<script>
function getAll(pro) {
console.log("pro " + pro);
const requestUrl = `http://localhost:8080/head/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><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 === 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].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>
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="purpose1">考核方式与课程目标达成情况的支持度：：</label>
<div id="purpose1">
<label><input type="radio" name="purpose1" value="非常符合">非常支持</label>
<label><input type="radio" name="purpose1" value="支持">支持</label>
<label><input type="radio" name="purpose1" value="基本支持">基本支持</label>
<label><input type="radio" name="purpose1" 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 purpose1 = document.querySelectorAll('input[name="purpose1"]');
let p1;
class1.forEach(radio => {
if (radio.checked) {
p1 = radio.value;
console.log(p1);
}
});
const professional = c + "," + p + "," + p1;
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 = 1;
} else {
audi = -1;
}
const requestUrl = `http://localhost:8080/head/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>
head.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 = "1selectAll.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>
