Skip to content

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

实现基本的模板编辑页逻辑

上级 8a3016e6
隐藏空白字符变更
内嵌 并排
正在显示 包含 567 行增加 和 243 行删除
src/components/education/template/baseMessage.vue
浏览文件 @ 146f4f10
......@@ -8,15 +8,16 @@
label-width="150px"
class="basic-form"
>
<el-form-item label="项目名称：" prop="projectName">
<el-form-item label="模板名称：" prop="openTemplateName">
<el-col :span="13">
<el-input
size="small"
v-model="formData.projectName"
placeholder="请输入项目名称"
v-model="formData.openTemplateName"
placeholder="请输入模板名称"
style="width:70%;"
:disabled="disabled"
></el-input>
<span class="word-num">{{(formData.projectName).replace(/\s+/g,"").length}}/24</span>
<span class="word-num">{{(formData.openTemplateName).replace(/\s+/g,"").length}}/24</span>
</el-col>
</el-form-item>
......@@ -31,6 +32,7 @@
@input="changeOrganizationName"
@blur = "blurName"
@focus = "focusName(index)"
:disabled="disabled"
></el-input>
<span class="word-num">{{(formData.organizationNameList[index]).replace(/\s+/g,"").length}}/16</span>
<img @click="plusOrg(index)" class="edit-img" src="../../../assets/image/plus.png" />
......@@ -46,14 +48,15 @@
</el-popover>
</el-form-item>
<el-form-item label="有效期：" prop="useTime" v-if="!projectManger">
<el-form-item label="有效期：" prop="expireDay" v-if="!projectManger">
<el-col :span="13">
<el-input
size="small"
v-model="formData.useTime"
v-model="formData.expireDay"
placeholder="请填写1-1000之间的数字"
style="width:70%;"
oninput = "value=value.replace(/[^\d]|^[0]/g,'')"
:disabled="disabled"
></el-input>
<span class="day-btn">天</span>
</el-col>
......@@ -70,6 +73,7 @@
value-format="yyyy-MM-dd HH:mm:ss"
:picker-options="pickerOptions0"
style="width: 100%;"
:disabled="disabled"
></el-date-picker>
</el-form-item>
</el-col>
......@@ -85,19 +89,22 @@
:picker-options="pickerOptions1"
default-time="23:59:59"
style="width: 100%;"
:disabled="disabled"
></el-date-picker>
</el-form-item>
</el-col>
</el-form-item>
<el-form-item label="所属学科" prop="xueke">
<el-form-item label="所属学科" prop="subjectLevelList">
<el-col :span="13">
<el-cascader
class="subject-slelct"
v-model="formData.xueke"
v-model="formData.subjectLevelList"
:options="options"
:props="{ checkStrictly: true }"
@change="handleChange"></el-cascader>
@change="handleChange"
:disabled="disabled"
></el-cascader>
</el-col>
</el-form-item>
......@@ -110,6 +117,7 @@
action="#"
:show-file-list="false"
:before-upload="beforeUploadListPic"
:disabled="disabled"
>
<img v-if="formData.attachmentUrl1" @mouseover.stop="imgMouseOver=true" :src="formData.attachmentUrl1" class="bg-img">
<img
......@@ -117,7 +125,7 @@
class="bg-img"
src="../../../assets/image/small.png"
>
<div class="img-delete" v-show="imgMouseOver" @click.stop="deleteImg(1)" @mouseout.stop="imgMouseOver=false"><i class="el-icon-delete"></i></div>
<div class="img-delete" v-show="imgMouseOver && !disabled" @click.stop="deleteImg(1)" @mouseout.stop="imgMouseOver=false"><i class="el-icon-delete"></i></div>
<div class="limit-text">
<p>尺寸:48*48</p>
<p>限制大小: 500Kb</p>
......@@ -133,6 +141,7 @@
size="small"
v-model="formData.type"
@change="changeCover"
:disabled="disabled"
>
<el-radio :label="1">图片</el-radio>
<el-radio :label="2">视频</el-radio>
......@@ -148,6 +157,7 @@
action="#"
:show-file-list="false"
:before-upload="beforeUploadCoverPic"
:disabled="disabled"
>
<img
v-if="formData.type == 1 && formData.attachmentUrl2"
......@@ -169,7 +179,7 @@
class="bg-img"
src="../../../assets/image/small.png"
>
<div class="img-delete" v-show="imgMouseOver2" @click.stop="deleteImg(2)" @mouseout.stop="imgMouseOver2=false"><i class="el-icon-delete"></i></div>
<div class="img-delete" v-show="imgMouseOver2 && !disabled" @click.stop="deleteImg(2)" @mouseout.stop="imgMouseOver2=false"><i class="el-icon-delete"></i></div>
<div v-show="formData.type == 1" class="limit-text">
<p>尺寸:750*420</p>
<p>限制大小: 2.0 Mb</p>
......@@ -185,28 +195,30 @@
<p class="upload-message" v-if="uploadImgMessage2">请选择封面</p>
</div>
<el-form-item label="项目简介：" prop="projectIntro">
<el-form-item label="项目简介：" prop="openTemplateIntro">
<el-col :span="13">
<el-input
size="small"
type="textarea"
:autosize="{ minRows: 5}"
placeholder="请输入项目简介"
v-model="formData.projectIntro"
v-model="formData.openTemplateIntro"
style="width:83%;"
:disabled="disabled"
></el-input>
<span class="word-num">{{(formData.projectIntro).replace(/\s+/g,"").length}}/200</span>
<span class="word-num">{{(formData.openTemplateIntro).replace(/\s+/g,"").length}}/200</span>
</el-col>
</el-form-item>
<el-form-item label="项目详情" required prop="richContent" v-if="!projectManger">
<el-form-item label="项目详情" required prop="openTemplateDetail" v-if="!projectManger" :class="{ueitem: disabled}">
<vue-ueditor-wrap
ref="ueditor"
v-model="formData.richContent"
v-model="formData.openTemplateDetail"
:destroy="false"
:config="ueditorConfig"
>
</vue-ueditor-wrap>
<div v-if="disabled" class="ue-warp"></div>
</el-form-item>
</el-form>
</div>
......@@ -220,12 +232,12 @@ import VueUeditorWrap from 'vue-ueditor-wrap'
let vm = null;
export default {
props: {
formData: {
type: Object,
default:() => {
return null
}
},
// formData: {
// type: Object,
// default:() => {
// return null
// }
// },
projectManger: {
type: Boolean,
default: false
......@@ -253,35 +265,66 @@ export default {
visibleName: false, //是否显示机构提示
orgListIndex: 1,
organizationContent: 'hcd',//机构名称
options: [{
value: 'zhinan',
label: '指南',
children: [{
value: 'shejiyuanze',
label: '设计原则',
children: [{
value: 'yizhi',
label: '一致'
}, {
value: 'fankui',
label: '反馈'
}, {
value: 'xiaolv',
label: '效率'
}, {
value: 'kekong',
label: '可控'
}]
}]
}],
options: [],
formData: {
id: "", //开放模板id 26
openTemplateName: "", //开放模板名称
projectBegintime: "", //模板开始时间
projectEndtime: "", //模板结束时间
openTemplateIntro: "", //开放模板简介
type: 1, //封面类型 1图片2视频
expireDay: "", // 开放有效期
subjectLevelList: "", //开放模板所属学科lsit
subjectId: '', //开放模板所属学科id
subjectName: "", //开放模板所属学科名称
attachmentUrl1: "",
attachmentUrl2: "",
attachmentUrl3: "",
attachmentMore1: {
attachmentExt: "",
attachmentName: "",
attachmentSize: 0
},
attachmentMore2: {
attachmentExt: "",
attachmentName: "",
attachmentSize: 0
},
organizationName: "", // 发起机构名称（多个机构拼接
organizationNameList: [''], //发起机构列表
openTemplateDetail: '' //开放模板详情
},
attachmentModel:[ //基础信息的图片视频
{
attachmentExt: '',// 附件格式
attachmentName: '',//附件名称
attachmentSize:'',//附件大小,
attachmentType: 1,//1：图片 2：视频 3：pdf
attachmentUrl: '',//附件链接
id: '', //关联唯一ID
kind: 1, //1：列表图片 2：封面配置 3：附件配置
openTemplateId: ''//开放模板id
},
{
attachmentExt: '',// 附件格式
attachmentName: '',//附件名称
attachmentSize:'',//附件大小,
attachmentType: 1,//1：图片 2：视频 3：pdf
attachmentUrl: '',//附件链接
id: '', //关联唯一ID
kind: 1, //1：列表图片 2：封面配置 3：附件配置
openTemplateId: ''//开放模板id
}
],
baseobj: {},
pickerOptions0: {
disabledDate: time => {
if (
this.formData.projectEndtime != "" &&
this.formData.projectEndtime != null
vm.formData.projectEndtime != "" &&
vm.formData.projectEndtime != null
) {
return (
time.getTime() > new Date(this.formData.projectEndtime).getTime()
time.getTime() > new Date(vm.formData.projectEndtime).getTime()
);
}
}
......@@ -289,7 +332,7 @@ export default {
pickerOptions1: {
disabledDate: time => {
return (
time.getTime() < new Date(this.formData.projectBegintime).getTime()
time.getTime() < new Date(vm.formData.projectBegintime).getTime()
); //减去一天的时间代表可以选择同一天;
}
},
......@@ -298,7 +341,7 @@ export default {
uploadImgMessage: false,
uploadImgMessage2: false,
id: 1,
richContent: '',
openTemplateDetail: '',
ueditorConfig: {
// 编辑器不自动被内容撑高
autoFloatEnabled: false,
......@@ -333,7 +376,7 @@ export default {
// }
},
rules: {
projectName: [
openTemplateName: [
{ required: true, message: "请输入项目名称" },
{
min: 2,
......@@ -343,7 +386,7 @@ export default {
},
{ validator: checkProjectStr, trigger: "blur" }
],
useTime: [
expireDay: [
{ required: true, message: "请输入有效期", trigger: "blur" },
{ validator: checkUserTime, trigger: "blur" }
],
......@@ -361,15 +404,16 @@ export default {
trigger: "change"
}
],
xueke: { required: true, message: "请选择学科", trigger: "change" },
projectIntro: [
subjectLevelList: { required: true, message: "请选择学科", trigger: "change" },
openTemplateIntro: [
{ required: true, message: "请填写项目简介", trigger: "blur" },
{ min: 1, max: 200, message: "超出可输入的最大长度", trigger: "blur" }
],
richContent: [
openTemplateDetail: [
{ required: true, message: '请填写项目详情', trigger: 'blur' }
]
}
},
disabled: false
}
},
components:{
......@@ -377,45 +421,67 @@ export default {
},
created() {
vm = this;
vm.getSubjectList();
vm.getBaseMessage();
},
methods: {
// 获取已有的基本信息
getBaseMessage() {
let id = 26; // 开放模板id
// openLoading(vm);
vm.GET(`portal/openTemplate/getOpenTemplateInfo/${id}`).then(res => {
// closeLoading(vm);
if (res.code == "000000") {
this.formData = Object.assign(this.formData, res.data.portalOpenTemplateModel);
this.formData.attachmentUrl1 = res.data.attachmentData[0].attachmentUrl;
this.formData.attachmentMore1 = Object.assign(this.formData.attachmentMore1, res.data.attachmentData[0]);
this.formData.attachmentUrl2 = res.data.attachmentData[1].attachmentType == 1 ? res.data.attachmentData[1].attachmentUrl : '';
this.formData.attachmentUrl3 = res.data.attachmentData[1].attachmentType == 2 ? res.data.attachmentData[1].attachmentUrl : '';
this.formData.attachmentMore2 = Object.assign(this.formData.attachmentMore2, res.data.attachmentData[1]);
this.disabled = true;
} else {
vm.$message.info(res.message);
}
});
},
// 增加发起机构
plusOrg(index) {
this.formData.organizationNameList.splice(index + 1, 0, '');
vm.formData.organizationNameList.splice(index + 1, 0, '');
},
// 删除发起机构
deleteOrg(index) {
this.formData.organizationNameList.splice(index, 1);
vm.formData.organizationNameList.splice(index, 1);
},
// 机构名称输入
changeOrganizationName() {
let textLength = this.formData.organizationName.length;
let textLength = vm.formData.organizationName.length;
// 机构输入提示显示与否
this.visibleName = textLength == 0;
vm.visibleName = textLength == 0;
},
// 离开机构名称焦点
blurName() {
this.visibleName = false;
vm.visibleName = false;
setTimeout(() => {
this.submitForm("formData");
vm.submitForm("formData");
}, 200);
},
// 机构名称聚焦
focusName(index) {
let textLength = this.formData.organizationNameList[index].length;
let textLength = vm.formData.organizationNameList[index].length;
if (textLength == 0) {
this.orgListIndex = index + 1;
this.visibleName = true;
vm.orgListIndex = index + 1;
vm.visibleName = true;
} else {
this.visibleName = false;
vm.visibleName = false;
}
},
// 机构选择默认值
checkDefault() {
this.formData.organizationNameList.splice(this.orgListIndex-1, 1, this.organizationContent);
this.visibleName = false;
vm.formData.organizationNameList.splice(vm.orgListIndex-1, 1, vm.organizationContent);
vm.visibleName = false;
},
handleChange(value) {
},
handleChange() {},
//上传列表图片
beforeUploadListPic(file) {
let fileLimit = {
......@@ -425,20 +491,19 @@ export default {
more: "attachmentMore1",
show: "uploadImgMessage"
};
this.beforeAvatarUpload(file, fileLimit);
vm.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("图片不符合规范，请根据规范上传图片");
vm.$message.error("图片不符合规范，请根据规范上传图片");
// return;
}
if (!isLt2M) {
this.$message.error("图片不符合规范，请根据规范上传图片 ");
vm.$message.error("图片不符合规范，请根据规范上传图片 ");
// return;
}
let _img = new FileReader();
......@@ -447,10 +512,10 @@ export default {
let image = new Image();
image.src = theFile.target.result;
image.onload = function() {
let _this = this;
let _vm = vm;
if ( false
// _this.width != fileLimit.width ||
// _this.height != fileLimit.height
// _vm.width != fileLimit.width ||
// _vm.height != fileLimit.height
) {
vm.$message.error("图片不符合规范，请根据规范上传图片");
} else {
......@@ -486,16 +551,16 @@ export default {
// 删除图片
deleteImg(type) {
if (type == 1) {
this.formData.attachmentUrl1 = "";
this.imgMouseOver = false;
vm.formData.attachmentUrl1 = "";
vm.imgMouseOver = false;
} else {
this.formData.attachmentUrl2 = "";
this.imgMouseOver2 = false;
vm.formData.attachmentUrl2 = "";
vm.imgMouseOver2 = false;
}
},
//改变封面类型
changeCover(radio) {
this.formData.attachmentUrl2 = "";
vm.formData.attachmentUrl2 = "";
},
//上传封面图片
beforeUploadCoverPic(file) {
......@@ -508,24 +573,23 @@ export default {
more: "attachmentMore2",
show: "uploadImgMessage2"
};
if (this.formData.type == 1) {
this.beforeAvatarUpload(file, fileLimit);
if (vm.formData.type == 1) {
vm.beforeAvatarUpload(file, fileLimit);
} else {
this.beforeUploadMp4(file);
vm.beforeUploadMp4(file);
}
},
//上传mp4
beforeUploadMp4(file) {
console.log(file);
let vm = this;
const isMP4 = file.type === "video/mp4";
const isLt = file.size / 1024 / 1024 < 500;
if (!isLt) {
this.$message.error("视频不符合规范，请根据规范上传视频");
vm.$message.error("视频不符合规范，请根据规范上传视频");
return;
}
if (!isMP4) {
this.$message.error("视频不符合规范，请根据规范上传视频");
vm.$message.error("视频不符合规范，请根据规范上传视频");
} else {
openLoading(vm);
doUpload(
......@@ -547,27 +611,53 @@ export default {
// 点击下一步
nextStep() {
let flag = true;
if (!this.formData.attachmentUrl1) {
this.uploadImgMessage = true;
if (!vm.formData.attachmentUrl1) {
vm.uploadImgMessage = true;
flag = false;
} else {
this.uploadImgMessage = false;
vm.uploadImgMessage = false;
}
if (!this.formData.attachmentUrl2) {
this.uploadImgMessage2 = true;
if (!vm.formData.attachmentUrl2) {
vm.uploadImgMessage2 = true;
flag = false;
} else {
this.uploadImgMessage2 = false;
vm.uploadImgMessage2 = false;
}
return this.submitForm('formData') && flag;
// console.log('====================================');
// console.log(this.formData);
// console.log('====================================');
// if (vm.submitForm('formData') && flag) {
// vm.insertOrupdate();
// }
vm.insertOrupdate();
},
// 新增或者更新基本信息
insertOrupdate() {
vm.setSubjectId();
vm.formData.subjectName = vm.setSubjectName();
// 图片或者视频地址
vm.formData.attachmentMore1.attachmentUrl = vm.formData.attachmentUrl1;
vm.formData.attachmentMore2.attachmentUrl = vm.formData.type == 1 ? vm.formData.attachmentUrl2 : vm.formData.attachmentUrl3;
// 封面类型
vm.formData.attachmentMore2.attachmentType = vm.formData.type;
vm.formData.attachmentMore2.kind = 2;
//整合图片视频
vm.attachmentModel[0] = Object.assign(vm.attachmentModel[0],vm.formData.attachmentMore1);
vm.attachmentModel[1] = Object.assign(vm.attachmentModel[1],vm.formData.attachmentMore2);
vm.baseobj.openTemplateModel = vm.formData;
vm.baseobj.attachmentModel = vm.attachmentModel;
openLoading(vm);
vm.POST("portal/openTemplate/insertOrUpdate", vm.baseobj).then(res => {
closeLoading(vm);
if (res.code == "000000") {
// 将产生的模板id：openTemplateId传给下一步
this.$emit('next',res.data.openTemplateModel.id);
} else {
vm.$message.info(res.message);
}
});
},
//表单校验
submitForm(formName) {
let flag = null;
this.$refs[formName].validate(valid => {
vm.$refs[formName].validate(valid => {
if (valid) {
flag = true;
} else {
......@@ -582,10 +672,10 @@ export default {
vm.$message.error('请将富文本填写完整!');
return;
}
vm.editData.richContent = msg;
vm.editData.openTemplateDetail = msg;
openLoading(vm);
let req = {
richContent: vm.editData.richContent,
openTemplateDetail: vm.editData.openTemplateDetail,
id: vm.id
};
vm.$axios
......@@ -606,6 +696,48 @@ export default {
vm.$message.error(error);
});
},
// 获取学科列表
getSubjectList() {
let req = {};
vm.GET("/portal/openTemplate/labelList", req).then(res => {
if (res.code == '000000') {
vm.changeName(res.data);
vm.options = res.data;
}
});
},
// 优化学科数据的属性名
changeName(obj) {
for (const item of obj) {
item.children = item.subList;
item.label = item.name;
item.value = item.id ? item.id : 10;
if (item.children && Array.isArray(item.children)) {
vm.changeName(item.children);
}
}
},
// 获取学科对应的label
setSubjectName() {
for (const item of vm.options) {
if (item.value == vm.formData.subjectLevelList[0]) {
if (!vm.formData.subjectLevelList[1] || vm.formData.subjectLevelList[1] == 0) {
return item.label;
} else {
for (const j of item.children){
if (j.value == vm.formData.subjectLevelList[1]) {
return j.label;
}
}
}
}
}
},
// 设置学科id
setSubjectId() {
vm.formData.subjectId = (vm.formData.subjectLevelList.length > 1)&& vm.formData.subjectLevelList[1] != 0 ? vm.formData.subjectLevelList[1] : vm.formData.subjectLevelList[0]
}
}
}
</script>
......@@ -618,7 +750,7 @@ export default {
<style lang="scss" scoped>
.base-message-wrap {
margin-top: 20px;
padding-top: 80px;
.p_label {
margin-left: 56px;
font-size: 12px;
......@@ -718,7 +850,23 @@ export default {
padding: 18px 20px;
top: 40px;
}
.ueitem {
position: relative;
}
.ue-warp {
position: absolute;
width: 80%;
height: 100%;
background: #F5F7FA;
opacity: 0.5;
top: 0;
z-index: 1000;
}
}
.el-form-item__content {
width: 100%;
height: 100%;
background: red;
}
.popover-content {
position: relative;
......
src/components/education/template/selectRegion.vue
浏览文件 @ 146f4f10
......@@ -28,7 +28,7 @@
</el-tree>
</el-col>
<el-col :span="11">
<p class="area-p">
<p class="area-p" @click="getScope('administrative')">
项目范围包含下列区域所有机构和人员({{ tagsRegion.length }})
</p>
<el-tag
......@@ -70,7 +70,7 @@ export default {
},
treeData: [],
tagsRegion: [],
projectId: 640
projectId: 173
}
},
created() {
......@@ -105,7 +105,7 @@ export default {
this.treeData = [];
this.treeData[0] = administrativeAll;
this.setTreeData(administrative);
this.getCheckedTree();
// this.getCheckedTree();
}
});
},
......@@ -149,12 +149,11 @@ export default {
halfCheckedTree
);
//重构内容
this.allSelectedKeys = allSelectedKeys;
this.initCheckList(allSelectedKeys);
//console.log("allSelectedKeys", allSelectedKeys);
//改变行政范围后，更新设定机构和设定人员
this.updateOrganizationAndPerson(allSelectedKeys);
// this.updateOrganizationAndPerson(allSelectedKeys);
this.updatedTree = true;
},
//v2.2教培更新
......@@ -192,18 +191,21 @@ export default {
}
},
//行政范围改变更新设定机构
updateOrganizationAndPerson(allSelectedKeys) {
console.log('=========================updateOrganizationAndPerson')
this.tableOrganization = [];
this.tablePerson = [];
this.lookedOrganization = [];
this.changedOrganization = [];
this.changedOrganization2 = [];
},
getCheckedKeys() {
console.log('=========================getCheckedKeys')
console.log(this.$refs.tree.getCheckedKeys());
},
// updateOrganizationAndPerson(allSelectedKeys) {
// console.log('====================================');
// console.log(allSelectedKeys);
// console.log('====================================');
// console.log('=========================updateOrganizationAndPerson')
// this.tableOrganization = [];
// this.tablePerson = [];
// this.lookedOrganization = [];
// this.changedOrganization = [];
// this.changedOrganization2 = [];
// },
// getCheckedKeys() {
// console.log('=========================getCheckedKeys')
// console.log(this.$refs.tree.getCheckedKeys());
// },
//添加子节点
append(data, node) {
console.log('=========================append')
......@@ -264,6 +266,25 @@ export default {
}
console.log(treeKeyList);
this.$refs.tree.setCheckedKeys(treeKeyList);
},
//设定的行政范围内容
getScope(type) {
console.log('========================getScope');
let scope = "";
let arr = [];
for (let i = 0; i < this.tagsRegion.length; i++) {
scope += this.tagsRegion[i].key;
arr.push(this.tagsRegion[i].key)
if (i < this.tagsRegion.length - 1) {
scope += "|";
}
}
if (scope == "") {
return null;
}
this.$emit('setRegion',arr);
return scope;
}
}
}
......
src/components/education/template/selectTemplate.vue
浏览文件 @ 146f4f10
......@@ -205,6 +205,12 @@ import Sortable from "sortablejs";
let vm = null;
export default {
props: {
openTemplateId: {
type: String | Number,
deault: 0
}
},
data() {
let checkNormalInt = (rule, value, callback) => {
const val = parseFloat(value);
......@@ -216,7 +222,6 @@ export default {
}
};
return {
idTypeProject: "",
customError: {
standard: {
className: "",
......@@ -239,8 +244,6 @@ export default {
error: ""
}
},
projectId: null,
fileList: [],
//选择项目组件 数据
optionsComponent: [],
optionsCertificate: [],
......@@ -248,9 +251,9 @@ export default {
component: [],
configure: 2,
certificate: "",
courseRequire: 0, //0：不控制 1：按课程时长配置要求
passExamCount: "",
passAverageScore: "",
courseRequire: 0, //模板内课程的完成是否受学习时长控制：0否1是
passExamCount: "", //模板中最高考试门数限制：passType=2时有值
passAverageScore: "", //门数限制下考试成绩的平均分限制：passType=2时有值
passTotalLearnTime: ""
},
tagsComponent: [],
......@@ -259,8 +262,8 @@ export default {
showStorage: false,
//考试数据
formExam: {
certificateType: 1,
passType: 1,
certificateType: 1, //模板证书类型：1单证书2多证书
passType: 1, //模板通过标准类型：1所有组件通过，2根据平均分设定，3根据项目内学习时长设定
exam: [
{
examCount: 1,
......@@ -298,7 +301,8 @@ export default {
{ required: false, trigger: "change", validator: checkNormalInt }
],
showRules1: [{ required: true, message: "请输入门数", trigger: "blur" }]
}
},
disabled: true
};
},
computed: {
......@@ -306,7 +310,6 @@ export default {
},
created() {
vm = this;
(this.projectId = vm.getUrlSearch(window.location.href, "projectId")),
this.getComponentInfo();
vm.idType = localStorage.getItem("storageIdType");
},
......@@ -360,13 +363,8 @@ export default {
//查询组件证书信息
getComponentInfo() {
console.log('=================getComponentInfo');
let param = {};
let projectIdValue = vm.projectId;
if (projectIdValue == null) {
projectIdValue = 0;
}
vm
.GET("portal/portalInfo/getComponentInfo/" + projectIdValue, param)
.GET("portal/openTemplate/getAllComponent")
.then(res => {
if (res.code == "000000") {
//console.log(res);
......@@ -392,7 +390,7 @@ export default {
}
});
},
//项目组件信息 暂存/完成
//项目组件信息 暂存/完成 1暂存2保存3发布
componentDraft(type) {
console.log('=================componentDraft');
let param = {
......@@ -400,7 +398,7 @@ export default {
componentIds: operationData.getComponent(vm.tagsComponent),
// certificateId: this.formComponent.certificate,
certificateId: [],
projectId: this.projectId,
openTemplateId: this.openTemplateId,
type: type,
status: this.projectStatus,
certificateType: this.formExam.passType == 2 ? 2 : 1,
......@@ -431,7 +429,7 @@ export default {
certificateId: ruleData[o].certificateId,
certificateName: ruleData[o].certificateName,
examCount: ruleData[o].examCount,
portalProjectId: this.projectId,
openTemplateId: this.openTemplateId,
rangeMax: ruleData[o].rangeMax,
rangeMin: ruleData[o].rangeMin
};
......@@ -446,7 +444,7 @@ export default {
}
}
}
vm.POST("portal/portalInfo/componentDraft", param).then(res => {
vm.POST("portal/openTemplate/componentDraft", param).then(res => {
console.log(res);
vm.$message({
message: res.message,
......@@ -550,6 +548,7 @@ export default {
vm.$message("至少配置1个证书");
}
},
// 选择证书
updateCertificate(index) {
// console.log('optionsCertificate',vm.optionsCertificate,'index',index,'item',vm.formExam.exam[index])
for (let i = 0; i < vm.optionsCertificate.length; i++) {
......@@ -623,6 +622,7 @@ export default {
}
}
.select-manager-wrap {
padding-top: 64px;
.mleft60 {
margin-left: 60px;
}
......
src/components/education/template/setOrganization.vue
浏览文件 @ 146f4f10
......@@ -177,7 +177,8 @@ export default {
formOrganization: {
name: "",
administrativeId: "0",
administrativeIdList: ["0"],
// administrativeIdList: ["0"],
administrativeIdList:[110],
level: "-1",
chechAll: true,
pageNum: 1,
......@@ -339,7 +340,7 @@ export default {
},
//获取地区select
getRegionOption() {
console.log('=========================getRegionOption')
console.log('=========================getRegionOption')
let req = {};
openLoading(vm);
vm.GET("basic-data/position/provinces", req).then(res => {
......
src/components/education/template/stepContent.vue
浏览文件 @ 146f4f10
......@@ -2,7 +2,7 @@
<template>
<div class="step-content-compontent">
<el-row class="step-content">
<el-col :span="14">
<el-col :span="12">
<el-steps :active="active" simple class>
<span class="step-num" v-bind:class="{ 'on-step': active==0 }">1</span>
<el-step title="基础信息"></el-step>
......@@ -10,7 +10,7 @@
<el-step title="选择项目组件">3</el-step>
</el-steps>
</el-col>
<el-col :span="5" :offset="5">
<el-col :span="7" :offset="5">
<el-button v-if="!fished" size="small" type="primary" @click="nextStep">下一步</el-button>
<el-button v-if="fished" size="small" type="primary" @click="complete">完成</el-button>
</el-col>
......@@ -49,6 +49,11 @@ export default {
<style lang="scss">
.step-content-compontent {
background: #fff;
z-index: 1001;
background: #fff;
position: fixed;
right: 30px;
left: 285px;
.step-content {
overflow: hidden;
height: 60px;
......
src/components/education/template/templateList.vue
浏览文件 @ 146f4f10
......@@ -4,8 +4,8 @@
<div class="list-wrap">
<div class="template-content" :class="{clicked: item.isclick}" v-for="(item,index) of list" :key="index" @click="check(item,index)">
<div class="title-wrap">
<div class="title-icon">神经内科</div>
<div class="title">国家基本公共卫生服务项目国家基本公共卫生</div>
<div class="title-icon">{{item.subjectName}}</div>
<div class="title">{{item.openTemplateName}}</div>
<div class="sj" v-if="item.isclick">
<i class="el-icon-check"></i>
</div>
......@@ -13,21 +13,21 @@
<div class="main">
<div class="main-title">套餐内容包含:</div>
<ul class="clase-list">
<li class="clase-item">
<li class="clase-item" v-if="item.courseCount">
<span class="icon"></span>
<i class="icon-message">7节课程</i>
<i class="icon-message">{{item.courseCount}}节课程</i>
</li>
<li class="clase-item">
<li class="clase-item" v-if="item.beforeExamCount">
<span class="icon"></span>
<i class="icon-message">7节课程</i>
<i class="icon-message">{{item.beforeExamCount}}次摸底考试</i>
</li>
<li class="clase-item">
<li class="clase-item" v-if="item.afterExamCount">
<span class="icon"></span>
<i class="icon-message">7节7节课程课程</i>
<i class="icon-message">{{tem.afterExamCount}}次结业考试<i v-if="item.existCertificate "> (通过获结业证书)</i></i>
</li>
<li class="clase-item">
<span class="icon"></span>
<i class="icon-message">7节7节课程课程</i>
<i class="icon-message">实时在线项目数据报告</i>
</li>
</ul>
</div>
......@@ -50,20 +50,24 @@
</div>
<el-dialog title="项目详情" :visible.sync="dialogTableVisible" class="dialog-list-wrap">
<div class="dialog-line"></div>
<div class="dialog-title">国家基本公共卫生服务项目国家基本公共卫生</div>
<div class="dialog-title">{{detailObj.openTemplateName}}</div>
<div class="dialog-message">
<div class="dm-title">
<div class="dm-line"></div>
<div class="dm-msg">基本信息</div>
</div>
<div class="dm-main">
<div class="mian-list">
<div class="mian-list" v-if="detailObj.openTemplateIntro">
<div class="dm-name">内容有效期:</div>
<div class="dm-nr">30天</div>
<div class="dm-nr">{{detailObj.openTemplateIntro}}天</div>
</div>
<div class="mian-list" v-if="detailObj.subjectName">
<div class="dm-name">项目学科:</div>
<div class="dm-nr">{{detailObj.subjectName}}</div>
</div>
<div class="mian-list">
<div class="mian-list" v-if="detailObj.organizationName">
<div class="dm-name">已参加的机构:</div>
<div class="dm-nr">已参加的机构已参加的机构</div>
<div class="dm-nr">{{detailObj.organizationName}}</div>
</div>
</div>
</div>
......@@ -72,13 +76,14 @@
<div class="dm-line"></div>
<div class="dm-msg">项目简介</div>
</div>
<div class="jjs-main">项目简介项目简介项目简介项目简介项目简介项目简介项目简介项目简介项目简介项目简介项目简介项目简介项目简介项目简介项目简介项目简介项目简介项目简介项目简介项目简介项目简介项目简介项目简介项目简介项目简介项目简介项目简介项目简介项目简介项目简介项目简介项目简介项目简介项目简介项目简介项目简介项目简介项目简介</div>
<div class="jjs-main">{{detailObj.openTemplateIntro}}</div>
</div>
<div class="dialog-xq">
<div class="dm-title">
<div class="dm-line"></div>
<div class="dm-msg">项目详情</div>
</div>
<div class="xq-main" v-html="detailObj.openTemplateDetail"></div>
</div>
</el-dialog>
......@@ -88,67 +93,68 @@
</template>
<script>
import { openLoading, closeLoading } from "../../../utils/utils";
let vm = null;
export default {
data() {
return {
list: [
{
isclick: false
},
{
isclick: false
},
{
isclick: false
},
{
isclick: false
},
{
isclick: false
},
{
isclick: false
},
{
isclick: false
},
{
isclick: false
},
{
isclick: false
},
{
isclick: false
},
{
isclick: false
},
{
isclick: false
},
{
isclick: false
}
],
list: [],
detailObj: {},
dialogTableVisible: false
}
},
created() {},
created() {
vm = this;
vm.getTemplateList();
},
methods: {
// 选中
check(item,index) {
item.isclick = true;
for (let i = 0; i<this.list.length; i++) {
this.list[index].isclick = true;
for (let i = 0; i< this.list.length; i++) {
if (i != index) {
this.list[i].isclick = false
vm.list[i].isclick = false
}
}
vm.$emit('checkFn',item.id);
},
// 获取详情
getDetail() {
getDetail(item) {
//
this.dialogTableVisible = true;
openLoading(vm);
vm.GET(`portal/openTemplateProject/getOpenTemplateInfoForList/${item.id}`)
.then(res => {
closeLoading(vm);
if (res.code == "000000") {
vm.detailObj = res.data;
} else {
vm.$message.info(res.message);
}
})
.catch((err) => {
closeLoading(vm);
vm.$message.warning('请稍后重试');
});
},
getTemplateList() {
openLoading(vm);
vm.GET(`portal/openTemplateProject/getOpenTemplateList`)
.then(res => {
closeLoading(vm);
if (res.code == "000000") {
for (const item of res.data.list) {
item.isclick = false;
}
this.list = res.data.list;
} else {
vm.$message.info(res.message);
}
})
.catch((err) => {
closeLoading(vm);
vm.$message.warning('请稍后重试');
});
}
}
}
......@@ -405,6 +411,14 @@ export default {
.dialog-xq {
margin-top: 40px;
padding-bottom: 30px;
.xq-main {
margin-left: 17px;
margin-top: 16px;
color: #676869;
img {
max-height: 720px;
}
}
}
}
}
......
src/views/education/template-editor.vue
浏览文件 @ 146f4f10
<template>
<div class="template-editor-wrap">
<bread-crumb :curmbFirst="curmbFirst" :curmbSecond="curmbSecond" :curmbThird="curmbThird"></bread-crumb>
<div class="add-content screenSet" id="screenSet">
<div class="add-content screenSet" id="screenSet" v-if="editor">
<div class="top-lin"></div>
<step-content
:active="active"
:fished="fished"
@nextStep="nextStep"
@complete="complete"
/>
<!-- 基础组件 -->
<base-message
ref="baseMessage"
v-if="active == 0 && formData"
:formData="formData"
:projectManger="projectManger"
@next="next"
/>
<!-- 选择项目组件 -->
<select-template v-if="active == 1" />
<select-template
ref="selectTemplate"
v-if="active == 1"
:openTemplateId="openTemplateId"
/>
<!-- 选择行政区 -->
<!-- <select-region v-if="active == 1"></select-region> -->
......@@ -27,6 +31,23 @@
<!-- 设定机构 -->
<!-- <set-Organization v-if="active == 0"></set-Organization> -->
</div>
<div class="add-content screenSet" id="screenSet" v-else>
<el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="基础信息" name="first">
<base-message
ref="baseMessage"
:projectManger="projectManger"
@next="next"
/>
</el-tab-pane>
<el-tab-pane label="选中组件" name="second">
<select-template
ref="selectTemplate"
:openTemplateId="openTemplateId"
/>
</el-tab-pane>
</el-tabs>
</div>
</div>
</template>
......@@ -47,34 +68,54 @@ export default {
fished: false,
projectManger: false,
formData: {
projectName: "",
projectBegintime: "",
projectEndtime: "",
projectIntro: "",
type: 1,
useTime: "",
xueke: "",
openTemplateName: "", //开放模板名称
projectBegintime: "", //模板开始时间
projectEndtime: "", //模板结束时间
openTemplateIntro: "", //开放模板简介
type: 1, //封面类型 1图片2视频
expireDay: "", // 开放有效期
subjectId: "", //开放模板所属学科ID
subjectName: "", //开放模板所属学科名称
attachmentUrl1: "",
attachmentUrl2: "",
attachmentUrl3: "",
attachmentMore1: {},
attachmentMore2: {},
scopeType: 0,
organizationName: "",
organizationNameList: [''],
sendOption: 1,
receiveOption: 1,
visibleFlag: 1,
learnableFlag: 2,
authorityType: 1,
allowLearn: 2,
richContent: ''
organizationName: "", // 发起机构名称（多个机构拼接
organizationNameList: [''], //发起机构列表
openTemplateDetail: '' //开放模板详情
},
attachmentModel:[ //基础信息的图片视频
{
attachmentExt: '',// 附件格式
attachmentName: '',//附件名称
attachmentSize:'',//附件大小,
attachmentType: 1,//1：图片 2：视频 3：pdf
attachmentUrl: '',//附件链接
id: '', //关联唯一ID
kind: 1, //1：列表图片 2：封面配置 3：附件配置
openTemplateId: ''//开放模板id
},
{
attachmentExt: '',// 附件格式
attachmentName: '',//附件名称
attachmentSize:'',//附件大小,
attachmentType: 1,//1：图片 2：视频 3：pdf
attachmentUrl: '',//附件链接
id: '', //关联唯一ID
kind: 1, //1：列表图片 2：封面配置 3：附件配置
openTemplateId: ''//开放模板id
}
],
baseobj: {},
formTemplate: {
component: [],
configure: 2,
certificate: ""
}
},
openTemplateId: 26,
activeName: 'first',
editor: true // 是否为编辑状态
}
},
components: {
......@@ -85,28 +126,66 @@ export default {
selectRegion,
setOrganization
},
created() {},
created() {
this.fished = this.active == 0 ? false : true
},
methods: {
// 下一步
//用于存储基本信息
nextStep() {
// let flag = this.$refs.baseMessage.nextStep();
// if (!flag) {
// return;
// }
this.active++;
if (this.active == 1) {
this.fished = true;
if(this.active == 0) {
let flag = this.$refs.baseMessage.nextStep();
}
},
// 下一步
next(openTemplateId) {
this.openTemplateId = openTemplateId;
this.active = 1;
this.fished = true;
},
complete() {
console.log('完成');
//1暂存2保存3发布
this.$refs.selectTemplate.componentDraft(3);
},
handleClick() {
}
}
}
</script>
<style>
.template-editor-wrap .el-tabs__header {
z-index: 1001;
background: #fff;
position: fixed;
right: 30px;
left: 285px;
}
.template-editor-wrap .el-tabs__item {
width: 240px;
text-align: center;
margin-right: 20px;
height: 64px;
line-height: 64px;
font-size:16px;
font-family:PingFangSC-Medium,PingFang SC;
font-weight:500;
color:rgba(48,49,51,1);
}
</style>
<style lang="scss" scoped>
.template-editor-wrap {
.top-lin {
position: fixed;
height: 30px;
background: #F0F2F5;
right: 30px;
left: 285px;
z-index: 1001;
top: 125px;
}
.add-content {
background: #fff;
}
......
src/views/education/template-open.vue
浏览文件 @ 146f4f10
......@@ -2,7 +2,8 @@
<div class="template-open-wrap">
<bread-crumb :curmbFirst="curmbFirst" :curmbSecond="curmbSecond" :curmbThird="curmbThird"></bread-crumb>
<div class="add-content screenSet" id="screenSet" style="pos">
<div class="add-content screenSet" id="screenSet">
<div class="top-lin"></div>
<el-row class="step-content">
<el-col :span="14">
<el-steps :active="active" simple class>
......@@ -15,12 +16,13 @@
</el-steps>
</el-col>
<el-col :span="5" :offset="5">
<el-button v-if="active!==2" size="small" type="primary" @click="nextStep">下一步</el-button>
<el-button v-if="!canNext" size="small" type="info" plain>下一步</el-button>
<el-button v-if="active!==2 && canNext" size="small" type="primary" @click="nextStep">下一步</el-button>
<el-button v-if="active==2" size="small" type="primary" @click="complete">完成</el-button>
</el-col>
</el-row>
<div v-if="active == 0" class="tpl-main">
<template-list></template-list>
<template-list @checkFn="checkFn"></template-list>
</div>
<!-- 模板列表 -->
......@@ -34,13 +36,13 @@
/>
<!-- 选择学员 -->
<div class="second-step" v-else-if="active === 2">
<div class="three-step" v-else-if="active === 2">
<el-tabs v-model="activeName" @tab-click="handleClickTabs">
<el-tab-pane label="设定行政范围" name="first">
<select-region></select-region>
<select-region @setRegion="setRegion"></select-region>
</el-tab-pane>
<el-tab-pane label="设定机构" name="second">
<set-Organization></set-Organization>
<set-Organization ></set-Organization>
</el-tab-pane>
</el-tabs>
</div>
......@@ -57,6 +59,7 @@ import setOrganization from "../../components/education/template/setOrganization
import templateList from "../../components/education/template/templateList";
import { openLoading, closeLoading } from "../../utils/utils";
import * as commonUtil from "../../utils/utils";
let vm = null;
export default {
data() {
return {
......@@ -95,7 +98,10 @@ export default {
configure: 2,
certificate: ""
},
activeName: "first"
activeName: "first",
canNext: false,
openTemplateId: '',
r: []//设定行政范围和设定机构相互影响的行政范围
}
},
components: {
......@@ -106,7 +112,9 @@ export default {
setOrganization,
templateList
},
created() {},
created() {
vm = this;
},
mounted() {
commonUtil.resizeHeight();
},
......@@ -128,6 +136,35 @@ export default {
//切换tabs
handleClickTabs(tab, event) {
// this.activeName = tab.name;
},
// 模板列表选中
checkFn(id) {
this.canNext = true;
this.openTemplateId = id;
},
//选中模板后点击下一步时检测(机构和进行中的项目)
checkSelectTemplate() {
openLoading(vm);
vm.GET(`portal/openTemplateProject/checkAfterSelectOneOpenTemplate/${vm.openTemplateId}`)
.then(res => {
closeLoading(vm);
if (res.code == "000000") {
console.log()
} else {
vm.$message.info(res.message);
}
})
.catch((err) => {
closeLoading(vm);
vm.$message.warning('请稍后重试');
});
},
// 设定行政范围和设定机构范围相互影响
setRegion(r) {
this.r = r;
console.log('====================================');
console.log(r);
console.log('====================================');
}
}
}
......@@ -135,7 +172,25 @@ export default {
<style lang="scss">
.template-open-wrap {
.el-step.is-simple:not(:last-of-type) .el-step__title {
max-width: 100%;
}
.top-lin {
position: fixed;
height: 30px;
background: #F0F2F5;
right: 30px;
left: 285px;
z-index: 1001;
top: 125px;
}
.step-content {
background: #fff;
z-index: 1001;
background: #fff;
position: fixed;
right: 30px;
left: 285px;
overflow: hidden;
height: 60px;
// margin-top: 66px;
......@@ -189,7 +244,8 @@ export default {
.add-content {
background: #fff;
}
.second-step {
.three-step {
padding-top: 64px;
margin: 10px 0 0 20px;
.area-p {
margin-bottom: 15px;
......
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或