Skip to content

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

访客承包商页面题目修改，手机端考试修改

parent abb5a4b6
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 1971 additions and 976 deletions
danger-manage-web/src/api/educationPlanExam/lessonsProgram.js
View file @ 525c5db6
......@@ -2,7 +2,7 @@
* @Author: 纪泽龙 jizelong@qq.com
* @Date: 2022-09-23 11:02:24
* @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
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......@@ -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 @ 525c5db6
......@@ -276,7 +276,6 @@ export default {
// 新增选项
add(addValue) {
this.form.questions.push({ value: addValue });
console.log();
},
save(num = 2) {
return new Promise((resove) => {
......
danger-manage-web/src/views/educationPlanExam/visitorProgram/ChangeQuestion.vue 0 → 100644
View file @ 525c5db6
<!--
* @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 @ 525c5db6
<template>
<div class="form-wrapper">
<div style="width: 100%;height:100%;">
<el-form :model="contractTrainForm" :rules="rules" ref="contractTrainForm" label-width="100px" class="demo-ruleForm">
<el-form-item label="培训名称" prop="courseName">
<el-input v-model="contractTrainForm.courseName"></el-input>
</el-form-item>
<el-form-item label="培训内容" prop="courseConent">
<el-input type="textarea" v-model="contractTrainForm.courseConent" rows="5"></el-input>
</el-form-item>
<div class="flex">
<el-form-item label="视频上传" v-if="!readOnly" prop="video">
<FileUpload
listType="picture"
@resFun="getFileInfoVideo"
@remove="listRemoveVideo"
:fileArr="fileListVideo"
:fileSize="500"
:fileType="['mp4']"
/>
<el-input v-show="false" 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>
</el-form>
<div class="form-wrapper">
<div style="width: 100%; height: 100%">
<el-form
:model="contractTrainForm"
:rules="rules"
ref="contractTrainForm"
label-width="100px"
class="demo-ruleForm"
>
<el-form-item label="培训名称" prop="courseName">
<el-input v-model="contractTrainForm.courseName"></el-input>
</el-form-item>
<el-form-item label="培训内容" prop="courseConent">
<el-input
type="textarea"
v-model="contractTrainForm.courseConent"
rows="5"
></el-input>
</el-form-item>
<div class="flex">
<el-form-item label="视频上传" v-if="!readOnly" prop="video">
<FileUpload
listType="picture"
@resFun="getFileInfoVideo"
@remove="listRemoveVideo"
:fileArr="fileListVideo"
:fileSize="500"
:fileType="['mp4']"
/>
<el-input
v-show="false"
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>
<visitorQuestion ref="visitorQuestion"></visitorQuestion>
</el-form>
</div>
<visitorQuestion ref="visitorQuestion"></visitorQuestion>
</div>
</template>
<script>
import FileUpload from "@/components/FileUpload";
import uploadfile from "@/assets/uploadfile.png";
import visitorQuestion from "@/views/educationPlanExam/visitorProgram/visitorQuestion";
import {listCourse} from "@/api/contractTrain/contractTrain";
export default {
data() {
return {
contractTrainForm: {
courseName: '',
courseConent: '',
video: "",
enclosure: "",
},
fileListVideo: [],
fileListFile: [],
readOnly: false,
rules: {
name: [
{ required: true, message: '请输入培训名称', trigger: 'blur' }
],
region: [
{ required: true, message: '请输入培训内容', trigger: 'change' }
],
video: [
{ required: true, trigger: "blue", message: "视频不能为空" }
],
enclosure: [
{ required: true, trigger: "blur", message: "附件不能为空" },
],
import FileUpload from "@/components/FileUpload";
import uploadfile from "@/assets/uploadfile.png";
import visitorQuestion from "@/views/educationPlanExam/visitorProgram/visitorQuestion";
import { listCourse } from "@/api/contractTrain/contractTrain";
export default {
data() {
return {
contractTrainForm: {
courseName: "",
courseConent: "",
video: "",
enclosure: "",
},
fileListVideo: [],
fileListFile: [],
readOnly: false,
rules: {
name: [{ required: true, message: "请输入培训名称", trigger: "blur" }],
region: [
{ required: true, message: "请输入培训内容", trigger: "change" },
],
video: [{ 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: {
FileUpload,
visitorQuestion,
listRemoveVideo(e) {
this.fileListVideo = [];
this.contractTrainForm.video = "";
// this.form.videoName = null;
},
created() {
this.getContractTrainList();
getFileInfoFile(res) {
this.contractTrainForm.enclosure = res.url;
this.fileListFile = [
{
name: res.fileName,
url: uploadfile,
},
];
},
methods: {
getContractTrainList(){
listCourse().then(res =>{
this.contractTrainForm = res.rows[0];
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;
},
}
}
listRemoveFile(e) {
this.fileListFild = [];
this.contractTrainForm.enclosure = "";
// this.form.fileName = null;
},
},
};
</script>
<style lang="scss" scoped>
.form-wrapper {
......@@ -148,7 +174,7 @@
height: 100%;
margin-bottom: 20px;
}
.flex{
.flex {
width: 100%;
justify-content: space-around;
padding: 20px 30px;
......
danger-manage-web/src/views/system/qRCode/index.vue
View file @ 525c5db6
<!--
* @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>
<img :src="src" style=" position: relative;
left: 37%;
top: 10%;
width: 27%;">
<img :src="src" style="position: relative; left: 37%; top: 10%; width: 27%" />
</template>
<script>
const src = require('../qRCode/img/qrcode_1673250700723.png')
export default{
computed:{
src(){
return src
}
}
}
const src = require("../qRCode/img/qrcode_1673250700723.png");
export default {
computed: {
src() {
return src;
},
},
};
</script>
danger-manage-web/src/views/visitorExam/Trainingmaterials/components/AnswerLesson.vue
View file @ 525c5db6
......@@ -13,11 +13,12 @@
<div ref="myBody" class="body" v-loading="loading">
<div class="text">
<div class="float">炼铁车间炉前工安全生产规范课程</div>
</div>
<transition name="fade" mode="out-in">
<div :key="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 v-for="(item, index) in list" :key="item.id">
<Question
......@@ -30,6 +31,33 @@
/>
</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>
<div class="select flex">
......@@ -77,7 +105,7 @@
<script>
import Question from "./Question";
import GoodJob from "./GoodJob.vue";
import GoodJob from "./GoodJobOld.vue";
import {
userQuestionList,
setAnswer,
......@@ -148,7 +176,9 @@ export default {
// this.answerClear();
// this.$emit("update:visible", false);
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;
setAnswer({
userCourseId: this.userCourseId,
......@@ -158,13 +188,12 @@ export default {
if (res.code == 200) {
this.goodJobData = res.data;
this.goodJobShow = true;
}
})
.finally(() => {
this.loading = false;
// 是否作对
this.$emit('jj',this.goodJobData)
this.$emit("jj", this.goodJobData);
});
},
dialogCancel() {
......
danger-manage-web/src/views/visitorExam/Trainingmaterials/components/GoodJob.vue
View file @ 525c5db6
......@@ -2,7 +2,7 @@
* @Author: 纪泽龙 jizelong@qq.com
* @Date: 2022-09-21 17:20:49
* @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
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
......@@ -13,17 +13,16 @@
<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)
}}，成绩合格！
<!-- 恭喜你，做对{{ goodJobData.answer }}道题 -->
恭喜你，得分{{ goodJobData.answer }}，成绩合格！
</div>
</template>
<template v-else>
<div class="icon"><i class="iconfont icon-nanguo" /></div>
<div>
继续努力，做对{{ goodJobData.answer }}道题得分{{
Math.floor((goodJobData.answer / goodJobData.topicNum) * 100)
}}，成绩不合格！
继续努力，
<!-- 做对{{ goodJobData.answer }}道题 -->
得分{{ goodJobData.answer }}，成绩不合格！
</div>
</template>
</div>
......@@ -49,16 +48,16 @@ export default {
.goodjob-wrapper {
justify-content: center;
align-items: center;
width: 86%;
width: 100%;
height: 100%;
border-bottom: 1px solid #bbbbbb;
.text {
width: 94%;
height: 174px;
width: 100%;
height: 136px;
color: #1d84ff;
background: #f9f9f9 100%;
border-radius: 15px;
line-height: 40px;
line-height: 136px;
font-size: 28px;
justify-content: center;
align-items: center;
......
danger-manage-web/src/views/visitorExam/Trainingmaterials/components/GoodJobOld.vue 0 → 100644
View file @ 525c5db6
<!--
* @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 @ 525c5db6
......@@ -2,12 +2,13 @@
* @Author: 纪泽龙 jizelong@qq.com
* @Date: 2022-09-21 11:00:14
* @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
* @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 }"
......@@ -23,7 +24,7 @@
<div
class="item flex"
v-for="(item, index) in questionObj.question"
:key="item+'aas'+index"
:key="item + 'aas' + index"
>
<div class="letter">
{{ letters[index] }}
......@@ -38,10 +39,10 @@
<div class="change-wrapper flex">
<div
class="change"
:class="{ active: letterActive+'' === index+'' }"
:class="{ active: letterActive.indexOf(index) >= 0 }"
@click="changeLetter(index)"
v-for="(item, index) in questionObj.question"
:key="item+'a'+index"
:key="item + 'a' + index"
>
{{ letters[index] }}
</div>
......@@ -105,8 +106,8 @@ export default {
},
// 从外面传进来的选项，选择过的才有，没选择过的没有
selectLetter: {
type: [String, Number],
default:999,
type: [String, Number, Array],
default: [],
},
},
data() {
......@@ -115,6 +116,11 @@ export default {
// 如果传进来了，就是这个值，如果没有就是null，因为动画需要那个key的问题，会清空原始的盒子，所以要传一下值
letterActive: this.selectLetter,
letters,
tipsArr: {
1: "单选题",
2: "多选题",
3: "判断题",
},
};
},
mounted() {
......@@ -143,8 +149,10 @@ export default {
}
},
changeLetter(index) {
this.letterActive = index;
this.$emit("changeLetter", index);
// this.letterActive = index;
// this.$emit("changeLetter", index);
this.letterActive = [index];
this.$emit("changeLetter", this.letterActive);
// this.$emit("changeLetter", this.letters[index]);
},
},
......@@ -161,6 +169,22 @@ export default {
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;
......@@ -207,6 +231,7 @@ export default {
}
}
}
.bottom {
max-height: 70px;
// background: black;
......@@ -217,6 +242,7 @@ export default {
width: 756px;
flex-wrap: wrap;
margin: 0 auto;
overflow: hidden;
.change {
width: 90px;
height: 30px;
......
danger-manage-web/src/views/visitorExam/Trainingmaterials/components/QuestionChoice.vue 0 → 100644
View file @ 525c5db6
<!--
* @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 @ 525c5db6
......@@ -163,7 +163,7 @@
methods: {
getPlanList() {
//跳转页面的传值
console.log(JSON.parse(this.$route.query.params).beyondUnit)
// console.log(JSON.parse(this.$route.query.params).beyondUnit)
ITContractorTrainCourse().then((res) => {
this.data=res.data;
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