Compare commits
No commits in common. "80041e5c3400c8df0b0f77b45785d4d28b55993c" and "6f5981a0b327b156a659cca2324a95440f7fa5b2" have entirely different histories.
80041e5c34
...
6f5981a0b3
|
|
@ -103,40 +103,3 @@ export const getPracticeTopic = (data) => {
|
||||||
`/Handler/Boat.ashx?action=theorylist&lianxi=1`, { params: data }
|
`/Handler/Boat.ashx?action=theorylist&lianxi=1`, { params: data }
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
//提交练习
|
|
||||||
export const submitPracticeTopic = (data) => {
|
|
||||||
return axios({
|
|
||||||
url: `/Handler/Boat.ashx?action=savelianxi`,
|
|
||||||
data: data,
|
|
||||||
method: 'post',
|
|
||||||
headers: { 'Content-Type': 'multipart/form-data' }
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
//通过id获取考试记录
|
|
||||||
export const getPracticeRecords = (data) => {
|
|
||||||
return axios.get(
|
|
||||||
`/Handler/Boat.ashx?action=querylianxilist`, { params: data }
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
//查询考试详情
|
|
||||||
export const getPracticeDetails = (data) => {
|
|
||||||
return axios.get(
|
|
||||||
`/Handler/Boat.ashx?action=querylianxidetails`, { params: data }
|
|
||||||
);
|
|
||||||
}
|
|
||||||
//查询考试人名
|
|
||||||
export const getUserName = (data) => {
|
|
||||||
return axios.get(
|
|
||||||
`/Handler/Boat.ashx?action=queryuser`, { params: data }
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
//通过resultId查询考试基本详情
|
|
||||||
export const getDetailsMap = (data) => {
|
|
||||||
return axios.get(
|
|
||||||
`/Handler/Boat.ashx?action=querylianxiresult`, { params: data }
|
|
||||||
);
|
|
||||||
}
|
|
||||||
Binary file not shown.
|
Before Width: | Height: | Size: 760 B |
Binary file not shown.
|
Before Width: | Height: | Size: 293 B |
Binary file not shown.
|
Before Width: | Height: | Size: 7.2 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 336 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.1 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.3 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 7.3 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.9 KiB |
|
|
@ -254,12 +254,6 @@ const routes = [
|
||||||
path:'/practiceSuccess',
|
path:'/practiceSuccess',
|
||||||
name:'practiceSuccess',
|
name:'practiceSuccess',
|
||||||
component:()=>import("../views/examModule/practiceSuccess.vue")
|
component:()=>import("../views/examModule/practiceSuccess.vue")
|
||||||
},
|
|
||||||
//考试详情页
|
|
||||||
{
|
|
||||||
path:'/examDetails',
|
|
||||||
name:'examDetails',
|
|
||||||
component:()=>import("../views/examModule/examDetails.vue")
|
|
||||||
}
|
}
|
||||||
];
|
];
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,985 +0,0 @@
|
||||||
<script>
|
|
||||||
import {
|
|
||||||
getPracticeTopic,
|
|
||||||
getTopicDetail,
|
|
||||||
getTestCache,
|
|
||||||
saveTestCache,
|
|
||||||
submitPracticeTopic,
|
|
||||||
getUserName,
|
|
||||||
getPracticeDetails,
|
|
||||||
} from "@/api/user";
|
|
||||||
import { sortString } from "@/util/tools";
|
|
||||||
|
|
||||||
export default {
|
|
||||||
name: "examDetails",
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
// 题目详情
|
|
||||||
testContent: {
|
|
||||||
testType: "多选题",
|
|
||||||
question:
|
|
||||||
"1、以社会主义核心价值观为引领，发展社会主义先进文化，弘扬革命文化，传承中华优秀传统文化，满足人民日益增长的精神文化需求，巩固全党全国各族人民团结奋斗的共同思想基础，不断提升（ ）。",
|
|
||||||
score: "10",
|
|
||||||
your_answer: "",
|
|
||||||
blanks_answer: [],
|
|
||||||
options: [
|
|
||||||
{
|
|
||||||
item_letter: "A",
|
|
||||||
item: "国家文化软实力和中华文化影响力",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
item_letter: "B",
|
|
||||||
item: "国家文化硬实力和中华文化影响力",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
item_letter: "C",
|
|
||||||
item: "国家文化硬实力和中华传统文化影响力",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
item_letter: "D",
|
|
||||||
item: "国家文化硬实力和中华传统文化",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
testList: [],
|
|
||||||
//题目数量
|
|
||||||
testTypeNum: [
|
|
||||||
{
|
|
||||||
type: "单选题",
|
|
||||||
children: [],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: "多选题",
|
|
||||||
children: [],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: "判断题",
|
|
||||||
children: [],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: "填空题",
|
|
||||||
children: [],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: "简答题",
|
|
||||||
children: [],
|
|
||||||
},
|
|
||||||
],
|
|
||||||
optionIndex: -1, // 选中的选项
|
|
||||||
examDialogShow: false,
|
|
||||||
// 考试请求参数
|
|
||||||
params: {
|
|
||||||
result_id: "",
|
|
||||||
},
|
|
||||||
// 题量总数
|
|
||||||
questionTotal: 0,
|
|
||||||
passScore: 0, //及格分
|
|
||||||
score: 0, //总分
|
|
||||||
minute: 0, //剩余时间
|
|
||||||
number: 0, //第几题
|
|
||||||
isCache: false, //是否获取完缓存
|
|
||||||
testTitle: "", //试卷名称
|
|
||||||
user_id: "", //用户ID
|
|
||||||
user_name: "", //用户名称
|
|
||||||
countdown: "", //剩余时间
|
|
||||||
timer: "", //定时器
|
|
||||||
inputArr: 0, //填空题输入框长度
|
|
||||||
fileList: [
|
|
||||||
{
|
|
||||||
name: "food.jpeg",
|
|
||||||
url:
|
|
||||||
"https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "food2.jpeg",
|
|
||||||
url:
|
|
||||||
"https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
};
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
//查询考试人名
|
|
||||||
getUser() {
|
|
||||||
this.user_id = this.$route.query.user_id;
|
|
||||||
getUserName({ user_id: this.$route.query.user_id })
|
|
||||||
.then((res) => {
|
|
||||||
this.user_name = res.data.data.real_name;
|
|
||||||
})
|
|
||||||
.catch((err) => {
|
|
||||||
console.log(err);
|
|
||||||
});
|
|
||||||
},
|
|
||||||
// 选项点击事件
|
|
||||||
// optionClick(event, index, item) {
|
|
||||||
// // 单选题
|
|
||||||
// if (this.testContent.testType === "多选题") {
|
|
||||||
// // 多选题
|
|
||||||
// if (event.target.className.includes("optionSelect")) {
|
|
||||||
// event.target.className = "exam-left-test-option";
|
|
||||||
|
|
||||||
// this.testList[this.number - 1].your_answer = this.testList[
|
|
||||||
// this.number - 1
|
|
||||||
// ].your_answer.replace(item.item_letter + ",", "");
|
|
||||||
// } else {
|
|
||||||
// if (
|
|
||||||
// this.testList[this.number - 1].your_answer.indexOf(item.item_letter) === -1
|
|
||||||
// ) {
|
|
||||||
// this.testList[this.number - 1].your_answer += item.item_letter + ",";
|
|
||||||
// }
|
|
||||||
// event.target.className = "exam-left-test-option optionSelect";
|
|
||||||
// }
|
|
||||||
// } else {
|
|
||||||
// if (event.target.className.includes("optionSelect")) {
|
|
||||||
// event.target.className = "exam-left-test-option";
|
|
||||||
// this.$set(this.testList[this.number - 1], "your_answer", "");
|
|
||||||
// } else {
|
|
||||||
// // 单选题、判断题
|
|
||||||
// this.$refs.option.forEach((el) => {
|
|
||||||
// el.className = "exam-left-test-option";
|
|
||||||
// });
|
|
||||||
// event.target.className = "exam-left-test-option optionSelect";
|
|
||||||
// this.$set(this.testList[this.number - 1], "your_answer", item.item_letter);
|
|
||||||
// }
|
|
||||||
|
|
||||||
// // this.testList[this.number - 1].your_answer = item.item_letter
|
|
||||||
// }
|
|
||||||
// },
|
|
||||||
//输入框输入事件
|
|
||||||
handleInput(index) {
|
|
||||||
// this.inputArr = index;
|
|
||||||
},
|
|
||||||
inputValue(value) {
|
|
||||||
this.$set(
|
|
||||||
this.testList[this.number - 1],
|
|
||||||
"your_answer",
|
|
||||||
this.testContent.your_answer
|
|
||||||
);
|
|
||||||
},
|
|
||||||
sparseArrayToNull(arr, length) {
|
|
||||||
if (arr[length - 1] == undefined) {
|
|
||||||
arr[length - 1] = undefined;
|
|
||||||
}
|
|
||||||
for (let i = 0; i < arr.length; i++) {
|
|
||||||
if (arr[i] === undefined) {
|
|
||||||
// 检查稀疏数组的空洞
|
|
||||||
arr[i] = "null";
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return arr;
|
|
||||||
},
|
|
||||||
//交卷按钮
|
|
||||||
handPaper() {
|
|
||||||
// this.examDialogShow = true;
|
|
||||||
this.$router.push("/examModule?" + this.user_id);
|
|
||||||
},
|
|
||||||
//确定交卷按钮
|
|
||||||
submitTest() {
|
|
||||||
let list = this.testList.map((el) => {
|
|
||||||
if (el.kind == "填空题") {
|
|
||||||
const parts = el.question.split("_");
|
|
||||||
let inputNum = this.generateArray(parts);
|
|
||||||
// let filteredArr = el.blanks_answer.filter(
|
|
||||||
// (item) => item !== undefined && item !== null
|
|
||||||
// );
|
|
||||||
return {
|
|
||||||
your_answer:
|
|
||||||
el.blanks_answer.length != 0
|
|
||||||
? this.sparseArrayToNull(el.blanks_answer, inputNum).join("__")
|
|
||||||
: "", // 将数组元素通过 '__' 连接成字符串
|
|
||||||
theory_base_id: el.theory_base_id,
|
|
||||||
};
|
|
||||||
} else if (el.kind == "简答题") {
|
|
||||||
return {
|
|
||||||
your_answer: el.your_answer,
|
|
||||||
theory_base_id: el.theory_base_id,
|
|
||||||
};
|
|
||||||
} else {
|
|
||||||
return {
|
|
||||||
your_answer: el.your_answer.includes(",")
|
|
||||||
? sortString(el.your_answer).slice(0, -1)
|
|
||||||
: el.your_answer,
|
|
||||||
theory_base_id: el.theory_base_id,
|
|
||||||
};
|
|
||||||
}
|
|
||||||
});
|
|
||||||
let params = sessionStorage.getItem("params");
|
|
||||||
let data = JSON.parse(params);
|
|
||||||
data.list_item_answer = list;
|
|
||||||
let formData = new FormData();
|
|
||||||
formData.append("data", JSON.stringify(data));
|
|
||||||
submitPracticeTopic(formData).then((res) => {
|
|
||||||
localStorage.removeItem("countdownEndTime");
|
|
||||||
this.$router.push("/practiceSuccess");
|
|
||||||
});
|
|
||||||
},
|
|
||||||
//答题卡数据获取
|
|
||||||
getCardData() {
|
|
||||||
// 考试信息
|
|
||||||
this.testTitle = this.$route.query.exam_name; //考试名称
|
|
||||||
// 试卷id
|
|
||||||
this.params.result_id = this.$route.query.id;
|
|
||||||
this.score = this.$route.query.score; //得分
|
|
||||||
this.minute = this.$route.query.examine_time; //考试时间
|
|
||||||
this.passScore = this.$route.query.pass_score; //及格分
|
|
||||||
getPracticeDetails(this.params).then((res) => {
|
|
||||||
// 总数
|
|
||||||
this.questionTotal = res.data.data.length;
|
|
||||||
res.data.data.forEach((el) => {
|
|
||||||
this.testTypeNum.forEach((item) => {
|
|
||||||
if (el.kind === item.type) {
|
|
||||||
item.children.push(el);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
});
|
|
||||||
this.testTypeNum.forEach((item, index) => {
|
|
||||||
this.testList.push(...item.children);
|
|
||||||
item.children.forEach((el) => {
|
|
||||||
// 回答的问题
|
|
||||||
// el.your_answer = "";
|
|
||||||
el.blanks_answer = [];
|
|
||||||
if (el.kind === "单选题") {
|
|
||||||
el.number = el.no;
|
|
||||||
} else if (el.kind === "多选题") {
|
|
||||||
el.number = el.no + this.testTypeNum[0].children.length;
|
|
||||||
} else if (el.kind === "判断题") {
|
|
||||||
el.number =
|
|
||||||
el.no +
|
|
||||||
this.testTypeNum[0].children.length +
|
|
||||||
this.testTypeNum[1].children.length;
|
|
||||||
} else if (el.kind === "填空题") {
|
|
||||||
el.number =
|
|
||||||
el.no +
|
|
||||||
this.testTypeNum[0].children.length +
|
|
||||||
this.testTypeNum[1].children.length +
|
|
||||||
this.testTypeNum[2].children.length;
|
|
||||||
} else if (el.kind === "简答题") {
|
|
||||||
el.number =
|
|
||||||
el.no +
|
|
||||||
this.testTypeNum[0].children.length +
|
|
||||||
this.testTypeNum[1].children.length +
|
|
||||||
this.testTypeNum[2].children.length +
|
|
||||||
this.testTypeNum[3].children.length;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
});
|
|
||||||
// 获取缓存数据
|
|
||||||
this.getCacheData();
|
|
||||||
this.testClick(this.testList[0]);
|
|
||||||
});
|
|
||||||
},
|
|
||||||
// 题目点击
|
|
||||||
testClick(item) {
|
|
||||||
console.log(item, "item");
|
|
||||||
// 保存缓存
|
|
||||||
this.saveCacheData();
|
|
||||||
this.testContent.options = [];
|
|
||||||
this.testContent.question = "";
|
|
||||||
this.testContent.score = item.score;
|
|
||||||
this.testContent.right_answer = item.right_answer;
|
|
||||||
this.testContent.blanks_answer = item.your_answer_desc
|
|
||||||
// 第几个题目
|
|
||||||
this.number = item.number;
|
|
||||||
// 分数赋值
|
|
||||||
// this.testContent.score = item.per_score;
|
|
||||||
this.testContent.testType = item.kind;
|
|
||||||
getTopicDetail({ theoryBaseId: item.theory_base_id }).then((res) => {
|
|
||||||
this.testContent.question = res.data.data.question;
|
|
||||||
this.testContent.options = res.data.data.items;
|
|
||||||
});
|
|
||||||
|
|
||||||
// 当前答案
|
|
||||||
this.testContent.your_answer = item.your_answer;
|
|
||||||
// this.testContent.blanks_answer = item.blanks_answer;
|
|
||||||
},
|
|
||||||
// 获取缓存数据
|
|
||||||
getCacheData() {
|
|
||||||
let params = sessionStorage.getItem("params");
|
|
||||||
let data = JSON.parse(params);
|
|
||||||
let formData = {
|
|
||||||
user_id: data.user_id,
|
|
||||||
batch_id: data.batch_id,
|
|
||||||
};
|
|
||||||
getTestCache(formData).then((res) => {
|
|
||||||
if (res.data.state) {
|
|
||||||
res.data.data.list_item_answer.forEach((val) => {
|
|
||||||
this.testList.forEach((ele) => {
|
|
||||||
if (val.theory_base_id === ele.theory_base_id) {
|
|
||||||
this.$set(ele, "your_answer", val.your_answer);
|
|
||||||
// ele.your_answer = val.your_answer
|
|
||||||
}
|
|
||||||
});
|
|
||||||
});
|
|
||||||
this.testContent.your_answer = this.testList[0].your_answer;
|
|
||||||
} else {
|
|
||||||
}
|
|
||||||
|
|
||||||
this.isCache = true;
|
|
||||||
});
|
|
||||||
},
|
|
||||||
// 保存缓存数据
|
|
||||||
saveCacheData() {
|
|
||||||
let list = this.testList.map((el) => {
|
|
||||||
return {
|
|
||||||
your_answer: el.your_answer,
|
|
||||||
theory_base_id: el.theory_base_id,
|
|
||||||
};
|
|
||||||
});
|
|
||||||
let params = sessionStorage.getItem("params");
|
|
||||||
let data = JSON.parse(params);
|
|
||||||
data.list_item_answer = list.filter((el) => {
|
|
||||||
return el.your_answer;
|
|
||||||
});
|
|
||||||
let formData = new FormData();
|
|
||||||
formData.append("data", JSON.stringify(data));
|
|
||||||
// 保存缓存
|
|
||||||
saveTestCache(formData);
|
|
||||||
},
|
|
||||||
// 下一题点击
|
|
||||||
nextClick() {
|
|
||||||
if (this.number === this.questionTotal) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
this.number++;
|
|
||||||
let data = this.testList[this.number - 1];
|
|
||||||
this.testClick(data);
|
|
||||||
},
|
|
||||||
// 上一题点击
|
|
||||||
preClick() {
|
|
||||||
if (this.number === 1 || this.number === 0) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
this.number--;
|
|
||||||
let data = this.testList[this.number - 1];
|
|
||||||
this.testClick(data);
|
|
||||||
},
|
|
||||||
|
|
||||||
generateArray(arr) {
|
|
||||||
let count = 0;
|
|
||||||
for (let i = 0; i < arr.length; i++) {
|
|
||||||
if (i % 2 === 1) {
|
|
||||||
count++;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return count;
|
|
||||||
},
|
|
||||||
|
|
||||||
//文件处理
|
|
||||||
handleRemove(file, fileList) {
|
|
||||||
console.log(file, fileList);
|
|
||||||
},
|
|
||||||
handlePreview(file) {
|
|
||||||
console.log(file);
|
|
||||||
},
|
|
||||||
},
|
|
||||||
mounted() {
|
|
||||||
this.getCardData();
|
|
||||||
//获取用户名
|
|
||||||
this.getUser();
|
|
||||||
},
|
|
||||||
|
|
||||||
computed: {
|
|
||||||
// 将题目字符串按“-”分割，形成一个包含文本和输入框的数组
|
|
||||||
questionParts() {
|
|
||||||
let num = 0;
|
|
||||||
const parts = this.testContent.question.split("_");
|
|
||||||
return parts.map((part, index) => {
|
|
||||||
if (index % 2 === 1) {
|
|
||||||
num++;
|
|
||||||
}
|
|
||||||
return {
|
|
||||||
type: index % 2 === 1 ? "input" : "text",
|
|
||||||
value: part,
|
|
||||||
index: num,
|
|
||||||
totalInput: this.generateArray(parts),
|
|
||||||
};
|
|
||||||
});
|
|
||||||
},
|
|
||||||
},
|
|
||||||
watch: {
|
|
||||||
"testContent.options"(newVal, oldVal) {},
|
|
||||||
},
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<div class="exam">
|
|
||||||
<div class="exam-box">
|
|
||||||
<div class="exam-left">
|
|
||||||
<div class="exam-test-title">{{ testTitle }}</div>
|
|
||||||
<div class="exam-left-top">
|
|
||||||
<div class="exam-left-num">{{ number }}/{{ questionTotal }}</div>
|
|
||||||
<div class="exam-left-type">{{ testContent.testType }}</div>
|
|
||||||
<span>({{ testContent.score }}分)</span>
|
|
||||||
<div v-if="testContent.testType === '单选题'" class="exam-left-msc">
|
|
||||||
每题只有一个正确答案
|
|
||||||
</div>
|
|
||||||
<div v-else-if="testContent.testType === '多选题'" class="exam-left-msc">
|
|
||||||
每题只有两个以上正确答案
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- 题干 -->
|
|
||||||
<div class="exam-left-test">
|
|
||||||
<div class="exam-left-test-title">
|
|
||||||
<div v-if="testContent.testType === '填空题'" class="exam-left-test-blanks">
|
|
||||||
<div v-for="(char, index) in questionParts" :key="index">
|
|
||||||
<span v-if="char.type !== 'input'">{{ char.value }}</span>
|
|
||||||
<el-input
|
|
||||||
v-else
|
|
||||||
:disabled="true"
|
|
||||||
v-model="testContent.blanks_answer[char.index - 1]"
|
|
||||||
@input="handleInput(char.totalInput)"
|
|
||||||
type="text"
|
|
||||||
placeholder="请输入答案"
|
|
||||||
class="answer-input"
|
|
||||||
></el-input>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div v-else>{{ testContent.question }}</div>
|
|
||||||
</div>
|
|
||||||
<div v-if="testContent.testType === '多选题'" class="exam-left-test-content">
|
|
||||||
<div
|
|
||||||
v-for="(item, index) in testContent.options"
|
|
||||||
ref="option"
|
|
||||||
:class="
|
|
||||||
testContent.your_answer.includes(item.item_letter) ? 'optionSelect' : ''
|
|
||||||
"
|
|
||||||
class="exam-left-test-option"
|
|
||||||
@click="optionClick($event, index, item)"
|
|
||||||
>
|
|
||||||
{{ item.item_letter }}丶{{ item.item }}
|
|
||||||
</div>
|
|
||||||
<div class="exam-left-test-result">
|
|
||||||
<span>得分：{{ testContent.score }}</span>
|
|
||||||
<span>您的答案：{{ testContent.your_answer }}</span>
|
|
||||||
<span>正确答案：{{ testContent.right_answer }}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
v-else-if="testContent.testType === '简答题'"
|
|
||||||
class="exam-left-test-content"
|
|
||||||
>
|
|
||||||
<div class="exam-left-test-shortAnswer">
|
|
||||||
<el-input
|
|
||||||
type="textarea"
|
|
||||||
:rows="14"
|
|
||||||
placeholder="请输入内容"
|
|
||||||
v-model="testContent.your_answer"
|
|
||||||
@input="inputValue"
|
|
||||||
>
|
|
||||||
</el-input>
|
|
||||||
<el-upload
|
|
||||||
class="upload-demo"
|
|
||||||
action="https://jsonplaceholder.typicode.com/posts/"
|
|
||||||
:on-preview="handlePreview"
|
|
||||||
:on-remove="handleRemove"
|
|
||||||
:file-list="fileList"
|
|
||||||
list-type="picture-card"
|
|
||||||
>
|
|
||||||
<el-button
|
|
||||||
size="small"
|
|
||||||
type="text"
|
|
||||||
style="color: #658cf6; font-size: 16px"
|
|
||||||
>
|
|
||||||
<img src="@/assets/image/attachment.png" style="width: 16px" />
|
|
||||||
附件上传</el-button
|
|
||||||
>
|
|
||||||
</el-upload>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div v-else class="exam-left-test-content">
|
|
||||||
<div
|
|
||||||
v-for="(item, index) in testContent.options"
|
|
||||||
ref="option"
|
|
||||||
:class="testContent.your_answer === item.item_letter ? 'optionSelect' : ''"
|
|
||||||
class="exam-left-test-option"
|
|
||||||
@click="optionClick($event, index, item)"
|
|
||||||
>
|
|
||||||
{{ item.item_letter }}丶{{ item.item }}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="exam-left-test-result">
|
|
||||||
<span>得分：{{ testContent.score }}</span>
|
|
||||||
<span>您的答案：{{ testContent.your_answer }}</span>
|
|
||||||
<span>正确答案：{{ testContent.right_answer }}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- 按钮 -->
|
|
||||||
<div class="exam-left-btn">
|
|
||||||
<div
|
|
||||||
:class="number === 1 ? 'exam-left-btn-pre' : 'exam-left-btn-next'"
|
|
||||||
@click="preClick"
|
|
||||||
>
|
|
||||||
上一题
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
:class="
|
|
||||||
number === questionTotal ? 'exam-left-btn-pre' : 'exam-left-btn-next'
|
|
||||||
"
|
|
||||||
style="margin-left: 164px"
|
|
||||||
@click="nextClick"
|
|
||||||
>
|
|
||||||
下一题
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="exam-right">
|
|
||||||
<div class="exam-right-title">答题卡</div>
|
|
||||||
<div class="exam-right-card">
|
|
||||||
<div class="exam-right-card-score">
|
|
||||||
<span>{{ user_name }}</span>
|
|
||||||
<span>{{ minute }} </span>
|
|
||||||
</div>
|
|
||||||
<div class="exam-right-card-time">
|
|
||||||
<span>{{ score }}分</span>
|
|
||||||
<img src="@/assets/image/nojg.png" v-if="score < passScore" />
|
|
||||||
<img src="@/assets/image/jg.png" v-else />
|
|
||||||
</div>
|
|
||||||
<div class="exam-right-card-line"></div>
|
|
||||||
<div v-if="isCache" class="exam-right-card-box">
|
|
||||||
<div v-for="(item, index) in testTypeNum" class="exam-right-card-num">
|
|
||||||
<span class="exam-right-card-num-title"
|
|
||||||
><span class="type">{{ item.type }}</span>
|
|
||||||
<span>(共{{ item.children.length }}题)</span></span
|
|
||||||
>
|
|
||||||
<div class="exam-right-card-num-item">
|
|
||||||
<span
|
|
||||||
ref="answer"
|
|
||||||
v-for="s in item.children"
|
|
||||||
:class="{
|
|
||||||
selectQuestion: s.result_desc == '对',
|
|
||||||
border: s.number === number,
|
|
||||||
}"
|
|
||||||
:style="{
|
|
||||||
'background-color':
|
|
||||||
(s.result_desc == '错' && s.kind != '简答题') ||
|
|
||||||
(s.result_desc == '缺' && s.kind != '简答题')
|
|
||||||
? 'rgba(135, 85, 96)'
|
|
||||||
: 'rgba(101, 140, 246, 0.6)',
|
|
||||||
}"
|
|
||||||
@click="testClick(s)"
|
|
||||||
>{{ s.no }}</span
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="submit" @click="handPaper"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style lang="less" scoped>
|
|
||||||
.exam-test-title {
|
|
||||||
position: absolute;
|
|
||||||
top: -40px;
|
|
||||||
font-size: 24px;
|
|
||||||
color: rgba(255, 255, 255, 1);
|
|
||||||
font-weight: 700;
|
|
||||||
left: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.exam {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
//提示弹窗
|
|
||||||
&-dialog {
|
|
||||||
width: 807px;
|
|
||||||
height: 391px;
|
|
||||||
position: fixed;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
right: 0;
|
|
||||||
bottom: 0;
|
|
||||||
margin: auto;
|
|
||||||
background-image: url("../../assets/image/prompt.png");
|
|
||||||
background-size: 100% 100%;
|
|
||||||
|
|
||||||
&-title {
|
|
||||||
text-align: center;
|
|
||||||
margin-right: 25px;
|
|
||||||
margin-top: 7px;
|
|
||||||
color: rgba(255, 255, 255, 1);
|
|
||||||
font-size: 24px;
|
|
||||||
}
|
|
||||||
|
|
||||||
&-content {
|
|
||||||
margin-top: 113px;
|
|
||||||
text-align: center;
|
|
||||||
font-size: 26px;
|
|
||||||
color: rgba(255, 255, 255, 1);
|
|
||||||
}
|
|
||||||
|
|
||||||
&-btn {
|
|
||||||
display: flex;
|
|
||||||
margin-top: 97px;
|
|
||||||
justify-content: center;
|
|
||||||
|
|
||||||
div {
|
|
||||||
width: 157px;
|
|
||||||
height: 44px;
|
|
||||||
line-height: 44px;
|
|
||||||
text-align: center;
|
|
||||||
background-size: 100% 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
&-light {
|
|
||||||
color: rgba(255, 255, 255, 1);
|
|
||||||
background-image: url("../../assets/image/highlight-btn.png");
|
|
||||||
}
|
|
||||||
|
|
||||||
&-dark {
|
|
||||||
margin-right: 82px;
|
|
||||||
color: rgba(255, 255, 255, 0.2);
|
|
||||||
background-image: url("../../assets/image/dark-btn.png");
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&-box {
|
|
||||||
width: 100%;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: space-evenly;
|
|
||||||
}
|
|
||||||
|
|
||||||
&-left::-webkit-scrollbar {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
&-left {
|
|
||||||
position: relative;
|
|
||||||
width: 1325px;
|
|
||||||
height: 858px;
|
|
||||||
background-size: 100% 100%;
|
|
||||||
background-image: url("../../assets/image/test.png");
|
|
||||||
|
|
||||||
&-top {
|
|
||||||
margin-top: 32px;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
&-type {
|
|
||||||
border: 2px solid rgba(101, 140, 246, 1);
|
|
||||||
color: rgba(101, 140, 246, 1);
|
|
||||||
padding: 0 7px;
|
|
||||||
margin-left: 20px;
|
|
||||||
font-size: 24px;
|
|
||||||
}
|
|
||||||
|
|
||||||
&-type + span {
|
|
||||||
margin: 0 10px;
|
|
||||||
color: rgba(255, 255, 255, 1);
|
|
||||||
font-size: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
&-num {
|
|
||||||
text-align: center;
|
|
||||||
font-size: 26px;
|
|
||||||
line-height: 52px;
|
|
||||||
color: rgba(255, 255, 255, 1);
|
|
||||||
width: 114px;
|
|
||||||
height: 52px;
|
|
||||||
background-size: 100% 100%;
|
|
||||||
background-image: url("../../assets/image/test-num.png");
|
|
||||||
}
|
|
||||||
|
|
||||||
&-msc {
|
|
||||||
color: rgba(255, 255, 255, 0.6);
|
|
||||||
font-size: 18px;
|
|
||||||
}
|
|
||||||
|
|
||||||
// 试卷内容
|
|
||||||
&-test {
|
|
||||||
margin-top: 33px;
|
|
||||||
padding: 0 50px;
|
|
||||||
//题目
|
|
||||||
&-title {
|
|
||||||
font-size: 24px;
|
|
||||||
line-height: 44px;
|
|
||||||
color: rgba(255, 255, 255, 1);
|
|
||||||
}
|
|
||||||
&-blanks {
|
|
||||||
display: flex;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
::v-deep .el-input__inner {
|
|
||||||
border: none;
|
|
||||||
border-radius: 0;
|
|
||||||
background: transparent;
|
|
||||||
color: #fff;
|
|
||||||
border-bottom: 1px solid #fff;
|
|
||||||
font-size: 20px;
|
|
||||||
width: 200px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
&-content::-webkit-scrollbar {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
// 选项
|
|
||||||
&-content {
|
|
||||||
margin-top: 40px;
|
|
||||||
height: 500px;
|
|
||||||
overflow-y: scroll;
|
|
||||||
}
|
|
||||||
&-result {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
span:nth-child(1) {
|
|
||||||
color: #fff;
|
|
||||||
}
|
|
||||||
span:nth-child(2) {
|
|
||||||
margin-top: 10px;
|
|
||||||
color: #ff5858;
|
|
||||||
}
|
|
||||||
span:nth-child(3) {
|
|
||||||
margin-top: 10px;
|
|
||||||
color: #4fe979;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
&-shortAnswer {
|
|
||||||
background: url("../../assets/image/shortAnswer.png") no-repeat;
|
|
||||||
background-size: 100% 100%;
|
|
||||||
height: 305px;
|
|
||||||
::v-deep .el-textarea__inner {
|
|
||||||
background: transparent;
|
|
||||||
border: none;
|
|
||||||
color: rgb(255, 255, 255);
|
|
||||||
}
|
|
||||||
::v-deep .upload-demo {
|
|
||||||
height: 160px;
|
|
||||||
display: flex;
|
|
||||||
// flex-direction: column-reverse;
|
|
||||||
margin-top: 40px;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
::v-deep .el-upload--picture-card {
|
|
||||||
background: transparent;
|
|
||||||
border: none;
|
|
||||||
border-radius: 0.375rem;
|
|
||||||
box-sizing: border-box;
|
|
||||||
width: 9.25rem;
|
|
||||||
height: 40px;
|
|
||||||
cursor: pointer;
|
|
||||||
line-height: 30px;
|
|
||||||
vertical-align: top;
|
|
||||||
position: absolute;
|
|
||||||
right: 0px;
|
|
||||||
top: -35px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
::-webkit-scrollbar {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
.optionSelect {
|
|
||||||
background-color: rgba(101, 140, 246, 0.55);
|
|
||||||
}
|
|
||||||
|
|
||||||
&-option {
|
|
||||||
width: 100%;
|
|
||||||
height: 80px;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
background-image: url("../../assets/image/test-option.png");
|
|
||||||
padding-left: 34px;
|
|
||||||
display: flex;
|
|
||||||
font-size: 22px;
|
|
||||||
color: #ffffff;
|
|
||||||
align-items: center;
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
//按钮
|
|
||||||
&-btn {
|
|
||||||
position: absolute;
|
|
||||||
bottom: 50px;
|
|
||||||
display: flex;
|
|
||||||
margin-left: -239px;
|
|
||||||
left: 50%;
|
|
||||||
|
|
||||||
&-pre,
|
|
||||||
&-next {
|
|
||||||
width: 157px;
|
|
||||||
height: 44px;
|
|
||||||
text-align: center;
|
|
||||||
line-height: 44px;
|
|
||||||
background-size: 100% 100%;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
&-pre {
|
|
||||||
color: rgba(255, 255, 255, 0.5);
|
|
||||||
background-image: url("../../assets/image/dark-btn.png");
|
|
||||||
}
|
|
||||||
|
|
||||||
&-next {
|
|
||||||
color: rgba(255, 255, 255, 1);
|
|
||||||
background-image: url("../../assets/image/highlight-btn.png");
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&-right {
|
|
||||||
position: relative;
|
|
||||||
width: 441px;
|
|
||||||
height: 858px;
|
|
||||||
background-size: 100% 100%;
|
|
||||||
background-image: url("../../assets/image/test-card.png");
|
|
||||||
|
|
||||||
//答题卡名称
|
|
||||||
&-title {
|
|
||||||
text-align: center;
|
|
||||||
font-size: 24px;
|
|
||||||
color: rgba(255, 255, 255, 1);
|
|
||||||
margin-top: 16px;
|
|
||||||
}
|
|
||||||
|
|
||||||
&-card {
|
|
||||||
font-size: 18px;
|
|
||||||
color: rgba(255, 255, 255, 1);
|
|
||||||
padding: 46px;
|
|
||||||
//提交按钮
|
|
||||||
.submit {
|
|
||||||
width: 157px;
|
|
||||||
height: 44px;
|
|
||||||
margin: 20px auto;
|
|
||||||
//left: 50%;
|
|
||||||
//margin-left: -78px;
|
|
||||||
//bottom: 50px;
|
|
||||||
background-image: url("../../assets/image/closeDetails.png");
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
&-lenged {
|
|
||||||
width: 400px;
|
|
||||||
height: 80px;
|
|
||||||
background-color: rgba(149, 149, 149, 0.2);
|
|
||||||
position: absolute;
|
|
||||||
bottom: 10px;
|
|
||||||
left: 50%;
|
|
||||||
margin-left: -200px;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
div {
|
|
||||||
span {
|
|
||||||
font-size: 14px;
|
|
||||||
margin-right: 26px;
|
|
||||||
span:last-child {
|
|
||||||
margin-right: 0;
|
|
||||||
}
|
|
||||||
i {
|
|
||||||
width: 18px;
|
|
||||||
height: 10px;
|
|
||||||
margin-right: 10px;
|
|
||||||
display: inline-block;
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
.current {
|
|
||||||
border: 2px solid rgba(101, 140, 246, 1);
|
|
||||||
}
|
|
||||||
.notDone {
|
|
||||||
background-color: rgba(0, 0, 0, 0.2);
|
|
||||||
}
|
|
||||||
.have {
|
|
||||||
background-color: rgba(64, 253, 137, 0.2);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
&-score {
|
|
||||||
justify-content: space-between;
|
|
||||||
display: flex;
|
|
||||||
font-size: 18px;
|
|
||||||
}
|
|
||||||
|
|
||||||
&-line {
|
|
||||||
border: 1px solid rgba(255, 255, 255, 0.3);
|
|
||||||
margin: 22px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
&-time {
|
|
||||||
margin-top: 37px;
|
|
||||||
position: relative;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: space-between;
|
|
||||||
span:nth-child(1) {
|
|
||||||
color: rgba(255, 189, 34, 1);
|
|
||||||
font-size: 26px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
//题目容器
|
|
||||||
&-box {
|
|
||||||
position: relative;
|
|
||||||
height: 516px;
|
|
||||||
overflow-y: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
// 滚动条
|
|
||||||
&-box::-webkit-scrollbar {
|
|
||||||
position: absolute;
|
|
||||||
left: -50px;
|
|
||||||
width: 7px; //修改滚动条宽度
|
|
||||||
background-color: rgba(107, 126, 177, 0.2);
|
|
||||||
}
|
|
||||||
|
|
||||||
&-box::-webkit-scrollbar-thumb {
|
|
||||||
border-radius: 7px;
|
|
||||||
box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
|
|
||||||
background: rgba(107, 126, 177, 1);
|
|
||||||
}
|
|
||||||
|
|
||||||
// 题目数量
|
|
||||||
&-num {
|
|
||||||
&-title {
|
|
||||||
display: block;
|
|
||||||
margin-bottom: 16px;
|
|
||||||
|
|
||||||
.type {
|
|
||||||
border: 2px solid rgba(101, 140, 246, 1);
|
|
||||||
color: rgba(101, 140, 246, 1);
|
|
||||||
padding: 0 7px;
|
|
||||||
display: inline-block;
|
|
||||||
margin-right: 8px;
|
|
||||||
font-size: 24px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&-item {
|
|
||||||
display: flex;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
.border {
|
|
||||||
box-sizing: border-box;
|
|
||||||
border: 2px solid rgba(101, 140, 246, 1);
|
|
||||||
}
|
|
||||||
.selectQuestion {
|
|
||||||
background-color: rgba(64, 253, 137, 0.2) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
span {
|
|
||||||
//display:inline-block ;
|
|
||||||
margin: 0 11px 14px 0;
|
|
||||||
width: 58px;
|
|
||||||
line-height: 38px;
|
|
||||||
text-align: center;
|
|
||||||
color: #fff;
|
|
||||||
background-color: rgba(0, 0, 0, 0.1);
|
|
||||||
height: 38px;
|
|
||||||
}
|
|
||||||
|
|
||||||
span:nth-child(5n) {
|
|
||||||
margin-right: 0 !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
@ -5,7 +5,6 @@ import {
|
||||||
savaTestAnswer,
|
savaTestAnswer,
|
||||||
getTestCache,
|
getTestCache,
|
||||||
saveTestCache,
|
saveTestCache,
|
||||||
submitPracticeTopic,
|
|
||||||
} from "@/api/user";
|
} from "@/api/user";
|
||||||
import { sortString } from "@/util/tools";
|
import { sortString } from "@/util/tools";
|
||||||
|
|
||||||
|
|
@ -81,19 +80,6 @@ export default {
|
||||||
endTime: "",
|
endTime: "",
|
||||||
countdown: "", //剩余时间
|
countdown: "", //剩余时间
|
||||||
timer: "", //定时器
|
timer: "", //定时器
|
||||||
inputArr: 0, //填空题输入框长度
|
|
||||||
fileList: [
|
|
||||||
{
|
|
||||||
name: "food.jpeg",
|
|
||||||
url:
|
|
||||||
"https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "food2.jpeg",
|
|
||||||
url:
|
|
||||||
"https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
|
@ -134,26 +120,16 @@ export default {
|
||||||
},
|
},
|
||||||
//输入框输入事件
|
//输入框输入事件
|
||||||
handleInput(index) {
|
handleInput(index) {
|
||||||
// this.inputArr = index;
|
// let filteredArr = this.testContent.blanks_answer.filter(
|
||||||
},
|
// (item) => item !== undefined && item !== null
|
||||||
inputValue(value) {
|
// );
|
||||||
this.$set(
|
console.log("value", index, this.testContent.blanks_answer,);
|
||||||
this.testList[this.number - 1],
|
index.forEach(item => {
|
||||||
"your_answer",
|
console.log(filteredArr[item-1]);
|
||||||
this.testContent.your_answer
|
});
|
||||||
);
|
if (this.testContent.testType == "填空题") {
|
||||||
},
|
|
||||||
sparseArrayToNull(arr, length) {
|
|
||||||
if (arr[length - 1] == undefined) {
|
|
||||||
arr[length - 1] = undefined;
|
|
||||||
}
|
}
|
||||||
for (let i = 0; i < arr.length; i++) {
|
|
||||||
if (arr[i] === undefined) {
|
|
||||||
// 检查稀疏数组的空洞
|
|
||||||
arr[i] = "null";
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return arr;
|
|
||||||
},
|
},
|
||||||
//交卷按钮
|
//交卷按钮
|
||||||
handPaper() {
|
handPaper() {
|
||||||
|
|
@ -162,22 +138,13 @@ export default {
|
||||||
//确定交卷按钮
|
//确定交卷按钮
|
||||||
submitTest() {
|
submitTest() {
|
||||||
let list = this.testList.map((el) => {
|
let list = this.testList.map((el) => {
|
||||||
|
console.log(el, "el");
|
||||||
if (el.question_kind == "填空题") {
|
if (el.question_kind == "填空题") {
|
||||||
const parts = el.question.split("_");
|
let filteredArr = el.blanks_answer.filter(
|
||||||
let inputNum = this.generateArray(parts);
|
(item) => item !== undefined && item !== null
|
||||||
// let filteredArr = el.blanks_answer.filter(
|
);
|
||||||
// (item) => item !== undefined && item !== null
|
|
||||||
// );
|
|
||||||
return {
|
return {
|
||||||
your_answer:
|
your_answer: filteredArr.join("__"), // 将数组元素通过 '__' 连接成字符串
|
||||||
el.blanks_answer.length != 0
|
|
||||||
? this.sparseArrayToNull(el.blanks_answer, inputNum).join("__")
|
|
||||||
: "", // 将数组元素通过 '__' 连接成字符串
|
|
||||||
theory_base_id: el.theory_base_id,
|
|
||||||
};
|
|
||||||
} else if (el.question_kind == "简答题") {
|
|
||||||
return {
|
|
||||||
your_answer: el.your_answer,
|
|
||||||
theory_base_id: el.theory_base_id,
|
theory_base_id: el.theory_base_id,
|
||||||
};
|
};
|
||||||
} else {
|
} else {
|
||||||
|
|
@ -191,17 +158,13 @@ export default {
|
||||||
});
|
});
|
||||||
let params = sessionStorage.getItem("params");
|
let params = sessionStorage.getItem("params");
|
||||||
let data = JSON.parse(params);
|
let data = JSON.parse(params);
|
||||||
|
console.log(list);
|
||||||
data.list_item_answer = list;
|
data.list_item_answer = list;
|
||||||
let formData = new FormData();
|
let formData = new FormData();
|
||||||
formData.append("data", JSON.stringify(data));
|
formData.append("data", JSON.stringify(data));
|
||||||
submitPracticeTopic(formData).then((res) => {
|
savaTestAnswer(formData).then((res) => {
|
||||||
localStorage.removeItem("countdownEndTime");
|
localStorage.removeItem("countdownEndTime");
|
||||||
this.$router.push(
|
this.$router.push("/practiceSuccess");
|
||||||
"/practiceSuccess?score=" +
|
|
||||||
res.data.data.score +
|
|
||||||
"&result_id=" +
|
|
||||||
res.data.data.result_id
|
|
||||||
);
|
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
//答题卡数据获取
|
//答题卡数据获取
|
||||||
|
|
@ -264,7 +227,7 @@ export default {
|
||||||
},
|
},
|
||||||
// 题目点击
|
// 题目点击
|
||||||
testClick(item) {
|
testClick(item) {
|
||||||
console.log(item, "xxxxxxx");
|
console.log(item,'xxxxxxx');
|
||||||
// 保存缓存
|
// 保存缓存
|
||||||
this.saveCacheData();
|
this.saveCacheData();
|
||||||
this.testContent.options = [];
|
this.testContent.options = [];
|
||||||
|
|
@ -388,22 +351,12 @@ export default {
|
||||||
// 格式化为两位数
|
// 格式化为两位数
|
||||||
return value < 10 ? `0${value}` : value;
|
return value < 10 ? `0${value}` : value;
|
||||||
},
|
},
|
||||||
generateArray(arr) {
|
generateArray(n) {
|
||||||
let count = 0;
|
let result = [];
|
||||||
for (let i = 0; i < arr.length; i++) {
|
for (let i = 1; i <= n; i++) {
|
||||||
if (i % 2 === 1) {
|
result.push(i);
|
||||||
count++;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
return count;
|
return result;
|
||||||
},
|
|
||||||
|
|
||||||
//文件处理
|
|
||||||
handleRemove(file, fileList) {
|
|
||||||
console.log(file, fileList);
|
|
||||||
},
|
|
||||||
handlePreview(file) {
|
|
||||||
console.log(file);
|
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
|
|
@ -420,19 +373,16 @@ export default {
|
||||||
computed: {
|
computed: {
|
||||||
// 将题目字符串按“-”分割，形成一个包含文本和输入框的数组
|
// 将题目字符串按“-”分割，形成一个包含文本和输入框的数组
|
||||||
questionParts() {
|
questionParts() {
|
||||||
let num = 0;
|
|
||||||
const parts = this.testContent.question.split("_");
|
const parts = this.testContent.question.split("_");
|
||||||
return parts.map((part, index) => {
|
console.log(parts,'xxxxxxxxxxxx');
|
||||||
if (index % 2 === 1) {
|
return parts
|
||||||
num++;
|
// return parts.map((part, index) => {
|
||||||
}
|
// return {
|
||||||
return {
|
// type: index % 2 === 1 ? "input" : "text",
|
||||||
type: index % 2 === 1 ? "input" : "text",
|
// value: part,
|
||||||
value: part,
|
// index: this.generateArray(parts.filter((value, i) => i % 2 === 1).length),
|
||||||
index: num,
|
// };
|
||||||
totalInput: this.generateArray(parts),
|
// });
|
||||||
};
|
|
||||||
});
|
|
||||||
},
|
},
|
||||||
timeFormatted() {
|
timeFormatted() {
|
||||||
// 将剩余时间转换为时:分:秒
|
// 将剩余时间转换为时:分:秒
|
||||||
|
|
@ -470,11 +420,11 @@ export default {
|
||||||
<div class="exam-left-test-title">
|
<div class="exam-left-test-title">
|
||||||
<div v-if="testContent.testType === '填空题'" class="exam-left-test-blanks">
|
<div v-if="testContent.testType === '填空题'" class="exam-left-test-blanks">
|
||||||
<div v-for="(char, index) in questionParts" :key="index">
|
<div v-for="(char, index) in questionParts" :key="index">
|
||||||
<span v-if="char.type !== 'input'">{{ char.value }}</span>
|
<span v-if="char !== ''">{{ char }}</span>
|
||||||
<el-input
|
<el-input
|
||||||
v-else
|
v-else
|
||||||
v-model="testContent.blanks_answer[char.index - 1]"
|
v-model="chart"
|
||||||
@input="handleInput(char.totalInput)"
|
@input="handleInput"
|
||||||
type="text"
|
type="text"
|
||||||
placeholder="请输入答案"
|
placeholder="请输入答案"
|
||||||
class="answer-input"
|
class="answer-input"
|
||||||
|
|
@ -496,38 +446,7 @@ export default {
|
||||||
{{ item.item_letter }}丶{{ item.item }}
|
{{ item.item_letter }}丶{{ item.item }}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div
|
|
||||||
v-else-if="testContent.testType === '简答题'"
|
|
||||||
class="exam-left-test-content"
|
|
||||||
>
|
|
||||||
<div class="exam-left-test-shortAnswer">
|
|
||||||
<el-input
|
|
||||||
type="textarea"
|
|
||||||
:rows="14"
|
|
||||||
placeholder="请输入内容"
|
|
||||||
v-model="testContent.your_answer"
|
|
||||||
@input="inputValue"
|
|
||||||
>
|
|
||||||
</el-input>
|
|
||||||
<el-upload
|
|
||||||
class="upload-demo"
|
|
||||||
action="https://jsonplaceholder.typicode.com/posts/"
|
|
||||||
:on-preview="handlePreview"
|
|
||||||
:on-remove="handleRemove"
|
|
||||||
:file-list="fileList"
|
|
||||||
list-type="picture-card"
|
|
||||||
>
|
|
||||||
<el-button
|
|
||||||
size="small"
|
|
||||||
type="text"
|
|
||||||
style="color: #658cf6; font-size: 16px"
|
|
||||||
>
|
|
||||||
<img src="@/assets/image/attachment.png" style="width: 16px" />
|
|
||||||
附件上传</el-button
|
|
||||||
>
|
|
||||||
</el-upload>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div v-else class="exam-left-test-content">
|
<div v-else class="exam-left-test-content">
|
||||||
<div
|
<div
|
||||||
v-for="(item, index) in testContent.options"
|
v-for="(item, index) in testContent.options"
|
||||||
|
|
@ -764,7 +683,6 @@ export default {
|
||||||
background: transparent;
|
background: transparent;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
border-bottom: 1px solid #fff;
|
border-bottom: 1px solid #fff;
|
||||||
font-size: 24px;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
&-content::-webkit-scrollbar {
|
&-content::-webkit-scrollbar {
|
||||||
|
|
@ -777,40 +695,7 @@ export default {
|
||||||
height: 500px;
|
height: 500px;
|
||||||
overflow-y: scroll;
|
overflow-y: scroll;
|
||||||
}
|
}
|
||||||
&-shortAnswer {
|
|
||||||
background: url("../../assets/image/shortAnswer.png") no-repeat;
|
|
||||||
background-size: 100% 100%;
|
|
||||||
height: 305px;
|
|
||||||
::v-deep .el-textarea__inner {
|
|
||||||
background: transparent;
|
|
||||||
border: none;
|
|
||||||
color: rgb(255, 255, 255);
|
|
||||||
}
|
|
||||||
::v-deep .upload-demo {
|
|
||||||
height: 160px;
|
|
||||||
display: flex;
|
|
||||||
// flex-direction: column-reverse;
|
|
||||||
margin-top: 40px;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
::v-deep .el-upload--picture-card {
|
|
||||||
background: transparent;
|
|
||||||
border: none;
|
|
||||||
border-radius: 0.375rem;
|
|
||||||
box-sizing: border-box;
|
|
||||||
width: 9.25rem;
|
|
||||||
height: 40px;
|
|
||||||
cursor: pointer;
|
|
||||||
line-height: 30px;
|
|
||||||
vertical-align: top;
|
|
||||||
position: absolute;
|
|
||||||
right: 0px;
|
|
||||||
top: -35px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
::-webkit-scrollbar {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
.optionSelect {
|
.optionSelect {
|
||||||
background-color: rgba(101, 140, 246, 0.55);
|
background-color: rgba(101, 140, 246, 0.55);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,5 @@
|
||||||
<script>
|
<script>
|
||||||
import { GetSubjectType, GetPractice, getPracticeRecords } from "@/api/user";
|
import { GetSubjectType, GetPractice } from "@/api/user";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: "index",
|
name: "index",
|
||||||
|
|
@ -18,8 +18,6 @@ export default {
|
||||||
// 考试场次
|
// 考试场次
|
||||||
testList: [],
|
testList: [],
|
||||||
total: 0, //总数
|
total: 0, //总数
|
||||||
isVisible: false, //考试记录弹窗
|
|
||||||
examRecordsTable: [], //考试记录表格
|
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
|
@ -27,6 +25,14 @@ export default {
|
||||||
onQuery() {
|
onQuery() {
|
||||||
this.getTestList();
|
this.getTestList();
|
||||||
},
|
},
|
||||||
|
examClick(item, index) {
|
||||||
|
// 状态切换页码初始化
|
||||||
|
this.form.PageIndex = 1;
|
||||||
|
this.examIndex = index;
|
||||||
|
this.form.state = item.state;
|
||||||
|
// 切换状态重新发送请求
|
||||||
|
this.getTestList();
|
||||||
|
},
|
||||||
getTestList() {
|
getTestList() {
|
||||||
GetPractice(this.form).then((res) => {
|
GetPractice(this.form).then((res) => {
|
||||||
this.testList = res.data.data;
|
this.testList = res.data.data;
|
||||||
|
|
@ -51,38 +57,6 @@ export default {
|
||||||
sessionStorage.setItem("testMsg", JSON.stringify(testMsg));
|
sessionStorage.setItem("testMsg", JSON.stringify(testMsg));
|
||||||
sessionStorage.setItem("params", JSON.stringify(data));
|
sessionStorage.setItem("params", JSON.stringify(data));
|
||||||
},
|
},
|
||||||
//练习记录
|
|
||||||
enterExamRecords(row) {
|
|
||||||
let dataMap = {
|
|
||||||
batch_id: row.batch_id,
|
|
||||||
user_id: this.form.user_id,
|
|
||||||
};
|
|
||||||
getPracticeRecords(dataMap)
|
|
||||||
.then((res) => {
|
|
||||||
this.examRecordsTable = res.data.data;
|
|
||||||
this.isVisible = true;
|
|
||||||
})
|
|
||||||
.catch((err) => {
|
|
||||||
console.log(err);
|
|
||||||
});
|
|
||||||
},
|
|
||||||
//查看考试详情
|
|
||||||
goDetails(row){
|
|
||||||
console.log(row,'行');
|
|
||||||
this.$router.push(
|
|
||||||
`/examDetails?id=${row.result_id}&score=${row.score}&user_id=${this.form.user_id}&examine_time=${row.examine_time}&exam_name=${row.exam_name}&pass_score=${row.pass_score}`
|
|
||||||
);
|
|
||||||
let data = {
|
|
||||||
user_id: this.form.user_id,
|
|
||||||
batch_id: row.result_id,
|
|
||||||
list_item_answer: [],
|
|
||||||
};
|
|
||||||
sessionStorage.setItem("params", JSON.stringify(data));
|
|
||||||
},
|
|
||||||
//关闭练习记录
|
|
||||||
closeExamRecords() {
|
|
||||||
this.isVisible = false;
|
|
||||||
},
|
|
||||||
currentChange(current) {
|
currentChange(current) {
|
||||||
this.form.PageIndex = current;
|
this.form.PageIndex = current;
|
||||||
this.getTestList();
|
this.getTestList();
|
||||||
|
|
@ -119,15 +93,6 @@ export default {
|
||||||
console.log(err);
|
console.log(err);
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
//表格样式
|
|
||||||
tableRowClassName({ row, rowIndex }) {
|
|
||||||
if (rowIndex % 2 == 1) {
|
|
||||||
return "warning-row";
|
|
||||||
} else {
|
|
||||||
return "success-row";
|
|
||||||
}
|
|
||||||
return "";
|
|
||||||
},
|
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
// 用户id赋值
|
// 用户id赋值
|
||||||
|
|
@ -183,11 +148,7 @@ export default {
|
||||||
<div class="test-box-site-item-btn">
|
<div class="test-box-site-item-btn">
|
||||||
<!-- <span> 考试记录 </span> -->
|
<!-- <span> 考试记录 </span> -->
|
||||||
<span>
|
<span>
|
||||||
<img
|
<img src="@/assets/image/ksjl.png" />
|
||||||
src="@/assets/image/ksjl.png"
|
|
||||||
v-show="item.ks_count > 0"
|
|
||||||
@click="enterExamRecords(item)"
|
|
||||||
/>
|
|
||||||
</span>
|
</span>
|
||||||
<!-- <div class="time" v-if="item.batch_state.trim() === '未开始'">
|
<!-- <div class="time" v-if="item.batch_state.trim() === '未开始'">
|
||||||
{{ getCountdown(item.start_time) }}
|
{{ getCountdown(item.start_time) }}
|
||||||
|
|
@ -206,39 +167,11 @@ export default {
|
||||||
@current-change="currentChange"
|
@current-change="currentChange"
|
||||||
:current-page="form.PageIndex"
|
:current-page="form.PageIndex"
|
||||||
layout="prev, pager, next"
|
layout="prev, pager, next"
|
||||||
:page-size="form.PageSize"
|
:page-size="8"
|
||||||
:total="total"
|
:total="total"
|
||||||
>
|
>
|
||||||
</el-pagination>
|
</el-pagination>
|
||||||
</div>
|
</div>
|
||||||
<!-- 考试记录弹窗 -->
|
|
||||||
<div class="examRecords" v-if="isVisible">
|
|
||||||
<div class="examRecords-title">
|
|
||||||
<span>考试记录</span>
|
|
||||||
<img src="@/assets/image/close.png" @click="closeExamRecords" />
|
|
||||||
</div>
|
|
||||||
<div class="diyTable">
|
|
||||||
<el-table
|
|
||||||
class="my-el-table"
|
|
||||||
:data="examRecordsTable"
|
|
||||||
height="320"
|
|
||||||
:header-cell-style="{
|
|
||||||
background: 'rgba(131, 129, 177, 0.5) !important',
|
|
||||||
color: '#ededed !important',
|
|
||||||
}"
|
|
||||||
:row-class-name="tableRowClassName"
|
|
||||||
>
|
|
||||||
<el-table-column type="index" label="序号" align="center" />
|
|
||||||
<el-table-column prop="examine_time" label="考试时间" align="center" />
|
|
||||||
<el-table-column prop="score" label="考试成绩" align="center" />
|
|
||||||
<el-table-column label="操作" align="center">
|
|
||||||
<template slot-scope="scope">
|
|
||||||
<el-button type="primary" size="small" @click="goDetails(scope.row)">查看详情</el-button>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
</el-table>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
@ -455,87 +388,5 @@ export default {
|
||||||
margin-right: 0;
|
margin-right: 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.examRecords {
|
|
||||||
position: fixed; /* Stay in place */
|
|
||||||
// z-index: 1; /* Sit on top */
|
|
||||||
left: 28%;
|
|
||||||
top: 30%;
|
|
||||||
transform: translate(-50%, -50%);
|
|
||||||
width: 807px; /* Could be more or less, depending on screen size */
|
|
||||||
height: 391px;
|
|
||||||
background: #fff;
|
|
||||||
border-radius: 5px;
|
|
||||||
padding: 0 20px;
|
|
||||||
background: url("@/assets/image/examRecords.png") no-repeat;
|
|
||||||
background-size: 100% 100%;
|
|
||||||
animation: popup-enter 0.7s ease-out forwards;
|
|
||||||
&-title {
|
|
||||||
height: 40px;
|
|
||||||
font-size: 24px;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
color: #fff;
|
|
||||||
span {
|
|
||||||
left: 42%;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
img {
|
|
||||||
cursor: pointer;
|
|
||||||
margin-left: auto;
|
|
||||||
margin-top: 20px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@keyframes popup-enter {
|
|
||||||
from {
|
|
||||||
opacity: 0;
|
|
||||||
transform: translateY(-20px);
|
|
||||||
}
|
|
||||||
to {
|
|
||||||
opacity: 1;
|
|
||||||
transform: translateY(0);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.diyTable {
|
|
||||||
margin-top: 20px;
|
|
||||||
}
|
|
||||||
::v-deep .my-el-table {
|
|
||||||
overflow-x: hidden;
|
|
||||||
.el-table__header-wrapper {
|
|
||||||
.el-table__header {
|
|
||||||
width: calc(100% + 32px) !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.el-table__body-wrapper {
|
|
||||||
width: calc(100% + 20px) !important;
|
|
||||||
.el-table__body {
|
|
||||||
width: calc(100% + 20px) !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.el-table__body tr:hover > td {
|
|
||||||
background-color: transparent;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
// 去掉table表格底部白色线条
|
|
||||||
::v-deep .el-table::before {
|
|
||||||
background-color: transparent;
|
|
||||||
}
|
|
||||||
::v-deep .el-table td.el-table__cell,
|
|
||||||
::v-deep .el-table th.el-table__cell.is-leaf {
|
|
||||||
border: none;
|
|
||||||
}
|
|
||||||
::v-deep .el-table__row.warning-row {
|
|
||||||
background: rgba(60, 58, 74, 0.15) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
::v-deep .el-table__row.success-row {
|
|
||||||
background: rgba(131, 129, 177, 0.2) !important;
|
|
||||||
}
|
|
||||||
::v-deep .el-table tr {
|
|
||||||
color: #fff;
|
|
||||||
background-color: transparent;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
||||||
|
|
@ -1,12 +1,8 @@
|
||||||
<script>
|
<script>
|
||||||
import { getDetailsMap } from "@/api/user";
|
|
||||||
export default {
|
export default {
|
||||||
name: "practiceSuccess",
|
name: "practiceSuccess",
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {};
|
||||||
score: 0,
|
|
||||||
detailsMap: {},
|
|
||||||
};
|
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
// 进入考场选择页面
|
// 进入考场选择页面
|
||||||
|
|
@ -15,28 +11,6 @@ export default {
|
||||||
let data = JSON.parse(params);
|
let data = JSON.parse(params);
|
||||||
this.$router.push("/examModule?" + data.user_id);
|
this.$router.push("/examModule?" + data.user_id);
|
||||||
},
|
},
|
||||||
//进入详情页面
|
|
||||||
goDetails() {
|
|
||||||
let params = sessionStorage.getItem("params");
|
|
||||||
let data = JSON.parse(params);
|
|
||||||
this.$router.push(
|
|
||||||
`/examDetails?id=${this.detailsMap.result_id}&score=${this.detailsMap.score}&user_id=${data.user_id}&examine_time=${this.detailsMap.examine_time}&exam_name=${this.detailsMap.exam_name}&pass_score=${this.detailsMap.pass_score}`
|
|
||||||
);
|
|
||||||
},
|
|
||||||
//通过resultId获取需要传到详情页的数据
|
|
||||||
getDetailsData() {
|
|
||||||
getDetailsMap({ result_id: this.$route.query.result_id })
|
|
||||||
.then((res) => {
|
|
||||||
this.detailsMap = res.data.data;
|
|
||||||
})
|
|
||||||
.catch((err) => {
|
|
||||||
console.log(err);
|
|
||||||
});
|
|
||||||
},
|
|
||||||
},
|
|
||||||
mounted() {
|
|
||||||
this.score = this.$route.query.score;
|
|
||||||
this.getDetailsData();
|
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
@ -46,11 +20,11 @@ export default {
|
||||||
<div class="success-page">
|
<div class="success-page">
|
||||||
<div class="success-font">您已成功交卷，请继续下一场考试。</div>
|
<div class="success-font">您已成功交卷，请继续下一场考试。</div>
|
||||||
<div class="success-score">
|
<div class="success-score">
|
||||||
<p class="score">{{ score }}</p>
|
<p class="score">60</p>
|
||||||
<p class="unit">分</p>
|
<p class="unit">分</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="success-btn">
|
<div class="success-btn">
|
||||||
<img @click="goDetails" src="@/assets/image/viewAnalysis.png" />
|
<img src="@/assets/image/viewAnalysis.png" />
|
||||||
<img @click="determine" src="@/assets/image/returnList.png" />
|
<img @click="determine" src="@/assets/image/returnList.png" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -105,8 +79,8 @@ export default {
|
||||||
// background-image: url("../../assets/image/highlight-btn.png");
|
// background-image: url("../../assets/image/highlight-btn.png");
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
img {
|
img{
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue