Skip to content

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

重名校验

上级 324e72e6
隐藏空白字符变更
内嵌 并排
正在显示 包含 136 行增加 和 65 行删除
src/views/education/create-component.vue
浏览文件 @ f0f99394
...@@ -83,7 +83,7 @@ ...@@ -83,7 +83,7 @@
<div class="" v-if="stepNum == 2"> <div class="" v-if="stepNum == 2">
<div class="model-btn"> <div class="model-btn">
<el-button type="primary" size="small" @click="addModule">添加空白模块</el-button> <el-button type="primary" size="small" @click="addModule">添加空白模块</el-button>
<el-button type="primary" size="small" @click="addFromModule" style="margin-left:0;">从模块添加</el-button> <el-button type="primary" size="small" @click="addFromModule" style="margin-left:0;">从预设模块添加</el-button>
</div> </div>
<div class="tab-content"> <div class="tab-content">
<el-tabs type="card" v-model="firstTab" closable @tab-remove="removeTab"> <el-tabs type="card" v-model="firstTab" closable @tab-remove="removeTab">
...@@ -98,9 +98,9 @@ ...@@ -98,9 +98,9 @@
</el-col> </el-col>
<el-col :span="10"> <el-col :span="10">
<el-form-item label="是否对外开放" prop="openFlag"> <el-form-item label="是否对外开放" prop="openFlag">
<el-radio-group v-model="openLable" @change="selectIsOpen(index)"> <el-radio-group v-model="item.openFlag" @change="selectIsOpen(index)" :disabled="item.moduleType == 2 || (componentId && item.openFlag == 2)">
<el-radio label="是" @change="moduleOpenChange"></el-radio> <el-radio :label="2" @change="moduleOpenChange">是</el-radio>
<el-radio label="否" @change="moduleOpenChange"></el-radio> <el-radio :label="1" @change="moduleOpenChange">否</el-radio>
</el-radio-group> </el-radio-group>
</el-form-item> </el-form-item>
</el-col> </el-col>
...@@ -109,6 +109,7 @@ ...@@ -109,6 +109,7 @@
<div class="template-btn"> <div class="template-btn">
<span class="word-size">添加一个模板</span> <span class="word-size">添加一个模板</span>
<el-button <el-button
:disabled="item.moduleType == 2 || (componentId && item.openFlag == 2)"
v-for="(_item,_index) in templateDataList" v-for="(_item,_index) in templateDataList"
:key="_index" :key="_index"
type="primary" type="primary"
...@@ -122,7 +123,7 @@ ...@@ -122,7 +123,7 @@
<div class="template-content-div"> <div class="template-content-div">
<div class="title"> <div class="title">
{{item1.name}} {{item1.name}}
<span> <span v-if="item.moduleType == 1 && componentId && item.openFlag == 1">
变更顺序: 变更顺序:
<i class="el-icon-arrow-down" @click="sortUp(index,index1)"></i> <i class="el-icon-arrow-down" @click="sortUp(index,index1)"></i>
<i class="el-icon-arrow-up" @click="sortDown(index,index1)"></i> <i class="el-icon-arrow-up" @click="sortDown(index,index1)"></i>
...@@ -136,14 +137,14 @@ ...@@ -136,14 +137,14 @@
<el-row> <el-row>
<el-col :span="10"> <el-col :span="10">
<el-form-item label="考试名称" prop="content1"> <el-form-item label="考试名称" prop="content1">
<el-input v-model="item3.content1" :disabled="item.moduleType == 2" size="mini" placeholder="请输入考试名称" style="width:288px;"></el-input> <el-input v-model="item3.content1" :disabled="item.moduleType == 2 || (componentId && item.openFlag == 2)" size="mini" placeholder="请输入考试名称" style="width:288px;"></el-input>
<span v-if="item2.numFlag == 2 && index3 == 0 && item.moduleType == 1"><i class="el-icon-circle-plus-outline" @click="addMatterCourse(index,index1,index2)" style="color:#0486FE;"></i></span> <span v-if="item2.numFlag == 2 && index3 == 0 && item.moduleType == 1 && componentId && item.openFlag == 1"><i class="el-icon-circle-plus-outline" @click="addMatterCourse(index,index1,index2)" style="color:#0486FE;"></i></span>
<span v-if="item2.numFlag == 2 && index3 > 0 && item.moduleType == 1"><i class="el-icon-delete" @click="deleteMatterCourse(index,index1,index2,index3)" style="color:red;"></i></span> <span v-if="item2.numFlag == 2 && index3 > 0 && item.moduleType == 1 && componentId && item.openFlag == 1"><i class="el-icon-delete" @click="deleteMatterCourse(index,index1,index2,index3)" style="color:red;"></i></span>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="10"> <el-col :span="10">
<el-form-item label="考试ID" prop="content2"> <el-form-item label="考试ID" prop="content2">
<el-select v-model="item3.content2" :disabled="item.moduleType == 2" size="mini" placeholder="请选择考试ID" style="width:288px;"> <el-select v-model="item3.content2" :disabled="item.moduleType == 2 || (componentId && item.openFlag == 2)" size="mini" placeholder="请选择考试ID" style="width:288px;">
<el-option <el-option
v-for="(itemTest,indexTest) in testIdSelect" v-for="(itemTest,indexTest) in testIdSelect"
:key="indexTest" :key="indexTest"
...@@ -157,7 +158,7 @@ ...@@ -157,7 +158,7 @@
<el-row> <el-row>
<el-col :span="10"> <el-col :span="10">
<el-form-item label="配置证书" prop="name"> <el-form-item label="配置证书" prop="name">
<el-radio-group v-model="portCertificateLable" :disabled="item.moduleType == 2"> <el-radio-group v-model="portCertificateLable" :disabled="item.moduleType == 2 || (componentId && item.openFlag == 2)">
<el-radio label="是"></el-radio> <el-radio label="是"></el-radio>
<el-radio label="否"></el-radio> <el-radio label="否"></el-radio>
</el-radio-group> </el-radio-group>
...@@ -165,7 +166,7 @@ ...@@ -165,7 +166,7 @@
</el-col> </el-col>
<el-col :span="10"> <el-col :span="10">
<el-form-item label="选择证书" prop="content3"> <el-form-item label="选择证书" prop="content3">
<el-select v-model="item3.content3" :disabled="item.moduleType == 2" size="mini" placeholder="请选择证书" style="width:288px;"> <el-select v-model="item3.content3" :disabled="item.moduleType == 2 || (componentId && item.openFlag == 2)" size="mini" placeholder="请选择证书" style="width:288px;">
<el-option <el-option
v-for="(itemCertificate,indexCertificate) in certificateIdSelect" v-for="(itemCertificate,indexCertificate) in certificateIdSelect"
:key="indexCertificate" :key="indexCertificate"
...@@ -183,14 +184,14 @@ ...@@ -183,14 +184,14 @@
<el-row v-for="(item3,index3) in item2.partContentModelList" :key="index3"> <el-row v-for="(item3,index3) in item2.partContentModelList" :key="index3">
<el-col :span="10"> <el-col :span="10">
<el-form-item label="课程名称" prop="content1"> <el-form-item label="课程名称" prop="content1">
<el-input v-model="item3.content1" :disabled="item.moduleType == 2" size="mini" placeholder="请输入课程名称" style="width:288px;"></el-input> <el-input v-model="item3.content1" :disabled="item.moduleType == 2 || (componentId && item.openFlag == 2)" size="mini" placeholder="请输入课程名称" style="width:288px;"></el-input>
<span v-if="item2.numFlag == 2 && index3 == 0 && item.moduleType == 1"><i class="el-icon-circle-plus-outline" @click="addMatterCourse(index,index1,index2)" style="color:#0486FE;"></i></span> <span v-if="item2.numFlag == 2 && index3 == 0 && item.moduleType == 1 && componentId && item.openFlag == 1"><i class="el-icon-circle-plus-outline" @click="addMatterCourse(index,index1,index2)" style="color:#0486FE;"></i></span>
<span v-if="item2.numFlag == 2 && index3 > 0 && item.moduleType == 1"><i class="el-icon-delete" @click="deleteMatterCourse(index,index1,index2,index3)" style="color:red;"></i></span> <span v-if="item2.numFlag == 2 && index3 > 0 && item.moduleType == 1 && componentId && item.openFlag == 1"><i class="el-icon-delete" @click="deleteMatterCourse(index,index1,index2,index3)" style="color:red;"></i></span>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="10"> <el-col :span="10">
<el-form-item label="课程ID" prop="content2"> <el-form-item label="课程ID" prop="content2">
<el-select v-model="item3.content2" :disabled="item.moduleType == 2" size="mini" placeholder="请选择课程ID" style="width:288px;"> <el-select v-model="item3.content2" :disabled="item.moduleType == 2 || (componentId && item.openFlag == 2)" size="mini" placeholder="请选择课程ID" style="width:288px;">
<el-option <el-option
v-for="(itemCourse,indexCourse) in courseIdSelect" v-for="(itemCourse,indexCourse) in courseIdSelect"
:key="indexCourse" :key="indexCourse"
...@@ -214,32 +215,56 @@ ...@@ -214,32 +215,56 @@
</div> </div>
</div> </div>
<el-dialog :title="dialogTitle" :visible.sync="columnFormVisible" :show-close="false" :close-on-click-modal="false" :close-on-press-escape="false"> <el-dialog :title="dialogTitle" :visible.sync="columnFormVisible" :show-close="false" :close-on-click-modal="false" :close-on-press-escape="false">
<el-form ref="resourceForm" class="creat-form" :model="selectResource" label-width="125px" label-suffix=":" size="mini"> <el-form ref="resourceForm" class="creat-form" :model="selectResource" label-width="145px" label-suffix=":" size="mini">
<el-form-item label="请选择一个资源包" prop=""> <el-form-item label="请选择一个模块" prop="">
<el-select v-model="selectResource.resourceModuleSelect" @change="selectChange" placeholder="请选择资源包" style="width:60%;"> <el-select v-model="selectResource.resourceModuleSelect" @change="selectChange" placeholder="请选择资源包" style="width:60%;">
<el-option <el-option
v-for="(item,index) in resourceArray" v-for="(item,index) in resourceArray"
:key="index" :key="index"
:label="item.lecturerName" :label="item.name"
:value="item.lecturerId"> :value="item.id">
</el-option> </el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-form> </el-form>
<el-form ref="selectModuleForm" class="module-form" :model="selectModuleForm" label-width="75px" label-suffix=":" size="mini"> <div class="default-module" v-for="(item,index) in dialogData.templetModelList" :key="index">
<el-form-item label="考试名称"> <el-form ref="dialogEmplateForm" :model="item" label-suffix=":" label-width="80px" style="width:100%;">
<el-input v-model="selectModuleForm.test"></el-input> <div class="dialog-template-content">
</el-form-item> <div v-for="(item1,index1) in item.partModelList" :key="index1">
<el-form-item label="配置证书"> <!-- 考试 -->
<el-input v-model="selectModuleForm.test"></el-input> <div v-if="item1.type == 1">
</el-form-item> <div v-for="(item2,index2) in item1.partContentModelList" :key="index2">
<el-form-item label="课程名称"> <el-row>
<el-input v-model="selectModuleForm.test"></el-input> <el-col :span="10">
</el-form-item> <el-form-item label="考试名称" prop="content1">
<el-form-item label="配置证书"> <span>{{item2.content1}}</span>
<el-input v-model="selectModuleForm.test"></el-input> </el-form-item>
</el-form-item> </el-col>
</el-form> </el-row>
<el-row>
<el-col :span="10">
<el-form-item label="配置证书" prop="name">
<span v-if="item1.content2">是</span>
<span v-else>否</span>
</el-form-item>
</el-col>
</el-row>
</div>
</div>
<!-- 课程 -->
<div v-if="item1.type == 2">
<el-row v-for="(item2,index2) in item1.partContentModelList" :key="index2">
<el-col :span="10">
<el-form-item label="课程名称" prop="content1">
<span>{{item2.content1}}</span>
</el-form-item>
</el-col>
</el-row>
</div>
</div>
</div>
</el-form>
</div>
<span slot="footer" class="dialog-footer dialog-foot"> <span slot="footer" class="dialog-footer dialog-foot">
<el-button type="default" size="small" @click="columnFormVisible = false">取 消</el-button> <el-button type="default" size="small" @click="columnFormVisible = false">取 消</el-button>
<el-button type="primary" size="small" @click="submitDialog">确 定</el-button> <el-button type="primary" size="small" @click="submitDialog">确 定</el-button>
...@@ -252,6 +277,7 @@ import BreadCrumb from '../../components/breadcrumb.vue' ...@@ -252,6 +277,7 @@ import BreadCrumb from '../../components/breadcrumb.vue'
import { doUpload, getFilePath } from "../../utils/qiniuUtil" import { doUpload, getFilePath } from "../../utils/qiniuUtil"
import { validateWord150 } from "../../utils/validate.js" import { validateWord150 } from "../../utils/validate.js"
let vm = null let vm = null
// 判断组件是否重名
let validateRepeatWord = function(rule, value, callback, message) { let validateRepeatWord = function(rule, value, callback, message) {
const reg = /^[\u4e00-\u9fa5]{2,20}$/ const reg = /^[\u4e00-\u9fa5]{2,20}$/
if(!reg.test(value)) { if(!reg.test(value)) {
...@@ -263,10 +289,27 @@ let validateRepeatWord = function(rule, value, callback, message) { ...@@ -263,10 +289,27 @@ let validateRepeatWord = function(rule, value, callback, message) {
name: value, name: value,
idType: 1 // 1内部 2外部 idType: 1 // 1内部 2外部
} }
vm.GET('portalComponent/checkComponentName',req).then((res) => { if(vm.itemName != value) {
vm.GET('portalComponent/checkComponentName',req).then((res) => {
if(res.code == '000000') {
if(res.data.resultFlag == 2) {
callback(new Error('该组件名称已存在，请使用一个新的组件名称'))
return
}else {
callback()
}
}
})
}else {
callback()
}
}
// 判断模块是否重名(对外开放时候验证)
let validateModuleName = function(rule, value, callback, message) {
vm.GET('portalComponent/checkModuleName',{name: value}).then((res) => {
if(res.code == '000000') { if(res.code == '000000') {
if(res.data.resultFlag == 2) { if(res.data.resultFlag != 1) {
callback(new Error('该组件名称已存在，请使用一个新的组件名称')) callback(new Error(message))
return return
}else { }else {
callback() callback()
...@@ -281,6 +324,7 @@ export default { ...@@ -281,6 +324,7 @@ export default {
data() { data() {
return { return {
columnFormVisible: false, columnFormVisible: false,
itemName: '',
stepNum: 1, stepNum: 1,
isStorage: true, isStorage: true,
componentId: '', componentId: '',
...@@ -293,7 +337,6 @@ export default { ...@@ -293,7 +337,6 @@ export default {
firstTab: '1', firstTab: '1',
hasCertificate: true, hasCertificate: true,
certificateLable: '是', certificateLable: '是',
openLable: '是',
portCertificateLable: '是', portCertificateLable: '是',
moduleIndex: '', moduleIndex: '',
editableTabs: [{ editableTabs: [{
...@@ -305,6 +348,7 @@ export default { ...@@ -305,6 +348,7 @@ export default {
testIdSelect: [], // 考试ID下拉列表 testIdSelect: [], // 考试ID下拉列表
certificateIdSelect: [], // 证书下拉列表 certificateIdSelect: [], // 证书下拉列表
courseIdSelect: [], // 课程下拉列表 courseIdSelect: [], // 课程下拉列表
dialogData: [],
portalComponent: { portalComponent: {
idType: 1, idType: 1,
name: '', name: '',
...@@ -371,9 +415,13 @@ export default { ...@@ -371,9 +415,13 @@ export default {
rules: { rules: {
"name": [ "name": [
{ required: true, message: '请输入模块名称', trigger: 'blur' }, { required: true, message: '请输入模块名称', trigger: 'blur' },
{ validator: function(rule, value, callback) {
validateModuleName(rule, value, callback, '模块名称已存在，请修改名称后保存')
},
trigger: 'blur' }
], ],
"openFlag": [ "openFlag": [
{ required: true } { required: true, message: '请选择是否对外开放', trigger: 'blur' }
] ]
}, },
templateRules: { templateRules: {
...@@ -400,6 +448,7 @@ export default { ...@@ -400,6 +448,7 @@ export default {
vm.GET('portalComponent/queryPortalComponentById',{id: vm.componentId}).then((res) => { vm.GET('portalComponent/queryPortalComponentById',{id: vm.componentId}).then((res) => {
if( res.code == '000000') { if( res.code == '000000') {
vm.portalComponent = res.data.portalComponent vm.portalComponent = res.data.portalComponent
vm.itemName = vm.portalComponent.name
if(!vm.portalComponent.certificateId) { if(!vm.portalComponent.certificateId) {
vm.hasCertificate = false vm.hasCertificate = false
vm.certificateLable = '否' vm.certificateLable = '否'
...@@ -470,11 +519,11 @@ export default { ...@@ -470,11 +519,11 @@ export default {
const isPNG = file.type === 'image/png' const isPNG = file.type === 'image/png'
const isLt2M = file.size / 1024 / 1024 < 2 const isLt2M = file.size / 1024 / 1024 < 2
if (!isJPG && !isPNG) { if (!isJPG && !isPNG) {
vm.$message.error('上传图片只能是.jpg或者.png格式!') vm.$message.error('图片不符合规范，请根据规范上传图片')
return; return;
} }
if (!isLt2M) { if (!isLt2M) {
vm.$message.error('上传图片大小不能超过2MB!'); vm.$message.error('图片不符合规范，请根据规范上传图片');
} }
let _img = new FileReader() let _img = new FileReader()
_img.readAsDataURL(file) _img.readAsDataURL(file)
...@@ -484,11 +533,10 @@ export default { ...@@ -484,11 +533,10 @@ export default {
image.onload = function() { image.onload = function() {
let _this = this let _this = this
if(_this.width != 750 || _this.height != 420) { if(_this.width != 750 || _this.height != 420) {
vm.$message.info('上传图片宽度不合适，请重新上传') vm.$message.info('图片不符合规范，请根据规范上传图片')
}else { }else {
doUpload(vm,file, getFilePath(file,null), 'preview4', 'progress1', 1).then(function (path) { doUpload(vm,file, getFilePath(file,null), 'preview4', 'progress1', 1).then(function (path) {
vm.portalComponent.imageUrl = path.fullPath vm.portalComponent.imageUrl = path.fullPath
vm.$message.success('上传成功')
}); });
} }
} }
...@@ -523,13 +571,6 @@ export default { ...@@ -523,13 +571,6 @@ export default {
vm.GET('portalComponent/ModuleList').then((res) => { vm.GET('portalComponent/ModuleList').then((res) => {
if( res.code == '000000') { if( res.code == '000000') {
vm.componentList.moduleModelList = res.data.moduleModelList vm.componentList.moduleModelList = res.data.moduleModelList
for(let i=0;i<vm.componentList.moduleModelList.length;i++) {
if(vm.componentList.moduleModelList[i].openFlag == 1) {
vm.openLable = '否'
}else {
vm.openLable = '是'
}
}
} }
}) })
}, },
...@@ -538,12 +579,15 @@ export default { ...@@ -538,12 +579,15 @@ export default {
vm.moduleIndex = index vm.moduleIndex = index
}, },
moduleOpenChange(value) { moduleOpenChange(value) {
if(value == '是') { for(let i=0;i<vm.componentList.moduleModelList.length;i++) {
vm.openLable = '是' if(vm.moduleIndex == i) {
vm.componentList.moduleModelList[vm.moduleIndex].openFlag = 2 if(value == '是') {
}else{ vm.componentList.moduleModelList[i].openFlag = 2
vm.openLable = '否' }else{
vm.componentList.moduleModelList[vm.moduleIndex].openFlag = 1 vm.componentList.moduleModelList[i].openFlag = 1
}
break
}
} }
}, },
// 删除tab // 删除tab
...@@ -555,6 +599,7 @@ export default { ...@@ -555,6 +599,7 @@ export default {
if( res.code == '000000') { if( res.code == '000000') {
vm.$message.info('成功删除模块！') vm.$message.info('成功删除模块！')
} }
vm.getModuleData()
}) })
}else { }else {
vm.componentList.moduleModelList.splice(i,1) vm.componentList.moduleModelList.splice(i,1)
...@@ -565,18 +610,14 @@ export default { ...@@ -565,18 +610,14 @@ export default {
}, },
// 添加空白模块 // 添加空白模块
addModule() { addModule() {
let seq = vm.componentList.moduleModelList.length + 1
vm.componentList.moduleModelList.push({ vm.componentList.moduleModelList.push({
id: '', id: '',
name: '', name: '',
openFlag: '', // 1不开放 2开放 openFlag: '', // 1不开放 2开放
moduleType: 1, // 2为从预设模块中添加
templetModelList: [] templetModelList: []
}) })
}, },
// 从模板中添加
addFromModule() {
vm.columnFormVisible = true
},
// 添加模板 // 添加模板
addTemplate(item,index) { addTemplate(item,index) {
vm.templetIndex = vm.componentList.moduleModelList[index].templetModelList.length vm.templetIndex = vm.componentList.moduleModelList[index].templetModelList.length
...@@ -721,17 +762,33 @@ export default { ...@@ -721,17 +762,33 @@ export default {
finishConponent() { finishConponent() {
vm.POST('portalComponent/insertOrUpdatePortalModule',{model: vm.componentList.moduleModelList}).then((res) => { vm.POST('portalComponent/insertOrUpdatePortalModule',{model: vm.componentList.moduleModelList}).then((res) => {
if( res.code == '000000') { if( res.code == '000000') {
vm.$router.push({ path: 'item-component' })
}
})
},
// 从资源包中添加模块
addFromModule() {
vm.columnFormVisible = true
vm.GET('portalComponent/ModuleList',{openFlag: 2}).then((res) => {
if( res.code == '000000') {
vm.resourceArray = res.data.moduleModelList
} }
}) })
}, },
// 选择资源包 // 选择资源包
selectChange() { selectChange(val) {
for(let i = 0; i < vm.resourceArray.length; i++) {
if(val == vm.resourceArray[i].id) {
vm.dialogData = vm.resourceArray[i]
break
}
}
}, },
// 确定选择模板 // 确定选择模板
submitDialog() { submitDialog() {
vm.columnFormVisible = false
vm.dialogData.moduleType = 2
vm.componentList.moduleModelList.push(vm.dialogData)
} }
} }
} }
...@@ -891,7 +948,21 @@ export default { ...@@ -891,7 +948,21 @@ export default {
.el-dialog__footer { .el-dialog__footer {
text-align: center; text-align: center;
padding-top: 30px; padding-top: 30px;
border-top: 1px solid #e1e1e1; // border-top: 1px solid #e1e1e1;
}
.default-module {
border-bottom: 1px dotted #e1e1e1;
.dialog-template-content {
input {
border: none;
}
.el-form-item {
margin-bottom: 0px;
}
span {
font-size: 12px;
}
}
} }
} }
} }
......
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或