Skip to content

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

CME三期内容

上级 4e0f639b
隐藏空白字符变更
内嵌 并排
正在显示 包含 2235 行增加 和 9 行删除
src/assets/test.mp4 0 → 100644
浏览文件 @ 559652f6
文件已添加
src/components/education/custom-resource/edit-course-dialog.vue 0 → 100644
浏览文件 @ 559652f6
<template>
<div class="edit-course-wrapper dialog-title-border">
<el-dialog ref="testDialogRef"
title="上传课程"
:visible="dialogVisible"
@close="close"
center
:close-on-click-modal="false"
:close-on-press-escape="false"
width="800px"
>
<div slot="title" style="text-align: left;">
<span style="font-weight: 700;">上传课程</span>
<span style="font-size: 12px;color: #999;">请认真核对上传内容，一旦提交后将不能修改</span>
</div>
<div class="course-content">
<el-form
ref="formDataRef"
:model="formData"
:rules="rules"
label-width="120px"
class="basic-form"
>
<el-form-item label="课程名称：" prop="name">
<el-col :span="18">
<el-input
size="small"
v-model="formData.name"
placeholder="请输入课程名称"
style="width: 360px"
maxlength="25"
:disabled="disabled"
></el-input>
<span class="word-num">{{(formData.name).replace(/\s+/g,"").length}}/25</span>
</el-col>
</el-form-item>
<el-form-item label="学科分类：" prop="subjectId">
<el-col :span="18">
<!-- :props="{ expandTrigger: 'hover' }" -->
<el-cascader
style="width: 360px"
v-model="formData.subjectId"
: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="range">
<el-radio-group v-model="formData.range">
<el-radio :label="1">机构共享</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="课程视频：" prop="range">
<!-- action="https://jsonplaceholder.typicode.com/posts/" -->
<el-upload
class="upload-demo"
action="https://sc.yunqueyi.com/contents/admin/qiniu/token1"
:on-preview="handlePreview"
:on-remove="handleRemove"
:before-remove="beforeRemove"
multiple
:limit="100"
:on-exceed="handleExceed"
:file-list="fileList">
<el-button size="small" type="primary">点击上传</el-button>
<div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
</el-upload>
</el-form-item>
<div class="other-content" 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.attachmentUrl"
class="bg-uploader"
action="#"
:show-file-list="false"
:before-upload="beforeUploadListPic"
:disabled="disabled"
>
<div class="bg-img-wrapper">
<img v-if="formData.attachmentUrl" @mouseover.stop="imgMouseOver=true" :src="formData.attachmentUrl" class="bg-img">
<img v-if="!formData.attachmentUrl" class="bg-img" src="../../../assets/image/small.png">
</div>
<div class="img-delete" v-show="imgMouseOver && !disabled" @click.stop="deleteImg(1)" @mouseout.stop="imgMouseOver=false"><i class="el-icon-delete"></i></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.range">
<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="讲师名称：">
<el-col :span="18">
<el-input
size="small"
v-model="formData.lectureName"
placeholder="请输入讲师名称"
style="width: 360px"
maxlength="25"
:disabled="disabled"
></el-input>
<span class="word-num">{{(formData.name).replace(/\s+/g,"").length}}/25</span>
</el-col>
</el-form-item>
<el-form-item label="所属机构：">
<el-col :span="18">
<el-input
size="small"
v-model="formData.lectureName"
placeholder="请输入所属机构"
style="width: 360px"
maxlength="25"
:disabled="disabled"
></el-input>
<span class="word-num">{{(formData.name).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.attachmentUrl"
class="bg-uploader"
action="#"
:show-file-list="false"
:before-upload="beforeUploadListPic"
:disabled="disabled"
>
<div class="bg-img-wrapper">
<img v-if="formData.attachmentUrl" @mouseover.stop="imgMouseOver=true" :src="formData.attachmentUrl" class="bg-img">
<img v-if="!formData.attachmentUrl" class="bg-img" src="../../../assets/image/small.png">
</div>
<div class="img-delete" v-show="imgMouseOver && !disabled" @click.stop="deleteImg(1)" @mouseout.stop="imgMouseOver=false"><i class="el-icon-delete"></i></div>
</el-upload>
<div class="limit-text">
尺寸：80*80，只支持jpeg格式
</div>
</el-form-item>
<p class="upload-message" v-if="uploadImgMessage">请选择列表图片</p>
</div>
<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 src="../../../assets/image/plus.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>
</el-dialog>
</div>
</template>
<script>
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: {
name: '',
subjectId: '',
range: 1,
attachmentUrl: '',
courseIntro: ''
},
uploadImgMessage: false,
imgMouseOver: false,
rules: {
name: [
{ required: true, message: "请输入课程名称"},
{ validator: checkCourseName }
],
subjectId: [
{ required: true, message: "请输入课程名称", trigger: "blur"},
],
range: [
{ 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'}
]
};
},
props: {
dialogVisible: {
type: Boolean,
default: false
}
},
computed: {
},
created() {
vm = this;
},
mounted() {
this.getLabelList();
setTimeout(() => {
console.log(this.$refs.formDataRef);
this.$refs['formDataRef'].validateField("name");
}, 2000);
},
methods: {
close() {
this.$emit('close');
},
// 获取学科列表
getLabelList() {
let req = {};
this.GET("aggregate/content/labelList", req).then(res => {
if (res.code == '000000') {
// TODO
this.convertLabelList(res.data);
// this.labelOptions = 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) {
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;
},
// 删除图片
deleteImg(type) {
if (type == 1) {
vm.formData.attachmentUrl = "";
vm.imgMouseOver = false;
} else {
// vm.formData.attachmentUrl2 = "";
// vm.imgMouseOver2 = false;
}
},
toggleOtherContent() {
this.isShowOtherContent = !this.isShowOtherContent;
},
// 上传文件相关
handleRemove(file, fileList) {
console.log(file, fileList);
},
handlePreview(file) {
console.log(file);
},
handleExceed(files, fileList) {
this.$message.warning(`当前限制选择 3 个文件，本次选择了 ${files.length} 个文件，共选择了 ${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-video {
float: left;
width: 84px;
height: 100px;
}
}
.limit-text {
position: absolute;
top: 80px;
left: 10px;
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 {
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;
}
}
}
</style>
src/components/education/custom-resource/preview-pdf.vue 0 → 100644
浏览文件 @ 559652f6
<template>
<!-- 组件有问题 -->
<el-dialog
title="预览PDF文件"
:visible="dialogVisible"
@close="close"
center
:close-on-click-modal="false"
:close-on-press-escape="false"
width="800px"
>
<!-- <canvas v-for="page in pages" :id="'the-canvas'+page" :key="page"></canvas> -->
<div id="demo"></div>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="close">确 定</el-button>
</div>
</el-dialog>
</template>
<script>
// import Pdfh5 from "pdfh5";
export default {
data() {
return {
pdfh5: null
};
},
props: {
dialogVisible: {
type: Boolean,
default: false
}
},
computed: {},
components: {
// PDF
},
mounted() {
// //实例化
// this.pdfh5 = new Pdfh5("#demo", {
// pdfurl: "http://10.177.11.169:9000/test.pdf"
// });
// //监听完成事件
// this.pdfh5.on("complete", function(status, msg, time) {
// console.log(
// "状态：" +
// status +
// "，信息：" +
// msg +
// "，耗时：" +
// time +
// "毫秒，总页数：" +
// this.totalNum
// );
// });
},
methods: {
close() {
this.$emit("close");
}
}
};
</script>
<style scoped lang="scss">
// @import "pdfh5/css/pdfh5.css";
// * {
// padding: 0;
// margin: 0;
// }
// html,
// body,
// #app {
// width: 100%;
// height: 100%;
// }
</style>
src/components/education/custom-resource/preview-protocol.vue 0 → 100644
浏览文件 @ 559652f6
<template>
<el-dialog
title="预览协议"
:visible="dialogVisible"
@close="close"
center
:close-on-click-modal="false"
:close-on-press-escape="false"
width="800px"
>
<div v-html="protocolInfo.contents"></div>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="close">确 定</el-button>
</div>
</el-dialog>
</template>
<script>
export default {
data() {
return {
protocolInfo: {
contents: ''
}
};
},
props: {
dialogVisible: {
type: Boolean,
default: false
},
protocolId: {
type: String | Number,
default: 0
}
},
watch: {
protocolId(newVal) {
if(newVal) {
this.getProtocolInfoById(newVal);
}
}
},
computed: {
},
mounted() {
},
methods: {
// 查询列表
getProtocolInfoById(protocolId) {
let req = {
protocolId: protocolId
};
this.GET("smartcontract/protocolManage/protocol", req).then(res => {
if (res.code == "000000") {
this.protocolInfo = res.data;
}
});
},
close() {
this.$emit('close');
},
}
};
</script>
<style scoped lang="scss">
</style>
src/components/education/custom-resource/preview-video.vue 0 → 100644
浏览文件 @ 559652f6
<template>
<el-dialog
title="预览课程"
:visible="dialogVisible"
@close="close"
center
:close-on-click-modal="false"
:close-on-press-escape="false"
width="800px"
>
<video-player
class="video-player vjs-custom-skin"
ref="videoPlayer"
:playsinline="true"
:options="playerOptions"
@pause="onPlayerPause($event)"
/>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="close">确 定</el-button>
</div>
</el-dialog>
</template>
<script>
// import video from '@/assets/test.mp4'
export default {
data() {
return {
playerOptions: {
playbackRates: [0.7, 1.0, 1.5, 2.0], //播放速度
autoplay: false, //如果true,浏览器准备好时开始回放。
muted: false, // 默认情况下将会消除任何音频。
loop: false, // 导致视频一结束就重新开始。
preload: "auto", // 建议浏览器在<video>加载元素后是否应该开始下载视频数据。auto浏览器选择最佳行为,立即开始加载视频（如果浏览器支持）
language: "zh-CN",
aspectRatio: "16:9", // 将播放器置于流畅模式，并在计算播放器的动态大小时使用该值。值应该代表一个比例 - 用冒号分隔的两个数字（例如"16:9"或"4:3"）
fluid: true, // 当true时，Video.js player将拥有流体大小。换句话说，它将按比例缩放以适应其容器。
sources: [
{
src: '', // 路径
type: "video/mp4" // 类型
},
// {
// src: "//path/to/video.webm",
// type: "video/webm"
// }
],
poster: "http://10.177.11.169:9000/750*1000-1.png", //你的封面地址
notSupportedMessage: "此视频暂无法播放，请稍后再试", //允许覆盖Video.js无法播放媒体源时显示的默认信息。
controlBar: {
timeDivider: true,
durationDisplay: true,
remainingTimeDisplay: false,
fullscreenToggle: true //全屏按钮
}
}
};
},
props: {
dialogVisible: {
type: Boolean,
default: false
},
videoUrl: {
type: String,
default: ''
}
},
watch: {
videoUrl(newVideoUrl) {
this.playerOptions.sources[0].src = newVideoUrl;
}
},
computed: {
player() {
return this.$refs.videoPlayer.player
}
},
mounted() {
},
methods: {
close() {
this.$emit('close');
this.player.pause();
},
onPlayerPause(player) {
console.log(player);
}
}
};
</script>
<style scoped lang="scss">
</style>
src/components/education/custom-resource/reject-reason-dialog.vue 0 → 100644
浏览文件 @ 559652f6
<template>
<!-- 拒绝原因 暂时不做 -->
<el-dialog
title="拒绝原因"
@close="hideAddEditForm"
:visible.sync="addEditVisible"
:close-on-click-modal="false"
width="600px"
center>
<el-form ref="addEditForm" :rules="rules" :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="submitForm('addEditForm')">确 定</el-button>
</span>
</el-dialog>
</template>
<script>
export default {
data() {
return {
};
},
props: {
dialogVisible: {
type: Boolean,
default: false
}
},
computed: {
},
mounted() {
},
methods: {
save() {
this.dialogVisible = false;
}
}
};
</script>
<style scoped lang="scss">
</style>
src/components/education/custom/course-select copy.vue 0 → 100644
浏览文件 @ 559652f6
<template>
<div class="custom-over">
<!-- <div class="custom-select-wrapper" style="overflow:auto;">
<div class="department-label" style="width: 1200px;"> -->
<div class="custom-select-wrapper">
<div class="department-label" style="min-width:1420px;">
<span
v-for="(item, index) in allLabelList"
:key="index"
class="item"
:class="{checked: item.checked}"
@click="selectLabel(index)"
>
<span class="split" :class="{acitve: item.checked}"></span>
{{item.name}}
</span>
</div>
</div>
<div class="custom-select-wrapper">
<!-- 课程分类 -->
<div class="course-class">
<div class="title">课程分类</div>
<div v-if="subLabelList.length" class="item" @click="selectSubLabel(subLabelList[0], 1)">
<span class="name" :class="{'active': subLabelList[0].checked}">全部</span>
</div>
<ul class="check-list">
<li
class="sub-item"
:class="{'active': item.checked}"
v-for="(item, index) in subLabelList.slice(1)"
:key="index"
@click="selectSubLabel(item, 2)"
>
<img v-show="item.checked" src="../../../assets/custom/icon/label-sel.png" alt />
<img v-show="!item.checked" src="../../../assets/custom/icon/label-sel-no.png" alt />
{{item.name}}
</li>
</ul>
<div class="right"></div>
</div>
<!-- 课程等级 -->
<div class="course-level">
<span class="title">课程等级</span>
<span
class="item"
v-for="(item, index) in courseLevel"
:key="index"
@click="selectLevel(index)"
>
<span class="name" :class="{active: item.checked}">{{item.name}}</span>
</span>
</div>
<div class="button-wrapper">
<el-button class="add-button" plain size="small" @click="resetCond">重 置</el-button>
<el-button class="add-button" size="small" type="primary" @click="search">查 询</el-button>
</div>
</div>
</div>
</template>
<script>
import { mapGetters, mapActions } from 'vuex'
export default {
data() {
return {
courseLevel: [
{ name: "全部", value: 0, checked: true },
{ name: "初级", value: 1, checked: false },
{ name: "中级", value: 2, checked: false },
{ name: "高级", value: 3, checked: false }
],
checkList: [431, 441]
};
},
props: {
dataList: {
type: Array,
default: () => {
return [
{
name: "全部",
checked: true
},
{
name: "内科",
checked: false
},
{
name: "神经科",
checked: false
},
{
name: "肿瘤科",
checked: false
},
{
name: "妇产科",
checked: false
},
{
name: "内科",
checked: false
},
{
name: "神经科",
checked: false
},
{
name: "肿瘤科",
checked: false
},
{
name: "妇产科",
checked: false
},
{
name: "内科",
checked: false
},
{
name: "神经科",
checked: false
},
{
name: "肿瘤科",
checked: false
},
{
name: "妇产科",
checked: false
}
];
}
}
},
computed: {
...mapGetters(['searchParam', 'allLabelList', 'subLabelList'])
},
components: {},
methods: {
...mapActions(['setSubLabelList', 'setSearchParam']),
// 选择一级
selectLabel(index) {
this.allLabelList.forEach(element => {
element.checked = false;
});
this.allLabelList[index].checked = true;
let subLabelList = this.allLabelList[index].subList;
this.setSubLabelList(subLabelList);
},
// 选择二级
selectSubLabel(item, type) {
item.checked = !item.checked;
console.log('selectSubLabel', item);
// 如果被选中
if(item.checked) {
// 是全部按钮 第一个全部：parentid-0
if(type == 1) {
let labelArr = item.id.split('-'), labelType = labelArr[0], labelIndex = labelArr[1] - 0;
labelArr = item.id.split('-');
if(labelType == 'parentid') {
// 将所有子项目选中
this.allLabelList[0].subList.forEach( (item, index) => {
if(index != 0) { // 第一个不用
item.checked = true;
}
})
// 将其它所有全部置为选中
this.allLabelList.forEach( (item, index) => {
index != 0 && (item.subList[0].checked = true);
})
} else {
this.allLabelList[labelIndex + 1].subList.forEach( (item, index) => {
if(index != 0) { // 第一个不用
item.checked = true;
}
})
}
}
// 末被选中
} else {
// 是全部按钮 第一个全部：parentid-0
if(type == 1) {
let labelArr = item.id.split('-'), labelType = labelArr[0], labelIndex = labelArr[1] - 0;
labelArr = item.id.split('-');
if(labelType == 'parentid') {
// 将所有子项目选中
this.allLabelList[0].subList.forEach( (item, index) => {
if(index != 0) { // 第一个不用
item.checked = false;
}
})
// 将其它所有全部置为选中
this.allLabelList.forEach( (item, index) => {
index != 0 && (item.subList[0].checked = false);
})
} else {
this.allLabelList[labelIndex + 1].subList.forEach( (item, index) => {
if(index != 0) { // 第一个不用
item.checked = false;
}
})
}
}
}
// 无论哪种操作，都要重置各个“全部”按钮
this.allLabelList.forEach( (parent, index) => {
let needhecked = true, subList = parent.subList;
for(let i = 1; i < subList.length; i ++) {
if(!subList[i].checked) {
needhecked = false;
break;
}
}
this.allLabelList[index].subList[0].checked = needhecked;
})
this.$forceUpdate();
},
// 选中等级
selectLevel(index) {
this.courseLevel.forEach(element => {
element.checked = false;
});
this.courseLevel[index].checked = true;
},
// 重置按钮
resetCond() {
this.allLabelList.forEach((item, index) => {
item.checked = false;
item.subList.forEach((sub, subIndex) => {
sub.checked = true;
});
});
this.setSubLabelList(this.allLabelList[0].subList);
this.allLabelList[0].checked = true;
this.selectLevel(0);
},
search() {
let allSelectedLabel = [];
this.allLabelList[0].subList.forEach( (item, index) => {
index && item.checked && allSelectedLabel.push(item.id);
})
this.searchParam.labelIdList = allSelectedLabel;
this.courseLevel.forEach( item => {
if(item.checked) {
this.searchParam.grade = item.value;
}
})
this.searchParam.pageNo = 1;
this.setSearchParam(this.searchParam);
console.log(allSelectedLabel);
}
}
};
</script>
<style lang="less" scoped>
.custom-select-wrapper {
// width: 1090px;
user-select: none;
.department-label {
display: flex;
flex-direction: row;
height: 48px;
line-height: 48px;
border-bottom: 2px solid #449284;
border-radius: 6px 6px 0px 0px;
.item {
cursor: pointer;
position: relative;
z-index: 1;
display: inline-block;
padding: 0 22px;
font-size: 16px;
color: #666666;
// &::after {
// position: absolute;
// content: "";
// top: 14px;
// left: 0px;
// height: 20px;
// border-left: 1px solid #c7c8c9;
// }
&.checked {
color: #fff;
z-index: 3;
background: #449284;
}
&:first-child {
border-radius: 6px 0px 0px 0px;
}
}
.split {
flex-shrink: 0;
position: absolute;
top: 14px;
left: 0px;
z-index: 2;
display: inline-block;
height: 20px;
// width: 1px;
// background: #c7c8c9;
border-left: 1px solid #c7c8c9;
}
.item:nth-child(1) > .split,
.item.checked + .item > .split,
.split.acitve {
display: none;
}
}
}
.course-level {
display: flex;
flex-direction: row;
box-sizing: content-box;
height: 56px;
line-height: 56px;
padding-left: 20px;
// margin: 16px 0 16px 20px;
border-bottom: 1px dotted #e4e7ed;
.title {
display: inline-block;
padding: 0 10px;
color: #999999;
}
.item {
cursor: pointer;
display: inline-block;
margin: 0 5px;
color: #333333;
.name {
height: 26px;
line-height: 26px;
display: inline-block;
padding: 0px 10px;
border-radius: 2px;
&.active {
color: #fff;
background: #449284;
}
}
}
}
.course-class {
display: flex;
flex-direction: row;
box-sizing: content-box;
padding: 10px 20px;
// padding-left: 20px;
// margin: 16px 0 16px 20px;
border-bottom: 1px dashed #e4e7ed;
.title {
height: 56px;
line-height: 56px;
display: inline-block;
padding: 0 10px;
color: #999999;
}
.item {
cursor: pointer;
height: 56px;
line-height: 56px;
display: inline-block;
margin: 0 5px;
color: #333333;
.name {
height: 26px;
line-height: 26px;
display: inline-block;
padding: 0px 10px;
border-radius: 2px;
margin-right: 16px;
&.active {
color: #fff;
background: #449284;
}
}
}
.check-list {
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 14px;
margin-right: 40px;
flex: 1;
.sub-item {
cursor: pointer;
display: flex;
flex-direction: row;
align-items: center;
height: 30px;
line-height: 30px;
font-size: 14px;
color: #333333;
margin-right: 30px;
img {
width: 16px;
height: 16px;
margin-right: 5px;
}
&.active {
color: #449284;
}
}
}
.el-checkbox {
height: 30px;
line-height: 30px;
}
}
.button-wrapper {
display: flex;
flex-direction: row;
justify-content: flex-end;
margin-top: 20px;
// margin-right: 30px;
padding-right: 30px;
min-width: 1125px;
}
</style>
src/components/education/custom/course-select.vue
浏览文件 @ 559652f6
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
<div class="custom-over"> <div class="custom-over">
<!-- <div class="custom-select-wrapper" style="overflow:auto;"> <!-- <div class="custom-select-wrapper" style="overflow:auto;">
<div class="department-label" style="width: 1200px;"> --> <div class="department-label" style="width: 1200px;"> -->
<div class="custom-select-wrapper"> <!-- <div class="custom-select-wrapper">
<div class="department-label" style="min-width:1420px;"> <div class="department-label" style="min-width:1420px;">
<span <span
v-for="(item, index) in allLabelList" v-for="(item, index) in allLabelList"
...@@ -15,8 +15,27 @@ ...@@ -15,8 +15,27 @@
{{item.name}} {{item.name}}
</span> </span>
</div> </div>
</div> </div> -->
<div class="custom-select-wrapper"> <div class="custom-select-wrapper">
<!-- 学科分类 -->
<div class="subject-level">
<span class="title">学科分类</span>
<span
v-for="(item, index) in allLabelList"
:key="index"
class="item"
:class="{active: item.checked}"
@click="selectLabel(index)"
>
<!-- <span
class="item"
v-for="(item, index) in courseLevel"
:key="index"
@click="selectLevel(index)"
> -->
<span class="name" :class="{active: item.checked}">{{item.name}}</span>
</span>
</div>
<!-- 课程分类 --> <!-- 课程分类 -->
<div class="course-class"> <div class="course-class">
<div class="title">课程分类</div> <div class="title">课程分类</div>
...@@ -314,6 +333,45 @@ export default { ...@@ -314,6 +333,45 @@ export default {
} }
} }
} }
.subject-level {
display: flex;
flex-direction: row;
box-sizing: content-box;
height: 56px;
line-height: 56px;
padding-left: 20px;
// margin: 16px 0 16px 20px;
border-bottom: 1px dotted #e4e7ed;
.title {
display: inline-block;
padding: 0 10px;
color: #999999;
}
.item {
cursor: pointer;
display: inline-block;
margin: 0 5px;
color: #333333;
margin-bottom: -1px;
&.active {
border-bottom: 2px solid #449284;
}
.name {
height: 26px;
line-height: 26px;
display: inline-block;
padding: 0px 10px;
border-radius: 2px;
&.active {
color: #449284;
font-weight: 700;
// background: #449284;
}
}
}
}
.course-level { .course-level {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
......
src/components/education/custom/select-course-comp.vue
浏览文件 @ 559652f6
<template> <template>
<div class="select-course-wrapper"> <div class="select-course-wrapper">
<div class="top-line"></div> <div class="top-line"></div>
<el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="公共课程" name="first">
</el-tab-pane>
<el-tab-pane label="我的课程" name="second">
</el-tab-pane>
</el-tabs>
<CourseSelect></CourseSelect> <CourseSelect></CourseSelect>
<div class="top-line" style="margin-top: 20px;"></div> <div class="top-line" style="margin-top: 20px;"></div>
<CourseList></CourseList> <CourseList></CourseList>
...@@ -12,13 +18,18 @@ import CourseList from '@/components/education/custom/course-list' ...@@ -12,13 +18,18 @@ import CourseList from '@/components/education/custom/course-list'
export default { export default {
data() { data() {
return { return {
activeName: 'second'
} }
}, },
components: { components: {
CourseSelect, CourseSelect,
CourseList, CourseList,
} },
methods: {
handleClick() {
}
},
} }
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
...@@ -29,6 +40,5 @@ export default { ...@@ -29,6 +40,5 @@ export default {
height: 10px; height: 10px;
background: rgb(240, 242, 245); background: rgb(240, 242, 245);
} }
} }
</style> </style>
src/main.js
浏览文件 @ 559652f6
...@@ -12,7 +12,14 @@ import ElementUI from 'element-ui'; ...@@ -12,7 +12,14 @@ import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css'; import 'element-ui/lib/theme-chalk/index.css';
//引入滚动加载分页 //引入滚动加载分页
import infiniteScroll from 'vue-infinite-scroll' import infiniteScroll from 'vue-infinite-scroll'
Vue.use(infiniteScroll) import VueVideoPlayer from 'vue-video-player';
import 'video.js/dist/video-js.css';
// import pdf from 'vue-pdf'
Vue.use(infiniteScroll);
Vue.use(VueVideoPlayer);
// Vue.use(pdf);
// 可调试 // 可调试
// Vue.config.devtools = true; // Vue.config.devtools = true;
// Vue.use(Logger, { prefix: new Date(), isDev: process.env.NODE_ENV === 'development', cLevel: 'debug' }) // Vue.use(Logger, { prefix: new Date(), isDev: process.env.NODE_ENV === 'development', cLevel: 'debug' })
......
src/router/router.js
浏览文件 @ 559652f6
...@@ -45,6 +45,8 @@ const templateEditor = r => require.ensure([], () => r(require('../views/educati ...@@ -45,6 +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 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')
...@@ -192,6 +194,10 @@ export default [{ ...@@ -192,6 +194,10 @@ export default [{
path: '/notice-editor', path: '/notice-editor',
component: noticeEditor component: noticeEditor
}, },
{
path: '/external-resource-manage',
component: externalResourceManage,
},
// { // {
// path: '/followup', // path: '/followup',
// name: 'followUp', // name: 'followUp',
......
src/style/global.scss
浏览文件 @ 559652f6
...@@ -160,5 +160,26 @@ ...@@ -160,5 +160,26 @@
border-radius: 3px; border-radius: 3px;
} }
} }
.select-course-wrapper {
.el-tabs__nav {
margin-left: 30px;
}
.el-tabs__item:hover {
color: #449284 !important;
}
.el-tabs__item.is-active {
color: #449284 !important;
}
.el-tabs__active-bar {
background: #449284 !important;
}
}
.dialog-title-border {
.el-dialog__body {
margin: 0 20px;
padding: 25px 5px 30px;
border-top: 1px solid #E4E7ED;
}
}
src/utils/env-config.js
浏览文件 @ 559652f6
...@@ -10,7 +10,7 @@ export const envConfig = { ...@@ -10,7 +10,7 @@ export const envConfig = {
// baseUrl: 'https://uat-sc.yunqueyi.com/', // baseUrl: 'https://uat-sc.yunqueyi.com/',
// baseUrl: 'http://10.177.15.150:10401/', // baseUrl: 'http://10.177.15.150:10401/',
// baseUrl: 'http://10.177.15.150:11905/', // baseUrl: 'http://10.177.15.150:11905/',
baseUrl: 'https://uat-sc.yunqueyi.com/', baseUrl: 'https://dev-sc.yunqueyi.com/',
// baseUrl: 'https://test1-sc.yunqueyi.com/', // baseUrl: 'https://test1-sc.yunqueyi.com/',
// baseUrl: 'https://sc.yunqueyi.com/', // baseUrl: 'https://sc.yunqueyi.com/',
// baseUrl: 'https://uat-sc.yunqueyi.com/', // baseUrl: 'https://uat-sc.yunqueyi.com/',
......
src/utils/fetch.js
浏览文件 @ 559652f6
...@@ -54,7 +54,7 @@ service.interceptors.request.use(config => { ...@@ -54,7 +54,7 @@ service.interceptors.request.use(config => {
} }
if( process.env.BUILD_ENV == "development" ){ // 本地开发环境 if( process.env.BUILD_ENV == "development" ){ // 本地开发环境
// console.log('环境变量>>>> ', process.env.BUILD_ENV); // console.log('环境变量>>>> ', process.env.BUILD_ENV);
config.headers['token'] = 'AA3888A4256A49099D14879928E3E919'; config.headers['token'] = '37683A493D6B497AB152D87EA731CF35';
// config.headers['token'] = localStorage.getItem('storageToken') // config.headers['token'] = localStorage.getItem('storageToken')
}else{ }else{
config.headers['token'] = localStorage.getItem('storageToken') config.headers['token'] = localStorage.getItem('storageToken')
......
src/views/education/external-resource-manage copy.vue 0 → 100644
浏览文件 @ 559652f6
<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.doctorName" size="small" class="form-width" placeholder="请输入姓名"></el-input>
</el-form-item>
<el-form-item label="资源类型：" class="search-item">
<el-select v-model="searchForm.authId" placeholder="请选择" size="small" class="form-width">
<el-option v-for="(item, index) in accessList" :key="index" :label="item.text" :value="item.id"></el-option>
</el-select>
</el-form-item>
</el-row>
<el-row>
<el-form-item label="添加人：" class="search-item" >
<el-input v-model="searchForm.doctorName" size="small" class="form-width" placeholder="请输入姓名"></el-input>
</el-form-item>
<!-- <el-form-item label="创建日期：" class="search-item" >
<el-input v-model="searchForm.doctorName" size="small" class="form-width" placeholder="请输入姓名"></el-input>
</el-form-item> -->
<el-form-item label="创建日期：" class="search-item">
<el-date-picker
v-model="searchForm.beginTime"
type="datetime"
size="small"
value-format="yyyy-MM-dd HH:mm:ss"
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>
<!-- <div>
<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="seq" label="资源名称"></el-table-column>
<el-table-column align="center" prop="doctorName" label="资源类型" ></el-table-column>
<el-table-column align="center" prop="doctorName" label="创建人" ></el-table-column>
<el-table-column align="center" prop="doctorName" label="创建日期" ></el-table-column>
<el-table-column align="center" prop="authName" label="状态" ></el-table-column>
<el-table-column align="center" label="操作">
<template slot-scope="scope">
<el-button @click="goToEdit(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>
</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" :rules="rules" :model="addEditForm" label-width="120px">
<el-form-item label="姓名：" class="search-item" prop="doctorId">
<el-select v-model="addEditForm.doctorId" placeholder="请选择" size="small" class="form-width">
<el-option v-for="(item, index) in nameList" :key="index" :label="item.text" :value="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item label="权限：" class="search-item" prop="authId">
<el-select v-model="addEditForm.authId" placeholder="请选择" size="small" class="form-width">
<el-option v-for="(item, index) in accessList" :key="index" :label="item.text" :value="item.id"></el-option>
</el-select>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="hideAddEditForm">取 消</el-button>
<el-button type="primary" @click="submitForm('addEditForm')">确 定</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>
</div>
</template>
<script>
import { openLoading, closeLoading } from "../../utils/utils";
import BreadCrumb from "../../components/breadcrumb.vue";
import * as commonUtil from "../../utils/utils";
import {
getAccessListReq,
getAuthTableReq,
getUserListReq,
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: {
doctorName: '',
authId: '',
beginTime: '',
endTime: '',
pageNo: 1,
pageSize: 15,
},
addEditForm: {
doctorId: '',
authId: '',
},
accessList: [], // 权限列表
tableData: [],
nameList: [],
rules: {
doctorId: [{ required: true, message: '请选择', trigger: 'blur' }],
authId: [{ required: true, message: '请选择', trigger: 'blur' }],
},
}
},
components: {
BreadCrumb
},
created() {
// this.getAccessList();
this.goToSearch(1);
this.getUserList();
},
mounted() {
commonUtil.resizeHeight();
},
methods: {
// // 获取权限 下拉列表
// getAccessList() {
// let req = {};
// getAccessListReq(req).then(res => {
// if (res.code == "000000") {
// // console.log('权限列表 ', res)
// this.accessList = res.data;
// } else {
// this.$message(res.message);
// }
// }).catch(err => {
// this.$message.error('请求失败');
// });
// },
// 搜索
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() {
this.searchForm = {
doctorName: '',
authId: '',
pageNo: 1,
pageSize: 15,
};
},
// 新增
goToAdd() {
this.isAdd = true;
this.addEditVisible = true;
},
// 编辑
goToEdit(row) {
this.isAdd = false;
this.currentRow = row;
// console.log('编辑 ', row)
this.addEditVisible = true;
// 编辑回显状态
this.addEditForm = {
authId: row.authId,
doctorId: row.doctorId,
};
},
// 获取新增、编辑的用户列表
getUserList() {
let req = {};
getUserListReq(req).then(res => {
if (res.code == "000000") {
// console.log('获取用户列表 ', res)
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) {
this.$refs[formName].resetFields();
},
handleSaveEdit() {
// 新增、编辑传参不同
// debugger;
let req = {};
if (this.isAdd) {
req = {
authId: this.addEditForm.authId,
doctorId: this.addEditForm.doctorId,
}
} else {
req = {
authId: this.addEditForm.authId,
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 = {
doctorId: '',
authId: '',
};
},
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){
// console.log('handleSizeChange>>>')
this.searchForm.pageSize = val;
this.goToSearch(1);
},
handleCurrentChange(val){
// 切换当前页
this.searchForm.pageNo = val;
this.getAuthTable();
},
},
}
</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
src/views/education/external-resource-manage.vue 0 → 100644
浏览文件 @ 559652f6
<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.doctorName" size="small" class="form-width" placeholder="请输入姓名"></el-input>
</el-form-item>
<el-form-item label="资源类型：" class="search-item">
<el-select v-model="searchForm.status" placeholder="请选择" size="small" class="form-width">
<el-option v-for="(item, index) in statusList" :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.doctorName" size="small" class="form-width" placeholder="请输入姓名"></el-input>
</el-form-item>
<!-- <el-form-item label="创建日期：" class="search-item" >
<el-input v-model="searchForm.doctorName" size="small" class="form-width" placeholder="请输入姓名"></el-input>
</el-form-item> -->
<el-form-item label="创建日期：" class="search-item">
<el-date-picker
v-model="searchForm.beginTime"
type="datetime"
size="small"
value-format="yyyy-MM-dd HH:mm:ss"
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>
<!-- <div>
<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="seq" label="资源名称"></el-table-column>
<el-table-column align="center" prop="doctorName" label="资源类型" ></el-table-column>
<el-table-column align="center" prop="doctorName" label="创建人" ></el-table-column>
<el-table-column align="center" prop="doctorName" label="创建日期" ></el-table-column>
<el-table-column align="center" prop="authName" label="状态" ></el-table-column>
<el-table-column align="center" label="操作">
<template slot-scope="scope">
<el-button @click="goToEdit(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>
</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" :rules="rules" :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="submitForm('addEditForm')">确 定</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>
<PreviewPDF :dialogVisible="isPreviewPDF" :pdfUrl="pdfUrl" @close="closePDF"></PreviewPDF>
<PreviewProtocol :dialogVisible="isPreviewProtocol" :protocolId="protocolId" @close="closeProtocol"></PreviewProtocol>
<PreviewEditCourse :dialogVisible="isPreviewEditCourse" @close="closeEditCourse"></PreviewEditCourse>
<button @click="previewVideoAction">test video</button>
<button @click="previewPDFAction">test pdf</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 PreviewPDF from "@/components/education/custom-resource/preview-pdf";
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 {
getAuthTableReq,
getUserListReq,
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: {
doctorName: '',
status: '',
beginTime: '',
endTime: '',
pageNo: 1,
pageSize: 15,
},
addEditForm: {
desc: '',
doctorId: '',
status: '',
},
statusList: [{
name: '全部状态',
value: ''
},{
name: '待审核',
value: '1'
},{
name: '通过',
value: '2'
},{
name: '拒绝',
value: '3'
}], // 权限列表
tableData: [],
nameList: [],
rules: {
doctorId: [{ required: true, message: '请选择', trigger: 'blur' }],
status: [{ required: true, message: '请选择', trigger: 'blur' }],
},
isPreviewVideo: false,
videoUrl: '',
isPreviewPDF: false,
pdfUrl: '',
isPreviewProtocol: false,
protocolId: 0,
isPreviewEditCourse: false,
}
},
components: {
BreadCrumb,
PreviewVideo,
PreviewPDF,
PreviewProtocol,
PreviewEditCourse
},
created() {
this.goToSearch(1);
this.getUserList();
},
mounted() {
commonUtil.resizeHeight();
},
methods: {
// 打开预览课程弹框
previewVideoAction(videoUrl) {
this.videoUrl = 'http://10.177.11.169:9000/1584002682204479.mp4';
this.isPreviewVideo = true;
},
// 关闭预览课程弹框
closeVideo() {
this.isPreviewVideo = false;
},
// 打开预览PDF弹框
previewPDFAction(videoUrl) {
this.pdfUrl = 'http://10.177.11.169:9000/test.pdf';
this.isPreviewPDF = true;
},
// 关闭预览PDF弹框
closePDF() {
this.isPreviewPDF = false;
},
// 打开预览PDF弹框
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() {
this.searchForm = {
doctorName: '',
status: '',
pageNo: 1,
pageSize: 15,
};
},
// 新增
goToAdd() {
this.isAdd = true;
this.addEditVisible = true;
},
// 编辑
goToEdit(row) {
this.isAdd = false;
this.currentRow = row;
// console.log('编辑 ', row)
this.addEditVisible = true;
// 编辑回显状态
this.addEditForm = {
desc: '',
status: row.status,
doctorId: row.doctorId,
};
},
// 获取新增、编辑的用户列表
getUserList() {
let req = {};
getUserListReq(req).then(res => {
if (res.code == "000000") {
// console.log('获取用户列表 ', res)
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) {
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){
// console.log('handleSizeChange>>>')
this.searchForm.pageSize = val;
this.goToSearch(1);
},
handleCurrentChange(val){
// 切换当前页
this.searchForm.pageNo = val;
this.getAuthTable();
},
},
}
</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
src/views/layout/slidebar.vue
浏览文件 @ 559652f6
...@@ -364,6 +364,11 @@ ...@@ -364,6 +364,11 @@
title: '学分发放管理', title: '学分发放管理',
icon: 'el-icon-document', icon: 'el-icon-document',
index: 'credit-send-manage' index: 'credit-send-manage'
},
{
title: '外部资源管理',
icon: 'el-icon-document',
index: 'external-resource-manage'
}, },
] ]
} }
......
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或