reactor:对接阅卷管理

src/views/examTrain/exam/marking/components/Exam-Marking-View.vue

@@ -1,331 +0,0 @@
-<template>
-	<el-dialog v-model="state.dialogVisible" draggable destroy-on-close :show-close="false" width="80%" :before-close="closeDialog">
-		<template #header="{ close, titleId, titleClass }">
-			<div class="topContent">
-				<div class="titleBox">
-					<span class="title">自我练习</span>
-				</div>
-				<div class="submitBox">
-					<el-button type="info" @click="closeDialog">关 闭</el-button>
-				</div>
-			</div>
-		</template>
-		<el-row :gutter="10" v-loading="state.loading">
-			<el-col :xs="6" :sm="6" :md="6" :lg="6" :xl="6">
-				<div class="examListContent" v-for="item in state.questionTypeData">
-					<p class="examType">{{ item.questionTypeDesc }}</p>
-					<ul class="examList">
-						<li
-							class="examListItem"
-							:class="{ select: questionsItem.id == state.selQuestionID, right: questionsItem.isRight, error: !questionsItem.isRight }"
-							v-for="questionsItem in item.questions"
-							@click="onSelQuestion(questionsItem.id)"
-						>
-							{{ questionsItem.sortIndex }}
-						</li>
-					</ul>
-				</div>
-			</el-col>
-			<el-col :xs="18" :sm="18" :md="18" :lg="18" :xl="18">
-				<div class="questionBox" v-if="state.questionDetail">
-					<p class="questionTitle">题干：{{ state.questionDetail.title }}</p>
-					<div class="questionAnswer">
-						<div v-if="[0, 2].includes(state.questionDetail.questionType)">
-							<el-radio-group style="display: block" v-model="state.selRadioValue">
-								<el-form-item :label="item.label + '. '" v-for="item in state.questionDetail.practiceQuestionOptionsDtos" style="margin-bottom: 10px">
-									<el-radio :label="item.content" :value="item.questionOptionId" disabled />
-								</el-form-item>
-							</el-radio-group>
-						</div>
-						<div v-else-if="state.questionDetail.questionType == 1">
-							<el-checkbox-group v-model="state.selCheckboxValue">
-								<el-form-item :label="item.label + '. '" v-for="item in state.questionDetail.practiceQuestionOptionsDtos" style="margin-bottom: 10px">
-									<el-checkbox :label="item.content" :value="item.questionOptionId" disabled />
-								</el-form-item>
-							</el-checkbox-group>
-						</div>
-					</div>
-				</div>
-				<div class="referenceAnswer" v-if="state.questionDetail">
-					<span>参考答案：</span>
-					<p>{{ state.questionDetail.answerDesc || '略' }}</p>
-				</div>
-				<div class="referenceAnswer" v-if="state.questionDetail && state.questionDetail.practiceQuestionKnowladgeDtos.length > 0">
-					<span>关联知识：</span>
-					<p v-for="item in state.questionDetail.practiceQuestionKnowladgeDtos" @click="onKnowladgeTo(item)">{{ item.title }}</p>
-				</div>
-				<div class="referenceAnswer" v-if="state.questionDetail && state.questionDetail.practiceQuestionSourcewareDtos.length > 0">
-					<span>关联课件：</span>
-					<p v-for="item in state.questionDetail.practiceQuestionSourcewareDtos" @click="onSourcewareTo(item)">{{ item.name }}</p>
-				</div>
-			</el-col>
-		</el-row>
-		<template #footer>
-			<span class="dialog-footer" v-if="state.selQuestionID">
-				<el-button type="primary" @click="onLastQuestion" :loading="state.loading">上一题</el-button>
-				<el-button type="primary" @click="onNextQuestion" :loading="state.loading">下一题</el-button>
-			</span>
-		</template>
-	</el-dialog>
-</template>
-
-<script setup lang="ts">
-import { reactive, ref } from 'vue';
-import { useRouter } from 'vue-router';
-import { ElMessage, ElMessageBox } from 'element-plus';
-import { excludeSelfById } from '@/utils/tools';
-import other from '@/utils/other';
-import { fileDownloadByUrl } from '@/api/public/file';
-import { getViewPracticeQuestions, getPracticeView } from '@/api/examTrain/practice';
-
-const router = useRouter(); // 路由
-// 定义子组件向父组件传值/事件
-const emit = defineEmits(['updateList']);
-
-// 定义变量内容
-const state = reactive<any>({
-	dialogVisible: false, // 弹窗
-	loading: false, // 加载
-	practiceId: '', // 用户练习id
-	questionTypeData: [] as any[], // 试卷题型数据
-	questionsData: [] as any[], // 试题集合
-	selQuestionID: '', // 选择的问题id
-	questionDetail: null, // 选择的问题明细
-	selRadioValue: '', // 单选题选择的值
-	selCheckboxValue: [] as any[], // 多选题选择的值
-});
-// 打开弹窗
-const openDialog = async (rows: any) => {
-	state.dialogVisible = true;
-	state.practiceId = rows.id;
-	state.loading = true;
-	getQuestionsData();
-};
-const getQuestionsData = async () => {
-	try {
-		const { result } = await getViewPracticeQuestions(state.practiceId);
-		let sortIndexNum = 1;
-		result.forEach((item) => {
-			switch (item.questionType) {
-				case 0:
-					item.questionTypeDesc = '单选题';
-					break;
-				case 1:
-					item.questionTypeDesc = '多选题';
-					break;
-				case 2:
-					item.questionTypeDesc = '判断题';
-					break;
-				default:
-					break;
-			}
-			item.questions.forEach((it) => {
-				it.sortIndex = sortIndexNum;
-				it.questionType = item.questionType;
-				state.questionsData.push(it);
-				sortIndexNum++;
-			});
-		});
-		state.questionTypeData = result;
-		state.loading = false;
-	} catch (error) {
-		// 打印错误信息
-		console.error(error);
-	}
-};
-// 关闭弹窗
-const closeDialog = () => {
-	state.dialogVisible = false;
-	state.questionTypeData = [];
-	state.questionsData = [];
-	state.selQuestionID = '';
-	state.questionDetail = null;
-	state.selRadioValue = '';
-	state.selCheckboxValue = [];
-};
-// 上一题下一题
-const onLastQuestion = () => {
-	let index: number = state.questionsData.findIndex((it) => it.id == state.selQuestionID);
-	index = index - 1 == -1 ? state.questionsData.length - 1 : index - 1;
-	onSelQuestion(state.questionsData[index].id);
-};
-const onNextQuestion = () => {
-	let index: number = state.questionsData.findIndex((it) => it.id == state.selQuestionID);
-	index = index + 1 == state.questionsData.length ? 0 : index + 1;
-	onSelQuestion(state.questionsData[index].id);
-};
-// 选择的问题id 提交当前试题答案，再请求下一道题详情 value: 请求下一题详情id
-const onSelQuestion = async (value: any) => {
-	state.loading = true;
-	onGetQuestionDetail(value);
-};
-const onGetQuestionDetail = async (value) => {
-	// 初始化选择选择/填写的答案
-	state.selRadioValue = '';
-	state.selCheckboxValue = [];
-	// 请求下一道题
-	state.selQuestionID = value;
-	try {
-		const { result } = await getPracticeView(state.selQuestionID);
-		state.questionDetail = result;
-		let answerDesc = '';
-		state.questionDetail.practiceQuestionOptionsDtos.forEach((it) => {
-			it.isAnswer && (answerDesc += it.label);
-		});
-		state.questionDetail.answerDesc = answerDesc;
-		if ([0, 2].includes(state.questionDetail.questionType)) {
-			let obj = state.questionDetail.practiceQuestionOptionsDtos.find((x: any) => x.isSelected === true);
-			state.selRadioValue = obj ? obj.questionOptionId : '';
-		} else if (state.questionDetail.questionType == 1) {
-			let arr = [] as any[];
-			state.questionDetail.practiceQuestionOptionsDtos.forEach((it) => {
-				if (it.isSelected) arr.push(it);
-			});
-			state.selCheckboxValue = arr ? arr.map((x: any) => x.questionOptionId) : [];
-		}
-		state.loading = false;
-	} catch (error) {
-		// 打印错误信息
-		console.error(error);
-	}
-};
-// 跳转知识详情页面
-const onKnowladgeTo = (row: any) => {
-	router.push({
-		name: 'knowledgePreview',
-		params: {
-			id: row.knowladgeId,
-			isAddPv: 'isAddPv',
-			tagsViewName: row.title,
-		},
-	});
-};
-// 课件预览下载
-const onSourcewareTo = (row: any) => {
-	ElMessageBox.confirm(`您确定要下载课件，是否继续?`, '提示', {
-		confirmButtonText: '确认',
-		cancelButtonText: '取消',
-		type: 'warning',
-		draggable: true,
-		cancelButtonClass: 'default-button',
-		autofocus: false,
-	})
-		.then(() => {
-			fileDownloadByUrl({
-				Source: 'hotline',
-				Id: row.attachmentId,
-			}).then((res: any) => {
-				let blob: Blob = new Blob([res.data], { type: res.data.type }); // 创建blob 设置blob文件类型 data 设置为后端返回的文件(例如mp3,jpeg) type:这里设置后端返回的类型 为 mp3
-				let down: HTMLAnchorElement = document.createElement('a'); // 创建A标签
-				let href: string = window.URL.createObjectURL(blob); // 创建下载的链接
-				down.href = href; // 下载地址
-				down.download = row.name; // 下载文件名
-				document.body.appendChild(down);
-				down.click(); // 模拟点击A标签
-				document.body.removeChild(down); // 下载完成移除元素
-				window.URL.revokeObjectURL(href); // 释放blob对象
-			});
-		})
-		.catch(() => {});
-};
-// 暴露变量
-defineExpose({
-	openDialog,
-	closeDialog,
-});
-</script>
-<style lang="scss">
-.topContent {
-	padding: 10px 30px;
-	display: flex;
-	justify-content: space-between;
-	align-items: center;
-}
-.topContent .surplusBox {
-	text-align: center;
-}
-.topContent .surplusBox .surplus {
-	font-size: 18px;
-	color: #000000;
-}
-.topContent .titleBox {
-	text-align: center;
-}
-.topContent .titleBox .title {
-	font-size: 20px;
-	font-weight: bold;
-	letter-spacing: 1px;
-	color: #000000;
-}
-.topContent .submitBox {
-	text-align: right;
-	vertical-align: top;
-}
-.examListContent .examType {
-	font-weight: bold;
-	color: #000000;
-}
-.examListContent .examList {
-	padding: 5px 0 10px;
-}
-.examListContent .examList .examListItem {
-	display: inline-block;
-	margin: 5px 10px 5px 0;
-	text-align: center;
-	width: 50px;
-	height: 35px;
-	line-height: 35px;
-	cursor: pointer;
-	position: relative;
-	border: #f2f2f2 1px solid;
-}
-.examListContent .examList .right::after {
-	content: ' ';
-	width: 5px;
-	height: 5px;
-	position: absolute;
-	top: 2px;
-	right: 3px;
-	background-color: #009688;
-	border-radius: 50%;
-}
-.examListContent .examList .error::after {
-	content: ' ';
-	width: 5px;
-	height: 5px;
-	position: absolute;
-	top: 2px;
-	right: 3px;
-	background-color: #ff5722;
-	border-radius: 50%;
-}
-.examListContent .examList .select {
-	background-color: #1890ff;
-	color: #fff;
-}
-.questionBox {
-	padding: 20px 10px 0;
-}
-.questionBox .questionTitle {
-	margin-bottom: 10px;
-	font-size: 16px;
-}
-.questionBox .questionAnswer {
-	padding: 0 20px;
-}
-.referenceAnswer {
-	background-color: #ebf9ff;
-	margin: 15px 40px 15px 30px;
-	padding: 10px;
-}
-.referenceAnswer span {
-	display: block;
-}
-.referenceAnswer p {
-	width: calc(100% - 80px);
-	display: block;
-	margin-top: 10px;
-	color: #1890ff;
-	cursor: pointer;
-}
-</style>

src/views/examTrain/exam/marking/components/Exam-Marking.vue

@@ -37,27 +37,32 @@
 					<div style="overflow: hidden; width: 100%; height: 100%; flex: 1">
 						<el-scrollbar style="height: calc(100% - 32px)" always v-loading="state.loading">
 							<div class="h100 w100 exam-container">
-								<div v-for="item in state.examList" :key="item.id" class="exam-item">
-									<p class="exam-item-questionName">题目：{{ item.title }}</p>
-									<p class="exam-item-answer">回答答案：{{ item.answer }}</p>
-									<el-divider></el-divider>
-									<p class="exam-item-referenceAnswer">参考答案：{{ item.referenceAnswer }}</p>
-									<div class="exam-item-score">
-										分数：
-										<span v-if="isView">{{ item.score }}</span>
-										<el-input-number
-											v-model="item.score"
-											:step="1"
-											:precision="0"
-											:min="0"
-											:max="100"
-											placeholder="请填写分数"
-											style="width: 200px"
-											v-else
-										></el-input-number>
+								<template v-if="state.examList.length">
+									<div v-for="item in state.examList" :key="item.id" class="exam-item">
+										<p class="exam-item-questionName">
+											题目：{{ item.title }} <span v-if="item.questionScore">（{{ item.questionScore }}分）</span>
+										</p>
+										<p class="exam-item-answer">回答答案：{{ item.answer }}</p>
+										<el-divider></el-divider>
+										<p class="exam-item-referenceAnswer">参考答案：{{ item.correctAnswer }}</p>
+										<div class="exam-item-score">
+											分数：
+											<span v-if="isView">{{ item.score }}</span>
+											<el-input-number
+												v-model="item.score"
+												:step="1"
+												:precision="0"
+												:min="0"
+												:max="item.questionScore"
+												placeholder="请填写分数"
+												style="width: 200px"
+												v-else
+											></el-input-number>
+										</div>
+										<el-divider></el-divider>
 									</div>
