Skip to content

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

制作考试人员选择的组件

parent 12b3a02a
Hide whitespace changes
Inline Side-by-side
Showing with 2466 additions and 70 deletions
danger-manage-web/src/assets/styles/zehong.scss
View file @ fa399a4b
......@@ -355,4 +355,85 @@
margin: 0;
}
}
// text-Paper lession.vue table样式
.left-middle-table {
.el-table th.el-table__cell.is-leaf,
.el-table td.el-table__cell {
border: none
}
.has-gutter .el-table th.el-table__cell.is-leaf,
.el-table td.el-table__cell {
border-bottom: 1px solid #E5E6EB;
}
.el-table th.el-table__cell.is-leaf,
.el-table td.el-table__cell {
box-sizing: border-box;
}
.el-table--medium .el-table__cell:nth-child(1) {
padding: 0;
}
.el-table .el-table__header-wrapper th,
.el-table .el-table__fixed-header-wrapper th {
background-color: #F7F7F7;
}
.el-table--fit {
// height: 100%;
}
.el-table th.el-table__cell>.cell {
padding-left: 14px;
}
.el-table::before {
height: 0px;
}
// 表头的input样式
.el-checkbox__input.is-indeterminate .el-checkbox__inner {
background-color: rgba(0, 0, 0, 0);
border-color: #C4C4C4;
}
.el-checkbox__input.is-indeterminate .el-checkbox__inner:before{
background-color:#62656C !important;
}
// 内容的
// 改变对钩颜色
.el-checkbox__inner:after {
border-color: #62656C !important;
}
.el-checkbox__inner {
border: 1px solid #C4C4C4;
}
.el-checkbox__input.is-checked .el-checkbox__inner {
background-color: rgba(0, 0, 0, 0);
border-color: #C4C4C4;
}
.el-checkbox__input.is-checked .el-checkbox__inner {
border-color: #C4C4C4;
}
.el-checkbox__input.is-focus .el-checkbox__inner {
border-color: #C4C4C4;
}
.el-checkbox__inner:hover {
border-color: #C4C4C4;
}
}
\ No newline at end of file
danger-manage-web/src/components/PeopleChange/ChangPapelTable.vue 0 → 100644
View file @ fa399a4b
<!--
* @Author: 纪泽龙 jizelong@qq.com
* @Date: 2022-12-19 15:23:58
* @LastEditors: 纪泽龙 jizelong@qq.com
* @LastEditTime: 2022-12-21 16:56:26
* @FilePath: /danger-manage-web/src/views/educationPlanExam/textPaper/components/Lesson-table.vue
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
<div>
<el-table
v-loading="loading"
:data="nameList"
height="305"
@select="select"
@select-all="all"
ref="multipleTable"
>
<el-table-column type="selection"></el-table-column>
<el-table-column label="姓名" align="center" prop="staffName">
</el-table-column>
<el-table-column
label="所属部门"
align="center"
prop="deptName"
:formatter="formatter"
>
</el-table-column>
<el-table-column
label="岗位"
align="center"
prop="profession"
:formatter="formatter"
>
</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> -->
</div>
</template>
<script>
import { listStaff } from "@/api/safetyManagement/staff";
export default {
name: "",
props: {
selectNameList: {
type: Array,
},
},
created() {
// this.listStaff();
},
data() {
return {
queryParams: {
pageNum: 1,
pageSize: 10,
deptId: null,
staffName: null,
},
total: 0,
nameList: [],
loading: false,
};
},
methods: {
listStaff() {
this.loading = true;
listStaff(this.queryParams).then((res) => {
this.total = res.total;
this.nameList = res.rows;
this.$nextTick((item) => {
this.selectNameList.forEach((item) => {
this.toggleSelection(item.staffId, true);
});
this.loading = false;
});
});
},
// toggleSelection(rows) {
// if (rows) {
// rows.forEach((row) => {
// this.$refs.multipleTable.toggleRowSelection(row);
// });
// } else {
// this.$refs.multipleTable.clearSelection();
// }
// },
select(all, row) {
this.$emit("selectOne", all, row);
},
all(all) {
console.log(all);
// true是全选，false是全清
let allSelect = false;
if (all.length == 0 || (all.length == 1 && [0] == undefined)) {
allSelect = false;
} else if (all.length > 1) {
allSelect = true;
}
this.$emit("selectAll", this.nameList, allSelect);
},
// 切换选项
toggleSelection(staffId, SeclctFlag = false) {
const item = this.nameList.find((item) => {
return item.staffId == staffId;
});
this.$refs.multipleTable.toggleRowSelection(item, SeclctFlag);
},
currentChangeClick(val) {
this.queryParams.pageNum = val;
this.listStaff();
},
formatter(row, column, cellValue, index) {
// console.log(row, column, cellValue, index);
if (!cellValue) return "-";
else return cellValue;
},
},
};
</script>
<style lang="scss" scoped>
</style>
danger-manage-web/src/components/PeopleChange/index.vue 0 → 100644
View file @ fa399a4b
<!--
* @Author: 纪泽龙 jizelong@qq.com
* @Date: 2022-12-19 17:39:55
* @LastEditors: 纪泽龙 jizelong@qq.com
* @LastEditTime: 2022-12-21 17:36:34
* @FilePath: /danger-manage-web/src/views/educationPlanExam/textPaper/components/ChangePapel.vue
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
<div class="changePeople-wrapper flex">
<div class="changePeople-left">
<div class="top-search flex">
<el-select
v-model="deptId"
filterable
placeholder="请选择"
size="mini"
style="width: 40%"
clearable
>
<el-option
v-for="item in searchList"
:key="item.deptId"
:label="item.deptName"
:value="item.deptId"
>
</el-option>
</el-select>
<el-input
v-model="staffName"
size="mini"
placeholder="请输入内容"
suffix-icon="el-icon-date"
style="width: 48%"
>
</el-input>
<div>
<el-button @click="searchTable" size="mini">搜索</el-button>
</div>
</div>
<div class="left-middle-table">
<ChangPapelTable
ref="table"
:selectNameList.sync="selectNameList"
@selectOne="selectOne"
@selectAll="selectAll"
/>
</div>
<!-- <div class="bottom-text">共有3n人</div> -->
</div>
<div class="middle flex">
<div>>>></div>
</div>
<div class="changePeople-right flex">
<div class="people-card flex zzz">
<div
class="item flex"
v-for="item in selectNameList"
:key="item.staffId"
>
<div>{{ item.staffName }}</div>
<div class="close" @click="deleteName(item.staffId)">x</div>
</div>
</div>
<div class="bottom-text">已选择n人</div>
</div>
</div>
</template>
<script>
import ChangPapelTable from "./ChangPapelTable";
import { listDept } from "@/api/system/dept";
export default {
name: "changepeopel",
components: {
ChangPapelTable,
},
props: {
// 传进组件的已经被选择的人名
jsonSelectNameList: {
type: String,
default: null,
},
},
data() {
return {
selectNameList: [],
searchList: [],
deptId: null,
staffName: null,
};
},
created() {
listDept().then((res) => {
console.log(res);
this.searchList = res.data;
});
},
mounted() {},
watch: {
selectNameList() {
let json;
if (this.selectNameList.length == 0) {
json = null;
}
if (Array.isArray(this.selectNameList)) {
json = this.selectNameList.map((item) => {
return {
staffId: item.staffId,
staffName: item.staffName,
};
});
} else {
json = this.selectNameList;
}
this.$emit("getPeopleList", JSON.stringify(json));
},
},
methods: {
changeNameList(jsonSelectNameList) {
if (jsonSelectNameList) {
this.selectNameList = JSON.parse(jsonSelectNameList);
} else {
this.selectNameList = [];
}
this.$refs.table.listStaff();
},
searchTable() {
this.$refs.table.queryParams = {
pageNum: 1,
pageSize: 10,
deptId: this.deptId,
staffName: this.staffName,
};
this.$refs.table.listStaff();
},
deleteName(staffId) {
const index = this.selectNameList.findIndex((item) => {
return item.staffId == staffId;
});
if (index >= 0) {
console.log(index);
this.selectNameList.splice(index, 1);
this.$refs.table.toggleSelection(staffId);
}
},
addName(row) {
const index = this.selectNameList.findIndex((item) => {
// console.log(item.id)
return item.staffId == row.staffId;
});
console.log(index);
if (index >= 0) {
this.selectNameList.splice(index, 1);
} else {
this.selectNameList.push(row);
}
},
selectAll(all, allSelect) {
// console.log(all);
console.log(allSelect);
if (allSelect) {
all.forEach((item) => {
const index = this.selectNameList.findIndex((iten) => {
return iten.staffId == item.staffId;
});
if (index < 0) {
this.selectNameList.push(item);
}
});
} else {
all.forEach((item) => {
this.deleteName(item.staffId);
});
}
},
selectOne(all, row) {
this.addName(row);
// console.log(all,row)
},
},
};
</script>
<style lang="scss" scoped>
.changePeople-wrapper {
width: 100%;
height: 400px;
// background-color: red;
margin-top: 10px;
justify-content: space-between;
& > div {
flex-direction: column;
}
.changePeople-left,
.changePeople-right {
width: 415px;
height: 100%;
border: 1px solid #e5e6eb;
}
.middle {
align-items: center;
justify-content: center;
div{
color:#1890FF;
font-weight: 2000;
}
}
.changePeople-left {
padding: 14px 20px 11px 16px;
flex-direction: column;
.top-search {
margin-bottom: 12px;
justify-content: space-between;
}
.left-middle-table {
flex: 1;
// background: red;
}
.bottom-text {
padding-top: 10px;
font-size: 12px;
height: 20px;
line-height: 20px;
text-align: right;
color: #1890ff;
}
}
.changePeople-right {
flex-direction: column;
padding-top: 14px;
height: 100%;
.people-card {
flex-wrap: wrap;
align-content: flex-start;
width: 100%;
flex: 1;
height: 0;
padding-left: 11px;
overflow-y: scroll;
&::-webkit-scrollbar {
display: none; /* Chrome Safari */
}
.item {
width: 70px;
height: 30px;
line-height: 30px;
padding-left: 10px;
padding-right: 5px;
margin-right: 10px;
color: #3d3d3d;
box-sizing: border-box;
margin-bottom: 10px;
box-sizing: border-box;
border: 1px solid #a3d3ff;
border-radius: 3px;
font-size: 12px;
position: relative;
justify-content: space-between;
}
.close {
cursor: pointer;
}
}
.bottom-text {
// padding-top: 10px;
padding-right: 10px;
font-size: 12px;
height: 20px;
line-height: 20px;
text-align: right;
color: #1890ff;
}
}
}
</style>
danger-manage-web/src/views/educationPlanExam/questionBank/components/AddQuestion.vue
View file @ fa399a4b
......@@ -116,13 +116,13 @@
</template>
<script>
import {
addQuestion,
checkQuestion,
changeQuestion,
getQuestion,
getLessonById,
} from "@/api/educationPlanExam/lessonsProgram.js";
// import {
// addQuestion,
// checkQuestion,
// changeQuestion,
// getQuestion,
// getLessonById,
// } from "@/api/educationPlanExam/lessonsProgram.js";
import { addSubject ,getSubject,listSubject,updateSubject} from "@/api/educationPlanExam/subject";
export default {
......@@ -132,10 +132,10 @@ export default {
// type: Boolean,
// default: false,
// },
courseId: {
bankId: {
type: Number,
},
topicId: {
subjectId: {
type: Number,
},
},
......@@ -156,8 +156,8 @@ export default {
created() {
// 如果存在就是修改
if (this.topicId) {
getSubject(this.topicId).then((res) => {
if (this.subjectId) {
getSubject(this.subjectId).then((res) => {
console.log('?',res.data);
const data = res.data;
this.form = {
......@@ -171,16 +171,16 @@ export default {
// 查询是第几道题
this.getQuestion();
// 获取课程标题
this.getLessonById(this.courseId);
// this.getLessonById(this.bankId);
},
methods: {
getQuestion() {
listSubject({ bankId: this.courseId }).then((res) => {
listSubject({ bankId: this.bankId }).then((res) => {
console.log(res)
// 如果是修改 就是原来的值，如果不是，就是总数+1
if (this.topicId) {
if (this.subjectId) {
res.rows.forEach((item, index) => {
if (item.subjectId == this.topicId) {
if (item.subjectId == this.subjectId) {
this.questionNextNum = index+1;
}
});
......@@ -189,18 +189,18 @@ export default {
}
});
},
getLessonById(courseId) {
getLessonById(courseId).then((res) => {
console.log(res);
this.courseName = res.data.courseName;
});
},
// getLessonById(bankId) {
// getLessonById(bankId).then((res) => {
// console.log(res);
// this.courseName = res.data.courseName;
// });
// },
addQuestion(data) {
// 如果是修改，就用修改的方法，如果是新增，就用新增的方法
if (this.topicId) {
return updateSubject({ subjectId: this.topicId, ...data });
if (this.subjectId) {
return updateSubject({ subjectId: this.subjectId, ...data });
} else {
return addSubject({ bankId: this.courseId, ...data });
return addSubject({ bankId: this.bankId, ...data });
}
},
rightAnswerClick(index) {
......@@ -241,7 +241,7 @@ export default {
this.addQuestion(data).then((res) => {
if (res.code == 200) {
// 把修改的这个归位，变成正常添加
this.$emit("update:topicId", null);
this.$emit("update:subjectId", null);
this.$message({
message: "添加题目成功",
type: "success",
......
danger-manage-web/src/views/educationPlanExam/questionBank/components/Dia.vue
View file @ fa399a4b
......@@ -2,7 +2,7 @@
* @Author: 纪泽龙 jizelong@qq.com
* @Date: 2022-09-22 10:38:49
* @LastEditors: 纪泽龙 jizelong@qq.com
* @LastEditTime: 2022-09-28 17:48:07
* @LastEditTime: 2022-12-17 14:28:56
* @FilePath: /danger-manage-web/src/views/lessonsProgram/components/addLesson.vue
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
......@@ -22,8 +22,8 @@
<transition name="fade" mode="out-in">
<component
:is="currentComponent"
:courseId.sync="courseId"
:topicId.sync="topicId"
:bankId.sync="bankId"
:subjectId.sync="subjectId"
ref="current"
></component>
</transition>
......@@ -70,7 +70,7 @@ export default {
type: Number,
default: 1,
},
courseId: {
bankId: {
type: Number,
},
},
......@@ -85,7 +85,7 @@ export default {
title: "录入课程",
currentComponent: Lesson,
// 当前题目查看
topicId: null,
subjectId: null,
};
},
watch: {
......@@ -93,7 +93,7 @@ export default {
handler(num) {
if (num === 1) {
this.currentComponent = Lesson;
if (this.courseId) {
if (this.bankId) {
this.title = "修改课程";
} else {
this.title = "新增课程";
......@@ -104,7 +104,7 @@ export default {
this.title = "题目列表";
} else {
this.currentComponent = AddQuestion;
if (this.topicId) {
if (this.subjectId) {
this.title = "修改题目";
} else {
this.title = "新增题目";
......@@ -148,8 +148,8 @@ export default {
this.$emit("update:visible", false);
},
// 把ID改变了
changeCourseId(courseId) {
this.$emit("update:courseId", courseId);
changeCourseId(bankId) {
this.$emit("update:bankId", bankId);
},
// 改变当前组件
componentsNumChange(num) {
......
danger-manage-web/src/views/educationPlanExam/questionBank/components/Lesson.vue
View file @ fa399a4b
......@@ -2,7 +2,7 @@
* @Author: 纪泽龙 jizelong@qq.com
* @Date: 2022-09-22 10:59:44
* @LastEditors: 纪泽龙 jizelong@qq.com
* @LastEditTime: 2022-12-16 17:35:04
* @LastEditTime: 2022-12-17 14:36:14
* @FilePath: /danger-manage-web/src/views/lessonsProgram/components/Lession.vue
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
......@@ -79,12 +79,12 @@
import Editor from "./Editor";
import FileUpload from "@/components/FileUpload";
import uploadfile from "@/assets/uploadfile.png";
import { mapGetters } from "vuex";
import {
addLessons,
getLessonById,
changeLesson,
} from "@/api/educationPlanExam/lessonsProgram";
// import { mapGetters } from "vuex";
// import {
// addLessons,
// getLessonById,
// changeLesson,
// } from "@/api/educationPlanExam/lessonsProgram";
import {
listBank,
addBank,
......@@ -100,7 +100,7 @@ import "@riophae/vue-treeselect/dist/vue-treeselect.css";
export default {
name: "",
props: {
courseId: {
bankId: {
type: Number,
},
},
......@@ -150,7 +150,7 @@ export default {
// ...mapGetters(["courseOptions"]),
},
created() {
if (this.courseId) {
if (this.bankId) {
this.getLessonById();
}
// 归属部门列表
......@@ -160,12 +160,12 @@ export default {
methods: {
// 添加课程
addLessons(data) {
if (!this.courseId) {
if (!this.bankId) {
console.log("添加");
return addBank(data);
} else {
console.log("修改");
return updateBank({ bankId: this.courseId, ...data });
return updateBank({ bankId: this.bankId, ...data });
}
},
/** 查询部门下拉树结构 */
......@@ -195,7 +195,7 @@ export default {
select() {},
// 复现
getLessonById() {
getBank(this.courseId).then((res) => {
getBank(this.bankId).then((res) => {
console.log("res", res);
if (res.code == 200) {
this.form = {
......@@ -267,7 +267,7 @@ export default {
this.addLessons({ ...this.form }).then((res) => {
// 如果添加会传回来，就用传回来的，如果是修改本身就有，就用本身的
// console.log('res',res)
const courseId = this.courseId || res;
const bankId = this.bankId || res;
// if (res.code == 200) {
// 这样调比较纯函数一点
if (num == 2) {
......@@ -282,7 +282,7 @@ export default {
});
}
this.$parent.$parent.componentsNumChange(num);
this.$parent.$parent.changeCourseId(courseId);
this.$parent.$parent.changeCourseId(bankId);
this.$parent.$parent.$parent.getList();
return true;
......
danger-manage-web/src/views/educationPlanExam/questionBank/components/QuestionList.vue
View file @ fa399a4b
......@@ -2,7 +2,7 @@
* @Author: 纪泽龙 jizelong@qq.com
* @Date: 2022-09-22 17:56:05
* @LastEditors: 纪泽龙 jizelong@qq.com
* @LastEditTime: 2022-12-17 11:06:28
* @LastEditTime: 2022-12-17 14:28:57
* @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
-->
......@@ -25,7 +25,7 @@
<div class="td-wrapper">
<div
v-for="(item, index) in questionList"
:key="item.topicId"
:key="item.subjectId"
class="td flex"
>
<div class="left">{{ index + 1 }}</div>
......@@ -91,7 +91,7 @@ import { getBank } from "@/api/educationPlanExam/questionBank";
export default {
name: "AnswerLesson",
props: {
courseId: {
bankId: {
type: Number,
},
},
......@@ -118,11 +118,11 @@ export default {
// },
created() {
console.log("this.courseId", this.courseId);
if (this.courseId) {
this.getQuestion({ bankId: this.courseId });
console.log("this.bankId", this.bankId);
if (this.bankId) {
this.getQuestion({ bankId: this.bankId });
// 获取只题目正确几题算过关
this.getLessonById(this.courseId);
this.getLessonById(this.bankId);
}
},
methods: {
......@@ -132,9 +132,9 @@ export default {
saveAndNext() {
this.$parent.$parent.componentsNumChange(3);
},
getQuestion(courseId) {
console.log(courseId);
return listSubject(courseId).then((res) => {
getQuestion(bankId) {
console.log(bankId);
return listSubject(bankId).then((res) => {
console.log("题库res", res);
this.questionList = res.rows.map((item) => {
......@@ -147,18 +147,18 @@ export default {
return true;
});
},
getLessonById(courseId) {
getBank(courseId).then((res) => {
getLessonById(bankId) {
getBank(bankId).then((res) => {
// console.log(res);
// this.rightNum = res.data.qualifiedNum;
this.courseName = res.data.bankName;
});
},
edit(subjectId) {
this.$emit("update:topicId", subjectId);
this.$emit("update:subjectId", subjectId);
this.$parent.$parent.componentsNumChange(3);
},
deleteLesson(topicId) {
deleteLesson(subjectId) {
this.$confirm("请确定删除该题", {
confirmButtonText: "确定",
cancelButtonText: "取消",
......@@ -166,7 +166,7 @@ export default {
})
.then(() => {
this.loading = true;
return delSubject(topicId);
return delSubject(subjectId);
})
.then((res) => {
if (res.code == 200) {
......@@ -175,7 +175,7 @@ export default {
type: "success",
});
}
return this.getQuestion({ bankId: this.courseId });
return this.getQuestion({ bankId: this.bankId });
})
.finally(() => {
this.loading = false;
......@@ -192,7 +192,7 @@ export default {
return;
}
changeLesson({
courseId: this.courseId,
bankId: this.bankId,
qualifiedNum: this.rightNum,
}).then((res) => {
if (res.code == 200) {
......
danger-manage-web/src/views/educationPlanExam/questionBank/index.vue
View file @ fa399a4b
......@@ -24,7 +24,7 @@
</el-form-item> -->
<el-form-item
label="归属部门"
label="考试名称"
prop="deptId"
ref="treeItem"
>
......@@ -40,7 +40,7 @@
<el-form-item label="名称" prop="courseName">
<el-input
v-model="queryParams.courseName"
placeholder="请输入课程名称"
placeholder="考试时间"
clearable
size="small"
/>
......@@ -85,7 +85,8 @@
</el-row>
<el-table v-loading="loading" :data="bankList">
<el-table-column label="题库序号" align="center" prop="bankNum" />
<el-table-column label="序号" width='50' align="center" prop="bankNum"/>
<el-table-column label="题库名称" align="center" prop="bankName">
</el-table-column>
<el-table-column
......@@ -180,7 +181,7 @@
<Dia
ref="Dia"
:componentsNum.sync="componentsNum"
:courseId.sync="bankId"
:bankId.sync="bankId"
:visible.sync="dilogFlag"
/>
......
danger-manage-web/src/views/educationPlanExam/textPaper/components/AddQuestion.vue 0 → 100644
View file @ fa399a4b
<template>
<div ref="myBody" class="add-question flex">
<div class="text flex">
<div class="left">
目前录入题目是第<span>{{ questionNextNum }}</span
>道题
</div>
<div class="right">{{ courseName }}</div>
</div>
<el-form class="form flex" ref="form" :model="form" label-width="auto">
<!-- <div class="top flex"> -->
<div>
<el-form-item
label="题目内容"
prop="topicTitle"
:rules="{
required: true,
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">
<div
@click="rightAnswerClick(index)"
class="right"
:class="{ active: answerNum === index }"
>
设为正确答案
</div>
<el-button
size="mini"
type="danger"
v-if="index > 0"
@click.prevent="removeDomain(question)"
>删除</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">
<div
@click="rightAnswerClick(form.questions.length)"
class="right"
:class="{ active: answerNum === form.questions.length }"
>
设为正确答案
</div>
<el-button
size="mini"
type="primary"
@click.prevent="add(addValue)"
>新增</el-button
>
</div>
</div>
</el-form-item>
</div>
</el-form>
</div>
</template>
<script>
// import {
// addQuestion,
// checkQuestion,
// changeQuestion,
// getQuestion,
// getLessonById,
// } from "@/api/educationPlanExam/lessonsProgram.js";
import { addSubject ,getSubject,listSubject,updateSubject} from "@/api/educationPlanExam/subject";
export default {
name: "AnswerLesson",
props: {
// visible: {
// type: Boolean,
// default: false,
// },
bankId: {
type: Number,
},
subjectId: {
type: Number,
},
},
components: {},
data() {
return {
form: {
topicTitle: "",
questions: [{ value: "" }, { value: "" }, { value: "" }],
},
answerNum: null,
addValue: "",
// 录入的是第几道题
questionNextNum: 1,
courseName: "",
};
},
created() {
// 如果存在就是修改
if (this.subjectId) {
getSubject(this.subjectId).then((res) => {
console.log('?',res.data);
const data = res.data;
this.form = {
topicTitle: data.topicTitle,
questions: JSON.parse(data.topicOption),
};
this.answerNum = data.answer;
});
}
// 查询是第几道题
this.getQuestion();
// 获取课程标题
// this.getLessonById(this.bankId);
},
methods: {
getQuestion() {
listSubject({ bankId: this.bankId }).then((res) => {
console.log(res)
// 如果是修改 就是原来的值，如果不是，就是总数+1
if (this.subjectId) {
res.rows.forEach((item, index) => {
if (item.subjectId == this.subjectId) {
this.questionNextNum = index+1;
}
});
} else {
this.questionNextNum = res.total + 1;
}
});
},
// getLessonById(bankId) {
// getLessonById(bankId).then((res) => {
// console.log(res);
// this.courseName = res.data.courseName;
// });
// },
addQuestion(data) {
// 如果是修改，就用修改的方法，如果是新增，就用新增的方法
if (this.subjectId) {
return updateSubject({ subjectId: this.subjectId, ...data });
} else {
return addSubject({ bankId: this.bankId, ...data });
}
},
rightAnswerClick(index) {
this.answerNum = index;
console.log(index);
},
// 删除选项
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);
}
},
// 新增选项
add(addValue) {
this.form.questions.push({ value: addValue });
console.log();
},
save(num = 2) {
return new Promise((resove) => {
if (!this.answerNum && this.answerNum !== 0) {
this.$message({
message: "警告，请设置一个正确答案",
type: "warning",
});
return resove(false);
}
this.$refs.form.validate((valid) => {
if (valid) {
const data = {};
data.topicTitle = this.form.topicTitle;
data.topicOption = JSON.stringify(this.form.questions);
data.answer = this.answerNum;
this.addQuestion(data).then((res) => {
if (res.code == 200) {
// 把修改的这个归位，变成正常添加
this.$emit("update:subjectId", null);
this.$message({
message: "添加题目成功",
type: "success",
});
this.$parent.$parent.componentsNumChange(num);
this.$parent.$parent.$parent.getList();
resove(true);
}
});
}
});
});
},
saveAndNext() {
this.save(3).then((res) => {
if (res) {
this.reset();
// this.questionNextNum++;
this.getQuestion();
}
});
},
reset() {
this.form = {
topicTitle: "",
questions: [{ value: "" }, { value: "" }, { value: "" }],
};
this.answerNum = null;
this.addValue = "";
},
},
};
</script>
<style lang="scss" scoped>
.add-question {
width: 100%;
height: 550px;
// overflow: hidden;
flex-direction: column;
padding-bottom: 7px;
margin-bottom: 20px;
border-bottom: 1px solid #bbbbbb;
.form {
flex: 1;
flex-direction: column;
height: 100%;
.bottom {
overflow-y: auto;
height: 330px;
box-sizing: border-box;
.algin-items {
align-items: center;
width: 200px;
}
.right {
display: inline-block;
width: 133px;
margin-right: 10px;
line-height: initial;
padding: 4px 0;
border: 1px solid #bbbbbb;
color: #101010;
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;
}
}
}
}
.text {
margin-top: 13px;
margin-bottom: 34px;
justify-content: space-between;
height: 28px;
.left {
line-height: 28px;
color: #101010;
font-size: 14px;
}
.right {
width: 411px;
line-height: 28px;
background: #1d84ff;
padding-right: 5px;
color: #fff;
text-align: right;
}
}
}
</style>
danger-manage-web/src/views/educationPlanExam/textPaper/components/Dia.vue 0 → 100644
View file @ fa399a4b
<!--
* @Author: 纪泽龙 jizelong@qq.com
* @Date: 2022-09-22 10:38:49
* @LastEditors: 纪泽龙 jizelong@qq.com
* @LastEditTime: 2022-12-19 14:01:37
* @FilePath: /danger-manage-web/src/views/lessonsProgram/components/addLesson.vue
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
<el-dialog
class="add-lession"
:title="title"
:visible.sync="visible"
width="1020px"
:close-on-click-modal="false"
:close-on-press-escape="false"
:before-close="dialogCancel"
@closed="closeFinished"
destroy-on-close
>
<div v-if="visible" ref="myBody" class="body">
<transition name="fade" mode="out-in">
<component
:is="currentComponent"
:bankId.sync="bankId"
:subjectId.sync="subjectId"
ref="current"
></component>
</transition>
<!-- <Lesson ref='lesson'/> -->
<!-- <AddQuestion />
<QuestionList/> -->
</div>
<div slot="footer" class="dialog-footer">
<el-button
type="primary"
v-if="this.componentsNum == 1 || this.componentsNum == 3"
@click="save"
>保存</el-button
>
<el-button type="primary" @click="saveAndNext">{{
saveNextText
}}</el-button>
<el-button
v-if="this.componentsNum == 2"
type="primary"
@click="dialogCancel"
>{{ "确认" }}</el-button
>
<el-button @click="dialogCancel">取消</el-button>
</div>
</el-dialog>
</template>
<script>
import Lesson from "./Lesson";
import AddQuestion from "./AddQuestion";
import QuestionList from "./QuestionList";
export default {
name: "AnswerLesson",
props: {
visible: {
type: Boolean,
default: false,
},
componentsNum: {
type: Number,
default: 1,
},
bankId: {
type: Number,
},
},
// components: {
// Lesson,
// AddQuestion,
// QuestionList,
// },
data() {
return {
title: "录入课程",
currentComponent: Lesson,
// 当前题目查看
subjectId: null,
};
},
watch: {
componentsNum: {
handler(num) {
if (num === 1) {
this.currentComponent = Lesson;
if (this.bankId) {
this.title = "修改课程";
} else {
this.title = "新增课程";
}
} else if (num === 2) {
this.currentComponent = QuestionList;
this.title = "题目列表";
} else {
this.currentComponent = AddQuestion;
if (this.subjectId) {
this.title = "修改题目";
} else {
this.title = "新增题目";
}
}
},
deep: true,
},
},
computed: {
saveNextText() {
let text;
if (this.componentsNum == 1) {
text = "保存并录入题目";
} else if (this.componentsNum == 2) {
text = "录入考题";
} else {
text = "保存并录入下一题";
}
return text;
},
},
methods: {
saveBody() {
this.startHeight = this.$refs.myBody.offsetHeight - 55 + "px";
},
closeFinished() {},
// 关闭之后
// 只保存
save() {
// this.answerClear();
this.$refs.current.save();
},
// 保存并录入
saveAndNext() {
this.$refs.current.saveAndNext();
},
// 隐藏与显示dialog
dialogCancel() {
this.$emit("update:visible", false);
},
// 把ID改变了
changeCourseId(bankId) {
this.$emit("update:bankId", bankId);
},
// 改变当前组件
componentsNumChange(num) {
this.$emit("update:componentsNum", num);
},
answerClear() {
this.answerArr = [];
this.changeCourseId(null);
},
},
};
</script>
<style lang="scss" scoped>
.body {
width: 100%;
height: 100%;
padding-right: 40px;
padding-left: 36px;
}
</style>
danger-manage-web/src/views/educationPlanExam/textPaper/components/Editor.vue 0 → 100644
View file @ fa399a4b
<template>
<div>
<el-upload
:action="uploadUrl"
:on-success="handleUploadSuccess"
:on-error="handleUploadError"
name="file"
:show-file-list="false"
:headers="headers"
style="display: none"
ref="upload"
v-if="this.uploadUrl"
>
</el-upload>
<div class="editor" ref="editor" :style="styles"></div>
</div>
</template>
<script>
import Quill from "quill";
import "quill/dist/quill.core.css";
import "quill/dist/quill.snow.css";
import "quill/dist/quill.bubble.css";
import { getToken } from "@/utils/auth";
export default {
name: "Editor",
props: {
/* 编辑器的内容 */
value: {
type: String,
default: "",
},
/* 高度 */
height: {
type: Number,
default: null,
},
/* 最小高度 */
minHeight: {
type: Number,
default: null,
},
/* 只读 */
readOnly: {
type: Boolean,
default: false,
},
/* 上传地址 */
uploadUrl: {
type: String,
default: "",
}
},
data() {
return {
headers: {
Authorization: "Bearer " + getToken()
},
Quill: null,
currentValue: "",
options: {
theme: "snow",
bounds: document.body,
debug: "warn",
modules: {
// 工具栏配置
toolbar: [
["bold", "italic", "underline", "strike"], // 加粗 斜体 下划线 删除线
["blockquote", "code-block"], // 引用 代码块
[{ list: "ordered" }, { list: "bullet" }], // 有序、无序列表
[{ indent: "-1" }, { indent: "+1" }], // 缩进
[{ size: ["small", false, "large", "huge"] }], // 字体大小
[{ header: [1, 2, 3, 4, 5, 6, false] }], // 标题
[{ color: [] }, { background: [] }], // 字体颜色、字体背景颜色
[{ align: [] }], // 对齐方式
["clean"], // 清除文本格式
["link", "image"] // 链接、图片、视频"video"
],
},
placeholder: "请输入内容",
readOnly: this.readOnly,
},
};
},
computed: {
styles() {
let style = {};
if (this.minHeight) {
style.minHeight = `${this.minHeight}px`;
}
if (this.height) {
style.height = `${this.height}px`;
}
return style;
},
},
watch: {
value: {
handler(val) {
if (val !== this.currentValue) {
this.currentValue = val === null ? "" : val;
if (this.Quill) {
this.Quill.pasteHTML(this.currentValue);
}
}
},
immediate: true,
},
},
mounted() {
this.init();
},
beforeDestroy() {
this.Quill = null;
},
methods: {
init() {
const editor = this.$refs.editor;
this.Quill = new Quill(editor, this.options);
// 如果设置了上传地址则自定义图片上传事件
if (this.uploadUrl) {
let toolbar = this.Quill.getModule("toolbar");
toolbar.addHandler("image", (value) => {
this.uploadType = "image";
if (value) {
this.$refs.upload.$children[0].$refs.input.click();
} else {
this.quill.format("image", false);
}
});
toolbar.addHandler("video", (value) => {
this.uploadType = "video";
if (value) {
this.$refs.upload.$children[0].$refs.input.click();
} else {
this.quill.format("video", false);
}
});
}
this.Quill.pasteHTML(this.currentValue);
this.Quill.on("text-change", (delta, oldDelta, source) => {
const html = this.$refs.editor.children[0].innerHTML;
const text = this.Quill.getText();
const quill = this.Quill;
this.currentValue = html;
this.$emit("input", html);
this.$emit("on-change", { html, text, quill });
});
this.Quill.on("text-change", (delta, oldDelta, source) => {
this.$emit("on-text-change", delta, oldDelta, source);
});
this.Quill.on("selection-change", (range, oldRange, source) => {
this.$emit("on-selection-change", range, oldRange, source);
});
this.Quill.on("editor-change", (eventName, ...args) => {
this.$emit("on-editor-change", eventName, ...args);
});
},
handleUploadSuccess(res, file) {
// 获取富文本组件实例
let quill = this.Quill;
// 如果上传成功
if (res.code == 200) {
// 获取光标所在位置
let length = quill.getSelection().index;
// 插入图片 res.url为服务器返回的图片地址
quill.insertEmbed(length, "image", res.url);
// 调整光标到最后
quill.setSelection(length + 1);
} else {
this.$message.error("图片插入失败");
}
},
handleUploadError() {
this.$message.error("图片插入失败");
},
},
};
</script>
<style>
.editor, .ql-toolbar {
white-space: pre-wrap !important;
line-height: normal !important;
}
.quill-img {
display: none;
}
.ql-snow .ql-tooltip[data-mode="link"]::before {
content: "请输入链接地址:";
}
.ql-snow .ql-tooltip.ql-editing a.ql-action::after {
border-right: 0px;
content: "保存";
padding-right: 0px;
}
.ql-snow .ql-tooltip[data-mode="video"]::before {
content: "请输入视频地址:";
}
.ql-snow .ql-picker.ql-size .ql-picker-label::before,
.ql-snow .ql-picker.ql-size .ql-picker-item::before {
content: "14px";
}
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="small"]::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="small"]::before {
content: "10px";
}
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="large"]::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="large"]::before {
content: "18px";
}
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="huge"]::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="huge"]::before {
content: "32px";
}
.ql-snow .ql-picker.ql-header .ql-picker-label::before,
.ql-snow .ql-picker.ql-header .ql-picker-item::before {
content: "文本";
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="1"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]::before {
content: "标题1";
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="2"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]::before {
content: "标题2";
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="3"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]::before {
content: "标题3";
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="4"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]::before {
content: "标题4";
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="5"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]::before {
content: "标题5";
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="6"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]::before {
content: "标题6";
}
.ql-snow .ql-picker.ql-font .ql-picker-label::before,
.ql-snow .ql-picker.ql-font .ql-picker-item::before {
content: "标准字体";
}
.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="serif"]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="serif"]::before {
content: "衬线字体";
}
.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="monospace"]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="monospace"]::before {
content: "等宽字体";
}
</style>
danger-manage-web/src/views/educationPlanExam/textPaper/components/Lesson.vue 0 → 100644
View file @ fa399a4b
<!--
* @Author: 纪泽龙 jizelong@qq.com
* @Date: 2022-09-22 10:59:44
* @LastEditors: 纪泽龙 jizelong@qq.com
* @LastEditTime: 2022-12-21 17:30:33
* @FilePath: /danger-manage-web/src/views/lessonsProgram/components/Lession.vue
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
<div class="form-wrapper">
<el-form
class="form"
ref="form"
:model="form"
label-width="auto"
:rules="rules"
>
<div class="top flex">
<el-form-item label="题库名称" prop="bankName">
<el-input style="width: 500px" v-model="form.bankName"></el-input>
</el-form-item>
<el-form-item label="开始时间" prop="releaseTime">
<el-date-picker
v-model="form.startTime"
value-format="yyyy-MM-dd HH:mm:ss"
type="datetime"
placeholder="开始时间"
default-time="12:00:00"
>
</el-date-picker>
</el-form-item>
</div>
<el-form-item label="结束时间" prop="releaseTime">
<el-date-picker
v-model="form.endTime"
value-format="yyyy-MM-dd HH:mm:ss"
type="datetime"
placeholder="结束时间"
default-time="12:00:00"
>
</el-date-picker>
</el-form-item>
<el-form-item label="选择人员" prop="releaseTime">
<!-- table -->
<!-- jsonSelectNameList就是呗选中的人员的json -->
<!-- getPeopleList 是每次选中或者删除人员都会返回 一个所有人员列表的json串，[{staffId:staffId,staffName:staffName},{staffId:staffId,staffName:staffName}] -->
<!-- 要在jsonSelectNameList赋值完毕之后 调用一下 this.$refs.changePaple.changeNameList 135行 -->
<ChangePapel
ref="changePaple"
:jsonSelectNameList="jsonSelectNameList"
@getPeopleList="getPeopleList"
/>
</el-form-item>
</el-form>
</div>
</template>
<script>
import ChangePapel from "@/components/PeopleChange";
// import { mapGetters } from "vuex";
// import {
// addLessons,
// getLessonById,
// changeLesson,
// } from "@/api/educationPlanExam/lessonsProgram";
import {
listBank,
addBank,
updateBank,
getBank,
} from "@/api/educationPlanExam/questionBank";
// 所有部门
import { treeselect } from "@/api/system/dept";
import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
export default {
name: "",
props: {
bankId: {
type: Number,
},
// jsonSelectNameList: {
// type: String,
// default:
// '[{"staffId":880,"staffName":"孙卓亚"},{"staffId":871,"staffName":"张玉宾"},{"staffId":869,"staffName":"李二朝"},{"staffId":870,"staffName":"盖永峰"},{"staffId":868,"staffName":"刘丽艳"},{"staffId":867,"staffName":"霍文俊"},{"staffId":866,"staffName":"刘志坚"},{"staffId":865,"staffName":"郝文权"},{"staffId":864,"staffName":"齐雪军"},{"staffId":852,"staffName":"刘江平"},{"staffId":853,"staffName":"谷建海"},{"staffId":851,"staffName":"丁振国"},{"staffId":850,"staffName":"齐江波"},{"staffId":849,"staffName":"周立新"},{"staffId":848,"staffName":"史志波"},{"staffId":847,"staffName":"王增波"},{"staffId":846,"staffName":"杨彦龙"},{"staffId":845,"staffName":"杨华国"},{"staffId":844,"staffName":"王青华"}]',
// },
},
components: {
ChangePapel,
},
data() {
return {
form: {
bankName: "",
// courseType: "",
// courseConent: "",
// video: "",
// enclosure: "",
deptId: null,
abc: 0,
},
// 参考人员
jsonSelectNameList: null,
// 归属部门列表
deptOptions: [],
fileListVideo: [],
fileListFile: [],
readOnly: false,
// selectNameList: [],
rules: {
bankName: [
{ required: true, trigger: "blur", message: "课程名称不能为空" },
],
deptId: [
{ required: true, trigger: "blur", message: "请选择所属部门" },
],
},
};
},
computed: {
// 获取课程类型
// ...mapGetters(["courseOptions"]),
},
created() {
if (this.bankId) {
this.getLessonById();
}
// 归属部门列表
// this.getTreeselect();
},
mounted() {
// this.jsonSelectNameList
// '[{"staffId":880,"staffName":"孙卓亚"},{"staffId":871,"staffName":"张玉宾"},{"staffId":869,"staffName":"李二朝"},{"staffId":870,"staffName":"盖永峰"},{"staffId":868,"staffName":"刘丽艳"},{"staffId":867,"staffName":"霍文俊"},{"staffId":866,"staffName":"刘志坚"},{"staffId":865,"staffName":"郝文权"},{"staffId":864,"staffName":"齐雪军"},{"staffId":852,"staffName":"刘江平"},{"staffId":853,"staffName":"谷建海"},{"staffId":851,"staffName":"丁振国"},{"staffId":850,"staffName":"齐江波"},{"staffId":849,"staffName":"周立新"},{"staffId":848,"staffName":"史志波"},{"staffId":847,"staffName":"王增波"},{"staffId":846,"staffName":"杨彦龙"},{"staffId":845,"staffName":"杨华国"},{"staffId":844,"staffName":"王青华"}]';
this.$refs.changePaple.changeNameList(this.jsonSelectNameList);
},
methods: {
// 添加课程
addLessons(data) {
if (!this.bankId) {
console.log("添加");
return addBank(data);
} else {
console.log("修改");
return updateBank({ bankId: this.bankId, ...data });
}
},
// 复现
getLessonById() {
getBank(this.bankId).then((res) => {
console.log("res", res);
if (res.code == 200) {
this.form = {
bankName: res.data.bankName,
deptId: res.data.deptId,
};
// const data = res.data;
// const { bankName, courseType, courseConent, video, enclosure } =
// data;
// this.form = {
// bankName,
// courseType,
// courseConent,
// video,
// enclosure,
// };
// this.fileListVideo = [
// {
// name: bankName + "视频",
// url: uploadfile,
// },
// ];
// this.fileListFile = [
// {
// name: bankName + "附件",
// url: uploadfile,
// },
// ];
}
});
},
// 获取参考人员的list
getPeopleList(list) {
console.log("参考人员", list);
},
save(num = 2) {
// 因为富文本编辑器会残留<p><br></p>，所以要清空
// if (this.form.courseConent === "<p><br></p>") {
// this.form.courseConent = "";
// }
this.$refs.form.validate((valid) => {
if (valid) {
this.addLessons({ ...this.form }).then((res) => {
// 如果添加会传回来，就用传回来的，如果是修改本身就有，就用本身的
// console.log('res',res)
const bankId = this.bankId || res;
// if (res.code == 200) {
// 这样调比较纯函数一点
if (num == 2) {
this.$message({
message: "保存题库成功",
type: "success",
});
} else if (num == 3) {
this.$message({
message: "保存题库成功,请开始录入题目",
type: "success",
});
}
this.$parent.$parent.componentsNumChange(num);
this.$parent.$parent.changeCourseId(bankId);
this.$parent.$parent.$parent.getList();
return true;
// }
});
} else {
if (!this.form.deptId) {
document.querySelector(
".vue-treeselect__control"
).style.borderColor = "red";
} else {
document.querySelector(
".vue-treeselect__control"
).style.borderColor = "";
this.$refs.treeItem.clearValidate();
}
}
});
},
// 保存并进入题目
saveAndNext() {
this.save(3);
},
},
};
</script>
<style lang="scss" scoped>
.form-wrapper {
padding-top: 22px;
width: 100%;
height: 550px;
// overflow: hidden;
// padding-bottom: 10px;
margin-bottom: 20px;
// border-bottom: 1px solid #bbbbbb;
.top {
width: 100%;
justify-content: space-between;
}
}
</style>
danger-manage-web/src/views/educationPlanExam/textPaper/components/QuestionList.vue 0 → 100644
View file @ fa399a4b
<!--
* @Author: 纪泽龙 jizelong@qq.com
* @Date: 2022-09-22 17:56:05
* @LastEditors: 纪泽龙 jizelong@qq.com
* @LastEditTime: 2022-12-17 14:28:57
* @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
-->
<template>
<div ref="myBody" class="add-question flex">
<div class="text flex">
<div class="left">
目前有<span>{{ questionNum || 0 }}</span
>道题
<!-- <span class="warn">温馨提示：发布课程前需要进行考试设置</span> -->
</div>
<div class="right">{{ courseName }}</div>
</div>
<div class="table flex" v-loading="loading">
<div class="th flex">
<div class="left">序号</div>
<div class="middle">题目名称</div>
<div class="right">操作</div>
</div>
<div class="td-wrapper">
<div
v-for="(item, index) in questionList"
:key="item.subjectId"
class="td flex"
>
<div class="left">{{ index + 1 }}</div>
<div class="middle zzz">
{{ item.topicTitle }}
</div>
<div class="right">
<div>
<el-button
@click="edit(item.subjectId)"
icon="el-icon-edit"
type="text"
>修改</el-button
>
<el-button
@click="deleteLesson(item.subjectId)"
icon="el-icon-delete"
type="text"
>删除</el-button
>
</div>
</div>
</div>
</div>
</div>
<!-- <div class="rightNum flex">
<div class="left">录入考题</div>
<div class="middle flex">
<div class="left-text">答对题目大于</div>
<div>
<el-input
v-model="rightNum"
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>
</template>
<script>
import {
getQuestion,
deleteQuestion,
changeLesson,
getLessonById,
} from "@/api/educationPlanExam/lessonsProgram";
import { listSubject, delSubject } from "@/api/educationPlanExam/subject";
import { getBank } from "@/api/educationPlanExam/questionBank";
export default {
name: "AnswerLesson",
props: {
bankId: {
type: Number,
},
},
components: {},
data() {
return {
// 当前课程的第几题，调一遍接口
questionNum: null,
// 答对几道题
rightNum: 0,
questionList: [],
loading: false,
courseName: "",
};
},
// watch: {
// visible(newValue) {
// if (newValue) {
// this.$nextTick(() => {
// this.saveBody();
// });
// }
// },
// },
created() {
console.log("this.bankId", this.bankId);
if (this.bankId) {
this.getQuestion({ bankId: this.bankId });
// 获取只题目正确几题算过关
this.getLessonById(this.bankId);
}
},
methods: {
save() {
console.log("QuestionList");
},
saveAndNext() {
this.$parent.$parent.componentsNumChange(3);
},
getQuestion(bankId) {
console.log(bankId);
return listSubject(bankId).then((res) => {
console.log("题库res", res);
this.questionList = res.rows.map((item) => {
return {
subjectId: item.subjectId,
topicTitle: item.topicTitle,
};
});
this.questionNum = res.total;
return true;
});
},
getLessonById(bankId) {
getBank(bankId).then((res) => {
// console.log(res);
// this.rightNum = res.data.qualifiedNum;
this.courseName = res.data.bankName;
});
},
edit(subjectId) {
this.$emit("update:subjectId", subjectId);
this.$parent.$parent.componentsNumChange(3);
},
deleteLesson(subjectId) {
this.$confirm("请确定删除该题", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(() => {
this.loading = true;
return delSubject(subjectId);
})
.then((res) => {
if (res.code == 200) {
this.$message({
message: "删除成功",
type: "success",
});
}
return this.getQuestion({ bankId: this.bankId });
})
.finally(() => {
this.loading = false;
// 课程列表重置一下
this.$parent.$parent.$parent.getList();
});
},
saveRightNum() {
if (this.rightNum > this.questionList.length) {
this.$message({
message: "答对题目数应小于等于考试题目总数",
type: "warning",
});
return;
}
changeLesson({
bankId: this.bankId,
qualifiedNum: this.rightNum,
}).then((res) => {
if (res.code == 200) {
this.$message({
message: "答题合格数修改成功",
type: "success",
});
}
});
},
},
};
</script>
<style lang="scss" scoped>
.add-question {
width: 100%;
height: 550px;
// 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;
}
}
.table {
flex: 1;
height: 0;
flex-direction: column;
.th {
width: 100%;
height: 70px;
line-height: 70px;
background: #f5f5f5;
color: #606266;
> div {
height: 100%;
}
.left {
width: 15%;
text-align: center;
}
.middle {
width: 60%;
padding-left: 100px;
}
.right {
width: 25%;
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;
}
}
}
}
.rightNum {
margin-top: 5px;
height: 55px;
box-sizing: border-box;
border: 1px solid #bbbbbb;
line-height: 55px;
> .left {
width: 140px;
background: #0bab0c;
font-size: 14px;
color: #fff;
text-align: center;
}
> .middle {
> div {
margin-right: 5px;
}
.left-text {
margin-left: 10px;
}
.middle {
margin-right: 20px;
}
}
.right {
margin-left: 20px;
}
// background: black;
}
}
</style>
danger-manage-web/src/views/educationPlanExam/textPaper/index.vue 0 → 100644
View file @ fa399a4b
<template>
<div class="app-container">
<el-form
:model="queryParams"
ref="queryForm"
:inline="true"
label-width="68px"
>
<!-- <el-form-item label="课件类别" prop="courseType">
<el-select
v-model="queryParams.courseType"
placeholder="请选择课程类型"
clearable
size="small"
>
<el-option
v-for="course in courseOptions"
:key="course.planId"
:label="course.planName"
:value="course.planId"
/>
</el-select>
</el-form-item> -->
<el-form-item label="考试名称" prop="courseName">
<el-input
v-model="queryParams.courseName"
placeholder="请输入课程名称"
clearable
size="small"
/>
</el-form-item>
<el-form-item label="考试时间" prop="releaseTime">
<el-date-picker
v-model="queryParams.releaseTime"
value-format="yyyy-MM-dd HH:mm:ss"
type="datetime"
placeholder="选择日期时间"
default-time="12:00:00"
>
</el-date-picker>
</el-form-item>
<!-- <el-form-item label="发布时间" prop="releaseTime">
<el-date-picker
v-model="queryParams.releaseTime"
value-format="yyyy-MM-dd HH:mm:ss"
type="datetime"
placeholder="选择日期时间"
default-time="12:00:00"
>
</el-date-picker>
</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-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="primary"
plain
icon="el-icon-plus"
size="mini"
@click="handleAdd"
v-hasPermi="['system:book:add']"
>新增</el-button
>
</el-col>
</el-row>
<el-table v-loading="loading" :data="bankList">
<el-table-column label="序号" width='100' align="center" prop="bankNum"/>
<el-table-column label="考试名称" align="center" prop="bankName">
</el-table-column>
<el-table-column label="开始时间" align="center" prop="startTime">
</el-table-column>
<el-table-column label="结束时间" align="center" prop="endTime">
</el-table-column>
<el-table-column label="答对几题合格" align="center" prop="endTime">
</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="enclosure">
<template v-slot="{ row: { enclosure } }">
<a
v-if="enclosure && enclosure.indexOf('.txt') >= 0"
@click="downloadText(enclosure)"
class="down-load"
>下载附件</a
>
<a v-else :href="enclosure" class="down-load">下载附件</a>
</template>
</el-table-column> -->
<!-- <el-table-column label="视频" align="center" prop="video">
<template v-slot="{ row: { courseName, video } }">
<a @click="downLoadVideo(video, courseName)" class="down-load"
>下载视频</a
>
</template>
</el-table-column>
<el-table-column
label="发布时间"
align="center"
prop="releaseTime"
:formatter="formatter"
/> -->
<!-- <el-table-column
label="考试题数量"
align="center"
prop="topicNum"
width="180"
>
<template v-slot="{ row: { topicNum, bankId } }">
<div @click="checkQuestion(bankId)" class="timuNum">
<div v-if="topicNum > 0">{{ `已录入${topicNum}题` }}</div>
<div v-else>未录入</div>
</div>
</template>
</el-table-column> -->
<el-table-column
label="操作"
align="center"
class-name="small-padding fixed-width"
>
<template v-slot="{ row: { bankId } }">
<!-- <div>{{status}}</div> -->
<el-button
size="mini"
type="text"
icon="el-icon-document-add"
@click="changeBank(bankId)"
>录入考题</el-button
>
<el-button
size="mini"
type="text"
icon="el-icon-delete"
@click="deletBank(bankId)"
>删除</el-button
>
<el-button
size="mini"
type="text"
icon="el-icon-edit"
@click="changeBank(bankId)"
>编辑</el-button
>
<el-button
size="mini"
type="text"
icon="el-icon-edit"
@click="changeBank(bankId)"
>发布考试</el-button
>
<!-- <el-button
v-if="status == 0"
size="mini"
type="text"
icon="el-icon-delete"
@click="issueLesson(bankId)"
>发布</el-button
> -->
</template>
</el-table-column>
</el-table>
<pagination
v-show="total > 0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<Dia
ref="Dia"
:componentsNum.sync="componentsNum"
:bankId.sync="bankId"
:visible.sync="dilogFlag"
/>
<el-dialog> </el-dialog>
</div>
</template>
<script>
// import {
// getLessons,
// getLessonById,
// issue,
// deleteLesson,
// } from "@/api/educationPlanExam/lessonsProgram.js";
import { listBank,delBank } from "@/api/educationPlanExam/questionBank";
// 部门列表
import { treeselect } from "@/api/system/dept";
import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
// 获取课程类型
// import { getPlanList } from "@/api/educationPlanExam/trainingProgram";
// import { mapGetters, mapMutations } from "vuex";
import Dia from "./components/Dia";
export default {
name: "textPaper",
components: {
Dia,
Treeselect
},
data() {
return {
// 遮罩层
loading: false,
// 总条数
total: 0,
// courseOptions: [],
bankList: [],
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
// 所属部门
deptId: null,
// 题库名称
bankName: null,
releaseTime: "",
},
// 表单参数
form: {},
// 表单校验
dilogFlag: false,
componentsNum: 1,
// 点击的id，如果是新增为空
bankId: null,
// 题库id
deptId: null,
// 归属部门列表
deptOptions: [],
};
},
computed: {
// ...mapGetters(["courseOptions"]),
},
created() {
// this.getPlanList();
this.getTreeselect();
this.getList();
},
methods: {
// ...mapMutations({ setOptions: "SET_COURSE_OPTIONS" }),
/** 查询部门下拉树结构 */
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;
}
}
}
}
},
// 获取课程类别，也就是计划名称
// getPlanList() {
// getPlanList().then((res) => {
// const courseOptions = res.data.map((item) => {
// return {
// planId: item.planId,
// planName: item.planName,
// };
// });
// // this.$store.commit("SET_COURSE_OPTIONS");
// this.setOptions(courseOptions);
// });
// },
/** 查询课程列表 */
getList() {
this.loading = true;
listBank(this.queryParams)
.then((res) => {
console.log(res);
this.bankList = res.rows.map((item, index) => {
return {
bankNum:
index +
1 +
(this.queryParams.pageNum - 1) * this.queryParams.pageSize,
...item,
};
});
this.total = res.total;
})
.finally(() => {
this.loading = false;
});
},
search() {
// console.log(this.queryParams);
this.getList();
},
/** 新增按钮操作 */
handleAdd() {
this.$refs.Dia.title = "新增题库";
this.componentsNum = 1;
this.bankId = null;
this.dilogFlag = true;
},
changeBank(bankId) {
this.$refs.Dia.title = "修改题库";
this.componentsNum = 1;
this.bankId = bankId;
this.dilogFlag = true;
},
// 直接查看考题
checkQuestion(bankId) {
// 要查看考题的id
this.bankId = bankId;
console.log(this.bankId);
// 2代表列表组件
this.componentsNum = 2;
this.dilogFlag = true;
},
// 重置
resetClick() {
this.reset();
this.getList();
},
// 复位
reset() {
this.queryParams = {
pageNum: 1,
pageSize: 10,
courseType: null,
courseName: null,
releaseTime: "",
};
},
deletBank(bankId) {
this.$confirm("请确定删除", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(() => {
return delBank(bankId);
})
.then((res) => {
if (res.code == 200) {
this.$message({
message: "删除成功",
type: "success",
});
}
this.getList();
})
.catch(() => {});
},
// 发布
// issueLesson(bankId) {
// this.$confirm("请确定发布", {
// confirmButtonText: "确定",
// cancelButtonText: "取消",
// type: "warning",
// })
// .then(() => {
// // 判断是否录入答题合格数
// return getLessonById(bankId);
// })
// .then((res) => {
// if (res.data.qualifiedNum > 0) {
// return true;
// }
// })
// .then((res) => {
// if (res) {
// // 成功就发布
// return issue({ bankId });
// } else {
// this.$message({
// message: "请先录入答题合格数",
// type: "warning",
// });
// }
// })
// .then((res) => {
// if (res.code == 200) {
// this.$message({
// message: "发布成功",
// type: "success",
// });
// this.getList();
// }
// })
// .catch(() => {});
// },
formatter(row, column, cellValue, index) {
// console.log(row, column, cellValue, index);
if (!cellValue) return "-";
else return cellValue;
},
// downloadText(url) {
// // url = url.replace(/\\/g, "/");
// const xhr = new XMLHttpRequest();
// xhr.open("GET", url, true);
// xhr.responseType = "blob";
// //xhr.setRequestHeader('Authorization', 'Basic a2VybWl0Omtlcm1pdA==');
// xhr.onload = function () {
// if (xhr.readyState === 4 && xhr.status === 200) {
// let blob = this.response;
// console.log(blob);
// // 转换一个blob链接
// // 注: URL.createObjectURL() 静态方法会创建一个 DOMString(DOMString 是一个UTF-16字符串)，
// // 其中包含一个表示参数中给出的对象的URL。这个URL的生命周期和创建它的窗口中的document绑定
// let downLoadUrl = window.URL.createObjectURL(
// new Blob([blob], {
// type: "txt",
// })
// );
// // 视频的type是video/mp4，图片是image/jpeg
// // 01.创建a标签
// let a = document.createElement("a");
// // 02.给a标签的属性download设定名称
// a.download = name;
// // 03.设置下载的文件名
// a.href = downLoadUrl;
// // 04.对a标签做一个隐藏处理
// a.style.display = "none";
// // 05.向文档中添加a标签
// document.body.appendChild(a);
// // 06.启动点击事件
// a.click();
// // 07.下载完毕删除此标签
// a.remove();
// }
// };
// xhr.send();
// },
// downLoadVideo(url, name) {
// var xhr = new XMLHttpRequest();
// xhr.open("GET", url, true);
// xhr.responseType = "arraybuffer"; // 返回类型blob
// xhr.onload = function () {
// if (xhr.readyState === 4 && xhr.status === 200) {
// let blob = this.response;
// console.log(blob);
// // 转换一个blob链接
// // 注: URL.createObjectURL() 静态方法会创建一个 DOMString(DOMString 是一个UTF-16字符串)，
// // 其中包含一个表示参数中给出的对象的URL。这个URL的生命周期和创建它的窗口中的document绑定
// let downLoadUrl = window.URL.createObjectURL(
// new Blob([blob], {
// type: "video/mp4",
// })
// );
// // 视频的type是video/mp4，图片是image/jpeg
// // 01.创建a标签
// let a = document.createElement("a");
// // 02.给a标签的属性download设定名称
// a.download = name;
// // 03.设置下载的文件名
// a.href = downLoadUrl;
// // 04.对a标签做一个隐藏处理
// a.style.display = "none";
// // 05.向文档中添加a标签
// document.body.appendChild(a);
// // 06.启动点击事件
// a.click();
// // 07.下载完毕删除此标签
// a.remove();
// }
// };
// xhr.send();
// },
},
};
</script>
<style lang="scss" scoped>
.down-load {
color: #0bab0c;
}
.timuNum {
color: #1d84ff;
cursor: pointer;
}
::v-deep .el-select {
width: 100%;
}
::v-deep .el-dialog {
margin-top: 15vh !important;
}
</style>
danger-manage-web/vue.config.js
View file @ fa399a4b
......@@ -35,7 +35,7 @@ module.exports = {
// detail: https://cli.vuejs.org/config/#devserver-proxy
[process.env.VUE_APP_BASE_API]: {
target: process.env.VUE_APP_TARGET,
target: `http://192.168.2.2:8908/dangerManage`,
// target: `http://192.168.2.2:8908/dangerManage`,
changeOrigin: true,
pathRewrite: {
['^' + process.env.VUE_APP_BASE_API]: ''
......
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