完成作业提交界面大致框架搭建、完成页面标题等部分接口和前端展示、引入作业倒计时显示。
This commit is contained in:
parent
50185cd723
commit
30809c3896
|
|
@ -32,4 +32,5 @@ export default {
|
|||
|
||||
getClassRanks:(config) => request.get('/problem/getClassRanks', config),//获取当前报告班级排名
|
||||
|
||||
getProblemInfo:(config) => request.get('/problem/getProblemInfo', config)//获取当前报告布置信息
|
||||
}
|
||||
|
|
|
|||
|
|
@ -39,13 +39,10 @@ const paginationReactive = reactive({
|
|||
})
|
||||
|
||||
const onStartExam = async (exam) => {//点击进入控件的逻辑
|
||||
const { id } = exam
|
||||
|
||||
try {
|
||||
// await api.addExamInfo({ id })
|
||||
const examId = exam.id
|
||||
router.push({ name: 'ReportSubmit', params: { examId } })
|
||||
|
||||
const classId = exam.classId
|
||||
router.push({ name: 'ReportSubmit', params: { examId,classId }, query: { fromclient: false } })
|
||||
} catch (err) {
|
||||
console.log(err)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,40 +1,42 @@
|
|||
<template>
|
||||
<p>Basic link button</p>
|
||||
<div class="mb-4">
|
||||
<el-button
|
||||
v-for="button in buttons"
|
||||
:key="button.text"
|
||||
:type="button.type"
|
||||
link
|
||||
>
|
||||
{{ button.text }}
|
||||
</el-button>
|
||||
<CommonPage show-footer :show-header="false">
|
||||
|
||||
<div class="page-content">
|
||||
<h2 class="title">
|
||||
实验名称:{{ title }}</h2>
|
||||
<h3 class="subtitle">
|
||||
当前作业剩余时间:{{ countdown }}
|
||||
</h3>
|
||||
</div>
|
||||
|
||||
<p>Disabled link button</p>
|
||||
<div>
|
||||
<el-button
|
||||
v-for="button in buttons"
|
||||
:key="button.text"
|
||||
:type="button.type"
|
||||
link
|
||||
disabled
|
||||
>
|
||||
{{ button.text }}
|
||||
</el-button>
|
||||
<div class="layout-container">
|
||||
<Leftparts class="leftparts" />
|
||||
<Rightparts class="rightparts" />
|
||||
|
||||
</div>
|
||||
<ReportActions class="bottom" />
|
||||
</CommonPage>
|
||||
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, reactive, onMounted } from 'vue'
|
||||
import api from '@/api/user';
|
||||
import {useRoute} from 'vue-router';
|
||||
import ReportActions from "@/views/user/report-submit/components/report-actions.vue";
|
||||
import Leftparts from "@/views/user/report-submit/components/leftparts.vue";
|
||||
import Rightparts from "@/views/user/report-submit/components/rightparts.vue";
|
||||
|
||||
const route = useRoute()
|
||||
const { examId } = route.params
|
||||
const examId = route.params.examId;
|
||||
const classId = route.params.classId;
|
||||
const loading = ref(true);
|
||||
const title = ref(""); // 从API获取的作业名称
|
||||
const examScores = ref([]);
|
||||
const examName = ref("");
|
||||
const notifyMsg = ref("");
|
||||
const countdown = ref(""); // 用于显示倒计时
|
||||
// 将结束时间转换为Date对象
|
||||
let endTime = null; // 结束时间初始化为null
|
||||
|
||||
const paginationReactive = reactive({
|
||||
page: 1,
|
||||
|
|
@ -60,11 +62,59 @@ const columns = [
|
|||
// ... 列配置
|
||||
];
|
||||
|
||||
// 查询成绩的函数
|
||||
|
||||
const queryExamScores = async () => {
|
||||
// ... 查询逻辑
|
||||
//查询作业名称信息(直接复用查询排名)
|
||||
try {
|
||||
//查询作业名称信息(直接复用查询排名)
|
||||
const res1 = await api.getStudentRank({ params: { examId } });
|
||||
//查询作业时间等信息
|
||||
const res = await api.getProblemInfo({ params: { classId, examId } });
|
||||
|
||||
title.value = res1.data.title; // 更新作业名称
|
||||
// 将结束时间转换为Date对象
|
||||
endTime = new Date(res.data.endTime[0], res.data.endTime[1] - 1, res.data.endTime[2], res.data.endTime[3], res.data.endTime[4]);
|
||||
} catch (error) {
|
||||
console.error("Failed to fetch exam scores or problem info:", error);
|
||||
}
|
||||
};
|
||||
|
||||
// 更新倒计时的函数
|
||||
const updateCountdown = () => {
|
||||
const now = new Date();
|
||||
const timeleft = endTime - now; // 计算剩余时间
|
||||
|
||||
if (timeleft >= 0) {
|
||||
// 将毫秒转换为天、时、分、秒
|
||||
const days = Math.floor(timeleft / (1000 * 60 * 60 * 24));
|
||||
const hours = Math.floor((timeleft % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
|
||||
const minutes = Math.floor((timeleft % (1000 * 60 * 60)) / (1000 * 60));
|
||||
const seconds = Math.floor((timeleft % (1000 * 60)) / 1000);
|
||||
|
||||
// 格式化倒计时字符串
|
||||
countdown.value = `${days}天${hours}小时 ${minutes}分钟${seconds}秒`;
|
||||
} else {
|
||||
countdown.value = "作业已结束";
|
||||
clearInterval(intervalId); // 清除定时器
|
||||
}
|
||||
};
|
||||
|
||||
// 使用setInterval来每秒更新倒计时
|
||||
let intervalId = null;
|
||||
onMounted(async () => {
|
||||
await queryExamScores(); // 确保在挂载时查询数据
|
||||
if (endTime) {
|
||||
updateCountdown(); // 初始更新
|
||||
intervalId = setInterval(updateCountdown, 1000); // 设置定时器
|
||||
}
|
||||
});
|
||||
|
||||
onUnmounted(() => {
|
||||
if (intervalId) {
|
||||
clearInterval(intervalId); // 组件卸载时清除定时器
|
||||
}
|
||||
});
|
||||
|
||||
// 行键函数
|
||||
const rowKey = (rowData) => {
|
||||
return rowData.id;
|
||||
|
|
@ -72,21 +122,50 @@ const rowKey = (rowData) => {
|
|||
|
||||
// 生命周期钩子
|
||||
onMounted(() => {
|
||||
console.log('Received examId:', examId); // 输出接收到的 examId
|
||||
// ... 挂载逻辑
|
||||
queryExamScores(); // 挂载时查询作业名
|
||||
});
|
||||
|
||||
|
||||
const buttons = [
|
||||
{ type: '', text: 'plain' },
|
||||
{ type: 'primary', text: 'primary' },
|
||||
{ type: 'success', text: 'success' },
|
||||
{ type: 'info', text: 'info' },
|
||||
{ type: 'warning', text: 'warning' },
|
||||
{ type: 'danger', text: 'danger' },
|
||||
]
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
/* 样式可以根据需要添加 */
|
||||
.page-content {
|
||||
width: 40%;
|
||||
margin-left: 0px;
|
||||
}
|
||||
|
||||
.title {
|
||||
padding-left: 0px;
|
||||
font-size: 22px;
|
||||
font-weight: normal;
|
||||
color: #333;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.subtitle {
|
||||
font-size: 14px;
|
||||
color: #363434;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.layout-container {
|
||||
display: flex; /* 使用 Flexbox 布局 */
|
||||
justify-content: space-between; /* 左右模块分布在容器两侧 */
|
||||
height: auto; /* 高度自适应内容 */
|
||||
}
|
||||
|
||||
.leftparts {
|
||||
flex: 0 0 70%;
|
||||
}
|
||||
|
||||
.rightparts {
|
||||
flex: 0 0 30%;
|
||||
}
|
||||
|
||||
.bottom {
|
||||
position: fixed; /* 使用固定定位 */
|
||||
left: 50%; /* 水平居中 */
|
||||
transform: translateX(-50%); /* 使用transform调整实际位置 */
|
||||
bottom: 0; /* 定位到页面底部 */
|
||||
width: 100%; /* 宽度占满整个容器 */
|
||||
text-align: center; /* 文本居中 */
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -114,7 +114,7 @@ export default {
|
|||
},
|
||||
{
|
||||
name: 'ReportSubmit',
|
||||
path: 'report-submit',
|
||||
path: 'report-submit/:examId/:classId',
|
||||
component: () => import('./report-submit/index.vue'),
|
||||
meta: {
|
||||
title: '作业详情',
|
||||
|
|
|
|||
|
|
@ -61,7 +61,6 @@ const queryExamScores = async () => {
|
|||
title.value = res.data.title; // 更新作业名称
|
||||
score.value = res.data.score; // 更新个人得分
|
||||
rank.value = res.data.rank; // 更新个人排名
|
||||
console.log(res1);
|
||||
totalStudents.value = res1.data;// 更新班级总人数
|
||||
};
|
||||
|
||||
|
|
|
|||
|
|
@ -19,12 +19,12 @@ import ClassScore from '@/views/user/score-rank/components/class-score.vue'
|
|||
}
|
||||
|
||||
.personal-rank {
|
||||
flex: 0 0 20%; /* UserPersonalRank 占据 40% 的空间 */
|
||||
flex: 0 0 20%; /* UserPersonalRank 占据 20% 的空间 */
|
||||
/* 其他样式,例如 padding, margin 等 */
|
||||
}
|
||||
|
||||
.class-score {
|
||||
flex: 0 0 80%; /* ClassScore 占据 60% 的空间 */
|
||||
flex: 0 0 80%; /* ClassScore 占据 80% 的空间 */
|
||||
/* 其他样式,例如 padding, margin 等 */
|
||||
}
|
||||
</style>
|
||||
|
|
@ -27,25 +27,28 @@ public class ProblemController {
|
|||
|
||||
@Autowired
|
||||
private ProblemServiceI problemServiceI;
|
||||
|
||||
@PostMapping("/addScoringRubric")
|
||||
public RespBean addScoringRubric(@RequestBody PMScoringRubric scoringRubric) {
|
||||
problemServiceI.addScoringRubric(scoringRubric);
|
||||
return RespBean.ok("添加评分细则成功");
|
||||
}
|
||||
|
||||
@PostMapping("/addScoringStandard")
|
||||
public RespBean addScoringStandard(@RequestBody PMScoringStandard pmScoringStandard) {
|
||||
problemServiceI.addScoringStandard(pmScoringStandard);
|
||||
List<ScoringStandard> scoringStandardList = problemServiceI.findStandardIdNoProblemId();
|
||||
if (scoringStandardList.size() > 1) {
|
||||
problemServiceI.updateStandardId(scoringStandardList.get(0).getId());
|
||||
}
|
||||
else{
|
||||
} else {
|
||||
for (ScoringStandard scoringStandard : scoringStandardList) {
|
||||
problemServiceI.updateStandardId(scoringStandard.getId());
|
||||
}
|
||||
} return RespBean.ok("添加评分标准成功");
|
||||
}
|
||||
return RespBean.ok("添加评分标准成功");
|
||||
|
||||
}
|
||||
|
||||
@PostMapping("/addProblem")
|
||||
public RespBean addProblem(@RequestBody Problem problem, HttpServletRequest request) {
|
||||
String title = problem.getTitle();
|
||||
|
|
@ -72,6 +75,7 @@ public class ProblemController {
|
|||
}
|
||||
return RespBean.ok("添加作业成功");
|
||||
}
|
||||
|
||||
@PostMapping("/findScoringRubricNoStandardId")
|
||||
public RespBean findScoringRubricNoStandardId() {
|
||||
List<UScoringRubric> uScoringRubricList =
|
||||
|
|
@ -84,6 +88,7 @@ public class ProblemController {
|
|||
}
|
||||
|
||||
}
|
||||
|
||||
@PostMapping("/findScoringStandardNoProblemId")
|
||||
public RespBean findScoringStandardNoProblemId() {
|
||||
List<UScoringStandard> uScoringStandardList =
|
||||
|
|
@ -96,6 +101,7 @@ public class ProblemController {
|
|||
}
|
||||
|
||||
}
|
||||
|
||||
@PostMapping(
|
||||
"/findScoringStandardByProblemId")
|
||||
public RespBean findScoringStandardByProblemId(@RequestBody PMProblem pmProblem) {
|
||||
|
|
@ -109,6 +115,7 @@ public class ProblemController {
|
|||
}
|
||||
|
||||
}
|
||||
|
||||
@PostMapping("/editProblem")
|
||||
public RespBean editProblem(@RequestBody PMProblem pmProblem) {
|
||||
Integer id = pmProblem.getId();
|
||||
|
|
@ -128,6 +135,7 @@ public class ProblemController {
|
|||
}
|
||||
|
||||
}
|
||||
|
||||
@PostMapping("/deleteProblem")
|
||||
public RespBean deleteCourse(@RequestBody PMProblem pmProblem) {
|
||||
problemServiceI.deleteProblem(pmProblem.getId());
|
||||
|
|
@ -136,16 +144,19 @@ public class ProblemController {
|
|||
//那么学生提交该作业的记录也要删除
|
||||
return RespBean.ok("删除成功");
|
||||
}
|
||||
|
||||
@PostMapping("/deleteScoringRubric")
|
||||
public RespBean deleteScoringRubric() {
|
||||
problemServiceI.deleteScoringRubric();
|
||||
return RespBean.ok("删除评分细则成功");
|
||||
}
|
||||
|
||||
@PostMapping("/deleteScoringStandard")
|
||||
public RespBean deleteScoringStandrd() {
|
||||
problemServiceI.deleteScoringStandard();
|
||||
return RespBean.ok("删除评分标准成功");
|
||||
}
|
||||
|
||||
@PostMapping("/findAllProblemByCourseId")
|
||||
public RespBean findAllProblemByCourseId(@RequestBody PMProblem pmProblem) {
|
||||
// if (pmProblem.getPageNum() < 1 || pmProblem.getPageSize() < 1)
|
||||
|
|
@ -154,6 +165,7 @@ public class ProblemController {
|
|||
return RespBean.ok("查询作业库成功", dataGrid);
|
||||
|
||||
}
|
||||
|
||||
@PostMapping(
|
||||
"/findAllProblemByCourseIdAndClassId")
|
||||
public RespBean findAllProblemByCourseIdAndClassId(@RequestBody PMProblem pmProblem) {
|
||||
|
|
@ -162,6 +174,7 @@ public class ProblemController {
|
|||
return RespBean.ok("查询作业列表成功", dataGrid);
|
||||
|
||||
}
|
||||
|
||||
@PostMapping(
|
||||
"/addTime")
|
||||
public RespBean addTime(@RequestBody PMPostProblem pmPostProblem) {
|
||||
|
|
@ -173,6 +186,7 @@ public class ProblemController {
|
|||
return RespBean.error("加时失败");
|
||||
|
||||
}
|
||||
|
||||
@PostMapping("/findProblemById")
|
||||
public RespBean findProblemById(@RequestBody PMProblem pmProblem) {
|
||||
List<Problem> problems =
|
||||
|
|
@ -181,6 +195,7 @@ public class ProblemController {
|
|||
problems.get(0));
|
||||
|
||||
}
|
||||
|
||||
@PostMapping("/findPostProblem")
|
||||
public RespBean findPostProblem(@RequestBody PMPostProblem pmPostProblem) {
|
||||
List<PostProblem> postProblems = problemServiceI.findPostProblem(pmPostProblem.getProblemId(), pmPostProblem.getClassId());
|
||||
|
|
@ -201,6 +216,7 @@ public class ProblemController {
|
|||
pmPostProblems.get(0));
|
||||
|
||||
}
|
||||
|
||||
@PostMapping("/postProblem")
|
||||
public RespBean postProblem(@RequestBody PMPostProblem pmPostProblem) {
|
||||
List<Integer> classList =
|
||||
|
|
@ -211,6 +227,7 @@ public class ProblemController {
|
|||
return RespBean.ok("发布作业成功");
|
||||
|
||||
}
|
||||
|
||||
@PostMapping("/updateSetup")
|
||||
public RespBean updateSetup(@RequestBody PMPostProblem pmPostProblem) {
|
||||
int num =
|
||||
|
|
@ -220,6 +237,7 @@ public class ProblemController {
|
|||
else
|
||||
return RespBean.error("修改作业设置失败");
|
||||
}
|
||||
|
||||
//获取作业列表
|
||||
@GetMapping("/getExamList")
|
||||
public RespBean getExamList(Integer pageNum, Integer pageSize, HttpServletRequest request) {
|
||||
|
|
@ -254,6 +272,7 @@ public class ProblemController {
|
|||
return RespBean.error("获取作业列表失败!");
|
||||
}
|
||||
}
|
||||
|
||||
@PostMapping("findStudentSubmit")
|
||||
public RespBean findStudentSubmit(@RequestBody PMStudentSubmit pmStudentSubmit) {
|
||||
DataGrid dataGrid;
|
||||
|
|
@ -285,27 +304,24 @@ public RespBean findStudentSubmit(@RequestBody PMStudentSubmit pmStudentSubmit){
|
|||
//获取当前作业班级排名信息
|
||||
@GetMapping("/getClassRanks")
|
||||
public RespBean getClassRanks(Integer pageNum, Integer pageSize, Integer classId, Integer examId) {
|
||||
if (pageNum < 1 || pageSize < 1)
|
||||
return RespBean.error("参数错误!");
|
||||
UReportSubmitted uReportSubmitted=new UReportSubmitted();
|
||||
uReportSubmitted.setPageNum(pageNum);
|
||||
uReportSubmitted.setPageSize(pageSize);
|
||||
|
||||
List<UReportSubmitted> uReportsSubmitted = problemServiceI.findClassRankByIds(examId, classId);
|
||||
|
||||
|
||||
|
||||
// //分页处理
|
||||
// DataGrid dataGrid = problemServiceI.dataGrid(pMproblems,pMproblem);
|
||||
//
|
||||
if (uReportsSubmitted != null) {
|
||||
return RespBean.ok("获取班级排名列表成功!", uReportsSubmitted);
|
||||
} else {
|
||||
return RespBean.error("获取班级排名列表失败!");
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
//获取当前作业班级排名信息
|
||||
@GetMapping("/getProblemInfo")
|
||||
public RespBean getProblemInfo(Integer classId, Integer examId) {
|
||||
List<PostProblem> PostProblem = problemServiceI.findPostProblem(examId,classId);
|
||||
if (!PostProblem.isEmpty()) {
|
||||
// 直接获取列表中的第一个元素
|
||||
PostProblem postProblem = PostProblem.get(0);
|
||||
return RespBean.ok("获取实验具体信息成功!", postProblem);
|
||||
} else {
|
||||
return RespBean.error("获取实验具体信息失败!");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -17,21 +17,31 @@ public interface ProblemDaoI extends BaseDaoI<Problem> {
|
|||
List<ReportSubmitted> findPMProblemStatusesByStudentIdAndProblemsIds(List<Integer> problemIds, Integer studentId);
|
||||
|
||||
UReportSubmitted getScoreAndRankByIds(int problemId, int userId);
|
||||
|
||||
List<UReportSubmitted> getClassRankByIds(int problemId, int classId);
|
||||
|
||||
public String findProblemByTitle(String title);
|
||||
|
||||
public String findProblemByTitle(String title, Integer id);
|
||||
|
||||
public List<Problem> findProblemIdByTitle(String title);
|
||||
|
||||
public void addProblem(Problem problem);
|
||||
|
||||
public long getAllProblemsNum(int courseId);
|
||||
|
||||
List<Object[]> getProblemsByPage(Integer courseId,
|
||||
Integer classId, String selectedStatus,
|
||||
int page, int rows);
|
||||
|
||||
List<Problem> getProblemsByPage(Integer courseId, String title,
|
||||
int page, int rows);
|
||||
|
||||
public List<Problem> findProblemById(int id);
|
||||
|
||||
public boolean editProblem(String title,
|
||||
String description, Integer id);
|
||||
|
||||
public void deleteProblem(Integer id);
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -289,6 +289,7 @@ public class ProblemDaoImpl extends BaseDaoImpl<Problem> implements ProblemDaoI{
|
|||
"delete from Problem where id=" + id;
|
||||
this.executeHql(hql);
|
||||
}
|
||||
|
||||
@Override
|
||||
public void addProblem(Problem problem) {
|
||||
// TODO Auto-generated method stub
|
||||
|
|
|
|||
|
|
@ -319,6 +319,8 @@ public class ProblemServiceImpl implements ProblemServiceI {
|
|||
public int editSubmitReport(LocalDateTime addTime,int problemId,int studentId){
|
||||
return studentSubmitDao.updateAddTime(addTime,problemId,studentId);
|
||||
}
|
||||
|
||||
|
||||
@Override
|
||||
public DataGrid findProblemByCourseIdAndClassId(PMProblem pmProblem){
|
||||
DataGrid dg = new DataGrid();
|
||||
|
|
|
|||
Loading…
Reference in New Issue