-									<el-divider></el-divider>
-								</div>
+								</template>
+								<el-empty description="该考试人员暂未考试完成" v-else></el-empty>
 							</div>
 						</el-scrollbar>
 					</div>
@@ -65,7 +70,7 @@
 						<el-text type="danger" tag="b" class="mr20" v-if="!isView">温馨提示：保存仅保存当前用户的试卷分数</el-text>
 						<span v-else></span>
 						<div>
-							<el-button type="primary" @click="onSave(ruleFormRef)" :loading="state.loading" v-if="!isView">保存</el-button>
+							<el-button type="primary" @click="onSave(ruleFormRef)" :loading="state.loading" v-if="!isView && state.examList.length">保存</el-button>
 							<!--							<el-button type="primary" @click="onSubmit" :loading="state.loading">提交</el-button>-->
 							<el-button class="default-button" @click="onCancel" :loading="state.loading">取消 </el-button>
 						</div>
@@ -119,7 +124,7 @@ const getUserList = async () => {
 		state.userLoading = false;
 	}
 };
-// 获取试卷内容
+// 根据用户获取试卷内容
 const getExamManageDetailData = async () => {
 	state.loading = true;
 	try {
@@ -136,8 +141,7 @@ const onSave = throttle(() => {
 	const request = state.examList.map((item: any) => {
 		return {
 			userExamItemId: item.id,
-			Score: item.score,
-			isCheck: true,
+			score: item.score,
 		};
 	});
 	state.loading = true;

src/views/examTrain/exam/marking/index.vue

@@ -67,8 +67,6 @@
 				:disabled="state.tableLoading"
 			/>
 		</div>
-		<!-- 阅卷查看	-->
-		<exam-marking-view ref="examMarkingViewRef" />
 	</div>
 </template>
 
@@ -82,7 +80,6 @@ import { useRouter } from 'vue-router';
 
 // 引入组件
 const pagination = defineAsyncComponent(() => import('@/components/ProTable/components/Pagination.vue')); // 分页
-const ExamMarkingView = defineAsyncComponent(() => import('@/views/examTrain/exam/marking/components/Exam-Marking-View.vue')); // 阅卷查看
 
 // 定义变量内容
 const state = reactive<any>({
@@ -134,7 +131,6 @@ const onMarking = (row: any) => {
 	});
 };
 // 阅卷查看
-const examMarkingViewRef = ref<RefType>();
 const onView = (row: any) => {
 	router.push({
 		name: 'examTrainExamMarkingEdit',