Skip to content

Z
zhengyuan-danger-chemistry-manage
Commit 5e599d6e authored by 纪泽龙's avatar 纪泽龙
Browse files
Options

Merge branch 'jzl'

parents 6561b1d1 525c5db6
Hide whitespace changes
Inline Side-by-side
Showing with 1971 additions and 976 deletions
danger-manage-web/src/api/educationPlanExam/lessonsProgram.js
View file @ 5e599d6e
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
* @Author: 纪泽龙 jizelong@qq.com * @Author: 纪泽龙 jizelong@qq.com
* @Date: 2022-09-23 11:02:24 * @Date: 2022-09-23 11:02:24
* @LastEditors: 纪泽龙 jizelong@qq.com * @LastEditors: 纪泽龙 jizelong@qq.com
* @LastEditTime: 2022-12-28 09:57:47 * @LastEditTime: 2023-01-29 14:53:07
* @FilePath: /danger-manage-web/src/api/educationPlanExam/trainingProgram.js * @FilePath: /danger-manage-web/src/api/educationPlanExam/trainingProgram.js
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/ */
...@@ -186,3 +186,10 @@ export function bachAddTopic(data) { ...@@ -186,3 +186,10 @@ export function bachAddTopic(data) {
}) })
} }
export function bachAddTopicGuest(data) {
return request({
url: '/contractTrainTopic/bachAddTopic',
method: 'post',
data: data
})
}
danger-manage-web/src/views/educationPlanExam/lessonsProgram/components/AddQuestion.vue
View file @ 5e599d6e
...@@ -276,7 +276,6 @@ export default { ...@@ -276,7 +276,6 @@ export default {
// 新增选项 // 新增选项
add(addValue) { add(addValue) {
this.form.questions.push({ value: addValue }); this.form.questions.push({ value: addValue });
console.log();
}, },
save(num = 2) { save(num = 2) {
return new Promise((resove) => { return new Promise((resove) => {
......
danger-manage-web/src/views/educationPlanExam/visitorProgram/ChangeQuestion.vue 0 → 100644
View file @ 5e599d6e
<!--
* @Author: 纪泽龙 jizelong@qq.com
* @Date: 2022-12-27 09:30:19
* @LastEditors: 纪泽龙 jizelong@qq.com
* @LastEditTime: 2023-01-29 14:52:33
* @FilePath: /danger-manage-web/src/views/educationPlanExam/textPaper/components/ChangeQuestion.vue
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
<div class="table-wrapper">
<el-form :model="queryParams" ref="queryForm" :inline="true">
<el-form-item label="所属单位" prop="deptId" ref="treeItem">
<Treeselect
class="tree"
v-model="queryParams.deptId"
:options="deptOptions"
:show-count="true"
placeholder="请选择归属部门"
style="width: 200px"
/>
</el-form-item>
<el-form-item label="题库名称" prop="bankName">
<el-input
v-model="queryParams.bankName"
placeholder="考试时间"
clearable
size="small"
/>
</el-form-item>
<el-form-item>
<el-button
type="primary"
icon="el-icon-search"
size="mini"
@click="search"
>搜索</el-button
>
<el-button icon="el-icon-refresh" size="mini" @click="resetClick"
>重置</el-button
>
</el-form-item>
</el-form>
<el-table v-loading="loading" :data="list" height="435" ref="multipleTable">
<!-- <el-table-column type="selection"></el-table-column> -->
<el-table-column label="" align="center" prop="profession">
<template v-slot="{ row }">
<!-- <div> -->
<el-checkbox
:disabled="row.numberQuestions == 0"
v-model="row.checked"
></el-checkbox>
<!-- </div> -->
</template>
</el-table-column>
<el-table-column label="题库名称" align="center" prop="bankName">
</el-table-column>
<el-table-column label="所属单位" align="center" prop="courseType">
<template v-slot="scope">
<div>
{{ selectList(deptOptions, scope.row.deptId) || "-" }}
</div>
</template>
</el-table-column>
<el-table-column
label="包含题目数量"
align="center"
prop="numberQuestions"
:formatter="formatter"
>
</el-table-column>
<el-table-column label="选取题目数量" align="center" prop="profession">
<template v-slot="{ row }">
<div>
<!-- <el-input
:disabled="!row.checked|| row.numberQuestions==0 "
v-model="row.changeNum"
size="mini"
style="width: 100px"
></el-input> -->
<el-input-number
v-model="row.changeNum"
:disabled="!row.checked || row.numberQuestions == 0"
size="mini"
:min="1"
:max="+row.numberQuestions ? +row.numberQuestions : 1000000"
label="描述文字"
></el-input-number>
</div>
</template>
</el-table-column>
</el-table>
<!-- <div> -->
<el-pagination
:layout="'prev, pager, next'"
v-show="total > 0"
:total="total"
:current-page="queryParams.pageNum"
:page-sizes="[queryParams.pageSize]"
@current-change="currentChangeClick"
/>
</div>
</template>
<script>
import { listBank, delBank } from "@/api/educationPlanExam/questionBank";
import { bachAddTopicGuest } from "@/api/educationPlanExam/lessonsProgram.js";
// 部门列表
import { treeselect } from "@/api/system/dept";
import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
export default {
name: "",
components: {
Treeselect,
},
props: {
courseId: {
type: Number,
},
},
data() {
return {
queryParams: {
deptId: null,
courseName: "",
pageNum: 1,
pageSize: 10,
},
list: [
{
checked: false,
},
],
total: 20,
loading: false,
// 题库id
deptId: null,
// 归属部门列表
deptOptions: [],
};
},
created() {
this.getList();
this.getTreeselect();
},
methods: {
getTreeselect() {
treeselect().then((response) => {
this.deptOptions = response.data;
// console.log("123", this.deptOptions);
// console.log(this.selectList(this.deptOptions, 175));
});
},
// 递归查值的方法
selectList(list, id) {
for (let i = 0; i < list.length; i++) {
let item = list[i];
if (item.id == id) {
return item.label;
} else {
if (Array.isArray(item.children)) {
let a = this.selectList(item.children, id);
if (a) {
return a;
}
}
}
}
},
getList() {
this.loading = true;
listBank(this.queryParams)
.then((res) => {
console.log(res);
this.list = res.rows.map((item, index) => {
return {
bankNum:
index +
1 +
(this.queryParams.pageNum - 1) * this.queryParams.pageSize,
checked: false,
changeNum: 0,
...item,
};
});
this.total = res.total;
})
.finally(() => {
this.loading = false;
});
},
saveAndNext() {
const topicInfos = this.list
.filter((item) => item.checked)
.map((item) => {
return {
bankId: item.bankId,
quan: item.changeNum,
};
});
console.log(this.courseId, topicInfos);
const data = { courseId: this.courseId, topicInfos };
console.log(data);
bachAddTopicGuest(data).then((res) => {
console.log(res);
if (res.code == 200) {
// this.$parent.$parent.componentsNumChange(2);
this.$parent.$parent.getContractTopicList(this.courseId);
this.$parent.$parent.dialogVisible2=false;
}
});
},
resetClick() {},
search() {
this.getList();
},
currentChangeClick() {},
formatter(row, column, cellValue, index) {
// console.log(row, column, cellValue, index);
if (!cellValue) return "-";
else return cellValue;
},
},
};
</script>
<style lang="scss" scoped>
.table-wrapper {
padding-top: 22px;
width: 100%;
height: 550px;
overflow: hidden;
// padding-bottom: 10px;
margin-bottom: 20px;
}
</style>
danger-manage-web/src/views/educationPlanExam/visitorProgram/index.vue
View file @ 5e599d6e
<template> <template>
<div class="form-wrapper"> <div class="form-wrapper">
<div style="width: 100%;height:100%;"> <div style="width: 100%; height: 100%">
<el-form :model="contractTrainForm" :rules="rules" ref="contractTrainForm" label-width="100px" class="demo-ruleForm"> <el-form
<el-form-item label="培训名称" prop="courseName"> :model="contractTrainForm"
<el-input v-model="contractTrainForm.courseName"></el-input> :rules="rules"
</el-form-item> ref="contractTrainForm"
<el-form-item label="培训内容" prop="courseConent"> label-width="100px"
<el-input type="textarea" v-model="contractTrainForm.courseConent" rows="5"></el-input> class="demo-ruleForm"
</el-form-item> >
<div class="flex"> <el-form-item label="培训名称" prop="courseName">
<el-form-item label="视频上传" v-if="!readOnly" prop="video"> <el-input v-model="contractTrainForm.courseName"></el-input>
<FileUpload </el-form-item>
listType="picture" <el-form-item label="培训内容" prop="courseConent">
@resFun="getFileInfoVideo" <el-input
@remove="listRemoveVideo" type="textarea"
:fileArr="fileListVideo" v-model="contractTrainForm.courseConent"
:fileSize="500" rows="5"
:fileType="['mp4']" ></el-input>
/> </el-form-item>
<el-input v-show="false" disabled v-model="contractTrainForm.video"></el-input> <div class="flex">
</el-form-item> <el-form-item label="视频上传" v-if="!readOnly" prop="video">
<el-form-item label="附件上传" v-if="!readOnly" prop="enclosure"> <FileUpload
<FileUpload listType="picture"
listType="picture" @resFun="getFileInfoVideo"
@resFun="getFileInfoFile" @remove="listRemoveVideo"
@remove="listRemoveFile" :fileArr="fileListVideo"
:fileArr="fileListFile" :fileSize="500"
/> :fileType="['mp4']"
<el-input v-show="false" disabled v-model="contractTrainForm.enclosure"></el-input> />
</el-form-item> <el-input
</div> v-show="false"
</el-form> disabled
v-model="contractTrainForm.video"
></el-input>
</el-form-item>
<el-form-item label="附件上传" v-if="!readOnly" prop="enclosure">
<FileUpload
listType="picture"
@resFun="getFileInfoFile"
@remove="listRemoveFile"
:fileArr="fileListFile"
/>
<el-input
v-show="false"
disabled
v-model="contractTrainForm.enclosure"
></el-input>
</el-form-item>
</div> </div>
<visitorQuestion ref="visitorQuestion"></visitorQuestion> </el-form>
</div> </div>
<visitorQuestion ref="visitorQuestion"></visitorQuestion>
</div>
</template> </template>
<script> <script>
import FileUpload from "@/components/FileUpload"; import FileUpload from "@/components/FileUpload";
import uploadfile from "@/assets/uploadfile.png"; import uploadfile from "@/assets/uploadfile.png";
import visitorQuestion from "@/views/educationPlanExam/visitorProgram/visitorQuestion"; import visitorQuestion from "@/views/educationPlanExam/visitorProgram/visitorQuestion";
import {listCourse} from "@/api/contractTrain/contractTrain"; import { listCourse } from "@/api/contractTrain/contractTrain";
export default { export default {
data() { data() {
return { return {
contractTrainForm: { contractTrainForm: {
courseName: '', courseName: "",
courseConent: '', courseConent: "",
video: "", video: "",
enclosure: "", enclosure: "",
}, },
fileListVideo: [], fileListVideo: [],
fileListFile: [], fileListFile: [],
readOnly: false, readOnly: false,
rules: { rules: {
name: [ name: [{ required: true, message: "请输入培训名称", trigger: "blur" }],
{ required: true, message: '请输入培训名称', trigger: 'blur' } region: [
], { required: true, message: "请输入培训内容", trigger: "change" },
region: [ ],
{ required: true, message: '请输入培训内容', trigger: 'change' } video: [{ required: true, trigger: "blue", message: "视频不能为空" }],
], enclosure: [
video: [ { required: true, trigger: "blur", message: "附件不能为空" },
{ required: true, trigger: "blue", message: "视频不能为空" } ],
], },
enclosure: [ };
{ required: true, trigger: "blur", message: "附件不能为空" }, },
], components: {
FileUpload,
visitorQuestion,
},
created() {
this.getContractTrainList();
},
methods: {
getContractTrainList() {
listCourse().then((res) => {
this.contractTrainForm = res.rows[0];
console.log("this.contractTrainForm", this.contractTrainForm);
if (this.contractTrainForm.video) {
this.fileListVideo = [
{
name: this.contractTrainForm.courseName + "视频",
url: uploadfile,
},
];
}
if (this.contractTrainForm.enclosure) {
this.fileListFile = [
{
name: this.contractTrainForm.courseName + "附件",
url: uploadfile,
},
];
}
// this.$refs.visitorQuestion.rightNum =
// this.contractTrainForm.qualifiedNum;
this.$refs.visitorQuestion.bottomFrom = {
judgmentScore: this.contractTrainForm.judgmentScore || 0,
multipleChoiceScore: this.contractTrainForm.multipleChoiceScore || 0,
qualifiedNum: this.contractTrainForm.qualifiedNum || 0,
singleChoiceScore: this.contractTrainForm.singleChoiceScore || 0,
};
this.$refs.visitorQuestion.getContractTopicList(
this.contractTrainForm.contractorCourseId
);
});
},
submitForm(formName) {
this.$refs[formName].validate((valid) => {
if (valid) {
alert("submit!");
} else {
console.log("error submit!!");
return false;
}
});
},
getFileInfoVideo(res) {
this.contractTrainForm.video = res.url;
this.fileListVideo = [
{
name: res.fileName,
url: uploadfile,
}, },
}; ];
}, },
components: { listRemoveVideo(e) {
FileUpload, this.fileListVideo = [];
visitorQuestion, this.contractTrainForm.video = "";
// this.form.videoName = null;
}, },
created() { getFileInfoFile(res) {
this.getContractTrainList(); this.contractTrainForm.enclosure = res.url;
this.fileListFile = [
{
name: res.fileName,
url: uploadfile,
},
];
}, },
methods: { listRemoveFile(e) {
getContractTrainList(){ this.fileListFild = [];
listCourse().then(res =>{ this.contractTrainForm.enclosure = "";
this.contractTrainForm = res.rows[0]; // this.form.fileName = null;
if(this.contractTrainForm.video){ },
this.fileListVideo = [ },
{ };
name: this.contractTrainForm.courseName + "视频",
url: uploadfile,
},
];
}
if(this.contractTrainForm.enclosure){
this.fileListFile = [
{
name: this.contractTrainForm.courseName + "附件",
url: uploadfile,
},
];
}
this.$refs.visitorQuestion.rightNum = this.contractTrainForm.qualifiedNum;
this.$refs.visitorQuestion.getContractTopicList(this.contractTrainForm.contractorCourseId)
})
},
submitForm(formName) {
this.$refs[formName].validate((valid) => {
if (valid) {
alert('submit!');
} else {
console.log('error submit!!');
return false;
}
});
},
getFileInfoVideo(res) {
this.contractTrainForm.video = res.url;
this.fileListVideo = [
{
name: res.fileName,
url: uploadfile,
},
];
},
listRemoveVideo(e) {
this.fileListVideo = [];
this.contractTrainForm.video = "";
// this.form.videoName = null;
},
getFileInfoFile(res) {
this.contractTrainForm.enclosure = res.url;
this.fileListFile = [
{
name: res.fileName,
url: uploadfile,
},
];
},
listRemoveFile(e) {
this.fileListFild = [];
this.contractTrainForm.enclosure = "";
// this.form.fileName = null;
},
}
}
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.form-wrapper { .form-wrapper {
...@@ -148,7 +174,7 @@ ...@@ -148,7 +174,7 @@
height: 100%; height: 100%;
margin-bottom: 20px; margin-bottom: 20px;
} }
.flex{ .flex {
width: 100%; width: 100%;
justify-content: space-around; justify-content: space-around;
padding: 20px 30px; padding: 20px 30px;
......
danger-manage-web/src/views/educationPlanExam/visitorProgram/visitorAdd.vue
View file @ 5e599d6e
<template> <template>
<div ref="myBody" class="add-question flex"> <div ref="myBody" class="add-question flex">
<div class="text flex"> <div class="text flex">
<div class="left"> <div class="left">
目前录入题目是第<span>{{ questionNextNum }}</span 目前录入题目是第<span>{{ questionNextNum }}</span
>道题 >道题
</div> </div>
<div>
<el-radio-group
v-model="form.topicType"
size="mini"
@input="topicTypeChange"
>
<el-radio-button :label="1">单选</el-radio-button>
<el-radio-button :label="2">多选</el-radio-button>
<el-radio-button :label="3">判断</el-radio-button>
</el-radio-group>
</div> </div>
<el-form class="form flex" ref="form" :model="form" label-width="auto"> </div>
<!-- <div class="top flex"> --> <el-form class="form flex" ref="form" :model="form" label-width="auto">
<div> <!-- <div class="top flex"> -->
<el-form-item <div>
label="题目" <el-form-item
prop="topicTitle" label="题目"
:rules="{ prop="topicTitle"
required: true, :rules="{
message: '必须输入题目内容', required: true,
trigger: 'blur', message: '必须输入题目内容',
}" trigger: 'blur',
}"
>
<el-input
type="textarea"
placeholder="多行输入"
resize="none"
rows="4"
v-model="form.topicTitle"
> >
</el-input>
</el-form-item>
</div>
<div class="bottom">
<!-- <el-form-item label="选项1" prop="title">
<el-input v-model="form.title" placeholder="请输入"></el-input>
</el-form-item> -->
<el-form-item
v-for="(question, index) in form.questions"
:label="'选项' + (index + 1)"
:key="question.key"
:prop="'questions.' + index + '.value'"
:rules="
index === 0
? {
required: true,
message: '第一项不能为空不能为空',
trigger: 'blur',
}
: {}
"
>
<div class="add-select flex">
<el-input
type="textarea"
placeholder="多行输入"
style="flex: 1; margin-right: 10px"
rows="2"
v-model="question.value"
></el-input>
<div class="flex algin-items">
<el-button
@click="rightAnswerClick(index)"
class="right"
:class="{
active: answerNum.indexOf(index) >= 0,
}"
icon="el-icon-check"
>
设为答案
</el-button>
<el-button
size="mini"
type="danger"
v-if="index > 0"
@click.prevent="removeDomain(question)"
plain
icon="el-icon-delete"
>删除</el-button
>
</div>
</div>
</el-form-item>
<!-- <el-form-item
class="noAttr"
:label="`选项${form.questions.length + 1}`"
prop=""
>
<div class="add-select flex">
<el-input <el-input
type="textarea" type="textarea"
placeholder="多行输入" placeholder="多行输入"
resize="none" resize="none"
rows="4" rows="2"
v-model="form.topicTitle" v-model="addValue"
style="flex: 1; margin-right: 10px"
> >
</el-input> </el-input>
</el-form-item> <div class="flex algin-items">
</div> <el-button
@click="rightAnswerClick(form.questions.length)"
<div class="bottom"> class="right"
<!-- <el-form-item label="选项1" prop="title"> :class="{ active: answerNum === form.questions.length }"
<el-input v-model="form.title" placeholder="请输入"></el-input> icon="el-icon-check"
</el-form-item> -->
<el-form-item
v-for="(question, index) in form.questions"
:label="'选项' + (index + 1)"
:key="question.key"
:prop="'questions.' + index + '.value'"
:rules="
index === 0
? {
required: true,
message: '第一项不能为空不能为空',
trigger: 'blur',
}
: {}
"
>
<div class="add-select flex">
<el-input
type="textarea"
placeholder="多行输入"
style="flex: 1; margin-right: 10px"
rows="2"
v-model="question.value"
></el-input>
<div class="flex algin-items">
<el-button
@click="rightAnswerClick(index)"
class="right"
:class="{ active: answerNum === index }"
icon="el-icon-check"
>
设为答案
</el-button>
<el-button
size="mini"
type="danger"
v-if="index > 0"
@click.prevent="removeDomain(question)"
plain
icon="el-icon-delete"
>删除</el-button
>
</div>
</div>
</el-form-item>
<el-form-item
class="noAttr"
:label="`选项${form.questions.length + 1}`"
prop=""
>
<div class="add-select flex">
<el-input
type="textarea"
placeholder="多行输入"
resize="none"
rows="2"
v-model="addValue"
style="flex: 1; margin-right: 10px"
> >
</el-input> 设为答案
<div class="flex algin-items"> </el-button>
<el-button
@click="rightAnswerClick(form.questions.length)"
class="right"
:class="{ active: answerNum === form.questions.length }"
icon="el-icon-check"
>
设为答案
</el-button>
<el-button <el-button
size="mini" size="mini"
class="right1" class="right1"
@click.prevent="add(addValue)" @click.prevent="add(addValue)"
icon="el-icon-plus" icon="el-icon-plus"
>新增</el-button >新增</el-button
> >
</div>
</div> </div>
</el-form-item> </div>
</el-form-item> -->
<div style="padding-left: 55px" v-if="form.topicType != 3">
<el-button size="mini" type="primary" @click.prevent="add(addValue)"
>新增选项</el-button
>
</div> </div>
</el-form> </div>
</div> </el-form>
</template> </div>
</template>
<script> <script>
export default { export default {
name: "AnswerLesson", name: "AnswerLesson",
data() { data() {
return { return {
form: { form: {
topicTitle: "", topicType: 1,
questions: [{ value: "" }, { value: "" }, { value: "" }], topicTitle: "",
}, questions: [{ value: "" }, { value: "" }],
answerNum: null, },
addValue: "", answerNum: [],
// 录入的是第几道题 addValue: "",
questionNextNum: 1, // 录入的是第几道题
courseName: "", questionNextNum: 1,
}; courseName: "",
}, };
},
created() {
created() {},
methods: {
topicTypeChange(num) {
if (num == 1) {
this.answerNum = [];
} else if (num == 2) {
this.answerNum = [];
// this.form.questions=[{ value: "" }, { value: "" }];
} else {
this.answerNum = [];
const form = {
topicType: 3,
topicTitle: this.form.topicTitle,
questions: [{ value: "对" }, { value: "错" }],
};
this.form = form;
}
}, },
methods: { //设置正确答案
//设置正确答案 // rightAnswerClick(index) {
rightAnswerClick(index) { // this.answerNum = index;
this.answerNum = index; // },
}, rightAnswerClick(index) {
// 删除选项 if (this.form.topicType === 2) {
removeDomain(question) { const ind = this.answerNum.indexOf(index);
const index = this.form.questions.indexOf(question); if (ind < 0) {
// 如果是正确答案,就让正确答案清空 this.answerNum.push(index);
if (this.answerNum === index) { } else {
this.answerNum = null; this.answerNum.splice(ind, 1);
}
if (index >= 0) {
this.form.questions.splice(index, 1);
} }
}, this.answerNum = this.answerNum.sort((a, b) => {
// 新增选项 return a - b;
add(addValue) { });
this.form.questions.push({ value: addValue }); console.log(this.answerNum);
}, } else {
reset() { // 判断跟单选模式差不多
this.form = { this.answerNum = [index];
topicTitle: "", }
questions: [{ value: "" }, { value: "" }, { value: "" }],
};
this.answerNum = null;
this.addValue = "";
},
}, },
}; // 删除选项
</script> // removeDomain(question) {
// const index = this.form.questions.indexOf(question);
// // 如果是正确答案,就让正确答案清空
// if (this.answerNum === index) {
// this.answerNum = null;
// }
// if (index >= 0) {
// this.form.questions.splice(index, 1);
// }
// },
removeDomain(question) {
const index = this.form.questions.indexOf(question);
console.log(index);
// 如果是正确答案,就让正确答案清空
const ind = this.answerNum.indexOf(index);
if (ind >= 0) {
this.answerNum.splice(ind, 1);
}
// 如果是最后一位呗删除，那不用管，如果不是最后一位置，这一位删除之后，则这一位后面的所有数字都要-1;
if (index != this.form.questions.length - 1) {
this.answerNum = this.answerNum.map((item, i) => {
if (item >= index) {
return item - 1;
} else {
return item;
}
});
}
if (index >= 0) {
this.form.questions.splice(index, 1);
}
console.log(this.answerNum);
// console.log(this.form.questions)
},
// 新增选项
add(addValue) {
this.form.questions.push({ value: addValue });
},
reset() {
this.form = {
topicTitle: "",
questions: [{ value: "" }, { value: "" }],
};
this.answerNum = null;
this.addValue = "";
},
},
};
</script>
<style lang="scss" scoped> <style lang="scss" scoped>
.add-question { .add-question {
width: 100%; width: 100%;
height: 250px; height: 250px;
// overflow: hidden; // overflow: hidden;
flex-direction: column;
padding-bottom: 7px;
margin-bottom: 20px;
border-bottom: 1px solid #bbbbbb;
justify-content: space-between;
.form {
flex: 1;
flex-direction: column; flex-direction: column;
padding-bottom: 7px; height: 100%;
margin-bottom: 20px; .bottom {
border-bottom: 1px solid #bbbbbb; overflow-y: auto;
justify-content: space-between; height: 330px;
.form { box-sizing: border-box;
flex: 1;
flex-direction: column;
height: 100%;
.bottom {
overflow-y: auto;
height: 330px;
box-sizing: border-box;
.algin-items { .algin-items {
align-items: center; align-items: center;
width: 200px; width: 200px;
}
.right {
display: inline-block;
width: 133px;
margin-right: 10px;
line-height: initial;
padding: 4px 0;
border: 1px solid #0bab0c;
color: #0bab0c;
font-size: 12px;
text-align: center;
border-radius: 4px;
box-sizing: border-box;
cursor: pointer;
&.active {
background-color: #0bab0c;
color: #ffffff;
} }
.right { &:hover {
display: inline-block; background-color: rgba(11, 171, 12, 0.5);
width: 133px; color: #ffffff;
margin-right: 10px;
line-height: initial;
padding: 4px 0;
border: 1px solid #0bab0c;
color: #0bab0c;
font-size: 12px;
text-align: center;
border-radius: 4px;
box-sizing: border-box;
cursor: pointer;
&.active {
background-color: #0bab0c;
color: #ffffff;
}
&:hover {
background-color: rgba(11, 171, 12, 0.5);
color: #ffffff;
}
} }
.right1 { }
display: inline-block; .right1 {
margin-right: 10px; display: inline-block;
line-height: initial; margin-right: 10px;
width: 90px; line-height: initial;
border: 1px solid #0bab0c; width: 90px;
color: #0bab0c; border: 1px solid #0bab0c;
font-size: 12px; color: #0bab0c;
padding: 4px 0; font-size: 12px;
text-align: center; padding: 4px 0;
border-radius: 4px; text-align: center;
box-sizing: border-box; border-radius: 4px;
cursor: pointer; box-sizing: border-box;
&.active { cursor: pointer;
background-color: #0bab0c; &.active {
color: #ffffff; background-color: #0bab0c;
} color: #ffffff;
&:hover { }
background-color: rgba(11, 171, 12, 0.5); &:hover {
color: #ffffff; background-color: rgba(11, 171, 12, 0.5);
} color: #ffffff;
} }
} }
} }
.text { }
margin-top: 13px; .text {
margin-bottom: 34px; margin-top: 13px;
justify-content: space-between; margin-bottom: 34px;
height: 28px; justify-content: space-between;
.left { height: 28px;
line-height: 28px; .left {
color: #101010; line-height: 28px;
font-size: 14px; color: #101010;
} font-size: 14px;
.right { }
width: 411px; .right {
line-height: 28px; width: 411px;
background: #1d84ff; line-height: 28px;
padding-right: 5px; background: #1d84ff;
color: #fff; padding-right: 5px;
text-align: right; color: #fff;
} text-align: right;
} }
} }
</style> }
</style>
danger-manage-web/src/views/educationPlanExam/visitorProgram/visitorQuestion.vue
View file @ 5e599d6e
...@@ -2,330 +2,564 @@ ...@@ -2,330 +2,564 @@
* @Author: 纪泽龙 jizelong@qq.com * @Author: 纪泽龙 jizelong@qq.com
* @Date: 2022-09-22 17:56:05 * @Date: 2022-09-22 17:56:05
* @LastEditors: 纪泽龙 jizelong@qq.com * @LastEditors: 纪泽龙 jizelong@qq.com
* @LastEditTime: 2022-09-28 17:54:16 * @LastEditTime: 2023-01-29 10:44:36
* @FilePath: /danger-manage-web/src/views/lessonsProgram/components/QuestionList.vue * @FilePath: /danger-manage-web/src/views/lessonsProgram/components/QuestionList.vue
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
--> -->
<template> <template>
<div ref="myBody" class="add-question flex"> <div ref="myBody" class="add-question flex">
<div style="color: #1890ff;">题目管理</div> <div style="color: #1890ff">题目管理</div>
<div class="text flex"> <div class="text flex">
<div class="left"> <div class="left">
<el-button type="primary" plain @click="enterContractTrainTopic">录入考题</el-button> <el-button type="primary" plain @click="enterContractTrainTopic"
目前有<span>{{questionNum}}</span>道题 >录入考题</el-button
<span class="warn">温馨提示：发布课程前需要进行考试设置</span> >
</div> <el-button type="primary" plain @click="changeQuestionClick"
<!-- <div class="right">{{courseName}}</div> --> >题库选题</el-button
>
目前有<span>{{ questionNum }}</span
>道题
<span class="warn">温馨提示：发布课程前需要进行考试设置</span>
</div>
<!-- <div class="right">{{courseName}}</div> -->
</div>
<div class="detail flex">
<div class="detail-item">
单选题<span>{{ bottomFrom.singleChoiceScore }}</span
>分/题,共<span>{{ danxs }}</span
>题，计<span class="textC">{{
danxs * bottomFrom.singleChoiceScore
}}</span
>分
</div>
<div class="detail-item">
多选题<span>{{ bottomFrom.multipleChoiceScore }}</span
>分/题,共<span>{{ duoxs }}</span> 题，计<span class="textC">{{
duoxs * bottomFrom.multipleChoiceScore
}}</span
>分
</div>
<div class="detail-item">
判断提<span>{{ bottomFrom.judgmentScore }}</span
>/题,共<span>{{ pds }}</span> 题，计<span class="textC">{{
pds * bottomFrom.judgmentScore
}}</span
>分
</div> </div>
<div class="detail-item">
一共<span>{{ danxs + duoxs + pds }}</span
>道题，总共计<span class="textC">{{
danxs * bottomFrom.singleChoiceScore +
duoxs * bottomFrom.multipleChoiceScore +
pds * bottomFrom.judgmentScore
}}</span
>分
</div>
</div>
<!-- 试题列表 --> <!-- 试题列表 -->
<div class="table flex"> <div class="table flex">
<div class="th flex"> <div class="th flex">
<div class="left">序号</div> <div class="left">序号</div>
<div class="middle">题目名称</div> <div class="type">题目类型</div>
<div class="right">操作</div> <div class="middle">题目名称</div>
</div> <div class="right">操作</div>
<div class="td-wrapper"> </div>
<div <div class="td-wrapper">
v-for="(item, index) in questionList" <div
:key="item.topicId" v-for="(item, index) in questionList"
class="td flex" :key="item.topicId"
> class="td flex"
<div class="left">{{ index + 1 }}</div> >
<div class="middle zzz"> <div class="left">{{ index + 1 }}</div>
{{ item.topicTitle }} <div class="type">{{ topicTypeArr[item.topicType] }}</div>
</div>
<div class="right"> <div class="middle zzz">
<div> {{ item.topicTitle }}
<el-button </div>
@click="editContractTrainTopic(item.topicId,index + 1)" <div class="right">
icon="el-icon-edit" <div>
type="text" <el-button
@click="editContractTrainTopic(item.topicId, index + 1)"
icon="el-icon-edit"
type="text"
>修改</el-button >修改</el-button
> >
<el-button <el-button
@click="deleteContractTrainTopic(item.topicId)" @click="deleteContractTrainTopic(item.topicId)"
icon="el-icon-delete" icon="el-icon-delete"
type="text" type="text"
>删除</el-button >删除</el-button
> >
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div>
<!-- 底部 --> <!-- 底部 -->
<div class="d3"> <div class="d3">
<div class="rightNum flex"> <!-- <div class="rightNum flex">
<div class="left">考试设置</div> <div class="left">考试设置</div>
<div class="middle flex"> <div class="middle flex">
<div class="left-text">答对题目大于</div> <div class="left-text">答对题目大于</div>
<div> <div>
<el-input <el-input
v-model="rightNum" v-model="rightNum"
style="width: 60px" style="width: 60px"
size="mini"
></el-input>
</div>
<div>为合格</div>
</div>
<div class="right">
<el-button
@click="saveRightNum"
icon="el-icon-check"
size="mini" size="mini"
type="success" ></el-input>
>保存</el-button
>
</div> </div>
<div>为合格</div>
</div> </div>
<div slot="footer" class="dialog-footer"> <div class="right">
<el-button <el-button
type="primary" @click="saveRightNum"
@click="saveContractTrian" icon="el-icon-check"
>{{ "确认" }}</el-button size="mini"
type="success"
>保存</el-button
> >
<el-button>取消</el-button>
</div> </div>
</div> </div> -->
<div class="rightNum flex">
<div class="left">考试设置</div>
<el-dialog <div class="middle flex">
title="录入题目" <div class="left-text">单选一题</div>
:visible.sync="dialogVisible" <div>
> <el-input
<visitorAdd ref="visitorAdd" :key="next"/> v-model="bottomFrom.singleChoiceScore"
<span slot="footer" class="dialog-footer"> style="width: 50px"
<div slot="footer" class="dialog-footer"> size="mini"
<el-button ></el-input>
type="primary" </div>
@click="save" <div>分</div>
>保存</el-button </div>
> <div class="middle flex">
<el-button type="primary" @click="saveAndNext">保存并录入下一题</el-button> <div class="left-text">多选一题</div>
<el-button @click="dialogVisible = false">取消</el-button> <div>
<el-input
v-model="bottomFrom.multipleChoiceScore"
style="width: 50px"
size="mini"
></el-input>
</div> </div>
</span> <div>分</div>
</el-dialog> </div>
<div class="middle flex">
<div class="left-text">判断一题</div>
<div>
<el-input
v-model="bottomFrom.judgmentScore"
style="width: 50px"
size="mini"
></el-input>
</div>
<div>分</div>
</div>
<div class="middle flex">
<div class="left-text">总分大于</div>
<div>
<el-input
v-model="bottomFrom.qualifiedNum"
style="width: 60px"
size="mini"
></el-input>
</div>
<div>为合格</div>
</div>
<div class="right">
<el-button
@click="saveRightNum"
icon="el-icon-check"
size="mini"
type="success"
>保存</el-button
>
</div>
</div>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="saveContractTrian">{{
"确认"
}}</el-button>
<el-button>取消</el-button>
</div>
</div> </div>
</template>
<el-dialog title="录入题目" :visible.sync="dialogVisible">
<visitorAdd ref="visitorAdd" :key="next" />
<span slot="footer" class="dialog-footer">
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="save">保存</el-button>
<el-button type="primary" @click="saveAndNext"
>保存并录入下一题</el-button
>
<el-button @click="dialogVisible = false">取消</el-button>
</div>
</span>
</el-dialog>
<!-- 从题库选择 -->
<el-dialog :visible.sync="dialogVisible2">
<ChangeQuestion ref="current" :courseId="courseId" />
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="currentSave">保存</el-button>
<el-button type="primary" @click="dialogVisible2 = false"
>取消</el-button
>
</div>
</el-dialog>
</div>
</template>
<script> <script>
import visitorAdd from "@/views/educationPlanExam/visitorProgram/visitorAdd"; import visitorAdd from "@/views/educationPlanExam/visitorProgram/visitorAdd";
import {updateCourse} from "@/api/contractTrain/contractTrain"; import ChangeQuestion from "@/views/educationPlanExam/visitorProgram/ChangeQuestion";
import { addTopic,listTopic,getTopic,delTopic,updateTopic } from "@/api/contractTrain/contractTrainTopic"; import { updateCourse } from "@/api/contractTrain/contractTrain";
export default { import {
name: "AnswerLesson", addTopic,
props: { listTopic,
visible: { getTopic,
type: Boolean, delTopic,
default: false, updateTopic,
} from "@/api/contractTrain/contractTrainTopic";
export default {
name: "AnswerLesson",
props: {
visible: {
type: Boolean,
default: false,
},
},
components: {
visitorAdd,
ChangeQuestion,
},
data() {
return {
dialogVisible: false,
dialogVisible2: false,
rightNum: 0,
next: 0,
questionList: [],
questionNum: null,
courseId: "",
topicTypeArr: {
1: "单选题",
2: "多选题",
3: "判断题",
},
bottomFrom: {
singleChoiceScore: 0,
multipleChoiceScore: 0,
judgmentScore: 0,
qualifiedNum: 0,
}, },
};
},
computed: {
danxs() {
// return 1;
return this.questionList.filter((item) => item.topicType === 1).length;
}, },
components: { duoxs() {
visitorAdd, // return 1;
return this.questionList.filter((item) => item.topicType === 2).length;
}, },
data() { pds() {
return { // return 1;
dialogVisible: false, return this.questionList.filter((item) => item.topicType === 3).length;
rightNum: 0,
next: 0,
questionList: [],
questionNum: null,
courseId: ""
};
}, },
methods: { },
//获取考题列表 methods: {
getContractTopicList(contractorCourseId){ //获取考题列表
this.courseId = contractorCourseId; getContractTopicList(contractorCourseId) {
listTopic({contractorCourseId:contractorCourseId}).then(res =>{ this.courseId = contractorCourseId;
this.questionList = res.rows.map((item) => { listTopic({ contractorCourseId: contractorCourseId }).then((res) => {
return { console.log(res.rows);
topicId: item.topicId, this.questionList = res.rows.map((item) => {
topicTitle: item.topicTitle, return {
}; topicType: item.topicType,
topicId: item.topicId,
topicTitle: item.topicTitle,
};
});
this.questionNum = res.total;
});
},
//录入考题
enterContractTrainTopic() {
this.dialogVisible = true;
this.next++;
this.$nextTick(() => {
this.$refs.visitorAdd.questionNextNum = this.questionNum + 1;
});
},
changeQuestionClick() {
this.dialogVisible2 = true;
},
currentSave() {
this.$refs.current.saveAndNext();
},
//保存试题
save(next) {
new Promise((resove) => {
if (
!this.$refs.visitorAdd.answerNum &&
this.$refs.visitorAdd.answerNum !== 0
) {
this.$message({
message: "警告，请设置一个正确答案",
type: "warning",
}); });
this.questionNum = res.total; return resove(false);
}) }
},
//录入考题 this.$refs.visitorAdd.$refs.form.validate((valid) => {
enterContractTrainTopic(){ if (valid) {
this.dialogVisible = true; const data = {};
this.next++; data.contractorCourseId = this.courseId;
this.$nextTick(() => { data.topicTitle = this.$refs.visitorAdd.form.topicTitle;
this.$refs.visitorAdd.questionNextNum = this.questionNum + 1; data.topicOption = JSON.stringify(
}) this.$refs.visitorAdd.form.questions
}, );
//保存试题 // data.answer = this.$refs.visitorAdd.answerNum;
save(next) { data.answer = JSON.stringify(this.$refs.visitorAdd.answerNum);
new Promise((resove) => { data.topicType = this.$refs.visitorAdd.form.topicType;
if (!this.$refs.visitorAdd.answerNum && this.$refs.visitorAdd.answerNum !== 0) {
this.$message({ // console.log()
message: "警告，请设置一个正确答案", console.log(data);
type: "warning", this.addContractTrainTopic(data).then((res) => {
if (res.code == 200) {
// 把修改的这个归位，变成正常添加
this.$emit("update:topicId", null);
this.$message({
message: "添加题目成功",
type: "success",
});
if (next != 1) {
this.dialogVisible = false;
this.getContractTopicList(this.courseId);
} else {
this.next++;
}
resove(true);
}
}); });
return resove(false);
} }
this.$refs.visitorAdd.$refs.form.validate((valid) => {
if (valid) {
const data = {};
data.contractorCourseId = this.courseId;
data.topicTitle = this.$refs.visitorAdd.form.topicTitle;
data.topicOption = JSON.stringify(this.$refs.visitorAdd.form.questions);
data.answer = this.$refs.visitorAdd.answerNum;
this.addContractTrainTopic(data).then((res) => {
if (res.code == 200) {
// 把修改的这个归位，变成正常添加
this.$emit("update:topicId", null);
this.$message({
message: "添加题目成功",
type: "success",
});
if(next != 1){
this.dialogVisible = false;
this.getContractTopicList(this.courseId)
}else{
this.next++;
}
resove(true);
}
});
}
});
}); });
}, });
//保存并录入下一题 },
saveAndNext() { //保存并录入下一题
this.save(1); saveAndNext() {
}, this.save(1);
//新增试题 },
addContractTrainTopic(data){ //新增试题
if (this.$refs.visitorAdd.form.topicId) { addContractTrainTopic(data) {
return updateTopic({ topicId: this.$refs.visitorAdd.form.topicId, ...data }); if (this.$refs.visitorAdd.form.topicId) {
} else { return updateTopic({
return addTopic({ contractorCourseId: this.courseId, ...data }); topicId: this.$refs.visitorAdd.form.topicId,
} ...data,
}, });
//试题修改 } else {
editContractTrainTopic(topicId,index){ return addTopic({ contractorCourseId: this.courseId, ...data });
this.dialogVisible = true; }
getTopic(topicId).then(res =>{ },
const data = res.data; //试题修改
this.$refs.visitorAdd.form = { editContractTrainTopic(topicId, index) {
topicId: data.topicId, this.dialogVisible = true;
topicTitle: data.topicTitle, getTopic(topicId).then((res) => {
questions: JSON.parse(data.topicOption), const data = res.data;
}; this.$refs.visitorAdd.form = {
this.$refs.visitorAdd.answerNum = data.answer; topicId: data.topicId,
}) topicTitle: data.topicTitle,
this.$nextTick(() => { topicType: data.topicType,
this.$refs.visitorAdd.questionNextNum = index; questions: JSON.parse(data.topicOption),
}) };
}, console.log(data);
//试题删除 this.$refs.visitorAdd.answerNum = data.answer;
deleteContractTrainTopic(topicId){ });
this.$confirm("请确定删除该题", { this.$nextTick(() => {
confirmButtonText: "确定", this.$refs.visitorAdd.questionNextNum = index;
cancelButtonText: "取消", });
type: "warning", },
}).then(() => { //试题删除
deleteContractTrainTopic(topicId) {
this.$confirm("请确定删除该题", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(() => {
return delTopic(topicId); return delTopic(topicId);
}).then((res) => { })
if (res.code == 200) { .then((res) => {
if (res.code == 200) {
this.$message({ this.$message({
message: "删除成功", message: "删除成功",
type: "success", type: "success",
}); });
} }
return this.getContractTopicList(this.courseId); return this.getContractTopicList(this.courseId);
}) });
}, },
saveRightNum() { saveRightNum() {
if (this.rightNum > this.questionList.length) { // if (this.rightNum > this.questionList.length) {
// this.$message({
// message: "答对题目数应小于等于考试题目总数",
// type: "warning",
// });
// return;
// }
if (
!(
this.bottomFrom.singleChoiceScore > 0 &&
this.bottomFrom.multipleChoiceScore > 0 &&
this.bottomFrom.judgmentScore > 0 &&
this.bottomFrom.qualifiedNum > 0
)
) {
this.$message({
message: "请将分数填写完整",
type: "warning",
});
return;
}
console.log(this.bottomFrom);
// const bottomFrom = this.bottomFrom.map(item=>{
// return {
// singleChoiceScore:+item.singleChoiceScore,
// multipleChoiceScore:+item.multipleChoiceScore,
// judgmentScore:+item.judgmentScore,
// qualifiedNum:+item.qualifiedNum,
// }
// })
updateCourse({
contractorCourseId: this.courseId,
...this.bottomFrom,
}).then((res) => {
if (res.code == 200) {
this.$message({ this.$message({
message: "答对题目数应小于等于考试题目总数", message: "答题合格数修改成功",
type: "warning", type: "success",
}); });
return;
} }
updateCourse({ contractorCourseId: this.courseId, qualifiedNum: this.rightNum }).then((res) => { });
if (res.code == 200) { },
this.$message({
message: "答题合格数修改成功",
type: "success",
});
}
}
);
},
//保存承包商信息 //保存承包商信息
saveContractTrian(){ saveContractTrian() {
updateCourse(this.$parent.contractTrainForm).then(res =>{ updateCourse(this.$parent.contractTrainForm).then((res) => {
if(res.code == 200){ if (res.code == 200) {
this.$message({ this.$message({
message: "培训信息修改成功", message: "培训信息修改成功",
type: "success", type: "success",
}); });
this.$parent.getContractTrainList(); this.$parent.getContractTrainList();
} }
}) });
}
}, },
}; },
</script> };
</script>
<style lang="scss" scoped> <style lang="scss" scoped>
.add-question { .add-question {
width: 100%; width: 100%;
height: 550px; height: 550px;
// overflow: hidden; // overflow: hidden;
flex-direction: column;
padding-bottom: 7px;
margin-bottom: 20px;
border-bottom: 1px solid #bbbbbb00;
.text {
margin-top: 13px;
margin-bottom: 32px;
justify-content: space-between;
height: 28px;
.left {
line-height: 28px;
color: #101010;
font-size: 14px;
.warn {
display: inline-flex;
font-size: 12px;
color: red;
margin-left: 10px;
}
}
.right {
width: 411px;
line-height: 28px;
background: #1d84ff;
padding-right: 5px;
color: #fff;
text-align: right;
}
}
.detail {
position: absolute;
bottom: 10px;
left: 50px;
.textC {
font-weight: 800;
font-size: 18px;
}
.detail-item {
margin-right: 20px;
color: red;
}
}
.table {
flex: 1;
height: 0;
flex-direction: column; flex-direction: column;
padding-bottom: 7px; .th {
margin-bottom: 20px; width: 100%;
border-bottom: 1px solid #bbbbbb00; height: 70px;
line-height: 70px;
background: #f5f5f5;
color: #606266;
.text { > div {
margin-top: 13px; height: 100%;
margin-bottom: 32px; }
justify-content: space-between;
height: 28px;
.left { .left {
line-height: 28px; width: 15%;
color: #101010; text-align: center;
font-size: 14px; }
.warn { .type {
display: inline-flex; width: 10%;
font-size: 12px; text-align: center;
color: red; }
margin-left: 10px; .middle {
} width: 50%;
padding-left: 50px;
} }
.right { .right {
width: 411px; width: 25%;
line-height: 28px; text-align: center;
background: #1d84ff;
padding-right: 5px;
color: #fff;
text-align: right;
} }
} }
.table { .td-wrapper {
flex: 1; flex: 1;
height: 0; overflow-y: auto;
// 这样子元素才能有滚动条
flex-direction: column; .td {
.th { height: 68px;
width: 100%; line-height: 68px;
height: 70px; box-sizing: border-box;
line-height: 70px; border-bottom: 1px solid #bbbbbb;
background: #f5f5f5; &:last-child {
color: #606266; border-bottom: none;
}
> div { > div {
height: 100%; height: 100%;
} }
...@@ -333,82 +567,59 @@ ...@@ -333,82 +567,59 @@
width: 15%; width: 15%;
text-align: center; text-align: center;
} }
.type {
width: 10%;
text-align: center;
}
.middle { .middle {
width: 60%; width: 50%;
padding-left: 100px; padding-left: 50px;
} }
.right { .right {
width: 25%; width: 25%;
text-align: center; text-align: center;
} }
} }
.td-wrapper {
flex: 1;
overflow-y: auto;
// 这样子元素才能有滚动条
.td {
height: 68px;
line-height: 68px;
box-sizing: border-box;
border-bottom: 1px solid #bbbbbb;
&:last-child {
border-bottom: none;
}
> div {
height: 100%;
}
.left {
width: 15%;
text-align: center;
}
.middle {
width: 60%;
padding-left: 10px;
}
.right {
width: 25%;
text-align: center;
}
}
}
}
.d3{
display: flex;
justify-content: right;
} }
.dialog-footer{ }
margin-top: 15px; .d3 {
display: flex;
justify-content: right;
}
.dialog-footer {
margin-top: 15px;
}
.rightNum {
margin-top: 5px;
// width: 50%;
height: 55px;
box-sizing: border-box;
border: 1px solid #bbbbbb;
line-height: 55px;
margin-right: 20px;
padding-right: 10px;
> .left {
width: 100px;
background: #0bab0c;
font-size: 14px;
color: #fff;
text-align: center;
} }
.rightNum { > .middle {
margin-top: 5px; > div {
width: 50%; margin-right: 5px;
height: 55px;
box-sizing: border-box;
border: 1px solid #bbbbbb;
line-height: 55px;
margin-right: 20px;
> .left {
width: 140px;
background: #0bab0c;
font-size: 14px;
color: #fff;
text-align: center;
} }
> .middle { .left-text {
> div { margin-left: 10px;
margin-right: 5px;
}
.left-text {
margin-left: 10px;
}
.middle {
margin-right: 20px;
}
} }
.right { .middle {
margin-left: 20px; margin-right: 20px;
} }
// background: black;
} }
.right {
margin-left: 20px;
}
// background: black;
} }
</style> }
</style>
danger-manage-web/src/views/system/qRCode/index.vue
View file @ 5e599d6e
<!--
* @Author: 纪泽龙 jizelong@qq.com
* @Date: 2023-01-17 13:47:40
* @LastEditors: 纪泽龙 jizelong@qq.com
* @LastEditTime: 2023-01-28 17:58:47
* @FilePath: /danger-manage-web/src/views/system/qRCode/index.vue
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template> <template>
<img :src="src" style=" position: relative; <img :src="src" style="position: relative; left: 37%; top: 10%; width: 27%" />
left: 37%;
top: 10%;
width: 27%;">
</template> </template>
<script> <script>
const src = require('../qRCode/img/qrcode_1673250700723.png') const src = require("../qRCode/img/qrcode_1673250700723.png");
export default{ export default {
computed:{ computed: {
src(){ src() {
return src return src;
} },
} },
} };
</script> </script>
danger-manage-web/src/views/visitorExam/Trainingmaterials/ExaminationQuestions.vue
View file @ 5e599d6e
...@@ -11,24 +11,44 @@ ...@@ -11,24 +11,44 @@
destroy-on-close destroy-on-close
> >
<div ref="myBody" class="body" v-loading="loading"> <div ref="myBody" class="body" v-loading="loading">
<!-- <div class="text">--> <!-- <div class="text">-->
<!-- <div class="float">访客和供应商培训管理</div>--> <!-- <div class="float">访客和供应商培训管理</div>-->
<!-- </div>--> <!-- </div>-->
<transition name="fade" mode="out-in"> <transition name="fade" mode="out-in">
<div :key="goodJobShow"> <div :key="goodJobShow">
<template v-if="!goodJobShow"> <template v-if="!goodJobShow">
<transition name="fade" mode="out-in" > <transition name="fade" mode="out-in">
<div class="question-wrapper" v-if="visible" :key="nowQuestion"> <div class="question-wrapper" v-if="visible" :key="nowQuestion">
<div v-for="(item, index) in list" :key="item.id"> <div v-for="(item, index) in list" :key="item.id">
<Question <!-- <Question
style="width: 89%;" style="width: 89%"
v-if="index === nowQuestion" v-if="index === nowQuestion"
:questionObj="item" :questionObj="item"
:index="index" :index="index"
:nowQuestion="nowQuestion" :nowQuestion="nowQuestion"
:selectLetter="selectLetter" :selectLetter="selectLetter"
@changeLetter="changeLetter" @changeLetter="changeLetter"
/> /> -->
<template v-if="item.topicType == 1 || item.topicType === 3">
<Question
v-if="index === nowQuestion"
:questionObj="item"
:index="index"
:nowQuestion="nowQuestion"
:selectLetter="selectLetter"
@changeLetter="changeLetter"
/>
</template>
<template v-else>
<QuestionChoice
v-if="index === nowQuestion"
:questionObj="item"
:index="index"
:nowQuestion="nowQuestion"
:selectLetter="selectLetter"
@changeLetter="changeLetter"
/>
</template>
</div> </div>
</div> </div>
</transition> </transition>
...@@ -65,14 +85,14 @@ ...@@ -65,14 +85,14 @@
</div> </div>
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
<!-- <el-button type="primary" @click="closeFinished" v-if="goodJobShow"--> <!-- <el-button type="primary" @click="closeFinished" v-if="goodJobShow"-->
<!-- >重新考试</el-button--> <!-- >重新考试</el-button-->
<!-- >--> <!-- >-->
<el-button type="primary" @click="closeFinished" v-if="goodJobShow" <el-button type="primary" @click="closeFinished" v-if="goodJobShow"
>确定</el-button >确定</el-button
> >
<el-button type="primary" @click="dialogSubmitForm" v-else <el-button type="primary" @click="dialogSubmitForm" v-else
>交卷</el-button >交卷</el-button
> >
<el-button @click="dialogCancel">取消</el-button> <el-button @click="dialogCancel">取消</el-button>
</div> </div>
...@@ -80,247 +100,254 @@ ...@@ -80,247 +100,254 @@
</template> </template>
<script> <script>
import Question from "../Trainingmaterials/components/Question"; import Question from "../Trainingmaterials/components/Question";
import GoodJob from "../Trainingmaterials/components/GoodJob.vue"; import QuestionChoice from "../Trainingmaterials/components/QuestionChoice";
import { import GoodJob from "./components/GoodJob.vue";
userQuestionList, import {
setAnswer, userQuestionList,
} from "@/api/educationPlanExam/lessonsProgram"; setAnswer,
import { } from "@/api/educationPlanExam/lessonsProgram";
listTopic, import { listTopic, setEsult } from "@/api/contractTrain/contractTrainTopic";
setEsult export default {
} from "@/api/contractTrain/contractTrainTopic"; name: "AnswerLesson",
export default { props: {
name: "AnswerLesson", visible: {
props: { type: Boolean,
visible: { default: false,
type: Boolean,
default: false,
},
userCourseId: {
type: [Number, String],
},
courseId: {
type: [Number, String],
},
}, },
from:{ userCourseId: {
answers:{} type: [Number, String],
}, },
components: { courseId: {
Question, type: [Number, String],
GoodJob,
}, },
data() { },
return { from: {
nowQuestion: 0, answers: {},
startHeight: "0px", },
goodJobShow: false, components: {
goodJobData: {}, Question,
loading: false, QuestionChoice,
from:{}, GoodJob,
list: [ },
{ data() {
id: 19, return {
text: "j9", nowQuestion: 0,
question: ["adsf", "dfgsdfg", "adsfadsf", "dfasdfadsf"], startHeight: "0px",
}, goodJobShow: false,
], goodJobData: {},
answerArr: [], loading: false,
// 题目是否被答过，如果答过，就把值传回去，如果没有答过，就是空 from: {},
selectLetter: 999, list: [
}; {
}, id: 19,
// watch: { text: "j9",
// visible(newValue) { question: ["adsf", "dfgsdfg", "adsfadsf", "dfasdfadsf"],
// if (newValue) { },
// this.$nextTick(() => { ],
// this.saveBody(); answerArr: [],
// }); // 题目是否被答过，如果答过，就把值传回去，如果没有答过，就是空
// } selectLetter: [],
// }, };
// }, },
created() { // watch: {
listTopic().then((res) => { // visible(newValue) {
console.log(res); // if (newValue) {
this.list = res.rows.map((item) => { // this.$nextTick(() => {
return { // this.saveBody();
id: item.topicId, // });
text: item.topicTitle, // }
question: JSON.parse(item.topicOption).map((item) => item.value), // },
}; // },
}); created() {
listTopic().then((res) => {
console.log(res);
this.list = res.rows.map((item) => {
return {
id: item.topicId,
text: item.topicTitle,
topicType: item.topicType,
question: JSON.parse(item.topicOption).map((item) => item.value),
};
}); });
});
},
methods: {
saveBody() {
this.startHeight = this.$refs.myBody.offsetHeight - 55 + "px";
}, },
methods: { dialogSubmitForm() {
saveBody() { // console.log(JSON.parse(this.$route.query.params));
this.startHeight = this.$refs.myBody.offsetHeight - 55 + "px"; // this.answerClear();
}, // this.$emit("update:visible", false);
dialogSubmitForm() { this.saveBody();
console.log(JSON.parse(this.$route.query.params)) // const answers = this.answerArr.map((item) => item.answer).join(",");
// this.answerClear();
// this.$emit("update:visible", false); const json = JSON.stringify(this.answerArr.map((item) => item.answer));
this.saveBody(); const answers = json.slice(1, json.length - 1);
const answers = this.answerArr.map((item) => item.answer).join(",");
this.form=JSON.parse(this.$route.query.params); this.form = JSON.parse(this.$route.query.params);
this.loading = true; // this.form={
console.log(this.form) // beyondUnit:'1111',
this.form.answers=answers // name:'zzz',
console.log(this.form) // sex:1,
setEsult(this.form) // phoneNum:13012341234
.then((res) => { // }
if (res.code == 200) { this.loading = true;
this.goodJobData = res.data; this.form.answers = answers;
this.goodJobShow = true; this.loading = true;
} setEsult(this.form)
}) .then((res) => {
.finally(() => { if (res.code == 200) {
this.loading = false; this.goodJobData = res.data;
// 是否作对 this.goodJobShow = true;
this.$emit('jj',this.goodJobData)
});
},
dialogCancel() {
this.$emit("update:visible", false);
},
// 关闭之后
closeFinished() {
const routeData = this.$router.resolve({
path: '/enterInformation', //跳转目标窗口的地址
query: {
} }
}) })
window.open(routeData.href, "_search"); .finally(() => {
// this.answerClear(); this.loading = false;
this.goodJobShow = false; // 是否作对
}, this.$emit("jj", this.goodJobData);
answerClear() { });
this.answerArr = []; },
this.nowQuestion = 0; dialogCancel() {
}, this.$emit("update:visible", false);
// 点题目时 },
questionNumClick(index) { // 关闭之后
// 是否是回答过的,数组中存在它，那它就是回答过的 closeFinished() {
const bool = const routeData = this.$router.resolve({
this.answerArr.findIndex((item) => item.questionNum === index + 1) >= 0; path: "/enterInformation", //跳转目标窗口的地址
// 或者下一题与当前题目是紧挨着的并且当前题目是答完的，相差为1就算是紧挨着的 query: {},
const nowQuestionAnswerBool = this.nextQuestion(index); });
if (bool || nowQuestionAnswerBool) { window.open(routeData.href, "_search");
this.nowQuestion = index; // this.answerClear();
} this.goodJobShow = false;
// 赋值，如果答过的，就传回去，如果没答过，就是空 变成字符串是因为0位false },
this.selectLetter = answerClear() {
this.answerArr[this.nowQuestion]?.answer + "" || 99999; this.answerArr = [];
}, this.nowQuestion = 0;
nextBtnClick() { },
// 到头了，打完了 // 点题目时
if (this.nowQuestion + 1 == this.list.length) return; questionNumClick(index) {
this.questionNumClick(this.nowQuestion + 1); // 是否是回答过的,数组中存在它，那它就是回答过的
}, const bool =
// 紧挨着且当前题目是打完的 this.answerArr.findIndex((item) => item.questionNum === index + 1) >= 0;
nextQuestion(index) { // 或者下一题与当前题目是紧挨着的并且当前题目是答完的，相差为1就算是紧挨着的
// 下一题相差1 const nowQuestionAnswerBool = this.nextQuestion(index);
// const nextIndexBool = index - this.nowQuestion == 1; if (bool || nowQuestionAnswerBool) {
// 答案数组的长度，就是档当前达到了第几题，长度-1是因为题目是从0开始记录 this.nowQuestion = index;
const nextIndexBool = index - (this.answerArr.length - 1) == 1; }
// 当前题已经回答过 // 赋值，如果答过的，就传回去，如果没答过，就是空 变成字符串是因为0位false
const nowQuestionAnswerBool = this.selectLetter = this.answerArr[this.nowQuestion]?.answer || [];
this.answerArr.findIndex( },
(item) => item.questionNum === this.nowQuestion + 1 nextBtnClick() {
) >= 0; // 到头了，打完了
return nextIndexBool && nowQuestionAnswerBool; if (this.nowQuestion + 1 == this.list.length) return;
}, this.questionNumClick(this.nowQuestion + 1);
changeLetter(letter) { },
console.log(letter); // 紧挨着且当前题目是打完的
console.log(this.$route.query) // 输出为：{params:"message"} nextQuestion(index) {
const obj = {}; // 下一题相差1
obj.questionNum = this.nowQuestion + 1; // const nextIndexBool = index - this.nowQuestion == 1;
obj.answer = letter; // 答案数组的长度，就是档当前达到了第几题，长度-1是因为题目是从0开始记录
// 数组中是否存在这个题目 const nextIndexBool = index - (this.answerArr.length - 1) == 1;
const index = this.answerArr.findIndex( // 当前题已经回答过
const nowQuestionAnswerBool =
this.answerArr.findIndex(
(item) => item.questionNum === this.nowQuestion + 1 (item) => item.questionNum === this.nowQuestion + 1
); ) >= 0;
if (index < 0) { return nextIndexBool && nowQuestionAnswerBool;
// 如果不存在
// 推入
this.answerArr.push(obj);
} else {
// 如果存在
// 替换
this.answerArr.splice(index, 1, obj);
}
// console.log(this.answerArr);
},
}, },
}; changeLetter(letter) {
console.log(letter);
console.log(this.$route.query); // 输出为：{params:"message"}
const obj = {};
obj.questionNum = this.nowQuestion + 1;
obj.answer = letter;
// 数组中是否存在这个题目
const index = this.answerArr.findIndex(
(item) => item.questionNum === this.nowQuestion + 1
);
if (index < 0) {
// 如果不存在
// 推入
this.answerArr.push(obj);
} else {
// 如果存在
// 替换
this.answerArr.splice(index, 1, obj);
}
// console.log(this.answerArr);
},
},
};
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.body { .body {
width: 120%; width: 100%;
height: 100%; height: 100%;
padding-right: 40px; padding-right: 40px;
padding-left: 20px; padding-left: 20px;
.question-wrapper { .question-wrapper {
}
.text {
margin-bottom: 16px;
.float {
padding-right: 70%;
width: 106%;
height: 28px;
background: #1d84ff;
line-height: 28px;
color: #ffffff;
font-size: 10px;
text-align: right;
float: right;
}
&:after {
content: "";
display: block;
clear: both;
} }
.text { }
margin-bottom: 16px; .select {
.float { .select-item {
padding-right: 70%; padding-top: 30px;
width: 106%; flex-wrap: wrap;
> div {
margin-bottom: 10px;
}
.item {
width: 38px;
height: 28px; height: 28px;
background: #1d84ff; border: 1px solid #bbbbbb;
line-height: 28px; line-height: 28px;
color: #ffffff; font-size: 14px;
font-size: 10px; text-align: center;
text-align: right; margin-right: 18px;
float: right; cursor: pointer;
} &.active {
&:after { background: #e9e9e9;
content: "";
display: block;
clear: both;
}
}
.select {
.select-item {
padding-top: 30px;
flex-wrap: wrap;
> div {
margin-bottom: 10px;
} }
.item { &.now {
width: 38px; background: #a3d3ff;
height: 28px; border: none;
border: 1px solid #bbbbbb;
line-height: 28px;
font-size: 14px;
text-align: center;
margin-right: 18px;
cursor: pointer;
&.active {
background: #e9e9e9;
}
&.now {
background: #a3d3ff;
border: none;
}
} }
.btn { }
width: 84px; .btn {
height: 28px; width: 84px;
background: #e8f4ff; height: 28px;
border: 1px solid #a3d3ff; background: #e8f4ff;
color: #1d84ff; border: 1px solid #a3d3ff;
text-align: center; color: #1d84ff;
line-height: 28px; text-align: center;
font-size: 14px; line-height: 28px;
cursor: pointer; font-size: 14px;
&:hover { cursor: pointer;
background: rgba(29, 132, 255, 0.5); &:hover {
color: #ffffff; background: rgba(29, 132, 255, 0.5);
} color: #ffffff;
} }
} }
} }
} }
}
</style> </style>
danger-manage-web/src/views/visitorExam/Trainingmaterials/components/AnswerLesson.vue
View file @ 5e599d6e
...@@ -13,11 +13,12 @@ ...@@ -13,11 +13,12 @@
<div ref="myBody" class="body" v-loading="loading"> <div ref="myBody" class="body" v-loading="loading">
<div class="text"> <div class="text">
<div class="float">炼铁车间炉前工安全生产规范课程</div> <div class="float">炼铁车间炉前工安全生产规范课程</div>
</div> </div>
<transition name="fade" mode="out-in"> <transition name="fade" mode="out-in">
<div :key="goodJobShow"> <div :key="goodJobShow">
<template v-if="!goodJobShow"> <template v-if="!goodJobShow">
<transition name="fade" mode="out-in"> <!-- <transition name="fade" mode="out-in">
<div class="question-wrapper" v-if="visible" :key="nowQuestion"> <div class="question-wrapper" v-if="visible" :key="nowQuestion">
<div v-for="(item, index) in list" :key="item.id"> <div v-for="(item, index) in list" :key="item.id">
<Question <Question
...@@ -30,6 +31,33 @@ ...@@ -30,6 +31,33 @@
/> />
</div> </div>
</div> </div>
</transition> -->
<transition name="fade" mode="out-in">
<div class="question-wrapper" v-if="visible" :key="nowQuestion">
<div v-for="(item, index) in list" :key="item.id">
<template v-if="item.topicType == 1 || item.topicType === 3">
<Question
v-if="index === nowQuestion"
:questionObj="item"
:index="index"
:nowQuestion="nowQuestion"
:selectLetter="selectLetter"
@changeLetter="changeLetter"
/>
</template>
<template v-else>
<QuestionChoice
v-if="index === nowQuestion"
:questionObj="item"
:index="index"
:nowQuestion="nowQuestion"
:selectLetter="selectLetter"
@changeLetter="changeLetter"
/>
</template>
</div>
</div>
</transition> </transition>
<div class="select flex"> <div class="select flex">
...@@ -77,7 +105,7 @@ ...@@ -77,7 +105,7 @@
<script> <script>
import Question from "./Question"; import Question from "./Question";
import GoodJob from "./GoodJob.vue"; import GoodJob from "./GoodJobOld.vue";
import { import {
userQuestionList, userQuestionList,
setAnswer, setAnswer,
...@@ -148,7 +176,9 @@ export default { ...@@ -148,7 +176,9 @@ export default {
// this.answerClear(); // this.answerClear();
// this.$emit("update:visible", false); // this.$emit("update:visible", false);
this.saveBody(); this.saveBody();
const answers = this.answerArr.map((item) => item.answer).join(","); // const answers = this.answerArr.map((item) => item.answer).join(",");
const json = JSON.stringify(this.answerArr.map((item) => item.answer));
const answers = json.slice(1, json.length - 1);
this.loading = true; this.loading = true;
setAnswer({ setAnswer({
userCourseId: this.userCourseId, userCourseId: this.userCourseId,
...@@ -158,13 +188,12 @@ export default { ...@@ -158,13 +188,12 @@ export default {
if (res.code == 200) { if (res.code == 200) {
this.goodJobData = res.data; this.goodJobData = res.data;
this.goodJobShow = true; this.goodJobShow = true;
} }
}) })
.finally(() => { .finally(() => {
this.loading = false; this.loading = false;
// 是否作对 // 是否作对
this.$emit('jj',this.goodJobData) this.$emit("jj", this.goodJobData);
}); });
}, },
dialogCancel() { dialogCancel() {
......
danger-manage-web/src/views/visitorExam/Trainingmaterials/components/GoodJob.vue
View file @ 5e599d6e
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
* @Author: 纪泽龙 jizelong@qq.com * @Author: 纪泽龙 jizelong@qq.com
* @Date: 2022-09-21 17:20:49 * @Date: 2022-09-21 17:20:49
* @LastEditors: 纪泽龙 jizelong@qq.com * @LastEditors: 纪泽龙 jizelong@qq.com
* @LastEditTime: 2022-09-28 11:56:49 * @LastEditTime: 2023-01-12 17:00:34
* @FilePath: /danger-manage-web/src/views/myLessons/components/GoodJob.vue * @FilePath: /danger-manage-web/src/views/myLessons/components/GoodJob.vue
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
--> -->
...@@ -13,17 +13,16 @@ ...@@ -13,17 +13,16 @@
<template v-if="goodJobData.answer >= goodJobData.qualifiedNum"> <template v-if="goodJobData.answer >= goodJobData.qualifiedNum">
<div class="icon"><i class="iconfont icon-smiling" /></div> <div class="icon"><i class="iconfont icon-smiling" /></div>
<div> <div>
恭喜你，做对{{ goodJobData.answer }}道题得分{{ <!-- 恭喜你，做对{{ goodJobData.answer }}道题 -->
Math.floor((goodJobData.answer / goodJobData.topicNum) * 100) 恭喜你，得分{{ goodJobData.answer }}，成绩合格！
}}，成绩合格！
</div> </div>
</template> </template>
<template v-else> <template v-else>
<div class="icon"><i class="iconfont icon-nanguo" /></div> <div class="icon"><i class="iconfont icon-nanguo" /></div>
<div> <div>
继续努力，做对{{ goodJobData.answer }}道题得分{{ 继续努力，
Math.floor((goodJobData.answer / goodJobData.topicNum) * 100) <!-- 做对{{ goodJobData.answer }}道题 -->
}}，成绩不合格！ 得分{{ goodJobData.answer }}，成绩不合格！
</div> </div>
</template> </template>
</div> </div>
...@@ -49,16 +48,16 @@ export default { ...@@ -49,16 +48,16 @@ export default {
.goodjob-wrapper { .goodjob-wrapper {
justify-content: center; justify-content: center;
align-items: center; align-items: center;
width: 86%; width: 100%;
height: 100%; height: 100%;
border-bottom: 1px solid #bbbbbb; border-bottom: 1px solid #bbbbbb;
.text { .text {
width: 94%; width: 100%;
height: 174px; height: 136px;
color: #1d84ff; color: #1d84ff;
background: #f9f9f9 100%; background: #f9f9f9 100%;
border-radius: 15px; border-radius: 15px;
line-height: 40px; line-height: 136px;
font-size: 28px; font-size: 28px;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
......
danger-manage-web/src/views/visitorExam/Trainingmaterials/components/GoodJobOld.vue 0 → 100644
View file @ 5e599d6e
<!--
* @Author: 纪泽龙 jizelong@qq.com
* @Date: 2022-09-21 17:20:49
* @LastEditors: 纪泽龙 jizelong@qq.com
* @LastEditTime: 2022-09-28 11:56:49
* @FilePath: /danger-manage-web/src/views/myLessons/components/GoodJob.vue
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
<div class="goodjob-wrapper flex">
<div class="text flex">
<div class="text flex">
<template v-if="goodJobData.answer >= goodJobData.qualifiedNum">
<div class="icon"><i class="iconfont icon-smiling" /></div>
<div>
恭喜你，做对{{ goodJobData.answer }}道题得分{{
Math.floor((goodJobData.answer / goodJobData.topicNum) * 100)
}}，成绩合格！
</div>
</template>
<template v-else>
<div class="icon"><i class="iconfont icon-nanguo" /></div>
<div>
继续努力，做对{{ goodJobData.answer }}道题得分{{
Math.floor((goodJobData.answer / goodJobData.topicNum) * 100)
}}，成绩不合格！
</div>
</template>
</div>
</div>
</div>
</template>
<script>
export default {
name: "",
props: {
goodJobData: {
type: Object,
},
},
data() {
return {};
},
methods: {},
};
</script>
<style lang="scss" scoped>
.goodjob-wrapper {
justify-content: center;
align-items: center;
width: 86%;
height: 100%;
border-bottom: 1px solid #bbbbbb;
.text {
width: 94%;
height: 174px;
color: #1d84ff;
background: #f9f9f9 100%;
border-radius: 15px;
line-height: 40px;
font-size: 28px;
justify-content: center;
align-items: center;
.icon {
margin-right: 10px;
.iconfont {
color: #e2852a;
font-size: 40px !important;
}
}
}
}
</style>
danger-manage-web/src/views/visitorExam/Trainingmaterials/components/Question.vue
View file @ 5e599d6e
...@@ -2,12 +2,13 @@ ...@@ -2,12 +2,13 @@
* @Author: 纪泽龙 jizelong@qq.com * @Author: 纪泽龙 jizelong@qq.com
* @Date: 2022-09-21 11:00:14 * @Date: 2022-09-21 11:00:14
* @LastEditors: 纪泽龙 jizelong@qq.com * @LastEditors: 纪泽龙 jizelong@qq.com
* @LastEditTime: 2022-09-28 11:15:27 * @LastEditTime: 2023-01-29 09:29:14
* @FilePath: /danger-manage-web/src/views/myLessons/components/Question.vue * @FilePath: /danger-manage-web/src/views/myLessons/components/Question.vue
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
--> -->
<template> <template>
<div class="question flex"> <div class="question flex">
<div class="tips">{{ tipsArr[questionObj.topicType] }}</div>
<div <div
class="top" class="top"
:class="{ flex: alignItemsCenter }" :class="{ flex: alignItemsCenter }"
...@@ -23,7 +24,7 @@ ...@@ -23,7 +24,7 @@
<div <div
class="item flex" class="item flex"
v-for="(item, index) in questionObj.question" v-for="(item, index) in questionObj.question"
:key="item+'aas'+index" :key="item + 'aas' + index"
> >
<div class="letter"> <div class="letter">
{{ letters[index] }} {{ letters[index] }}
...@@ -38,10 +39,10 @@ ...@@ -38,10 +39,10 @@
<div class="change-wrapper flex"> <div class="change-wrapper flex">
<div <div
class="change" class="change"
:class="{ active: letterActive+'' === index+'' }" :class="{ active: letterActive.indexOf(index) >= 0 }"
@click="changeLetter(index)" @click="changeLetter(index)"
v-for="(item, index) in questionObj.question" v-for="(item, index) in questionObj.question"
:key="item+'a'+index" :key="item + 'a' + index"
> >
{{ letters[index] }} {{ letters[index] }}
</div> </div>
...@@ -105,8 +106,8 @@ export default { ...@@ -105,8 +106,8 @@ export default {
}, },
// 从外面传进来的选项，选择过的才有，没选择过的没有 // 从外面传进来的选项，选择过的才有，没选择过的没有
selectLetter: { selectLetter: {
type: [String, Number], type: [String, Number, Array],
default:999, default: [],
}, },
}, },
data() { data() {
...@@ -115,6 +116,11 @@ export default { ...@@ -115,6 +116,11 @@ export default {
// 如果传进来了，就是这个值，如果没有就是null，因为动画需要那个key的问题，会清空原始的盒子，所以要传一下值 // 如果传进来了，就是这个值，如果没有就是null，因为动画需要那个key的问题，会清空原始的盒子，所以要传一下值
letterActive: this.selectLetter, letterActive: this.selectLetter,
letters, letters,
tipsArr: {
1: "单选题",
2: "多选题",
3: "判断题",
},
}; };
}, },
mounted() { mounted() {
...@@ -143,8 +149,10 @@ export default { ...@@ -143,8 +149,10 @@ export default {
} }
}, },
changeLetter(index) { changeLetter(index) {
this.letterActive = index; // this.letterActive = index;
this.$emit("changeLetter", index); // this.$emit("changeLetter", index);
this.letterActive = [index];
this.$emit("changeLetter", this.letterActive);
// this.$emit("changeLetter", this.letters[index]); // this.$emit("changeLetter", this.letters[index]);
}, },
}, },
...@@ -161,6 +169,22 @@ export default { ...@@ -161,6 +169,22 @@ export default {
border-bottom: 1px solid #bbbbbb; border-bottom: 1px solid #bbbbbb;
// background: red; // background: red;
flex-direction: column; flex-direction: column;
position: relative;
.tips {
width: 80px;
height: 24px;
background: #1d84ff;
font-size: 14px;
color: #fff;
position: absolute;
// top: -45px;
// left: 0px;
top: -25px;
left: 70px;
text-align: center;
line-height: 24px;
}
.top { .top {
background: #f9f9f9; background: #f9f9f9;
height: 54px; height: 54px;
...@@ -207,6 +231,7 @@ export default { ...@@ -207,6 +231,7 @@ export default {
} }
} }
} }
.bottom { .bottom {
max-height: 70px; max-height: 70px;
// background: black; // background: black;
...@@ -217,6 +242,7 @@ export default { ...@@ -217,6 +242,7 @@ export default {
width: 756px; width: 756px;
flex-wrap: wrap; flex-wrap: wrap;
margin: 0 auto; margin: 0 auto;
overflow: hidden;
.change { .change {
width: 90px; width: 90px;
height: 30px; height: 30px;
......
danger-manage-web/src/views/visitorExam/Trainingmaterials/components/QuestionChoice.vue 0 → 100644
View file @ 5e599d6e
<!--
* @Author: 纪泽龙 jizelong@qq.com
* @Date: 2022-09-21 11:00:14
* @LastEditors: 纪泽龙 jizelong@qq.com
* @LastEditTime: 2023-01-29 09:34:10
* @FilePath: /danger-manage-web/src/views/myLessons/components/Question.vue
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
<div class="question flex">
<div class="tips">{{ tipsArr[questionObj.topicType]}}</div>
<div
class="top"
:class="{ flex: alignItemsCenter }"
:style="{ alignItems: alignItemsCenter ? 'center' : '' }"
ref="top"
>
<div class="text" ref="text">
{{ questionObj.text }}
</div>
<div class="num">{{ nowQuestion + 1 }}</div>
</div>
<div class="middle">
<div
class="item flex"
v-for="(item, index) in questionObj.question"
:key="item + 'aas' + index"
>
<div class="letter">
{{ letters[index] }}
</div>
<div class="">
{{ item }}
</div>
</div>
</div>
<div class="bottom flex">
<div class="change-wrapper flex">
<div
class="change"
:class="{ active: letterActive.indexOf(index) >= 0 }"
@click="changeLetter(index)"
v-for="(item, index) in questionObj.question"
:key="item + 'a' + index"
>
{{ letters[index] }}
</div>
</div>
</div>
</div>
</template>
<script>
const letters = [
"A",
"B",
"C",
"D",
"E",
"F",
"G",
"H",
"I",
"J",
"K",
"L",
"M",
"N",
"O",
"P",
"Q",
"R",
"S",
"T",
"U",
"V",
"W",
"X",
"Y",
"Z",
];
export default {
name: "question",
props: {
questionObj: {
type: Object,
default: () => {
return {
text: "asdfasdf",
question: [
"沙发斯蒂芬大师沙发斯蒂芬大师沙发斯蒂芬大师沙发斯蒂芬大师沙发斯蒂芬大师沙发斯蒂芬大师沙发斯蒂芬大师沙发斯蒂芬大师沙发斯蒂芬大师沙发斯蒂芬大师沙发斯蒂芬大师沙发斯蒂芬大师沙发斯蒂芬大师沙发斯蒂芬大师沙发斯蒂芬大师沙发斯蒂芬大师沙发斯蒂芬大师沙发斯蒂芬大师沙发斯蒂芬大师沙发斯蒂芬大师沙发斯蒂芬大师",
"沙发斯蒂芬大师",
"沙发斯蒂芬大师",
"沙发斯蒂芬大师",
"沙发斯蒂芬大师",
],
};
},
},
nowQuestion: {
type: Number,
},
index: {
type: Number,
},
// 从外面传进来的选项，选择过的才有，没选择过的没有
selectLetter: {
type: [String, Number, Array],
default: () => {
return [];
},
},
},
data() {
return {
alignItemsCenter: false,
// 如果传进来了，就是这个值，如果没有就是null，因为动画需要那个key的问题，会清空原始的盒子，所以要传一下值
letterActive: this.selectLetter,
letters,
tipsArr: {
1: "单选题",
2: "多选题",
3: "判断题",
},
};
},
mounted() {
// console.log('123')
// 每次都会更新，所以不需要watch 直接在这里面写 因为动画需要那个key的问题，会清空原始的盒子，所以要传一下值
this.textCenter();
},
watch: {
// 监听一下当前题目，调整一下位置
// nowQuestion(value) {
// console.log('nowQuestion变化',value)
// this.$nextTick(() => {
// this.textCenter();
// });
// },
},
methods: {
textCenter() {
let h1 = this.$refs.text?.offsetHeight;
let h2 = this.$refs.top?.offsetHeight;
// 如果text大于或者等于top，就出不居中，如果不小于top，就上下居中
if (h2 <= h1) {
this.alignItemsCenter = false;
} else {
this.alignItemsCenter = true;
}
},
changeLetter(index) {
// this.letterActive = index;
const ind = this.letterActive.indexOf(index);
console.log(this.letterActive);
if (ind < 0) {
this.letterActive.push(index);
} else {
this.letterActive.splice(ind, 1);
}
this.$emit("changeLetter", this.letterActive);
// this.$emit("changeLetter", this.letters[index]);
},
},
};
</script>
<style lang="scss" scoped>
.question {
// position: absolute;
// top: 0px;
// display: inline-block;
width: 100%;
height: 370px;
padding-bottom: 10px;
border-bottom: 1px solid #bbbbbb;
// background: red;
flex-direction: column;
position: relative;
.tips {
width: 80px;
height: 24px;
background: #1d84ff;
font-size: 14px;
color: #fff;
position: absolute;
// top: -45px;
// left: 0px;
top: -25px;
left: 70px;
text-align: center;
line-height: 24px;
}
.top {
background: #f9f9f9;
height: 54px;
padding: 0px 10px 0px 43px;
overflow-wrap: anywhere;
// align-items: center;
overflow-y: auto;
position: relative;
.text {
font-size: 14px;
text-indent: 2em;
}
.num {
position: absolute;
left: 0;
width: 48px;
height: 48px;
top: 4px;
background: #1d84ff;
border-radius: 50%;
text-align: center;
line-height: 48px;
font-size: 18px;
color: #ffffff;
}
}
.middle {
flex: 1;
// background: blue;
overflow-y: auto;
padding-left: 43px;
padding-right: 10px;
margin-bottom: 15px;
.item {
padding-top: 38px;
width: 100%;
overflow-wrap: anywhere;
font-size: 14px;
color: #101010;
.letter {
padding: 2px;
margin-right: 10px;
box-sizing: border-box;
}
}
}
.bottom {
max-height: 70px;
// background: black;
padding-left: 43px;
padding-right: 10px;
overflow-y: auto;
.change-wrapper {
width: 756px;
flex-wrap: wrap;
margin: 0 auto;
.change {
width: 90px;
height: 30px;
background: #e8f4ff;
color: #101010;
border: 1px solid #a3d3ff;
line-height: 30px;
text-align: center;
margin: 0 9px 5px;
border-radius: 4px;
cursor: pointer;
&.active {
background: #1d84ff;
color: #ffffff;
border: 1px solid #a3d3ff;
}
&:hover {
background: rgba(29, 132, 255, 0.5);
color: #ffffff;
}
}
}
}
}
</style>
danger-manage-web/src/views/visitorExam/Trainingmaterials/index.vue
View file @ 5e599d6e
...@@ -163,7 +163,7 @@ ...@@ -163,7 +163,7 @@
methods: { methods: {
getPlanList() { getPlanList() {
//跳转页面的传值 //跳转页面的传值
console.log(JSON.parse(this.$route.query.params).beyondUnit) // console.log(JSON.parse(this.$route.query.params).beyondUnit)
ITContractorTrainCourse().then((res) => { ITContractorTrainCourse().then((res) => {
this.data=res.data; this.data=res.data;
this.changeVideo(this.data.video); this.changeVideo(this.data.video);
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment