mirror of
https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/learning-system-portal.git
synced 2025-12-10 19:36:43 +08:00
921 lines
34 KiB
Vue
921 lines
34 KiB
Vue
<template>
|
||
<div>
|
||
<!--在线课录播课审核-->
|
||
|
||
<el-row :gutter="10">
|
||
<el-col :span="18" v-show="type === 0">
|
||
<div class="player" style="min-height: 473px;border: 1px solid #d0d0d0;background-color: #FFFFFF;padding-top: 10px;">
|
||
<!--课程基本信息-->
|
||
<div>
|
||
<!-- v-if="contentData.contentType == 0" -->
|
||
<div v-if="!contentData.contentType" style="position: relative;">
|
||
<el-form label-width="120px" size="mini" v-if="isEdit">
|
||
<el-form-item label="名称">{{courseInfo.name}}</el-form-item>
|
||
<el-form-item label="封面图片">
|
||
<el-col :span="8">
|
||
<!-- <imageUpload :value="courseCoverurl" @success="uploadCoverImgSuccess" @remove="removeCoverImgSuccess"></imageUpload> -->
|
||
<div style="width: 160px;height: 90px">
|
||
<img style="width:100%;height:100%" v-if="courseCoverurl == ''" :src="webBaseUrl + '/images/bgimg/course.png'" alt="" srcset="">
|
||
<img style="width:100%;height:100%" v-else :src="courseCoverurl" alt="" srcset="">
|
||
</div>
|
||
</el-col>
|
||
<el-col :span="16">
|
||
<el-form-item label="内容分类">
|
||
<span>{{sysTypeName(courseInfo.sysType1)}}</span>
|
||
<span v-if="courseInfo.sysType2 !=''">/{{sysTypeName(courseInfo.sysType2)}}</span>
|
||
<span v-if="courseInfo.sysType3 !=''">/{{sysTypeName(courseInfo.sysType3)}}</span>
|
||
</el-form-item>
|
||
<!-- <el-form-item label="资源归属">
|
||
<span>{{resOwnerName(courseInfo.resOwner1)}}</span>
|
||
<span v-if="courseInfo.resOwner2 != ''">/{{resOwnerName(courseInfo.resOwner2)}}</span>
|
||
<span v-if="courseInfo.resOwner3 != ''">/{{resOwnerName(courseInfo.resOwner3)}}</span>
|
||
</el-form-item> -->
|
||
<el-form-item label="场景">
|
||
{{sceneFilter(courseInfo.forScene)}}
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-form-item>
|
||
<el-form-item label="授课教师" ><!--授课老师默认是当前操作人-->
|
||
{{teacher && teacher.join(',')}}
|
||
</el-form-item>
|
||
<!-- <el-form-item label="系统标签">
|
||
{{courseInfo.tags}}
|
||
</el-form-item> -->
|
||
<el-form-item label="资源归属" >{{orgName}}</el-form-item>
|
||
<el-form-item label="目标人群" >
|
||
{{courseInfo.forUsers}}
|
||
</el-form-item>
|
||
<el-form-item label="课程来源">
|
||
{{courseInfo.source == 2?'外部':'内部'}}
|
||
</el-form-item>
|
||
<el-form-item label="观看设置">
|
||
{{courseInfo.device == 3? '多端可见': courseInfo.device == 2?'移动端可见':'PC端可见'}}
|
||
</el-form-item>
|
||
<!-- <el-form-item label="关键字">
|
||
{{courseInfo.keywords}}
|
||
</el-form-item> -->
|
||
<el-form-item label="课程价值" style="word-break:break-all;">
|
||
|
||
{{courseInfo.value}}
|
||
</el-form-item>
|
||
<el-form-item label="课程简介" style="word-break:break-all;">
|
||
{{courseInfo.summary}}
|
||
</el-form-item>
|
||
|
||
<!-- <el-form-item label="完成规则" v-if="!weike.onlyRequired"><el-input maxlength="50" v-model="params.forScene" placeholder="可基于组织树或受众选择"></el-input></el-form-item> -->
|
||
<!-- <el-form-item label="开放权限">{{courseInfo.openObject}}</el-form-item> -->
|
||
<!-- <el-form-item label="课程描述">
|
||
<div v-html="courseInfo.overview"></div>
|
||
</el-form-item> -->
|
||
<el-form-item v-if="isShow"><el-button type="primary" @click="isEdit = false">编辑</el-button> </el-form-item>
|
||
</el-form>
|
||
<el-form label-width="80px" size="mini" v-else>
|
||
<el-form-item label="名称" required><el-input maxlength="100" v-model="courseInfo.name" placeholder="课程名称(限100字以内)"></el-input></el-form-item>
|
||
<!--不显示，因为标题已经代表了 <el-form-item label="授课方式">{{courseTypeMap(params.type)}}</el-form-item>-->
|
||
<el-form-item label="封面图片" required >
|
||
<el-col :span="8">
|
||
<div @click.stop="chooseFile">
|
||
<imageUpload :disabled="true" :value="courseCoverurl" width="160px" height="90px" @subimage="acceptimage" @success="uploadCoverImgSuccess" @remove="removeCoverImgSuccess"></imageUpload>
|
||
|
||
</div>
|
||
<div>上传为16:9(如:800*450)的png或jpg图片</div>
|
||
</el-col>
|
||
<el-col :span="16">
|
||
<el-form-item label="内容分类" required>
|
||
<el-cascader placeholder="选择内容分类" style="width: 90%;" clearable v-model="sysType" :props="sysProps" :options="sysTypeListMap"></el-cascader>
|
||
</el-form-item>
|
||
<!-- <el-form-item label="资源归属" required>
|
||
<el-cascader placeholder="选择资源归属" style="width: 90%;" clearable v-model="resOwnerArray" :props="defaultProps" :options="resOwnerListMap"></el-cascader>
|
||
</el-form-item> -->
|
||
<el-form-item label="场景">
|
||
<el-select v-model="courseInfo.forScene" style="width: 90%;">
|
||
<el-option v-for="item in sceneList" :key="item.id" :label="item.name" :value="item.id"></el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
<el-form-item label="授课教师" required ><!--授课老师默认是当前操作人-->
|
||
<el-select style="width: 90%;"
|
||
v-model="teacherName"
|
||
multiple
|
||
filterable
|
||
remote
|
||
disabled
|
||
value-key="teacherId"
|
||
reserve-keyword
|
||
placeholder="请输入授课教师姓名"
|
||
:remote-method="remoteMethod"
|
||
:loading="loading">
|
||
<el-option v-for="item in teacherList" :key="item.teacherId" :label="item.teacherName" :value="item"></el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-form-item>
|
||
<el-form-item label="资源归属" required>
|
||
<el-input placeholder="请选择" v-model="orgName" >
|
||
<el-button v-if="identity==3 || identity==5" @click="showChooseOrg()" slot="append" icon="el-icon-search">选择</el-button>
|
||
</el-input>
|
||
</el-form-item>
|
||
<el-form-item label="目标人群" >
|
||
<el-input maxlength="50" show-word-limit v-model="courseInfo.forUsers" placeholder="目标人群(限50字以内)"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="课程价值" >
|
||
<el-input maxlength="200" show-word-limit v-model="courseInfo.value" placeholder="课程价值(限200字以内)"></el-input></el-form-item>
|
||
<!-- <el-form-item label="系统标签" >
|
||
<el-col :span="14">
|
||
<el-select style="width: 100%;"
|
||
v-model="showTags"
|
||
multiple
|
||
filterable
|
||
remote
|
||
reserve-keyword
|
||
placeholder="请输入关键词"
|
||
:remote-method="remoteTagMethod"
|
||
:loading="loading">
|
||
<el-option v-for="item in tagList" :key="item.id" :label="item.name" :value="item.name"> </el-option>
|
||
</el-select>
|
||
</el-col> -->
|
||
<!-- <el-col :span="10">
|
||
<el-form-item label="关键字"><el-input v-model="courseInfo.keywords" maxlength="50" placeholder="请输入关键字(限100字以内)"></el-input></el-form-item>
|
||
</el-col> -->
|
||
<!-- </el-form-item> -->
|
||
<el-form-item label="观看设置">
|
||
<el-col :span="14">
|
||
<el-radio v-model="courseInfo.device" :label="1">PC端可见</el-radio>
|
||
<el-radio v-model="courseInfo.device" :label="2">移动端可见</el-radio>
|
||
<el-radio v-model="courseInfo.device" :label="3">多端可见</el-radio>
|
||
</el-col>
|
||
<el-col :span="10">
|
||
<el-form-item label="课程来源">
|
||
<el-radio-group v-model="courseInfo.source" >
|
||
<el-radio :label="1">内部</el-radio>
|
||
<el-radio :label="2">外部</el-radio>
|
||
</el-radio-group>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-form-item>
|
||
<!-- <el-form-item label="完成规则" ><el-input maxlength="50" v-model="params.forScene" placeholder="可基于组织树或受众选择"></el-input></el-form-item> -->
|
||
<el-form-item label="开放权限" ><el-input maxlength="50" show-word-limit v-model="courseInfo.openObject" placeholder="可基于组织树或受众选择"></el-input></el-form-item>
|
||
<el-form-item label="课程简介">
|
||
<el-input type="textarea" maxlength="100" show-word-limit :rows="3" v-model="courseInfo.summary" placeholder="课程介绍,要换成富文本编辑器"></el-input>
|
||
</el-form-item>
|
||
<!-- <el-form-item label="课程描述">
|
||
<WxEditor v-model="courseInfo.overview" :minHeight="100"></WxEditor>
|
||
</el-form-item> -->
|
||
<el-form-item label=""><el-button type="primary" v-loading="btnLoading" @click="saveEdit">保存</el-button> </el-form-item>
|
||
</el-form>
|
||
</div>
|
||
<div v-if="contentData.contentType == 10" style="position: relative;">
|
||
<videoPlayer :src="fileBaseUrl+curriculumData.url"
|
||
@onPlayerPlaying="onPlayerPlaying"
|
||
@onPlayerPlay="onPlayerPlay"
|
||
@onPlayerPause="onPlayerPause"
|
||
@onPlayerEnded="onPlayerEnded"></videoPlayer>
|
||
<!-- <video :src="fileBaseUrl+contentData.content" width="100%" controls controlslist="nodownload" style="width: 100%; height: 100%; object-fit: fill"></video> -->
|
||
</div>
|
||
<div v-if="contentData.contentType == 20">
|
||
<audioPlayer :url="fileBaseUrl+curriculumData.url"
|
||
:name="contentData.contentName"
|
||
@onPlaying="audioPlaying"
|
||
@onPlay="audioPlay"
|
||
@onPause="audioPause"
|
||
@onPlayEnd="audioEnd"
|
||
></audioPlayer>
|
||
<!-- <audio width="100%" controls :src="fileBaseUrl+contentData.content">
|
||
您的浏览器不支持 audio 标签。
|
||
</audio> -->
|
||
</div>
|
||
<div v-if="contentData.contentType == 40">
|
||
<div style="padding: 10px;color: #767676; " v-if="converStatus < 2 && !contentData.content">
|
||
<div>文档文件转化中，还未转化完成，</div>
|
||
<div>上传时间：{{curCFile.sysCreateTime}}</div>
|
||
</div>
|
||
<div style="padding: 10px;color: #767676;color: #ff0000;" v-if="converStatus == 3 && !contentData.content">
|
||
文件转化失败，请重新上传（不要上传加密的文件）或联系管理员
|
||
</div>
|
||
<pdfPreview v-if="contentData.content" :filePath="fileBaseUrl+contentData.content"></pdfPreview>
|
||
</div>
|
||
<div v-if="contentData.contentType == 41">
|
||
<div class="picture-text" v-html="contentData.content"></div>
|
||
</div>
|
||
<div v-if="contentData.contentType == 52">
|
||
<div v-if="contentData.content!=''">
|
||
<hyper-link :content="contentData"></hyper-link>
|
||
<!-- <iframe :src="contentData.content" style="width: 100%;border:0px;min-height: 473px;" frameborder="0"></iframe> -->
|
||
</div>
|
||
</div>
|
||
<div v-if="contentData.contentType == 50">
|
||
<iframe v-if="scormUrl" :src="scormUrl" frameborder="0" border="0px" style="width:100%;height:510px;border:0px;"></iframe>
|
||
</div>
|
||
<div v-if="contentData.contentType == 60">
|
||
<homework :showTest="showTest" :showRecord="isDetails" :showSubmit="false" :content="contentData" ></homework>
|
||
</div>
|
||
<div v-if="contentData.contentType == 61">
|
||
<exam :showTest="showTest" :showRecord="isDetails" :showSubmit="false" :content="contentData"></exam>
|
||
</div>
|
||
<div v-if="contentData.contentType == 62" style="padding:5px">
|
||
<assess v-if="contentData.id" :showSubmit="false" :showRecord="false" :content="contentData"></assess>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</el-col>
|
||
<el-col :span="18" v-show="type === 1">
|
||
<div class="grid-info">
|
||
<el-table border style="margin-bottom: 20px" height="550" :data="dataList">
|
||
<el-table-column type="expand">
|
||
<template slot-scope="props">
|
||
<el-table border style="margin-bottom: 10px" :data="props.row.logData">
|
||
<el-table-column label="内容" prop="title"></el-table-column>
|
||
<el-table-column label="修改前" prop="before" show-overflow-tooltip>
|
||
<template slot-scope="props">
|
||
{{props.row.before == 'null' || props.row.before == ''? '--':props.row.before}}
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="修改后" prop="after" show-overflow-tooltip></el-table-column>
|
||
</el-table>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="修改人" prop="sysCreateBy"></el-table-column>
|
||
<el-table-column label="修改时间" prop="sysCreateTime"></el-table-column>
|
||
</el-table>
|
||
</div>
|
||
</el-col>
|
||
<el-col :span="6">
|
||
<div><el-button size="small" @click="type =0;contentData= {}" type="info">课程基本信息</el-button>
|
||
<el-button size="small" v-if="isShow" @click="type =1" type="info">修改记录</el-button>
|
||
</div>
|
||
<div style="padding: 5px;">课程内容目录</div>
|
||
<div style="min-height: 500px;">
|
||
<div class="catalog">
|
||
<el-collapse class="catalog-row" v-model="activeNames">
|
||
<el-collapse-item v-for="(item, index) in catalogTree" :key="index" :name="index">
|
||
<template slot="title">
|
||
<span style="font-size:12px">{{ item.section.name }}</span>
|
||
</template>
|
||
<ul>
|
||
<li @click="showRes(ele)" v-for="(ele, i) in item.contents" :key="i" class="catalog-cell">
|
||
<span style="font-size:12px">{{ getType(ele.contentType) }}</span>
|
||
<span style="margin-left: 5px;">{{ ele.contentName}}</span>
|
||
</li>
|
||
</ul>
|
||
</el-collapse-item>
|
||
</el-collapse>
|
||
</div>
|
||
</div>
|
||
</el-col>
|
||
</el-row>
|
||
<filecloud :show="dlgFileChoose.show" @choose="changeCourseImage" @close="choseChoose"></filecloud>
|
||
<chooseOrg ref="refChooseOrg" @confirm="confirmChooseOrg"></chooseOrg>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import apiCoursePortal from "@/api/modules/coursePortal.js";
|
||
import apiOrg from '../../api/system/organiza.js';
|
||
import apiUser from '@/api/system/user.js';
|
||
import exam from "@/components/Course/exam";
|
||
import homework from "@/components/Course/homework";
|
||
import pdfPreview from "@/components/PdfPreview/index.vue";
|
||
import assess from "@/components/Course/assess";
|
||
import apiTag from "../../api/modules/tag.js";
|
||
import chooseOrg from '@/components/System/chooseOrg.vue';
|
||
import {
|
||
formatDate,
|
||
courseType,
|
||
getType,
|
||
numberToLetter
|
||
} from "@/utils/tools.js";
|
||
import imageUpload from "@/components/ImageUpload/index.vue";
|
||
import weikeContent from "@/components/Course/weikeContent.vue";
|
||
import catalogCourseware from "@/components/Course/catalogCourseware.vue";
|
||
import apiCourse from "@/api/modules/course.js";
|
||
import scene from "../../api/modules/scene.js";
|
||
import WxEditor from "@/components/Editor/index.vue";
|
||
import videoPlayer from '@/components/VideoPlayer/index.vue';
|
||
import audioPlayer from '@/components/AudioPlayer/index.vue';
|
||
import { mapGetters,mapActions} from 'vuex';
|
||
import hyperLink from '@/components/Course/hyperLink.vue';
|
||
import apiCourseFile from '../../api/modules/courseFile.js';
|
||
import filecloud from '@/components/FileCloud/index.vue';
|
||
import apiUserBasic from '../../api/boe/userbasic.js';
|
||
export default {
|
||
name:"auditCourse2",
|
||
components: {
|
||
weikeContent,
|
||
catalogCourseware,
|
||
imageUpload,
|
||
exam,
|
||
filecloud,
|
||
homework,
|
||
assess,
|
||
WxEditor,
|
||
pdfPreview,
|
||
videoPlayer,
|
||
audioPlayer,
|
||
hyperLink,
|
||
chooseOrg
|
||
},
|
||
props: {
|
||
id: {
|
||
type: String,
|
||
default: ""
|
||
},
|
||
isShow: {//编辑按钮控制
|
||
type: Boolean,
|
||
default: true
|
||
},
|
||
isDetails:{ //作业，显示记录
|
||
type: Boolean,
|
||
default: true
|
||
},
|
||
showTest:{//预览显示试题
|
||
type: Boolean,
|
||
default: false
|
||
}
|
||
},
|
||
computed: {
|
||
...mapGetters(['resOwnerMap','sysTypeMap','identity']),
|
||
},
|
||
data() {
|
||
return {
|
||
dlgFileChoose:{
|
||
show:false
|
||
},
|
||
converStatus:4,
|
||
curriculumData:{
|
||
url:'',
|
||
isDrag:false,
|
||
completeSetup:1,
|
||
},
|
||
contentDataShow:true,//预览页面和课程内容的切换
|
||
isEdit: true,
|
||
fileBaseUrl: this.$xpage.constants.fileBaseUrl,
|
||
contentData: {},
|
||
scormUrl:'',
|
||
curCFile:{},//课件内容
|
||
getType: getType,
|
||
btnLoading: false,
|
||
teacherName: [],
|
||
teacher: [],
|
||
loading: false,
|
||
defaultProps: {
|
||
value: "code",
|
||
label: "name"
|
||
},
|
||
sysProps: {
|
||
value: "id",
|
||
label: "name"
|
||
},
|
||
catalogTree: [],
|
||
resOwnerArray: [],
|
||
sceneList: [],
|
||
sysType: [],
|
||
optionsList: [],
|
||
tagList: [], // 标签
|
||
typeList: [], // 资源归属
|
||
showTags: [], //用于显示标签
|
||
teacherList: [],
|
||
orgName:'',
|
||
orgKid:'',
|
||
courseInfo: {},
|
||
courseCoverurl: "",
|
||
sysTypeListMap:[],
|
||
resOwnerListMap: [],
|
||
dataList: [{ id: 1 }, { id: 2 }],
|
||
activeName: "catalog",
|
||
type: 0,
|
||
info: {
|
||
onlyRequired: false,
|
||
dlgShow: false,
|
||
fileType: "",
|
||
shebei: []
|
||
},
|
||
rules: {
|
||
name: [{ required: true, message: "请输入课程名称", trigger: "blur" }],
|
||
kind: [
|
||
{ required: true, message: "请选择课程分类", trigger: "change" }
|
||
],
|
||
location: [
|
||
{ required: true, message: "请选择资源归属", trigger: "change" }
|
||
],
|
||
aim: [{ required: true, message: "请输入目标人群", trigger: "blur" }],
|
||
courseValue: [
|
||
{ required: true, message: "请输入课程价值", trigger: "blur" }
|
||
],
|
||
tag: [{ required: true, message: "请输入标签", trigger: "blur" }],
|
||
power: [{ required: true, message: "请输入开放权限", trigger: "blur" }]
|
||
},
|
||
activeNames: [0, 1, 2, 3, 4]
|
||
};
|
||
},
|
||
mounted() {
|
||
this.getDetail();
|
||
this.getSceneData();
|
||
this.updateLogs();
|
||
this.getResOwnerTree().then(rs=>{
|
||
this.resOwnerListMap=rs;
|
||
});
|
||
this.getSysTypeTree().then(rs=>{
|
||
this.sysTypeListMap=rs;
|
||
})
|
||
},
|
||
methods: {
|
||
showChooseOrg(){
|
||
this.$refs.refChooseOrg.dlgShow = true;
|
||
},
|
||
confirmChooseOrg(orgInfo){
|
||
//console.log(orgInfo,'orgInfo');
|
||
this.orgName=orgInfo.name;
|
||
this.orgKid=orgInfo.kid;
|
||
this.courseInfo.orgId=orgInfo.id;
|
||
this.$refs.refChooseOrg.dlgShow = false;
|
||
},
|
||
chooseFile(){
|
||
this.dlgFileChoose.show=true;
|
||
},
|
||
choseChoose(){
|
||
this.dlgFileChoose.show=false;
|
||
},
|
||
changeCourseImage(img){
|
||
if(!img.path){
|
||
return;
|
||
}
|
||
//console.log(img);
|
||
this.dlgFileChoose.show=false;
|
||
this.courseInfo.coverImg = img.path;
|
||
this.courseCoverurl = this.fileUrl+img.path;
|
||
},
|
||
acceptimage(value){
|
||
this.courseInfo.coverImg = value.path;
|
||
this.courseCoverurl = value.path;
|
||
},
|
||
...mapActions({
|
||
getResOwnerTree:'resOwner/getResOwnerTree',
|
||
loadResOwners:'resOwner/loadResOwners',
|
||
getSysTypeTree:'sysType/getSysTypeTree',
|
||
loadSysTypes:'sysType/loadSysTypes'
|
||
}),
|
||
resOwnerName(code){
|
||
if(code==''){return '';}
|
||
return this.resOwnerMap.get(code);
|
||
},
|
||
sysTypeName(code){
|
||
if(code==''){return '';}
|
||
return this.sysTypeMap.get(code);
|
||
},
|
||
onPlayerPlay(){
|
||
console.log("开始播放");
|
||
},
|
||
onPlayerPause(){
|
||
console.log("暂停");
|
||
},
|
||
onPlayerEnded(){
|
||
console.log("播放结束");
|
||
},
|
||
onPlayerPlaying(itme){
|
||
console.log("当前播放"+itme);
|
||
},
|
||
audioPlaying(item){
|
||
console.log("当前播放"+item);
|
||
},
|
||
audioPlay(){
|
||
console.log("开始播放");
|
||
},
|
||
audioPause(){
|
||
console.log("暂停");
|
||
},
|
||
audioEnd(){
|
||
console.log("播放结束");
|
||
},
|
||
// 场景过滤
|
||
sceneFilter(forScene) {
|
||
// sceneList
|
||
// this.courseInfo.forScene
|
||
let name = "";
|
||
this.sceneList.forEach(item => {
|
||
if (item.id === forScene) {
|
||
name = item.name;
|
||
}
|
||
});
|
||
return name;
|
||
},
|
||
updateLogs() {
|
||
let params = {
|
||
courseId: this.id,
|
||
name: ""
|
||
};
|
||
apiCourse.findUpdateLogs(params).then(res => {
|
||
if (res.status === 200) {
|
||
res.result.forEach(item => {
|
||
item.logData = JSON.parse(item.logData);
|
||
});
|
||
this.dataList = res.result;
|
||
} else {
|
||
this.$message.error(res.message);
|
||
}
|
||
});
|
||
},
|
||
saveEdit() {
|
||
this.btnLoading = true;
|
||
//标签为什么要深复制？
|
||
// let tags = deepClone(this.courseInfo.tags);
|
||
// console.log(tags, 'tags222');
|
||
// this.courseInfo.tags = tags.join();
|
||
this.courseInfo.tags = this.showTags.join();
|
||
//处理资源归属
|
||
// if (this.resOwnerArray.length > 0) {
|
||
// this.courseInfo.resOwner1 = this.resOwnerArray[0]; //资源归属一级的id
|
||
// this.courseInfo.resOwner2 = this.resOwnerArray[1]; //资源归属二级的id
|
||
// } else {
|
||
// this.$message.error("请选择资源归属");
|
||
// this.btnLoading = false;
|
||
// return;
|
||
// }
|
||
if (this.resOwnerArray.length > 2) {
|
||
this.courseInfo.resOwner3 = this.resOwnerArray[2]; //资源归属三级的id
|
||
}
|
||
// 分类
|
||
if (this.sysType.length > 0) {
|
||
this.courseInfo.sysType1 = this.sysType[0]; //资源归属一级的id
|
||
this.courseInfo.sysType2 = this.sysType[1]; //资源归属二级的id
|
||
} else {
|
||
this.$message.error("请选择内容分类");
|
||
this.btnLoading = false;
|
||
return;
|
||
}
|
||
if (this.sysType.length > 2) {
|
||
this.courseInfo.sysType3 = this.sysType[2]; //资源归属三级的id
|
||
}
|
||
// let postData = {
|
||
// course: this.courseInfo,
|
||
// // teachers: this.teacherName
|
||
// };
|
||
apiCourse
|
||
.saveOnlyCourse(this.courseInfo)
|
||
.then(res => {
|
||
if (res.status === 200) {
|
||
|
||
this.$message.success("操作成功！");
|
||
// let result = res.result;
|
||
this.isEdit = true;
|
||
this.courseInfo = result.course;
|
||
// this.curCourseId = result.course.id; //设置当前课程的id
|
||
this.courseTeachers = result.teachers;
|
||
let list = [];
|
||
// this.courseTeachers.forEach(item => {
|
||
// list.push(item.teacherName);
|
||
// });
|
||
this.btnLoading = false;
|
||
|
||
} else {
|
||
this.$message.error(res.message);
|
||
this.btnLoading = false;
|
||
}
|
||
})
|
||
.catch(err => {
|
||
this.btnLoading = false;
|
||
});
|
||
},
|
||
// 标签远程查询
|
||
async remoteTagMethod(query) {
|
||
if (query) {
|
||
try {
|
||
const { result, status } = await apiTag.findByName(1, query);
|
||
if (status === 200) {
|
||
this.tagList = result;
|
||
}
|
||
} catch (error) {
|
||
console.log(error);
|
||
}
|
||
} else {
|
||
this.tagList = [];
|
||
}
|
||
},
|
||
//获取场景，保留
|
||
async getSceneData() {
|
||
try {
|
||
const { result, status } = await scene.list(1);
|
||
if (status === 200) {
|
||
this.sceneList = result;
|
||
}
|
||
} catch (error) {
|
||
console.log(error);
|
||
}
|
||
},
|
||
// 教师列标，远程查询
|
||
async remoteMethod(query) {
|
||
if (query) {
|
||
this.loading = true;
|
||
try {
|
||
const { result, status } = await apiTeacher.findByName(query);
|
||
if (status === 200) {
|
||
let list = [];
|
||
result.forEach(item => {
|
||
list.push({
|
||
teacherId: item.id,
|
||
teacherName: item.name
|
||
});
|
||
});
|
||
this.teacherList = list;
|
||
this.loading = false;
|
||
}
|
||
} catch (error) {
|
||
this.loading = false;
|
||
}
|
||
} else {
|
||
this.teacherList = [];
|
||
}
|
||
},
|
||
uploadCoverImgSuccess(res) {
|
||
this.courseInfo.coverImg = res.result.filePath;
|
||
this.courseCoverurl = res.result.httpPath;
|
||
},
|
||
removeCoverImgSuccess() {
|
||
this.courseCoverurl = "";
|
||
this.courseInfo.coverImg = "";
|
||
},
|
||
getDetail() {
|
||
apiCoursePortal.detail(this.id,true).then(rs => {
|
||
if (rs.status == 200) {
|
||
this.courseInfo = rs.result.course;
|
||
//加载所属机构名称
|
||
this.orgKid='';
|
||
if(this.courseInfo.orgId){
|
||
apiUserBasic.getOrgInfo(this.courseInfo.orgId).then(rrs=>{
|
||
if(rs.status==200){
|
||
this.orgName=rrs.result.name;
|
||
//this.orgKid=rrs.result.kid;
|
||
//this.orgNamePath=rrs.result.namePath;
|
||
}
|
||
});
|
||
// apiOrg.getSimple(this.courseInfo.orgId).then(rrs=>{
|
||
// if(rrs.status==200){
|
||
// this.orgName=rrs.result.name;
|
||
// this.orgKid=rrs.result.kid;
|
||
// }
|
||
// })
|
||
}else{
|
||
//根据课程创建者获取机构id
|
||
apiUser.getOrgSimpleByUserId(this.courseInfo.sysCreateAid).then(ors=>{
|
||
if(ors.status==200){
|
||
$this.courseInfo.orgId=ors.result.id;
|
||
|
||
apiUserBasic.getOrgInfo(ors.result.id).then(rrs=>{
|
||
if(rs.status==200){
|
||
$this.orgName=rrs.result.name;
|
||
//this.orgKid=rrs.result.kid;
|
||
//$this.orgNamePath=rrs.result.namePath;
|
||
}
|
||
});
|
||
// apiOrg.getSimple(ors.result.id).then(rrs=>{
|
||
// if(rrs.status==200){
|
||
// $this.orgName=rrs.result.name;
|
||
// $this.orgKid=rrs.result.kid;
|
||
// }
|
||
// })
|
||
}else{
|
||
//
|
||
}
|
||
})
|
||
}
|
||
if(rs.result.course.coverImg !== '') {
|
||
this.courseCoverurl = this.fileBaseUrl + rs.result.course.coverImg;
|
||
}
|
||
this.teacherList = rs.result.teachers;
|
||
this.teacherName = rs.result.teachers;
|
||
this.teacher = rs.result.teachers.map(item => {
|
||
return `${item.teacherName}(${item.userNo})`
|
||
});
|
||
this.showTags = this.courseInfo.tags.split(",");
|
||
if (rs.result.course.resOwner3 == "") {
|
||
this.resOwnerArray = [
|
||
rs.result.course.resOwner1,
|
||
rs.result.course.resOwner2
|
||
];
|
||
} else {
|
||
this.resOwnerArray = [
|
||
rs.result.course.resOwner1,
|
||
rs.result.course.resOwner2,
|
||
rs.result.course.resOwner3
|
||
];
|
||
}
|
||
if (
|
||
rs.result.course.sysType3 == "" &&
|
||
rs.result.course.sysType2 == ""
|
||
) {
|
||
this.sysType = [rs.result.course.sysType1];
|
||
} else if (rs.result.course.sysType3 == "") {
|
||
this.sysType = [
|
||
rs.result.course.sysType1,
|
||
rs.result.course.sysType2
|
||
];
|
||
} else {
|
||
this.sysType = [
|
||
rs.result.course.sysType1,
|
||
rs.result.course.sysType2,
|
||
rs.result.course.sysType3
|
||
];
|
||
}
|
||
this.teachers = rs.result.teachers;
|
||
this.contentList = rs.result.contents;
|
||
let treeList = [];
|
||
rs.result.sections.forEach(sec => {
|
||
let treeNode = { section: sec, contents: [] };
|
||
rs.result.contents.forEach(c => {
|
||
if (c.csectionId == sec.id) {
|
||
treeNode.contents.push(c);
|
||
}
|
||
});
|
||
treeList.push(treeNode);
|
||
});
|
||
this.catalogTree = treeList;
|
||
} else {
|
||
this.$message.error(rs.message);
|
||
}
|
||
});
|
||
},
|
||
ctabChange(tab) {
|
||
if (tab.name == "info") {
|
||
this.activeName = "catalog";
|
||
}
|
||
},
|
||
showRes(r) {
|
||
// this.contentDataShow = true;
|
||
this.contentData = r;
|
||
if(r.contentType == 10 ||r.contentType == 20){
|
||
if(r.content.startsWith('\{')){
|
||
this.curriculumData = JSON.parse(r.content)
|
||
}else{
|
||
this.curriculumData.url = r.content
|
||
}
|
||
} else if(r.contentType == 40) {
|
||
this.contentData.content="";
|
||
apiCourseFile.detail(r.contentRefId).then(cfrs => {
|
||
if (cfrs.status == 200) {
|
||
this.curCFile=cfrs.result;
|
||
this.contentData.content = cfrs.result.previewFilePath;
|
||
this.converStatus = cfrs.result.converStatus;
|
||
//下面是为了兼容老数据
|
||
if(cfrs.result.previewFilePath == '' && cfrs.result.filePath.indexOf('pdf') > -1) {
|
||
this.contentData.content = cfrs.result.filePath;
|
||
}
|
||
//设置状态
|
||
if(this.contentData.content && this.contentData.content.indexOf('pdf') > -1){
|
||
if(!this.converStatus || this.converStatus<2){
|
||
this.converStatus=2;
|
||
}
|
||
}
|
||
//console.log(r.content);
|
||
}else {
|
||
this.$message.error('加载pdf课件文件失败');
|
||
}
|
||
});
|
||
|
||
}else if(r.contentType == 50){
|
||
apiCourseFile.detail(r.contentRefId).then(scormFile => {
|
||
if (!scormFile.status == 200) {
|
||
$this.$message.error('加载SCORM课件失败');
|
||
}else{
|
||
var curContent=scormFile.result;
|
||
//console.log(curContent,'curContent')
|
||
if(!curContent.content){
|
||
this.$message({type: 'error',message: '无SCORM内容，SCORM包解析失败'});
|
||
return;
|
||
}
|
||
//scorm课件的内容，取第一个sco
|
||
var scorm=JSON.parse(curContent.content);
|
||
//console.log(scorm,'scorm')
|
||
if(scorm){
|
||
let urlPre=window.location.protocol;
|
||
let configUrl=process.env.VUE_APP_SCORM_URL;
|
||
configUrl=urlPre+configUrl.substring(configUrl.indexOf(':')+1);
|
||
//这里需要提取的到配置文件中，实际中只需要传 rowId就可以了
|
||
this.scormUrl=configUrl+'?mode=preview&scormId='+curContent.id;//播放的首页
|
||
}else{
|
||
this.$message({type: 'error',message: 'SCORM包解析失败'});
|
||
}
|
||
}
|
||
});
|
||
}
|
||
this.type = 0;
|
||
},
|
||
formatChoose(format) {
|
||
let text = "";
|
||
switch (format) {
|
||
case 1: {
|
||
text = "视频";
|
||
break;
|
||
}
|
||
case 2: {
|
||
text = "音频";
|
||
break;
|
||
}
|
||
case 3: {
|
||
text = "文档";
|
||
break;
|
||
}
|
||
case 4: {
|
||
text = "图文";
|
||
break;
|
||
}
|
||
case 5: {
|
||
text = "外部链接";
|
||
break;
|
||
}
|
||
case 6: {
|
||
text = "作业";
|
||
break;
|
||
}
|
||
case 7: {
|
||
text = "考试";
|
||
break;
|
||
}
|
||
case 8: {
|
||
text = "评估";
|
||
break;
|
||
}
|
||
}
|
||
return text;
|
||
},
|
||
statusToContent(status) {
|
||
let data = null;
|
||
switch (status) {
|
||
case 1: {
|
||
data = {
|
||
text: "[未开始]",
|
||
class: "catalog-cell-state1"
|
||
};
|
||
break;
|
||
}
|
||
case 2: {
|
||
data = {
|
||
text: "[进行中]",
|
||
class: "catalog-cell-state2"
|
||
};
|
||
break;
|
||
}
|
||
case 3: {
|
||
data = {
|
||
text: "[已完成]",
|
||
class: "catalog-cell-state9"
|
||
};
|
||
break;
|
||
}
|
||
default:
|
||
{
|
||
data = {
|
||
text: "[未开始]",
|
||
class: "catalog-cell-state1"
|
||
};
|
||
}
|
||
break;
|
||
}
|
||
return data;
|
||
}
|
||
}
|
||
};
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.grid-info {
|
||
display: flex;
|
||
padding: 0 20px;
|
||
.grid-item {
|
||
flex: 1;
|
||
.item-one {
|
||
font-size: 18px;
|
||
height: 20px;
|
||
}
|
||
.item-title {
|
||
font-size: 16px;
|
||
font-weight: 600;
|
||
}
|
||
}
|
||
}
|
||
::v-deep .picture-text{
|
||
img{
|
||
width: 100%;
|
||
}
|
||
}
|
||
.catalog {
|
||
::v-deep .el-collapse-item__header{
|
||
line-height: 2;
|
||
height: 60px;
|
||
}
|
||
.catalog-row {
|
||
margin: 0px;
|
||
padding: 0px 10px 10px 10px;
|
||
ul {
|
||
padding: 0px;
|
||
margin: 0px;
|
||
}
|
||
.catalog-cell {
|
||
line-height: 32px;
|
||
cursor: pointer;
|
||
list-style: none;
|
||
margin: 0px;
|
||
padding-left: 20px;
|
||
color: #5c5c5c;
|
||
}
|
||
}
|
||
}
|
||
</style>
|