|
|
|
|
@ -1,15 +1,15 @@
|
|
|
|
|
<template>
|
|
|
|
|
<el-container style="min-height: 100vh; width: 100%">
|
|
|
|
|
<!-- Left sidebar -->
|
|
|
|
|
<el-aside :width="sideWidth + 'px'" style="background-color: #f4f7fc; box-shadow: 2px 0 6px rgba(0, 21, 41, 0.15)">
|
|
|
|
|
<Aside :isCollapse="isCollapse" :logoTextShow="logoTextShow" />
|
|
|
|
|
</el-aside>
|
|
|
|
|
|
|
|
|
|
<!-- Main content -->
|
|
|
|
|
<el-container style="width: calc(100% - 200px);">
|
|
|
|
|
<el-header style="border-bottom: 1px solid #e1e4ea; padding: 10px 20px; background: #fff;">
|
|
|
|
|
<Header :collapseBtnClass="collapseBtnClass" :collapse="collapse" />
|
|
|
|
|
</el-header>
|
|
|
|
|
<el-container style="min-height: 100vh; width: 100%">
|
|
|
|
|
<!-- Left sidebar -->
|
|
|
|
|
<el-aside :width="sideWidth + 'px'" style="background-color: #f4f7fc; box-shadow: 2px 0 6px rgba(0, 21, 41, 0.15)">
|
|
|
|
|
<Aside :isCollapse="isCollapse" :logoTextShow="logoTextShow" />
|
|
|
|
|
</el-aside>
|
|
|
|
|
|
|
|
|
|
<!-- Main content -->
|
|
|
|
|
<el-container style="width: calc(100% - 200px);">
|
|
|
|
|
<el-header style="border-bottom: 1px solid #e1e4ea; padding: 10px 20px; background: #fff;">
|
|
|
|
|
<Header :collapseBtnClass="collapseBtnClass" :collapse="collapse" />
|
|
|
|
|
</el-header>
|
|
|
|
|
|
|
|
|
|
<el-main style="padding: 20px;">
|
|
|
|
|
<!-- 搜索框 -->
|
|
|
|
|
@ -27,8 +27,10 @@
|
|
|
|
|
<el-table-column prop="subject" label="学科"></el-table-column>
|
|
|
|
|
<el-table-column prop="type" label="类型"></el-table-column>
|
|
|
|
|
|
|
|
|
|
<el-table-column label="操作" width="180">
|
|
|
|
|
<!-- 操作列：查看试卷 -->
|
|
|
|
|
<el-table-column label="操作" width="200">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<el-button @click="openExamDialog(scope.row)" type="primary" size="small">查看试卷</el-button>
|
|
|
|
|
<el-button @click="openDistributionDialog(scope.row)" type="primary" size="small">发布情况</el-button>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
@ -43,6 +45,36 @@
|
|
|
|
|
layout="total, prev, pager, next, jumper"
|
|
|
|
|
/>
|
|
|
|
|
|
|
|
|
|
<!-- 查看试卷弹窗 -->
|
|
|
|
|
<el-dialog :visible.sync="isExamDialogVisible" title="试卷内容" width="80%" :close-on-click-modal="false">
|
|
|
|
|
<!-- 设置对话框的样式 -->
|
|
|
|
|
<div v-if="examQuestions.length > 0" class="exam-table-container">
|
|
|
|
|
<el-table :data="examQuestions" style="width: 100%">
|
|
|
|
|
<!-- 表格列 -->
|
|
|
|
|
<el-table-column label="ID" prop="id" width="60"></el-table-column>
|
|
|
|
|
<el-table-column label="题目" prop="content" width="300"></el-table-column>
|
|
|
|
|
|
|
|
|
|
<!-- 如果题目有选项（chance），则显示选项列 -->
|
|
|
|
|
<el-table-column label="选项" width="400">
|
|
|
|
|
<template v-slot="scope">
|
|
|
|
|
<div v-if="scope.row.chance && scope.row.chance.length > 0">
|
|
|
|
|
<el-row v-for="(option, index) in scope.row.chance" :key="index" type="flex" justify="start" align="middle" class="option-row">
|
|
|
|
|
<el-col :span="24">
|
|
|
|
|
<el-tag :type="'success'" class="option-tag">
|
|
|
|
|
{{ option.label }}: {{ option.text }}
|
|
|
|
|
</el-tag>
|
|
|
|
|
</el-col>
|
|
|
|
|
</el-row>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
</el-table>
|
|
|
|
|
</div>
|
|
|
|
|
<span slot="footer" class="dialog-footer">
|
|
|
|
|
<el-button @click="isExamDialogVisible = false" type="primary">关闭</el-button>
|
|
|
|
|
</span>
|
|
|
|
|
</el-dialog>
|
|
|
|
|
|
|
|
|
|
<!-- 分发弹窗 -->
|
|
|
|
|
<el-dialog :visible.sync="isDistributionDialogVisible" title="分发试卷">
|
|
|
|
|
<el-table :data="classList" style="width: 100%">
|
|
|
|
|
@ -57,7 +89,7 @@
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column label="操作" width="180">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<el-button @click="distributeExam(selectedExam.id,scope.row)" type="success" size="small">发布</el-button>
|
|
|
|
|
<el-button @click="distributeExam(selectedExam.id, scope.row)" type="success" size="small">发布</el-button>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
</el-table>
|
|
|
|
|
@ -86,8 +118,10 @@ export default {
|
|
|
|
|
logoTextShow: true,
|
|
|
|
|
exams: [], // 试卷列表
|
|
|
|
|
classList: [], // 班级列表
|
|
|
|
|
examQuestions: [], //试卷题目
|
|
|
|
|
selectedExam: null, // 当前选择的试卷
|
|
|
|
|
isDistributionDialogVisible: false, // 分发弹窗显示状态
|
|
|
|
|
isExamDialogVisible: false, //试卷题目显示状态
|
|
|
|
|
searchQuery: "", // 搜索框的内容
|
|
|
|
|
currentPage: 1, // 当前页码
|
|
|
|
|
pageSize: 10, // 每页显示的试卷数量
|
|
|
|
|
@ -112,6 +146,38 @@ export default {
|
|
|
|
|
this.collapseBtnClass = this.isCollapse ? "el-icon-s-unfold" : "el-icon-s-fold";
|
|
|
|
|
this.logoTextShow = !this.isCollapse;
|
|
|
|
|
},
|
|
|
|
|
//打开试卷题目
|
|
|
|
|
openExamDialog(exam){
|
|
|
|
|
console.log("22222",exam);
|
|
|
|
|
this.fetchExamQuestions(exam.id);
|
|
|
|
|
this.isExamDialogVisible = true;
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
// 获取试卷题目
|
|
|
|
|
async fetchExamQuestions(examId) {
|
|
|
|
|
try {
|
|
|
|
|
const token = this.$store.state.tokens[this.userId];
|
|
|
|
|
if (!token) {
|
|
|
|
|
alert("用户未登录，请重新登录！");
|
|
|
|
|
this.$router.push("/login");
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
const response = await axios.get("http://localhost:8080/teacher/examPaper/getExamPaperQuestions", {
|
|
|
|
|
params: { id: examId },
|
|
|
|
|
headers: { Authorization: `Bearer ${token}` },
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
if (response.data.code === 200) {
|
|
|
|
|
this.examQuestions = response.data.data; // 获取试卷题目
|
|
|
|
|
console.log("response",this.examQuestions);
|
|
|
|
|
} else {
|
|
|
|
|
this.$message.error("获取试卷题目失败");
|
|
|
|
|
}
|
|
|
|
|
} catch (error) {
|
|
|
|
|
console.error("获取试卷题目失败:", error);
|
|
|
|
|
this.$message.error("获取试卷题目失败");
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
// 打开分发试卷的弹窗
|
|
|
|
|
openDistributionDialog(exam) {
|
|
|
|
|
@ -224,4 +290,43 @@ export default {
|
|
|
|
|
.el-table {
|
|
|
|
|
margin-top: 20px;
|
|
|
|
|
}
|
|
|
|
|
/* 对话框的样式 */
|
|
|
|
|
.el-dialog {
|
|
|
|
|
border-radius: 10px;
|
|
|
|
|
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
|
|
|
|
|
.el-dialog__header {
|
|
|
|
|
background-color: #409EFF;
|
|
|
|
|
color: white;
|
|
|
|
|
border-radius: 10px 10px 0 0;
|
|
|
|
|
font-weight: bold;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/* 表格样式 */
|
|
|
|
|
.exam-table-container {
|
|
|
|
|
margin-top: 20px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/* 设置选项行的间距 */
|
|
|
|
|
.option-row {
|
|
|
|
|
margin-bottom: 10px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/* 标签样式 */
|
|
|
|
|
.option-tag {
|
|
|
|
|
border-radius: 20px;
|
|
|
|
|
font-size: 14px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.no-option-tag {
|
|
|
|
|
background-color: #f56c6c;
|
|
|
|
|
color: white;
|
|
|
|
|
font-size: 14px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/* 对话框底部按钮 */
|
|
|
|
|
.dialog-footer {
|
|
|
|
|
text-align: right;
|
|
|
|
|
padding: 15px;
|
|
|
|
|
}
|
|
|
|
|
</style>
|
|
|
|
|
|
