提交 d2a020cb 编写于 作者: guangjun.yang's avatar guangjun.yang

外部资源管理

上级 30ce6581
...@@ -66,18 +66,27 @@ ...@@ -66,18 +66,27 @@
<span class="require">*</span> <span class="require">*</span>
<el-form-item label="课程视频:" prop="range"> <el-form-item label="课程视频:" prop="range">
<!-- action="https://jsonplaceholder.typicode.com/posts/" --> <!-- action="https://jsonplaceholder.typicode.com/posts/" -->
<!-- multiple -->
<!-- :on-preview="handlePreview"
:on-remove="handleRemove"
:before-remove="beforeRemove" -->
<el-upload <el-upload
class="upload-demo" class="upload-demo"
action="https://sc.yunqueyi.com/contents/admin/qiniu/token1" action="#"
:on-preview="handlePreview" :before-upload="beforeUploadListPic"
:on-remove="handleRemove" :limit="3"
:before-remove="beforeRemove"
multiple
:limit="100"
:on-exceed="handleExceed" :on-exceed="handleExceed"
:file-list="fileList"> :show-file-list="false"
>
<el-button size="small" type="primary">点击上传</el-button> <el-button size="small" type="primary">点击上传</el-button>
<div slot="tip" class="el-upload__tip">只能上传jpg/png文件,且不超过500kb</div> <div slot="tip" class="el-upload__tip">
<span >只支持MP4格式,课程视频最多上传100个,单文件最大2G</span>
<ul class="custom-list">
<li v-for="(file, index) in fileList" :key="index">
<span>{{file.name}}</span>
</li>
</ul>
</div>
</el-upload> </el-upload>
</el-form-item> </el-form-item>
</div> </div>
...@@ -464,18 +473,19 @@ export default { ...@@ -464,18 +473,19 @@ export default {
//上传图片校验 //上传图片校验
beforeAvatarUpload(file, fileLimit) { beforeAvatarUpload(file, fileLimit) {
console.log();
const isJPG = file.type === "image/jpeg"; const isJPG = file.type === "image/jpeg";
const isPNG = file.type === "image/png"; const isPNG = file.type === "image/png";
const isLt2M = file.size / 1024 / 1024 < fileLimit.size; const isLt2M = file.size / 1024 / 1024 < fileLimit.size;
console.log('isJPG', isJPG, 'isPNG', isPNG, 'isLt2M', isLt2M); console.log('isJPG', isJPG, 'isPNG', isPNG, 'isLt2M', isLt2M);
if (!isJPG && !isPNG) { // if (!isJPG && !isPNG) {
vm.$message.error("图片不符合规范,请根据规范上传图片"); // vm.$message.error("图片不符合规范,请根据规范上传图片");
return; // return;
} // }
if (!isLt2M) { // if (!isLt2M) {
vm.$message.error("图片不符合规范,请根据规范上传图片 "); // vm.$message.error("图片不符合规范,请根据规范上传图片 ");
return; // return;
} // }
let _img = new FileReader(); let _img = new FileReader();
_img.readAsDataURL(file); _img.readAsDataURL(file);
_img.onload = function(theFile) { _img.onload = function(theFile) {
...@@ -534,7 +544,7 @@ export default { ...@@ -534,7 +544,7 @@ export default {
console.log(file); console.log(file);
}, },
handleExceed(files, fileList) { handleExceed(files, fileList) {
this.$message.warning(`当前限制选择 3 个文件,本次选择了 ${files.length} 个文件,共选择了 ${files.length + fileList.length} 个文件`); this.$message.warning(`当前限制选择 100 个文件,您已经共选择了 ${files.length + fileList.length} 个文件!`);
}, },
beforeRemove(file, fileList) { beforeRemove(file, fileList) {
return this.$confirm(`确定移除 ${ file.name }?`); return this.$confirm(`确定移除 ${ file.name }?`);
......
...@@ -146,6 +146,7 @@ export default { ...@@ -146,6 +146,7 @@ export default {
this.allLabelListOrg[index].checked = true; this.allLabelListOrg[index].checked = true;
let subLabelListOrg = this.allLabelListOrg[index].subList; let subLabelListOrg = this.allLabelListOrg[index].subList;
this.setSubLabelListOrg(subLabelListOrg); this.setSubLabelListOrg(subLabelListOrg);
this.$forceUpdate();
}, },
// 选择二级 // 选择二级
......
...@@ -45,7 +45,8 @@ const templateEditor = r => require.ensure([], () => r(require('../views/educati ...@@ -45,7 +45,8 @@ const templateEditor = r => require.ensure([], () => r(require('../views/educati
const templateOpen = r => require.ensure([], () => r(require('../views/education/template-open.vue')), 'templateOpen') const templateOpen = r => require.ensure([], () => r(require('../views/education/template-open.vue')), 'templateOpen')
const eduRole = r => require.ensure([], () => r(require('../views/education/edu-role.vue')), 'edu-role') const eduRole = r => require.ensure([], () => r(require('../views/education/edu-role.vue')), 'edu-role')
const editCustom = r => require.ensure([], () => r(require('../views/education/edit-custom.vue')), 'templateOpen') const editCustom = r => require.ensure([], () => r(require('../views/education/edit-custom.vue')), 'templateOpen')
const externalResourceManage = r => require.ensure([], () => r(require('../views/education/external-resource-manage.vue')), 'review-access-manage') const externalResourceManage = r => require.ensure([], () => r(require('../views/education/external-resource-manage.vue')), 'external-resource-manage')
const auditCustomCourse = r => require.ensure([], () => r(require('../views/education/audit-custom-course.vue')), 'audit-custom-course')
const noticeEditor = r => require.ensure([], () => r(require('../views/education/notice-editor.vue')), 'notice-editor') const noticeEditor = r => require.ensure([], () => r(require('../views/education/notice-editor.vue')), 'notice-editor')
...@@ -198,6 +199,10 @@ export default [{ ...@@ -198,6 +199,10 @@ export default [{
path: '/external-resource-manage', path: '/external-resource-manage',
component: externalResourceManage, component: externalResourceManage,
}, },
{
path: '/audit-custom-course',
component: auditCustomCourse,
},
// { // {
// path: '/followup', // path: '/followup',
// name: 'followUp', // name: 'followUp',
......
<template>
<div class="edit-course-wrapper dialog-title-border">
<div class="course-content">
<el-form
ref="formDataRef"
:model="formData"
:rules="rules"
label-width="120px"
class="basic-form"
>
<el-form-item label="课程名称:" prop="courseName" class="valid-msg">
<el-col :span="20">
<el-input
size="small"
v-model="formData.courseName"
placeholder="请输入课程名称"
style="width: 360px"
maxlength="25"
:disabled="disabled"
></el-input>
<span class="word-num">
{{(formData.courseName).replace(/\s+/g,"").length}}/25
<span class="edit-wrapper"><img class="edit-img" src="../../assets/image/phrase3/icon-pin.png">修改信息</span>
</span>
<div class="error"><span>错误信息错误信息错误信息错误信息错误信息错误信息息</span><span class="cancle">X</span></div>
</el-col>
</el-form-item>
<el-form-item label="学科分类:" prop="subjectIdList" class="valid-msg">
<el-col :span="18">
<!-- :props="{ expandTrigger: 'hover' }" -->
<el-cascader
style="width: 360px"
v-model="formData.subjectIdList"
:options="labelOptions"
:props="{ value: 'id', label: 'name', children: 'subList'}"
@change="handleChange">
<!-- <template slot-scope="{ node, data }">
<span>{{ data.name }}</span>
</template> -->
</el-cascader>
</el-col>
</el-form-item>
<el-form-item label="开放范围:" prop="shareType" class="valid-msg">
<el-radio-group v-model="formData.shareType">
<el-radio :label="1">机构共享</el-radio>
</el-radio-group>
</el-form-item>
<div class="basic-item-icon">
<span class="require">*</span>
<el-form-item label="课程视频:" prop="range">
<!-- action="https://jsonplaceholder.typicode.com/posts/" -->
<!-- multiple -->
<!-- :on-preview="handlePreview"
:on-remove="handleRemove"
:before-remove="beforeRemove" -->
<el-upload
class="upload-demo"
action="#"
:before-upload="beforeUploadListPic"
:limit="3"
:on-exceed="handleExceed"
:show-file-list="false"
>
<el-button size="small" type="primary">点击上传</el-button>
<div slot="tip" class="el-upload__tip">
<span >只支持MP4格式,课程视频最多上传100个,单文件最大2G</span>
<ul class="custom-list">
<li v-for="(file, index) in fileList" :key="index">
<span>{{file.name}}</span>
</li>
</ul>
</div>
</el-upload>
</el-form-item>
</div>
<div class="other-content valid-msg" v-show="isShowOtherContent">
<div class="tips">注:以下信息为非必填项,您也可以根据实际情况修改</div>
<div class="basic-item-icon">
<!-- <span class="require">*</span> -->
<el-form-item label="课程封面:">
<el-upload
v-model="formData.courseHeaderImage"
class="bg-uploader"
action="#"
:show-file-list="false"
:before-upload="beforeUploadListPic"
:disabled="disabled"
>
<div class="bg-img-wrapper">
<img v-if="formData.courseHeaderImage" @mouseover.stop="imgMouseOver=true" :src="formData.courseHeaderImage" class="bg-img">
<img v-if="!formData.courseHeaderImage" class="bg-img" src="../../assets/image/small.png">
</div>
</el-upload>
<div class="limit-text">
尺寸:750*420,只支持jpeg格式
</div>
</el-form-item>
<p class="upload-message" v-if="uploadImgMessage">请选择列表图片</p>
</div>
<el-form-item label="课程难度:">
<el-radio-group v-model="formData.difficultyLevel">
<el-radio :label="1">初级</el-radio>
<el-radio :label="2">中级</el-radio>
<el-radio :label="3">高级</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="讲师名称:" class="valid-msg">
<el-col :span="18">
<el-input
size="small"
v-model="formData.courseCustomDocterModel[0].courseDoctorName"
placeholder="请输入讲师名称"
style="width: 360px"
maxlength="25"
@focus="isShowDoctorList=true"
@input="filterDoctorName"
@blur="doctorNameInputBlur"
:disabled="disabled"
></el-input>
<ul v-show="isShowDoctorList" class="doctor-select-list">
<li
v-for="item in doctorNameList"
:key="item.value"
@click="selectDoctor(item.value)"
:class="{'doctor-selected': item.seleted}"
>
<span v-show="item.show">{{item.value}}</span>
</li>
</ul>
<span class="word-num">{{(formData.courseCustomDocterModel[0].courseDoctorName).replace(/\s+/g,"").length}}/25</span>
</el-col>
</el-form-item>
<div class="basic-item-icon">
<el-form-item label="讲师头像:">
<el-upload
v-model="formData.courseCustomDocterModel[0].courseDoctorAvatarUrl"
class="bg-uploader"
action="#"
:show-file-list="false"
:before-upload="beforeUploadListPic"
:disabled="disabled"
>
<div class="bg-img-wrapper">
<img v-if="formData.courseCustomDocterModel[0].courseDoctorAvatarUrl" @mouseover.stop="imgMouseOver=true" :src="formData.courseCustomDocterModel[0].courseDoctorAvatarUrl" class="bg-img-doctor">
<img v-if="!formData.courseCustomDocterModel[0].courseDoctorAvatarUrl" class="bg-img-doctor" src="../../assets/image/small.png">
</div>
</el-upload>
<div class="limit-text">
尺寸:88*88,只支持jpeg格式
</div>
</el-form-item>
<p class="upload-message" v-if="uploadImgMessage">请选择列表图片</p>
</div>
<el-form-item label="所属机构:">
<el-col :span="18">
<el-input
size="small"
v-model="formData.courseCustomDocterModel[0].courseDoctorHospital"
placeholder="请输入所属机构"
style="width: 360px"
maxlength="25"
:disabled="disabled"
></el-input>
<span class="word-num">{{(formData.courseCustomDocterModel[0].courseDoctorHospital).replace(/\s+/g,"").length}}/25</span>
</el-col>
</el-form-item>
<el-form-item label="课程简介:">
<el-col :span="22">
<el-input
size="small"
type="textarea"
:autosize="{ minRows: 5}"
placeholder="请输入课程简介"
v-model="formData.courseIntro"
style="width:90%;"
></el-input>
<span class="word-num">{{(formData.courseIntro).replace(/\s+/g,"").length}}/200</span>
</el-col>
</el-form-item>
</div>
<!-- 更多信息 -->
<div class="separator-line">
<span class="line-left"></span>
<div @click="toggleOtherContent" class="center">
<span>展开更多信息</span>
<img v-show="isShowOtherContent" src="../../assets/image/phrase3/arrow-up.png"/>
<img v-show="!isShowOtherContent" src="../../assets/image/phrase3/arrow-down.png"/>
</div>
<span class="line-right"></span>
</div>
</el-form>
</div>
<div slot="footer" class="dialog-footer">
<el-button @click="close">取 消</el-button>
<el-button type="primary" @click="submitForm('formDataRef')">确 定</el-button>
</div>
<!-- <PreviewVideo :dialogVisible="isPreviewVideo" :videoUrl="videoUrl" @close="closeVideo"></PreviewVideo> -->
<!-- <button @click="previewVideoAction">test video</button> -->
</div>
</template>
<script>
import PreviewVideo from "@/components/education/custom-resource/preview-video";
import PreviewProtocol from "@/components/education/custom-resource/preview-protocol";
import PreviewEditCourse from "@/components/education/custom-resource/edit-course-dialog";
import { doUpload, getFilePath } from "@/utils/qiniu-util";
import { openLoading, closeLoading, getQiniuToken1 } from "@/utils/utils";
let vm = null;
export default {
data() {
let checkCourseName = (rule, value, callback) => {
// 如果有审核的信息,则直接报错
// if(this.needShowAuditMsg && this.auditMsgMap.name.desc) {
// callback(new Error(this.auditMsgMap.name.desc));
// return;
// }
// if(!this.needShowAuditMsg && !value) {
// callback(new Error('请输入课程名称'));
// } else {
// callback();
// }
};
return {
needShowAuditMsg: true,
auditMsgMap: {
name: {
desc: '填写的课程名称不对'
}
},
disabled: false,
formData: {
checkStatus: 0,
courseCustomChapterModel: [{
courseCustomLectureModelList: [
{
contentCheck: '',
id: 0,
name: '',
nameCheck: '',
resourceModel: {
createdId: 0,
createdTime: '',
deleteFlag: 0,
filePath: '',
fileType: 0,
formatType: 0,
hospitalId: 0,
id: 0,
idType: 0,
lectureId: 0,
modifiedId: 0,
modifiedTime: '',
name: '',
operateKey: '',
page: 0,
resolutionRatio: '',
size: 0,
status: 0,
totalTime: 0,
type: 0,
videoType: 0
}
}
],
id: 0,
name: ''
}],
courseCustomDocterModel: [
{
courseDoctorAvatarUrl: 'https://file.yunqueyi.com/h5/images/cme/doctor-header.png',
courseDoctorHospital: '',
courseDoctorHospitalCheck: '',
courseDoctorName: '',
courseDoctorNameCheck: '',
id: 0
}
],
courseHeaderImage: 'https://file.yunqueyi.com/h5/images/cme/project-banner.png',
courseId: 0,
courseIntro: '',
courseIntroCheck: '',
courseName: '',
courseNameCheck: '',
difficultyLevel: 1,
shareType: 1,
subjectIdList: [410, 423]
},
uploadImgMessage: false,
imgMouseOver: false,
rules: {
courseName: [
{ required: true, message: "请输入课程名称"},
{ validator: checkCourseName }
],
subjectIdList: [
{ required: true, message: "请输入课程名称", trigger: "blur"},
],
shareType: [
{ required: true, message: "请选择开放范围", trigger: "blur"},
],
},
labelOptions: [],
isShowOtherContent: false,
fileList: [
{name: 'food.jpeg', url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100'},
{name: 'food2.jpeg', url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100'}
],
projectBanner: 'https://file.yunqueyi.com/h5/images/cme/project-banner.png',
doctorHeader: 'https://file.yunqueyi.com/h5/images/cme/doctor-header.png',
doctorNameList: [
{value: '333', show: true, seleted: false},
{value: '334', show: true, seleted: false},
{value: '335', show: true, seleted: false},
{value: '336', show: true, seleted: false},
],
isShowDoctorList: false,
isPreviewVideo: false,
videoUrl: '',
};
},
props: {
dialogVisible: {
type: Boolean,
default: false
},
addOrUpdate: {
type: String,
default: 'add'
}
},
computed: {
},
watch: {
dialogVisible(isVisible) {
if(isVisible) {
if(this.addOrUpdate == 'add') {
this.initAdd();
} else {
this.initModify();
}
}
}
},
components: {
PreviewVideo,
PreviewEditCourse
},
created() {
vm = this;
this.initAdd();
},
mounted() {
this.getLabelList();
// setTimeout(() => {
// console.log(this.$refs.formDataRef);
// this.$refs['formDataRef'].validateField("name");
// }, 2000);
},
methods: {
// 添加时初始化
initAdd() {
console.log('in initAdd');
},
initModify() {
console.log('in initModify');
},
// 过滤医生信息
filterDoctorName(value) {
this.doctorNameList.forEach( item => {
if(value) {
if((item.value + '').indexOf(value) == -1) {
item.show = false;
} else {
item.show = true;
}
if(item.value == value) {
item.seleted = true;
} else {
item.seleted = false;
}
} else {
item.show = true;
}
})
},
// 当选择医生的焦点失去时,要反选医生信息
doctorNameInputBlur() {
setTimeout(() => {
this.isShowDoctorList = false;
this.selectDoctorByName(this.formData.courseCustomDocterModel[0].courseDoctorName);
}, 200);
},
// 根据姓名反选医生信息
// TODO
selectDoctorByName(name) {
},
// 选择其中一个
selectDoctor(name) {
console.log(name)
this.formData.courseCustomDocterModel[0].courseDoctorName = name;
this.selectDoctorByName(name);
},
close() {
this.$emit('close');
},
// 获取学科列表
getLabelList() {
let req = {};
this.GET("aggregate/content/labelList", req).then(res => {
if (res.code == '000000') {
this.convertLabelList(res.data);
}
});
},
// 将所有子分类中的“全部”去掉
convertLabelList(labelList) {
let newLabelList = [];
labelList.forEach( item => {
item.subList = item.subList.slice(1);
})
this.labelOptions = labelList;
},
//上传列表图片
beforeUploadListPic(file) {
let fileLimit = {
width: 230,
height: 172,
size: 0.5,
sizeText: "500K",
key: "attachmentUrl",
more: "attachmentMore1",
show: "uploadImgMessage"
};
vm.beforeAvatarUpload(file, fileLimit);
},
//上传图片校验
beforeAvatarUpload(file, fileLimit) {
console.log();
const isJPG = file.type === "image/jpeg";
const isPNG = file.type === "image/png";
const isLt2M = file.size / 1024 / 1024 < fileLimit.size;
console.log('isJPG', isJPG, 'isPNG', isPNG, 'isLt2M', isLt2M);
// if (!isJPG && !isPNG) {
// vm.$message.error("图片不符合规范,请根据规范上传图片");
// return;
// }
// if (!isLt2M) {
// vm.$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 _vm = this;
if (
false
// true ||
// _vm.width != fileLimit.width ||
// _vm.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);
if (fileLimit.show == "uploadImgMessage") {
vm.uploadImgMessage = false;
}
// else if (fileLimit.show == "uploadImgMessage2") {
// vm.uploadImgMessage2 = false;
// }
vm.formData[fileLimit.key] = path.fullPath;
vm.formData[fileLimit.more] = {
attachmentName: path.name,
attachmentExt: path.ext,
attachmentSize: path.size
};
vm.$message.success("上传成功");
});
}
};
};
return isJPG && isLt2M;
},
toggleOtherContent() {
this.isShowOtherContent = !this.isShowOtherContent;
},
// 上传文件相关
handleRemove(file, fileList) {
console.log(file, fileList);
},
handlePreview(file) {
console.log(file);
},
handleExceed(files, fileList) {
this.$message.warning(`当前限制选择 100 个文件,您已经共选择了 ${files.length + fileList.length} 个文件!`);
},
beforeRemove(file, fileList) {
return this.$confirm(`确定移除 ${ file.name }?`);
},
//表单校验
submitForm(formName) {
console.log('this.formData', this.formData);
this.needShowAuditMsg = false;
let flag = null;
this.$refs[formName].validate(valid => {
if (valid) {
//console.log("success");
flag = true;
} else {
console.log("error submit!!");
flag = false;
}
});
return flag;
},
handleChange(value) {
console.log(value);
},
}
};
</script>
<style scoped lang="scss">
.edit-course-wrapper {
.course-content {
// color: red;
.basic-item-icon {
position: relative;
margin-top: 20px;
.require {
position: absolute;
left: 40px;
top: 11px;
color: #f56c6c;
}
.upload-message {
position: absolute;
left: 160px;
top: 105px;
font-size: 12px;
color: #f56c6c;
}
.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;
}
}
}
.word-num {
font-size: 12px;
color: #999;
padding-top: 5px;
}
.bg-uploader {
img {
float: left;
}
.bg-img-wrapper {
.bg-img {
display: block;
width: 160px;
height: 90px;
}
.bg-img-doctor {
display: block;
width: 88px;
height: 88px;
}
}
.bg-video {
float: left;
width: 84px;
height: 100px;
}
}
.limit-text {
position: absolute;
top: 86px;
left: 0px;
font-size: 12px;
color: #979899;
}
.separator-line {
width: 100%;
display: flex;
flex-direction: row;
align-content: center;
align-items: center;
justify-content: space-between;
.center {
cursor: pointer;
width: 130px;
color: #666666;
img {
width: 12px;
}
}
.line-left, .line-right {
// display: inline-block;
// width: 100%;
flex: 1;
border-bottom: 1px dashed #E4E7ED;
}
}
.tips {
width: 100%;
height:32px;
line-height: 32px;
padding-left: 12px;
background:rgba(254,250,245,1);
border-radius:3px;
color: #E6A23C;
}
.valid-msg {
position: relative;
.error {
width: 370px;
position: absolute;
display: flex;
justify-content: space-between;
top: 29px;
font-size: 13px;
color: #ED3131;
.text {
flex: 1;
}
.cancle {
cursor: pointer;
width: 20px;
}
}
.edit-wrapper {
color: #449284;
.edit-img {
position: relative;
top: 2px;
width: 12px;
margin: 0 2px 0 4px;
}
}
.doctor-select-list {
width: 200px;
// max-height: 100px;
position: absolute;
z-index: 100;
background: #fff;
box-shadow: 0 0 6px rgba(0, 0, 0, 0.3);
-webkit-box-shadow: 0 0 6px rgba(0, 0, 0, 0.3);
// margin: 10px;
li {
padding-left: 20px;
cursor: pointer;
&:hover {
background: #f4f7fD;
}
&.doctor-selected {
background: #f4f7fD;
}
}
}
}
}
}
</style>
<template>
<div class="edit-custom-wrap">
<bread-crumb
:curmbFirst="curmbFirst"
:curmbSecond="curmbSecond"
:curmbThird="curmbThird"
:jumPathThird="jumPathThird"
></bread-crumb>
<div class="add-content-new screenSet" id="screenSet">
<div class="step-content-new">
<el-col style="width: 530px;">
<el-steps :active="active" simple class>
<span class="step-num" v-bind:class="{ 'on-step': active==0 }">1</span>
<el-step title="选择项目课程">1</el-step>
<span class="step-num" v-bind:class="{ 'on-step': active==1 }">2</span>
<el-step title="填写项目信息">2</el-step>
<span class="step-num" v-bind:class="{ 'on-step': active==2 }">3</span>
<el-step title="选择学员范围">3</el-step>
</el-steps>
</el-col>
<div>
<div v-if="!canNext" class="dis-btn">下一步</div>
<el-button class="dis-btn-b" v-if="active != 0 && projectStatus == 1 && isPreview != 1" size="small" @click="save">暂存</el-button>
<el-button class="dis-btn-b" v-if="active !== 2 && canNext" size="small" type="primary" @click="nextStep">下一步</el-button>
<el-button class="dis-btn-b" v-if="active == 2" size="small" type="primary" @click="complete">完成</el-button>
</div>
</div>
<!-- 模板列表
<div v-if="active == 0" class="tpl-main">
<template-list @checkFn="checkFn"></template-list>
</div>-->
<!-- 选择课程 -->
<div v-if="active == 0" class="tpl-main">
<SelectCourseComp @showOrgCourse="showOrgCourse"></SelectCourseComp>
</div>
<!-- 填写项目信息-->
<!-- <template-message -->
<custom-baseinfo
ref="CustomBaseinfo"
v-if="active == 1"
:openTemplateId="openTemplateId"
:projectId="projectId"
:editor="editor"
@next="next"
@backSelectVue="backSelectVue"
@hideSave="hideSave"
@setStatus4Flag="setStatus4Flag"
/>
<!-- 设定行政范围与设定机构 -->
<div class="three-step" v-if="active === 2">
<el-tabs v-model="activeName" @tab-click="handleClickTabs">
<el-tab-pane label="设定行政范围" name="first">
<select-region ref="selectRegion" :projectId="projectId" :status4Flag="status4Flag"></select-region>
</el-tab-pane>
<el-tab-pane label="设定机构" name="second">
<set-organization
ref="setOrganization"
:projectId="projectId"
:status4Flag="status4Flag"
></set-organization>
</el-tab-pane>
</el-tabs>
</div>
</div>
<dialog-componet :dialogObj="dialogObj" @hide="hide"></dialog-componet>
<dialog-componet :dialogObj="sendObj" @hide="hidefn" @confirm="confirmFn"></dialog-componet>
<PreviewEditCourse
:dialogVisible="isPreviewEditCourse"
:addOrUpdate="addOrUpdate"
@close="closeEditCourse"
/>
<PreviewProtocol
:dialogVisible="isPreviewProtocol"
:protocolId="protocolId"
:protocolContent="protocolContent"
@close="closeProtocol"
/>
</div>
</template>
<script>
import BreadCrumb from "@/components/breadcrumb.vue";
// import CustomBaseinfo from "@/components/education/template/CustomBaseinfo";
import CustomBaseinfo from "@/components/education/custom/custom-baseinfo";
import selectTemplate from "@/components/education/template/selectTemplate";
import selectRegion from "@/components/education/template/selectRegion";
import setOrganization from "@/components/education/template/setOrganization";
import SelectCourseComp from "@/components/education/custom/select-course-comp";
import dialog from "@/components/education/template/dialog";
import PreviewEditCourse from "@/components/education/custom-resource/edit-course-dialog";
import PreviewProtocol from "@/components/education/custom-resource/preview-protocol";
import { openLoading, closeLoading, resizeHeight } from "@/utils/utils";
import { mapGetters, mapActions } from "vuex";
let vm = null;
export default {
data() {
return {
curmbFirst: "教培项目",
curmbSecond: "项目管理",
jumPathThird: "item-manager",
curmbThird: "发起项目",
active: 0,
formTemplate: {
component: [],
configure: 2,
certificate: ""
},
activeName: "first",
canNext: false,
openTemplateId: 0, // 开放模板ID
projectId: "", // 项目id
status: 10, // 0正常10没有加入机构11审核中12审核失败20存在进行中项目21数量已达上限
editor: false, // 是否为编辑状态
dialogObj: {
visible: false,
title: "",
message: "",
tip: "",
hideMsg: ""
},
statusObj: {
status_10: {
title: "您暂未加入机构",
message: "请前往云鹊医APP-个人中心-我的资料-填写工作所属机构。加入机构后,可创建项目",
tip: "",
hideMsg: "我知道了"
},
status_11: {
title: "您创建的机构正在审核中",
message: "请前往云鹊医APP-个人中心-我的资料-填写工作所属机构。加入机构后,可创建项目",
tip: "",
hideMsg: "我知道了"
},
status_12: {
title: "您创建的机构审核不通过",
message: "请前往云鹊医APP-个人中心-我的资料-填写工作所属机构。加入机构后,可创建项目",
tip: "",
hideMsg: "我知道了"
},
status_20: {
title: "该项目正在进行中",
message: "不能重复创建,请选择其他模版或者下架正在进行中的项目",
hideMsg: "确定"
},
status_21: {
title: "自定义项目创建数量已达上限",
message: "本年度免费创建自定义项目数已达20次,不能继续创建",
hideMsg: "确定"
}
},
sendObj: {
// 发布
visible: false,
title: "确定发布吗?",
message:
"发布后,项目将进入审核中,待审核完成后学员可在云鹊医App上参加培训学习",
tip: "",
confirmMsg: "取消",
hideMsg: "确定发布"
},
projectStatus: 1, //1.草稿 2.未上架 3.审核中/待审核 4.已上架 5.已下架 6.已拒绝/未上架
status4Flag: 0, //0表示没有上过架,1表示上过架
isPreview: 0, // 1表示是查看信息
maxLimitCreatedCustomProjectCountInYear: 20, // 同一个用户每年能够创建的项目数
allSubList: [],
isPreviewEditCourse: false,
addOrUpdate: 'add',
isPreviewProtocol: false,
protocolId: 5,
protocolContent: '',
};
},
computed: {
...mapGetters(["searchParam", "searchParamOrg", "cartList", "kind"])
},
watch: {
kind(newKind) {
let searchParam = newKind == 0 ? this.searchParam : this.searchParamOrg;
this.getCourseList(searchParam);
},
searchParam: {
handler(val) {
this.getCourseList(val);
},
deep: true
},
searchParamOrg: {
handler(val) {
this.getCourseList(val);
},
deep: true
},
cartList(val) {
this.canNext = val.length > 0;
}
},
components: {
BreadCrumb,
CustomBaseinfo,
selectTemplate,
selectRegion,
setOrganization,
dialogComponet: dialog,
SelectCourseComp,
PreviewEditCourse,
PreviewProtocol
},
created() {
vm = this;
vm.isEditorFn();
vm.isPreviewFn();
},
mounted() {
resizeHeight();
this.getLabelList();
this.initPageParams();
// this.initPageParams();
},
methods: {
...mapActions([
"setSearchParam",
"setSearchParamOrg",
"setCartList",
"setCourseList",
"setAllLabelList",
"setSubLabelList",
"setAllLabelListOrg",
"setSubLabelListOrg",
"setCourseLimitCount",
]),
initPageParams(labelIdList) {
// let searchParam = {
// kind: 0,
// orderBy: 2,
// dir: 1,
// grade: 0,
// pageNo: 1,
// pageSize: 10,
// labelIdList: labelIdList || []
// };
this.setCartList([]);
this.setCourseList([]);
this.setAllLabelList([]);
this.setSubLabelList([]);
this.courseLimitCount();
// this.getLabelList();
// this.getCourseList(searchParam);
},
// 自定义项目--选择课程个数限制(-1表示不限制)
courseLimitCount() {
vm.GET("portal/portalCustom/courseLimitCount", {}).then(res => {
if (res.code == "000000") {
this.setCourseLimitCount(res.data);
}
});
},
// 获取所有标签(一级及二级),交做相应处理
// TODO
getLabelList() {
vm.GET("contents/diseases/labelList", {}).then(res => {
if (res.code == "000000") {
// 先将所有的标签添加checked字段
let labelList = res.data;
// let labelListOrg = res.data;
let allSubList = [];
let allSubListOrg = [];
let labelIdList = [];
let labelIdListOrg = [];
labelList.forEach((item, index) => {
item.checked = false;
item.subList.forEach((sub, subIndex) => {
sub.parentIndex = index;
sub.checked = true;
if (subIndex == 0) {
sub.id = `subid-${index}`; // 将二级中的“全部”id改为可以识别的
} else {
allSubList.push(sub);
labelIdList.push(sub.id);
}
});
});
// 构建其子标签
allSubList.unshift({
name: "全部",
checked: true,
id: 'parentid-0'
});
// 添加一级的“全部”标签,并构建其子标签
labelList.unshift({
name: "全部",
checked: true,
subList: allSubList
});
this.setAllLabelList(labelList);
this.setSubLabelList(allSubList);
this.setAllLabelListOrg(JSON.parse(JSON.stringify(labelList)));
this.setSubLabelListOrg(JSON.parse(JSON.stringify(allSubList)));
let searchParam = {
kind: 0,
orderBy: 2,
dir: 1,
grade: 0,
pageNo: 1,
pageSize: 10,
labelIdList: labelIdList || []
};
this.setSearchParam(Object.assign({}, searchParam));
searchParam.kind = 1;
this.setSearchParamOrg(Object.assign({}, searchParam));
}
});
},
// (根据条件)查询课程
getCourseList(searchParam) {
vm.GET("contents/diseases/courseListForPortal", searchParam).then(res => {
if (res.code == "000000") {
let courseList = res.data, cartIndex = -1;
courseList.list.forEach(item => {
cartIndex = vm.cartList.findIndex( current => {
return current.courseId == item.courseId;
})
if(cartIndex >= 0) {
item.checked = true;
} else {
item.checked = false;
}
});
this.setCourseList(courseList);
}
});
},
// 判断是否为编辑状态
isEditorFn() {
if (vm.$route.query.projectId) {
vm.projectId = vm.$route.query.projectId;
vm.editor = true;
vm.active = 1;
vm.canNext = true;
}
},
// 判断是否为预览状态
isPreviewFn() {
if (vm.$route.query.isPreview == 1 && vm.$route.query.projectId) {
vm.projectId = vm.$route.query.projectId;
vm.isPreview = vm.$route.query.isPreview;
vm.active = 1;
vm.canNext = true;
}
},
// 按钮点击下一步
nextStep() {
if (vm.active == 0) {
vm.checkSelectCustomCourse();
// vm.checkSelectTemplate()
return;
}
if (vm.active == 1) {
// 查看时,点击下一步直接跳
if (vm.isPreview == 1) {
vm.active = 2;
return;
}
// 调用项目信息中的下一步操作
vm.$refs.CustomBaseinfo.nextStep();
return;
}
},
// 填写项目信息组件的下一步回调(获取项目id)
next(id) {
vm.projectId = id;
vm.active = 2;
},
// 暂存
save() {
if (vm.active == 1) {
vm.$refs.CustomBaseinfo.save(false);
} else if (vm.active == 2) {
vm.regionComplete();
}
},
confirmFn() {
vm.sendObj.visible = false;
},
// 完成
complete() {
// 4不弹框
if (vm.projectStatus != 4 && vm.isPreview != 1) {
vm.sendObj.visible = true;
} else {
// 查看时,点击完成直接跳到列表页
if (vm.isPreview == 1) {
let query = {};
if (vm.$route.query.pageNum) {
query = { pageNum: vm.$route.query.pageNum };
}
vm.$router.push({ path: "item-manager", query: query });
return;
}
vm.hidefn();
}
},
// 完成触发的接口
hidefn() {
vm.regionComplete(vm.changeStatus);
},
// 选择学元范围暂存
regionComplete(fishFn) {
let req = {
projectId: vm.projectId,
scopeOfAdministrative: vm.$refs.selectRegion.setScope(),
scopeOfDepartment: 99999999,
flag: fishFn ? 3 : 1 //0:下一步 1:暂存
};
openLoading(vm);
vm.POST("portal/new/scope", req)
.then(res => {
closeLoading(vm);
if (res.code == "000000" && fishFn) {
fishFn();
}
if (!fishFn) {
vm.$message({
type: "info",
message: res.message
});
}
})
.catch(() => {
vm.$message({
type: "warning",
message: res.message
});
});
},
// 完成后更改状态
changeStatus() {
let req = {
projectId: vm.projectId,
changeStatus: 3 //待审核
};
vm.POST("portal/portalInfo/changeStatus", req)
.then(res => {
vm.sendObj.visible = false;
if (res.code == "000000") {
let query = {};
if (vm.$route.query.pageNum) {
query = { pageNum: vm.$route.query.pageNum };
}
console.log("vm.$router.push");
vm.$router.push({ path: "item-manager", query: query });
} else {
vm.$message({
type: "warning",
message: res.message
});
}
})
.catch(() => {
vm.$message({
type: "warning",
message: res.message
});
});
},
//切换tabs
handleClickTabs(tab, event) {
if (tab.name == "second") {
vm.setRegion();
}
},
// 模板列表选中
checkFn(id) {
vm.canNext = true;
vm.openTemplateId = id;
},
//选中自定义课程后点击下一步时检测(机构和进行中的项目)
checkSelectCustomCourse() {
openLoading(vm);
vm.GET(`portal/portalCustom/checkBeforeCreateCustomProject`)
.then(res => {
closeLoading(vm);
if (res.code == "000000") {
if (res.data.status == 0) {
vm.maxLimitCreatedCustomProjectCountInYear =
res.data.maxLimitCreatedCustomProjectCountInYear;
vm.active = 1;
return;
} else {
if(res.data.status == 21) {
vm.statusObj.status_21.message = `本年度免费创建自定义项目数已达${res.data.maxLimitCreatedCustomProjectCountInYear}次,不能继续创建`;
}
vm.dialogObj = Object.assign(vm.dialogObj, vm.statusObj[`status_${res.data.status}`]);
vm.dialogObj.visible = true;
return;
}
} else {
vm.$message.info(res.message);
}
})
.catch(err => {
closeLoading(vm);
vm.$message.warning("请稍后重试");
});
},
//选中模板后点击下一步时检测(机构和进行中的项目)
checkSelectTemplate() {
openLoading(vm);
vm.GET(
`portal/openTemplateProject/checkAfterSelectOneOpenTemplate/${vm.openTemplateId}`
)
.then(res => {
closeLoading(vm);
if (res.code == "000000") {
if (res.data.status == 0) {
vm.active = 1;
return;
} else {
vm.dialogObj = Object.assign(
vm.dialogObj,
vm.statusObj[`status_${res.data.status}`]
);
vm.dialogObj.visible = true;
return;
}
} else {
vm.$message.info(res.message);
}
})
.catch(err => {
closeLoading(vm);
vm.$message.warning("请稍后重试");
});
},
// 隐藏弹框
hide() {
vm.dialogObj.visible = false;
},
// 获取行政范围
setRegion() {
vm.getOrganizationList(vm.$refs.selectRegion.getScope());
},
// 查询行政范围的设定机构列表
getOrganizationList(r) {
vm.$refs.setOrganization.init();
vm.$refs.setOrganization.getOrganization(r);
},
// 返回选择模板页
backSelectVue() {
vm.active = 0;
},
// 是否隐藏暂存按钮
hideSave(num) {
this.projectStatus = num;
},
// 从子组件(项目信息)获取项目状态是否为上架
setStatus4Flag(s) {
vm.status4Flag = s;
},
/*
展示添加机构课程弹框
如果已经加入机构,1:没有同意过协议,则打开协议弹框;2:已经加入,时直接打开添加弹框
如果没有加入机构,则直接弹出提示(我知道了)
*/
showOrgCourse(addOrUpdate) {
// this.checkProtocol();
this.checkHospital();
this.addOrUpdate = addOrUpdate
},
// 创建机构课程前校验机构
// TODO 各个状态与数据结构
checkHospital() {
openLoading(vm);
let req = {
setEntry: true
}
vm.GET(`portal/portalCustom/checkHospital`, req)
.then(res => {
closeLoading(vm);
if (res.code == "000000") {
console.log(res);
if (res.data == 0) {
this.checkProtocol();
} else {
vm.dialogObj = Object.assign(
vm.dialogObj,
vm.statusObj[`status_${res.data}`]
);
vm.dialogObj.visible = true;
}
} else {
vm.$message.info(res.message);
}
})
.catch(err => {
closeLoading(vm);
vm.$message.warning("请稍后重试");
});
},
// 判断用户是否签署了最新版协议
// 如果没有签署,则打开协议签署弹框
checkProtocol() {
// openLoading(vm);
let req = {
setEntry: true,
type: this.protocolId
}
vm.GET(`smartcontract/protocol/sign/check`, req)
.then(res => {
// closeLoading(vm);
if (res.code == "000000") {
if(!res.data) { // 没有签署,打开协议签署弹框
this.getProtocolInfoById();
} else {
this.isPreviewEditCourse = true;
}
} else {
vm.$message.info(res.message);
}
})
.catch(err => {
closeLoading(vm);
vm.$message.warning("请稍后重试");
});
},
// 根据协议获取内容
getProtocolInfoById() {
let req = {
type: this.protocolId
};
// this.GET("smartcontract/protocolManage/protocol", req).then(res => {
this.GET("smartcontract/protocol/content", req).then(res => {
if (res.code == "000000") {
// this.protocolContent = res.data.contents;
this.protocolContent = res.data;
this.isPreviewProtocol = true;
} else {
vm.$message.info(res.message);
}
}).catch(err => {
vm.$message.warning("请稍后重试");
});
},
// 关闭编辑课程弹框
closeEditCourse() {
this.isPreviewEditCourse = false;
},
// 关闭预览协议弹框
closeProtocol(needShowAdd) {
if( needShowAdd ) {
this.isPreviewEditCourse = true;
}
this.isPreviewProtocol = false;
},
}
}
</script>
<style lang="scss">
.edit-custom-wrap {
::-webkit-scrollbar {
width: 10px;
height: 10px;
background-color: #fff;
}
/*定义滚动条轨道 内阴影+圆角*/
::-webkit-scrollbar-track {
// box-shadow: inset 0 0 3px rgba(0,0,0,0.3);
// -webkit-box-shadow: inset 0 0 3px rgba(0,0,0,0.3);
border-radius: 10px;
background-color: #fff;
}
/*定义滑块 内阴影+圆角*/
::-webkit-scrollbar-thumb {
border-radius: 6px;
// box-shadow: inset 0 0 3px rgba(0,0,0,.3);
// -webkit-box-shadow: inset 0 0 3px rgba(0,0,0,.3);
background-color: #C7C8C9;
}
.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-new {
min-width: 1125px;
display: flex;
justify-content: space-between;
align-items: center;
// min-width: 1300px;
background: #fff;
background: #fff;
overflow: hidden;
height: 54px;
// line-height: 54px;
// padding: 15px 0 50px 0;
padding: 0 30px;
border-bottom: 1px solid #efefef;
background: #fff;
.is-text {
display: none;
}
.el-steps--simple {
background: #fff;
padding: 13px 0;
align-items: center;
}
.button-green {
color: #ffffff;
background: #449284;
border-color: #bfdad5;
border-radius: 2px;
}
.button-white {
color: #606266;
background: #ffffff;
border-color: #ecedf1;
border-radius: 2px;
}
.step-num {
display: block;
font-size: 12px;
border: 1px solid #999 !important;
border-radius: 50%;
width: 25px;
height: 18px;
line-height: 16px;
text-align: center;
color: #999;
}
.el-step__title.is-wait {
color: #999;
}
.el-step__title.is-process {
color: #449284;
}
.is-finish {
color: #999 !important;
}
.on-step {
color: #449284;
border: 1px solid #449284 !important;
}
.dis-btn {
width: 78px;
height: 34px;
background: rgba(240, 242, 245, 1);
border-radius: 3px;
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: rgba(144, 147, 153, 1);
line-height: 34px;
text-align: center;
cursor: pointer;
}
.dis-btn-b {
position: relative;
left: 5px;
// bottom: 10px;
}
}
.add-content-new {
background: #fff;
}
.three-step {
padding-top: 64px;
margin: 10px 0 0 20px;
.area-p {
margin-bottom: 15px;
font-size: 14px;
}
.span_ecology {
line-height: 45px;
margin-left: 8px;
}
.dialog-p {
text-align: center;
span {
color: #449284;
}
}
//隐藏树展开
.table-empty {
img {
width: 100px;
}
p {
margin-top: -50px;
}
}
.el-tree-node__expand-icon {
display: none;
}
.department {
margin-top: 20px;
border: 1px solid #dddddd;
}
.el-tabs__nav-wrap::after {
display: none;
}
.el-tabs__active-bar {
display: none;
}
#tab-first,
#tab-second,
#tab-third {
padding-right: 0px;
}
#tab-first::after {
color: #c7cbd2;
margin-left: 20px;
content: "•";
}
.el-tabs__item.is-active {
color: #fff;
}
.el-tag {
margin: 0 10px 10px 0;
border: 1.3px solid #48a8fe;
color: #1e92fe;
background-color: #e7f6fe;
.el-icon-close {
width: 13px;
height: 13px;
line-height: 13px;
font-size: 12px;
background-color: #0486fe;
border-radius: 50%;
color: #d4edfe;
}
}
.down-button {
margin-left: 10px;
}
.down-button-close {
margin-left: 100px;
float: left;
}
.dialog-success {
p {
text-align: center;
.upload-text {
color: #449284;
}
}
}
.dialog-fail {
.fail-type {
p {
margin-top: 10px;
}
.fail-num {
color: #db3f52;
}
.fail-notice {
color: #e3e3e3;
font-size: 13px;
}
.fail-link {
text-align: center;
color: #449284;
cursor: pointer;
}
}
}
}
.tpl-main {
// padding-top: 64px;
}
}
</style>
<template>
<div class="review-access-wrap">
<bread-crumb :curmbFirst="curmbFirst" :curmbSecond="curmbSecond"></bread-crumb>
<div class="review-access screenSet" id="screenSet">
<div class="header-title">外部资源管理</div>
<el-form ref="form" :model="searchForm" label-width="100px" class="search-form-wrap">
<el-row>
<el-form-item label="课程名称:" class="search-item" >
<el-input v-model="searchForm.courseName" size="small" class="form-width" placeholder="请输入课程名称"></el-input>
</el-form-item>
<el-form-item label="状态:" class="search-item">
<el-select v-model="searchForm.checkStatus" placeholder="请选择" size="small" class="form-width">
<el-option v-for="(item, index) in checkStatusList" :key="index" :label="item.name" :value="item.value"></el-option>
</el-select>
</el-form-item>
</el-row>
<el-row>
<el-form-item label="创建人:" class="search-item" >
<el-input v-model="searchForm.createdDoctorName" size="small" class="form-width" placeholder="请输入创建人"></el-input>
</el-form-item>
<el-form-item label="创建日期:" class="search-item">
<el-date-picker
v-model="searchForm.createdTime"
type="datetime"
size="small"
class="form-width"
value-format="yyyy-MM-dd"
placeholder="请选择创建日期">
</el-date-picker>
<!-- <span style="color: #DCDFE6;"></span>
<el-date-picker
v-model="searchForm.endTime"
type="datetime"
size="small"
value-format="yyyy-MM-dd HH:mm:ss"
placeholder="请选择结束时间">
</el-date-picker> -->
</el-form-item>
<el-form-item class="btn-list">
<el-button @click="goToSearch(1)" type="primary" size="small">查询</el-button>
<el-button @click="goToReset" size="small">重置</el-button>
</el-form-item>
</el-row>
</el-form>
<el-table :data="tableData" border style="width: 100%">
<el-table-column align="center" prop="courseName" label="课程名称"></el-table-column>
<el-table-column align="center" prop="subjectName" label="课程分类" ></el-table-column>
<el-table-column align="center" prop="createdDoctorName" label="创建人" ></el-table-column>
<el-table-column align="center" prop="createdHospitalName" label="所属机构" ></el-table-column>
<el-table-column align="center" prop="createdTime" label="创建日期" ></el-table-column>
<el-table-column align="center" prop="checkStatus" label="审核状态" ></el-table-column>
<el-table-column align="center" label="操作">
<template slot-scope="scope">
<el-button @click="viewOrAudit(scope.row)" type="text" size="small"><span style="color: #449284;">查看</span></el-button>
</template>
</el-table-column>
<div slot="empty">
<div class="table-empty">
<img src="../../assets/image/no-content1.png">
<p>没有查询到外部资源</p>
</div>
</div>
</el-table>
<div class="pagination">
<el-pagination
class="pagination-style"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:total="totalRows"
:current-page="searchForm.pageNo"
:page-sizes="[15, 30, 50, 100]"
:page-size="searchForm.pageSize"
layout="total, sizes, prev, pager, next, jumper">
</el-pagination>
</div>
</div>
<!-- 拒绝原因 -->
<el-dialog
title="拒绝原因"
@close="hideAddEditForm"
:visible.sync="addEditVisible"
:close-on-click-modal="false"
width="600px"
center>
<el-form ref="addEditForm" :model="addEditForm" label-width="120px">
<el-form-item label="拒绝原因:">
<el-radio-group v-model="addEditForm.doctorId">
<div style="padding-top: 12px;">
<el-radio label="含有政治类、医疗健康、社会事件类不实信息" value="1"></el-radio>
</div>
<div style="padding-top: 16px;">
<el-radio label="含有欺诈,色情,诱导、违法犯罪非法字符" value="2"></el-radio>
</div>
<div style="padding-top: 16px;">
<el-radio label="其他" value="3"></el-radio>
</div>
</el-radio-group>
<el-input type="textarea" v-model="addEditForm.desc" maxlength="25" style="width: 310px;margin-top: 10px;"></el-input>
<span class="word-num">{{(addEditForm.desc).replace(/\s+/g,"").length}}/25</span>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="hideAddEditForm">取 消</el-button>
<el-button type="primary" @click="auditAction()">确 定</el-button>
</span>
</el-dialog>
<!-- 删除 弹窗 -->
<el-dialog
title="删除"
@close="hideDeleteFrom"
:visible.sync="deleteVisible"
:close-on-click-modal="false"
width="600px"
center>
<p style="text-align: center;">确定删除该权限?</p>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="confirmDelete">确 定</el-button>
<el-button @click="hideDeleteFrom">取 消</el-button>
</span>
</el-dialog>
<!-- <PreviewVideo :dialogVisible="isPreviewVideo" :videoUrl="videoUrl" @close="closeVideo"></PreviewVideo>
<PreviewProtocol :dialogVisible="isPreviewProtocol" :protocolId="protocolId" @close="closeProtocol"></PreviewProtocol>
<PreviewEditCourse :dialogVisible="isPreviewEditCourse" @close="closeEditCourse"></PreviewEditCourse>
<button @click="previewVideoAction">test video</button>
<button @click="previewProtocolAction">test protocol</button>
<button @click="previewEditCourseAction">test course</button> -->
</div>
</template>
<script>
import { openLoading, closeLoading } from "../../utils/utils";
import BreadCrumb from "../../components/breadcrumb.vue";
// import PreviewVideo from "@/components/education/custom-resource/preview-video";
// import PreviewProtocol from "@/components/education/custom-resource/preview-protocol";
// import PreviewEditCourse from "@/components/education/custom-resource/edit-course-dialog";
import * as commonUtil from "../../utils/utils";
import {
handleSaveEditReq,
handleDeleteReq,
} from '@/utils/cme/cmeApi'
export default {
data() {
return {
curmbFirst: "CME",
curmbSecond: "外部资源管理",
totalRows: 0,
addEditVisible: false,
isAdd: true, // 新增或编辑状态:新增 true; 编辑 false
deleteVisible: false,
currentRow: null, // 当前行数据
searchForm: {
courseName: '',
checkStatus: -1,
createdDoctorName: '',
// createdTime: '',
// createdHospitalName: '',
// subjectName: '',
pageNo: 1,
pageSize: 15,
},
addEditForm: {
desc: '',
doctorId: '',
status: '',
},
checkStatusList: [
{
name: '全部状态',
value: -1
},{
name: '待审核',
value: 0
},{
name: '通过',
value: 1
},{
name: '拒绝',
value: 2
}
],
tableData: [],
// isPreviewVideo: false,
// videoUrl: '',
// isPreviewProtocol: false,
// protocolId: 0,
// isPreviewEditCourse: false,
}
},
components: {
BreadCrumb,
// PreviewVideo,
// PreviewProtocol,
// PreviewEditCourse
},
created() {
this.goToSearch(1);
},
mounted() {
commonUtil.resizeHeight();
},
methods: {
// 查询列表
goToSearch(pageNo) {
this.searchForm.pageNo = pageNo;
this.GET("contents/course/custom/check/v1/list", this.searchForm).then(res => {
if (res.code == "000000") {
// this.protocolInfo = res.data;
}
});
},
// 打开预览课程弹框
previewVideoAction(videoUrl) {
this.videoUrl = 'http://10.177.11.169:9000/1584002682204479.mp4';
this.isPreviewVideo = true;
},
// 关闭预览课程弹框
closeVideo() {
this.isPreviewVideo = false;
},
// 打开预览协议弹框
previewProtocolAction() {
this.protocolId = 5;
this.isPreviewProtocol = true;
},
// 关闭预览协议弹框
closeProtocol() {
this.isPreviewProtocol = false;
},
// 打开编辑课程弹框
previewEditCourseAction() {
this.isPreviewEditCourse = true;
},
// 关闭编辑课程弹框
closeEditCourse() {
this.isPreviewEditCourse = false;
},
// 重置
goToReset() {
this.searchForm = {
courseName: '',
checkStatus: '',
createdDoctorName: '',
createdTime: '',
// createdHospitalName: '',
// subjectName: '',
pageNo: 1,
pageSize: 15,
};
},
// 查看 每种查看的方式不一样
viewOrAudit(row) {
},
auditAction() {
},
resetForm(formName) {
this.$refs[formName].resetFields();
},
handleSaveEdit() {
// 新增、编辑传参不同
// debugger;
let req = {};
if (this.isAdd) {
req = {
status: this.addEditForm.status,
doctorId: this.addEditForm.doctorId,
}
} else {
req = {
status: this.addEditForm.status,
doctorId: this.addEditForm.doctorId,
id: this.currentRow.id,
};
}
handleSaveEditReq(req).then(res => {
if (res.code == "000000") {
this.addEditVisible = false;
// this.goToSearch();
// console.log('新增/编辑权限 ', res)
} else {
this.$message(res.message);
}
}).catch(err => {
this.$message.error('请求失败');
});
},
hideAddEditForm() {
this.addEditVisible = false;
this.resetForm('addEditForm');
this.addEditForm = {
desc: '',
doctorId: '',
status: '',
};
},
confirmDelete() {
// 调接口
let req = {
id: this.currentRow.id,
};
handleDeleteReq(req).then(res => {
if (res.code == "000000") {
// console.log('删除用户列表 ', res)
// this.goToSearch();
this.deleteVisible = false;
} else {
this.$message(res.message);
}
}).catch(err => {
this.$message.error('请求失败');
});
},
hideDeleteFrom() {
this.deleteVisible = false;
},
handleSizeChange(val){
this.searchForm.pageSize = val;
this.goToSearch(1);
},
handleCurrentChange(val){
// 切换当前页
this.searchForm.pageNo = val;
this.goToSearch(1);
},
},
}
</script>
<style lang="scss">
.review-access-wrap{
.review-access{
padding: 10px;
background: #fff;
.el-button--small{
font-size: 14px;
}
.header-title {
padding: 10px 12px 20px;
font-size: 14px;
color: #606266;
border-bottom: 1px solid #efefef;
}
.search-form-wrap{
padding: 25px 0 20px;
overflow: hidden;
// border-bottom: 1px dashed #efefef;
}
.search-item{
float: left;
}
.btn-list{
float: right;
.el-form-item__content{
margin-left: 0 !important;
}
}
.new-add{
float: right;
margin: 10px 0 20px;
}
.table-empty {
img {
width: 100px;
}
p {
margin-top: -50px;
}
}
}
}
</style>
\ No newline at end of file
...@@ -38,15 +38,12 @@ ...@@ -38,15 +38,12 @@
</el-date-picker> --> </el-date-picker> -->
</el-form-item> </el-form-item>
<el-form-item class="btn-list"> <el-form-item class="btn-list">
<el-button @click="goToSearch(1)" type="primary" size="small">查询</el-button> <el-button @click="search()" type="primary" size="small">查询</el-button>
<el-button @click="goToReset" size="small">重置</el-button> <el-button @click="reset" size="small">重置</el-button>
</el-form-item> </el-form-item>
</el-row> </el-row>
</el-form> </el-form>
<!-- <div> <el-table :data="tableList" border style="width: 100%">
<el-button @click="goToAdd" type="primary" size="small" class="new-add">新增</el-button>
</div> -->
<el-table :data="tableData" border style="width: 100%">
<el-table-column align="center" prop="courseName" label="课程名称"></el-table-column> <el-table-column align="center" prop="courseName" label="课程名称"></el-table-column>
<el-table-column align="center" prop="subjectName" label="课程分类" ></el-table-column> <el-table-column align="center" prop="subjectName" label="课程分类" ></el-table-column>
<el-table-column align="center" prop="createdDoctorName" label="创建人" ></el-table-column> <el-table-column align="center" prop="createdDoctorName" label="创建人" ></el-table-column>
...@@ -55,8 +52,7 @@ ...@@ -55,8 +52,7 @@
<el-table-column align="center" prop="checkStatus" label="审核状态" ></el-table-column> <el-table-column align="center" prop="checkStatus" label="审核状态" ></el-table-column>
<el-table-column align="center" label="操作"> <el-table-column align="center" label="操作">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button @click="goToEdit(scope.row)" type="text" size="small"><span style="color: #449284;">查看</span></el-button> <el-button @click="viewOrAudit(scope.row)" type="text" size="small"><span style="color: #449284;">查看</span></el-button>
<!-- <el-button @click="goToDelete(scope.row)" type="text" size="small">删除</el-button> -->
</template> </template>
</el-table-column> </el-table-column>
<div slot="empty"> <div slot="empty">
...@@ -84,14 +80,14 @@ ...@@ -84,14 +80,14 @@
<!-- 拒绝原因 --> <!-- 拒绝原因 -->
<el-dialog <el-dialog
title="拒绝原因" title="拒绝原因"
@close="hideAddEditForm" @close="hideAuditForm"
:visible.sync="addEditVisible" :visible.sync="addEditVisible"
:close-on-click-modal="false" :close-on-click-modal="false"
width="600px" width="600px"
center> center>
<el-form ref="addEditForm" :rules="rules" :model="addEditForm" label-width="120px"> <el-form ref="auditForm" :model="auditForm" label-width="120px">
<el-form-item label="拒绝原因:"> <el-form-item label="拒绝原因:">
<el-radio-group v-model="addEditForm.doctorId"> <el-radio-group v-model="auditForm.auditRadio">
<div style="padding-top: 12px;"> <div style="padding-top: 12px;">
<el-radio label="含有政治类、医疗健康、社会事件类不实信息" value="1"></el-radio> <el-radio label="含有政治类、医疗健康、社会事件类不实信息" value="1"></el-radio>
</div> </div>
...@@ -102,52 +98,24 @@ ...@@ -102,52 +98,24 @@
<el-radio label="其他" value="3"></el-radio> <el-radio label="其他" value="3"></el-radio>
</div> </div>
</el-radio-group> </el-radio-group>
<el-input type="textarea" v-model="addEditForm.desc" maxlength="25" style="width: 310px;margin-top: 10px;"></el-input> <el-input type="textarea" v-model="auditForm.desc" maxlength="25" style="width: 310px;margin-top: 10px;"></el-input>
<span class="word-num">{{(addEditForm.desc).replace(/\s+/g,"").length}}/25</span> <span class="word-num">{{(auditForm.desc).replace(/\s+/g,"").length}}/25</span>
</el-form-item> </el-form-item>
</el-form> </el-form>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
<el-button @click="hideAddEditForm">取 消</el-button> <el-button @click="hideAuditForm">取 消</el-button>
<el-button type="primary" @click="submitForm('addEditForm')">确 定</el-button> <el-button type="primary" @click="auditAction()">确 定</el-button>
</span> </span>
</el-dialog> </el-dialog>
<!-- 删除 弹窗 -->
<el-dialog
title="删除"
@close="hideDeleteFrom"
:visible.sync="deleteVisible"
:close-on-click-modal="false"
width="600px"
center>
<p style="text-align: center;">确定删除该权限?</p>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="confirmDelete">确 定</el-button>
<el-button @click="hideDeleteFrom">取 消</el-button>
</span>
</el-dialog>
<PreviewVideo :dialogVisible="isPreviewVideo" :videoUrl="videoUrl" @close="closeVideo"></PreviewVideo>
<PreviewProtocol :dialogVisible="isPreviewProtocol" :protocolId="protocolId" @close="closeProtocol"></PreviewProtocol>
<PreviewEditCourse :dialogVisible="isPreviewEditCourse" @close="closeEditCourse"></PreviewEditCourse>
<button @click="previewVideoAction">test video</button>
<button @click="previewProtocolAction">test protocol</button>
<button @click="previewEditCourseAction">test course</button>
</div> </div>
</template> </template>
<script> <script>
import { openLoading, closeLoading } from "../../utils/utils"; import { openLoading, closeLoading } from "../../utils/utils";
import BreadCrumb from "../../components/breadcrumb.vue"; import BreadCrumb from "../../components/breadcrumb.vue";
import PreviewVideo from "@/components/education/custom-resource/preview-video";
import PreviewProtocol from "@/components/education/custom-resource/preview-protocol";
import PreviewEditCourse from "@/components/education/custom-resource/edit-course-dialog";
import * as commonUtil from "../../utils/utils"; import * as commonUtil from "../../utils/utils";
import { import {
getAuthTableReq,
// getUserListReq,
handleSaveEditReq,
handleDeleteReq, handleDeleteReq,
} from '@/utils/cme/cmeApi' } from '@/utils/cme/cmeApi'
...@@ -163,7 +131,7 @@ ...@@ -163,7 +131,7 @@
currentRow: null, // 当前行数据 currentRow: null, // 当前行数据
searchForm: { searchForm: {
courseName: '', courseName: '',
checkStatus: '', checkStatus: -1,
createdDoctorName: '', createdDoctorName: '',
createdTime: '', createdTime: '',
// createdHospitalName: '', // createdHospitalName: '',
...@@ -171,51 +139,35 @@ ...@@ -171,51 +139,35 @@
pageNo: 1, pageNo: 1,
pageSize: 15, pageSize: 15,
}, },
addEditForm: { auditForm: {
auditRadio: '',
desc: '', desc: '',
doctorId: '',
status: '',
}, },
checkStatusList: [{ checkStatusList: [
name: '全部状态', {
value: '-1' name: '全部状态',
},{ value: -1
name: '待审核', },{
value: '0' name: '待审核',
},{ value: 0
name: '通过', },{
value: '1' name: '通过',
},{ value: 1
name: '拒绝', },{
value: '2' name: '拒绝',
}], value: 2
tableData: [], }
nameList: [], ],
rules: { tableList: [],
doctorId: [{ required: true, message: '请选择', trigger: 'blur' }],
status: [{ required: true, message: '请选择', trigger: 'blur' }],
},
isPreviewVideo: false,
videoUrl: '',
isPreviewProtocol: false,
protocolId: 0,
isPreviewEditCourse: false,
} }
}, },
components: { components: {
BreadCrumb, BreadCrumb,
PreviewVideo,
PreviewProtocol,
PreviewEditCourse
}, },
created() { created() {
this.goToSearch(1); this.search();
// this.getUserList();
}, },
mounted() { mounted() {
commonUtil.resizeHeight(); commonUtil.resizeHeight();
...@@ -223,199 +175,68 @@ ...@@ -223,199 +175,68 @@
methods: { methods: {
// 查询列表 // 查询列表
goToSearch() { search() {
this.GET("contents/course/custom/check/v1/list", this.searchForm).then(res => { this.GET("contents/course/custom/check/v1/list", this.searchForm).then(res => {
if (res.code == "000000") { if (res.code == "000000") {
this.tableList = res.data || [{}];
// this.protocolInfo = res.data; // this.protocolInfo = res.data;
} }
}); });
}, },
// 打开预览课程弹框
previewVideoAction(videoUrl) {
this.videoUrl = 'http://10.177.11.169:9000/1584002682204479.mp4';
this.isPreviewVideo = true;
},
// 关闭预览课程弹框
closeVideo() {
this.isPreviewVideo = false;
},
// 打开预览协议弹框
previewProtocolAction() {
this.protocolId = 5;
this.isPreviewProtocol = true;
},
// 关闭预览协议弹框
closeProtocol() {
this.isPreviewProtocol = false;
},
// 打开编辑课程弹框
previewEditCourseAction() {
this.isPreviewEditCourse = true;
},
// 关闭编辑课程弹框
closeEditCourse() {
this.isPreviewEditCourse = false;
},
// 搜索
// goToSearch(pageNo) {
// if(pageNo){ // 自定义第几页,不传则表示当前页
// this.searchForm.pageNo = pageNo;
// }
// this.getAuthTable();
// },
// getAuthTable() {
// let req = this.searchForm;
// getAuthTableReq(req).then(res => {
// if (res.code == "000000") {
// // console.log('表格列表 ', res)
// this.tableData = res.data.contentList;
// this.totalRows = res.data.total;
// } else {
// this.$message(res.message);
// }
// }).catch(err => {
// this.$message.error('请求失败');
// });
// },
// 重置 // 重置
goToReset() { reset() {
this.searchForm = { this.searchForm = {
courseName: '', courseName: '',
status: '', checkStatus: -1,
createdDoctorName: '',
createdTime: '',
// createdHospitalName: '',
// subjectName: '',
pageNo: 1, pageNo: 1,
pageSize: 15, pageSize: 15,
}; };
}, },
// 新增
goToAdd() {
this.isAdd = true;
this.addEditVisible = true;
},
// 编辑 // 查看 每种查看的方式不一样
goToEdit(row) { viewOrAudit(row) {
this.isAdd = false; console.log(row);
this.currentRow = row; this.$router.push({
// console.log('编辑 ', row) path: 'audit-custom-course',
this.addEditVisible = true; query: {
// 编辑回显状态 courseId: row.courseId
this.addEditForm = { }
desc: '', })
status: row.status,
doctorId: row.doctorId,
};
}, },
// // 获取新增、编辑的用户列表 auditAction() {
// getUserList() { console.log(row);
// let req = {};
// getUserListReq(req).then(res => {
// if (res.code == "000000") {
// this.nameList = res.data;
// } else {
// this.$message(res.message);
// }
// }).catch(err => {
// this.$message.error('请求失败');
// });
// },
goToDelete(row) {
this.deleteVisible = true;
this.currentRow = row;
}, },
// 重置
submitForm(formName) {
this.$refs[formName].validate((valid) => {
if (valid) {
// alert('submit!');
this.handleSaveEdit();
} else {
console.log('error submit!!');
return false;
}
});
},
resetForm(formName) { resetForm(formName) {
this.$refs[formName].resetFields(); this.$refs[formName].resetFields();
}, },
handleSaveEdit() {
// 新增、编辑传参不同 hideAuditForm() {
// debugger;
let req = {};
if (this.isAdd) {
req = {
status: this.addEditForm.status,
doctorId: this.addEditForm.doctorId,
}
} else {
req = {
status: this.addEditForm.status,
doctorId: this.addEditForm.doctorId,
id: this.currentRow.id,
};
}
handleSaveEditReq(req).then(res => {
if (res.code == "000000") {
this.addEditVisible = false;
// this.goToSearch();
// console.log('新增/编辑权限 ', res)
} else {
this.$message(res.message);
}
}).catch(err => {
this.$message.error('请求失败');
});
},
hideAddEditForm() {
this.addEditVisible = false; this.addEditVisible = false;
this.resetForm('addEditForm'); this.resetForm('auditForm');
this.addEditForm = { this.auditForm = {
auditRadio: '',
desc: '', desc: '',
doctorId: '',
status: '',
};
},
confirmDelete() {
// 调接口
let req = {
id: this.currentRow.id,
}; };
handleDeleteReq(req).then(res => {
if (res.code == "000000") {
// console.log('删除用户列表 ', res)
// this.goToSearch();
this.deleteVisible = false;
} else {
this.$message(res.message);
}
}).catch(err => {
this.$message.error('请求失败');
});
},
hideDeleteFrom() {
this.deleteVisible = false;
}, },
handleSizeChange(val){ handleSizeChange(val){
// console.log('handleSizeChange>>>')
this.searchForm.pageSize = val; this.searchForm.pageSize = val;
// this.goToSearch(1); this.search();
}, },
// 切换当前页
handleCurrentChange(val){ handleCurrentChange(val){
// 切换当前页
this.searchForm.pageNo = val; this.searchForm.pageNo = val;
this.getAuthTable(); this.search();
}, },
}, },
......
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册