<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 => item.teacherName);
          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>
