<template>
  <div class="manager">
    <!--课程管理-->
    <div>
      <el-form>
        <el-row :gutter="20">
          <el-col :span="24"><el-form-item label="课程:">{{manageStudyData.name}}</el-form-item></el-col>
          <el-col :span="8"><el-form-item label="类型:">{{courseType(manageStudyData.type)}}</el-form-item></el-col>
          <el-col :span="8"><el-form-item label="内容分类:">{{sysTypeName(this.manageStudyData.sysType1)}}{{this.manageStudyData.sysType2 == ''? '': '/'}}{{sysTypeName(this.manageStudyData.sysType2)}}{{this.manageStudyData.sysType3 == ''? '': '/'}}{{sysTypeName(this.manageStudyData.sysType3)}}</el-form-item></el-col>
          <el-col :span="8"><el-form-item label="状态:">{{manageStudyData.status == 1? '未审核':'已审核'}}</el-form-item></el-col>
        </el-row>
      </el-form>
    </div>
    <!-- <div style="color: red;">下面的表格标题及内容需要调整完善</div> -->
    <div>
      <el-tabs v-model="tabName" @tab-click="handleTabClick">
        <el-tab-pane label="报名管理" name="second">
          <!-- <div>已报名{{study.list.length}}人，共有0人报名未成功，共有{{study.list.length}}人通过审核</div> -->
          <el-row style="margin: 20px 0;" :gutter="20">
            <!-- <el-col :span="4">
              <div class="grid-content bg-purple"><el-input v-model="input"  placeholder="手动添加：姓名/工号" /></div>
            </el-col>
            <el-col :span="2">
              <div class="grid-content bg-purple">
                <el-button type="primary" style="margin-left: 20px;" >确定</el-button>
              </div>
            </el-col>
              <el-col :span="2">
              <div class="grid-content bg-purple">
                <el-button type="primary" >导入学员</el-button>
              </div>
            </el-col> -->
            <el-col :offset="13" :span="4">
              <div class="grid-content bg-purple">
                <el-select v-model="signup.status"  placeholder="状态" clearable>
                  <el-option label="未审核" :value="1"></el-option>
                  <el-option label="已通过" :value="9"></el-option>
                  <el-option label="管理员拒绝" :value="3"></el-option>
                </el-select>
              </div>
            </el-col>
            <el-col :span="4">
              <div class="grid-content bg-purple"><el-input v-model="signup.name" clearable  placeholder="姓名" /></div>
            </el-col>
            <el-col :span="2">
              <div class="grid-content bg-purple">
                <el-button type="primary" @click="getSignupList()" >搜 索</el-button>
              </div>
            </el-col>
              <!-- <el-col :span="2"> -->
              <!-- <div class="grid-content bg-purple">
                <el-button type="primary" >导出</el-button>
              </div> -->
            <!-- </el-col> -->
          </el-row>
          <div class="tab-content">
            <!-- @selection-change="handleSelectionChange" -->
            <el-table border max-height="350" :data="study.list" style="width: 100%">
              <!-- <el-table-column type="selection" width="55"></el-table-column> -->
              <el-table-column prop="name" label="姓名"></el-table-column>
              <el-table-column prop="code" label="工号">
              </el-table-column>
              <el-table-column prop="signTime" label="报名时间" width="180"></el-table-column>
              <el-table-column prop="status" label="状态" width="180">
                <template slot-scope="scope">
                  {{scope.row.status == '9'? '已通过': '未审核'}}
                </template>
              </el-table-column>
              <el-table-column label="操作" width="180">
                <template slot-scope="scope">
                  <!-- <el-button type="text" plain style="margin-left: 20px;" size="mini">审核</el-button> -->
                  <el-button type="text" style="margin-left: 20px;" v-if="scope.row.status < '9'"  @click="deleteSignup(scope.row)">删除</el-button>
                </template>
              </el-table-column>
            </el-table>
            <div style="padding: 10px;">
              <!-- <el-button type="primary" >发送邮件</el-button>
              <el-button type="primary" >群发邮件</el-button>
              <el-button type="primary" >存为受众</el-button> -->
              <div style="text-align:center">
                    <el-pagination
                      @size-change="handleSizeChange"
                      @current-change="handleCurrentChange"
                      :current-page="study.pageIndex"
                      :page-sizes="[10, 20, 30, 40]"
                      :page-size="study.pageSize"
                      layout="total, sizes, prev, pager, next, jumper"
                      :total="study.count"></el-pagination>
              </div>
            </div>
          </div>
        </el-tab-pane>
        <el-tab-pane label="学习记录" name="third">
          <el-row style="margin-bottom: 20px;">
            <el-col :offset="12" :span="4">
              <div class="grid-content bg-purple">
                <el-select v-model="learningRecords.status" clearable placeholder="状态">
                  <el-option label="已完成" :value="9"></el-option>
                  <el-option label="未开始" :value="1"></el-option>
                  <el-option label="进行中" :value="8"></el-option>
                </el-select>
              </div>
            </el-col>
            <el-col :offset="1" :span="4">
              <div class="grid-content bg-purple"><el-input clearable v-model="learningRecords.name" placeholder="姓名"></el-input></div>
            </el-col>
            <el-col :offset="1" :span="2">
              <div class="grid-content bg-purple"><el-button type="primary" @click="getStudyRecords">搜索</el-button></div>
            </el-col>
          </el-row>
          <div class="tab-content">
            <el-table max-height="400" border :data="learningRecords.list" style="width: 100%">
              <el-table-column prop="aname" label="姓名" width="100"></el-table-column>
              <el-table-column prop="addTime" label="学习时间"></el-table-column>
              <!-- <el-table-column prop="finishTime" label="结束时间"></el-table-column> -->
              <el-table-column prop="totalDuration" label="学习时长(分)">
                 <template slot-scope="scope">
                  {{ scope.row.totalDuration == 0? '0': (scope.row.totalDuration/60).toFixed(2)}}
                </template>
              </el-table-column>
              <el-table-column prop="progress" label="进度">
                   <template slot-scope="scope">
                  {{ scope.row.progress }}%
                </template>
              </el-table-column>
              <el-table-column label="状态">
                <template slot-scope="scope">
                  {{ scope.row.status == 1?'未开始': scope.row.status == 9?'已完成':'进行中'}}
                </template>
              </el-table-column>
              <el-table-column prop="orgInfo" label="操作" width="120">
                <template slot-scope="scope">
                  <!--弹出每一项资源的学习情况列表-->
                  <el-button type="info" @click="showStudyDetails(scope.row)" >查看详细</el-button>
                </template>
              </el-table-column>
            </el-table>

            <div style="text-align: center;">
               <el-pagination
                      @size-change="handleSizeChangeRecords"
                      @current-change="handleCurrentChangeRecords"
                      :current-page="learningRecords.pageIndex"
                      :page-sizes="[10, 20, 30, 40]"
                      :page-size="learningRecords.pageSize"
                      layout="total, sizes, prev, pager, next, jumper"
                      :total="learningRecords.count">
                    </el-pagination>
          </div>
          </div>
        </el-tab-pane>
        <el-tab-pane label="资源完成情况" name="first">
          <el-row style="margin-bottom: 20px;">
            <el-col :span="3">
              <div class="grid-content bg-purple">
                课程目录:
              </div>
            </el-col>
              <el-col :span="5">
              <div class="grid-content bg-purple">
               <el-input v-model="value" placeholder="课程目录" clearable/>
              </div>
            </el-col>
              <el-col :span="2">
              <div class="grid-content bg-purple">
                <el-button style="margin-left: 20px;" type="primary" @click="searchData">搜索</el-button>
              </div>
            </el-col>
              <el-col :span="14">
              <div class="grid-content bg-purple" style="text-align: right;">
                 <!-- <el-button type="primary">评估汇总数据导出</el-button>
                 <el-button type="primary" style="margin-left: 20px">评估详细数据导出</el-button> -->
              </div>
            </el-col>
          </el-row>
          <div class="tab-content">
            <el-table max-height="400" border :data="catalogList" style="width: 100%">
              <el-table-column label="课程目录">
                <template slot-scope="scope">
                  {{scope.row.chapterName}}{{scope.row.chapterName? '--': ''}}{{scope.row.contentName}}
                </template>
              </el-table-column>
              <!-- <el-table-column prop="status" label="状态">
                <template slot-scope="scope">
                  <span>{{scope.row.status == 9? '已完成':'未开始'}}</span>
                </template>
              </el-table-column>
              <el-table-column prop="duration" label="时长(分)">
                <template slot-scope="scope">
                  {{scope.row.duration == 0?'0':(scope.row.duration/60).toFixed(2)}}
                </template>
              </el-table-column>-->
              <el-table-column label="学习人员" width="110">
                <template slot-scope="scope">
                  <el-button size="mini" type="info" @click="getCatalogue(scope.row,scope.row.contentType)" >学习人员</el-button>
                </template>
              </el-table-column>
            </el-table>
          </div>
        </el-tab-pane>
      </el-tabs>
    </div>
    <!--查看评估详情-->
    <el-dialog custom-class="g-dialog" title="评估详情" :visible.sync="assessmentShow" :append-to-body="true">
      <div class="ment-div">
        <div class="ment-box">
          <p>hf/测试时长 / 视频 /</p>
          <p>[实名评估] 培训评估</p>
          <p>已有5人5人报名, 已有1人参加, 已有1人完成</p>
        </div>
        <div>
          <div style="  font-size: 24px; margin: 10px 0;">评估人员</div>

          <el-row :gutter="20" style="margin-bottom: 20px;">
            <el-col :span="5">
              <div class="grid-content bg-purple">
                <el-select v-model="value" placeholder="状态">
                  <el-option label="已完成" value="已完成"></el-option>
                  <el-option label="未开始" value="未开始"></el-option>
                  <el-option label="进行中" value="进行中"></el-option>
                </el-select>
              </div>
            </el-col>
            <el-col :span="4">
              <div class="grid-content bg-purple"><el-input v-model="input" placeholder="姓名"></el-input></div>
            </el-col>
            <el-col :span="8">
              <div class="grid-content bg-purple">
                <el-button type="primary">搜索</el-button>
                <el-button>重置</el-button>
                <el-button>导出</el-button>
              </div>
            </el-col>
          </el-row>
          <el-table max-height="500" border :data="study.detailsList" style="width: 100%">
            <el-table-column prop="name" label="姓名" width="180"></el-table-column>
            <el-table-column prop="content" label="部门"></el-table-column>
            <el-table-column prop="progress" label="岗位"></el-table-column>
            <el-table-column prop="emil" label="邮箱"></el-table-column>
            <el-table-column prop="time" label="完成时间"></el-table-column>
            <el-table-column label="状态" prop="type" width="100"></el-table-column>
          </el-table>
        </div>
      </div>
      <template #footer>
        <el-button @click="assessmentShow = false">关闭</el-button>
      </template>
    </el-dialog>
    <!-- 课程详情 -->
    <el-dialog title="课程详情" :visible.sync="study.detailShow" width="900px" :append-to-body="true">
       <div>
        <!-- <div v-if="study.detailType == 10"><auditCourse1 :isDetails="true" :isShow="false" :id="study.examineId"></auditCourse1></div>
        <div v-if="study.detailType == 20"><auditCourse2 :isDetails="true" :isShow="false" :id="study.examineId"></auditCourse2></div> -->
         <el-table max-height="500" border :data="this.courseStudyList" style="width: 100%">
              <el-table-column label="课程目录">
                <template slot-scope="scope">
<!--                  {{scope.row.chapterName}}{{scope.row.chapterName? '&#45;&#45;': ''}}{{scope.row.contentName}}-->
                  {{scope.row.contentName}}
                </template>
              </el-table-column>
              <el-table-column prop="status" label="状态">
                <template slot-scope="scope">
                  <!-- <span v-if="scope.row.contentName.split('--')[1]=='考试'">{{scope.row.status == 9? '已完成':scope.row.status == 2?'进行中':'未开始'}}</span> -->
                  <span>{{scope.row.status == 9? '已完成':scope.row.status == 2?'进行中':'未开始'}}</span>
                </template>
              </el-table-column>
              <el-table-column prop="duration" label="进度">
                <template slot-scope="scope">
<!--                  {{scope.row.studyDuration == 0?'0':scope.row.studyDuration/60}}-->
                  {{scope.row.studyDuration}}
                </template>
              </el-table-column>
            </el-table>
       </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="study.detailShow = false">取 消</el-button>
      </span>
    </el-dialog>
    <!-- 每人学习记录 -->
    <el-dialog v-if="study.catalogueShow" title="学习情况" :visible.sync="study.catalogueShow" width="50%" :append-to-body="true">
      <el-form :inline="true" :model="learningSituation" class="demo-form-inline">
        <el-form-item label="姓名:">
          <el-input v-model="learningSituation.name" placeholder="姓名" clearable></el-input>
        </el-form-item>
        <el-form-item label="状态:">
          <el-select v-model="learningSituation.status" clearable placeholder="状态">
            <el-option label="未开始" :value="1"></el-option>
            <el-option label="进行中" :value="3"></el-option>
            <el-option label="已完成" :value="2"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="studyContentRecords">搜索</el-button>
        </el-form-item>
        <el-button v-if="isHomeWork" style="padding:10px 15px;margin-bottom: 10px;" type="primary" @click="downLoad">导出全部作业</el-button>
      </el-form>
      <el-table max-height="500" border :data="learningSituation.list" style="width: 100%">
        <el-table-column prop="aname" label="姓名" width="180"></el-table-column>
        <el-table-column prop="score" label="成绩"></el-table-column>
        <el-table-column prop="finishTime" label="完成时间" width="180"></el-table-column>
        <el-table-column label="状态"  width="100">
            <template slot-scope="scope">
                 {{!typePress?scope.row.progress+'%':scope.row.status==9?'已完成':scope.row.status==2?'进行中':'未开始'}}
                </template>
        </el-table-column>
      </el-table>
      <div style="text-align: center;padding: 10px;">
         <el-pagination
                      @size-change="handleSizeChangeSituation"
                      @current-change="handleCurrentSituation"
                      :current-page="learningSituation.pageIndex"
                      :page-sizes="[10, 20, 30, 40]"
                      :page-size="learningSituation.pageSize"
                      layout="total, sizes, prev, pager, next, jumper"
                      :total="learningSituation.count"></el-pagination>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="study.catalogueShow = false">取 消</el-button>
        <!-- <el-button type="primary" @click="study.detailShow = false">提交</el-button> -->
      </span>
    </el-dialog>
  </div>
</template>

<script>
import {
  courseType,
  resOwnerListMap,
  // sysTypeList,
  getType
} from "../../utils/tools.js";
import auditCourse1 from '@/components/Course/auditCourse1.vue';
import auditCourse2 from '@/components/Course/auditCourse2.vue';
import apicourseStudy from "@/api/modules/courseStudy.js";
import apiCoursePortal from "@/api/modules/coursePortal.js";
import { mapGetters,mapActions } from 'vuex';
import apiUser from '@/api/system/user.js';
import apiStudy from '@/api/modules/courseStudy.js';
import { getToken } from '@/utils/token'
import axios from 'axios'
export default {
  components: {auditCourse1,auditCourse2},
  computed: {
      ...mapGetters(['resOwnerMap','sysTypeMap']),
  },
  props: {
    manageStudyData: {
      type: Object,
      default: () => ({})
    }
  },
  data() {
    return {
      downParams: {},
      typePress: false,
      isHomeWork: false,
      catalogRecordTree:[],
      catalogRecordList:[],
      resOwnerListMap:[],
      sysTypeListMap:[],
      catalogList: [],
      courseStudyList: [],
      sysType: "",
      // sysTypeList: sysTypeList,
      treeList: [],
      contentId: "",
      catalogTree: [],
      signup: {},
      courseType: courseType,
      multipleSelection: [],
      assessmentShow: false,
      value: "",
      input: "",
      tabName: "second",
      learningSituation: {
        pageIndex: 1, //第几页
        pageSize: 10, // 每页多少条
        count: 0,
        type: "",
        list: []
      },
      learningRecords: {
        pageIndex: 1, //第几页
        pageSize: 10, // 每页多少条
        count: 0,
        type: "",
        list: []
      },
      study: {
        detailType: '',
        examineId: '',
        pageIndex: 1, //第几页
        pageSize: 10, // 每页多少条
        count: 0,
        type: "",
        list: [],
        catalogueShow: false,
        detailsList: [],
        detailShow: false
      }
    };
  },
  watch:{
    manageStudyData(val){
     if(val){
       this.tabName = 'second';
       this.study.list = [];
       if (this.tabName === "second") {
        this.getSignupList();
      } else if (this.tabName === "third") {
        this.getStudyRecords();
      } else {
        // 资源
        this.getDetail();
      }
     }
    }
  },
  mounted() {
    this.getSignupList();
    this.getResOwnerTree().then(rs=>{
      this.resOwnerListMap=rs;
    });
    this.getSysTypeTree().then(rs=>{
      this.sysTypeListMap=rs;
    })
  },
  methods: {
    ...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);
    },
    searchData() {
      //  搜索的数据
      if (this.value !== "") {
        this.catalogList = this.catalogTree.filter(item => {
          return (
            item.contentName.toLowerCase().indexOf(this.value.toLowerCase()) >
            -1
          );
        });
      } else {
        this.catalogList = this.catalogTree;
      }
    },
    getDetail() {
      apiCoursePortal.detail(this.manageStudyData.id,true).then(rs => {
        if (rs.status == 200) {
          let treeList = [];
          if (rs.result.sections.length > 0) {
            rs.result.sections.forEach(sec => {
              rs.result.contents.forEach(c => {
                if (c.csectionId == sec.id) {
                  c.chapterName = sec.name;
                  treeList.push(c);
                }
              });
            });
          } else {
            rs.result.contents.forEach(item => {
              if (rs.result.course.type == 10) {
                item.chapterName = rs.result.course.name;
                if (item.sortIndex == 2) item.contentName = "作业";
                if (item.sortIndex == 3) item.contentName = "考试";
                if (item.sortIndex == 4) item.contentName = "评估";
              }
            });
            treeList = rs.result.contents;
          }
          this.catalogTree = treeList;
          this.catalogList = treeList;

        } else {
          this.$message.error(rs.message);
        }
      });
    },
    // 资源里的学习详情
    studyContentRecords() {
      let params = {
        courseId: this.manageStudyData.id, //课程的id
        status: this.learningSituation.status, //状态
        name: this.learningSituation.name, //学习人的姓名
        contentId: this.contentId, //课程内容id
        pageIndex: this.learningSituation.pageIndex,
        pageSize: this.learningSituation.pageSize
      };
      this.downParams = params;
      apicourseStudy.studyContentRecords(params).then(res => {
        if (res.status === 200) {
          this.learningSituation.list = res.result.list;
          this.learningSituation.count = res.result.count;
        } else {
          this.$message.error(res.message);
        }
      });
    },
    downLoad(){
      if(this.learningSituation.list.length == 0){
        this.$message.warning('当前暂无数据');
        return
      }
      let params = {
        courseName:this.manageStudyData.name,
        courseId: this.manageStudyData.id,
        status: this.downParams.status || '',
        name: this.downParams.name || '',
        contentId: this.contentId,
      }
      // window.open(`/systemapi/xboe/m/course/portal/export?contentId=${params.contentId}&courseName=${params.courseName}&courseId=${params.courseId}&status=${params.status}&name=${params.name}`)
      const url = `/systemapi/xboe/m/course/portal/export?contentId=${params.contentId}&courseName=${params.courseName}&courseId=${params.courseId}&status=${params.status}&name=${params.name}`
      // axios({
      //     method: 'get',
      //     url: url,
      //     responseType: 'blob',
      //     headers: { 'X-Access-Token': getToken() }
      //   }).then((res) => {
      //     this.resolveBlob(res, 'application/zip',`${params.courseName}【作业】`)
      //   })
      axios({
          method: 'get',
          url: url,
          responseType: 'blob',
          headers: { 'X-Access-Token': getToken() }
        }).then((response) => {
            if (response.status === 200) {
              if (!(response.headers['content-type']).startsWith('application/json')) {
                this.resolveBlob(response, 'application/zip', `${params.courseName}【作业】`);
              } else {
                const reader = new FileReader();
                reader.onload = function(e) {
                  const errorData = JSON.parse(e.target.result)
                  console.log(errorData.result,'result')
                  const message = errorData.result
                  this.$message.error(message)
                  this.$message.error(errorData.result)
                };
                reader.readAsText(response.data);
              }
            }
          }).catch((error) => {
            // 错误处理
            console.log(error);
            this.$message.error(error.data ? error.data.message : error.toString());
          });
    },
    resolveBlob(res, mimeType,filename) {
      const link = document.createElement('a');// 创建a标签
      let blob = new Blob([res.data], { type: mimeType }); // 设置文件类型
      link.style.display = "none";
      link.href = URL.createObjectURL(blob); // 创建URL
      link.setAttribute("download", `${filename}`);
      document.body.appendChild(link);
      link.click();
      URL.revokeObjectURL(link.href);
      document.body.removeChild(link);
    },
    handleSizeChangeSituation(val) {
      this.learningSituation.pageSize = val;
      this.learningSituation.pageIndex = 1;
      this.studyContentRecords();
    },
    handleCurrentSituation(val) {
      this.learningSituation.pageIndex = val;
      //console.log('learningSituation.pageIndex',this.learningSituation.pageIndex);
      this.studyContentRecords();
    },
    // 学习记录
    getStudyRecords() {
      let params = {
        courseId: this.manageStudyData.id, //课程的id
        status: this.learningRecords.status, //状态
       // courseType:this.learningRecords.type,//类型
        aname: this.learningRecords.name, //学习人的姓名  learningRecords
        pageIndex: this.learningRecords.pageIndex,
        pageSize: this.learningRecords.pageSize
      };
      apicourseStudy.myCourseStudy(params).then(res => {
        if (res.status === 200) {
          this.learningRecords.list = res.result.list;
          this.learningRecords.count = res.result.count;
        } else {
          this.$message.error(res.message);
        }
      });
    },
    getRecordDetail(id) {
      apiCoursePortal.detail(id,true).then(rs => {
        if (rs.status == 200) {
          let treeList = [];
          if (rs.result.sections.length > 0) {
            rs.result.sections.forEach(sec => {
              rs.result.contents.forEach(c => {
                if (c.csectionId == sec.id) {
                  c.chapterName = sec.name;
                  treeList.push(c);
                }
              });
            });
          } else {
            rs.result.contents.forEach(item => {
              if (rs.result.course.type == 10) {
                item.chapterName = rs.result.course.name;
                if (item.sortIndex == 2) item.contentName = "作业";
                if (item.sortIndex == 3) item.contentName = "考试";
                if (item.sortIndex == 4) item.contentName = "评估";
              }
            });
            treeList = rs.result.contents;
          }
          this.catalogRecordTree = treeList;
          this.catalogRecordList = treeList;
          this.loadStudyData(id);
        } else {
          this.$message.error(rs.message);
        }
      });
    },
    getStudyDetail(courseId,aid){
      apiCoursePortal.detailStudy(courseId,aid).then(res =>{
        if (res.status == 200) {
          this.courseStudyList=res.result;
        }else {
          this.courseStudyList=[];
        }
      });
    },
     loadStudyData(courseId) {
      let $this=this;
      apiStudy.studyInfo(courseId).then(res=>{
        if(res.status == 200) {
          if(res.result.signup){
              this.studyId = res.result.studyId;
              //对已学习的内容进行比对，重要的字段， 学习内容id，在后缀的
              let playIndex=-1;
              this.catalogRecordTree.forEach((con,conIdx)=>{
                res.result.contents.forEach((scon,sconIdx)=>{
                    if(scon.contentId==con.id){
                      //定位显示的内容
                      if($this.initContentId!='' && $this.initContentId==scon.contentId){
                          //定位当前学习的内容，是上一次学习的内容
                          playIndex=conIdx;
                      }else{
                        if(sconIdx==0 && con.contentType<52){
                          playIndex=conIdx;
                        }
                      }
                       con.lastStudyTime=scon.lastStudyTime;
                       con.status=9;//因为现在是只要有学习过的，就代表已学习完成,所以直接设置学习完成状态,
                       con.studyItemId=scon.id;//这个就是学习内容（条目）的id
                    }
                })
              });
              //如果没有，就定位第一项内容
              if(playIndex==-1){
                 this.showRes(this.contentList[0]);
              }else{
                 this.showRes(this.contentList[playIndex]);
              }
            }else{
              this.$message.error('您还未报名');
              // if(this.courseInfo.type==10){
              //   location.href = this.webBaseUrl + "/course/micro?id="+this.courseId;
              // }else{
                location.href = this.webBaseUrl + "/course/detail?id="+this.courseId;
              // }
            }
         } else {
            this.$message.error(res.message);
         }
      })
    },
    handleSizeChangeRecords(val) {
      this.learningRecords.pageSize = val;
      this.learningRecords.pageIndex = 1;
      this.getStudyRecords();
    },
    handleCurrentChangeRecords(val) {
      this.learningRecords.pageIndex = val;
      this.getStudyRecords();
    },
    // 删除报名人员
    deleteSignup(row) {
      this.$confirm("您确定要删除报名人员吗？", "删除提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          apicourseStudy.deleteSignup(row.id).then(res => {
            if (res.status === 200) {
              this.$message.success("操作成功！");
              this.getSignupList();
            } else {
              this.$message.error(res.message);
            }
          });
        })
        .catch(err => {
          this.$message({ type: "info", message: "已取消删除", offset: 50 });
        });
    },
    // 报名列表
    getSignupList() {
      let params = {
        courseId: this.manageStudyData.id, //课程的id
        status: this.signup.status, //状态
        name: this.signup.name, //姓名
        pageIndex: this.study.pageIndex,
        pageSize: this.study.pageSize,
        aid:this.study.aid
      };

      apicourseStudy.findSignup(params).then(res => {
        if (res.status === 200) {
          let ids = [];
          res.result.list.forEach(item => {
            item.code = '';
            ids.push(item.aid);
          });
          this.getQaUserData(res.result.list, ids);
           this.study.list = res.result.list;
          this.study.count = res.result.count;
        } else {
          this.$message.error(res.message);
        }
      });
    },
    getQaUserData(list, ids) {
      const noReapetIds = [...new Set(ids)];
      apiUser.getByIds(noReapetIds).then(res => {
        if (res.status == 200) {
          list.forEach(item => {
            res.result.some(author => {
              if (author.aid == item.aid) {
                item.code = author.code;
              }
            });
             this.study.list = list;
          });
        } else {
          this.$message({ message: res.message, type: 'error' });
        }
      });
    },
    handleSizeChange(val) {
      this.study.pageSize = val;
      this.study.pageIndex = 1;
      this.getSignupList();
    },
    handleCurrentChange(val) {
      this.study.pageIndex = val;
      this.getSignupList();
    },
    getCatalogue(row,type) {
      if(type==61){
        this.typePress = true
      }else{
        this.typePress = false
      }
      if(type == 60){
        this.isHomeWork = true
      }else{
        this.isHomeWork = false
      }
      this.contentId = row.id;
      this.study.catalogueShow = true;
      this.learningSituation.pageIndex = 1;//重置为第一页
      this.studyContentRecords();
    },
    handleSelectionChange(val) {
      this.multipleSelection = val;
    },
    handleTabClick(tab) {
      this.tabName = tab.name;
      if (tab.name === "second") {
        this.getSignupList();
      } else if (tab.name === "third") {
        this.getStudyRecords();
      } else {
        // 资源
        this.getDetail();
      }
    },
    showStudyDetails(row) {
      // this.study.detailType = row.courseType;
      // this.study.examineId = row.courseId;
      this.study.detailShow = true;
      this.getStudyDetail(row.courseId,row.aid);

    }
  }
};
</script>

<style lang="scss">
.ment-div {
  padding: 20px 40px;
  font-size: 20px;
  .ment-box {
    border-bottom: 1px solid #ccc;
    margin-top: 10px;
    .ment-title {
      font-size: 24px;
      margin-bottom: 10px;
    }
  }
  .assess-info {
    padding: 10px 0;
  }
}
.content {
  line-height: 30px;
}
.tab-content {
  height: 400px;
  overflow: auto;
}
</style>
