Skip to content

P
pica.cloud.web-education-admin
提交 48a49788 编写于 作者: yi.li's avatar yi.li
浏览文件
操作

学科配置开发与联调

上级 e203b9fa
显示空白字符变更
内嵌 并排
正在显示 包含 596 行增加 和 53 行删除
src/views/education/edit-subject.vue
浏览文件 @ 48a49788
......@@ -37,6 +37,7 @@
</el-col>
</el-row>
<template v-for="(item, index) in formData.titleTestSubjectSecondModelList">
<h4 style="margin-top:10px;font-weight: 600">第{{ index+1 }}个二级分类：</h4>
<div class="list-block" :key="index">
<el-form-item
label="二级分类名称："
......@@ -66,6 +67,14 @@
<span class="word-num">{{(item.code).replace(/\s+/g,"").length}}/8</span>
</el-col>
</el-form-item>
<div class="checkbox-item">
<el-checkbox
v-model="item.checkedCourse"
@change="changeCourse(item.checkedCourse, index)"
style="margin-left: 15px;">配置课程</el-checkbox>
</div>
<div class="list-block-item" v-if="item.checkedCourse">
<p class="item-title">配置课程</p>
<el-form-item
label="是否已在项目配置课程："
:prop="`titleTestSubjectSecondModelList.${index}.openFlag`"
......@@ -103,7 +112,160 @@
placeholder="选择月">
</el-date-picker>
</el-form-item>
<i class="el-icon-delete icon-delete" @click="deleteCourseConfig(index)"></i>
</div>
<div class="checkbox-item">
<el-checkbox
v-model="item.checkedQue"
@change="changeQue(item.checkedQue, index)"
style="margin-left: 15px;"
>配置题库</el-checkbox>
</div>
<div class="list-block-item" v-if="item.checkedQue">
<p class="item-title">题库通用信息</p>
<el-row>
<el-col :span="11">
<el-form-item label="题库配图：">
<el-upload
v-model="item.directoryImageUrl"
class="bg-uploader"
action="#"
:show-file-list="false"
:before-upload="beforeUploadPic"
>
<img
v-if="item.directoryImageUrl"
@mouseover.stop="item.imgMouseOver=true"
:src="item.directoryImageUrl"
class="bg-img"
>
<img
v-if="!item.directoryImageUrl"
class="bg-img"
src="../../assets/image/small.png"
@click="getCurrentIndex(index)"
>
<div
class="img-delete"
v-show="item.imgMouseOver"
@click.stop="deleteImg(item.directoryImageUrl,index)"
@mouseout.stop="item.imgMouseOver=false">
<i class="el-icon-delete"></i>
</div>
<div class="limit-text">
<p>尺寸:686*160</p>
<p>限制大小: 500Kb</p>
<p>支持.jpg,.png格式</p>
</div>
</el-upload>
</el-form-item>
</el-col>
<el-col :span="13">
<el-form-item label="题库介绍：">
<el-input
size="small"
type="textarea"
:autosize="{ minRows: 5}"
placeholder="请输入入口简介"
v-model="item.directoryIntro"
maxlength="10"
style="width:83%;"
></el-input>
<span class="word-num">{{(item.directoryIntro).replace(/\s+/g,"").length}}/200</span>
</el-form-item>
</el-col>
</el-row>
<el-form-item
label="可解锁商品："
:prop="`titleTestSubjectSecondModelList.${index}.nolockPro`"
:rules="{ required: true, message: '请选择可解锁商品', trigger: 'change'}"
>
<el-cascader
v-model="item.nolockPro"
:options="options"
:props="{ value: 'goodsType', label: 'goodsTypeName', children: 'cardsList'}"
size="small"></el-cascader>
</el-form-item>
<i class="el-icon-delete icon-delete" @click="deleteQC(index)"></i>
<el-row>
<el-col :span="13">
<el-button type="primary" icon="el-icon-plus" size="small" @click="addQuestionS(index)" :disabled="item.directoryList.length>=4">新增子题库</el-button>
</el-col>
</el-row>
<div v-for="(item2, index2) in item.directoryList" :key="index2">
<div class="list-block-item set-bg">
<p class="item-title">配置子题库</p>
<el-row>
<el-col :span="11">
<el-form-item
label="选择题库："
:prop="`titleTestSubjectSecondModelList.${index}.directoryList.${index2}.resourceId`"
:rules="{ required: true, message: '请选择题库', trigger: 'change'}"
>
<el-select
v-model="item2.resourceId"
filterable
size="small"
clearable
placeholder="请选择题库"
:popper-append-to-body="false"
@change="changeQBValue(item2.resourceId,index2,index)"
>
<el-option
v-for="(directory, d) in secondDirectoryList"
:key="directory.id"
:label="directory.directoryName"
:value="directory.id">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="13">
<el-form-item
label="前端题库名称："
:prop="`titleTestSubjectSecondModelList.${index}.directoryList.${index2}.content1`"
:rules="{ required: true, message: '请输入前端题库名称', trigger: 'change'}"
>
<el-input
v-model="item2.content1"
type="text"
placeholder="默认取关联题库的名称，可修改"
size="small"
style="width: 80%"
maxlength="25">
</el-input>
<span class="word-num">{{(item2.content1).replace(/\s+/g,"").length}}/25</span>
</el-form-item>
</el-col>
</el-row>
<el-form-item
label="收费："
:prop="`titleTestSubjectSecondModelList.${index}.directoryList.${index2}.freeFlag`"
:rules="{ required: true, message: '请选择收费项', trigger: 'change'}"
>
<el-radio-group v-model="item2.freeFlag">
<el-radio label="0">免费</el-radio>
<el-radio label="1">收费</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item
label="可免费体验题数："
v-if="item2.freeFlag == 1"
:prop="`titleTestSubjectSecondModelList.${index}.directoryList.${index2}.content2`"
:rules="freeContentRules"
>
<el-input
type="number"
v-model="item2.content2"
placeholder="请输入自然数"
style="width: 200px;">
<template slot="append">道</template>
</el-input>
</el-form-item>
<i v-show="index2 !== 0" class="el-icon-delete icon-delete" @click="deleteSecondQB(item2,index2,index)"></i>
</div>
</div>
</div>
<i v-show="index !== 0" class="el-icon-delete icon-delete" @click="deleteSecondList(index)"></i>
</div>
</template>
......@@ -121,6 +283,8 @@
import BreadCrumb from "@/components/breadcrumb.vue";
import { openLoading, closeLoading, deepCopy } from "@/utils/utils";
import * as commonUtil from "@/utils/utils";
import {doUpload, getFilePath} from "../../utils/qiniu-util";
import { checkIsInteger } from '@/utils/followup/followupUtils/checkField';
let checkProjectStr = (rule, value, callback) => {
if (value.indexOf("\\") != -1) {
......@@ -162,19 +326,43 @@ export default {
seqNo: 1,
subjectFirstId: '',
projectId: '',
checkedCourse: false,//新增字段-配置课程
checkedQue: false,//新增字段-配置题库
directoryImageUrl: '',//新增字段-题库配图
directoryIntro: '',//新增字段-题库介绍
nolockPro: [],//新增字段-可解锁商品
goodsType: null,//新增字段-商品类型
cardType: null,//新增字段-卡类型
imgMouseOver: false,//新增字段
titleTestSubjectSecondResourceModelList: [{
// deleteFlag: 0,
id: 0,
resourceId: 0,
seqNo: 1,
subjectSecondId: 0,
type: 0
}]
type: 1
}],
directoryList: [
{
type: 2,//关联资源类型，1项目，2题库
subjectSecondId: 0,//二级分类id
seqNo: 1,
resourceId: null,//关联资源id
id: 0,
freeFlag: 1,//题库是否免费：0免费1收费
content1: '',//题库分类名称
content2: '',//表示免费体检题数
}
],
}
],
},
gradeList: [], // 职称列表
projectList: [], // 项目列表
copyLockList: [],
options: [],
secondDirectoryList: [],//题库列表
activeIndexImg: null,
rules: {
titleCode: [
{ required: true, message: "请输入选择职称", trigger: "change" },
......@@ -190,6 +378,10 @@ export default {
{ min: 1, max: 20, message: "输入长度为1-20的二级分类名称", trigger: "blur" },
{ validator: checkProjectStr, trigger: "blur" }
],
freeContentRules: [
{ required: true, message: '请输入免费体验题数', trigger: ['blur','change']},
{ validator: checkIsInteger, trigger: ['blur','change'] }
],
// secondCodeRules: [
// // { required: true, message: "请输入二级分类代码", trigger: "blur" },
// // { min: 1, max: 8, message: "输入长度为1-8的二级分类代码", trigger: "blur" },
......@@ -203,6 +395,8 @@ export default {
}
this.getGradeList();
this.getProjectList();
this.getGoodsTypeList();
this.getsecondDirectoryList();
},
mounted() {
commonUtil.resizeHeight();
......@@ -241,9 +435,41 @@ export default {
}
});
},
//获取商品分类
getGoodsTypeList() {
openLoading(this);
this.GET("trade/goods/manager/queryGoodsType").then(res => {
closeLoading(this);
if (res.code == "000000") {
this.copyLockList = deepCopy(res.data);
let data = res.data;
this.options = this.getProSelect(data);
}
});
},
getProSelect(data) {
for (let i = 0; i < data.length; i++) {
data[i].cardsList.map(item => {
this.$set(item, "goodsType", item.cardType);
this.$set(item, "goodsTypeName", item.cardTypeName);
this.$set(item, "leaf", true);
});
}
return data;
},
//获取题库列表
getsecondDirectoryList() {
openLoading(this);
this.GET(`onlineexam/brushExamTitleDirectory?directoryType=1`).then(res => {
closeLoading(this);
if (res.code == "000000") {
this.secondDirectoryList = res.data;
}
});
},
// 添加二级分类
addSecondList() {
this.formData.titleTestSubjectSecondModelList.push({
let item = {
code: '',
// deleteFlag: 0,
id: 0,
......@@ -253,15 +479,36 @@ export default {
seqNo: 1,
subjectFirstId: '',
projectId: '',
checkedCourse: false,//新增字段-配置课程
checkedQue: false,//新增字段-配置题库
directoryImageUrl: '',//新增字段-题库配图
directoryIntro: '',//新增字段-题库介绍
nolockPro: [],//新增字段-可解锁商品
goodsType: null,//新增字段-商品类型
cardType: null,//新增字段-卡类型
imgMouseOver: false,//新增字段
titleTestSubjectSecondResourceModelList: [{
// deleteFlag: 0,
id: 0,
resourceId: 0,
seqNo: 1,
subjectSecondId: 0,
type: 0
}]
});
type: 1
}],
directoryList: [
{
type: 2,//关联资源类型，1项目，2题库
subjectSecondId: 0,//二级分类id
seqNo: 1,
resourceId: null,//关联资源id
id: 0,
freeFlag: 1,//题库是否免费：0免费1收费
content1: '',//题库分类名称
content2: '',//表示免费体检题数
}
],
}
this.formData.titleTestSubjectSecondModelList.push(item);
},
// 删除二级分类
deleteSecondList(index) {
......@@ -274,16 +521,52 @@ export default {
}).catch(() => {
});
},
//提交
onSubmit() {
this.$refs['formData'].validate((valid) => {
if (!valid) {
return false;
}
const params = deepCopy(this.formData);
// for (let item of params.titleTestSubjectSecondModelList) {
let item = {};
for (let i = 0; i < params.titleTestSubjectSecondModelList.length; i ++) {
item = params.titleTestSubjectSecondModelList[i];
//新增处理-配置课程
if (!item.checkedCourse) {
item.openFlag = null;
item.projectId = '';
item.predictTime = '';
}
//新增处理-配置题库
if (!item.checkedQue) {
item.directoryImageUrl = '';
item.directoryIntro = '';
item.nolockPro = [];
item.goodsType = null;
item.cardType = null;
item.directoryList = [
{
type: 2,//关联资源类型，1项目，2题库
subjectSecondId: 0,//二级分类id
seqNo: 1,
resourceId: null,//关联资源id
id: 0,
freeFlag: 1,//题库是否免费：0免费1收费
content1: '',//题库分类名称
content2: '',//表示免费体检题数
}
];
}else {
item.goodsType = item.nolockPro[0];
item.cardType = item.nolockPro[1];
for (let item2 of item.directoryList) {
if (item2.freeFlag == 0) {
item2.content2 = '';
}
}
}
let id = item.projectId;
item.titleTestSubjectSecondResourceModelList[0]['resourceId'] = id || 0;
// 添加或重置排序字段
......@@ -291,8 +574,6 @@ export default {
delete item.projectId;
}
// params.createdName = this.$store.state.reservationManage.userName;
openLoading(this);
this.POST("portal/titleTest/insertOrUpdate", params).then(res => {
......@@ -316,7 +597,7 @@ export default {
const modelList = [];
for (let item of result.secondSubjectModelList) {
if (item.resourceModelList && item.resourceModelList[0]) {
item.projectId = item.resourceModelList[0]['resourceId']
item.projectId = item.resourceModelList[0]['resourceId'];
item.titleTestSubjectSecondResourceModelList = item.resourceModelList;
delete item.resourceModelList;
} else {
......@@ -327,9 +608,22 @@ export default {
resourceId: 0,
seqNo: 1,
subjectSecondId: 0,
type: 0
type: 1
}]
}
//新增处理逻辑
item.checkedCourse = false;
item.checkedQue = false;
item.nolockPro = [];
if (item.projectId || item.predictTime) {
item.checkedCourse = true;
}
if (item.goodsType && item.cardType) {
item.nolockPro = [Number(item.goodsType),Number(item.cardType)];
item.checkedQue = true;
}
item.imgMouseOver = false;
modelList.push(item);
}
result.titleTestSubjectSecondModelList = modelList;
......@@ -354,19 +648,189 @@ export default {
seqNo: 1,
subjectFirstId: '',
projectId: '',
checkedCourse: false,//新增字段-配置课程
checkedQue: false,//新增字段-配置题库
directoryImageUrl: '',//新增字段-题库配图
directoryIntro: '',//新增字段-题库介绍
nolockPro: [],//新增字段-可解锁商品
goodsType: null,//新增字段-商品类型
cardType: null,//新增字段-卡类型
imgMouseOver: false,//新增字段
titleTestSubjectSecondResourceModelList: [{
// deleteFlag: 0,
id: 0,
resourceId: 0,
seqNo: 1,
subjectSecondId: 0,
type: 0
}]
type: 1
}],
directoryList: [
{
type: 2,//关联资源类型，1项目，2题库
subjectSecondId: 0,//二级分类id
seqNo: 1,
resourceId: null,//关联资源id
id: 0,
freeFlag: 1,//题库是否免费：0免费1收费
content1: '',//题库分类名称
content2: '',//表示免费体检题数
}
],
}
],
}
}
},
changeCourse(value, indexL0) {
if (!value) {
this.deleteCourseConfig(indexL0);
}
},
changeQue(value, indexL0) {
if (!value) {
this.deleteQC(indexL0);
}
},
//课程配置的删除操作
deleteCourseConfig(indexL0) {
this.$confirm('确定删除当前二级分类的课程配置吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.formData.titleTestSubjectSecondModelList[indexL0].checkedCourse = false;
// this.formData.titleTestSubjectSecondModelList.splice(indexL0, 1);
}).catch(() => {
this.formData.titleTestSubjectSecondModelList[indexL0].checkedCourse = true;
});
},
//题库配置的删除操作
deleteQC(indexL0) {
this.$confirm('确定删除当前二级分类的题库配置吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.formData.titleTestSubjectSecondModelList[indexL0].checkedQue = false;
}).catch(() => {
this.formData.titleTestSubjectSecondModelList[indexL0].checkedQue = true;
});
},
getCurrentIndex(indexL0) {
this.activeIndexImg = indexL0;
},
beforeUploadPic(file) {
let fileLimit = {
width: 686,
height: 160,
size: 0.5,
sizeText: "500Kb",
key: "directoryImageUrl",
more: "directoryImageUrl",
show: "uploadImgMessage1"
};
this.beforeAvatarUpload(file, fileLimit);
},
//上传图片校验
beforeAvatarUpload(file, fileLimit) {
let vm = this;
const isJPG = file.type === "image/jpeg";
const isPNG = file.type === "image/png";
const isLt2M = file.size / 1024 / 1024 < fileLimit.size;
if (!isJPG && !isPNG) {
this.$message.error("图片不符合规范，请根据规范上传图片");
// return;
}
if (!isLt2M) {
this.$message.error("图片不符合规范，请根据规范上传图片 ");
// return;
}
let _img = new FileReader();
_img.readAsDataURL(file);
_img.onload = function(theFile) {
let image = new Image();
image.src = theFile.target.result;
image.onload = function() {
let _this = this;
if (
false
// _this.width != fileLimit.width ||
// _this.height != fileLimit.height
) {
vm.$message.error("图片不符合规范，请根据规范上传图片");
} else {
openLoading(vm);
doUpload(
vm,
file,
getFilePath(file, null),
"preview4",
"progress1",
1
).then(function(path) {
closeLoading(vm);
console.log(path);
vm.formData.titleTestSubjectSecondModelList[vm.activeIndexImg][fileLimit.key] = path.fullPath;
// vm.formData[fileLimit.more] = {
// attachmentName: path.name,
// attachmentExt: path.ext,
// attachmentSize: path.size
// };
vm.$message.success("上传成功");
});
}
};
};
return isJPG && isLt2M;
},
//删除图片
deleteImg(img, indexL0) {
this.formData.titleTestSubjectSecondModelList[indexL0].directoryImageUrl = '';
this.formData.titleTestSubjectSecondModelList[indexL0].imgMouseOver = false;
},
//新增子题库
addQuestionS(activeIndex) {
let seqLength = this.formData.titleTestSubjectSecondModelList[activeIndex].directoryList.length;
let obj = {
type: 2,//关联资源类型，1项目，2题库
subjectSecondId: 0,//二级分类id
seqNo: seqLength+1,
resourceId: null,//关联资源id
id: 0,
freeFlag: 1,//题库是否免费：0免费，1收费
content1: '',//题库分类名称
content2: '',//表示免费体检题数
}
if (seqLength >=4) {
this.$message.warning('最多只能增加4个子题库')
return;
}
this.formData.titleTestSubjectSecondModelList[activeIndex].directoryList.push(obj)
},
formatDirectory(value) {
let directoryName = '';
for (let i=0; i<this.secondDirectoryList.length; i++) {
if (this.secondDirectoryList[i].id == value) {
directoryName = this.secondDirectoryList[i].directoryName;
}
}
return directoryName;
},
changeQBValue(value,indexL1,indexL0) {
let directoryName = this.formatDirectory(value);
this.formData.titleTestSubjectSecondModelList[indexL0].directoryList[indexL1].content1 = directoryName;
},
//删除子题库
deleteSecondQB(obj1,indexL1, indexL0) {
this.$confirm('确定删除此子题库吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.formData.titleTestSubjectSecondModelList[indexL0].directoryList.splice(indexL1, 1);
}).catch(() => {
});
},
},
}
</script>
......@@ -383,10 +847,36 @@ export default {
}
.list-block{
position: relative;
padding: 20px 10px 0px;
padding: 20px 10px 10px;
border: 1px solid #cdcdcd;
border-radius: 5px;
margin-top: 25px;
margin-bottom: 20px;
}
.checkbox-item{
margin-bottom: 22px;
}
.list-block-item{
position: relative;
padding: 10px;
border: 1px solid #cdcdcd;
border-radius: 5px;
margin-top: 15px;
margin-bottom: 15px;
.icon-delete{
position: absolute;
right: 20px;
top: 10px;
font-size: 30px;
color: red;
cursor: pointer;
}
.item-title{
margin: 5px 0 15px;
}
&.set-bg{
background-color: #f1f1f1;
}
}
.icon-delete{
position: absolute;
......@@ -396,4 +886,57 @@ export default {
color: red;
cursor: pointer;
}
.bg-uploader {
img {
float: left;
}
.bg-img {
width: 84px;
height: 100px;
}
.bg-video {
float: left;
width: 84px;
height: 100px;
}
.img-delete {
position: absolute;
left: 0px;
top: 0px;
width: 84px;
height: 100px;
background: #000;
opacity: 0.7;
z-index: 999;
i {
color: #fff;
margin-top: 39px;
margin-left: 0px;
}
}
.limit-text {
float: left;
margin-left: 10px;
margin-top: -10px;
p {
font-size: 12px;
color: #999;
}
}
}
</style>
<style>
.el-checkbox__input.is-checked+.el-checkbox__label{
color: #449284;
}
.el-checkbox__input.is-checked .el-checkbox__inner,
.el-checkbox__input.is-indeterminate .el-checkbox__inner{
background-color: #449284;
border-color: #449284;
}
.required-label .el-form-item__label::before {
content: "*";
color: #f56c6c;
margin-right: 4px;
}
</style>
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或