Skip to content

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

题库管理页面的增加删除修改。

parent a40306a3
Hide whitespace changes
Inline Side-by-side
Showing with 286 additions and 175 deletions
danger-manage-web/src/main.js
View file @ f7b9295f
......@@ -2,7 +2,7 @@
* @Author: 纪泽龙 jizelong@qq.com
* @Date: 2022-06-16 14:52:17
* @LastEditors: 纪泽龙 jizelong@qq.com
* @LastEditTime: 2022-09-20 23:37:42
* @LastEditTime: 2022-12-15 14:39:18
* @FilePath: /danger-manage-web/src/main.js
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......@@ -48,11 +48,14 @@ import VueVideoPlayer from 'vue-video-player'
// require videojs style
import 'video.js/dist/video-js.css'
// import 'vue-video-player/src/custom-theme.css'
Vue.use(VueVideoPlayer, /* {
options: global default options,
events: global videojs events
} */)
// require('video.js/dist/video-js.css')
// require('vue-video-player/src/custom-theme.css')
// Vue.use(VideoPlayer)
......
danger-manage-web/src/views/educationPlanExam/questionBank/components/Lesson.vue
View file @ f7b9295f
......@@ -2,7 +2,7 @@
* @Author: 纪泽龙 jizelong@qq.com
* @Date: 2022-09-22 10:59:44
* @LastEditors: 纪泽龙 jizelong@qq.com
* @LastEditTime: 2022-09-28 17:52:32
* @LastEditTime: 2022-12-16 16:43:06
* @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
-->
......@@ -16,38 +16,40 @@
:rules="rules"
>
<div class="top flex">
<el-form-item label="课程标题" prop="courseName">
<el-input style="width: 500px" v-model="form.courseName"></el-input>
<el-form-item label="题库名称" prop="bankName">
<el-input style="width: 300px" v-model="form.bankName"></el-input>
</el-form-item>
<el-form-item label="课程类型" prop="courseType">
<el-select
v-model="form.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
label="归属部门"
prop="deptId"
label-width="140px"
ref="treeItem"
>
<Treeselect
class="tree"
v-model="form.deptId"
:options="deptOptions"
:show-count="true"
placeholder="请选择归属部门"
@open="treeOpen"
@close="treeClose"
@select="select"
/>
</el-form-item>
</div>
<!-- </div> -->
<el-form-item label="课程内容" prop="courseConent">
<!-- <el-form-item label="课程内容" prop="courseConent">
<Editor v-model="form.courseConent" :min-height="192" />
<el-input
v-show="false"
disabled
v-model="form.courseConent"
></el-input>
</el-form-item>
</el-form-item> -->
<div class="flex">
<!-- <div class="flex">
<el-form-item label="视频上传" v-if="!readOnly" prop="video">
<FileUpload
listType="picture"
......@@ -68,7 +70,7 @@
/>
<el-input v-show="false" disabled v-model="form.enclosure"></el-input>
</el-form-item>
</div>
</div> -->
</el-form>
</div>
</template>
......@@ -83,7 +85,18 @@ import {
getLessonById,
changeLesson,
} from "@/api/educationPlanExam/lessonsProgram";
import {
listBank,
addBank,
updateBank,
getBank,
} from "@/api/system/questionBank.js";
// 所有部门
import { treeselect } from "@/api/system/dept";
import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
export default {
name: "",
props: {
......@@ -94,84 +107,123 @@ export default {
components: {
Editor,
FileUpload,
Treeselect,
},
data() {
return {
form: {
courseName: "",
courseType: "",
courseConent: "",
video: "",
enclosure: "",
bankName: "",
// courseType: "",
// courseConent: "",
// video: "",
// enclosure: "",
deptId: null,
},
// 归属部门列表
deptOptions: [],
fileListVideo: [],
fileListFile: [],
readOnly: false,
rules: {
courseName: [
bankName: [
{ required: true, trigger: "blur", message: "课程名称不能为空" },
],
courseType: [
{ required: true, trigger: "change", message: "课程类型不能为空" },
],
courseConent: [
{ required: true, trigger: "blur", message: "课程内容不能为空" },
],
video: [{ required: true, trigger: "blue", message: "视频不能为空" }],
enclosure: [
{ required: true, trigger: "blur", message: "附件不能为空" },
deptId: [
{ required: true, trigger: "blur", message: "请选择所属部门" },
],
// courseType: [
// { required: true, trigger: "change", message: "课程类型不能为空" },
// ],
// courseConent: [
// { required: true, trigger: "blur", message: "课程内容不能为空" },
// ],
// video: [{ required: true, trigger: "blue", message: "视频不能为空" }],
// enclosure: [
// { required: true, trigger: "blur", message: "附件不能为空" },
// ],
},
};
},
computed: {
// 获取课程类型
...mapGetters(["courseOptions"]),
// ...mapGetters(["courseOptions"]),
},
created() {
if (this.courseId) {
this.getLessonById();
}
// 归属部门列表
this.getTreeselect();
},
mounted() {},
methods: {
// 添加课程
addLessons(data) {
console.log("this.courseId", this.courseId);
if (!this.courseId) {
console.log("添加");
return addLessons(data);
return addBank(data);
} else {
console.log("修改");
return changeLesson({ courseId: this.courseId, ...data });
return updateBank({ bankId: this.courseId, ...data });
}
},
/** 查询部门下拉树结构 */
getTreeselect() {
treeselect().then((response) => {
this.deptOptions = response.data;
console.log(this.deptOptions);
});
},
// 当树形组件打开
treeOpen() {
document.querySelector(".vue-treeselect__control").style.borderColor = "";
},
// 当属性组件关闭
treeClose(a, b) {
if (!a) {
// 手动添加报红功能，没值的时候报红
document.querySelector(".vue-treeselect__control").style.borderColor =
"red";
this.save();
} else {
document.querySelector(".vue-treeselect__control").style.borderColor =
"";
this.$refs.treeItem.clearValidate();
}
},
select() {},
// 复现
getLessonById() {
getLessonById(this.courseId).then((res) => {
getBank(this.courseId).then((res) => {
console.log("res", res);
if (res.code == 200) {
const data = res.data;
const { courseName, courseType, courseConent, video, enclosure } =
data;
this.form = {
courseName,
courseType,
courseConent,
video,
enclosure,
bankName: res.data.bankName,
deptId: res.data.deptId,
};
this.fileListVideo = [
{
name: courseName + "视频",
url: uploadfile,
},
];
this.fileListFile = [
{
name: courseName + "附件",
url: uploadfile,
},
];
// 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,
// },
// ];
}
});
},
......@@ -207,35 +259,46 @@ export default {
},
save(num = 2) {
// 因为富文本编辑器会残留<p><br></p>，所以要清空
if (this.form.courseConent === "<p><br></p>") {
this.form.courseConent = "";
}
// if (this.form.courseConent === "<p><br></p>") {
// this.form.courseConent = "";
// }
this.$refs.form.validate((valid) => {
if (valid) {
// console.log(this.form);
this.addLessons({ ...this.form }).then((res) => {
// 如果添加会传回来，就用传回来的，如果是修改本身就有，就用本身的
const courseId = res.data || this.courseId;
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(courseId);
this.$parent.$parent.$parent.getList();
return true;
// console.log('res',res)
const courseId = this.courseId || 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(courseId);
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();
}
}
});
},
......@@ -250,8 +313,8 @@ export default {
.form-wrapper {
padding-top: 22px;
width: 100%;
height: 550px;
overflow: hidden;
height: 100px;
// overflow: hidden;
// padding-bottom: 10px;
margin-bottom: 20px;
......
danger-manage-web/src/views/educationPlanExam/questionBank/components/QuestionList.vue
View file @ f7b9295f
......@@ -2,7 +2,7 @@
* @Author: 纪泽龙 jizelong@qq.com
* @Date: 2022-09-22 17:56:05
* @LastEditors: 纪泽龙 jizelong@qq.com
* @LastEditTime: 2022-09-28 17:54:16
* @LastEditTime: 2022-12-16 10:23:13
* @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
-->
......@@ -10,9 +10,9 @@
<div ref="myBody" class="add-question flex">
<div class="text flex">
<div class="left">
目前有<span>{{ questionNum }}</span
目前有<span>{{ questionNum || 0}}</span
>道题
<span class="warn">温馨提示：发布课程前需要进行考试设置</span>
<!-- <span class="warn">温馨提示：发布课程前需要进行考试设置</span> -->
</div>
<div class="right">{{courseName}}</div>
</div>
......@@ -51,8 +51,9 @@
</div>
</div>
</div>
<div class="rightNum flex">
<div class="left">考试设置</div>
<!-- <div class="rightNum flex">
<div class="left">录入考题</div>
<div class="middle flex">
<div class="left-text">答对题目大于</div>
<div>
......@@ -72,8 +73,8 @@
type="success"
>保存</el-button
>
</div>
</div>
</div>
</div> -->
</div>
</template>
......
danger-manage-web/src/views/educationPlanExam/questionBank/index.vue
View file @ f7b9295f
......@@ -69,32 +69,33 @@
</el-row>
<el-table v-loading="loading" :data="lessonsList">
<el-table-column label="课程标题" align="center" prop="courseName" />
<el-table-column label="课程类别" align="center" prop="courseType">
<el-table-column label="题库序号" align="center" prop="bankNum" />
<el-table-column label="题库名称" align="center" prop="bankName">
</el-table-column>
<el-table-column
label="所属单位"
align="center"
prop="courseType"
>
<template v-slot="scope">
<div>
{{
scope.row.courseType && courseOptions.filter(
(item) => item.planId == scope.row.courseType
)[0] && courseOptions.filter(
(item) => item.planId == scope.row.courseType
)[0].planName
}}
{{ selectList(deptOptions, scope.row.deptId)||'-' }}
</div>
</template>
</el-table-column>
<el-table-column label="课程状态" align="center" prop="status">
<template v-slot="scope">
<div>{{ ["未发布", "已发布"][scope.row.status] }}</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-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">
<!-- <el-table-column label="视频" align="center" prop="video">
<template v-slot="{ row: { courseName, video } }">
<a @click="downLoadVideo(video, courseName)" class="down-load"
>下载视频</a
......@@ -106,15 +107,15 @@
align="center"
prop="releaseTime"
:formatter="formatter"
/>
/> -->
<el-table-column
label="考试题"
label="考试题数量"
align="center"
prop="topicNum"
width="180"
>
<template v-slot="{ row: { topicNum, courseId } }">
<div @click="checkQuestion(courseId)" class="timuNum">
<template v-slot="{ row: { topicNum, bankId } }">
<div @click="checkQuestion(bankId)" class="timuNum">
<div v-if="topicNum > 0">{{ `已录入${topicNum}题` }}</div>
<div v-else>未录入</div>
</div>
......@@ -125,31 +126,30 @@
align="center"
class-name="small-padding fixed-width"
>
<template v-slot="{ row: { status, courseId } }">
<template v-slot="{ row: { bankId } }">
<!-- <div>{{status}}</div> -->
<el-button
v-if="status == 0"
size="mini"
type="text"
icon="el-icon-edit"
@click="changeLesson(courseId)"
>修改</el-button
@click="changeBank(bankId)"
>编辑</el-button
>
<el-button
size="mini"
type="text"
icon="el-icon-delete"
@click="deletLesson(courseId)"
@click="deletBank(bankId)"
>删除</el-button
>
<el-button
<!-- <el-button
v-if="status == 0"
size="mini"
type="text"
icon="el-icon-delete"
@click="issueLesson(courseId)"
@click="issueLesson(bankId)"
>发布</el-button
>
> -->
</template>
</el-table-column>
</el-table>
......@@ -164,9 +164,11 @@
<Dia
ref="Dia"
:componentsNum.sync="componentsNum"
:courseId.sync="courseId"
:courseId.sync="bankId"
:visible.sync="dilogFlag"
/>
<el-dialog> </el-dialog>
</div>
</template>
......@@ -177,6 +179,10 @@ import {
issue,
deleteLesson,
} from "@/api/educationPlanExam/lessonsProgram.js";
import { listBank,delBank } from "@/api/system/questionBank.js";
// 部门列表
import { treeselect } from "@/api/system/dept";
// 获取课程类型
import { getPlanList } from "@/api/educationPlanExam/trainingProgram";
import { mapGetters, mapMutations } from "vuex";
......@@ -211,7 +217,12 @@ export default {
dilogFlag: false,
componentsNum: 1,
// 点击的id，如果是新增为空
courseId: null,
bankId: null,
// 题库id
deptId: null,
// 归属部门列表
deptOptions: [],
};
},
computed: {
......@@ -219,11 +230,36 @@ export default {
},
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) => {
......@@ -241,10 +277,18 @@ export default {
/** 查询课程列表 */
getList() {
this.loading = true;
getLessons(this.queryParams)
listBank(this.queryParams)
.then((res) => {
// console.log(res);
this.lessonsList = res.rows;
console.log(res);
this.lessonsList = res.rows.map((item, index) => {
return {
bankNum:
index +
1 +
(this.queryParams.pageNum - 1) * this.queryParams.pageSize,
...item,
};
});
this.total = res.total;
})
.finally(() => {
......@@ -257,23 +301,23 @@ export default {
},
/** 新增按钮操作 */
handleAdd() {
this.$refs.Dia.title = "新增课程";
this.$refs.Dia.title = "新增题库";
this.componentsNum = 1;
this.courseId = null;
this.bankId = null;
this.dilogFlag = true;
},
changeLesson(courseId) {
this.$refs.Dia.title = "修改课程";
changeBank(bankId) {
this.$refs.Dia.title = "修改题库";
this.componentsNum = 1;
this.courseId = courseId;
this.bankId = bankId;
this.dilogFlag = true;
},
// 直接查看考题
checkQuestion(courseId) {
checkQuestion(bankId) {
// 要查看考题的id
this.courseId = courseId;
console.log(this.courseId);
this.bankId = bankId;
console.log(this.bankId);
// 2代表列表组件
this.componentsNum = 2;
this.dilogFlag = true;
......@@ -293,14 +337,14 @@ export default {
releaseTime: "",
};
},
deletLesson(courseId) {
deletBank(bankId) {
this.$confirm("请确定删除", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(() => {
return deleteLesson(courseId);
return delBank(bankId);
})
.then((res) => {
if (res.code == 200) {
......@@ -314,43 +358,43 @@ export default {
.catch(() => {});
},
// 发布
issueLesson(courseId) {
this.$confirm("请确定发布", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(() => {
// 判断是否录入答题合格数
return getLessonById(courseId);
})
.then((res) => {
if (res.data.qualifiedNum > 0) {
return true;
}
})
.then((res) => {
if (res) {
// 成功就发布
return issue({ courseId });
} else {
this.$message({
message: "请先录入答题合格数",
type: "warning",
});
}
})
.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 "-";
......
danger-manage-web/vue.config.js
View file @ f7b9295f
......@@ -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.31.87: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