pbl-student-table/src/components/easy/studyStudent.vue

<template>
  <div class="pb_content" style="overflow: unset">
    <div class="pb_content_body" style="display: flex; height: 900px; position: relative">
      <div class="btnAllNT">
        <!-- <img src="../../assets/icon/learn/screen.png" @click="allScrell" /> -->
        <img src="../../assets/icon/learn/last.png" @click="nextOrpreSteps(0)" />
        <img src="../../assets/icon/learn/next.png" @click="nextOrpreSteps(1)" />
        <img src="../../assets/icon/learn/return.png" @click.stop="goTo(
          '/courseDetail?userid=' +
          userid +
          '&oid=' +
          oid +
          '&org=' +
          org +
          '&cid=' +
          classId +
          '&courseId=' +
          id +
          '&tType=' +
          tType +
          '&screenType=' +
          screenType
        )
          " />
      </div>
      <div class="pButton" style="
                                              left: 0;
                                              background-image: linear-gradient(90deg, #477cd7, #65b9fc);
                                            " v-if="mlDialog == false" @click="setContent2(true)">
        <!-- 批 , getCourseDetail()-->
        <img src="../../assets/mlBtn.png" style="width: 25px" alt="" />
      </div>
      <div class="pb_left" v-else>
        <!-- <div class="courseTitle">{{ courseDetail.title }}</div> -->
        <div class="courseTitle">
          <div style="width:calc(100% - 25px)">
            <el-tooltip effect="light" :content="courseDetail.title" placement="top">
              <div class="ctitle">{{ courseDetail.title }}</div>
            </el-tooltip>
            <!-- <div class="inviteBox" v-if="tcid && inviteCode">
              <div><span>随机码：{{ inviteCode }}</span></div>
            </div> -->
          </div>
          <el-tooltip effect="light" content="收缩" placement="top">
            <div class="mlImg" @click="setContent2(false)">
              <img src="../../assets/mlBtn.png" alt="" />
            </div>
          </el-tooltip>
        </div>

        <div class="ml">目录</div>
        <div class="cru_selectBox">
          <div v-for="(item, stageIndex) in navList" :key="stageIndex">
            <div class="blue_box_one" @click="get(stageIndex)">
              <div v-if="courseDetail.state == 1">第{{ stageIndex + 1 }}阶段</div>
              <div v-if="courseDetail.state == 2">任务查看</div>
              <div>{{ item.dyName }}</div>
            </div>
            <div class="twoChild" :class="{ navActive: item.isOpen }">
              <div class="navChild" v-for="(nav, navIndex) in item.task" :key="navIndex">
                <div class="navTask" @click="openTask(stageIndex, navIndex, nav.id)" :class="{
                  openTaskActive:
                    navIndex == taskCount &&
                    nav.id == navId &&
                    stageIndex == courseType,
                }">
                  <div class="vedioNav" :class="{
                    isClick:
                      navIndex == taskCount &&
                      nav.id == navId &&
                      stageIndex == courseType,
                  }" style="margin: 0">
                    任务{{ navIndex + 1 }}
                  </div>
                  <el-tooltip class="navTaskname item" effect="light" :content="nav.taskName" placement="top">
                    <div :style="{
                      width:
                        IsLookOpen && !nav.isLook
                          ? 'calc(100% - 75px)'
                          : 'auto',
                    }">
                      {{ nav.taskName }}
                    </div>
                  </el-tooltip>
                  <img src="../../assets/lock.png" v-if="IsLookOpen && !nav.isLook" alt="" />
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="body_student" :class="{ navLeftCss: !mlDialog }">
        <div class="new_top" style="
                                                position: fixed;
                                                top: 0;
                                                left: 20.7%;
                                                width: 80%;
                                                z-index: 999;
                                                box-shadow: 0px 9px 0 0 #f2f2f2;
                                              " :class="{ navLeftCss: !mlDialog }">
          <div class="courseIndex">
            <div>第{{ courseType - 0 + 1 }}阶段</div>
            <el-tooltip effect="light" :content="chapInfoList[courseType].dyName" placement="top">
              <div>{{ chapInfoList[courseType].dyName }}</div>
            </el-tooltip>
            <div>任务{{ taskCount + 1 }}</div>
          </div>
          <div class="btnAll">
            <div class="returnBtn" @click="nextOrpreSteps(0)">上一步</div>
            <div class="returnBtn" @click="nextOrpreSteps(1)">下一步</div>
            <div class="returnBtn" @click="refreshCourse">刷新</div>
                        <div class="returnBtn" @click="setPz" v-if="tType == 1">评论</div>
            <!-- <div class="returnBtn" @click="allScrell">全屏</div> -->
            <!-- <div class="returnBtn" @click="startRecording" v-if="!videoStart && (tType == 1 || tType == 4)">
              开始录制
            </div>
            <div class="returnBtn" @click="stopRecording" v-else-if="tType == 1 || tType == 4"
              style="background: #ee5255">
              下载录制
            </div>
            <div class="returnBtn" @click="juriVisible = true" v-if="tType == 1">
              权限
            </div> -->
            <div class="returnBtn" style="background: #225bc7" @click.stop="goTo(
              '/courseDetail?userid=' +
              userid +
              '&oid=' +
              oid +
              '&org=' +
              org +
              '&cid=' +
              classId +
              '&courseId=' +
              id +
              '&tType=' +
              tType +
              '&screenType=' +
              screenType
            )
              ">
              返回
            </div>
          </div>
        </div>
        <!-- v-for="(task, index) in chapInfoList[courseType].chapterInfo[0]
            .taskJson"
        :key="index"-->
        <div class="isNoMessage" v-if="chapInfoList[courseType].chapterInfo[0].taskJson[taskCount]
          .chapterData.length == 0 &&
          chapInfoList[courseType].chapterInfo[0].video.length == 0 &&
          chapInfoList[courseType].chapterInfo[0].taskJson[taskCount]
            .taskDetail == '' &&
          !chapInfoList[courseType].chapterInfo[0].taskJson[taskCount].eList
          ">
          <img src="../../assets/icon/isNoMessage.png" alt />
        </div>
        <div class="study_top" :class="{ pzClass: pzDialog }">
          <div class="vedioBox" v-if="vedio[taskCount].length > 0 ||
            chapInfoList[courseType].chapterInfo[0].taskJson[taskCount]
              .taskDetail != '' ||
            chapInfoList[courseType].chapterInfo[0].taskJson[taskCount]
              .chapterData.length > 0
            ">
            <div class="checkbox">
              <div class="check" style="font-size: 25px" :id="chapInfoList[courseType].chapterInfo[0].taskJson[taskCount].id
                ">
                学一学
              </div>
            </div>
            <div class="student_head" v-if="vedio[taskCount].length > 0 ||
              textList[taskCount].length > 0 ||
              lineList[taskCount].length > 0 ||
              file[taskCount].length > 0 ||
              fileC[taskCount].length > 0 ||
              chapInfoList[courseType].chapterInfo[0].taskJson[taskCount]
                .taskDetail != ''
              ">
              <div class="taskBox">
                <div style="
                                                        display: flex;
                                                        flex-wrap: nowrap;
                                                        flex-direction: column;
                                                        position: relative;
                                                      ">
                  <div style="padding: 15px 0 15px 20px; line-height: 25px" class="cont" v-if="chapInfoList[courseType].chapterInfo[0].taskJson[
                    taskCount
                  ].taskDetail != ''
                    " v-html="chapInfoList[courseType].chapterInfo[0].taskJson[
    taskCount
  ].taskDetail
    ? chapInfoList[courseType].chapterInfo[0].taskJson[
      taskCount
    ].taskDetail
    : '暂无描述'
    "></div>
                </div>
              </div>
              <div class="vedioTaskBox">
                <div :class="contentDialog == false
                  ? 'box_course isContentCss'
                  : 'box_course'
                  " v-if="vedio[taskCount].length > 0 ||
    textList[taskCount].length > 0 ||
    lineList[taskCount].length > 0 ||
    file[taskCount].length > 0
    ">
                  <div class="wheel" style="height: auto;" v-if="vedio.length &&
                    vedio[taskCount] &&
                    vedio[taskCount].length > 0 &&
                    showType == 0
                    ">
                    <div class="workd_media" style="height: 650px; width: calc(100% - 50px)">
                      <video-player class="video-player vjs-custom-skin"
                        :class="contentDialog == false ? 'isAllWidth' : ''" :playsinline="true"
                        :options="playerO[taskCount]" @play="onPlayerPlay($event)"
                        style="width: 100%; height: 100%; margin: 0 0 0 30px"></video-player>
                    </div>
                  </div>
                  <div class="wheel" v-if="showType == 1" style="
                                                          box-shadow: 0 0 6px 1px #f2f2f2;
                                                          width: 95%;
                                                          margin: 0 auto;
                                                          background: #f1f1f1;
                                                        ">
                    <div class="title">查看文档</div>
                    <el-form class="textBox">
                      <el-form-item class="textTitle">
                        <div style="font-size: 22px">
                          {{ text.name }}
                        </div>
                      </el-form-item>
                      <!-- <div style="color: #918f8f; width: 85%">文档内容</div> -->
                      <div v-html="text.url" class="textContent cont"></div>
                    </el-form>
                  </div>
                  <div class="wheel"
                    v-if="pptImgUrl1.indexOf('https://view.officeapps.live.com/op/view.aspx?src=') != -1 && showType == 2"
                    style="width: 95%; margin: 0 auto">
                    <iframe style="width: 100%; height: 100%; border: none" :src="pptImgUrl1"></iframe>
                  </div>
                  <div class="wheel" v-else-if="showType == 2" style="width: 95%; margin: 0 auto">
                    <iframe style="width: 100%; height: 100%; border: none" security="restricted"
                      sandbox="allow-top-navigation allow-same-origin allow-forms allow-scripts allow-popups"
                      :src="pptImgUrl1"></iframe>
                  </div>
                  <div class="wheel" v-if="showType == 3" style="width: 95%; margin: 0 auto">
                    <pdf :pdfUrl="pptImgUrl1" style="width: 100%; height: 100%; overflow: auto"></pdf>
                  </div>
                  <div class="wheel" v-if="showType == 4" style="width: 95%; margin: 0 auto">
                    <el-image :src="pptImgUrl1" fit="cover" style="width: 100%"></el-image>
                  </div>
                </div>
                <div class="pButton" style="
                                                        position: absolute;
                                                        right: 20px;
                                                        top: 0;
                                                        background: #205cc6;
                                                        z-index: 998;
                                                        opacity: .8;
                                                      " v-if="!contentDialog" @click="setContent(true)">
                  <!-- 批 -->
                  <img src="../../assets/navBtn2.png" style="width: 25px" alt="" />
                </div>
                <div v-if="contentDialog == true" :style="{
                  width: (!vedio[taskCount].length > 0 &&
                    !textList[taskCount].length > 0 &&
                    !lineList[taskCount].length > 0 &&
                    !file[taskCount].length > 0 && fileC[taskCount].length) ? 'calc(100%)' : 'calc(100% - 83%)', margin: (!vedio[taskCount].length > 0 &&
                      !textList[taskCount].length > 0 &&
                      !lineList[taskCount].length > 0 &&
                      !file[taskCount].length > 0 && fileC[taskCount].length) ? '0 15px' : '0 15px 0 0'
                }">
                  <div class="vedioList" v-if="(vedio.length &&
                    vedio[taskCount] &&
                    vedio[taskCount].length > 0) ||
                    (textList.length &&
                      textList[taskCount] &&
                      textList[taskCount].length > 0) ||
                    (lineList.length &&
                      lineList[taskCount] &&
                      lineList[taskCount].length > 0) ||
                    (file.length &&
                      file[taskCount] &&
                      file[taskCount].length > 0) ||
                    (fileC.length &&
                      fileC[taskCount] &&
                      fileC[taskCount].length > 0)
                    " style="height: 650px">
                    <div class="navCorOpenBox">
                      <div class="navTitile">内容列表：</div>
                      <div class="navCorOpen" @click="setContent(false)">
                        <img src="../../assets/navBtn2.png" alt="" />
                      </div>
                    </div>
                    <div class="navBox">
                      <div v-show="vedio.length &&
                        vedio[taskCount] &&
                        vedio[taskCount].length > 0
                        ">
                        <div class="vedioTimeBox" v-for="(media, vedioIndex) in vedio[taskCount]" :key="vedioIndex + '1'"
                          @click="lookVedio(media.url, vedioIndex)">
                          <div class="vedioName" :class="isClickNav == 'video' + vedioIndex
                            ? 'isClickNav'
                            : ''
                            ">
                            <span v-if="media.text">{{ media.text }}-</span>{{ media.name }}
                          </div>
                        </div>
                      </div>
                      <div v-show="textList.length &&
                        textList[taskCount] &&
                        textList[taskCount].length > 0
                        " class="newNav" v-for="(text, textIndex) in textList[taskCount]" :key="textIndex + '2'"
                        @click="lookText(taskCount, textIndex)">
                        <div style="width: calc(100% - 0px)">
                          <div class="navText" :class="isClickNav == 'text' + textIndex
                            ? 'isClickNav'
                            : ''
                            ">
                            {{
                              textList[taskCount].length > 0 ? text.name : ""
                            }}.doc
                          </div>
                        </div>
                      </div>
                      <div v-show="lineList.length &&
                        lineList[taskCount] &&
                        lineList[taskCount].length > 0
                        " class="newNav" v-for="(lines, lineIndex) in lineList[taskCount]" :key="lineIndex + '4'"
                        @click="doUrl(lines.url, lineIndex)">
                        <div style="width: calc(100% - 0px)">
                          <div class="navText" :class="isClickNav == 'line' + lineIndex
                            ? 'isClickNav'
                            : ''
                            ">
                            {{ lines.title ? lines.title : lines.url }}
                          </div>
                        </div>
                      </div>
                      <div class="newNav" v-show="file.length &&
                        file[taskCount] &&
                        file[taskCount].length > 0
                        " v-for="(f, fileIndex) in file[taskCount]" :key="fileIndex" @click="downFile(f, fileIndex)">
                        <div style="width: calc(100% - 0px)">
                          <div class="navText" :class="isClickNav == 'word' + fileIndex
                            ? 'isClickNav'
                            : ''
                            ">
                            <span v-if="f.text">{{ f.text }}-</span>{{ f.name }}
                          </div>
                        </div>
                      </div>
                      <div class="newNav" v-show="fileC.length &&
                        fileC[taskCount] &&
                        fileC[taskCount].length > 0
                        " v-for="(f, fileIndex) in fileC[taskCount]" :key="fileIndex" @click="downloadFile2(f)">
                        <div style="width: calc(100% - 0px)">
                          <div class="navText">
                            <span v-if="f.text">{{ f.text }}-</span>{{ f.name }}
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
              <div style="width: 81%">
                <div style="padding: 10px 0 0; width: 95%; margin: 0 auto" v-if="showType == 2 || showType == 3">
                  <el-button type="primary" @click="checkFileFull(showType, pptImgUrl1)">全屏查看</el-button>
                  <el-button type="primary" @click="downloadFile(pptImgUrl1)"
                    v-if="isClickNav.indexOf('line') == -1">文件下载</el-button>
                  <el-button v-if="isClickNav.indexOf('line') != -1" type="primary" @click="openLine(pptImgUrl1)">打开链接
                  </el-button>
                </div>
                <div style="padding: 10px 0 0; width: 95%; margin: 0 auto" v-if="showType == 1">
                  <el-button type="primary" @click="checkFileFull(showType, text)">全屏查看</el-button>
                </div>
              </div>
            </div>
          </div>

          <div class="student_body" v-resize="resize" v-if="chapInfoList[courseType].chapterInfo[0].taskJson[taskCount]
            .chapterData.length">
            <div class="vedioBox">
              <div class="queTop" style="
                                                      font-size: 25px;
                                                      padding: 15px 0 15px 30px;
                                                      font-weight: bold;
                                                    ">
                教师工作区
              </div>
              <div class="tool_work_box">
                <div class="tool_box">
                  <div class="tool_type_box">
                    <div class="chooseWho">
                      <div :class="toolType == 0 ? 'isChooseActive' : ''
                        " @click="(toolType = 0), $forceUpdate()">
                        互动类
                      </div>
                      <div :class="toolType == 1 ? 'isChooseActive' : ''
                        " @click="(toolType = 1), $forceUpdate()">
                        思维类
                      </div>
                      <div :class="toolType == 2 ? 'isChooseActive' : ''
                        " @click="(toolType = 2), $forceUpdate()">
                        评价类
                      </div>
                      <div :class="toolType == 3 ? 'isChooseActive' : ''
                        " @click="(toolType = 3), $forceUpdate()">
                        编程类
                      </div>
                      <div :class="toolType == 5 ? 'isChooseActive' : ''
                        " @click="(toolType = 5), $forceUpdate()">
                        学科类
                      </div>
                      <div :class="toolType == 4 ? 'isChooseActive' : ''
                        " @click="(toolType = 4), $forceUpdate()">
                        其他
                      </div>
                    </div>
                  </div>

                  <div>
                    <div class="toolSort" v-if="toolType == 0">
                      <div class="tool">
                        <div class="whiteBIcon">
                          <img src="../../assets/icon/thirdToolList/time.png" alt />
                          <div style="margin: 5px 0">倒计时</div>
                        </div>
                      </div>
                      <div class="tool">
                        <div class="whiteBIcon">
                          <img src="../../assets/icon/fourthToolList/group.png" alt />
                          <div style="margin: 5px 0">学生分组</div>
                        </div>
                      </div>
                      <div class="tool">
                        <div class="whiteBIcon">
                          <img src="../../assets/icon/fourthToolList/interVideo.png" alt />
                          <div style="margin: 5px 0">交互视频</div>
                        </div>
                      </div>
                    </div>
                    <div class="toolSort" v-if="toolType == 1">
                      <div class="tool">
                        <div class="whiteBIcon">
                          <img src="../../assets/icon/secondToolList/mindNetwork.png" alt />
                          <div style="margin: 5px 0">思维网格</div>
                        </div>
                      </div>
                      <div class="tool">
                        <div class="whiteBIcon" @click="addTools(1, 0, taskCount)">
                          <img src="../../assets/icon/secondToolList/whiteBoard.png" alt />
                          <div style="margin: 5px 0">电子白板</div>
                        </div>
                      </div>
                      <div class="tool">
                        <div class="whiteBIcon">
                          <img src="../../assets/icon/fourthToolList/text.png" alt />
                          <div style="margin: 5px 0">文档</div>
                        </div>
                      </div>
                      <div class="tool">
                        <div class="whiteBIcon" @click="addTools(3, 0, taskCount)">
                          <img src="../../assets/icon/secondToolList/mindMapping.png" alt />
                          <div style="margin: 5px 0">思维导图</div>
                        </div>
                      </div>
                      <div class="tool">
                        <div class="whiteBIcon">
                          <img src="../../assets/icon/fourthToolList/table.png" alt />
                          <div style="margin: 5px 0">表格</div>
                        </div>
                      </div>
                    </div>
                    <div class="toolSort" v-if="toolType == 2">
                      <div class="tool">
                        <div class="whiteBIcon">
                          <img src="../../assets/icon/thirdToolList/ask.png" alt />
                          <div style="margin: 5px 0">问卷调查</div>
                        </div>
                      </div>
                      <div class="tool">
                        <div class="whiteBIcon">
                          <img src="../../assets/icon/thirdToolList/choose.png" alt />
                          <div style="margin: 5px 0">选择题</div>
                        </div>
                      </div>
                      <div class="tool">
                        <div class="whiteBIcon">
                          <img src="../../assets/icon/thirdToolList/answer.png" alt />
                          <div style="margin: 5px 0">问答工具</div>
                        </div>
                      </div>
                      <div class="tool">
                        <div class="whiteBIcon">
                          <img src="../../assets/icon/thirdToolList/work.png" alt />
                          <div style="margin: 5px 0">作业提交</div>
                        </div>
                      </div>
                      <div class="tool">
                        <div class="whiteBIcon">
                          <img src="../../assets/icon/thirdToolList/plwork.png" alt />
                          <div style="margin: 5px 0">批量上传</div>
                        </div>
                      </div>
                      <div class="tool">
                        <div class="whiteBIcon">
                          <img src="../../assets/icon/secondToolList/eval.png" alt />
                          <div style="margin: 5px 0">个人评价</div>
                        </div>
                      </div>
                      <div class="tool">
                        <div class="whiteBIcon">
                          <img src="../../assets/icon/thirdToolList/select.png" alt />
                          <div style="margin: 5px 0">选择填空</div>
                        </div>
                      </div>
                      <div class="tool">
                        <div class="whiteBIcon">
                          <img src="../../assets/icon/fourthToolList/conSentences.png" alt />
                          <div style="margin: 5px 0">连词成句</div>
                        </div>
                      </div>
                    </div>
                    <div class="toolSort" v-if="toolType == 3">
                      <div class="tool">
                        <div class="whiteBIcon">
                          <img src="../../assets/icon/thirdToolList/trainPlatform.png" alt />
                          <div style="margin: 5px 0">训练平台</div>
                        </div>
                      </div>
                      <div class="tool">
                        <div class="whiteBIcon">
                          <img src="../../assets/icon/fourthToolList/program.png" alt />
                          <div style="margin: 5px 0">编程平台</div>
                        </div>
                      </div>
                      <div class="tool">
                        <div class="whiteBIcon">
                          <img src="../../assets/icon/fourthToolList/AIprogram2.png" alt />
                          <div style="margin: 5px 0">AI体验</div>
                        </div>
                      </div>
                      <div class="tool">
                        <div class="whiteBIcon">
                          <img src="../../assets/icon/fourthToolList/Pythonprogram.png" alt />
                          <div style="margin: 5px 0">Python</div>
                        </div>
                      </div>
                      <div class="tool">
                        <div class="whiteBIcon">
                          <img src="../../assets/icon/fourthToolList/AIprogram.png" alt />
                          <div style="margin: 5px 0">AI平台</div>
                        </div>
                      </div>
                      <div class="tool">
                        <div class="whiteBIcon">
                          <img src="../../assets/icon/thirdToolList/code.png" alt />
                          <div style="margin: 5px 0">源码编辑</div>
                        </div>
                      </div>
                      <div class="tool">
                        <div class="whiteBIcon">
                          <img src="../../assets/icon/fourthToolList/cocopi.png" alt />
                          <div style="margin: 5px 0">CocoPi</div>
                        </div>
                      </div>
                      <div class="tool">
                        <div class="whiteBIcon">
                          <img src="../../assets/icon/fourthToolList/Wood.png" alt />
                          <div style="margin: 5px 0">海龟编程</div>
                        </div>
                      </div>
                    </div>
                    <div class="toolSort" v-if="toolType == 5">
                      <div class="tool">
                        <div class="whiteBIcon">
                          <img src="../../assets/icon/secondToolList/translation.png" alt />
                          <div style="margin: 5px 0">翻译</div>
                        </div>
                      </div>
                      <div class="tool">
                        <div class="whiteBIcon">
                          <img src="../../assets/icon/secondToolList/mohe.png" alt />
                          <div style="margin: 5px 0">魔盒识字</div>
                        </div>
                      </div>
                      <div class="tool">
                        <div class="whiteBIcon">
                          <img src="../../assets/icon/secondToolList/24game.png" alt />
                          <div style="margin: 5px 0">24点</div>
                        </div>
                      </div>
                      <div class="tool">
                        <div class="whiteBIcon">
                          <img src="../../assets/icon/secondToolList/networkPanel.png" alt />
                          <div style="margin: 5px 0">数学画板</div>
                        </div>
                      </div>
                      <div class="tool">
                        <div class="whiteBIcon">
                          <img src="../../assets/icon/secondToolList/GeoGebra.png" alt />
                          <div style="margin: 5px 0">GeoGebra</div>
                        </div>
                      </div>
                      <div class="tool">
                        <div class="whiteBIcon">
                          <img src="../../assets/icon/fourthToolList/car.png" alt />
                          <div style="margin: 5px 0">模拟驾驶</div>
                        </div>
                      </div>
                      <div class="tool">
                        <div class="whiteBIcon">
                          <img src="../../assets/icon/fourthToolList/lineSearch.png" alt />
                          <div style="margin: 5px 0">路径搜索</div>
                        </div>
                      </div>
                      <div class="tool">
                        <div class="whiteBIcon">
                          <img src="../../assets/icon/fourthToolList/deepLearning.png" alt />
                          <div style="margin: 5px 0">深度学习</div>
                        </div>
                      </div>
                      <div class="tool">
                        <div class="whiteBIcon">
                          <img src="../../assets/icon/fourthToolList/allHistory.png" alt />
                          <div style="margin: 5px 0">全历史</div>
                        </div>
                      </div>
                    </div>
                    <div class="toolSort" v-if="toolType == 4">
                      <div class="tool">
                        <div class="whiteBIcon">
                          <img src="../../assets/icon/thirdToolList/courseDesign.png" alt />
                          <div style="margin: 5px 0">课程设计</div>
                        </div>
                      </div>
                      <div class="tool">
                        <div class="whiteBIcon">
                          <img src="../../assets/icon/thirdToolList/evalua.png" alt />
                          <div style="margin: 5px 0">目标管理</div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>

                <div class="tool_works_box" v-if="worksTeacher.length">
                  <div class="zuoyeYulan">
                    <div class="worksTop">
                      <div>作业预览</div>
                    </div>

                  </div>
                  <div class="worksDetailBox">
                    <div class="works" style="
                                                              width: 200px;
                                                              height: 140px;
                                                              margin: 10px 10px 10px 0;
                                                              border-radius: 15px;
                                                              box-shadow: 0 0 6px 1px #dfdada;
                                                            " v-for="(w, wIndex) in worksTeacher" :key="wIndex"
                      :class="w.type == 1 ? 'isTypeOne' : ''">
                      <div class="workImg" v-if="w.type == 0">
                        <img :src="w.works" @click="previewImg(w.works)" alt />
                        <div class="answerScore" v-if="w.score" @click.stop="openScore(w)" :class="{
                            rightW:
                              w.userid == userid || tType == 1 || tType == 4,
                          }">
                          {{ JSON.parse(w.score).wScore }}分
                        </div>
                        <div class="answerScore" @click.stop="openScore(w)" v-else-if="courseDetail.userid == userid"
                          :class="{
                              rightW:
                                w.userid == userid || tType == 1 || tType == 4,
                            }">
                          评分
                        </div>
                        <img class="deleteImg" src="../../assets/deleteworks.png" v-if="w.userid == userid || tType == 1 || tType == 4
                          " @click.stop="deleteWorks(w.wid)" alt />
                      </div>
                      <div class="comment" style="min-width: 200px">
                        <div class="worksName">
                          <div>{{ w.sName }}</div>
                        </div>
                        <div class="commentList">
                          <div class="commentList">
                            <div class="commentImg" @click="isLikes(w.wid, userid, 1, null, w.isLikes)
                              ">
                              <img :src="w.isLikes == true ? likes : noLikes" alt="" />
                            </div>
                            <div>{{ w.likesCount }}</div>
                          </div>
                          <div class="commentList" style="margin-right: 15px">
                            <div class="commentImg" @click="commentOther(w, 0, wIndex)">
                              <img src="../../assets/icon/comment/comment.png" alt="" />
                            </div>
                            <div>{{ w.commentCount }}</div>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="vedioBox">
              <div class="queTop" style="
                                                      font-size: 25px;
                                                      padding: 15px 0 15px 30px;
                                                      font-weight: bold;
                                                    ">
                学生工作区
              </div>
              <div class="tool_work_box">
                <div class="noWorksS">
                  <div v-for="(s, sIndex) in noWorksS" :key="sIndex" class="noWorksName"
                    :class="{ isWork: s.type == '2' }" @click="openStudentTool(s)">
                    {{ s.student }}
                  </div>
                </div>
                <div class="tool_works_box" v-if="worksStudent2.length">
                  <div class="zuoyeYulan">
                    <div class="worksTop">
                      <div>作业预览</div>
                    </div>

                  </div>
                  <div class="worksDetailBox">
                    <div class="works" style="
                                                              width: 200px;
                                                              height: 140px;
                                                              margin: 10px 10px 10px 0;
                                                              border-radius: 15px;
                                                              box-shadow: 0 0 6px 1px #dfdada;
                                                            " v-for="(w, wIndex) in worksStudent2" :key="wIndex"
                      :class="w.type == 1 ? 'isTypeOne' : ''">
                      <div class="workImg" v-if="w.type == 0">
                        <img :src="w.works" @click="previewImg(w.works)" alt />
                        <div class="answerScore" v-if="w.score" @click.stop="openScore(w)" :class="{
                            rightW:
                              w.userid == userid || tType == 1 || tType == 4,
                          }">
                          {{ JSON.parse(w.score).wScore }}分
                        </div>
                        <div class="answerScore" @click.stop="openScore(w)" v-else-if="courseDetail.userid == userid"
                          :class="{
                              rightW:
                                w.userid == userid || tType == 1 || tType == 4,
                            }">
                          评分
                        </div>
                        <img class="deleteImg" src="../../assets/deleteworks.png" v-if="w.userid == userid || tType == 1 || tType == 4
                          " @click.stop="deleteWorks(w.wid)" alt />
                      </div>
                      <div class="comment" style="min-width: 200px">
                        <div class="worksName">
                          <div>{{ w.sName }}</div>
                        </div>
                        <div class="commentList">
                          <div class="commentList">
                            <div class="commentImg" @click="isLikes(w.wid, userid, 1, null, w.isLikes)
                              ">
                              <img :src="w.isLikes == true ? likes : noLikes" alt="" />
                            </div>
                            <div>{{ w.likesCount }}</div>
                          </div>
                          <div class="commentList" style="margin-right: 15px">
                            <div class="commentImg" @click="commentOther(w, 0, wIndex)">
                              <img src="../../assets/icon/comment/comment.png" alt="" />
                            </div>
                            <div>{{ w.commentCount }}</div>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
        <el-dialog title="作业提交" :visible.sync="dialogVisible" :append-to-body="true" width="500px"
          :before-close="handleClose" class="dialog_change">
          <div class="marginT">
            <div>上传文件</div>
            <div class="chapter_add" @click="addImg($event)" v-if="studyJuri[0].cover.length == 0">
              <div class="up_photo">
                <img src="../../assets/icon/uploadImg.png" alt />
              </div>
              <!-- <input
                type="file"
                accept="video/mp4, video/quicktime, video/x-msvideo,application/pdf, application/.ppt, .pptx, .xlsx, .xls, application/msword, application/vnd.openxmlformats-officedocument.wordprocessingml.document, image/*"
                style="display: none"
                @change="beforeUpload1($event, 1)"
              /> -->
              <input type="file" accept="*" style="display: none" @change="beforeUpload1($event, 1)" />
              <!-- <input
                type="file"
                accept="image/*"
                capture="camera"
                style="display: none"
                @change="beforeUpload1($event, 1)"
              /> -->
            </div>
            <div class="chapter_add" style="
                                                    display: flex;
                                                    width: 100%;
                                                    flex-direction: row;
                                                    flex-wrap: wrap;
                                                    justify-content: flex-start;
                                                    padding: 15px 0;
                                                  " v-if="studyJuri[0].cover.length > 0">
              <div class="upCover">
                <img :src="studyJuri[0].cover[0].url" alt v-if="fileType == 0" />
                <img :src="word" alt v-else-if="fileType == 1" />
                <img :src="video" alt v-else-if="fileType == 2" />
                <img :src="word2" alt v-else-if="fileType == 3" />
                <span class="picName">{{ studyJuri[0].cover[0].name }}</span>

                <div class="deleteWord" @click="clean(1)">
                  <img src="../../assets/icon/deleteWorks.png" alt />
                </div>
              </div>
            </div>
          </div>
          <div class="upload_send" @click="addCourseWorks(taskCount)" v-if="!proVisible">
            提交
          </div>
        </el-dialog>
      </div>
    </div>
    <div class="pButton" @click="(pzDialog = true), selectPz()" v-if="tType == 4 || ispzType == 4">
      <!-- 批 -->
      <img src="../../assets/pzBtn2.png" style="width: 25px" alt="" />
    </div>
    <div v-if="pzDialog == true" class="newDialogCss">
      <div class="pzTop2">
        <!-- <div>批注</div>
        <div @click="pzDialog = false">
          <img src="../../assets/close1.png" alt="" />
        </div> -->
        <div class="checkbox">
          <div class="check" style="font-size: 25px">评课笔记</div>
          <img src="../../assets/pzBtn.png" @click="pzDialog = false" alt="" />
        </div>
      </div>
      <div :class="pzList && pzList.length ? 'pzBox' : 'noPzBox'">
        <div class="pzListBox" v-if="pzList && pzList.length">
          <div class="pzList" v-for="(pz, pzIndex) in pzList" :key="pzIndex">
            <div class="pzNavTop">
              <div>批</div>
              <div>
                {{
                  pz.username && pz.username.length > 5
                  ? pz.username.substring(0, 5) + "..."
                  : pz.username
                }}的批注
              </div>
              <div class="pzDelete" v-if="pz.userid == userid" @click="deletePz(pz.id)">
                删除
              </div>
            </div>
            <div class="pzContent cont" v-html="pz.content" v-if="pz.type == '1'"></div>
            <div class="pzContent" v-if="pz.type == '2'">
              <audio :src="pz.content" controls="controls" ref="audio">
                Your browser does not support the audio element.
              </audio>
            </div>
            <div class="pzContent" v-if="pz.type == '3'">
              <img :src="pz.content" style="width: 90%; margin: 0 auto; display: block" @click="previewImg(pz.content)" />
            </div>
            <div class="time">
              {{ pz.time }}
            </div>
          </div>
        </div>
        <div class="noPz" v-else>
          <img src="../../assets/icon/noPz.png" alt="" />
        </div>
        <div class="addPzButton">
          <div class="addPz" @click="(addPzDialog = true), (pzType = 1)">
            添加批注
          </div>
          <!-- <div class="img1">
            <div @click="(addPzDialog = true), (pzType = 2)">
              <img src="../../assets/audio.png" /><span>音频</span>
            </div>
          </div> -->
        </div>
      </div>
    </div>
    <div v-if="addPzDialog == true" class="addDialogCss">
      <div class="pzTop">
        <div class="teacherPz">
          <div class="teacherPzImg">
            <img src="../../assets/icon/teacherPz.png" alt="" />
          </div>
          <div style="margin-left: 10px; height: 25px">教师批注</div>
        </div>
        <div @click="addPzDialog = false">
          <img src="../../assets/close1.png" alt="" />
        </div>
      </div>
      <div class="addPzBox">
        <div class="addPzCheck">
          <span :class="{ isChooseActive: pzType == 1 }" @click="pzType = 1">文本</span>
          <!-- <span :class="{isChooseActive:pzType==3}" @click="pzType = 3">图片</span> -->
          <span :class="{ isChooseActive: pzType == 2 }" @click="pzType = 2">音频</span>
        </div>
        <div style="height: calc(100% - 95px)">
          <!-- <textarea class="binfo_input pzConText" cols placeholder="请填写项目课程关键问题...." v-model="pzConText"
            v-if="pzType == 1"></textarea> -->
          <editor-bar class="binfo_input pzConText" style="width: 100% !important" placeholder="请输入任务描述"
            v-model="pzConText" @change="change" v-if="pzType == 1"></editor-bar>
          <Audio @addPz="addPz" class="pzAudioClass" v-if="pzType == 2"></Audio>
          <!-- <div class="pzAudioClass" v-if="pzType == 3">
            <div @click="addImg($event)">
              <el-button type="primary">上传图片</el-button>
              <input type="file" accept="image/png, image/gif, image/jpeg" style="display: none"
                @change="beforeUpload1($event, 4)" />
            </div>
          </div> -->
        </div>
        <div class="addTextCss" @click="addPz('1')" v-if="pzType == 1">
          确定
        </div>
      </div>
    </div>
    <div v-if="proVisible" class="mask">
      <div class="progressBox">
        <!-- <div id="closePro" class="closeCss">
                                            <img src="../../assets/icon/close.png" alt />
                                        </div> -->
        <div class="lbox">
          <img src="../../assets/loading.gif" />上传中，请稍后
        </div>
        <div style="margin-bottom: 10px">
          <span>{{ isFinishSize }}M</span> / <span>{{ isAllSize }}M</span>
        </div>
        <el-progress :text-inside="true" :stroke-width="20" :percentage="progress" style="width: 80%"></el-progress>
      </div>
    </div>
    <div v-if="proVisible2" class="mask">
      <div class="progressBox">
        <div class="lbox">
          <img src="../../assets/loading.gif" />上传中，请稍后
        </div>
        <!-- <el-progress :text-inside="true" :stroke-width="20" :percentage="progress" style="width: 80%"></el-progress> -->
      </div>
    </div>
    <el-dialog :visible.sync="pictureDialog" size="tiny">
      <img width="100%" :src="dialogImageUrl" alt />
    </el-dialog>
    <el-dialog :title="noteName != '' ? noteName : '查看问卷'" :visible.sync="dialogVisible5" :append-to-body="true"
      width="1000px" :before-close="handleClose" class="dialog_diy dialog_diy3">
      <div>
        <div class="a_add_title" style="
                                                display: flex;
                                                flex-direction: row;
                                                align-items: center;
                                                justify-content: center;
                                              ">
          <div style="margin-right: 20px; font-size: 20px">标题:</div>
          <div style="font-size: 20px">{{ askJson.askTitle }}</div>
        </div>
        <div class="a_addBox">
          <div style="font-size: 16px; color: #c7c7c7">题目内容</div>
          <div class="a_add_box" v-for="(item1, index1) in askJson.askCount" :key="index1">
            <div class="a_add_head">
              <div style="display: flex">
                {{ index1 + 1 + "、" }}
                <div>题目：{{ askJson.askJson[index1].askstitle }}</div>
              </div>
              <img v-if="askJson.askJson[index1].img" :src="askJson.askJson[index1].img"
                style="height: 300px; margin-top: 10px; max-width: 100%" />
            </div>
            <div class="a_add_body">
              <div class="a_add_input">
                <el-radio-group v-model="radio[index1]" v-if="askJson.askJson[index1].type == '1' ||
                  !askJson.askJson[index1].type
                  ">
                  <el-radio v-for="(item2, checkIndex) in askJson.askJson[index1]
                    .checkList" :key="checkIndex" :label="checkIndex" :disabled="isAnswer" class="redioStyle"><span
                      v-html="item2"></span></el-radio>
                </el-radio-group>
                <el-checkbox-group v-model="radio[index1]" v-if="askJson.askJson[index1].type == '2'">
                  <el-checkbox v-for="(item2, checkIndex1) in askJson.askJson[index1]
                    .checkList" :key="checkIndex1" :label="checkIndex1" :disabled="isAnswer" class="redioStyle"><span
                      v-html="item2"></span>
                  </el-checkbox>
                </el-checkbox-group>
              </div>
            </div>
          </div>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible5 = false" v-show="noteName == ''">取 消</el-button>
        <el-button type="primary" @click="addStudentAsk" v-show="noteName == ''">确 定</el-button>
      </span>
    </el-dialog>
    <el-dialog :title="noteName != '' ? noteName : '查看问卷'" :visible.sync="dialogVisible5Teacher" :append-to-body="true"
      width="1000px" :before-close="handleClose" class="dialog_diy dialog_diy3">
      <div>
        <div class="w_name">
          学生姓名：<span>{{ sStudent.student }}</span>
        </div>
        <div class="a_add_title" style="
                                                display: flex;
                                                flex-direction: row;
                                                align-items: center;
                                                justify-content: center;
                                              ">
          <div style="margin-right: 20px; font-size: 20px">标题:</div>
          <div style="font-size: 20px">{{ askJson.askTitle }}</div>
        </div>
        <div class="a_addBox">
          <div style="font-size: 16px; color: #c7c7c7">题目内容</div>
          <div class="a_add_box" v-for="(item1, index1) in askJson.askCount" :key="index1">
            <div class="a_add_head">
              <div style="display: flex">
                {{ index1 + 1 + "、" }}
                <div>题目：{{ askJson.askJson[index1].askstitle }}</div>
              </div>
              <img v-if="askJson.askJson[index1].img" :src="askJson.askJson[index1].img"
                style="height: 300px; margin-top: 10px; max-width: 100%" />
            </div>
            <div class="a_add_body">
              <div class="a_add_input">
                <el-radio-group v-model="radio[index1]" v-if="askJson.askJson[index1].type == '1' ||
                  !askJson.askJson[index1].type
                  ">
                  <el-radio v-for="(item2, checkIndex) in askJson.askJson[index1]
                    .checkList" :key="checkIndex" :label="checkIndex" :disabled="isAnswer" class="redioStyle"><span
                      v-html="item2"></span></el-radio>
                </el-radio-group>
                <el-checkbox-group v-model="radio[index1]" v-if="askJson.askJson[index1].type == '2'">
                  <el-checkbox v-for="(item2, checkIndex1) in askJson.askJson[index1]
                    .checkList" :key="checkIndex1" :label="checkIndex1" :disabled="isAnswer" class="redioStyle"><span
                      v-html="item2"></span>
                  </el-checkbox>
                </el-checkbox-group>
              </div>
            </div>
          </div>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible5Teacher = false" v-show="noteName == ''">取 消</el-button>
        <el-button type="primary" @click="addStudentAskTeacher" v-show="noteName == ''">确 定</el-button>
      </span>
    </el-dialog>
    <el-dialog :title="noteName != '' ? noteName : '查看选择题'" :visible.sync="dialogVisibleChoice" :append-to-body="true"
      width="1000px" :before-close="handleClose" class="dialog_diy dialog_diy3">
      <div>
        <div class="a_addBox">
          <div style="font-size: 16px; color: #c7c7c7">题目内容</div>
          <div class="a_add_box" v-for="(item1, index1) in testJson.testCount" :key="index1">
            <div class="a_add_head">
              <div style="display: flex">
                {{ index1 + 1 + "、" }}
                <div v-if="testJson.testJson[index1].type == '1'" style="margin-right: 5px;min-width: 70px;">
                  (单选题)
                </div>
                <div v-if="testJson.testJson[index1].type == '2'" style="margin-right: 5px;min-width: 70px;">
                  (多选题)
                </div>
                <div>题目：{{ testJson.testJson[index1].teststitle }}</div>
              </div>
              <img v-if="testJson.testJson[index1].img" :src="testJson.testJson[index1].img"
                style="height: 300px; margin-top: 10px; max-width: 100%" />
            </div>
            <div class="timuImgBox" v-if="testJson.testJson[index1].timuList &&
              testJson.testJson[index1].timuList.length
              ">
              <div v-for="(timg, tIndex) in testJson.testJson[index1].timuList" :key="tIndex" class="timuImg"
                @click.stop="previewImg(timg.src)">
                <img :src="timg.src" alt="" />
              </div>
            </div>
            <div class="a_add_body">
              <div class="a_add_input">
                <el-radio-group v-model="radio[index1]" v-if="testJson.testJson[index1].type == '1'">
                  <div class="radioBox">
                    <el-radio v-for="(item2, checkIndex) in testJson.testJson[index1]
                      .checkList" :key="checkIndex" :label="checkIndex" :disabled="isAnswer" class="redioStyle">
                      <div style="margin-right: 10px" v-if="item2 && item2.imgType && item2.imgType == 1">
                        <div class="inImg" @click.stop="previewImg(item2.src)">
                          <img :src="item2.src" alt="" />
                        </div>
                      </div>
                      <span v-else v-html="item2"></span>
                    </el-radio>
                  </div>
                </el-radio-group>
                <el-checkbox-group v-model="radio[index1]" v-if="testJson.testJson[index1].type == '2'">
                  <div class="radioBox">
                    <el-checkbox v-for="(item2, checkIndex) in testJson.testJson[index1]
                      .checkList" :key="checkIndex" :label="checkIndex" :disabled="isAnswer" class="redioStyle">
                      <div style="margin-right: 10px" v-if="item2 && item2.imgType && item2.imgType == 1">
                        <div class="inImg" @click.stop="previewImg(item2.src)">
                          <img :src="item2.src" alt="" />
                        </div>
                      </div>
                      <span v-else v-html="item2"></span>
                    </el-checkbox>
                  </div>
                </el-checkbox-group>
              </div>
            </div>
          </div>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisibleChoice = false" v-show="noteName == ''">取 消</el-button>
        <el-button type="primary" @click="addStudentTest" v-show="noteName == ''">确 定</el-button>
      </span>
    </el-dialog>
    <el-dialog :title="noteName != '' ? noteName : '查看选择题'" :visible.sync="dialogVisibleChoiceTeacher"
      :append-to-body="true" width="1000px" :before-close="handleClose" class="dialog_diy dialog_diy3">
      <div>
        <div class="w_name">
          学生姓名：<span>{{ sStudent.student }}</span>
        </div>
        <div class="a_addBox">
          <div style="font-size: 16px; color: #c7c7c7">题目内容</div>
          <div class="a_add_box" v-for="(item1, index1) in testJson.testCount" :key="index1">
            <div class="a_add_head">
              <div style="display: flex">
                {{ index1 + 1 + "、" }}
                <div v-if="testJson.testJson[index1].type == '1'" style="margin-right: 5px">
                  (单选题)
                </div>
                <div v-if="testJson.testJson[index1].type == '2'" style="margin-right: 5px">
                  (多选题)
                </div>
                <div>题目：{{ testJson.testJson[index1].teststitle }}</div>
              </div>
              <img v-if="testJson.testJson[index1].img" :src="testJson.testJson[index1].img"
                style="height: 300px; margin-top: 10px; max-width: 100%" />
            </div>
            <div class="timuImgBox" v-if="testJson.testJson[index1].timuList &&
              testJson.testJson[index1].timuList.length
              ">
              <div v-for="(timg, tIndex) in testJson.testJson[index1].timuList" :key="tIndex" class="timuImg"
                @click.stop="previewImg(timg.src)">
                <img :src="timg.src" alt="" />
              </div>
            </div>
            <div class="a_add_body">
              <div class="a_add_input">
                <el-radio-group v-model="radio[index1]" v-if="testJson.testJson[index1].type == '1'">
                  <div class="radioBox">
                    <el-radio v-for="(item2, checkIndex) in testJson.testJson[index1]
                      .checkList" :key="checkIndex" :label="checkIndex" :disabled="isAnswer" class="redioStyle">
                      <div style="margin-right: 10px" v-if="item2 && item2.imgType && item2.imgType == 1">
                        <div class="inImg" @click.stop="previewImg(item2.src)">
                          <img :src="item2.src" alt="" />
                        </div>
                      </div>
                      <span v-else v-html="item2"></span>
                    </el-radio>
                  </div>
                </el-radio-group>
                <el-checkbox-group v-model="radio[index1]" v-if="testJson.testJson[index1].type == '2'">
                  <div class="radioBox">
                    <el-checkbox v-for="(item2, checkIndex) in testJson.testJson[index1]
                      .checkList" :key="checkIndex" :label="checkIndex" :disabled="isAnswer" class="redioStyle">
                      <div style="margin-right: 10px" v-if="item2 && item2.imgType && item2.imgType == 1">
                        <div class="inImg" @click.stop="previewImg(item2.src)">
                          <img :src="item2.src" alt="" />
                        </div>
                      </div>
                      <span v-else v-html="item2"></span>
                    </el-checkbox>
                  </div>
                </el-checkbox-group>
              </div>
            </div>
          </div>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisibleChoiceTeacher = false" v-show="noteName == ''">取 消</el-button>
        <el-button type="primary" @click="addStudentTestTeacher" v-show="noteName == ''">确 定</el-button>
      </span>
    </el-dialog>
    <el-dialog title="查看富文本" :visible.sync="dialogVisible1" :append-to-body="true" width="500px"
      :before-close="handleClose" class="dialog_diy textCss">
      <el-form style="font-size: 20px">
        <el-form-item label="文本标题" class="textTitle">
          <div style="font-size: 20px">{{ text.name }}</div>
        </el-form-item>
        <div>富文本内容</div>
        <div v-html="text.url" style="font-size: 18px; padding: 40px 0 0 0"></div>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button type="primary" @click="dialogVisible1 = false">确定</el-button>
      </span>
    </el-dialog>
    <el-dialog title="文件预览" :visible.sync="dialogVisible3" width="50%" :before-close="handleClose" class="dialog_diy"
      :class="{ fullStyle: full }">
      <div slot="title" class="header-title">
        <div style="color: #fff">文件预览</div>
        <div style="position: absolute; top: 19px; right: 50px">
          <img src="../../assets/full.png" style="height: 16px; cursor: pointer" alt="" @click="fullTools" />
        </div>
      </div>
      <pdf v-if="showPDF" :pdfUrl="pptImgUrl" style="width: 100%; height: 520px; overflow: auto"
        :class="{ fullStyle: full }"></pdf>
      <iframe v-else :src="pptImgUrl" frameborder="0" width="100%" height="600" :class="{ fullStyle: full }"></iframe>
    </el-dialog>
    <el-dialog title="文件预览" :visible.sync="dialogVisible6" width="50%" :before-close="handleClose" class="dialog_diy">
      <iframe :src="pptImgUrl1" frameborder="0" width="100%" height="600"></iframe>
    </el-dialog>
    <el-dialog title="提示" :visible.sync="dialogVisible4" :append-to-body="true" width="800px" :before-close="handleClose"
      class="dialog_diy notice">
      <div>此功能暂未开放！</div>
      <el-button type="primary" @click="dialogVisible4 = false">确定</el-button>
    </el-dialog>
    <el-dialog title="问答" :visible.sync="answerDialogVisible" :append-to-body="true" width="800px"
      :before-close="handleClose" class="dialog_diy">
      <div>
        <div style="
                                                display: flex;
                                                flex-wrap: nowrap;
                                                flex-direction: column;
                                                position: relative;
                                              ">
          <div class="queTop" style="padding: 20px 0 20px 0">
            <div class="question">
              <img src="../../assets/icon/question.png" alt />
            </div>
            <div class="queTitle">
              <div style="width: 90px; min-width: 90px">提问：</div>
              <div>{{ answerQ }}</div>
            </div>
          </div>
          <div class="ediBottom">
            <textarea rows="6" class="binfo_input" cols style="width: 95%; height: 120px"
              v-model="questionAnswer"></textarea>
          </div>
        </div>
      </div>
      <div slot="footer">
        <el-button @click="answerDialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="addQuestion">提 交</el-button>
      </div>
    </el-dialog>
    <el-dialog title="倒计时" :visible.sync="timeDialogVisible" :append-to-body="true" width="800px"
      :before-close="handleClose" class="dialog_diy">
      <div>
        <Time :preTime="preTime" v-if="timeDialogVisible"></Time>
      </div>
      <div slot="footer">
        <el-button @click="timeDialogVisible = false">关 闭</el-button>
      </div>
    </el-dialog>
    <el-dialog title="权限设置" :visible.sync="juriVisible" :append-to-body="true" width="400px" :before-close="handleClose"
      class="dialog_diy">
      <div>
        <div class="open_box">
          <div class="switch_box">
            <span>允许学生查看所有作业</span>
            <el-switch v-model="sIsOpen" active-text="" class="switchCss" @change="updateSLook"></el-switch>
          </div>
          <div class="switch_box" v-if="courseDetail.userid == userid ||
            (courseDetail.course_teacher &&
              courseDetail.course_teacher.indexOf(userid) != -1)
            ">
            <!-- v-if="courseDetail.userid == userid || courseDetail.course_teacher.indexOf(userid) != -1" -->
            <span>禁止学生查看所有阶段</span>
            <el-switch v-model="IsLookOpen" active-text="" class="switchCss" @change="updateLookOpen"></el-switch>
          </div>
          <div class="switch_box" v-if="courseDetail.userid == userid">
            <span>开启跟随模式</span>
            <el-switch v-model="IsFollow" active-text="" class="switchCss" @change="updateFollow"></el-switch>
          </div>
        </div>
      </div>
      <div slot="footer">
        <el-button style="background: #409efe; color: #fff" @click="juriVisible = false">关 闭</el-button>
      </div>
    </el-dialog>
    <el-dialog title="查看视频" :visible.sync="videoVisible" :append-to-body="true" width="1000px" :before-close="handleClose"
      class="dialog_diy1">
      <div class="workd_media" style="height: 100%" v-if="videoDetail.sources">
        <video-player class="video-player vjs-custom-skin" :playsinline="true" :options="videoDetail"
          @play="onPlayerPlay($event)" style="width: 100%; height: 100%"></video-player>
      </div>
      <div slot="footer">
        <el-button style="background: #409efe; color: #fff"
          @click="(videoVisible = false), (videoDetail.sources[0].src = '')">
          关 闭</el-button>
      </div>
    </el-dialog>
    <el-dialog title="查看详情" :visible.sync="commentDialogVisible" :append-to-body="true" width="800px"
      :before-close="handleClose" class="dialog_diy">
      <div class="commentTop">
        <div class="studentDetail">
          <div class="tx"><img src="../../assets/avatar.png" alt="" /></div>
          <div class="nameAndTime">
            <div style="margin-bottom: 5px">{{ commentDetail.sName }}</div>
            <div>{{ commentDetail.time }}</div>
          </div>
          <div class="returnBtn" style="margin-left: auto; width: 80px" v-if="commentDetail.works &&
            commentDetail.type == 0 &&
            (tType == 1 || tType == 4)
            " @click="showPicturePaint(
    commentDetail.img ? commentDetail.img : commentDetail.works
  )
    ">
            教师批注
          </div>
        </div>
        <div class="worksAnswer" v-if="commentDetail.works && commentDetail.type == 2">
          {{ JSON.parse(commentDetail.works)[0].answer }}
        </div>
        <div class="worksAnswer" v-if="commentDetail.works && commentDetail.type == 1">
          <img src="../../assets/teacherWork.png" v-if="commentDetail.ateacher" class="w_teachert" />
          <pdf v-if="showPDF" :pdfUrl="pptImgUrl" style="width: 100%; height: 520px; overflow: auto"
            :class="{ fullStyle: full }"></pdf>
          <iframe v-else :src="pptImgUrl" frameborder="0" width="100%" height="600" :class="{ fullStyle: full }"></iframe>
        </div>
        <div class="worksAnswer" v-if="commentDetail.works && commentDetail.type == 0">
          <img src="../../assets/teacherWork.png" v-if="commentDetail.ateacher" class="w_teachert" style="right: 105px" />
          <img :src="commentDetail.works" alt="" @click="previewImg(commentDetail.works)" />
        </div>
        <div class="worksAnswer" v-if="commentDetail.works && commentDetail.type == 3">
          <img src="../../assets/teacherWork.png" v-if="commentDetail.ateacher" class="w_teachert" />
          <video-player class="video-player vjs-custom-skin" :playsinline="true" :options="videoDetail"
            @play="onPlayerPlay($event)" style="width: 90%; height: 100%; margin: 0 0 0 30px"></video-player>
        </div>
        <div class="worksAnswer" v-if="commentDetail.works && commentDetail.type == 10">
          <div class="cont" v-html="commentDetail.works.text"></div>
        </div>
        <div class="worksAnswer codeFileBox" v-if="commentDetail.works && commentDetail.type == 12"
          @click="downloadFile(commentDetail.works)">
          <img src="../../assets/icon/codeFile.png" />
          <div>点击下载文件</div>
        </div>
        <div class="worksAnswer" v-if="commentDetail.works && commentDetail.type == 13">
          <div v-html="JSON.parse(commentDetail.works).text"></div>
        </div>
        <div class="worksAnswer" v-if="commentDetail.works && commentDetail.type == 4">
          <div class="evalCss">
            <div class="nav">请选择星星进行评分</div>
            <div class="middleBox" v-if="eScore.eStar">
              <div class="pfBox" v-for="(e, eIndex) in rateJson" :key="eIndex">
                <div class="nameAndrate">
                  <div>{{ e.value }}</div>
                  <el-rate v-model="eScore.eStar[eIndex]" disabled></el-rate>
                </div>
                <div v-if="e.detail">{{ e.detail }}</div>
              </div>
              <div class="bz">
                <textarea disabled rows="4" class="pj" style="
                                                        padding: 10px 5px;
                                                        width: 70%;
                                                        background: #f7f6f9;
                                                        font-size: 14px;
                                                        text-indent: 10px;
                                                        color: #000;
                                                      " cols v-model="eScore.eBzText"
                  placeholder="请输入评价内容..."></textarea>
              </div>
            </div>
          </div>
        </div>
        <div class="comment">
          <div class="commentList">
            <div class="commentImg">
              <img @click="isLikes(
                commentDetail.wid,
                userid,
                1,
                null,
                commentDetail.isLikes
              )
                " :src="commentDetail.isLikes == true ? likes : noLikes" alt="" />
            </div>
            <div>{{ commentDetail.likesCount }}</div>
          </div>
          <div class="commentList">
            <div class="commentImg">
              <img src="../../assets/icon/comment/comment.png" alt="" />
            </div>
            <div>{{ commentDetail.commentCount }}</div>
          </div>
        </div>
        <div class="drawPBox" v-if="commentDetail.img">
          <span>教师批注</span>
          <img :src="commentDetail.img" alt="" @click="previewImg(commentDetail.img)" />
          <span class="deleteImg" v-if="tType == 1 || tType == 4" @click.stop="deletePicturePaint(commentDetail.wid)"
            style="
                                                  font-size: 14px;
                                                  width: auto !important;
                                                  color: #b4b4b4;
                                                  top: unset;
                                                  bottom: 0;
                                                  border: none;
                                                  padding: 0;
                                                  height: auto !important;
                                                  margin: 0;
                                                ">删除</span>
        </div>
      </div>
      <div class="commentBox">
        <div class="pl">评论：</div>
        <div style="max-height: 200px; overflow: auto">
          <div v-if="commentDetail.commentJson && commentDetail.commentJson.length" style="padding: 10px 0 0 0">
            <div class="studentDetail" style="padding-top: 10px" v-for="(co, coIndex) in commentDetail.commentJson"
              :key="coIndex">
              <div class="tx" style="min-width: 50px">
                <img src="../../assets/avatar.png" alt="" />
              </div>
              <div class="plPerson">
                <div class="plName">
                  <div>{{ co.commentPeople }}</div>
                  <div style="margin-left: 5px">
                    {{ co.commentTime }}
                  </div>
                  <div class="deleteComment" v-if="userid == co.userid" @click="deleteComment(co.wid)">删除</div>
                </div>
                <div class="plContent">{{ co.commentText }}</div>
              </div>
            </div>
          </div>
          <div v-else style="padding: 10px 0 0 0">暂无评论</div>
        </div>
      </div>
      <div style="margin-top: 10px">
        <div class="displayBox">
          <div style="
                                                  color: #556db4;
                                                  font-size: 14px;
                                                  font-weight: bold;
                                                  padding-bottom: 10px;
                                                ">
            评价
          </div>
          <div class="easy_comment" v-if="false">
            <div v-for="(p, pIndex) in PlTextList" :key="pIndex" @click="fastText(p, 1)">
              {{ p }}
            </div>
          </div>
        </div>

        <div>
          <textarea rows="3" class="pj" style="padding: 10px 5px" cols v-model="commentText"
            placeholder="请输入评论"></textarea>
        </div>
      </div>

      <div slot="footer">
        <el-button @click="(commentDialogVisible = false),
          (commentIndexJson = {}),
          videoDetail.sources && videoDetail.sources[0]
            ? (videoDetail.sources[0].src = '')
            : ''
          ">取 消</el-button>
        <el-button type="primary" @click="addComment(commentDetail.wid, userid, 2)">确 定</el-button>
      </div>
    </el-dialog>
    <el-dialog title="查看文档" :visible.sync="fullDialogVisible" :append-to-body="true" width="100%"
      :before-close="handleClose" :show-close="false" class="dialog_diy full_diy" :class="{ full_diy2: fulltype == 3 }">
      <div slot="title" class="header-title">
        <div style="color: #fff">查看文档</div>
        <div @click="fullDialogVisible = false" style="
                                                cursor: pointer;
                                                position: absolute;
                                                top: 20px;
                                                right: 20px;
                                                color: #fff;
                                              ">
          退出全屏
        </div>
      </div>
      <div style="height: 100%">
        <div class="wheel"
          v-if="fullUrl.indexOf('https://view.officeapps.live.com/op/view.aspx?src=') != -1 && fulltype == 2"
          style="width: 95%; margin: 0 auto">
          <iframe style="width: 100%; height: 100%; border: none" :src="fullUrl"></iframe>
        </div>
        <iframe v-else-if="fulltype == 2" style="width: 100%; height: 100%; border: none" :src="fullUrl"
          security="restricted"
          sandbox="allow-top-navigation allow-same-origin allow-forms allow-scripts  allow-popups"></iframe>
        <pdf v-else-if="fulltype == 3" :pdfUrl="fullUrl" style="width: 100%; height: 100%; overflow: auto"></pdf>
        <div class="wheel" v-if="fulltype == 1" style="
                                                box-shadow: 0 0 6px 1px #f2f2f2;
                                                width: 100%;
                                                background: #f1f1f1;
                                              ">
          <div class="title" style="width: 100%; box-sizing: border-box">
            查看文档
          </div>
          <el-form class="textBox" style="height: 90%">
            <el-form-item class="textTitle">
              <div style="font-size: 22px">
                {{ fullUrl.name }}
              </div>
            </el-form-item>
            <!-- <div style="color: #918f8f; width: 85%">文档内容</div> -->
            <div v-html="fullUrl.url" class="textContent" style="height: auto"></div>
          </el-form>
        </div>
      </div>
      <!-- <div slot="footer">
        <el-button @click="fullDialogVisible = false">关 闭</el-button>
      </div> -->
    </el-dialog>
    <el-dialog title="个人评价" :visible.sync="studentEvalDialogVisible" :append-to-body="true" width="800px"
      :before-close="handleClose" class="dialog_diy">
      <div class="evalCss">
        <div class="nav">请选择星星进行评分</div>
        <div class="middleBox" v-if="eScore.eStar">
          <div class="pfBox" v-for="(e, eIndex) in rateJson" :key="eIndex">
            <div class="nameAndrate">
              <div>{{ e.value }}</div>
              <el-rate v-model="eScore.eStar[eIndex]" :disabled="isStar"></el-rate>
            </div>
            <div v-if="e.detail">{{ e.detail }}</div>
          </div>
          <div class="easy_comment" v-if="false">
            <div v-for="(p, pIndex) in PlTextList" :key="pIndex" @click="fastText(p, 2)">
              {{ p }}
            </div>
          </div>
          <div class="bz">
            <textarea :disabled="isStar" rows="4" class="pj" style="
                                                    padding: 10px 5px;
                                                    width: 70%;
                                                    background: #f7f6f9;
                                                    font-size: 14px;
                                                    text-indent: 10px;
                                                  " cols v-model="eScore.eBzText" placeholder="请输入评价内容..."></textarea>
          </div>
        </div>
      </div>
      <div slot="footer">
        <el-button @click="studentEvalDialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="addBzWorks" v-if="!isStar">确 定</el-button>
      </div>
    </el-dialog>
    <el-dialog title="个人评价" :visible.sync="studentEvalDialogVisibleTeacher" :append-to-body="true" width="800px"
      :before-close="handleClose" class="dialog_diy">
      <div class="w_name">
        学生姓名：<span>{{ sStudent.student }}</span>
      </div>
      <div class="evalCss">
        <div class="nav">请选择星星进行评分</div>
        <div class="middleBox" v-if="eScore.eStar">
          <div class="pfBox" v-for="(e, eIndex) in rateJson" :key="eIndex">
            <div class="nameAndrate">
              <div>{{ e.value }}</div>
              <el-rate v-model="eScore.eStar[eIndex]" :disabled="isStar"></el-rate>
            </div>
            <div v-if="e.detail">{{ e.detail }}</div>
          </div>
          <div class="easy_comment" v-if="false">
            <div v-for="(p, pIndex) in PlTextList" :key="pIndex" @click="fastText(p, 2)">
              {{ p }}
            </div>
          </div>
          <div class="bz">
            <textarea :disabled="isStar" rows="4" class="pj" style="
                                                    padding: 10px 5px;
                                                    width: 70%;
                                                    background: #f7f6f9;
                                                    font-size: 14px;
                                                    text-indent: 10px;
                                                  " cols v-model="eScore.eBzText" placeholder="请输入评价内容..."></textarea>
          </div>
        </div>
      </div>
      <div slot="footer">
        <el-button @click="studentEvalDialogVisibleTeacher = false">取 消</el-button>
        <el-button type="primary" @click="addBzWorksTeacher" v-if="!isStar">确 定</el-button>
      </div>
    </el-dialog>
    <el-dialog title="选择填空" :visible.sync="dialogVisibleSelect" :append-to-body="true" width="90%"
      :before-close="handleClose" class="dialog_diy dialog_diy3">
      <div v-if="selectJson">
        <div class="select_box2">
          <div class="select_box2_title">
            <div>选择填空</div>
            <div>请选择对应的答案进行答题！</div>
          </div>
          <div class="select_box2_box">
            <div class="select_box2_img">
              <img :src="selectJson.url" @click="previewImg(selectJson.url)" alt="" />
            </div>
            <div :class="isSelect ? 'rightWidthCss' : 'select_box2_answer'">
              <div style="padding-top: 15px">
                <div class="select_answer_title" v-if="isSelect">
                  {{ selectAnswer.stu }}
                </div>
                <div class="select_answer_title" v-else>
                  根据题目选择对应答案
                </div>
                <div class="select_box2_answer_box" v-for="(item2, checkIndex) in selectJson.select" :key="checkIndex">
                  <span style="min-width: 30px">{{ checkIndex + 1 }}、</span>
                  <el-select :disabled="isSelect" v-model="selectAnswer.answer[checkIndex]" placeholder="请选择正确答案">
                    <el-option v-for="(e, eIndex) in selectJson.select" :key="eIndex" :label="e" :value="eIndex">
                    </el-option>
                  </el-select>
                </div>
              </div>
              <div class="rightAnswerCss" v-if="isSelect && (tType == 1 || tType == 4)">
                <div v-for="(a, aIndex) in selectJson.answer" :key="aIndex" class="rightAnswer">
                  <div v-if="selectAnswer.answer[aIndex] === a" style="color: #767de1">
                    回答正确
                  </div>
                  <div v-else>回答错误</div>
                  <div style="margin-left: 10px" v-if="selectAnswer.answer[aIndex] !== a">
                    正确答案：
                  </div>
                  <div :class="selectAnswer.answer[aIndex] === a ? 'blueCss' : 'redCss'
                    ">
                    {{ selectJson.select[a] }}
                  </div>
                </div>
              </div>
            </div>

            <div class="upAnswerCss">
              <el-button type="primary" @click="addSelectAnswer" v-if="!isSelect">提交答案</el-button>
            </div>
          </div>
        </div>
      </div>
    </el-dialog>
    <el-dialog title="选择填空" :visible.sync="dialogVisibleSelectTeacher" :append-to-body="true" width="90%"
      :before-close="handleClose" class="dialog_diy dialog_diy3">
      <div v-if="selectJson">
        <div class="w_name">
          学生姓名：<span>{{ sStudent.student }}</span>
        </div>
        <div class="select_box2">
          <div class="select_box2_title">
            <div>选择填空</div>
            <div>请选择对应的答案进行答题！</div>
          </div>
          <div class="select_box2_box">
            <div class="select_box2_img">
              <img :src="selectJson.url" @click="previewImg(selectJson.url)" alt="" />
            </div>
            <div :class="isSelect ? 'rightWidthCss' : 'select_box2_answer'">
              <div style="padding-top: 15px">
                <div class="select_answer_title" v-if="isSelect">
                  {{ selectAnswer.stu }}
                </div>
                <div class="select_answer_title" v-else>
                  根据题目选择对应答案
                </div>
                <div class="select_box2_answer_box" v-for="(item2, checkIndex) in selectJson.select" :key="checkIndex">
                  <span style="min-width: 30px">{{ checkIndex + 1 }}、</span>
                  <el-select :disabled="isSelect" v-model="selectAnswer.answer[checkIndex]" placeholder="请选择正确答案">
                    <el-option v-for="(e, eIndex) in selectJson.select" :key="eIndex" :label="e" :value="eIndex">
                    </el-option>
                  </el-select>
                </div>
              </div>
              <div class="rightAnswerCss" v-if="isSelect && (tType == 1 || tType == 4)">
                <div v-for="(a, aIndex) in selectJson.answer" :key="aIndex" class="rightAnswer">
                  <div v-if="selectAnswer.answer[aIndex] === a" style="color: #767de1">
                    回答正确
                  </div>
                  <div v-else>回答错误</div>
                  <div style="margin-left: 10px" v-if="selectAnswer.answer[aIndex] !== a">
                    正确答案：
                  </div>
                  <div :class="selectAnswer.answer[aIndex] === a ? 'blueCss' : 'redCss'
                    ">
                    {{ selectJson.select[a] }}
                  </div>
                </div>
              </div>
            </div>

            <div class="upAnswerCss">
              <el-button type="primary" @click="addSelectAnswerTeacher" v-if="!isSelect">提交答案</el-button>
            </div>
          </div>
        </div>
      </div>
    </el-dialog>
    <el-dialog title="教师评分" :visible.sync="dialogVisibleScore" :append-to-body="true" width="800px"
      :before-close="handleClose" class="dialog_diy">
      <div>
        <div class="studentDetail">
          <div class="tx"><img src="../../assets/avatar.png" alt="" /></div>
          <div class="nameAndTime">
            <div style="margin-bottom: 5px">{{ commentDetail.sName }}</div>
            <div>{{ commentDetail.time }}</div>
          </div>
        </div>
        <div class="worksAnswer" v-if="commentDetail.works && commentDetail.type == 2">
          {{ JSON.parse(commentDetail.works)[0].answer }}
        </div>
        <div class="worksAnswer" v-if="commentDetail.works && commentDetail.type == 1">
          <pdf v-if="showPDF" :pdfUrl="pptImgUrl" style="width: 100%; height: 520px; overflow: auto"
            :class="{ fullStyle: full }"></pdf>
          <iframe v-else :src="pptImgUrl" frameborder="0" width="100%" height="600" :class="{ fullStyle: full }"></iframe>
        </div>
        <div class="worksAnswer" v-if="commentDetail.works && commentDetail.type == 0">
          <img :src="commentDetail.works" alt="" @click="previewImg(commentDetail.works)" />
        </div>
        <div class="worksAnswer" v-if="commentDetail.works && commentDetail.type == 3">
          <video-player class="video-player vjs-custom-skin" :playsinline="true" :options="videoDetail"
            @play="onPlayerPlay($event)" style="width: 90%; height: 100%; margin: 0 0 0 30px"></video-player>
        </div>
        <div class="worksAnswer codeFileBox" v-if="commentDetail.works && commentDetail.type == 12"
          @click="downloadFile(commentDetail.works)">
          <img src="../../assets/icon/codeFile.png" />
          <div>点击下载文件</div>
        </div>
        <div class="worksAnswer" v-if="commentDetail.works && commentDetail.type == 13">
          <div v-html="JSON.parse(commentDetail.works).text"></div>
        </div>
        <div class="scoreBox">
          <span class="t">请输入分数</span>
          <el-input-number :disabled="courseDetail.userid != userid" v-model="wScore" :controls="false" :min="0"
            :max="100"></el-input-number>
        </div>
        <div class="scoreDetailBox">
          <span class="t">评分评论</span>
          <el-input type="textarea" :rows="5" :disabled="courseDetail.userid != userid" resize="none"
            v-model="scoreDetail" placeholder="请输入对学生的评价">
          </el-input>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="(dialogVisibleScore = false),
          (commentIndexJson = {}),
          videoDetail.sources && videoDetail.sources[0]
            ? (videoDetail.sources[0].src = '')
            : ''
          ">取 消</el-button>
        <el-button type="primary" v-if="courseDetail.userid == userid" @click="scoreWork(commentDetail.wid)">确 定
        </el-button>
      </span>
    </el-dialog>
    <el-dialog title="连词成句" :visible.sync="dialogVisibleSentence" :append-to-body="true" width="1000px"
      :before-close="handleClose" class="dialog_diy dialog_diy3">
      <div>
        <div class="sentenBox">
          <div v-for="(st, stIndex) in sentenceList" :key="stIndex" style="padding-bottom: 20px">
            <div style="padding: 15px 0 10px 20px">请选择正确顺序</div>
            <div class="cardList" v-if="st.chooseSenList">
              <div class="cardBox">
                <div v-for="(r, rIndex) in st.chooseSenList" :key="rIndex" @click="returnCard(r, stIndex, rIndex)">
                  <el-tooltip class="item" effect="light" :content="r" placement="top" v-if="r != '' && r != undefined">
                    <div :class="{
                      isCard: r,
                      isChooseCard: r == '' || r == undefined,
                    }">
                      <div>{{ r }}</div>
                    </div>
                  </el-tooltip>
                  <div :class="{
                    isCard: r,
                    isChooseCard: r == '' || r == undefined,
                  }" v-else>
                    <div>{{ r }}</div>
                  </div>
                </div>
              </div>
            </div>
            <div class="cardList" v-if="st.addChangeSen">
              <div class="cardBox">
                <div v-for="(s, sIndex) in st.addChangeSen" :key="sIndex" @click="setRightAnswer(s, stIndex, sIndex)">
                  <el-tooltip class="item" effect="light" :content="s" placement="top" v-if="s != '' && s != undefined">
                    <div :class="{ noCard: s == '' || s == undefined, isCard: s }">
                      <div>{{ s }}</div>
                    </div>
                  </el-tooltip>
                  <div :class="{ noCard: s == '' || s == undefined, isCard: s }" v-else>
                    <div>{{ s }}</div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisibleSentence = false">取 消</el-button>
        <el-button type="primary" @click="addSenWorks">确 定</el-button>
      </span>
    </el-dialog>
    <el-dialog title="连词成句" :visible.sync="dialogVisibleSentenceTeacher" :append-to-body="true" width="1000px"
      :before-close="handleClose" class="dialog_diy dialog_diy3">
      <div>
        <div class="w_name">
          学生姓名：<span>{{ sStudent.student }}</span>
        </div>
        <div class="sentenBox">
          <div v-for="(st, stIndex) in sentenceList" :key="stIndex" style="padding-bottom: 20px">
            <div style="padding: 15px 0 10px 20px">请选择正确顺序</div>
            <div class="cardList" v-if="st.chooseSenList">
              <div class="cardBox">
                <div v-for="(r, rIndex) in st.chooseSenList" :key="rIndex" @click="returnCard(r, stIndex, rIndex)">
                  <el-tooltip class="item" effect="light" :content="r" placement="top" v-if="r != '' && r != undefined">
                    <div :class="{
                      isCard: r,
                      isChooseCard: r == '' || r == undefined,
                    }">
                      <div>{{ r }}</div>
                    </div>
                  </el-tooltip>
                  <div :class="{
                    isCard: r,
                    isChooseCard: r == '' || r == undefined,
                  }" v-else>
                    <div>{{ r }}</div>
                  </div>
                </div>
              </div>
            </div>
            <div class="cardList" v-if="st.addChangeSen">
              <div class="cardBox">
                <div v-for="(s, sIndex) in st.addChangeSen" :key="sIndex" @click="setRightAnswer(s, stIndex, sIndex)">
                  <el-tooltip class="item" effect="light" :content="s" placement="top" v-if="s != '' && s != undefined">
                    <div :class="{ noCard: s == '' || s == undefined, isCard: s }">
                      <div>{{ s }}</div>
                    </div>
                  </el-tooltip>
                  <div :class="{ noCard: s == '' || s == undefined, isCard: s }" v-else>
                    <div>{{ s }}</div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisibleSentenceTeacher = false">取 消</el-button>
        <el-button type="primary" @click="addSenWorksTeacher">确 定</el-button>
      </span>
    </el-dialog>
    <el-dialog title="连词成句" :visible.sync="dialogVisibleSentence1" :append-to-body="true" width="1000px"
      :before-close="handleClose" class="dialog_diy dialog_diy3">
      <div>
        <div class="sentenBox">
          <div style="padding: 15px 0 10px 20px; font-size: 20px">
            {{ sentenceList1.stuName }}的作业
          </div>
          <div v-for="(st, stIndex) in sentenceList1" :key="stIndex" style="padding-bottom: 20px">
            <div style="padding: 15px 0 10px 20px; font-size: 20px">
              第{{ stIndex + 1 }}题
            </div>
            <div class="isWrong">
              <div class="cardList1" v-if="st.chooseSenList">
                <div class="cardBox">
                  <div v-for="(s, sIndex) in st.chooseSenList" :key="sIndex">
                    <el-tooltip class="item" effect="light" :content="s" placement="top">
                      <div class="isCard">
                        <div>{{ s }}</div>
                      </div>
                    </el-tooltip>
                  </div>
                </div>
                <div class="cardAnswerBox">
                  组成句子：{{ st.chooseSenList.join(" ") }}
                </div>
              </div>
              <div class="answerRight isTj" v-if="st.chooseSenList.toString() == st.rightAnswer.toString() &&
                (tType == 1 || tType == 4)
                ">
                <div class="isTjImg">
                  <img src="../../assets/icon/conSentences/right.png" alt="" />
                </div>
                <div>回答正确</div>
              </div>
              <div class="answerRight isTj" v-if="st.chooseSenList.toString() != st.rightAnswer.toString() &&
                (tType == 1 || tType == 4)
                ">
                <div class="isTjImg">
                  <img src="../../assets/icon/conSentences/wrong.png" alt="" />
                </div>
                <div>回答错误</div>
              </div>
            </div>
            <div v-if="st.chooseSenList.toString() != st.rightAnswer.toString() &&
              (tType == 1 || tType == 4)
              ">
              <div style="padding: 15px 0 10px 20px">正确答案如下：</div>
              <div class="cardList" v-if="st.rightAnswer" style="border: none; padding: 10px 0 10px 10px; margin: 0">
                <div class="cardBox">
                  <div v-for="(r, rIndex) in st.rightAnswer" :key="rIndex">
                    <el-tooltip class="item" effect="light" :content="r" placement="top">
                      <div class="isCard1">
                        <div>{{ r }}</div>
                      </div>
                    </el-tooltip>
                  </div>
                </div>
                <div class="cardAnswerBox">
                  组成句子：{{ st.rightAnswer.join(" ") }}
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisibleSentence1 = false">取 消</el-button>
        <el-button type="primary" @click="dialogVisibleSentence1 = false">确 定</el-button>
      </span>
    </el-dialog>
    <el-dialog title="提交作业" :visible.sync="dialogVisibleWorks" :append-to-body="true" width="500px"
      :before-close="handleClose" class="dialog_change">
      <div class="marginT">
        <div class="w_name">
          学生姓名：<span>{{ sStudent.student }}</span>
        </div>
        <div>上传文件</div>
        <div class="chapter_add" @click="addImg($event)" v-if="studyJuri[0].cover.length == 0">
          <div class="up_photo">
            <img src="../../assets/uploadImg2.png" alt />
          </div>
          <!-- <input
            type="file"
            accept="video/mp4, video/quicktime, video/x-msvideo,application/pdf, application/.ppt, .pptx, .xlsx, .xls, application/msword, application/vnd.openxmlformats-officedocument.wordprocessingml.document, image/*"
            style="display: none"
            @change="beforeUpload1($event, 1)"
          /> -->
          <input type="file" accept="*" style="display: none" @change="beforeUpload1($event, 1)" />
        </div>
        <!-- capture="camera" -->
        <div class="chapter_add" style="
                                                display: flex;
                                                width: 100%;
                                                flex-direction: row;
                                                flex-wrap: wrap;
                                                justify-content: flex-start;
                                                padding: 15px 0;
                                              " v-if="studyJuri[0].cover.length > 0">
          <div class="upCover">
            <img :src="studyJuri[0].cover[0].url" alt v-if="fileType == 0" />
            <img :src="word" alt v-else-if="fileType == 1" />
            <img :src="video" alt v-else-if="fileType == 2" />
            <img :src="word2" alt v-else-if="fileType == 3" />
            <span class="picName">{{ studyJuri[0].cover[0].name }}</span>

            <div class="deleteWord" @click="clean(1)">
              <img src="../../assets/icon/deleteWorks.png" alt />
            </div>
          </div>
        </div>
      </div>
      <div class="upload_send" @click="addCourseWorksTeacher(taskCount)" v-if="!proVisible">
        提交
      </div>
    </el-dialog>
    <el-dialog title="问答" :visible.sync="answerDialogVisibleTeacher" :append-to-body="true" width="800px"
      :before-close="handleClose" class="dialog_diy">
      <div>
        <div class="w_name">
          学生姓名：<span>{{ sStudent.student }}</span>
        </div>
        <div style="
                                                display: flex;
                                                flex-wrap: nowrap;
                                                flex-direction: column;
                                                position: relative;
                                              ">
          <div class="queTop" style="padding: 20px 0 20px 0">
            <div class="question">
              <img src="../../assets/icon/question.png" alt />
            </div>
            <div class="queTitle">
              <div style="width: 90px; min-width: 90px">提问：</div>
              <div>{{ answerQ }}</div>
            </div>
          </div>
          <div class="ediBottom">
            <textarea rows="6" class="binfo_input" cols style="width: 95%; height: 120px"
              v-model="questionAnswer"></textarea>
          </div>
        </div>
      </div>
      <div slot="footer">
        <el-button @click="answerDialogVisibleTeacher = false">取 消</el-button>
        <el-button type="primary" @click="addQuestionTeacher">提 交</el-button>
      </div>
    </el-dialog>
    <ImgDraw :drawShow="drawShow" @closeDraw="closeDraw" @addImgDraw="addImgDraw" :bg="bg"></ImgDraw>
    <el-dialog title="表格" :visible.sync="dialogVisibleTable" :append-to-body="true" width="95%"
      :before-close="handleClose" class="dialog_diy">
      <el-form>
        <div>表格内容</div>
        <Table v-model="tableJson.text" @change="change" v-if="dialogVisibleTable"></Table>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisibleTable = false">取 消</el-button>
        <el-button type="primary" @click="addTableWorks">确定</el-button>
      </span>
    </el-dialog>
    <el-dialog title="表格" :visible.sync="dialogVisibleTableTeacher" :append-to-body="true" width="95%"
      :before-close="handleClose" class="dialog_diy">
      <el-form>
        <div class="w_name">
          学生姓名：<span>{{ sStudent.student }}</span>
        </div>
        <div>表格内容</div>
        <Table v-model="tableJson.text" @change="change" v-if="dialogVisibleTableTeacher"></Table>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisibleTableTeacher = false">取 消</el-button>
        <el-button type="primary" @click="addTableWorksTeacher">确定</el-button>
      </span>
    </el-dialog>
    <el-dialog title="文档" :visible.sync="dialogVisibleWord" :append-to-body="true" width="95%" :before-close="handleClose"
      class="dialog_diy">
      <el-form>
        <div>文档内容</div>
        <editor-bar v-model="wordJson.text" v-if="dialogVisibleWord"></editor-bar>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisibleWord = false">取 消</el-button>
        <el-button type="primary" @click="addWordWorks">确定</el-button>
      </span>
    </el-dialog>
    <el-dialog title="文档" :visible.sync="dialogVisibleWordTeacher" :append-to-body="true" width="95%"
      :before-close="handleClose" class="dialog_diy">
      <el-form>
        <div class="w_name">
          学生姓名：<span>{{ sStudent.student }}</span>
        </div>
        <div>文档内容</div>
        <editor-bar v-model="wordJson.text" v-if="dialogVisibleWordTeacher"></editor-bar>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisibleWordTeacher = false">取 消</el-button>
        <el-button type="primary" @click="addWordWorksTeacher">确定</el-button>
      </span>
    </el-dialog>
    <el-dialog title="表格" :visible.sync="dialogVisibleTable2" :append-to-body="true" width="95%"
      :before-close="handleClose" class="dialog_diy">
      <el-form>
        <div class="cont" v-html="tableJson.text"></div>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisibleTable2 = false">关 闭</el-button>
      </span>
    </el-dialog>
    <el-dialog title="文档" :visible.sync="dialogVisibleTable3" :append-to-body="true" width="95%"
      :before-close="handleClose" class="dialog_diy">
      <el-form>
        <div class="cont" v-html="tableJson.text"></div>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisibleTable3 = false">关 闭</el-button>
      </span>
    </el-dialog>
    <el-dialog title="分组设置" :visible.sync="dialogVisibleGroup" :append-to-body="true" width="95%"
      :before-close="handleClose" class="dialog_diy">
      <div v-if="dialogVisibleGroup">
        <div v-if="courseDetail.userid == userid" class="g_d_btnBox">
          <div style="color: rgb(171 171 171); margin: 0 10px 0 0">
            提示：需要锁定位置，才能点击头像修改座位。
          </div>
          <div type="primary" v-if="groupJson.islock == 1" class="returnBtn" style="background-color: #225bc7"
            @click="lockChair">
            锁定位置
          </div>
          <div type="primary" v-else class="returnBtn" style="background-color: #225bc7" @click="lockChair">
            解锁位置
          </div>
          <div type="primary" @click="updateGroup" class="returnBtn" style="background-color: #225bc7">
            分组设置
          </div>
        </div>
        <div>
          <div class="g_d_box" v-if="groupJson.group && groupStudent[toolindex]">
            <div class="g_d_group" v-for="(g, gindex) in groupJson.group" :key="gindex">
              <div class="g_d_group_chair">
                <div v-if="groupJson.number > 1">
                  <span :class="{
                    isChair:
                      groupStudent[toolindex][gindex] &&
                      groupStudent[toolindex][gindex][0],
                    updateChair:
                      courseDetail.userid == userid &&
                      groupStudent[toolindex][gindex] &&
                      groupStudent[toolindex][gindex][0] &&
                      groupJson.islock == 2,
                  }"><span class="updateChairBtn" @click="updateGroupChair(
  groupStudent[toolindex][gindex] &&
  groupStudent[toolindex][gindex][0]
)
  ">修改</span></span><span>{{
    groupStudent[toolindex][gindex] &&
    groupStudent[toolindex][gindex][0]
    ? groupStudent[toolindex][gindex] &&
    groupStudent[toolindex][gindex][0].name
    : "空位置"
  }}</span>
                </div>
                <div v-if="groupJson.number > 4">
                  <span :class="{
                    isChair:
                      groupStudent[toolindex][gindex] &&
                      groupStudent[toolindex][gindex][4],
                    updateChair:
                      courseDetail.userid == userid &&
                      groupStudent[toolindex][gindex] &&
                      groupStudent[toolindex][gindex][4] &&
                      groupJson.islock == 2,
                  }"><span class="updateChairBtn" @click="updateGroupChair(
  groupStudent[toolindex][gindex] &&
  groupStudent[toolindex][gindex][4]
)
  ">修改</span></span><span>{{
    groupStudent[toolindex][gindex] &&
    groupStudent[toolindex][gindex][4]
    ? groupStudent[toolindex][gindex] &&
    groupStudent[toolindex][gindex][4].name
    : "空位置"
  }}</span>
                </div>
                <div v-if="groupJson.number > 8">
                  <span :class="{
                    isChair:
                      groupStudent[toolindex][gindex] &&
                      groupStudent[toolindex][gindex][8],
                    updateChair:
                      courseDetail.userid == userid &&
                      groupStudent[toolindex][gindex] &&
                      groupStudent[toolindex][gindex][8] &&
                      groupJson.islock == 2,
                  }"><span class="updateChairBtn" @click="updateGroupChair(
  groupStudent[toolindex][gindex] &&
  groupStudent[toolindex][gindex][8]
)
  ">修改</span></span><span>{{
    groupStudent[toolindex][gindex] &&
    groupStudent[toolindex][gindex][8]
    ? groupStudent[toolindex][gindex] &&
    groupStudent[toolindex][gindex][8].name
    : "空位置"
  }}</span>
                </div>
              </div>
              <div class="g_d_group_tableBox">
                <div class="g_d_group_chair2">
                  <div v-if="groupJson.number > 2">
                    <span :class="{
                      isChair:
                        groupStudent[toolindex][gindex] &&
                        groupStudent[toolindex][gindex][2],
                      updateChair:
                        courseDetail.userid == userid &&
                        groupStudent[toolindex][gindex] &&
                        groupStudent[toolindex][gindex][2] &&
                        groupJson.islock == 2,
                    }"><span class="updateChairBtn" @click="updateGroupChair(
  groupStudent[toolindex][gindex] &&
  groupStudent[toolindex][gindex][2]
)
  ">修改</span></span><span>{{
    groupStudent[toolindex][gindex] &&
    groupStudent[toolindex][gindex][2]
    ? groupStudent[toolindex][gindex] &&
    groupStudent[toolindex][gindex][2].name
    : "空位置"
  }}</span>
                  </div>
                  <div v-if="groupJson.number > 6">
                    <span :class="{
                      isChair:
                        groupStudent[toolindex][gindex] &&
                        groupStudent[toolindex][gindex][6],
                      updateChair:
                        courseDetail.userid == userid &&
                        groupStudent[toolindex][gindex] &&
                        groupStudent[toolindex][gindex][6] &&
                        groupJson.islock == 2,
                    }"><span class="updateChairBtn" @click="updateGroupChair(
  groupStudent[toolindex][gindex] &&
  groupStudent[toolindex][gindex][6]
)
  ">修改</span></span><span>{{
    groupStudent[toolindex][gindex] &&
    groupStudent[toolindex][gindex][6]
    ? groupStudent[toolindex][gindex] &&
    groupStudent[toolindex][gindex][6].name
    : "空位置"
  }}</span>
                  </div>
                </div>
                <div class="g_d_group_table">
                  <div>
                    {{ g.name }}
                  </div>
                  <div>
                    <div v-if="courseDetail.userid == userid && groupJson.islock == 2
                      " @click="deleteGroupChair(gindex)">
                      移除组员
                    </div>
                    <div @click="selectGroup(gindex)" v-else-if="groupStudentUid[toolindex] &&
                      groupStudentUid[toolindex][gindex].indexOf(userid) == -1
                      ">
                      加入分组
                    </div>
                    <div @click="exitGroup(
                      groupStudent[toolindex][gindex] &&
                      groupStudent[toolindex][gindex][
                        groupStudentUid[toolindex][gindex].indexOf(userid)
                      ].id
                    )
                      " v-else-if="groupStudentUid[toolindex] &&
    groupStudentUid[toolindex][gindex].indexOf(userid) != -1
    ">
                      退出分组
                    </div>
                  </div>
                </div>
                <div class="g_d_group_chair2">
                  <div v-if="groupJson.number > 3">
                    <span :class="{
                      isChair:
                        groupStudent[toolindex][gindex] &&
                        groupStudent[toolindex][gindex][3],
                      updateChair:
                        courseDetail.userid == userid &&
                        groupStudent[toolindex][gindex] &&
                        groupStudent[toolindex][gindex][3] &&
                        groupJson.islock == 2,
                    }"><span class="updateChairBtn" @click="updateGroupChair(
  groupStudent[toolindex][gindex] &&
  groupStudent[toolindex][gindex][3]
)
  ">修改</span></span><span>{{
    groupStudent[toolindex][gindex] &&
    groupStudent[toolindex][gindex][3]
    ? groupStudent[toolindex][gindex] &&
    groupStudent[toolindex][gindex][3].name
    : "空位置"
  }}</span>
                  </div>
                  <div v-if="groupJson.number > 7">
                    <span :class="{
                      isChair:
                        groupStudent[toolindex][gindex] &&
                        groupStudent[toolindex][gindex][7],
                      updateChair:
                        courseDetail.userid == userid &&
                        groupStudent[toolindex][gindex] &&
                        groupStudent[toolindex][gindex][7] &&
                        groupJson.islock == 2,
                    }"><span class="updateChairBtn" @click="updateGroupChair(
  groupStudent[toolindex][gindex] &&
  groupStudent[toolindex][gindex][7]
)
  ">修改</span></span><span>{{
    groupStudent[toolindex][gindex] &&
    groupStudent[toolindex][gindex][7]
    ? groupStudent[toolindex][gindex] &&
    groupStudent[toolindex][gindex][7].name
    : "空位置"
  }}</span>
                  </div>
                </div>
              </div>
              <div class="g_d_group_chair">
                <div v-if="groupJson.number > 1">
                  <span :class="{
                    isChair:
                      groupStudent[toolindex][gindex] &&
                      groupStudent[toolindex][gindex][1],
                    updateChair:
                      courseDetail.userid == userid &&
                      groupStudent[toolindex][gindex] &&
                      groupStudent[toolindex][gindex][1] &&
                      groupJson.islock == 2,
                  }"><span class="updateChairBtn" @click="updateGroupChair(
  groupStudent[toolindex][gindex] &&
  groupStudent[toolindex][gindex][1]
)
  ">修改</span></span><span>{{
    groupStudent[toolindex][gindex] &&
    groupStudent[toolindex][gindex][1]
    ? groupStudent[toolindex][gindex] &&
    groupStudent[toolindex][gindex][1].name
    : "空位置"
  }}</span>
                </div>
                <div v-if="groupJson.number > 5">
                  <span :class="{
                    isChair:
                      groupStudent[toolindex][gindex] &&
                      groupStudent[toolindex][gindex][5],
                    updateChair:
                      courseDetail.userid == userid &&
                      groupStudent[toolindex][gindex] &&
                      groupStudent[toolindex][gindex][5] &&
                      groupJson.islock == 2,
                  }"><span class="updateChairBtn" @click="updateGroupChair(
  groupStudent[toolindex][gindex] &&
  groupStudent[toolindex][gindex][5]
)
  ">修改</span></span><span>{{
    groupStudent[toolindex][gindex] &&
    groupStudent[toolindex][gindex][5]
    ? groupStudent[toolindex][gindex] &&
    groupStudent[toolindex][gindex][5].name
    : "空位置"
  }}</span>
                </div>
                <div v-if="groupJson.number > 9">
                  <span :class="{
                    isChair:
                      groupStudent[toolindex][gindex] &&
                      groupStudent[toolindex][gindex][9],
                    updateChair:
                      courseDetail.userid == userid &&
                      groupStudent[toolindex][gindex] &&
                      groupStudent[toolindex][gindex][9] &&
                      groupJson.islock == 2,
                  }"><span class="updateChairBtn" @click="updateGroupChair(
  groupStudent[toolindex][gindex] &&
  groupStudent[toolindex][gindex][9]
)
  ">修改</span></span><span>{{
    groupStudent[toolindex][gindex] &&
    groupStudent[toolindex][gindex][9]
    ? groupStudent[toolindex][gindex] &&
    groupStudent[toolindex][gindex][9].name
    : "空位置"
  }}</span>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <!-- <el-button @click="(dialogVisibleGroup = false)">关 闭</el-button> -->
      </span>
    </el-dialog>
    <el-dialog title="分组设置" :visible.sync="dialogVisibleGroup2" :append-to-body="true" width="650px"
      :before-close="handleClose" class="dialog_diy">
      <div class="groupBox">
        <div v-if="groupJson2.group" class="groupContent">
          <div class="groupTitle">请设置小组数量</div>
          <div v-for="(item, index) in groupJson2.group" :key="index" class="groupName">
            <span class="groupn">组{{ index + 1 }}名称:</span>
            <el-input v-model="item.name" placeholder="请输入名称..." style="width: 250px"></el-input>
            <!-- <div class="groupBtn">
              <el-button type="primary" size="small" @click="addGroup(index)">
                添加</el-button>
              <el-button type="primary" size="small" @click="deleteGroup(index)"
                v-if="groupJson2.group && groupJson2.group.length > 1">删除</el-button>
            </div> -->
          </div>
        </div>
        <div class="groupContent">
          <div class="groupTitle">请设置每组人数数量</div>
          <!-- <el-input v-model="groupJson.number" placeholder="2-10人以内"
            style="width: 150px; margin: 10px 10px 0 0"></el-input> -->
          <el-input-number v-model="groupJson2.number" :controls="false" :min="2" :max="10"
            placeholder="2-10人以内"></el-input-number>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisibleGroup2 = false">取 消</el-button>
        <el-button type="primary" @click="updateGroupJson">确定</el-button>
      </span>
    </el-dialog>
    <el-dialog title="作业提交" :visible.sync="dialogVisibleGroupWork" :append-to-body="true" width="500px"
      :before-close="handleClose" class="dialog_change">
      <div class="marginT">
        <div>上传文件</div>
        <div class="chapter_add" @click="addImg($event)" v-if="studyJuri[0].cover.length == 0">
          <div class="up_photo">
            <img src="../../assets/icon/uploadImg.png" alt />
          </div>
          <!-- <input
            type="file"
            accept="video/mp4, video/quicktime, video/x-msvideo,application/pdf, application/.ppt, .pptx, .xlsx, .xls, application/msword, application/vnd.openxmlformats-officedocument.wordprocessingml.document, image/*"
            style="display: none"
            @change="beforeUpload1($event, 1)"
          /> -->
          <input type="file" accept="*" style="display: none" @change="beforeUpload1($event, 1)" />
        </div>
        <!-- capture="camera" -->
        <div class="chapter_add" style="
                                                display: flex;
                                                width: 100%;
                                                flex-direction: row;
                                                flex-wrap: wrap;
                                                justify-content: flex-start;
                                                padding: 15px 0;
                                              " v-if="studyJuri[0].cover.length > 0">
          <div class="upCover">
            <img :src="studyJuri[0].cover[0].url" alt v-if="fileType == 0" />
            <img :src="word" alt v-else-if="fileType == 1" />
            <img :src="video" alt v-else-if="fileType == 2" />
            <img :src="word2" alt v-else-if="fileType == 3" />
            <span class="picName">{{ studyJuri[0].cover[0].name }}</span>

            <div class="deleteWord" @click="clean(1)">
              <img src="../../assets/icon/deleteWorks.png" alt />
            </div>
          </div>
        </div>
      </div>
      <div class="upload_send" @click="addCourseWorks2(taskCount)" v-if="!proVisible">
        提交
      </div>
    </el-dialog>
    <el-dialog title="修改分组" :visible.sync="dialogVisibleUpdateGroup" :append-to-body="true" width="350px"
      :before-close="handleClose" class="dialog_diy">
      <div>
        <h2>
          {{ this.updateGroupUser.name }}
        </h2>
        <div style="color: rgb(171 171 171); margin-top: 10px">
          请选择要进入的分组
        </div>
        <el-radio-group v-model="checkChair">
          <el-radio style="display: block; margin-top: 20px" v-for="(item, index) in updateGroupArray" :label="item.label"
            :key="index">{{ item.name }}</el-radio>
        </el-radio-group>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisibleUpdateGroup = false">取 消</el-button>
        <el-button type="primary" @click="updateChair">确定</el-button>
      </span>
    </el-dialog>
    <el-dialog title="移除组员" :visible.sync="dialogVisibleDeleteGroup" :append-to-body="true" width="350px"
      :before-close="handleClose" class="dialog_diy">
      <div>
        <h2>
          {{ this.deleteGroupArray.name }}
        </h2>
        <div style="color: rgb(171 171 171); margin-top: 10px">
          请选择要删除的组员
        </div>
        <el-checkbox-group v-model="checkDeleteGroup">
          <el-checkbox style="display: block; margin-top: 20px" v-for="(item, index) in deleteGroupUser"
            :label="item.userid" :key="index">{{ item.name }}</el-checkbox>
        </el-checkbox-group>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisibleDeleteGroup = false">取 消</el-button>
        <el-button type="primary" @click="deleteChair">确定</el-button>
      </span>
    </el-dialog>
    <el-dialog title="批量上传" :visible.sync="dialogVisiblePl" :append-to-body="true" width="700px"
      :before-close="handleClose" class="dialog_change">
      <div class="marginT">
        <div class="plworkBox">
          <div class="chapter_add" style="
                                                  display: flex;
                                                  width: 150px;
                                                  flex-direction: row;
                                                  flex-wrap: wrap;
                                                  justify-content: flex-start;
                                                  margin: 0 10px 10px 0;
                                                " v-for="(item, index) in plworkFile" :key="index">
            <div class="upCover2">
              <img :src="item.url" alt v-if="item.fileType == 1" />
              <img :src="word" alt v-else-if="item.fileType == 4" />
              <img :src="video" alt v-else />
              <!-- <span class="picName">{{ item.name }}</span> -->
              <!-- <el-input
                v-model="item.username"
                placeholder="请输入学生名字"
                style="margin-top: 10px"
              ></el-input> -->

              <el-select style="margin-top: 10px" v-model="item.username" filterable allow-create placeholder="请选择学生">
                <el-option v-for="item1 in checkUpload" :key="item1.userid"
                  :label="item1.name ? item1.name : item1.username" :value="item1.userid">
                </el-option>
              </el-select>

              <div class="deleteWord" @click="clean2(index)">
                <img src="../../assets/icon/deleteWorks.png" alt />
              </div>
            </div>
          </div>
          <div class="chapter_add" style="width: auto" @click="addImg($event)">
            <div class="up_photo2">
              <img src="../../assets/icon/plwork.png" alt />
              <span>点击上传文件</span>
            </div>
            <input type="file"
              accept="video/mp4, video/quicktime, video/x-msvideo,application/pdf, application/.ppt, .pptx, .xlsx, .xls, application/msword, application/vnd.openxmlformats-officedocument.wordprocessingml.document, image/*"
              multiple="multiple" style="display: none" @change="beforeUpload3($event, 6)" />
          </div>
        </div>
      </div>
      <!-- capture="camera" -->
      <div class="upload_send" @click="addCourseWorksPl(taskCount)" v-if="!proVisible2">
        提交
      </div>
    </el-dialog>
    <el-dialog title="修改名称" :visible.sync="dialogVisibleSname" width="500px" :before-close="handleClose"
      class="dialog_diy" center>
      <div style="text-align: center">
        <span class="tian1">名称</span>
        <el-select v-model="worksSName" filterable allow-create style="width: 250px; margin: 15px 0px"
          placeholder="请选择学生">
          <el-option v-for="item in uploadStudentJuri" :key="item.userid" :label="item.name ? item.name : item.username"
            :value="item.userid">
          </el-option>
        </el-select>
        <!-- <el-input
          v-model="worksSName"
          style="width: 250px; margin: 15px 0px"
        ></el-input> -->
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisibleSname = false">取 消</el-button>
        <el-button type="primary" @click="updateName">确 定</el-button>
      </span>
    </el-dialog>
    <interVideo :dialogVisibleVideo.sync="dialogVisibleVideo" :videoJson="videoJson" :userid="userid" :id="id"
      :courseType="courseType" :taskCount="taskCount" :toolindex="toolindex" v-if="dialogVisibleVideo"></interVideo>
    <el-dialog :title="sStudent.student" :visible.sync="dialogVisibleStudentTool" :append-to-body="true" width="700px"
      :before-close="handleClose" class="dialog_diy">
      <div>
        <div class="dia_tool_box">
          <div class="tool" @click="teacherWorkSubmit(1, 0, taskCount)">
            <div class="whiteBIcon">
              <img src="../../assets/icon/secondToolList/whiteBoard.png" alt />
              <div style="margin: 5px 0">电子白板</div>
            </div>
          </div>
          <div class="tool">
            <div class="whiteBIcon" @click="teacherWorkSubmit(3, 0, taskCount)">
              <img src="../../assets/icon/secondToolList/mindMapping.png" alt />
              <div style="margin: 5px 0">思维导图</div>
            </div>
          </div>
          <div class="tool">
            <div class="whiteBIcon">
              <img src="../../assets/icon/fourthToolList/text.png" alt />
              <div style="margin: 5px 0">文档</div>
            </div>
          </div>
        </div>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import "../../common/aws-sdk-2.235.1.min.js";
// import pdf from "../components/pdf3";
import pdf from "../components/vpdf";
import AskStatic from "../components/askStatic";
import AskStatic2 from "../components/askStatic2";
import AnswerData2 from "../components/answerData2";
import AnswerData from "../components/answerData";
import EditorBar from "../tools/wangEnduit.vue";
import Table from "../tools/table.vue";
import Time from "../tools/time.vue";
import Mind from "../tools/jsmind.vue";
import Sunburst from "../tools/sunburst";
import SeeBoard from "../tools/seeBoard";
import * as imageConversion from "image-conversion";
import Audio from "../components/audio.vue";
import ImgDraw from "../tools/imgDraw/imgDraw";
import { Empty } from "element-ui";
import RecordRTC from "recordrtc";
import interVideo from "../interVideo/index.vue"

export default {
  components: {
    EditorBar,
    Time,
    pdf,
    AskStatic,
    AskStatic2,
    Mind,
    Sunburst,
    SeeBoard,
    AnswerData2,
    AnswerData,
    Audio,
    ImgDraw,
    Table,
    interVideo
  },
  data() {
    return {
      bg: null,
      drawShow: false,
      dialogVisible: false,
      dialogVisiblePl: false,
      commentDialogVisible: false,
      videoVisible: false,
      isStar: false,
      studentEvalDialogVisible: false,
      studentEvalDialogVisibleTeacher: false,
      dialogVisibleSelect: false,
      dialogVisibleSelectTeacher: false,
      dialogVisibleScore: false,
      dialogVisibleSentence: false,
      dialogVisibleSentenceTeacher: false,
      dialogVisibleSentence1: false,
      dialogVisibleWorks: false,
      answerDialogVisibleTeacher: false,
      dialogVisibleTable: false,
      dialogVisibleTableTeacher: false,
      dialogVisibleWord: false,
      dialogVisibleWordTeacher: false,
      dialogVisibleTable2: false,
      dialogVisibleTable3: false,
      dialogVisibleGroupWork: false,
      dialogVisibleUpdateGroup: false,
      dialogVisibleDeleteGroup: false,
      dialogVisibleSname: false,
      dialogVisibleVideo: false,
      dialogVisibleStudentTool: false,
      worksSName: "",
      classJuri: [],
      uploadStudentJuri: [],
      uploadCid: "",
      snameWid: "",
      sStudent: {},
      sTool: "",
      bzText: "",
      commentDetail: [],
      selectAnswer: [],
      videoDetail: {},
      selectJson: {},
      eScore: { eBzText: "", eStar: [] },
      id: this.$route.query.courseId,
      userid: this.$route.query.userid,
      classId: this.$route.query.cid,
      // courseTypeLine: this.$route.query.type,
      oid: this.$route.query.oid,
      org: this.$route.query.org,
      tType: this.$route.query.tType,
      courseType: this.$route.query.type,
      screenType: this.$route.query.screenType,
      tcid2: this.$route.query.tcid,
      tcid: "",
      pptImgUrl: "",
      pptImgUrl1: "",
      commentText: "",
      full: false,
      sIsOpen: false,
      IsLookOpen: false,
      IsFollow: false,
      pzDialog: false,
      contentDialog: false,
      mlDialog: false,
      type: 1,
      sentenceList: [{ sentenceTitle: "", addSentence: [], rightAnswer: [] }],
      sentenceList1: [],
      tableJson: [],
      wordJson: [],
      vedio: [],
      text: [],
      textList: [],
      line: [],
      lineList: [],
      chapTools: [],
      chapToolList: [],
      file: [],
      fileC: [],
      vedioTime: [],
      upToolImg: "",
      preTime: 0,
      rateList: {
        ca: 0,
      },
      rateParams: [],
      colors: ["#DFDFDF", "#DFDFDF", "#DFDFDF"],
      studyJuri: [
        {
          content: "",
          cover: [],
          upVedio: [],
          upFile: [],
        },
      ],
      plworkFile: [],
      mr: require("../../assets/vedioPic.png"),
      word: require("../../assets/icon/isWord.png"),
      word2: require("../../assets/icon/word2.png"),
      video: require("../../assets/icon/isVideo.png"),
      noLikes: require("../../assets/icon/comment/noLikes.png"),
      likes: require("../../assets/icon/comment/likes.png"),
      scoreImg: require("../../assets/score.png"),
      courseDetail: {},
      isSelect: false,
      chapInfo: [],
      chapInfoList: [],
      taskCount: 0,
      imgList: [],
      noImgList: [],
      pzList: [],
      PlTextList: [
        "Excellent！",
        "nice！",
        "很有创意！",
        "还不错哦～",
        "继续努力哦～",
      ],
      isClickNav: "",
      navId: "",
      playerOptions: {
        playbackRates: [0.7, 1.0, 1.5, 2.0], //播放速度
        autoplay: false, //如果true,浏览器准备好时开始回放。
        muted: false, // 默认情况下将会消除任何音频。
        loop: false, // 导致视频一结束就重新开始。
        preload: "auto", // 建议浏览器在<video>加载元素后是否应该开始下载视频数据。auto浏览器选择最佳行为,立即开始加载视频（如果浏览器支持）
        language: "zh-CN",
        aspectRatio: "16:9", // 将播放器置于流畅模式，并在计算播放器的动态大小时使用该值。值应该代表一个比例 - 用冒号分隔的两个数字（例如"16:9"或"4:3"）
        fluid: true, // 当true时，Video.js player将拥有流体大小。换句话说，它将按比例缩放以适应其容器。
        sources: [
          {
            type: "video/mp4", //这里的种类支持很多种：基本视频格式、直播、流媒体等，具体可以参看git网址项目   || "video/ogg"|| "video/webm"
            src: "", //url地址require("../../../assets/media/aaa.mp4")
          },
        ],
        // poster: require("../../../assets/tu31.png"), //你的封面地址
        // poster: dataRes.imgUrl, //你的封面地址
        notSupportedMessage: "此视频暂无法播放，请稍后再试", //允许覆盖Video.js无法播放媒体源时显示的默认信息。
        controlBar: {
          timeDivider: true, //当前时间和持续时间的分隔符
          durationDisplay: true, //显示持续时间
          remainingTimeDisplay: false, //是否显示剩余时间功能
          fullscreenToggle: true, //全屏按钮
        },
      },
      playerOptions1: {
        playbackRates: [0.7, 1.0, 1.5, 2.0], //播放速度
        autoplay: false, //如果true,浏览器准备好时开始回放。
        muted: false, // 默认情况下将会消除任何音频。
        loop: false, // 导致视频一结束就重新开始。
        preload: "auto", // 建议浏览器在<video>加载元素后是否应该开始下载视频数据。auto浏览器选择最佳行为,立即开始加载视频（如果浏览器支持）
        language: "zh-CN",
        aspectRatio: "16:9", // 将播放器置于流畅模式，并在计算播放器的动态大小时使用该值。值应该代表一个比例 - 用冒号分隔的两个数字（例如"16:9"或"4:3"）
        fluid: true, // 当true时，Video.js player将拥有流体大小。换句话说，它将按比例缩放以适应其容器。
        sources: [
          {
            type: "video/mp4", //这里的种类支持很多种：基本视频格式、直播、流媒体等，具体可以参看git网址项目   || "video/ogg"|| "video/webm"
            src: "", //url地址require("../../../assets/media/aaa.mp4")
          },
        ],
        // poster: require("../../../assets/tu31.png"), //你的封面地址
        // poster: dataRes.imgUrl, //你的封面地址
        notSupportedMessage: "此视频暂无法播放，请稍后再试", //允许覆盖Video.js无法播放媒体源时显示的默认信息。
        controlBar: {
          timeDivider: true, //当前时间和持续时间的分隔符
          durationDisplay: true, //显示持续时间
          remainingTimeDisplay: false, //是否显示剩余时间功能
          fullscreenToggle: true, //全屏按钮
        },
      },
      playerO: {},
      noneBtnImg: false,
      proVisible: false,
      proVisible2: false,
      progress: 0,
      isFinishSize: 0,
      isAllSize: 0,
      questionAnswer: "",
      answerQ: "", //问答标题
      rateJson: [],
      wbCount: 0,
      wordCount: 0,
      mindCount: 0,
      askCount: 0,
      noteCount: 0,
      mindNetWorkCount: 0,
      libraryCount: 0,
      workCount: 0,
      timeCount: 0,
      answerCount: 0,
      trainCount: 0,
      evalCount: 0,
      dialogImageUrl: "",
      pictureDialog: false,
      toolType: 0,
      toolTypeList: [],
      dialogVisible1: false,
      dialogVisible2: false,
      dialogVisible3: false,
      dialogVisible6: false,
      dialogVisible4: false,
      isNoHomeWork: false,
      dialogVisible5: false,
      dialogVisible5Teacher: false,
      dialogVisibleChoice: false,
      dialogVisibleChoiceTeacher: false,
      answerDialogVisible: false,
      juriVisible: false,
      timeDialogVisible: false,
      radio: [],
      isAsk: false,
      askJson: {
        askCount: 1,
        askTitle: "",
        askJson: [{ askstitle: "", askItem: 1, checkList: [] }],
      },
      testJson: {},
      checkJson: [],
      askList: [],
      answerList: [],
      navList: [],
      addPzDialog: false,
      ispzType: 1,
      pzConText: "",
      worksStudent: [],
      worksStudent2: [],
      worksTeacher: [],
      isCloseList: [],
      workStudent: [],
      groupStudent: [],
      groupStudentUid: [],
      noWorksS: [],
      isWorksS: [],
      noWorksStudent: [],
      toolindex: 0,
      groupIndex: 0,
      workTypeB: false,
      workTypeC: false,
      isAnswer: false,
      timer: null,
      opertimer: null,
      showType: 0,
      fileType: 0,
      showPDF: false,
      noteName: "",
      evaJuri: [],
      evalua: "",
      eTitle: "",
      eName: "",
      eJson: {},
      fid: "", //一级
      sid: "", //二级
      tid: "", //二级
      typeMode: 1,
      eJSONNum: 0,
      Etype: 1,
      data: {
        meta: {
          name: "example",
          author: "dd@163.com",
          version: "0.2",
        },
        format: "node_array",
        data: [{ id: "root", isroot: true, topic: "" }],
      },
      fullDialogVisible: false,
      fulltype: "",
      fullUrl: "",
      commentIndexJson: {},
      Stbodywidth: 0,
      pzType: 1,
      wScore: 0,
      scoreDetail: "",
      videoStart: false,
      recorder: null,
      groupJson: {},
      groupJson2: {},
      dialogVisibleGroup: false,
      dialogVisibleGroup2: false,
      updateGroupArray: [],
      updateGroupUser: {},
      deleteGroupUser: [],
      deleteGroupArray: {},
      checkChair: "",
      checkDeleteGroup: [],
      inviteCode: "",
      courseGroupStudent: [],
      courseGroupStudentUid: [],
      courseGroup: {},
      isGroup: false,
      toolIndex: null,
      tool: {},
      isWorkTool: [16, 32, 57, 4, 45, 15, 1, 3, 6, 7, 26, 41, 47, 48, 52, 50, 40],//, 40
      videoJson: {},
    };
  },
  methods: {
    jump() {
      window.parent.postMessage({ tools: "43" }, "*");
    },
    previewImg(url) {
      this.$hevueImgPreview(url);
    },
    change(val) {
      console.log(val);
    },
    goTo(path) {
      this.$router.push(path);
    },
    handlePictureCardPreview(url) {
      this.dialogImageUrl = url;
      this.pictureDialog = true;
    },
    clean(type) {
      if (type == 1) {
        this.studyJuri[0].cover.splice(0, 1);
      } else if (type == 2) {
        this.studyJuri[0].upVedio.splice(0, 1);
      } else {
        this.studyJuri[0].upFile.splice(0, 1);
      }
    },
    clean2(index) {
      this.plworkFile.splice(index, 1);
    },
    handleClose(done) {
      if (this.videoDetail.sources && this.videoDetail.sources[0]) {
        this.videoDetail.sources[0].src = "";
      }
      this.commentIndexJson = {};
      done();
    },
    fullTools() {
      this.full = !this.full;
    },
    imgChange(file, fileList, type) {
      if (type == 1) {
        var _tmp = this.studyJuri[0].cover;
      } else if (type == 2) {
        var _tmp = this.studyJuri[0].upVedio;
      } else {
        var _tmp = this.studyJuri[0].upFile;
      }
      this.noneBtnImg = _tmp.length >= 1;
    },
    setContent(bool) {
      this.contentDialog = bool
      if (bool && this.mlDialog) {
        document.querySelector('.workd_media').style.height = "650px"
      } else {
        document.querySelector('.workd_media').style.height = "auto"
      }
    },
    setContent2(bool) {
      this.mlDialog = bool
      if (bool && this.contentDialog) {
        document.querySelector('.workd_media').style.height = "650px"
      } else {
        document.querySelector('.workd_media').style.height = "auto"
      }
    },
    addImg(e) {
      var el = e.currentTarget;
      // this.$message.success('触发上传')
      el.getElementsByTagName("input")[0].click();
      e.target.value = "";
    },
    addSelectAnswer() {
      let params = [
        {
          uid: this.userid,
          cid: this.id,
          stage: this.courseType,
          task: this.taskCount,
          tool: this.toolindex,
          content: this.selectAnswer.answer,
          type: 7,
        },
      ];
      this.ajax
        .post(this.$store.state.api + "addCourseWorks", params)
        .then((res) => {
          this.$message({
            message: "提交成功",
            type: "success",
          });
          this.dialogVisibleSelect = false;
          // this.selectAnswer = {};
          this.selectSWorks();
          this.selectStudent();
        })
        .catch((err) => {
          this.$message.error("提交失败");
          console.error(err);
        });
    },
    addSelectAnswerTeacher() {
      let params = [
        {
          uid: this.sStudent.userid,
          cid: this.id,
          stage: this.courseType,
          task: this.taskCount,
          tool: this.toolindex,
          content: this.selectAnswer.answer,
          type: 7,
        },
      ];
      this.ajax
        .post(this.$store.state.api + "addCourseWorks", params)
        .then((res) => {
          this.$message({
            message: "提交成功",
            type: "success",
          });
          this.dialogVisibleSelectTeacher = false;
          // this.selectAnswer = {};
          this.selectSWorks();
          this.selectStudent();
        })
        .catch((err) => {
          this.$message.error("提交失败");
          console.error(err);
        });
    },
    addSenWorks() {
      for (var i = 0; i < this.sentenceList.length; i++) {
        for (var j = 0; j < this.sentenceList[i].chooseSenList.length; j++) {
          if (
            this.sentenceList[i].chooseSenList[j] == undefined ||
            this.sentenceList[i].chooseSenList[j] == ""
          ) {
            this.$message.error("请将答案填写完整！");
            return;
          }
        }
      }
      let params = [
        {
          uid: this.userid,
          cid: this.id,
          stage: this.courseType,
          task: this.taskCount,
          tool: this.toolindex,
          content: JSON.stringify(this.sentenceList),
          type: 9,
        },
      ];
      this.ajax
        .post(this.$store.state.api + "addCourseWorks", params)
        .then((res) => {
          this.$message({
            message: "提交成功",
            type: "success",
          });
          this.dialogVisibleSentence = false;
          // this.selectAnswer = {};
          this.selectSWorks();
          this.selectStudent();
        })
        .catch((err) => {
          this.$message.error("提交失败");
          console.error(err);
        });
    },
    addSenWorksTeacher() {
      for (var i = 0; i < this.sentenceList.length; i++) {
        for (var j = 0; j < this.sentenceList[i].chooseSenList.length; j++) {
          if (
            this.sentenceList[i].chooseSenList[j] == undefined ||
            this.sentenceList[i].chooseSenList[j] == ""
          ) {
            this.$message.error("请将答案填写完整！");
            return;
          }
        }
      }
      let params = [
        {
          uid: this.sStudent.userid,
          cid: this.id,
          stage: this.courseType,
          task: this.taskCount,
          tool: this.toolindex,
          content: JSON.stringify(this.sentenceList),
          type: 9,
        },
      ];
      this.ajax
        .post(this.$store.state.api + "addCourseWorks", params)
        .then((res) => {
          this.$message({
            message: "提交成功",
            type: "success",
          });
          this.dialogVisibleSentenceTeacher = false;
          // this.selectAnswer = {};
          this.selectSWorks();
          this.selectStudent();
        })
        .catch((err) => {
          this.$message.error("提交失败");
          console.error(err);
        });
    },
    addTableWorks() {
      let params = [
        {
          uid: this.userid,
          cid: this.id,
          stage: this.courseType,
          task: this.taskCount,
          tool: this.toolindex,
          content: JSON.stringify(this.tableJson).replaceAll(/%/g, "%25"),
          type: 10,
        },
      ];
      this.ajax
        .post(this.$store.state.api + "addCourseWorks", params)
        .then((res) => {
          this.$message({
            message: "提交成功",
            type: "success",
          });
          this.dialogVisibleTable = false;
          // this.selectAnswer = {};
          this.selectSWorks();
          this.selectStudent();
        })
        .catch((err) => {
          this.$message.error("提交失败");
          console.error(err);
        });
    },
    addTableWorksTeacher() {
      let params = [
        {
          uid: this.sStudent.userid,
          cid: this.id,
          stage: this.courseType,
          task: this.taskCount,
          tool: this.toolindex,
          content: JSON.stringify(this.tableJson).replaceAll(/%/g, "%25"),
          type: 10,
        },
      ];
      this.ajax
        .post(this.$store.state.api + "addCourseWorks", params)
        .then((res) => {
          this.$message({
            message: "提交成功",
            type: "success",
          });
          this.dialogVisibleTableTeacher = false;
          // this.selectAnswer = {};
          this.selectSWorks();
          this.selectStudent();
        })
        .catch((err) => {
          this.$message.error("提交失败");
          console.error(err);
        });
    },
    addWordWorks() {
      let params = [{
        uid: this.userid,
        cid: this.id,
        stage: this.courseType,
        task: this.taskCount,
        tool: this.toolindex,
        content: JSON.stringify(this.wordJson).replaceAll(/%/g, "%25"),
        type: 13,
        atool: 52,
      }];
      console.log(params);
      this.ajax
        .post(this.$store.state.api + "addCourseWorks3-2", params)
        .then((res) => {
          this.$message({
            message: "提交成功",
            type: "success",
          });
          this.dialogVisibleWord = false;
          // this.selectAnswer = {};
          this.selectSWorks();
          this.selectStudent();
        })
        .catch((err) => {
          this.$message.error("提交失败");
          console.error(err);
        });
    },
    addWordWorksTeacher() {
      let params = [{
        uid: this.sStudent.userid,
        cid: this.id,
        stage: this.courseType,
        task: this.taskCount,
        tool: this.toolindex,
        content: JSON.stringify(this.wordJson).replaceAll(/%/g, "%25"),
        type: 13,
        atool: 52,
      }];
      console.log(params);
      this.ajax
        .post(this.$store.state.api + "addCourseWorks3-2", params)
        .then((res) => {
          this.$message({
            message: "提交成功",
            type: "success",
          });
          this.dialogVisibleWordTeacher = false;
          // this.selectAnswer = {};
          this.selectSWorks();
          this.selectStudent();
        })
        .catch((err) => {
          this.$message.error("提交失败");
          console.error(err);
        });
    },
    addCourseWorks(i) {
      var typesql;
      if (this.fileType === 0) {
        typesql = 1;
      } else if (this.fileType === 1) {
        typesql = 4;
      } else if (this.fileType === 2) {
        typesql = 5;
      } else if (this.fileType === 3) {
        typesql = 12;
      }

      if (!this.studyJuri[0].cover[0].url) {
        this.$message.error("请上传文件");
        return;
      }
      let params = [
        {
          uid: this.userid,
          cid: this.id,
          stage: this.courseType,
          task: i,
          tool: this.toolindex,
          content: this.studyJuri[0].cover[0].url,
          type: typesql,
        },
      ];
      this.ajax
        .post(this.$store.state.api + "addCourseWorksR", params)
        .then((res) => {
          this.$message({
            message: "提交成功",
            type: "success",
          });
          this.studyJuri[0].cover = [];
          this.dialogVisible = false;
          this.getCourseDetail();
        })
        .catch((err) => {
          this.$message.error("提交失败");
          console.error(err);
        });
    },

    addCourseWorksPl(i) {
      let _files = this.plworkFile;
      var c = 1;
      for (var k = 0; k < _files.length; k++) {
        if (!_files[k].username) {
          c = 2;
        }
      }
      if (c == 2) {
        this.$message.error("请填写学生姓名");
        return;
      }
      let params = [
        {
          ateacher: this.userid,
          cid: this.id,
          stage: this.courseType,
          task: i,
          tool: this.toolindex,
          content: JSON.stringify(_files).replaceAll(/%/g, "%25"),
        },
      ];
      this.ajax
        .post(this.$store.state.api + "addCourseWorksPl", params)
        .then((res) => {
          this.$message({
            message: "提交成功",
            type: "success",
          });
          this.plworkFile = [];
          this.dialogVisiblePl = false;
          this.getCourseDetail();
        })
        .catch((err) => {
          this.$message.error("提交失败");
          console.error(err);
        });
    },
    addCourseWorks2(i) {
      var typesql;
      if (this.fileType === 0) {
        typesql = 0;
      } else if (this.fileType === 1) {
        typesql = 1;
      } else if (this.fileType === 2) {
        typesql = 3;
      } else if (this.fileType === 3) {
        typesql = 12;
      }

      if (!this.studyJuri[0].cover[0].url) {
        this.$message.error("请上传文件");
        return;
      }
      let params = [
        {
          uid: this.userid,
          cid: this.id,
          stage: this.courseType,
          task: i,
          tool: this.toolindex,
          content: JSON.stringify({
            type: typesql,
            groupIndex: this.groupIndex,
            url: this.studyJuri[0].cover[0].url,
          }).replaceAll(/%/g, "%25"),
          type: 11,
          atool: 49,
          text: "",
        },
      ];
      this.ajax
        .post(this.$store.state.api + "addCourseWorks5", params)
        .then((res) => {
          this.$message({
            message: "提交成功",
            type: "success",
          });
          this.studyJuri[0].cover = [];
          this.dialogVisibleGroupWork = false;
          this.getCourseDetail();
        })
        .catch((err) => {
          this.$message.error("提交失败");
          console.error(err);
        });
    },
    addCourseWorksGong(i, data, tool) {
      let params = [
        {
          uid: this.userid,
          cid: this.id,
          stage: this.courseType,
          task: this.taskCount,
          tool: i,
          content: data,
          type: 12,
          atool: tool,
          text: "",
        },
      ];
      this.ajax
        .post(this.$store.state.api + "addCourseWorks5", params)
        .then((res) => {
          this.$message({
            message: "提交成功",
            type: "success",
          });
          this.studyJuri[0].cover = [];
          this.selectSWorks();
          this.selectStudent();
        })
        .catch((err) => {
          this.$message.error("提交失败");
          console.error(err);
        });
    },
    addCourseWorksGongTeacher(i, data, tool) {
      let params = [
        {
          uid: this.sStudent.userid,
          cid: this.id,
          stage: this.courseType,
          task: this.taskCount,
          tool: i,
          content: data,
          type: 12,
          atool: tool,
          text: "",
        },
      ];
      this.ajax
        .post(this.$store.state.api + "addCourseWorks5", params)
        .then((res) => {
          this.$message({
            message: "提交成功",
            type: "success",
          });
          this.studyJuri[0].cover = [];
          this.dialogVisibleWorks = false;
          this.selectSWorks();
          this.selectStudent();
        })
        .catch((err) => {
          this.$message.error("提交失败");
          console.error(err);
        });
    },
    addCourseWorksGongPl(i, data, tool, type) {
      let params = [
        {
          uid: this.sStudent.userid,
          cid: this.id,
          stage: this.courseType,
          task: this.taskCount,
          tool: i,
          content: data,
          type: type,
          atool: tool,
          text: "",
        },
      ];
      this.ajax
        .post(this.$store.state.api + "addCourseWorks5", params)
        .then((res) => {
          this.$message({
            message: "提交成功",
            type: "success",
          });
          this.studyJuri[0].cover = [];
          this.dialogVisibleWorks = false;
          this.selectSWorks();
          this.selectStudent();
        })
        .catch((err) => {
          this.$message.error("提交失败");
          console.error(err);
        });
    },
    addCourseWorksTeacher(i) {
      var typesql;
      if (this.sTool == 32 || this.sTool == 57) {
        this.addCourseWorksGongTeacher(this.toolindex, this.studyJuri[0].cover[0].url, this.sTool);
        return;
      }
      if (this.fileType === 0) {
        typesql = 1;
      } else if (this.fileType === 1) {
        typesql = 4;
      } else if (this.fileType === 2) {
        typesql = 5;
      } else if (this.fileType === 3) {
        typesql = 12;
      }

      if (this.sTool == 50) {
        this.addCourseWorksGongPl(this.toolindex, this.studyJuri[0].cover[0].url, this.sTool, typesql);
        return;
      }

      if (!this.studyJuri[0].cover[0].url) {
        this.$message.error("请上传文件");
        return;
      }
      let params = [
        {
          uid: this.sStudent.userid,
          cid: this.id,
          stage: this.courseType,
          task: i,
          tool: this.toolindex,
          content: this.studyJuri[0].cover[0].url,
          type: typesql,
          ateacher: this.userid,
        },
      ];
      this.ajax
        .post(this.$store.state.api + "addCourseWorksTeacher", params)
        .then((res) => {
          this.$message({
            message: "提交成功",
            type: "success",
          });
          this.studyJuri[0].cover = [];
          this.dialogVisibleWorks = false;
          this.getCourseDetail();
        })
        .catch((err) => {
          this.$message.error("提交失败");
          console.error(err);
        });
    },
    selectUploadStudent() {
      let params = {
        cid: this.tcid ? this.tcid : this.courseDetail.juri,
        oid: this.oid,
        cn: '',
      };
      this.ajax
        .get(this.$store.state.api + "selectSnameByCidGroup", params)
        .then((res) => {
          var studentK = [];
          if (this.isWorksS[this.toolindex].length > 0) {
            for (var z = 0; z < this.isWorksS[this.toolindex].length; z++) {
              studentK.push(this.isWorksS[this.toolindex][z].uid);
            }
            studentK = studentK.join(",");
          }
          this.uploadStudentJuri = res.data[0].filter((el) => {
            return studentK.indexOf(el.userid) == -1
          });
        })
        .catch((err) => {
          console.error(err);
        });
    },
    arrayToArray(arrayo, arrayt) {
      let array1 = arrayo;
      let array2 = arrayt;

      let commonElements = [];

      for (let i = 0; i < array1.length; i++) {
        for (let j = 0; j < array2.length; j++) {
          if (array1[i] === array2[j]) {
            commonElements.push(array1[i]);
          }
        }
      }
      return commonElements
    },
    selectWorksStudent() {
      let params = {
        oid: this.oid,
        cid: this.courseDetail.juri,
      };
      this.ajax
        .get(this.$store.state.api + "selectWorksStudent", params)
        .then((res) => {
          var a = res.data[0];
          this.noWorksS = [];
          var studentK = [];
          if (this.isWorksS.length > 0) {
            for (var z = 0; z < this.isWorksS.length; z++) {
              studentK.push(this.isWorksS[z].uid);
            }
            studentK = studentK.join(",");
            for (var j = 0; j < a.length; j++) {
              // if (studentK.indexOf(a[j].userid) == -1) {
              if (this.tcid) {
                // a[j].classid.indexOf(this.tcid) != -1  
                if (this.arrayToArray(a[j].classid.split(","), this.tcid.split(",")).length) {
                  this.noWorksS.push({
                    student: a[j].name,
                    userid: a[j].userid,
                    type: studentK.indexOf(a[j].userid) == -1 ? '1' : '2'
                  });
                }
              } else {
                this.noWorksS.push({
                  student: a[j].name,
                  userid: a[j].userid,
                  type: studentK.indexOf(a[j].userid) == -1 ? '1' : '2'
                });
              }
              // }
            }
          } else {
            for (var k = 0; k < a.length; k++) {
              if (this.tcid) {
                if (this.arrayToArray(a[k].classid.split(","), this.tcid.split(",")).length) {
                  this.noWorksS.push({
                    student: a[k].name,
                    userid: a[k].userid,
                    type: '1'
                  });
                }
              } else {
                this.noWorksS.push({
                  student: a[k].name,
                  userid: a[k].userid,
                  type: '1'
                });
              }
            }
          }
          // this.noWorksS = this.noWorksS.sort(function (a, b) {
          //     let jscoreA = parseInt(a.type);
          //     let jscoreB = parseInt(b.type);
          //     return jscoreB - jscoreA;
          //   });
          this.$forceUpdate();
          if (
            Object.keys(this.commentDetail).length &&
            Object.keys(this.commentIndexJson).length &&
            !this.dialogVisibleScore
          ) {
            let a = 1;
            let c = this.commentIndexJson;
            console.log(c);
            if (
              this.commentIndexJson.gindex ||
              this.commentIndexJson.gindex === 0
            ) {
              for (
                var i = 0;
                i < this.worksStudent.length;
                i++
              ) {
                let _el = this.worksStudent[i];
                groupA: for (var k = 0; k < _el.length; k++) {
                  let el = _el[k];
                  if (el.wid == this.commentDetail.wid) {
                    a = 2;
                    this.commentOther(
                      this.worksStudent[i][k],
                      this.commentIndexJson.toolIndex,
                      k,
                      this.commentIndexJson.gindex
                    );
                    break groupA;
                  }
                }
              }
              if (a === 1) {
                this.commentDetail = [];
                this.commentIndexJson = {};
                this.commentDialogVisible = false;
                this.$message("此作业已被删除");
              }
            } else {

              if (this.isGroup && this.commentIndexJson.gid) {
                groupA: for (
                  var i = 0;
                  i < this.courseGroup.group.length;
                  i++
                ) {
                  let _group = this.courseGroup.group[i]
                  if (_group.id == this.commentIndexJson.gid) {
                    let _el2 = _group.works[this.commentIndexJson.toolIndex];
                    for (var k = 0; k < _el2.length; k++) {
                      let el2 = _el2[k];
                      if (el2.wid == this.commentDetail.wid) {
                        a = 2;
                        this.commentOther(
                          _el2[k],
                          this.commentIndexJson.toolIndex,
                          k,
                          null,
                          this.commentIndexJson.gid
                        );
                        break groupA;
                      }
                    }
                  }
                }
              }
              if (a == 1) {
                for (
                  var i = 0;
                  i < this.worksStudent.length;
                  i++
                ) {
                  let el = this.worksStudent[i];
                  if (el.wid == this.commentDetail.wid) {
                    a = 2;
                    this.commentOther(
                      this.worksStudent[i],
                      this.commentIndexJson.toolIndex,
                      i
                    );
                    break;
                  }
                }
              }
              if (a === 1) {
                this.commentDetail = [];
                this.commentIndexJson = {};
                this.commentDialogVisible = false;
                this.$message("此作业已被删除");
              }
            }
          }
        })
        .catch((err) => {
          console.error(err);
        });
    },
    selectStudent() {
    },
    openVideo(w) {
      this.videoDetail = {};
      this.playerOptions1.sources[0].src = w.works;
      this.videoDetail = this.playerOptions1;
      this.videoVisible = true;
    },
    isLikes(wid, uid, t, c, isLikes) {
      if (isLikes == false) {
        let params = [
          {
            wid: wid,
            lid: uid,
            t: t,
            c: c,
          },
        ];
        this.ajax
          .post(this.$store.state.api + "insertComment", params)
          .then((res) => {
            this.$message({
              message: "点赞成功",
              type: "success",
            });
            this.selectSWorks();
            this.selectStudent();
          })
          .catch((err) => {
            this.$message.error("点赞失败");
            console.error(err);
          });
      } else {
        let params = {
          wid: wid,
          lid: uid,
          type: t,
        };
        this.ajax
          .get(this.$store.state.api + "deleteComment", params)
          .then((res) => {
            this.$message({
              message: "取消点赞成功",
              type: "success",
            });
            this.selectSWorks();
            this.selectStudent();
          })
          .catch((err) => {
            console.error(err);
          });
      }
    },
    deleteComment(wid) {
      this.$confirm("确定删除此评论吗？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          let params = {
            id: wid,
          };
          this.ajax
            .get(this.$store.state.api + "deleteComment2", params)
            .then((res) => {
              this.$message({
                message: "删除评论成功",
                type: "success",
              });
              this.selectSWorks();
              this.selectStudent();
            })
            .catch((err) => {
              console.error(err);
            });
        })
        .catch(() => { });
    },
    commentOther(w, toolIndex, wIndex, gindex, gid) {
      this.commentIndexJson = {
        toolIndex: toolIndex,
        wIndex: wIndex,
        gindex: gindex,
        gid: gid
      };
      this.commentDetail = [];
      this.commentDialogVisible = true;
      this.commentDetail = w;
      if (w.works && w.type == 1) {
        this.pptImgUrl = "";
        var a = ["PPT", "PPTX", "XLSX", "XLS", "DOC", "DOCX"];
        if (
          a.indexOf(
            w.works
              .split(".")
            [w.works.split(".").length - 1].toLocaleUpperCase()
          ) != -1
        ) {
          this.pptImgUrl =
            "https://view.officeapps.live.com/op/view.aspx?src=" + w.works;
          this.showPDF = false;
        } else if (
          w.works
            .split(".")
          [w.works.split(".").length - 1].toLocaleUpperCase() == "PDF"
        ) {
          this.pptImgUrl = w.works;
          this.showPDF = true;
        }
      } else if (w.works && w.type == 3) {
        this.videoDetail = {};
        this.playerOptions1.sources[0].src = w.works;
        this.videoDetail = this.playerOptions1;
        // this.videoVisible = true;
      } else if (w.works && w.type == 4) {
        this.eScore = JSON.parse(w.works);
        this.rateJson =
          this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
            this.taskCount
          ].toolChoose[toolIndex].rateJson;
      } else if (w.works && w.type == 10) {
        this.commentDetail.works = JSON.parse(this.commentDetail.works);
      } else if (w.works && w.type == 13) {
        this.wordJson =
          this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
            this.taskCount
          ].toolChoose[toolIndex].wordJson;
      }
    },
    openScore(w) {
      this.wScore = 0;
      this.wScore = w.score ? JSON.parse(w.score).wScore : 0;
      this.scoreDetail = w.score ? JSON.parse(w.score).detail : "";
      this.commentDetail = [];
      this.dialogVisibleScore = true;
      this.commentDetail = w;

      if (w.works && w.type == 1) {
        this.pptImgUrl = "";
        var a = ["PPT", "PPTX", "XLSX", "XLS", "DOC", "DOCX"];
        if (
          a.indexOf(
            w.works
              .split(".")
            [w.works.split(".").length - 1].toLocaleUpperCase()
          ) != -1
        ) {
          this.pptImgUrl =
            "https://view.officeapps.live.com/op/view.aspx?src=" + w.works;
          this.showPDF = false;
        } else if (
          w.works
            .split(".")
          [w.works.split(".").length - 1].toLocaleUpperCase() == "PDF"
        ) {
          this.pptImgUrl = w.works;
          this.showPDF = true;
        }
      } else if (w.works && w.type == 3) {
        this.videoDetail = {};
        this.playerOptions1.sources[0].src = w.works;
        this.videoDetail = this.playerOptions1;
      }
    },
    addComment(wid, uid, t) {
      if (this.commentText == "") {
        this.$message.error("请输入评论");
        return;
      }
      let params2 = [
        {
          wid: wid,
          lid: uid,
          t: t,
        },
      ];
      this.ajax
        .post(this.$store.state.api + "getComment", params2)
        .then((res) => {
          if (res.data[0].length > 0) {
            this.$message.error("一个作业只能评论一条");
          } else {
            let params = [
              {
                wid: wid,
                lid: uid,
                t: t,
                c: this.commentText,
              },
            ];
            this.ajax
              .post(this.$store.state.api + "insertComment", params)
              .then((res) => {
                this.$message({
                  message: "评论成功",
                  type: "success",
                });
                this.commentText = "";
                this.selectSWorks();
                this.selectStudent();
              })
              .catch((err) => {
                this.$message.error("评论失败");
                console.error(err);
              });
          }
        })
        .catch((err) => {
          // this.$message.error("评论失败");
          console.error(err);
        });
    },
    scoreWork(wid) {
      if (this.wScore == 0) {
        this.$message.error("请评分");
        return;
      }
      let params = [
        {
          wid: wid,
          score: JSON.stringify({
            wScore: this.wScore,
            detail: this.scoreDetail,
          }),
        },
      ];
      this.ajax
        .post(this.$store.state.api + "scoreWork", params)
        .then((res) => {
          this.$message({
            message: "评分成功",
            type: "success",
          });
          this.wScore = 0;
          this.scoreDetail = "";
          this.dialogVisibleScore = false;
          this.selectSWorks();
          this.selectStudent();
        })
        .catch((err) => {
          this.$message.error("评分失败");
          console.error(err);
        });
    },
    openXz(w, i) {
      this.selectJson = this.chapInfoList[this.courseType].chapterInfo[0]
        .taskJson[this.taskCount].toolChoose[i].selectJson
        ? JSON.parse(
          JSON.stringify(
            this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
              this.taskCount
            ].toolChoose[i].selectJson
          )
        )
        : { url: "", select: [], answer: [] };
      var a = w.works.split(",");
      for (var k = 0; k < a.length; k++) {
        a[k] = parseInt(a[k]);
      }
      this.selectAnswer = { answer: a, stu: w.sName };
      this.isSelect = true;
      this.dialogVisibleSelect = true;
    },
    openSen(w, i) {
      this.sentenceList1 = JSON.parse(w.works);
      this.sentenceList1.stuName = w.sName;
      this.dialogVisibleSentence1 = true;
    },
    openPj(w, toolindex) {
      this.isStar = true;
      this.eScore = JSON.parse(w);
      this.rateJson =
        this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
          this.taskCount
        ].toolChoose[toolindex].rateJson;
      this.studentEvalDialogVisible = true;
    },
    deleteWorks(id) {
      this.$confirm("确定删除此作业吗？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          let params = [
            {
              id: id,
            },
          ];
          this.ajax
            .post(this.$store.state.api + "deleteCourseWork", params)
            .then((res) => {
              this.$message({
                message: "删除成功",
                type: "success",
              });
              this.selectStudent();
              this.selectSWorks();
              this.selectSLook();
            })
            .catch((err) => {
              this.$message.error("网络异常");
              console.error(err);
            });
        })
        .catch(() => { });
    },
    selectSWorks(gindex) {
      //教师查看全部作业
      let params = {
        cid: this.id,
        s: this.courseType,
        t: this.taskCount,
      };
      this.ajax
        .get(this.$store.state.api + "selectSWorks", params)
        .then((res) => {
          var a = 1;
          var b = res.data[0];
          var c = ["PDF", "DOC", "DOCX", "PPT", "PPTX", "XLSX", "XLS"];
          var y = [
            "AVI",
            "NAVI",
            "MPEG",
            "ASF",
            "MOV",
            "WMV",
            "3GP",
            "RM",
            "RMVB",
            "FLV",
            "F4V",
            "H.264",
            "H.265",
            "REAL VIDEO",
            "MKV",
            "WebM",
            "HDDVD",
            "MP4",
            "MPG",
            "M4V",
            "MGV",
            "OGV",
            "QTM",
            "STR",
            "AMC",
            "DVX",
            "EVO",
            "DAT",
            "OGG",
            "OGM",
          ];
          var d = res.data[1];
          var e = res.data[2];
          var f = res.data[3];

          let worksStudent = [];
          let worksTeacher = [];
          let worksStudent2 = [];
          if (
            !this.isCloseList ||
            this.isCloseList.isClose == undefined
          ) {
            this.isCloseList = { isClose: 0 };
          }
          this.groupStudent = [];
          this.groupStudentUid = [];
          this.isWorksS = [];
          this.checkJson = [];
          for (var j = 0; j < b.length; j++) {
            if (b[j].ttype == 2 && this.tcid && this.arrayToArray(b[j].classid.split(","), this.tcid.split(",")).length == 0) {
              continue;
            }
            var likesCount = 0;
            var commentCount = 0;
            var isLikes = false;
            var commentJson = [];
            var data = b[j];
            for (var k = 0; k < d.length; k++) {
              //点赞
              if (d[k].workId == b[j].id) {
                likesCount++;

                if (d[k].likesId == this.userid) {
                  isLikes = true;
                }
              }
            }
            for (var l = 0; l < e.length; l++) {
              //评论
              if (e[l].workId == b[j].id) {
                if (e[l].comment != "") {
                  commentCount++;
                  commentJson.push({
                    commentText: e[l].comment,
                    commentTime: e[l].commentTime,
                    commentPeople: e[l].commentPeople,
                    userid: e[l].userid,
                    wid: e[l].id,
                  });
                }
              }
            }

            if (b[j].type == 1 && (b[j].atool == 1 || b[j].atool == 3)) {
              let _works = {
                userid: b[j].userid,
                ateacher: b[j].ateacher,
                wid: b[j].id,
                works: b[j].content,
                sName: b[j].name,
                type: 0,
                time: b[j].time,
                score: b[j].score,
                img: b[j].img,
                likesCount: likesCount,
                commentCount: commentCount,
                isLikes: isLikes,
                commentJson: commentJson,
              }
              if (b[j].ttype == 1) {
                worksTeacher.push(_works);
              } else {
                worksStudent2.push(_works);
              }
              worksStudent.push(_works);
              this.isWorksS.push({ uid: b[j].userid, sName: b[j].name });
            }
          }
          if (worksStudent && worksStudent.length) {
            worksStudent = worksStudent.sort(function (a, b) {
              let jscoreA = a.score ? JSON.parse(a.score).wScore : 0;
              let jscoreB = b.score ? JSON.parse(b.score).wScore : 0;
              var scoreA = parseFloat(jscoreA);
              var scoreB = parseFloat(jscoreB);
              if (scoreA == scoreB) {
                return b.likesCount - a.likesCount;
              }
              return scoreB - scoreA;
            });
          }
          if (worksStudent2 && worksStudent2.length) {
            worksStudent2 = worksStudent2.sort(function (a, b) {
              let jscoreA = a.score ? JSON.parse(a.score).wScore : 0;
              let jscoreB = b.score ? JSON.parse(b.score).wScore : 0;
              var scoreA = parseFloat(jscoreA);
              var scoreB = parseFloat(jscoreB);
              if (scoreA == scoreB) {
                return b.likesCount - a.likesCount;
              }
              return scoreB - scoreA;
            });
          }
          if (worksTeacher && worksTeacher.length) {
            worksTeacher = worksTeacher.sort(function (a, b) {
              let jscoreA = a.score ? JSON.parse(a.score).wScore : 0;
              let jscoreB = b.score ? JSON.parse(b.score).wScore : 0;
              var scoreA = parseFloat(jscoreA);
              var scoreB = parseFloat(jscoreB);
              if (scoreA == scoreB) {
                return b.likesCount - a.likesCount;
              }
              return scoreB - scoreA;
            });
          }
          this.worksStudent = worksStudent
          this.worksTeacher = worksTeacher
          this.worksStudent2 = worksStudent2
          this.$forceUpdate()
          this.selectWorksStudent();
        })
        .catch((err) => {
          console.error(err);
        });
    },
    pngToWhiteBg(file) {
      const _file = file;
      let read = new FileReader();
      read.readAsDataURL(file); // 文件转base64
      return new Promise((resolve, reject) => {
        read.onload = (e) => {
          let img = new Image();
          img.src = e.target.result;
          img.onload = async () => {
            // 生成canvas
            let canvas = document.createElement("canvas");
            let context = canvas.getContext("2d");
            // 绘制图片到canvas上
            canvas.width = img.width;
            canvas.height = img.height;

            // 在canvas绘制前填充白色背景
            context.fillStyle = "#fff";
            context.fillRect(0, 0, canvas.width, canvas.height);
            context.drawImage(img, 0, 0);
            let base64 = canvas.toDataURL(file["type"], 1);
            let newFile = this.dataUrlToFile(base64, _file);
            resolve(newFile);
          };

        };
      });
    },
    dataUrlToFile(dataurl, file) {
      let arr = dataurl.split(","),
        mime = arr[0].match(/:(.*?);/)[1],
        bstr = atob(arr[1]),
        n = bstr.length,
        u8arr = new Uint8Array(n);
      while (n--) {
        u8arr[n] = bstr.charCodeAt(n);
      }
      // return new Blob([u8arr], { type: mime });
      return new File([new Blob([u8arr], { type: mime })], file.name, {
        type: mime,
      });
    },
    async beforeUpload1(event, type, i) {
      // this.$message.success('进入上传')
      var file = "";
      if (type == 5) {
        file = event;
      } else {
        file = event.target.files[0];
      }
      var credentials = {
        accessKeyId: "AKIATLPEDU37QV5CHLMH",
        secretAccessKey: "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",
      }; //秘钥形式的登录上传
      window.AWS.config.update(credentials);
      window.AWS.config.region = "cn-northwest-1"; //设置区域

      var bucket = new window.AWS.S3({ params: { Bucket: "ccrb" } }); //选择桶
      var _this = this;
      _this.progress = 0;
      _this.proVisible = true;
      _this.isFinishSize = 0;
      _this.isAllSize = (file.size / 1024 / 1024).toFixed(2);
      var b = [
        "DOC",
        "DOCX",
        "DOCM",
        "DOTM",
        "DOTX",
        "PPTX",
        "PPSX",
        "PPT",
        "PPS",
        "PPTM",
        "POTM",
        "PPAM",
        "POTX",
        "PPSM",
      ];
      var excelA = ["XLSX", "XLXB", "XLS", "XLSM"];
      var photoA = [
        "BMP",
        "GIF",
        "PNG",
        "JPGE",
        "JPG",
        "TIF",
        "PCX",
        "TGA",
        "EXIF",
        "FPX",
        "SVG",
        "APNG",
      ];
      // if (
      //   b.indexOf(
      //     file.name
      //       .split(".")
      //     [file.name.split(".").length - 1].toLocaleUpperCase()
      //   ) != -1
      // ) {
      //   if (file.size / 1024 / 1024 > 10) {
      //     this.$message.error("上传文件大于10兆,请重新选择文件！");
      //     return;
      //   }
      // } else if (
      //   excelA.indexOf(
      //     file.name
      //       .split(".")
      //     [file.name.split(".").length - 1].toLocaleUpperCase()
      //   ) != "-1"
      // ) {
      //   if (file.size / 1024 / 1024 > 5) {
      //     this.$message.error("添加成上传文件大于5兆,请重新选择文件！");
      //     return;
      //   }
      // }

      if (
        photoA.indexOf(
          file.name
            .split(".")
          [file.name.split(".").length - 1].toLocaleUpperCase()
        ) != -1 &&
        type != 4
      ) {
        // const blob = await imageConversion.compress(file, 0.8)
        file = await this.pngToWhiteBg(file);
        const blob = await imageConversion.compressAccurately(file, 256);
        // const blob = await imageConversion.compressAccurately(file, {type:file.type});
        file = new File([blob], file.name, { type: file.type });
      }

      if (file) {
        var params = {
          Key:
            file.name.split(".")[0] +
            new Date().getTime() +
            "." +
            file.name.split(".")[file.name.split(".").length - 1],
          ContentType: file.type,
          Body: file,
          "Access-Control-Allow-Credentials": "*",
          ACL: "public-read",
        }; //key可以设置为桶的相抵路径，Body为文件， ACL最好要设置
        var options = {
          // partSize: 2048 * 1024 * 1024,
          partSize: 1024 * 1024 * 1024,
          queueSize: 2,
          leavePartsOnError: true,
        };
        bucket
          .upload(params, options)
          .on("httpUploadProgress", function (evt) {
            //这里可以写进度条
            // console.log("Uploaded : " + parseInt((evt.loaded * 80) / evt.total) + '%');
            _this.progress = parseInt((evt.loaded / evt.total) * 100);
            _this.isFinishSize = (evt.loaded / 1024 / 1024).toFixed(2);
          })
          .send(function (err, data) {
            _this.progress = 100;
            _this.isFinishSize = _this.isAllSize;
            setTimeout(() => {
              _this.proVisible = false;
            }, 1000);
            if (err) {
              var a = _this.$refs.upload1.uploadFiles;
              a.splice(a.length - 1, a.length);
              _this.$message.error("上传失败");
            } else {
              // _this.$message.success('上传成功')
              var b = ["PDF", "DOC", "DOCX", "PPT", "PPTX", "XLSX", "XLS"];
              var c = [
                "AVI",
                "NAVI",
                "MPEG",
                "ASF",
                "MOV",
                "WMV",
                "3GP",
                "RM",
                "RMVB",
                "FLV",
                "F4V",
                "H.264",
                "H.265",
                "REAL VIDEO",
                "MKV",
                "WebM",
                "HDDVD",
                "MP4",
                "MPG",
                "M4V",
                "MGV",
                "OGV",
                "QTM",
                "STR",
                "AMC",
                "DVX",
                "EVO",
                "DAT",
                "OGG",
                "OGM",
              ];
              if (type == 1) {
                _this.studyJuri[0].cover.push({
                  name: file.name,
                  url: data.Location,
                  uid: file.uid,
                });
                if (
                  c.indexOf(
                    _this.studyJuri[0].cover[0].url
                      .split(".")
                    [
                      _this.studyJuri[0].cover[0].url.split(".").length - 1
                    ].toLocaleUpperCase()
                  ) != -1
                ) {
                  _this.fileType = 2;
                } else if (
                  b.indexOf(
                    _this.studyJuri[0].cover[0].url
                      .split(".")
                    [
                      _this.studyJuri[0].cover[0].url.split(".").length - 1
                    ].toLocaleUpperCase()
                  ) != -1
                ) {
                  _this.fileType = 1;
                } else if (photoA.indexOf(
                  _this.studyJuri[0].cover[0].url
                    .split(".")
                  [
                    _this.studyJuri[0].cover[0].url.split(".").length - 1
                  ].toLocaleUpperCase()
                ) != -1) {
                  _this.fileType = 0;
                } else {
                  _this.fileType = 3;
                }
                _this.imgChange(null, null, type);
              } else if (type == 2) {
                _this.upToolImg = data.Location;
                _this.imgChange(null, null, type);
                _this.addCourseWorks(i);
              } else if (type == 4) {
                _this.addPz("3", data.Location);
              } else if (type == 5) {
                _this.addImgDrawImG(data.Location);
              } else if (type == 6) {
                var _ftype = 1;
                if (
                  c.indexOf(
                    data.Location.split(".")[
                      data.Location.split(".").length - 1
                    ].toLocaleUpperCase()
                  ) != -1
                ) {
                  _ftype = 5;
                } else if (
                  b.indexOf(
                    data.Location.split(".")[
                      data.Location.split(".").length - 1
                    ].toLocaleUpperCase()
                  ) != -1
                ) {
                  _ftype = 4;
                } else {
                  _ftype = 1;
                }
                _this.plworkFile.push({
                  name: file.name,
                  url: data.Location,
                  uid: file.uid,
                  fileType: _ftype,
                  username:
                    _this.plworkFile.length + 1 > 10
                      ? _this.plworkFile.length + 1
                      : "0" + (_this.plworkFile.length + 1),
                });
              } else if (type == 7) {
                _this.addCourseWorksGong(i, data.Location, 32);
              } else if (type == 8) {
                _this.addCourseWorksGong(i, data.Location, 57);
              }
              _this.imgChange(null, null, type);
              console.log(data.Location);
              // _this.$message.success('上传成功'+data.Location)
            }
          });
      }
    },
    async beforeUpload3(event, type, i) {
      // this.$message.success('进入上传')
      let file = "";
      let cfindex2 = 0;
      for (var cfindex = 0; cfindex < event.target.files.length; cfindex++) {

        file = event.target.files[cfindex];

        var credentials = {
          accessKeyId: "AKIATLPEDU37QV5CHLMH",
          secretAccessKey: "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",
        }; //秘钥形式的登录上传
        window.AWS.config.update(credentials);
        window.AWS.config.region = "cn-northwest-1"; //设置区域

        var bucket = new window.AWS.S3({ params: { Bucket: "ccrb" } }); //选择桶
        var _this = this;
        // _this.progress = 0;
        _this.proVisible2 = true;
        var b = [
          "DOC",
          "DOCX",
          "DOCM",
          "DOTM",
          "DOTX",
          "PPTX",
          "PPSX",
          "PPT",
          "PPS",
          "PPTM",
          "POTM",
          "PPAM",
          "POTX",
          "PPSM",
        ];
        var excelA = ["XLSX", "XLXB", "XLS", "XLSM"];
        var photoA = [
          "BMP",
          "GIF",
          "PNG",
          "JPGE",
          "JPG",
          "TIF",
          "PCX",
          "TGA",
          "EXIF",
          "FPX",
          "SVG",
          "APNG",
        ];
        if (
          photoA.indexOf(
            file.name
              .split(".")
            [file.name.split(".").length - 1].toLocaleUpperCase()
          ) != -1 &&
          type != 4
        ) {
          // const blob = await imageConversion.compress(file, 0.8)
          file = await this.pngToWhiteBg(file);
          const blob = await imageConversion.compressAccurately(file, 256);
          // const blob = await imageConversion.compressAccurately(file, {type:file.type});
          file = new File([blob], file.name, { type: file.type });
        }

        if (file) {
          var params = {
            Key:
              file.name.split(".")[0] +
              new Date().getTime() +
              "." +
              file.name.split(".")[file.name.split(".").length - 1],
            ContentType: file.type,
            Body: file,
            "Access-Control-Allow-Credentials": "*",
            ACL: "public-read",
          }; //key可以设置为桶的相抵路径，Body为文件， ACL最好要设置
          var options = {
            // partSize: 2048 * 1024 * 1024,
            partSize: 1024 * 1024 * 1024,
            queueSize: 2,
            leavePartsOnError: true,
          };
          bucket
            .upload(params, options)
            .on("httpUploadProgress", function (evt) {
              //这里可以写进度条
              // console.log("Uploaded : " + parseInt((evt.loaded * 80) / evt.total) + '%');
              // _this.progress = parseInt((evt.loaded * 80) / evt.total);
            })
            .send(function (err, data) {
              // _this.progress = 100;
              cfindex2++;

              setTimeout(() => {
                if (
                  cfindex2 == event.target.files.length - 1 ||
                  cfindex2 > event.target.files.length - 1
                ) {
                  _this.proVisible2 = false;
                }
              }, 1000);
              if (err) {
                var a = _this.$refs.upload1.uploadFiles;
                a.splice(a.length - 1, a.length);
                _this.$message.error("上传失败");
              } else {
                // _this.$message.success('上传成功')
                var b = ["PDF", "DOC", "DOCX", "PPT", "PPTX", "XLSX", "XLS"];
                var c = [
                  "AVI",
                  "NAVI",
                  "MPEG",
                  "ASF",
                  "MOV",
                  "WMV",
                  "3GP",
                  "RM",
                  "RMVB",
                  "FLV",
                  "F4V",
                  "H.264",
                  "H.265",
                  "REAL VIDEO",
                  "MKV",
                  "WebM",
                  "HDDVD",
                  "MP4",
                  "MPG",
                  "M4V",
                  "MGV",
                  "OGV",
                  "QTM",
                  "STR",
                  "AMC",
                  "DVX",
                  "EVO",
                  "DAT",
                  "OGG",
                  "OGM",
                ];
                if (type == 1) {
                  _this.studyJuri[0].cover.push({
                    name: file.name,
                    url: data.Location,
                    uid: file.uid,
                  });
                  if (
                    c.indexOf(
                      _this.studyJuri[0].cover[0].url
                        .split(".")
                      [
                        _this.studyJuri[0].cover[0].url.split(".").length - 1
                      ].toLocaleUpperCase()
                    ) != -1
                  ) {
                    _this.fileType = 2;
                  } else if (
                    b.indexOf(
                      _this.studyJuri[0].cover[0].url
                        .split(".")
                      [
                        _this.studyJuri[0].cover[0].url.split(".").length - 1
                      ].toLocaleUpperCase()
                    ) != -1
                  ) {
                    _this.fileType = 1;
                  } else {
                    _this.fileType = 0;
                  }
                  _this.imgChange(null, null, type);
                } else if (type == 2) {
                  _this.upToolImg = data.Location;
                  _this.imgChange(null, null, type);
                  _this.addCourseWorks(i);
                } else if (type == 4) {
                  _this.addPz("3", data.Location);
                } else if (type == 5) {
                  _this.addImgDrawImG(data.Location);
                } else if (type == 6) {
                  var _ftype = 1;
                  if (
                    c.indexOf(
                      data.Location.split(".")[
                        data.Location.split(".").length - 1
                      ].toLocaleUpperCase()
                    ) != -1
                  ) {
                    _ftype = 5;
                  } else if (
                    b.indexOf(
                      data.Location.split(".")[
                        data.Location.split(".").length - 1
                      ].toLocaleUpperCase()
                    ) != -1
                  ) {
                    _ftype = 4;
                  } else {
                    _ftype = 1;
                  }
                  _this.plworkFile.push({
                    name: file.name,
                    url: data.Location,
                    uid: file.uid,
                    fileType: _ftype,
                    username:
                      _this.plworkFile.length + 1 > 9
                        ? _this.plworkFile.length + 1
                        : "0" + (_this.plworkFile.length + 1),
                  });
                }
                _this.imgChange(null, null, type);
                console.log(data.Location);
                // _this.$message.success('上传成功'+data.Location)
              }
            });
        }
      }
    },
    beforeUpload2(event, type) {
      var file = event.target.files[0];
      var credentials = {
        accessKeyId: "AKIATLPEDU37QV5CHLMH",
        secretAccessKey: "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",
      }; //秘钥形式的登录上传
      window.AWS.config.update(credentials);
      window.AWS.config.region = "cn-northwest-1"; //设置区域

      var bucket = new window.AWS.S3({ params: { Bucket: "ccrb" } }); //选择桶
      var _this = this;
      _this.progress = 0;
      _this.proVisible = true;

      if (file) {
        var params = {
          Key:
            file.name.split(".")[0] +
            new Date().getTime() +
            "." +
            file.name.split(".")[file.name.split(".").length - 1],
          ContentType: file.type,
          Body: file,
          "Access-Control-Allow-Credentials": "*",
          ACL: "public-read",
        }; //key可以设置为桶的相抵路径，Body为文件， ACL最好要设置
        var options = {
          partSize: 2048 * 1024 * 1024,
          queueSize: 2,
          leavePartsOnError: true,
        };
        bucket
          .upload(params, options)
          .on("httpUploadProgress", function (evt) {
            //这里可以写进度条
            // console.log("Uploaded : " + parseInt((evt.loaded * 80) / evt.total) + '%');
            _this.progress = parseInt((evt.loaded * 80) / evt.total);
          })
          .send(function (err, data) {
            _this.progress = 100;

            setTimeout(() => {
              _this.proVisible = false;
            }, 1000);
            if (err) {
              var a = _this.$refs.upload1.uploadFiles;
              a.splice(a.length - 1, a.length);
              _this.$message.error("上传失败");
            } else {
              if (type == 2) {
                _this.studyJuri[0].upVedio.push({
                  name: file.name,
                  url: data.Location,
                  uid: file.uid,
                });
                _this.imgChange(null, null, type);
              } else if (type == 3) {
                _this.studyJuri[0].upFile.push({
                  name: file.name,
                  url: data.Location,
                  uid: file.uid,
                });
                _this.imgChange(null, null, type);
              }
              console.log(data.Location);
            }
          });
      }
    },
    allScrell() {
      window.parent.postMessage({ allScreen: this.screenType + "NT" }, "*");
    },
    nextToolindex(type) {
      this.$forceUpdate();
    },
    checkBz(index) {

      this.$forceUpdate();
    },
    nextOrpreSteps(t) {
      if (this.IsFollow && this.courseDetail.userid != this.userid) {
        this.$message.error('已经开启跟随模式，请认真跟堂听讲')
        return;
      }
      var b = this.chapInfoList.length - 1;
      if (t == 0) {
        if (this.courseType == 0) {
          if (this.taskCount == 0) {
            // console.log(this.navList[b].task[this.navList[b].task.length - 1].isLook);
            if (this.IsLookOpen) {
              if (
                !this.navList[b].task[this.navList[b].task.length - 1].isLook
              ) {
                if (
                  this.courseDetail.userid != this.userid &&
                  this.courseDetail.course_teacher.indexOf(this.userid) == -1
                ) {
                  this.$message.error("任务未解锁");
                } else {
                  this.$message.error("上一任务未解锁");
                }
                return;
              }
            }
            this.navList[this.courseType].isOpen = false;
            this.courseType = b;
            this.taskCount =
              this.chapInfoList[this.courseType].chapterInfo[0].taskJson
                .length - 1;
            this.navList[this.courseType].isOpen = true;
          } else {
            this.taskCount--;
          }
        } else {
          if (this.taskCount == 0) {
            this.navList[this.courseType].isOpen = false;
            this.courseType--;
            this.taskCount =
              this.chapInfoList[this.courseType].chapterInfo[0].taskJson
                .length - 1;
            this.navList[this.courseType].isOpen = true;
          } else {
            this.taskCount--;
          }
        }
      } else {
        if (this.courseType == b) {
          if (
            this.taskCount ==
            this.chapInfoList[this.courseType].chapterInfo[0].taskJson.length -
            1
          ) {
            this.navList[this.courseType].isOpen = false;
            this.courseType = 0;
            this.taskCount = 0;
            this.navList[this.courseType].isOpen = true;
          } else {
            var bbb = parseInt(this.taskCount) + 1;
            if (
              !this.chapInfoList[this.courseType].chapterInfo[0].taskJson[bbb]
                .isLook &&
              this.courseDetail.userid != this.userid &&
              this.courseDetail.course_teacher.indexOf(this.userid) == -1 &&
              this.IsLookOpen
            ) {
              this.$message.error("任务未解锁");
              return;
            }
            this.taskCount++;
            if (this.IsLookOpen) {
              this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
                this.taskCount
              ].isLook = true;
              this.addCourseState(3);
            }
          }
        } else {
          if (
            this.taskCount ==
            this.chapInfoList[this.courseType].chapterInfo[0].taskJson.length -
            1
          ) {
            var bbb = parseInt(this.courseType) + 1;
            if (
              !this.chapInfoList[bbb].chapterInfo[0].taskJson[0].isLook &&
              this.courseDetail.userid != this.userid &&
              this.courseDetail.course_teacher.indexOf(this.userid) == -1 &&
              this.IsLookOpen
            ) {
              this.$message.error("任务未解锁");
              return;
            }
            this.navList[this.courseType].isOpen = false;
            this.courseType++;
            this.taskCount = 0;
            this.navList[this.courseType].isOpen = true;
          } else {
            var bbb = parseInt(this.taskCount) + 1;
            if (
              !this.chapInfoList[this.courseType].chapterInfo[0].taskJson[bbb]
                .isLook &&
              this.courseDetail.userid != this.userid &&
              this.courseDetail.course_teacher.indexOf(this.userid) == -1 &&
              this.IsLookOpen
            ) {
              this.$message.error("任务未解锁");
              return;
            }
            this.taskCount++;
          }
          if (this.IsLookOpen) {
            this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
              this.taskCount
            ].isLook = true;
            this.addCourseState(3);
          }
        }
      }
      document.scrollingElement.scrollTop = 0;
      this.showType = 0;
      this.navId = this.navList[this.courseType].task[this.taskCount].id;

      this.toolIndex = null
      this.isNoHomeWork = false;
      (this.studyJuri = [
        {
          content: "",
          cover: [],
          upVedio: [],
          upFile: [],
        },
      ]),
        (this.radio = []);
      this.isClickNav = "";
      this.selectPz();
      this.getHomeWork();
      this.getCourseDetail();
      this.$forceUpdate();
    },
    openTask(s, n, i) {
      if (this.IsFollow && this.courseDetail.userid != this.userid) {
        this.$message.error('已经开启跟随模式，请认真跟堂听讲')
        return;
      }
      if (this.IsLookOpen) {
        if (
          !this.chapInfoList[s].chapterInfo[0].taskJson[n].isLook &&
          this.courseDetail.userid != this.userid &&
          this.courseDetail.course_teacher.indexOf(this.userid) == -1
        ) {
          this.$message.error("任务未解锁");
          return;
        }
        if (this.courseType == s && this.taskCount != n && n > this.taskCount) {
          if (
            !this.chapInfoList[this.courseType].chapterInfo[0].taskJson[n - 1]
              .isLook
          ) {
            this.$message.error("上一任务未解锁");
            return;
          }
        } else if (s > this.courseType) {
          if (n > 0) {
            if (!this.chapInfoList[s].chapterInfo[0].taskJson[n - 1].isLook) {
              this.$message.error("上一任务未解锁");
              return;
            }
          } else {
            if (
              !this.chapInfoList[s - 1].chapterInfo[0].taskJson[
                this.chapInfoList[s - 1].chapterInfo[0].taskJson.length - 1
              ].isLook
            ) {
              this.$message.error("上一任务未解锁");
              return;
            }
          }
        }
      }
      this.courseType = s;
      this.navId = i;
      this.taskCount = n;
      if (this.IsLookOpen) {
        this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
          this.taskCount
        ].isLook = true;
        this.addCourseState(3);
      }
      for (var ci = 0; ci < this.isCloseList.length; ci++) {
        this.isCloseList[ci].isClose = 0;
      }
      this.showType = 0;
      this.isNoHomeWork = false;
      (this.studyJuri = [
        {
          content: "",
          cover: [],
          upVedio: [],
          upFile: [],
        },
      ]),
        (this.radio = []);
      document.scrollingElement.scrollTop = 0;
      this.toolIndex = null
      // setTimeout(() => {
      //   let a = document.getElementById(i);
      //   if (a.offsetTop - 110 == 0) {
      //     window.scrollTo(0, 0);
      //   } else {
      //     window.scrollTo(0, a.offsetTop);
      //   }
      // }, 0);
      this.selectPz();
      this.getHomeWork();
      this.getCourseDetail();
    },

    get(i) {
      if (this.IsFollow && this.courseDetail.userid != this.userid) {
        this.$message.error('已经开启跟随模式，请认真跟堂听讲')
        return;
      }
      this.navList[i].isOpen = !this.navList[i].isOpen;
    },
    addQuestion() {
      this.answerList.push({
        answerTitle: this.answerQ.replaceAll(/%/g, "%25"),
        answer: this.questionAnswer.replaceAll(/%/g, "%25"),
      });
      let params = [
        {
          uid: this.userid,
          cid: this.id,
          stage: this.courseType,
          task: this.taskCount,
          tool: this.toolindex,
          content: JSON.stringify(this.answerList),
          type: 3,
        },
      ];
      this.ajax
        .post(this.$store.state.api + "addCourseWorks", params)
        .then((res) => {
          this.$message({
            message: "提交成功",
            type: "success",
          });
          this.answerList = [];
          this.questionAnswer = ""
          this.answerDialogVisible = false;
          this.selectStudent();
          this.selectSWorks();
          this.selectSLook();
        })
        .catch((err) => {
          this.$message.error("提交失败");
          console.error(err);
        });
    },
    addQuestionTeacher() {
      this.answerList.push({
        answerTitle: this.answerQ.replaceAll(/%/g, "%25"),
        answer: this.questionAnswer.replaceAll(/%/g, "%25"),
      });
      let params = [
        {
          uid: this.sStudent.userid,
          cid: this.id,
          stage: this.courseType,
          task: this.taskCount,
          tool: this.toolindex,
          content: JSON.stringify(this.answerList),
          type: 3,
          ateacher: this.userid,
        },
      ];
      this.ajax
        .post(this.$store.state.api + "addCourseWorksTeacher", params)
        .then((res) => {
          this.$message({
            message: "提交成功",
            type: "success",
          });
          this.answerList = [];
          this.questionAnswer = ""
          this.answerDialogVisibleTeacher = false;
          this.selectStudent();
          this.selectSWorks();
          this.selectSLook();
        })
        .catch((err) => {
          this.$message.error("提交失败");
          console.error(err);
        });
    },
    refreshCourse() {
      // window.location.reload();
      this.navList = [];
      this.getCourseDetail(1)
    },
    setPz() {
      if (this.ispzType == 4) {
        this.ispzType = 0
        this.pzDialog = false
        return;
      }
      this.ispzType = 4
      this.pzDialog = true
      this.selectPz();
    },
    getCourseDetail(type, gindex) {
      let loading;
      if (type != 2) {
        loading = this.$loading.service({
          background: "rgba(255, 255, 255, 0.7)",
          target: document.querySelector(".student_table"),
        });
      }

      let params = {
        courseId: this.id,
      };
      this.ajax
        .get(this.$store.state.api + "selectCourseDetail3", params)
        .then((res) => {
          if (type != 2) {
            loading.close();
            if (this.courseType > (JSON.parse(res.data[0][0].chapters).length - 1)) {
              this.courseType = (JSON.parse(res.data[0][0].chapters).length - 1)
            }
            var a = JSON.parse(res.data[0][0].chapters)[this.courseType]
              .chapterInfo[0].taskJson;
            var b = [
              "AVI",
              "NAVI",
              "MPEG",
              "ASF",
              "MOV",
              "WMV",
              "3GP",
              "RM",
              "RMVB",
              "FLV",
              "F4V",
              "H.264",
              "H.265",
              "REAL VIDEO",
              "MKV",
              "WebM",
              "HDDVD",
              "MP4",
              "MPG",
              "M4V",
              "MGV",
              "OGV",
              "QTM",
              "STR",
              "AMC",
              "DVX",
              "EVO",
              "DAT",
              "OGG",
              "OGM",
              "MP3",
            ];

            for (var i = 0; i < a.length; i++) {
              var c = a[i].chapterData;
              this.vedio[i] = [];
              this.textList[i] = [];
              this.lineList[i] = [];
              this.chapToolList[i] = [];
              this.file[i] = [];
              this.fileC[i] = [];
              for (var j = 0; j < c.length; j++) {
                if (c[j].type == 7) {
                  this.chapToolList[i].push(c[j]);
                } else if (c[j].type == 8) {
                  this.lineList[i].push(c[j]);
                } else if (c[j].type == 6) {
                  this.textList[i].push(c[j]);
                } else if (c[j].type == 12) {
                  this.fileC[i].push(c[j]);
                } else {
                  if (
                    b.indexOf(
                      c[j].url
                        .split(".")
                      [c[j].url.split(".").length - 1].toLocaleUpperCase()
                    ) != -1
                  ) {
                    this.vedio[i].push(c[j]);
                  } else {
                    this.file[i].push(c[j]);
                  }
                }
              }
              var d = JSON.parse(JSON.stringify(this.playerOptions));
              d.sources[0].src =
                this.vedio[i].length > 0 ? this.vedio[i][0].url : this.mr;
              this.playerO[i] = d;
            }
            this.courseDetail = res.data[0][0];
            this.tcid = this.arrayToArray(this.courseDetail.juri ? this.courseDetail.juri.split(",") : [], this.tcid2 ? this.tcid2.split(",") : []).join(",")
            console.log(this.tcid);
            this.evalua = res.data[0][0].evaId;
            this.chapInfo = JSON.parse(this.courseDetail.chapters)[
              this.courseType
            ];
            this.chapInfoList = JSON.parse(this.courseDetail.chapters);
            if (this.tcid && res.data[1].length) {
              let _inviteA = []
              for (var ik = 0; ik < res.data[1].length; ik++) {
                _inviteA.push({ cid: res.data[1][ik].classid, ic: res.data[1][ik].code });
              }
              for (var ik = 0; ik < _inviteA.length; ik++) {
                if (this.arrayToArray(_inviteA[ik].cid.split(","), this.tcid.split(",")).length) {
                  this.inviteCode = _inviteA[ik].ic
                  break;
                }
              }
            }
            for (var l = 0; l < this.chapInfoList.length; l++) {
              var w = this.chapInfoList[l].chapterInfo[0].taskJson;
              for (var m = 0; m < w.length; m++) {
                w[m].id = l + "-" + m;
              }
            }
            if (
              !this.vedio[this.taskCount][0] ||
              this.vedio[this.taskCount][0].url == ""
            ) {
              if (
                this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
                  this.taskCount
                ].chapterData.length > 0
              ) {
                // if (
                //   this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
                //     this.taskCount
                //   ].chapterData[0].type != 8
                // ) {
                let _url =
                  this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
                    this.taskCount
                  ].chapterData[0].url;
                if (
                  this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
                    this.taskCount
                  ].chapterData[0].type == 8
                ) {
                  this.showType = 2;
                  if (
                    _url.indexOf("https://") == -1 &&
                    _url.indexOf("http://") == -1
                  ) {
                    _url = "https://" + _url;
                  }
                  this.pptImgUrl1 = _url;
                  this.isClickNav = "line0";
                } else if (
                  this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
                    this.taskCount
                  ].chapterData[0].type == 3
                ) {
                  if (
                    _url
                      .split(".")
                    [_url.split(".").length - 1].toLocaleUpperCase() == "PDF"
                  ) {
                    this.showType = 3;
                    this.pptImgUrl1 = _url;
                    this.isClickNav = "word0";
                  } else if (
                    this.isAssetTypeAnImage(
                      _url
                        .split(".")
                      [_url.split(".").length - 1].toLocaleLowerCase()
                    )
                  ) {
                    this.showType = 4;
                    this.pptImgUrl1 = _url;
                    this.isClickNav = "word0";
                  } else {
                    this.showType = 2;
                    this.pptImgUrl1 =
                      "https://view.officeapps.live.com/op/view.aspx?src=" +
                      _url;
                    this.isClickNav = "word0";
                  }
                } else if (
                  this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
                    this.taskCount
                  ].chapterData[0].type == 6
                ) {
                  this.showType = 1;
                  this.text = this.textList[this.taskCount][0];
                  this.isClickNav = "text0";
                }
              }
            } else {
              this.isClickNav = "video0";
            }
            if (this.toolIndex == null && this.chapInfoList[this.courseType].chapterInfo[0].taskJson[this.taskCount].toolChoose.length) {
              this.toolIndex = 0
              // this.tool = this.chapInfoList[this.courseType].chapterInfo[0].taskJson[this.taskCount].toolChoose[this.toolIndex]
            }
            this.toolType = 0
          } else {
            var a = JSON.parse(res.data[0][0].chapters)[this.courseType]
              .chapterInfo[0].taskJson;
            var b = [
              "AVI",
              "NAVI",
              "MPEG",
              "ASF",
              "MOV",
              "WMV",
              "3GP",
              "RM",
              "RMVB",
              "FLV",
              "F4V",
              "H.264",
              "H.265",
              "REAL VIDEO",
              "MKV",
              "WebM",
              "HDDVD",
              "MP4",
              "MPG",
              "M4V",
              "MGV",
              "OGV",
              "QTM",
              "STR",
              "AMC",
              "DVX",
              "EVO",
              "DAT",
              "OGG",
              "OGM",
              "MP3",
            ];

            for (var i = 0; i < a.length; i++) {
              var c = a[i].chapterData;
              this.vedio[i] = [];
              this.textList[i] = [];
              this.lineList[i] = [];
              this.chapToolList[i] = [];
              this.file[i] = [];
              this.fileC[i] = [];
              for (var j = 0; j < c.length; j++) {
                if (c[j].type == 7) {
                  this.chapToolList[i].push(c[j]);
                } else if (c[j].type == 8) {
                  this.lineList[i].push(c[j]);
                } else if (c[j].type == 6) {
                  this.textList[i].push(c[j]);
                } else if (c[j].type == 12) {
                  this.fileC[i].push(c[j]);
                } else {
                  if (
                    b.indexOf(
                      c[j].url
                        .split(".")
                      [c[j].url.split(".").length - 1].toLocaleUpperCase()
                    ) != -1
                  ) {
                    this.vedio[i].push(c[j]);
                  } else {
                    this.file[i].push(c[j]);
                  }
                }
              }
              var d = JSON.parse(JSON.stringify(this.playerOptions));
              d.sources[0].src =
                this.vedio[i].length > 0 ? this.vedio[i][0].url : this.mr;
              this.playerO[i] = d;
            }
            if (
              !this.vedio[this.taskCount][0] ||
              this.vedio[this.taskCount][0].url == ""
            ) {
              if (
                this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
                  this.taskCount
                ].chapterData.length > 0
              ) {
                // if (
                //   this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
                //     this.taskCount
                //   ].chapterData[0].type != 8
                // ) {
                let _url =
                  this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
                    this.taskCount
                  ].chapterData[0].url;
                if (
                  this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
                    this.taskCount
                  ].chapterData[0].type == 8
                ) {
                  this.showType = 2;
                  if (
                    _url.indexOf("https://") == -1 &&
                    _url.indexOf("http://") == -1
                  ) {
                    _url = "https://" + _url;
                  }
                  this.pptImgUrl1 = _url;
                  this.isClickNav = "line0";
                } else if (
                  this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
                    this.taskCount
                  ].chapterData[0].type == 3
                ) {
                  if (
                    _url
                      .split(".")
                    [_url.split(".").length - 1].toLocaleUpperCase() == "PDF"
                  ) {
                    this.showType = 3;
                    this.pptImgUrl1 = _url;
                    this.isClickNav = "word0";
                  } else if (
                    this.isAssetTypeAnImage(
                      _url
                        .split(".")
                      [_url.split(".").length - 1].toLocaleLowerCase()
                    )
                  ) {
                    this.showType = 4;
                    this.pptImgUrl1 = _url;
                    this.isClickNav = "word0";
                  } else {
                    this.showType = 2;
                    this.pptImgUrl1 =
                      "https://view.officeapps.live.com/op/view.aspx?src=" +
                      _url;
                    this.isClickNav = "word0";
                  }
                } else if (
                  this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
                    this.taskCount
                  ].chapterData[0].type == 6
                ) {
                  this.showType = 1;
                  this.text = this.textList[this.taskCount][0];
                  this.isClickNav = "text0";
                }
              }
            } else {
              this.isClickNav = "video0";
            }
            this.toolType = 0
            this.$forceUpdate();
          }

          this.$nextTick(() => {
            setTimeout(() => {
              this.checkEva();
            }, 1000);
          });
          let _this = this;
          if (_this.timer) {
            clearInterval(_this.timer);
            _this.timer = null;
          }


          _this.selectSWorks(gindex);
          _this.selectStudent();
          _this.selectSLook();
          if (_this.courseDetail.userid == _this.userid && _this.IsFollow) {
            _this.setCTask();
          }
          if (_this.dialogVisibleGroup) {
            _this.groupJson =
              _this.chapInfoList[_this.courseType].chapterInfo[0].taskJson[
                _this.taskCount
              ].toolChoose[_this.toolindex].groupJson;
          }

          _this.timer = setInterval(function () {
            _this.selectSWorks(gindex);
            if (_this.tType == 4 || _this.ispzType == 4) {
              _this.selectPz();
            }
          }, 5000);
        })
        .catch((err) => {
          loading.close();
          console.error(err);
        });
    },
    getCourseGroup(gindex) {
      let params = {
        cid: this.id,
        classid: this.tcid ? this.tcid : '1',
      };
      this.ajax
        .get(this.$store.state.api + "getCourseGroup", params)
        .then((res) => {
          if (res.data && res.data[0].length) {
            if (!this.isGroup) {
              let courseGroup = JSON.parse(res.data[0][0].group)
              courseGroup.group = courseGroup.group.filter(el => {
                el.works = []
                return el
              });
              this.courseGroup = courseGroup
              let groupPerson = res.data[1]
              let group = JSON.parse(res.data[0][0].group).group
              let courseGroupStudent = {}
              let courseGroupStudentUid = {}
              for (var i = 0; i < group.length; i++) {
                courseGroupStudent[group[i].id] = []
                courseGroupStudentUid[group[i].id] = []
                for (var j = 0; j < groupPerson.length; j++) {
                  if (groupPerson[j].groupCid == group[i].id) {
                    courseGroupStudent[group[i].id].push(groupPerson[j])
                    courseGroupStudentUid[group[i].id].push(groupPerson[j].userid)
                  }
                }
              }
              this.courseGroupStudent = courseGroupStudent
              this.courseGroupStudentUid = courseGroupStudentUid
            }
            this.isGroup = true
            this.selectSWorks(gindex);
          } else {
            this.selectSWorks(gindex);
            this.isGroup = false
          }
        })
        .catch((err) => {
          // this.$message.error("网络不佳");
          console.error(err);
        });
    },
    setOperationTime() {
      let _this = this
      if (_this.opertimer) {
        clearInterval(_this.opertimer);
        _this.opertimer = null;
      }
      _this.opertimer = setInterval(() => {
        _this.setoTime('600')
      }, 600000);
    },
    setoTime(time) {
      let params = [
        {
          uid: this.userid,
          cid: this.id,
          type: '2',
          time: time,
        },
      ];
      this.ajax
        .post(this.$store.state.api + "addOperationTimeT2", params)
        .then((res) => {
        })
        .catch((err) => {
          console.error(err);
        });
    },
    addPz(type, content) {
      if (type == "1" && this.pzConText == "") {
        this.$message.error("批注不能为空！");
        return;
      }
      let params = [
        {
          cid: this.id,
          uid: this.userid,
          s: this.courseType,
          t: this.taskCount,
          c: type == "1" ? this.pzConText.replaceAll(/%/g, "%25") : content,
          type: type,
        },
      ];
      this.ajax
        .post(this.$store.state.api + "addPz2", params)
        .then((res) => {
          this.$message({
            message: "添加成功",
            type: "success",
          });
          this.pzConText = "";
          this.addPzDialog = false;
          this.selectPz();
        })
        .catch((err) => {
          this.$message.error("添加失败");
          console.error(err);
        });
    },
    deletePz(id) {
      this.$confirm("确定删除此批注吗？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          let params = [
            {
              id: id,
            },
          ];
          this.ajax
            .post(this.$store.state.api + "deletePz", params)
            .then((res) => {
              this.$message({
                message: "删除成功",
                type: "success",
              });
              this.selectPz();
            })
            .catch((err) => {
              this.$message.error("网络异常");
              console.error(err);
            });
        })
        .catch(() => { });
    },
    selectPz() {
      let params = {
        cid: this.id,
        s: this.courseType,
        t: this.taskCount,
      };
      this.ajax
        .get(this.$store.state.api + "selectPzList", params)
        .then((res) => {
          this.pzList = res.data[0];
        })
        .catch((err) => {
          console.error(err);
        });
    },
    updateSLook() {
      let params = {
        sopen: this.sIsOpen == false ? 1 : 2,
        cid: this.id,
      };
      this.ajax
        .get(this.$store.state.api + "updateCourseSLook", params)
        .then((res) => {
          if (this.sIsOpen == true) {
            this.$message({
              message: "权限设置成功",
              type: "success",
            });
          } else {
            this.$message({
              message: "权限关闭成功",
              type: "success",
            });
          }
        })
        .catch((err) => {
          console.error(err);
        });
    },
    updateFollow() {
      let params = [
        {
          sopen: this.IsFollow == false ? 1 : 2,
          cid: this.id,
        },
      ];
      this.ajax
        .post(this.$store.state.api + "updateCourseFollow", params)
        .then((res) => {
          if (this.IsFollow == true) {
            this.$message({
              message: "开启成功",
              type: "success",
            });
          } else {
            this.$message({
              message: "关闭成功",
              type: "success",
            });
          }
          this.setCTask();
        })
        .catch((err) => {
          console.error(err);
        });
    },
    setCTask() {
      let params = [
        {
          sopen: this.courseType + '-' + this.taskCount,
          cid: this.id,
        },
      ];
      this.ajax
        .post(this.$store.state.api + "updateCourseFollowC", params)
        .then((res) => {
        })
        .catch((err) => {
          console.error(err);
        });
    },
    updateLookOpen() {
      let params = [
        {
          sopen: this.IsLookOpen == false ? 1 : 2,
          cid: this.id,
        },
      ];
      this.ajax
        .post(this.$store.state.api + "updateCourseLookOpen", params)
        .then((res) => {
          if (this.IsLookOpen == true) {
            // if (this.courseType != 0 && this.taskCount != 0) {
            //   this.openTask(0, 0, "0-0");
            // }
            this.$message({
              message: "权限设置成功",
              type: "success",
            });
          } else {
            this.$message({
              message: "权限关闭成功",
              type: "success",
            });
          }
          this.getCourseState(2);
        })
        .catch((err) => {
          console.error(err);
        });
    },
    selectSLook() {
      let params = {
        cid: this.id,
      };
      this.ajax
        .get(this.$store.state.api + "selectCourseSLook", params)
        .then((res) => {
          this.sIsOpen = res.data[0][0].sopen == 1 ? false : true;
          this.IsLookOpen = res.data[0][0].look == 1 ? false : true;
          this.IsFollow = res.data[0][0].follow == 1 ? false : true;
          if (!this.IsLookOpen) {
            this.setNavList();
          } else {
            this.getCourseState(1);
          }

          if (this.IsFollow && this.courseDetail.userid != this.userid) {
            let _followC = res.data[0][0].followC.split('-')
            if (this.courseType != _followC[0] || this.taskCount != _followC[1]) {
              this.navList[this.courseType].isOpen = false;
              this.courseType = _followC[0]
              this.navList[this.courseType].isOpen = true;
              this.taskCount = parseInt(_followC[1])
              this.navId = res.data[0][0].followC;
              this.getCourseDetail()
            }
          }
        })
        .catch((err) => {
          console.error(err);
        });
    },
    setNavList() {
      if (this.navList.length == 0) {
        this.navList = [];
        for (var l = 0; l < this.chapInfoList.length; l++) {
          var q = this.chapInfoList[l].dyName;
          var w = this.chapInfoList[l].chapterInfo[0].taskJson;
          var e;
          this.navList.push({
            dyName: q,
            isOpen: l === 0 ? true : false,
            task: [],
          });
          for (var r = 0; r < w.length; r++) {
            e = w[r].task;
            if (this.chapInfoList[l].easy == 1) {
              this.navList[l].task.push({
                taskName: q,
                id: l + "-" + r,
                isLook: w[r].isLook,
              });
            } else {
              this.navList[l].task.push({
                taskName: e,
                id: l + "-" + r,
                isLook: w[r].isLook,
              });
            }

            // this.navId = this.navId ? this.navId : l + "-" + r;
            // this.navId = l + "-" + r;
          }
        }
        this.navList[0].isOpen = false;
        this.navList[this.courseType].isOpen = true;
        this.navId = this.navList[this.courseType].task[this.taskCount].id;
      } else {
        this.setNavList2();
      }
    },
    setNavList2() {
      for (var l = 0; l < this.chapInfoList.length; l++) {
        var w = this.chapInfoList[l].chapterInfo[0].taskJson;
        for (var r = 0; r < w.length; r++) {
          this.navList[l].task[r].isLook = w[r].isLook;
        }
      }
      if (
        this.IsLookOpen &&
        !this.navList[this.courseType].task[this.taskCount].isLook
      ) {
        this.openTask(0, 0, "0-0");
      }
      this.$forceUpdate();
    },
    getCourseState(type) {
      let params = {
        cid: this.id,
      };
      this.ajax
        .get(this.$store.state.api + "getCourseState", params)
        .then((res) => {
          if (res.data[0].length > 0 && this.IsLookOpen && type == 1) {
            this.chapInfoList = JSON.parse(res.data[0][0].state);
            this.setNavList();
            this.$forceUpdate();
          } else if (res.data[0].length > 0 && this.IsLookOpen && type == 2) {
            this.addCourseState(2);
          } else {
            this.addCourseState(1);
          }
        })
        .catch((err) => {
          console.error(err);
        });
    },
    addCourseState(type) {
      let _state = this.chapInfoList;
      // this.courseType   this.taskCount
      if (type == 1 || type == 2) {
        for (var i = 0; i < _state.length; i++) {
          let el = _state[i].chapterInfo[0].taskJson;
          for (var j = 0; j < el.length; j++) {
            // if (i == 0 && j == 0) {
            //   el[j].isLook = true;
            // } else {
            //   el[j].isLook = false;
            // }

            if (
              this.courseType > i ||
              (this.courseType == i && this.taskCount + 1 > j)
            ) {
              el[j].isLook = true;
            } else {
              el[j].isLook = false;
            }
          }
        }
      }
      let params = [
        {
          cid: this.id,
          state: JSON.stringify(_state).replaceAll(/%/g, "%25"),
        },
      ];
      this.ajax
        .post(
          this.$store.state.api +
          (type == 1 ? "addCourseState" : "updateCourseSate"),
          params
        )
        .then((res) => {
          if (this.IsLookOpen) {
            this.setNavList();
          }
          if (type == 3 && type == 2) {
            this.getCourseState(1);
          }
        })
        .catch((err) => {
          console.error(err);
        });
    },
    getHomeWork() {
      let params = {
        cid: this.id,
        stage: this.courseType,
        task: this.taskCount,
        uid: this.userid,
      };
      this.ajax
        .get(this.$store.state.api + "selectWork", params)
        .then((res) => {
          if (res.data[0].length > 0) {
            this.studyJuri = JSON.parse(res.data[0][0].content);
            this.isNoHomeWork = true;
          }
        })
        .catch((err) => {
          console.error(err);
        });
    },
    isAssetTypeAnImage(ext) {
      return (
        [
          "png",
          "jpg",
          "jpeg",
          "bmp",
          "gif",
          "webp",
          "psd",
          "svg",
          "tiff",
        ].indexOf(ext) !== -1
      );
    },
    switchVideo(media) {
      this.playerO = {};
      this.playerOptions.poster = "";
      this.playerOptions.sources[0].src = media;
      this.playerO = this.playerOptions;
    },
    onPlayerPlay() { },
    lookVedio(u, i) {
      this.isClickNav = "";
      // this.playerOptions.sources[0].src = u;
      var d = JSON.parse(JSON.stringify(this.playerOptions));
      d.sources[0].src = u;
      this.playerO[this.taskCount] = d;
      this.showType = 0;
      this.isClickNav = "video" + i;
      this.$forceUpdate();
    },
    lookText(i, t) {
      this.isClickNav = "";
      this.text = this.textList[i][t];
      // this.dialogVisible1 = true;
      this.showType = 1;
      this.isClickNav = "text" + t;
    },
    lookTools(i, t) {
      this.chapTools = this.chapToolList[i][t];
      this.dialogVisible2 = true;
    },
    openFile(f) {
      this.pptImgUrl = "";
      var a = ["PPT", "PPTX", "XLSX", "XLS", "DOC", "DOCX"];
      if (
        a.indexOf(f.split(".")[f.split(".").length - 1].toLocaleUpperCase()) !=
        -1
      ) {
        this.pptImgUrl =
          "https://view.officeapps.live.com/op/view.aspx?src=" + f;
        this.showPDF = false;
        this.dialogVisible3 = true;
      } else if (
        f.split(".")[f.split(".").length - 1].toLocaleUpperCase() == "PDF"
      ) {
        this.pptImgUrl = f;
        this.showPDF = true;
        this.dialogVisible3 = true;
      }
    },
    openTable(f) {
      this.tableJson = JSON.parse(f.works);
      this.$forceUpdate();
      this.dialogVisibleTable2 = true;
    },
    openWord(f) {
      this.tableJson = JSON.parse(f.works);
      this.$forceUpdate();
      this.dialogVisibleTable3 = true;
    },
    doUrl(url, i) {
      this.isClickNav = "";
      this.pptImgUrl1 = "";
      this.showType = 2;
      if (url.indexOf("https://") == -1 && url.indexOf("http://") == -1) {
        url = "https://" + url;
      }
      this.pptImgUrl1 = url;
      this.isClickNav = "line" + i;
    },
    downFile(f, i) {
      this.isClickNav = "";
      this.pptImgUrl1 = "";
      var a = ["PPT", "PPTX", "XLSX", "XLS", "DOC", "DOCX"]; //"PDF",
      if (
        a.indexOf(
          f.url.split(".")[f.url.split(".").length - 1].toLocaleUpperCase()
        ) != -1
      ) {
        this.pptImgUrl1 =
          "https://view.officeapps.live.com/op/view.aspx?src=" + f.url;
        // this.dialogVisible3 = true;
        this.showType = 2;
      } else if (
        this.isAssetTypeAnImage(
          f.url.split(".")[f.url.split(".").length - 1].toLocaleLowerCase()
        )
      ) {
        this.showType = 4;
        this.pptImgUrl1 = f.url;
      } else if (
        f.url.split(".")[f.url.split(".").length - 1].toLocaleUpperCase() ==
        "PDF"
      ) {
        this.pptImgUrl1 = f.url;
        // this.dialogVisible3 = true;
        this.showType = 3;
      } else {
        window.open(this.file[i].url);
      }
      this.isClickNav = "word" + i;
    },
    downFileList(i) {
      window.open(this.noImgList[i].url);
    },
    openAddWork() {
      this.dialogVisible = true;
    },
    addBzWorks() {
      let params = [
        {
          uid: this.userid,
          cid: this.id,
          stage: this.courseType,
          task: this.taskCount,
          tool: this.toolindex,
          content: JSON.stringify(this.eScore),
          type: 6,
        },
      ];
      this.ajax
        .post(this.$store.state.api + "addCourseWorks", params)
        .then((res) => {
          this.$message({
            message: "提交成功",
            type: "success",
          });
          this.eScore = { eBzText: "", eStar: [] };
          this.studentEvalDialogVisible = false;
          this.selectSWorks();
        })
        .catch((err) => {
          this.$message.error("提交失败");
          console.error(err);
        });
    },
    addBzWorksTeacher() {
      let params = [
        {
          uid: this.sStudent.userid,
          cid: this.id,
          stage: this.courseType,
          task: this.taskCount,
          tool: this.toolindex,
          content: JSON.stringify(this.eScore),
          type: 6,
        },
      ];
      this.ajax
        .post(this.$store.state.api + "addCourseWorks", params)
        .then((res) => {
          this.$message({
            message: "提交成功",
            type: "success",
          });
          this.eScore = { eBzText: "", eStar: [] };
          this.studentEvalDialogVisibleTeacher = false;
          this.selectSWorks();
        })
        .catch((err) => {
          this.$message.error("提交失败");
          console.error(err);
        });
    },
    addStudentAsk() {
      if (!this.radio.length) {
        this.$message.error("请选择选项");
        return;
      }
      for (var i = 0; i < this.askJson.askCount; i++) {
        if (
          (this.radio[i] instanceof Array && !this.radio[i].length) ||
          (this.radio[i] !== 0 && !this.radio[i])
        ) {
          this.$message.error("请选择选项");
          return;
        }
      }
      this.askList.push({ askJson: this.askJson, anwer: this.radio });
      let params = [
        {
          uid: this.userid,
          cid: this.id,
          stage: this.courseType,
          task: this.taskCount,
          tool: this.toolindex,
          content: JSON.stringify(this.askList).replaceAll(/%/g, "%25"),
          type: 2,
        },
      ];
      this.ajax
        .post(this.$store.state.api + "addCourseWorks", params)
        .then((res) => {
          this.$message({
            message: "提交成功",
            type: "success",
          });
          this.askList = [];
          this.dialogVisible5 = false;
          this.selectStudent();
          this.selectSWorks();
          this.selectSLook();
        })
        .catch((err) => {
          this.$message.error("提交失败");
          console.error(err);
        });
    },
    addStudentAskTeacher() {
      if (!this.radio.length) {
        this.$message.error("请选择选项");
        return;
      }
      for (var i = 0; i < this.askJson.askCount; i++) {
        if (
          (this.radio[i] instanceof Array && !this.radio[i].length) ||
          (this.radio[i] !== 0 && !this.radio[i])
        ) {
          this.$message.error("请选择选项");
          return;
        }
      }
      this.askList.push({ askJson: this.askJson, anwer: this.radio });
      let params = [
        {
          uid: this.sStudent.userid,
          cid: this.id,
          stage: this.courseType,
          task: this.taskCount,
          tool: this.toolindex,
          content: JSON.stringify(this.askList).replaceAll(/%/g, "%25"),
          type: 2,
        },
      ];
      this.ajax
        .post(this.$store.state.api + "addCourseWorks", params)
        .then((res) => {
          this.$message({
            message: "提交成功",
            type: "success",
          });
          this.askList = [];
          this.dialogVisible5Teacher = false;
          this.selectStudent();
          this.selectSWorks();
          this.selectSLook();
        })
        .catch((err) => {
          this.$message.error("提交失败");
          console.error(err);
        });
    },
    addStudentTest() {
      if (!this.radio.length) {
        this.$message.error("请选择选项");
        return;
      }
      for (var i = 0; i < this.testJson.testCount; i++) {
        if (
          (this.radio[i] instanceof Array && !this.radio[i].length) ||
          (this.radio[i] !== 0 && !this.radio[i])
        ) {
          this.$message.error("请选择选项");
          return;
        }
      }
      this.askList.push({ testJson: this.testJson, anwer: this.radio });
      let params = [
        {
          uid: this.userid,
          cid: this.id,
          stage: this.courseType,
          task: this.taskCount,
          tool: this.toolindex,
          content: JSON.stringify(this.askList).replaceAll(/%/g, "%25"),
          type: 8,
        },
      ];
      this.ajax
        .post(this.$store.state.api + "addCourseWorks", params)
        .then((res) => {
          this.$message({
            message: "提交成功",
            type: "success",
          });
          this.askList = [];
          this.dialogVisibleChoice = false;
          this.selectStudent();
          this.selectSWorks();
          this.selectSLook();
        })
        .catch((err) => {
          this.$message.error("提交失败");
          console.error(err);
        });
    },
    addStudentTestTeacher() {
      if (!this.radio.length) {
        this.$message.error("请选择选项");
        return;
      }
      for (var i = 0; i < this.testJson.testCount; i++) {
        if (
          (this.radio[i] instanceof Array && !this.radio[i].length) ||
          (this.radio[i] !== 0 && !this.radio[i])
        ) {
          this.$message.error("请选择选项");
          return;
        }
      }
      this.askList.push({ testJson: this.testJson, anwer: this.radio });
      let params = [
        {
          uid: this.sStudent.userid,
          cid: this.id,
          stage: this.courseType,
          task: this.taskCount,
          tool: this.toolindex,
          content: JSON.stringify(this.askList).replaceAll(/%/g, "%25"),
          type: 8,
        },
      ];
      this.ajax
        .post(this.$store.state.api + "addCourseWorks", params)
        .then((res) => {
          this.$message({
            message: "提交成功",
            type: "success",
          });
          this.askList = [];
          this.dialogVisibleChoiceTeacher = false;
          this.selectStudent();
          this.selectSWorks();
          this.selectSLook();
        })
        .catch((err) => {
          this.$message.error("提交失败");
          console.error(err);
        });
    },
    addWork() {
      if (this.studyJuri[0].content == "") {
        this.$message.error("请将信息填写完整");
        return;
      } else if (this.studyJuri[0].cover.length == 0) {
        this.$message.error("请将信息填写完整");
        return;
      } else if (this.studyJuri[0].upVedio.length == 0) {
        this.$message.error("请将信息填写完整");
        return;
      }
      if (this.isNoHomeWork) {
        this.$confirm(
          "您已经提交了该作业了，如果您再提交将覆盖上次提交的作业！",
          "提示",
          {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning",
          }
        )
          .then(() => {
            let params = [
              {
                uid: this.userid,
                cid: this.id,
                stage: this.courseType,
                task: this.taskCount,
                content: JSON.stringify(this.studyJuri),
              },
            ];
            this.ajax
              .post(this.$store.state.api + "addWorks", params)
              .then((res) => {
                this.$message({
                  message: "提交成功",
                  type: "success",
                });
                this.isNoHomeWork = true;
                this.dialogVisible = false;
              })
              .catch((err) => {
                this.$message.error("提交失败");
                console.error(err);
              });
          })
          .catch(() => { });
      } else {
        let params = [
          {
            uid: this.userid,
            cid: this.id,
            stage: this.courseType,
            task: this.taskCount,
            content: JSON.stringify(this.studyJuri),
          },
        ];
        this.ajax
          .post(this.$store.state.api + "addWorks", params)
          .then((res) => {
            this.$message({
              message: "提交成功",
              type: "success",
            });
            this.isNoHomeWork = true;
            this.dialogVisible = false;
          })
          .catch((err) => {
            this.$message.error("提交失败");
            console.error(err);
          });
      }
    },
    selectCount() {
      let params = {
        cid: this.id,
        chid: this.courseType,
        uid: this.userid,
      };
      this.ajax
        .get(this.$store.state.api + "selectToolsCount", params)
        .then((res) => {
          for (var i = 0; i < res.data[0].length; i++) {
            if (res.data[0][i].tools == 1) {
              this.wbCount = res.data[0][i].count;
            } else if (res.data[0][i].tools == 2) {
              this.wordCount = res.data[0][i].count;
            } else if (res.data[0][i].tools == 3) {
              this.mindCount = res.data[0][i].count;
            } else if (res.data[0][i].tools == 4) {
              this.askCount = res.data[0][i].count;
            } else if (res.data[0][i].tools == 6) {
              this.noteCount = res.data[0][i].count;
            } else if (res.data[0][i].tools == 7) {
              this.mindNetWorkCount = res.data[0][i].count;
            } else if (res.data[0][i].tools == 8) {
              this.libraryCount = res.data[0][i].count;
            } else if (res.data[0][i].tools == 16) {
              this.workCount = res.data[0][i].count;
            } else if (res.data[0][i].tools == 10) {
              this.timeCount = res.data[0][i].count;
            } else if (res.data[0][i].tools == 15) {
              this.answerCount = res.data[0][i].count;
            } else if (res.data[0][i].tools == 18) {
              this.trainCount = res.data[0][i].count;
            }
          }
        })
        .catch((err) => {
          console.error(err);
        });
    },
    openTools(t, i, index, c, sName) {
      var z = JSON.parse(c);
      this.noteName = sName;
      if (t == 4) {
        this.radio = [];
        this.isAnswer = false;
        let b = z[0].anwer;
        this.radio = b;
        this.askJson = z[0].askJson;
        this.isAnswer = true;
        this.dialogVisible5 = true;
      } else if (t == 45) {
        this.radio = [];
        this.isAnswer = false;
        let b = z[0].anwer;
        this.radio = b;
        this.testJson = z[0].testJson;
        this.isAnswer = true;
        this.dialogVisibleChoice = true;
      }
      //  else if (t == 15) {
      //   this.answerQ = "";
      //   this.questionAnswer = "";
      //   this.answerQ = z[0].answerTitle;
      //   this.questionAnswer = z[0].answer;
      //   this.answerDialogVisible = true;
      // }
    },

    fastText(p, t) {
      if (t == 1) {
        this.commentText += p;
      } else {
        this.eScore.eBzText += p;
      }
    },
    addTools(t, i, index) {
      var a = 0;
      // this.taskCount = index;
      this.toolindex = i;
      if (t == 1) {
        if (this.wbCount > 0) {
          this.updateCount(this.wbCount, t);
        } else {
          this.wbCount++;
          a = this.wbCount;
          this.toolsCount(a, t);
        }
        window.parent.postMessage(
          {
            tools: "1E",
            cid: this.id,
            stage: this.courseType,
            task: this.taskCount,
            tool: i,
          },
          "*"
        );
      } else if (t == 2) {
        if (this.wordCount > 0) {
          this.updateCount(this.wordCount, t);
        } else {
          this.wordCount++;
          a = this.wordCount;
          this.toolsCount(a, t);
        }
        window.parent.postMessage({ tools: "2" }, "*");
      } else if (t == 3) {
        if (this.mindCount > 0) {
          this.updateCount(this.mindCount, t);
        } else {
          this.mindCount++;
          a = this.mindCount;
          this.toolsCount(a, t);
        }
        window.parent.postMessage(
          {
            tools: "3E",
            cid: this.id,
            stage: this.courseType,
            task: this.taskCount,
            tool: i,
          },
          "*"
        );
      } else if (t == 4) {
        this.radio = [];
        this.noteName = "";
        this.isAnswer = false;
        if (this.askCount > 0) {
          this.updateCount(this.askCount, t);
        } else {
          this.askCount++;
          a = this.askCount;
          this.toolsCount(a, t);
        }
        this.askJson.askJson =
          this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
            index
          ].toolChoose[i].askJson;
        this.askJson.askTitle =
          this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
            index
          ].toolChoose[i].askTitle;
        this.askJson.askCount =
          this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
            index
          ].toolChoose[i].askCount;

        for (var k = 0; k < this.askJson.askJson.length; k++) {
          if (this.askJson.askJson[k].type == "2") {
            this.radio.push([]);
          } else {
            this.radio.push("");
          }
        }

        this.dialogVisible5 = true;

        // window.parent.postMessage({ tools: "4" }, "*");
      } else if (t == 45) {
        this.noteName = "";
        this.radio = [];
        this.isAnswer = false;
        if (this.askCount > 0) {
          this.updateCount(this.askCount, t);
        } else {
          this.askCount++;
          a = this.askCount;
          this.toolsCount(a, t);
        }
        this.testJson =
          this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
            index
          ].toolChoose[i].testJson;
        for (var k = 0; k < this.testJson.testJson.length; k++) {
          if (this.testJson.testJson[k].type == "2") {
            this.radio.push([]);
          } else {
            this.radio.push("");
          }
        }

        this.dialogVisibleChoice = true;

        // window.parent.postMessage({ tools: "4" }, "*");
      } else if (t == 5) {
        if (this.scoreCount > 0) {
          this.updateCount(this.scoreCount, t);
        } else {
          this.scoreCount++;
          a = this.scoreCount;
          this.toolsCount(a, t);
        }
        this.dialogVisible4 = true;
        // window.parent.postMessage({ tools: "5" }, "*");
      } else if (t == 6) {
        if (this.noteCount > 0) {
          this.updateCount(this.noteCount, t);
        } else {
          this.noteCount++;
          a = this.noteCount;
          this.toolsCount(a, t);
        }
        window.parent.postMessage(
          {
            tools: "6",
            cid: this.id,
            stage: this.courseType,
            task: this.taskCount,
            tool: i,
          },
          "*"
        );
      } else if (t == 7) {
        if (this.mindNetWorkCount > 0) {
          this.updateCount(this.mindNetWorkCount, t);
        } else {
          this.mindNetWorkCount++;
          a = this.mindNetWorkCount;
          this.toolsCount(a, t);
        }
        window.parent.postMessage(
          {
            tools: "7",
            cid: this.id,
            stage: this.courseType,
            task: this.taskCount,
            tool: i,
          },
          "*"
        );
      } else if (t == 16) {
        if (this.workCount > 0) {
          this.updateCount(this.workCount, t);
        } else {
          this.workCount++;
          a = this.workCount;
          this.toolsCount(a, t);
        }
        this.dialogVisible = true;
      } else if (t == 50) {
        if (this.tType == 2) {
          this.$message.error("不支持学生使用");
          return;
        }
        this.plworkFile = [];
        this.uploadCid = this.tcid ? this.tcid : this.courseDetail.juri
        this.selectUploadStudent();
        this.dialogVisiblePl = true;
      } else if (t == 8) {
        if (this.libraryCount > 0) {
          this.updateCount(this.libraryCount, t);
        } else {
          this.libraryCount++;
          a = this.libraryCount;
          this.toolsCount(a, t);
        }
        window.parent.postMessage({ tools: "8" }, "*");
      } else if (t == 17) {
        if (this.libraryCount > 0) {
          this.updateCount(this.libraryCount, t);
        } else {
          this.libraryCount++;
          a = this.libraryCount;
          this.toolsCount(a, t);
        }
        window.parent.postMessage({ tools: "17" }, "*");
      } else if (t == 18) {
        if (this.trainCount > 0) {
          this.updateCount(this.trainCount, t);
        } else {
          this.trainCount++;
          a = this.trainCount;
          this.toolsCount(a, t);
        }
        window.parent.postMessage({ tools: "18" }, "*");
      } else if (t == 10) {
        if (this.timeCount > 0) {
          this.updateCount(this.timeCount, t);
        } else {
          this.timeCount++;
          a = this.timeCount;
          this.toolsCount(a, t);
        }
        this.preTime = this.chapInfoList[this.courseType].chapterInfo[0]
          .taskJson[index].toolChoose[i].preTime
          ? this.chapInfoList[this.courseType].chapterInfo[0].taskJson[index]
            .toolChoose[i].preTime
          : "";
        this.timeDialogVisible = true;
      } else if (t == 15) {
        this.answerQ = "";
        this.questionAnswer = "";
        if (this.answerCount > 0) {
          this.updateCount(this.answerCount, t);
        } else {
          this.answerCount++;
          a = this.answerCount;
          this.toolsCount(a, t);
        }
        this.answerQ = this.chapInfoList[this.courseType].chapterInfo[0]
          .taskJson[index].toolChoose[i].answerQ
          ? this.chapInfoList[this.courseType].chapterInfo[0].taskJson[index]
            .toolChoose[i].answerQ
          : "";
        this.answerDialogVisible = true;
      } else if (t == 21) {
        window.parent.postMessage({ tools: "21" }, "*");
      } else if (t == 22) {
        window.parent.postMessage({ tools: "22" }, "*");
      } else if (t == 23) {
        window.parent.postMessage({ tools: "23" }, "*");
      } else if (t == 24) {
        window.parent.postMessage({ tools: "24" }, "*");
      } else if (t == 25) {
        window.parent.postMessage({ tools: "25" }, "*");
      } else if (t == 31) {
        window.parent.postMessage({ tools: "31" }, "*");
      } else if (t == 28) {
        window.parent.postMessage({ tools: "28" }, "*");
      } else if (t == 37) {
        window.parent.postMessage({ tools: "37" }, "*");
      } else if (t == 38) {
        window.parent.postMessage({ tools: "38" }, "*");
      } else if (t == 39) {
        window.parent.postMessage({ tools: "39" }, "*");
      } else if (t == 32) {
        window.parent.postMessage({ tools: "32" }, "*");
      } else if (t == 57) {
        window.parent.postMessage({ tools: "57" }, "*");
      } else if (t == 58) {
        window.parent.postMessage({ tools: "58" }, "*");
      } else if (t == 59) {
        window.parent.postMessage({ tools: "59" }, "*");
      } else if (t == 60) {
        window.parent.postMessage({ tools: "60" }, "*");
      } else if (t == 61) {
        window.parent.postMessage({ tools: "61" }, "*");
      } else if (t == 63) {
        window.parent.postMessage({ tools: "63" }, "*");
      } else if (t == 26) {
        window.parent.postMessage(
          {
            tools: "26",
            cid: this.id,
            stage: this.courseType,
            task: this.taskCount,
            tool: i,
          },
          "*"
        );
      } else if (t == 40) {
        if (this.evalCount > 0) {
          this.updateCount(this.evalCount, t);
        } else {
          this.evalCount++;
          a = this.evalCount;
          this.toolsCount(a, t);
        }
        this.eScore = { eBzText: "", eStar: [] };
        if (this.worksStudent.length) {
          for (var k = 0; k < this.worksStudent.length; k++) {
            if (this.userid == this.worksStudent[k].userid) {
              this.eScore = JSON.parse(this.worksStudent[k].works);
              this.rateJson =
                this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
                  index
                ].toolChoose[i].rateJson;
              break;
            } else {
              this.rateJson =
                this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
                  index
                ].toolChoose[i].rateJson;
            }
          }
        } else {
          this.rateJson =
            this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
              index
            ].toolChoose[i].rateJson;
        }

        this.isStar = false;
        this.studentEvalDialogVisible = true;
      } else if (t == 41) {
        this.selectJson = this.chapInfoList[this.courseType].chapterInfo[0]
          .taskJson[index].toolChoose[i].selectJson
          ? JSON.parse(
            JSON.stringify(
              this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
                index
              ].toolChoose[i].selectJson
            )
          )
          : { url: "", select: [], answer: [] };
        if (this.worksStudent.length) {
          for (var k = 0; k < this.worksStudent.length; k++) {
            if (this.userid == this.worksStudent[k].userid) {
              var a = this.worksStudent[k].works.split(",");
              for (var ki = 0; ki < a.length; ki++) {
                a[ki] = parseInt(a[ki]);
              }
              this.selectAnswer = {
                answer: a,
                stu: this.worksStudent[k].sName,
              };
              break;
            } else {
              this.selectAnswer = { answer: [], stu: "" };
            }
          }
        } else {
          this.selectAnswer = { answer: [], stu: "" };
        }
        this.isSelect = false;
        this.dialogVisibleSelect = true;
      } else if (t == 44) {
        window.parent.postMessage({ tools: "44" }, "*");
      } else if (t == 47) {
        this.sentenceList = this.chapInfoList[this.courseType].chapterInfo[0]
          .taskJson[index].toolChoose[i].sentenceList
          ? JSON.parse(
            JSON.stringify(
              this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
                index
              ].toolChoose[i].sentenceList
            )
          )
          : [{ sentenceTitle: "", addSentence: [], rightAnswer: [] }];
        for (var q = 0; q < this.sentenceList.length; q++) {
          this.sentenceList[q].chooseSenList = [];
          this.sentenceList[q].addChangeSen = [];
          this.sentenceList[q].addChangeSen = JSON.parse(
            JSON.stringify(this.sentenceList[q].addSentence)
          );
          this.sentenceList[q].chooseSenList.length =
            this.sentenceList[q].rightAnswer.length;
        }
        this.dialogVisibleSentence = true;
      } else if (t == 48) {
        this.tableJson = this.chapInfoList[this.courseType].chapterInfo[0]
          .taskJson[index].toolChoose[i].tableJson
          ? JSON.parse(
            JSON.stringify(
              this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
                index
              ].toolChoose[i].tableJson
            )
          )
          : { text: "" };
        if (this.worksStudent.length) {
          for (var k = 0; k < this.worksStudent.length; k++) {
            if (this.userid == this.worksStudent[k].userid) {
              this.tableJson = JSON.parse(this.worksStudent[k].works);
              break;
            }
          }
        }
        this.dialogVisibleTable = true;
      } else if (t == 52) {
        this.wordJson = this.chapInfoList[this.courseType].chapterInfo[0]
          .taskJson[index].toolChoose[i].wordJson
          ? JSON.parse(
            JSON.stringify(
              this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
                index
              ].toolChoose[i].wordJson
            )
          )
          : { text: "" };
        this.dialogVisibleWord = true;
      } else if (t == 49) {
        this.groupJson =
          this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
            index
          ].toolChoose[i].groupJson;

        this.dialogVisibleGroup = true;
      } else if (t == 62) {
        this.videoJson =
          this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
            index
          ].toolChoose[i].videoJson;
        this.dialogVisibleVideo = true;
      }
    },
    teacherWorkSubmit(t, i, index) {
      this.sTool = t;
      this.toolindex = i;
      if (this.tType !== "1" && this.tType !== "4") {
        return;
      }
      if (t == 16 || t == 32 || t == 57 || t == 50) {
        this.dialogVisibleWorks = true; //作业提交
      } else if (t == 15) {
        this.answerQ = this.chapInfoList[this.courseType].chapterInfo[0]
          .taskJson[index].toolChoose[i].answerQ
          ? this.chapInfoList[this.courseType].chapterInfo[0].taskJson[index]
            .toolChoose[i].answerQ
          : "";
        this.questionAnswer = ''
        this.answerDialogVisibleTeacher = true;//问答
      } else if (t == 52) {
        this.wordJson = this.chapInfoList[this.courseType].chapterInfo[0]
          .taskJson[index].toolChoose[i].wordJson
          ? JSON.parse(
            JSON.stringify(
              this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
                index
              ].toolChoose[i].wordJson
            )
          )
          : { text: "" };
        this.dialogVisibleWordTeacher = true;//文档
      } else if (t == 4) {
        this.radio = [];
        this.noteName = "";
        this.isAnswer = false;
        if (this.askCount > 0) {
          this.updateCount(this.askCount, t);
        } else {
          this.askCount++;
          a = this.askCount;
          this.toolsCount(a, t);
        }
        if (!this.dialogVisible2) {
          this.askJson.askJson =
            this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
              index
            ].toolChoose[i].askJson;
          this.askJson.askTitle =
            this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
              index
            ].toolChoose[i].askTitle;
          this.askJson.askCount =
            this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
              index
            ].toolChoose[i].askCount;
        } else {
          this.askJson.askJson = this.chapTools.askJson.askJson;
          this.askJson.askTitle = this.chapTools.askJson.askTitle;
          this.askJson.askCount = this.chapTools.askJson.askCount;
        }
        this.dialogVisible5Teacher = true;
      } else if (t == 45) {
        this.noteName = "";
        this.radio = [];
        this.isAnswer = false;
        if (this.askCount > 0) {
          this.updateCount(this.askCount, t);
        } else {
          this.askCount++;
          a = this.askCount;
          this.toolsCount(a, t);
        }
        this.testJson =
          this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
            index
          ].toolChoose[i].testJson;
        for (var k = 0; k < this.testJson.testJson.length; k++) {
          if (this.testJson.testJson[k].type == "2") {
            this.radio.push([]);
          } else {
            this.radio.push("");
          }
        }

        this.dialogVisibleChoiceTeacher = true;
      } else if (t == 41) {
        this.selectJson = this.chapInfoList[this.courseType].chapterInfo[0]
          .taskJson[index].toolChoose[i].selectJson
          ? JSON.parse(
            JSON.stringify(
              this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
                index
              ].toolChoose[i].selectJson
            )
          )
          : { url: "", select: [], answer: [] };
        if (this.worksStudent.length) {
          for (var k = 0; k < this.worksStudent.length; k++) {
            if (this.sStudent.userid == this.worksStudent[k].userid) {
              var a = this.worksStudent[k].works.split(",");
              for (var ki = 0; ki < a.length; ki++) {
                a[ki] = parseInt(a[ki]);
              }
              this.selectAnswer = {
                answer: a,
                stu: this.worksStudent[k].sName,
              };
              break;
            } else {
              this.selectAnswer = { answer: [], stu: "" };
            }
          }
        } else {
          this.selectAnswer = { answer: [], stu: "" };
        }
        this.isSelect = false;
        this.dialogVisibleSelectTeacher = true;
      } else if (t == 47) {
        this.sentenceList = this.chapInfoList[this.courseType].chapterInfo[0]
          .taskJson[index].toolChoose[i].sentenceList
          ? JSON.parse(
            JSON.stringify(
              this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
                index
              ].toolChoose[i].sentenceList
            )
          )
          : [{ sentenceTitle: "", addSentence: [], rightAnswer: [] }];
        for (var q = 0; q < this.sentenceList.length; q++) {
          this.sentenceList[q].chooseSenList = [];
          this.sentenceList[q].addChangeSen = [];
          this.sentenceList[q].addChangeSen = JSON.parse(
            JSON.stringify(this.sentenceList[q].addSentence)
          );
          this.sentenceList[q].chooseSenList.length =
            this.sentenceList[q].rightAnswer.length;
        }
        this.dialogVisibleSentenceTeacher = true;
      } else if (t == 48) {
        this.tableJson = this.chapInfoList[this.courseType].chapterInfo[0]
          .taskJson[index].toolChoose[i].tableJson
          ? JSON.parse(
            JSON.stringify(
              this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
                index
              ].toolChoose[i].tableJson
            )
          )
          : { text: "" };
        if (this.worksStudent.length) {
          for (var k = 0; k < this.worksStudent.length; k++) {
            if (this.sStudent.userid == this.worksStudent[k].userid) {
              this.tableJson = JSON.parse(this.worksStudent[k].works);
              break;
            }
          }
        }
        this.dialogVisibleTableTeacher = true;
      } else if (t == 40) {
        if (this.evalCount > 0) {
          this.updateCount(this.evalCount, t);
        } else {
          this.evalCount++;
          a = this.evalCount;
          this.toolsCount(a, t);
        }
        this.eScore = { eBzText: "", eStar: [] };
        if (this.worksStudent.length) {
          for (var k = 0; k < this.worksStudent.length; k++) {
            if (this.sStudent.userid == this.worksStudent[k].userid) {
              this.eScore = JSON.parse(this.worksStudent[k].works);
              this.rateJson =
                this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
                  index
                ].toolChoose[i].rateJson;
              break;
            } else {
              this.rateJson =
                this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
                  index
                ].toolChoose[i].rateJson;
            }
          }
        } else {
          this.rateJson =
            this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
              index
            ].toolChoose[i].rateJson;
        }

        this.isStar = false;
        this.studentEvalDialogVisibleTeacher = true;
      } else if (t == 3 || t == 1 || t == 7) {
        window.parent.postMessage(
          {
            tools: t + 'teacherE',
            cid: this.id,
            stage: this.courseType,
            task: this.taskCount,
            tool: i,
            student: this.sStudent,
          },
          "*"
        );
      }
    },
    openStudentTool(s) {
      this.sStudent = s;
      this.dialogVisibleStudentTool = true;
    },
    setRightAnswer(s, i, j) {
      for (var q = 0; q < this.sentenceList[i].chooseSenList.length; q++) {
        if (
          this.sentenceList[i].chooseSenList[q] == undefined ||
          this.sentenceList[i].chooseSenList[q] == ""
        ) {
          this.sentenceList[i].chooseSenList[q] = s;
          this.sentenceList[i].addChangeSen[j] = "";
          break;
        }
      }
      this.$forceUpdate();
    },
    returnCard(r, i, j) {
      var a = this.sentenceList[i].addSentence.indexOf(r);
      this.sentenceList[i].chooseSenList[j] = "";
      this.sentenceList[i].addChangeSen[a] = r;
      this.$forceUpdate();
    },
    // addSentenceTool() {
    //   this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
    //     this.taskCount
    //   ].toolChoose[this.toolindex].sentenceList = this.sentenceList;
    //   this.sentenceList = [
    //     { sentenceTitle: "", addSentence: [], rightAnswer: [] },
    //   ];
    //   this.dialogVisibleSentence = false;
    // },
    toolsCount(a, t) {
      let params = {
        cid: this.id,
        chid: this.courseType,
        uid: this.userid,
        tid: t,
        count: a,
      };
      this.ajax
        .get(this.$store.state.api + "insertToolsCount", params)
        .then((res) => {
          this.selectCount();
        })
        .catch((err) => {
          console.error(err);
        });
    },
    updateCount(c, t) {
      c++;
      let params = {
        cid: this.id,
        chid: this.courseType,
        uid: this.userid,
        tid: t,
        count: c,
      };
      this.ajax
        .get(this.$store.state.api + "updateToolsCount", params)
        .then((res) => {
          this.selectCount();
        })
        .catch((err) => {
          console.error(err);
        });
    },
    checkEva() {
      if (this.evalua != "") {
        for (var i = 0; i < this.evaJuri.length; i++) {
          if (this.evalua == this.evaJuri[i].id) {
            this.eTitle = this.evaJuri[i].title;
            this.eJson = JSON.parse(this.evaJuri[i].content);
          }
        }
        this.$forceUpdate();
        setTimeout(() => {
          this.setMindData();
        }, 0);
      }
    },
    selectEva() {
      let params = {
        oid: this.oid,
      };
      this.ajax
        .get(this.$store.state.api + "selectAllEvaluation", params)
        .then((res) => {
          this.evaJuri = res.data[0];
        })
        .catch((err) => {
          console.error(err);
        });
    },
    setMindData() {
      this.data.data = [];
      this.data.data.push({ id: "root", isroot: true, topic: this.eTitle });
      let _eJson = Object.keys(this.eJson);
      let _e = this.eJson;
      for (let i = 0; i < _eJson.length; i++) {
        let element = _e[_eJson[i]];
        this.data.data.push({
          id: element.id,
          parentid: "root",
          topic: element.name,
        });
        let _eJsonc = Object.keys(element.child);
        let _e2 = element.child;
        for (let j = 0; j < _eJsonc.length; j++) {
          let _ec = _e2[_eJsonc[j]];
          this.data.data.push({
            id: _ec.id,
            parentid: element.id,
            topic: _ec.name,
          });
          let _eJsonz = Object.keys(_ec.child);
          let _e3 = _ec.child;
          for (let z = 0; z < _eJsonz.length; z++) {
            let _ez = _e3[_eJsonz[z]];
            this.data.data.push({
              id: _ez.id,
              parentid: _ec.id,
              topic: _ez.name,
            });
          }
        }
      }
      this.$forceUpdate();
    },
    checkFileFull(type, url) {
      this.fullDialogVisible = true;
      this.fulltype = type;
      this.fullUrl = url;
    },
    openSname(n, id, i) {
      this.snameWid = id;
      this.worksSName = n;
      this.toolindex = i
      this.uploadCid = this.tcid ? this.tcid : this.courseDetail.juri
      this.selectUploadStudent()
      this.dialogVisibleSname = true;
    },
    updateName() {
      let params = {
        n: this.worksSName,
        cid: this.snameWid,
      };
      this.ajax
        .get(this.$store.state.api + "updateCourseWorksName", params)
        .then((res) => {
          this.$message({
            message: "修改成功",
            type: "success",
          });
          this.dialogVisibleSname = false;
          this.getCourseDetail();
          this.snameWid = "";
          this.worksSName = "";
        })
        .catch((err) => {
          console.error(err);
        });
    },
    downloadFile2(f) {
      let url = f.url
      let _this = this;
      let _url = "";
      if (
        url.indexOf("https://view.officeapps.live.com/op/view.aspx?src=") != -1
      ) {
        _url = url.split(
          "https://view.officeapps.live.com/op/view.aspx?src="
        )[1];
      } else {
        _url = url;
      }
      const x = new XMLHttpRequest();
      x.open("GET", _url, true);
      x.responseType = "blob";
      const loading = _this.$loading.service({
        background: "rgba(255, 255, 255, 0.7)",
        target: document.body,
        text: "文件加载中...",
      });
      // _this.$message.success("文件下载中...");
      x.onload = function (e) {
        loading.close();
        let content = x.response;
        let elink = document.createElement("a");
        elink.download = f.name;
        elink.style.display = "none";
        let blob = new Blob([content]);
        elink.href = URL.createObjectURL(blob);
        document.body.appendChild(elink);
        elink.click();
        document.body.removeChild(elink);
      };
      x.send();
    },
    downloadFile(url) {
      let _this = this;
      let _url = "";
      if (
        url.indexOf("https://view.officeapps.live.com/op/view.aspx?src=") != -1
      ) {
        _url = url.split(
          "https://view.officeapps.live.com/op/view.aspx?src="
        )[1];
      } else {
        _url = url;
      }
      const x = new XMLHttpRequest();
      x.open("GET", _url, true);
      x.responseType = "blob";
      const loading = _this.$loading.service({
        background: "rgba(255, 255, 255, 0.7)",
        target: document.body,
        text: "文件加载中...",
      });
      // _this.$message.success("文件下载中...");
      x.onload = function (e) {
        loading.close();
        // const url = window.URL.createObjectURL(x.response);
        // const a = document.createElement("a");
        // a.href = url;
        // a.target = "_blank";
        // a.download = url;
        // a.click();
        // a.remove();
        let content = x.response;
        let elink = document.createElement("a");
        elink.download = decodeURI(
          _url.split("https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/")[1]
        );
        elink.style.display = "none";
        let blob = new Blob([content]);
        elink.href = URL.createObjectURL(blob);
        document.body.appendChild(elink);
        elink.click();
        document.body.removeChild(elink);
      };
      x.send();
    },
    openLine(url) {
      window.open(url);
    },
    resize() {
      if (document.getElementsByClassName("box_course").length) {
        var a = document.getElementsByClassName("box_course")[0].offsetHeight;
        // document.getElementsByClassName("vedioList")[0].style.height = a + "px";
        document.getElementsByClassName("navBox")[0].style.height =
          a - 40 + "px";
      }
      this.Stbodywidth =
        document.getElementsByClassName("student_body").length &&
        document.getElementsByClassName("student_body")[0].offsetWidth;
    },
    closeDraw() {
      this.bg = null;
      this.drawShow = false;
    },
    showPicturePaint(url) {
      let params = {
        img: url,
      };
      this.ajax
        .get(this.$store.state.api + "imgToBase64", params)
        .then((res) => {
          console.log(res);
          this.drawShow = true;
          this.bg = res.data[0].img;
        })
        .catch((err) => {
          console.error(err);
        });
    },
    addImgDraw(base64) {
      let file = { name: "批注图.png" };
      let img = this.dataUrlToFile(base64, file);
      this.beforeUpload1(img, 5);
    },
    addImgDrawImG(url) {
      // console.log(url);
      let params = [
        {
          wid: this.commentDetail.wid,
          img: url,
        },
      ];
      this.ajax
        .post(this.$store.state.api + "updateCourseWorks", params)
        .then((res) => {
          this.$message({
            message: "提交成功",
            type: "success",
          });
          this.drawShow = false;
          this.bg = "";
          this.selectSWorks();
          this.selectStudent();
        })
        .catch((err) => {
          this.$message.error("提交失败");
          console.error(err);
        });
    },
    deletePicturePaint() {
      this.$confirm("确定删除此批注吗？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          let params = [
            {
              wid: this.commentDetail.wid,
              img: "",
            },
          ];
          this.ajax
            .post(this.$store.state.api + "updateCourseWorks", params)
            .then((res) => {
              this.$message({
                message: "删除成功",
                type: "success",
              });
              this.selectSWorks();
              this.selectStudent();
            })
            .catch((err) => {
              this.$message.error("删除失败");
              console.error(err);
            });
        })
        .catch(() => { });
    },
    getAudioVideo(constraintsData) {
      if (navigator.mediaDevices === undefined) {
        navigator.mediaDevices = {};
      }
      if (navigator.mediaDevices.getUserMedia === undefined) {
        navigator.mediaDevices.getUserMedia = function (constraints) {
          // 首先，如果有getUserMedia的话，就获得它
          var getUserMedia =
            navigator.getUserMedia ||
            navigator.webkitGetUserMedia ||
            navigator.mozGetUserMedia ||
            navigator.msGetUserMedia;
          // 一些浏览器根本没实现它 - 那么就返回一个error到promise的reject来保持一个统一的接口
          if (!getUserMedia) {
            return Promise.reject({ code: 404 });
          }

          // 否则，为老的navigator.getUserMedia方法包裹一个Promise

          return new Promise(function (resolve, reject) {
            getUserMedia.call(navigator, constraints, resolve, reject);
          });
        };
      }
      return navigator.mediaDevices.getUserMedia(constraintsData);
    },
    /**
     * 开始录制
     */
    startRecording(callback) {
      let _function = (screenStream) => {
        this.addStreamStopListener(screenStream, () => {
          console.log("流停止监听");
          this.stopRecording();
          this.$emit("streamStop", {});
          // this.stopRecording();
        });
        var options = {
          type: "video",
          mimeType: "video/webm",
          disableLogs: false,
          getNativeBlob: false, // enable it for longer recordings
          ignoreMutedMedia: false,
        };
        // this.video.srcObject = screenStream;
        this.recorder = RecordRTC(screenStream, options);
        this.recorder.startRecording();
        this.recorder.screen = screenStream;
        this.videoStart = true;
        // callback(true);
      };

      this.getAudioVideo({ audio: true })
        .then((res) => {
          this.captureScreen(_function, true);
          console.log("已点击允许,开启成功");
        })
        .catch((err) => {
          // 	console.log('浏览器不支持，请更换浏览器')
          // } else {
          this.captureScreen(_function, false);
          console.log("请检查是否存在麦克风");
        });
    },
    /**
     * 停止录制
     */
    stopRecording(callback) {
      this.recorder.stopRecording(() => {
        // this.video.src = this.video.srcObject = null;
        // this.video.src = URL.createObjectURL(this.recorder.getBlob());
        const url = URL.createObjectURL(this.recorder.getBlob());
        const a = document.createElement("a"); //this.fileName+
        let videoFile = new File(
          [this.recorder.getBlob()],
          this.courseDetail.title + "录屏.mp4",
          {
            type: "video/mp4",
          }
        );
        let downloadUrl = URL.createObjectURL(videoFile);
        document.body.appendChild(a);
        a.style.display = "none";
        a.href = url;
        a.download = this.courseDetail.title + "录屏.mp4"; //this.fileName +
        a.click();
        this.recorder.screen.stop();
        this.recorder.destroy();
        this.recorder = null;
        this.videoStart = false;
        // callback(false);
      });
    },
    //初始化
    captureScreen(callback, type) {
      if (navigator.getDisplayMedia) {
        //录制结束,文件下载
        navigator
          .getDisplayMedia({
            video: true,
          })
          .then((screenStream) => {
            if (type) {
              navigator.mediaDevices
                .getUserMedia({ audio: true })
                .then((mic) => {
                  screenStream.addTrack(mic.getTracks()[0]);
                  callback(screenStream);
                });
            } else {
              callback(screenStream);
            }
          })
          .catch(function (error) {
            console.log("error", error);
          });
      } else if (navigator.mediaDevices.getDisplayMedia) {
        navigator.mediaDevices
          .getDisplayMedia({
            video: true,
          })
          .then((screenStream) => {
            if (type) {
              navigator.mediaDevices
                .getUserMedia({ audio: true })
                .then((mic) => {
                  screenStream.addTrack(mic.getTracks()[0]);
                  callback(screenStream);
                });
            } else {
              callback(screenStream);
            }
          })
          .catch(function (error) {
            console.log("error", error);
          });
      } else {
        var error = "getDisplayMedia API are not supported in this browser.";
        console.log("error", error);
        alert(error);
      }
    },

    //流监听
    addStreamStopListener(stream, callback) {
      stream.addEventListener(
        "ended",
        function () {
          callback();
          callback = function () { };
        },
        false
      );
      stream.addEventListener(
        "inactive",
        function () {
          callback();
          callback = function () { };
        },
        false
      );
      stream.getTracks().forEach(function (track) {
        track.addEventListener(
          "ended",
          function () {
            callback();
            callback = function () { };
          },
          false
        );
        track.addEventListener(
          "inactive",
          function () {
            callback();
            callback = function () { };
          },
          false
        );
      });
    },

    updateGroup() {
      this.groupJson2 = JSON.parse(JSON.stringify(this.groupJson));
      this.dialogVisibleGroup2 = true;
    },
    updateGroupJson() {
      for (var i = 0; i < this.groupStudentUid[this.toolindex].length; i++) {
        if (
          this.groupStudentUid[this.toolindex][i].length >
          this.groupJson2.number
        ) {
          this.$message.error("已经有小组比你设置的人数多，请重新设置");
          return;
        }
      }
      this.groupJson = JSON.parse(JSON.stringify(this.groupJson2));
      this.chapInfoList[this.courseType].chapterInfo[0].taskJson[
        this.taskCount
      ].toolChoose[this.toolindex].groupJson = this.groupJson;
      let params = [
        {
          cid: this.id,
          chapters: JSON.stringify(this.chapInfoList).replaceAll(/%/g, "%25"),
          uid: this.userid,
          unitIndex: this.courseType,
        },
      ];
      this.ajax
        .post(this.$store.state.api + "updateWorkNew4", params)
        .then((res) => {
          this.$message.success("设置成功");
          this.getCourseDetail(2);
          this.dialogVisibleGroup2 = false;
          this.groupJson2 = {};
          this.$forceUpdate();
        })
        .catch((err) => {
          this.$message.error("网络不佳");
          console.error(err);
        });
    },
    lockChair() {
      this.groupJson2 = JSON.parse(JSON.stringify(this.groupJson));
      this.groupJson2.islock = this.groupJson2.islock == 1 ? 2 : 1;
      this.updateGroupJson();
    },
    selectGroup(index) {
      this.getCourseDetail(2, index);
    },
    joinGroup(index) {
      if (this.groupJson.islock == 2) {
        this.$message.error("位置已被锁定，无法加入");
        return;
      }
      if (
        this.groupStudent[this.toolindex][index].length >
        this.groupJson.number ||
        this.groupStudent[this.toolindex][index].length == this.groupJson.number
      ) {
        this.$message.error("位置已满，无法加入");
        return;
      }
      let params = [
        {
          cid: this.id,
          stage: this.courseType,
          task: this.taskCount,
          tool: this.toolindex,
          g: index,
          uid: this.userid,
        },
      ];
      this.ajax
        .post(this.$store.state.api + "joinGroup", params)
        .then((res) => {
          this.$message.success("加入成功");
          this.getCourseDetail();
        })
        .catch((err) => {
          this.$message.error("网络不佳");
          console.error(err);
        });
    },
    exitGroup(id) {
      if (this.groupJson.islock == 2) {
        this.$message.error("位置已被锁定，无法退出");
        return;
      }
      let params = [
        {
          gid: id,
        },
      ];
      this.ajax
        .post(this.$store.state.api + "exitGroup", params)
        .then((res) => {
          this.$message.success("退出成功");
          this.getCourseDetail();
        })
        .catch((err) => {
          this.$message.error("网络不佳");
          console.error(err);
        });
    },
    groupUpload(index, task, gindex) {
      this.taskCount = task;
      this.toolindex = index;
      this.groupIndex = gindex;
      this.dialogVisibleGroupWork = true;
    },
    updateGroupChair(user) {
      this.updateGroupArray = this.groupJson.group.filter((el, index) => {
        el.label = index;
        return index != user.group;
      });
      this.updateGroupUser = user;
      this.dialogVisibleUpdateGroup = true;
    },
    updateChair() {
      if (
        this.groupStudent[this.toolindex][this.checkChair].length >
        this.groupJson.number ||
        this.groupStudent[this.toolindex][this.checkChair].length ==
        this.groupJson.number
      ) {
        this.$message.error("位置已满，无法加入");
        return;
      }
      let params = [
        {
          cid: this.id,
          stage: this.courseType,
          task: this.taskCount,
          tool: this.toolindex,
          g: this.checkChair,
          uid: this.updateGroupUser.userid,
        },
      ];
      this.ajax
        .post(this.$store.state.api + "joinGroup", params)
        .then((res) => {
          this.$message.success("修改成功");
          this.updateGroupUser = {};
          this.checkChair = "";
          this.updateGroupArray = {};
          this.dialogVisibleUpdateGroup = false;
          this.getCourseDetail();
        })
        .catch((err) => {
          this.$message.error("网络不佳");
          console.error(err);
        });
    },
    deleteGroupChair(gindex) {
      this.checkDeleteGroup = [];
      this.deleteGroupUser = JSON.parse(
        JSON.stringify(this.groupStudent[this.toolindex][gindex])
      );
      this.deleteGroupArray = this.groupJson.group[gindex];
      this.groupIndex = gindex;
      this.dialogVisibleDeleteGroup = true;
    },
    async deleteChair() {
      for (let i = 0; i < this.checkDeleteGroup.length; i++) {
        const gid =
          this.groupStudent[this.toolindex][this.groupIndex][
          this.groupStudentUid[this.toolindex][this.groupIndex].indexOf(
            this.checkDeleteGroup[i]
          )
          ];
        let params = [
          {
            gid: gid.id,
          },
        ];
        var a = await this.deleteChairA(params);
        if (i == this.checkDeleteGroup.length - 1) {
          this.$message.success("退出成功");
          this.dialogVisibleDeleteGroup = false;
          this.deleteGroupUser = [];
          this.deleteGroupArray = {};
          this.groupIndex = "";
          this.checkDeleteGroup = [];
          this.getCourseDetail();
        }
      }
    },

    deleteChairA(params) {
      return new Promise((resolve, reject) => {
        this.ajax
          .post(this.$store.state.api + "exitGroup", params)
          .then((res) => {
            resolve(1);
          })
          .catch((err) => {
            this.$message.error("网络不佳");
            console.error(err);
          });
      });
    },
    contract(i) {
      if (this.isCloseList.isClose == 0) {
        this.isCloseList.isClose = 1;
      } else {
        this.isCloseList.isClose = 0;
      }
      this.$forceUpdate();
    },
  },
  directives: {
    // 使用局部注册指令的方式
    resize: {
      // 指令的名称
      bind(el, binding) {
        // el为绑定的元素，binding为绑定给指令的对象
        let width = "",
          height = "";
        function isReize() {
          const style = document.defaultView.getComputedStyle(el);
          if (width !== style.width || height !== style.height) {
            binding.value(); // 关键
          }
          width = style.width;
          height = style.height;
        }
        el.__vueSetInterval__ = setInterval(isReize, 300);
      },
      unbind(el) {
        clearInterval(el.__vueSetInterval__);
      },
    },
  },
  beforeDestroy() {
    window.onresize = null;
    clearInterval(this.timer);
    this.timer = null;
    clearInterval(this.opertimer);
    this.opertimer = null;
  },
  computed: {
    contentConvent() {
      return function (c) {
        return c
          ? c
            .replaceAll(/\r\n/g, "<br/>")
            .replaceAll(/\n/g, "<br/>")
            .replaceAll(/\s/g, " &nbsp")
          : "";
      };
    },
    checkUpload() {
      return function () {
        var studentK = [];
        if (this.plworkFile.length > 0) {
          for (var z = 0; z < this.plworkFile.length; z++) {
            studentK.push(this.plworkFile[z].username);
          }
          studentK = studentK.join(",");
        }
        var a = this.uploadStudentJuri.filter((el) => {
          return studentK.indexOf(el.userid) == -1
        });
        return a
      }
    }
  },
  mounted() {
    if (this.screenType == 2) {
      window.parent.postMessage({ allScreen: 4 }, "*");
    } else if (this.screenType == 3) {
      window.parent.postMessage({ allScreen: 5 }, "*");
    } else if (this.screenType == 1) {
      window.parent.postMessage({ allScreen: 6 }, "*");
    }
    this.setOperationTime();
    this.selectEva();
    this.getCourseDetail();
    this.selectCount();
    this.getHomeWork();
    this.toolIndex = null
    this.contentDialog = true;
    this.setContent2(true)
    if (this.tType == 4) {
      this.pzDialog = true;
      this.selectPz();
    }
    document.scrollingElement.scrollTop = 0;
    window.addEventListener("resize", () => {
      var a = document.getElementsByClassName("box_course")[0].offsetHeight;
      // document.getElementsByClassName("vedioList")[0].style.height = a + "px";
      document.getElementsByClassName("navBox")[0].style.height = a - 40 + "px";
    });
    let _this = this;
    setTimeout(() => {
      // _this.vedioTime = [];
      // for (var i = 0; i < _this.vedio[_this.taskCount].length; i++) {
      //   _this.vedioTime[i] = document.getElementsByClassName(
      //     "vjs-duration-display"
      //   )[i].textContent;
      // }
    }, 1000);
  },
};
</script>

<style scoped>
@media screen and (max-width: 1280px) {

  /* .courseIndex > div:first-child(2) {
    width: 15% !important;
  } */
  /* .navText {
    width: 120px !important;
  } */
  .evaCss {
    flex-direction: column !important;
    align-items: center !important;
  }

  .dialog_diy1>>>.el-dialog {
    width: 100% !important;
  }

  .rightWidthCss {
    width: 100% !important;
  }

  .dialog_diy3>>>.el-dialog {
    width: 100% !important;
  }

  /* .textTitle >>> .el-form-item__label {
    width: 150px !important;
  } */
}

.evaCssMax {
  flex-direction: column !important;
  align-items: center !important;
}

.dialog_diy>>>.el-dialog {
  margin-top: 10vh !important;
}

.body_student {
  width: 77%;
  height: 100%;
  position: absolute;
  left: 22%;
  top: 0;
}

.student_head {
  width: 100%;
  margin: 0 auto;
  padding-bottom: 20px;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: flex-start;
}

.pb_left {
  width: 20%;
  margin-right: 10px;
  background: rgb(255, 255, 255);
  padding-right: 10px;
  position: fixed;
  height: 100%;
}

.wheel>img,
.project>img,
.star>img,
.evaluate>img,
.up_photo>img,
.chapter_add>img,
.deleteWord>img,
.question>img,
.homework>img {
  width: 100%;
  height: 100%;
}

.upCover>img {
  width: 131px;
  height: 69px;
  object-fit: cover;
}

.upCover {
  width: calc(100% / 3.5);
  position: relative;
  margin: 0 15px 10px 0;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: center;
  align-content: center;
  align-items: center;
  height: fit-content;
}

.upCover2 {
  width: 100%;
  position: relative;
  margin: 0 15px 10px 0;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: center;
  align-content: center;
  align-items: center;
}

.upCover2>img {
  width: 100%;
  height: 90px;
  object-fit: contain;
}

.chapter_add {
  width: 120px;
  position: relative;
  text-align: center;
}

.isAddThings {
  margin-top: 20px;
  position: relative;
  text-align: center;
  background: #f7f8fa;
  height: 90px;
  width: 90px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.deleteWord {
  width: 22px;
  height: 22px;
  position: absolute;
  right: -5px;
  top: -5px;
  cursor: pointer;
}

.box_course {
  /* width: 60%; */
  width: 81%;
}

.wheel {
  width: 100%;
  /* height: 100%; */
  height: 650px;
}

.right_box {
  display: flex;
  flex-direction: column;
  margin-left: 30px;
  justify-content: space-around;
}

.right_box_title {
  font-size: 23px;
}

.people {
  display: flex;
}

.student_body {
  width: 100%;
  margin: 0 auto;
  margin-top: 10px;
  padding: 0 0 20px;
}

.study_top {
  margin-top: 70px;
  width: 100%;
  /* overflow: auto; */
  height: auto;
}

.study_top .checkbox {
  display: flex;
  align-items: center;
  padding: 15px 0 15px 30px;
  flex: 0 0 auto;
  font-weight: bold;
  border-bottom: 1px solid #eee;
}

.study_top .check {
  padding-bottom: 5px;
  text-align: center;
  cursor: pointer;
  height: 30px;
  box-sizing: border-box;
  display: flex;
}

.study_top .checked {
  border-bottom: 4px solid #3fc6a0;
  padding-bottom: 5px;
  color: #3fc6a0;
  display: flex;
  height: 35px;
}

.study_top .checked>div,
.study_top .check>div {
  margin-right: 5px;
}

.videoTop {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  background: #fff;
  align-items: center;
  width: 95%;
  padding: 20px;
}

.upbtn {
  margin: 25px;
  background: #70afdb;
  color: #fff;
  width: 120px;
  text-align: center;
  height: 30px;
  line-height: 30px;
  font-size: 13px;
  border-radius: 5px;
  cursor: pointer;
}

.filebox {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  padding: 15px 0 5px;
}

.filebox .tooldetail {
  width: 100%;
  margin: 0px 12px;
  background: rgb(247, 247, 247);
  padding: 20px;
  line-height: 30px;
  word-break: break-word;
}

.file {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  width: 200px;
}

.file div {
  margin-top: 10px;
  width: 150px;
  text-align: center;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.media {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin: 0 20px 20px 0;
  cursor: pointer;
  margin: 12px 0 5px 15px;
  overflow: hidden;
  box-shadow: 0px 1px 3px 0px rgb(0 0 0 / 20%), 0px 1px 1px 0px rgb(0 0 0 / 14%),
    0px 2px 1px -1px rgb(0 0 0 / 12%);
  box-sizing: border-box;
}

.media img {
  height: 90px;
  width: 160px;
  object-fit: cover;
}

.media .title {
  padding: 5px;
  text-align: left;
  width: 100%;
  box-sizing: border-box;
}

.media .btn {
  width: 100%;
  height: 35px;
  line-height: 35px;
  color: #fff;
  background: #606060;
  text-align: center;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.detail_content_top {
  width: 100%;
  padding: 25px 0 25px 0;
}

.detail_title {
  text-align: center;
  font-size: 24px;
}

.detail_time {
  font-size: 13px;
  padding: 15px 0 0 40px;
}

.detail_content {
  line-height: 2pc;
  width: 90%;
  margin: 0 auto;
  padding-top: 30px;
  text-indent: 30px;
  overflow: auto;
  height: 200px;
}

.score_box>>>.el-rate {
  margin-left: 10px;
}

.dialog_change>>>.el-dialog {
  border-radius: 5px;
}

.dialog_change>>>.el-dialog__header {
  background: #f2f2f2;
  text-align: center;
}

.dialog_change>>>.el-dialog__title {
  line-height: 5px;
}

.dialog_change>>>.el-dialog__body {
  background: #fff;
  padding: 10px 20px;
}

.score_box {
  display: flex;
  align-items: center;
  margin-bottom: 18px;
  margin-top: 20px;
}

.up_photo {
  width: 120px;
  cursor: pointer;
  margin-top: 10px;
}

.up_photo2 {
  width: 180px;
  box-sizing: border-box;
  min-width: 180px;
  height: 180px;
  max-height: 180px;
  min-height: 180px;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: rgb(242, 246, 255);
  /* padding: 25px; */
  margin-bottom: 10px;
}

.up_photo2 img {
  width: 50%;
  height: auto;
}

.up_photo2 span {
  color: #898989;
}

.plworkBox {
  display: flex;
  align-items: center;
  margin-top: 10px;
  flex-wrap: wrap;
}

.upload_send {
  margin: 30px auto 30px;
  width: 60%;
  background: #169bd6;
  text-align: center;
  height: 35px;
  line-height: 35px;
  color: #fff;
  border-radius: 5px;
  cursor: pointer;
}

.marginT {
  margin-top: 20px;
}

.cd_content_steps {
  display: flex;
  width: 90%;
  justify-content: space-around;
  border-top: 1px solid #eeeeee;
}

.cd_steps_box {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  cursor: pointer;
}

.first {
  display: flex;
  align-items: center;
  margin: 15px 0 20px 0;
  font-size: 20px;
}

.first>div:nth-child(2) {
  font-size: 16px !important;
  padding-left: 10px;
  line-height: 26px;
  box-sizing: border-box;
}

.blue_box_one {
  text-align: center;
  color: #fff;
  background-image: linear-gradient(90deg, #477cd7, #65b9fc);
  border-radius: 7px;
  margin: 10px;
  cursor: pointer;
  width: 95%;
  height: 45px;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
}

.blue_box_one>div:nth-child(1) {
  line-height: 30px;
  margin: 0 5px 0 10px;
  width: 30%;
  min-width: 70px;
  border-radius: 4px;
}

.blue_box_one>div:nth-child(2) {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  word-break: break-all;
  width: 70%;
  text-align: left;
  margin-right: 10px;
  max-width: calc(100% - 85px);
}

.blue_box_one>div:nth-child(2):hover {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  cursor: pointer;
}

.upFile {
  margin: 0 auto;
  width: 120px;
  background: #70afdb;
  color: #fff;
  height: 30px;
  text-align: center;
  line-height: 30px;
  border-radius: 5px;
  font-size: 14px;
  cursor: pointer;
}

.courseTitle {
  background: #205cc6;
  width: 85%;
  margin: 10px auto;
  color: #fff;
  border-radius: 5px;
  padding: 10px 10px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  text-align: center;
}

.courseTitle .ctitle {
  font-weight: bold;
  font-size: 20px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.courseTitle .inviteBox {
  font-size: 14px;
  margin-top: 5px;
  color: #a6cbff;
}

.courseTitle>>>.el-tooltip {
  width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-word;
}

.ml {
  margin-left: 20px;
  color: #5b7dba;
  border-left: 3px solid #5b7dba;
  padding-left: 5px;
  font-weight: bold;
}

.return {
  width: 2rem;
  height: 2rem;
  cursor: pointer;
}

.return>img {
  width: 100%;
  height: 100%;
}

.returnBtn {
  background: #499eef;
  width: 65px;
  height: 30px;
  color: #fff;
  text-align: center;
  line-height: 32px;
  margin-right: 20px;
  cursor: pointer;
  border-radius: 5px;
  font-size: 14px;
}

.mask {
  background-color: rgba(0, 0, 0, 0);
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 20000;
  display: flex;
  align-items: center;
  justify-content: center;
}

.progressBox {
  width: 500px;
  height: 180px;
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 0 6px 1px #bfbfbf;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  position: relative;
  color: #6c6c6c;
}

.progressBox>>>.el-progress-bar__outer {
  background-color: #d1dfff !important;
}

.progressBox .lbox {
  height: 50px;
  font-size: 19px;
  display: flex;
  align-items: center;
  color: #747474;
}

.progressBox .lbox img {
  width: 40px;
  margin-right: 20px;
}

.closeCss {
  position: absolute;
  top: 8px;
  right: 8px;
  cursor: pointer;
  width: 20px;
  height: 20px;
}

.closeCss>img {
  width: 100%;
  height: 100%;
}

.uploadVedio {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  margin: 0 15px 10px 0;
}

.uploadVedio>img {
  width: 30px;
  height: 30px;
}

.uploadVedio>span {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 75px;
  margin-top: 7px;
}

.picName {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 75px;
  margin-top: 7px;
}

.new_top {
  display: flex;
  background: #fff;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  height: 60px;
  position: relative;
}

.before {
  position: absolute;
  background: #c3dad4;
  width: 6px;
  height: 100%;
}

.courseIndex {
  display: flex;
  flex-direction: row;
  align-items: center;
  width: calc(100% - 520px);
}

.courseIndex>div:nth-child(1) {
  margin: 0 20px;
  padding-left: 5px;
  font-size: 24px;
  min-width: 100px;
  font-weight: bold;
  border-left: 4px solid #3363b9;
  height: 35px;
  text-align: center;
  line-height: 35px;
}

.courseIndex>div:nth-child(2) {
  font-size: 23px;
  /* width: 300px; */
  max-width: calc(100% - 180px);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.courseIndex>div:nth-child(3) {
  border-bottom: 1px solid #d7d7d7;
  padding-bottom: 5px;
  background: #49a0f0;
  width: 55px;
  min-width: 55px;
  border-radius: 5px;
  color: #fff;
  text-align: center;
  height: 20px;
  line-height: 26px;
  font-size: 14px;
  margin: 0 0 0 10px;
}

.course_text {
  padding: 20px 0 0 15px;
  text-indent: 30px;
  width: 80%;
  min-height: 20px;
}

.vedioList {
  background: #f2f2f2;
  border: 1px solid #ececec;
  /* width: 38.8%; */
  width: 100%;
  height: 445px;
  border-radius: 10px;
  overflow: hidden;
}

.vedioNav {
  margin: 10px 0 0 15px;
  border-bottom: 1px solid #d7d7d7;
  padding-bottom: 5px;
  background: #96d1ff;
  width: 55px;
  min-width: 55px;
  border-radius: 5px;
  color: #fff;
  text-align: center;
  height: 20px;
  line-height: 26px;
  font-size: 14px;
}

.queTop {
  display: flex;
  padding: 20px 0 20px 30px;
  width: 100%;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  border-bottom: 1px solid #eeeeee;
  box-sizing: border-box;
}

.question {
  width: 40px;
  margin-right: 10px;
  margin-top: 7px;
}

.queTitle {
  margin-left: 5px;
  font-size: 25px;
  display: flex;
  align-items: center;
}

.addEditor {
  width: 100px;
  height: 30px;
  background: #42cda6;
  color: #fff;
  border-radius: 5px;
  text-align: center;
  line-height: 30px;
  box-shadow: 1px 3px 6px 1px #bfbfbf;
  cursor: pointer;
}

.vedioName {
  /* text-overflow: ellipsis;
  top: 8px;
  font-size: 14px;
  overflow: hidden;
  width: 100%;
  word-break: break-all;
  white-space: nowrap; */

  cursor: pointer;
  margin: 0px 0px 10px 5px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 100%;
}

.vedioTime {
  width: 35px;
  position: absolute;
  color: #fff;
  bottom: 0px;
  right: 0px;
  text-align: center;
  background: #46411f;
  height: 20px;
  font-size: 14px;
  line-height: 20px;
}

.homework {
  width: 200px;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: center;
  cursor: pointer;
}

.homebox {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  padding: 15px 0;
}

.isChooseActive {
  color: #3e88f4;
  border-bottom: 2px solid #2f80f3;
}

.tool_box {
  width: 100%;
  margin-top: 20px
}

.tool_type_box {
  display: flex;
  flex-direction: row;
  align-items: baseline;
  flex-wrap: nowrap;
  justify-content: flex-start;
  position: relative;
}

.addPoint>div>img {
  cursor: pointer;
  margin: 0 10px;
  width: 85px;
  border-radius: 15px;
  box-shadow: 0px 1px 8px 0px rgb(20 20 20 / 14%);
}

.addPoint>div {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: center;
}

.isBorder>div {
  margin: 0 0 10px 0;
  align-items: flex-start !important;
}

.noiframeBox {
  display: flex;
  flex-wrap: wrap;
}

.iframeBox iframe {
  width: 100%;
  height: 800px;
  border: none;
  margin-bottom: 20px;
  border: 1px solid #ccc;
}

.upload_toolBtn {
  background: #6b92c9;
  color: #fff;
  width: 110px;
  text-align: center;
  height: 35px;
  line-height: 35px;
  font-size: 14px;
  border-radius: 5px;
  cursor: pointer;
  position: absolute;
  right: 10px;
  bottom: 0;
}

.binfo_input,
.pj {
  font: inherit;
  color: currentColor;
  width: 100%;
  margin: 0;
  padding: 15px 14px;
  display: block;
  min-width: 0;
  outline: none;
  box-sizing: content-box;
  background: none;
  -webkit-tap-highlight-color: transparent;
  border: 1px solid rgba(0, 0, 0, 0.23);
  border-radius: 4px;
  box-sizing: border-box;
  resize: none;
}

.binfo_input:focus-visible {
  border: 1px solid rgba(61, 103, 188);
}

.dialog_diy>>>.el-dialog__header,
.dialog_diy1>>>.el-dialog__header {
  background: #454545 !important;
  padding: 15px 20px;
}

.dialog_diy>>>.el-dialog__title,
.dialog_diy1>>>.el-dialog__title {
  color: #fff;
}

.dialog_diy>>>.el-dialog__headerbtn,
.dialog_diy1>>>.el-dialog__headerbtn {
  top: 19px;
}

.dialog_diy>>>.el-dialog__headerbtn .el-dialog__close,
.dialog_diy1>>>.el-dialog__headerbtn .el-dialog__close {
  color: #fff;
}

.dialog_diy>>>.el-dialog__headerbtn .el-dialog__close:hover,
.dialog_diy1>>>.el-dialog__headerbtn .el-dialog__close:hover {
  color: #fff;
}

.dialog_diy1>>>.el-dialog__body {
  padding: 0;
}

.dialog_diy>>>.el-dialog__body,
.dialog_diy>>>.el-dialog__footer,
.dialog_diy1>>>.el-dialog__footer {
  background: #fafafa;
}

.a_addBox {
  margin: 10px 0;
  background: #fff;
  padding: 15px;
}

.a_add_box {
  border-bottom: 2px solid #eee;
  padding-bottom: 10px;
}

.a_add_head {
  display: flex;
  align-items: flex-start;
  /* justify-content: space-between; */
  flex-direction: column;
  /* flex-direction: row; */
  margin: 10px 0 20px 0;
  font-size: 18px;
  width: 100%;
}

.a_add_head .a_add_head_input {
  width: 300px;
}

.a_add_head .a_add_head_div {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.a_add_body {
  display: flex;
  align-items: center;
}

.a_add_input {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}

.a_add_input>>>el-radio-group {
  margin: 10px 0;
}

.a_add_input>>>.el-radio,
.a_add_input>>>.el-checkbox {
  margin-bottom: 10px;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
}

.redioStyle>>>.el-radio__label {
  font-size: 18px;
}

.redioStyle>>>.el-checkbox__label {
  font-size: 18px;
}

.toolHeng2 {
  width: 100%;
}

.toolHeng {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
}

.toolHeng>div {
  padding-left: 20px;
}

.isWidth {
  width: 20%;
}

.textTitle {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  width: 95%;
}

.textTitle>>>.el-form-item__label {
  font-size: 22px;
  color: #918f8f;
  width: 100px;
}

.textTitle>>>.el-form-item__content {
  width: calc(100% - 100px);
}

.textCss>>>.el-dialog {
  width: 800px !important;
  height: 400px;
  background: #fafafa;
}

.textCss>>>.el-dialog__body {
  margin: 55px 8% 0 8%;
  padding: 0 !important;
}

.textCss>>>.el-dialog__footer {
  padding-top: 38px;
}

.toolsCss>>>.el-dialog__body {
  padding: 20px;
}

.lineCss>>>.el-dialog__body {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}

.newNav {
  display: flex;
  flex-direction: row;
  align-items: baseline;
  justify-content: flex-start;
}

.navText {
  cursor: pointer;
  margin: 0px 0px 10px 5px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  /* width: 300px; */
  width: 100%;
}

.noVedio {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-content: center;
}

.noNavText {
  cursor: pointer;
  margin: 0px 0px 10px 5px;
  width: 112px;
}

.listNoVedio {
  margin: 0 0 0 30px;
  width: 97%;
}

.video-player>>>.video-js {
  height: 100%;
}

.hangVedioList {
  width: 90% !important;
  height: 150px !important;
  margin: 20px 0 0 30px;
}

.hangVedio {
  width: 100%;
  height: 170px !important;
  align-items: flex-start !important;
}

.hangHand {
  height: 150px !important;
}

.twoChild {
  width: 95%;
  margin: 10px;
  border-radius: 5px;
  background: #f2f2f2;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: flex-start;
  transition: all 0.5s;
  overflow: hidden;
  height: 0;
  background: #e7f3ff;
}

.twoChild>div:nth-child(1) {
  margin-top: 5px;
}

.navChild {
  width: 100%;
  cursor: pointer;
  margin-bottom: 10px;
  position: relative;
}

.navChild img {
  position: absolute;
  right: 11px;
  width: 15px;
  top: 50%;
  transform: translateY(-50%);
}

.navActive {
  height: auto;
}

.navTask {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  align-content: flex-start;
  height: 40px;
  justify-content: flex-start;
  padding: 0 10px;
  width: 100%;
  box-sizing: border-box;
}

.navTaskname {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  word-break: break-all;
  padding-left: 5px;
}

.openTaskActive {
  color: #4386e6;
}

.iframeName {
  margin: 5px 0;
  border-left: 4px solid #41c4a4;
  padding-left: 4px;
}

.toolTitle {
  margin: 0px 0px 20px;
  font-size: 20px;
  font-weight: 500;
  border-left: 4px solid #41c4a4;
  padding-left: 4px;
}

.cru_selectBox {
  overflow: auto;
  width: 96%;
  margin: 0 auto;
  height: calc(100% - 40px - 21px - 20px);
}

.cru_selectBox::-webkit-scrollbar,
.study_top::-webkit-scrollbar,
.textContent::-webkit-scrollbar {
  /*滚动条整体样式*/
  width: 6px;
  /*高宽分别对应横竖滚动条的尺寸*/
  height: 6px;
}

/*定义滚动条轨道 内阴影+圆角*/
.cru_selectBox::-webkit-scrollbar-track,
.study_top::-webkit-scrollbar-track,
.textContent::-webkit-scrollbar {
  border-radius: 10px;
  background-color: #b8bdc9;
}

/*定义滑块 内阴影+圆角*/
.cru_selectBox::-webkit-scrollbar-thumb,
.study_top::-webkit-scrollbar-thumb,
.textContent::-webkit-scrollbar-thumb {
  border-radius: 10px;
  -webkit-box-shadow: inset 0 0 6px rgb(96, 125, 184);
  background-color: #2c5ab3;
}

.vedioBox {
  border-radius: 20px;
  background: #fff;
  margin-bottom: 10px;
  overflow: auto;
}

.taskBox {
  margin: 15px auto 20px;
  background: #f7f7f7;
  width: 97%;
  border-radius: 10px;
}

.vedioTaskBox {
  width: 100%;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: flex-start;
  position: relative;
}

.toolBox {
  padding: 20px 60px 15px;
  display: flex;
  position: relative;
}

.btnAll {
  position: absolute;
  right: 0;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
}

.btnAllNT {
  position: fixed;
  bottom: 50px;
  right: 40px;
  z-index: 999;
  display: flex;
  flex-direction: row;
}

.btnAllNT>img {
  cursor: pointer;
  width: 80px;
}

.vedioTimeBox {
  display: flex;
  flex-direction: row;
  align-items: center;
  flex-wrap: nowrap;
  position: relative;
}

.navBox {
  background: #fff;
  height: calc(100% - 40px);
  padding: 5px 1px 0;
  overflow-y: auto;
  overflow-x: hidden;
}

.tool_work_box {
  width: 100%;
  padding: 0 30px 10px;
  box-sizing: border-box;
}

.worksBox {
  padding: 5px 0;
  border-bottom: 1px solid #eeeeee;
}

.worksBTitle {
  font-size: 20px;
  padding-bottom: 15px;
  border-bottom: 1px solid #eeeeee;
  display: flex;
  align-items: center;
}

.greenBox {
  width: 5px;
  height: 30px;
  background: #63b6fa;
  margin-right: 5px;
}

.worksDetailBox {
  display: flex;
  width: 100%;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: flex-start;
  padding: 15px 0;
}

.works {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: flex-start;
  align-content: center;
  max-width: 240px;
  width: calc(100% / 3 - 10px);
  height: auto;
  margin-right: 10px;
  margin-bottom: 10px;
  overflow: hidden;
  height: 140px;
  box-shadow: 0 0 6px 1px #dfdada;
  border-radius: 15px;
}

.workImg {
  width: 100%;
  /* height: calc(100% - 40px); */
  height: 105px;
  position: relative;
}

.workImg>img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  cursor: pointer;
}

.worksName {
  height: 40px;
  line-height: 40px;
  display: flex;
  width: 100%;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
  margin: 0 0 0 10px;
}

.worksName>div:nth-child(1) {
  width: 110px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.worksName>div:nth-child(2) {
  color: #b7b4b5;
}

.noWorksS {
  padding: 15px 0 0;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
}

.noWorksS>div {
  cursor: pointer;
}

.noWorksName,
.isWorksName {
  background: #7cbcf1;
  color: #fff;
  width: 90px;
  height: 25px;
  text-align: center;
  line-height: 25px;
  border-radius: 5px;
  margin: 10px 15px 10px 0;
  white-space: nowrap;
  overflow: hidden;
  padding: 5px;
  text-overflow: ellipsis;
}

.noWorksName.isWork {
  background: #165d96 !important;
}

.isWorksName {
  cursor: pointer;
  background: #46a1eb !important;
  width: 100px;
  height: 40px;
  line-height: 40px;
  position: relative;
}

.noWorksName:hover {
  background: #46a1eb !important;
}

.title {
  background: #1e5cc9;
  /* width: 98%; */
  height: 45px;
  color: #fff;
  line-height: 45px;
  padding-left: 20px;
  box-sizing: border-box;
}

.textBox {
  font-size: 20px;
  width: 90%;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 20px auto 0;
  max-height: 500px;
  overflow: auto;
}

.textContent {
  font-size: 18px;
  width: 95%;
  max-width: 95%;
}

.answerBg {
  background: url("../../assets/icon/answerBgNew.png") no-repeat;
  background-size: 100% 100%;
  width: 100%;
  height: 100%;
  color: #fff;
  text-align: center;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: center;
  position: relative;
  justify-content: center;
}

.answerBg>div:nth-child(1) {
  /* font-size: 22px;
  padding: 25px 0 10px; */
}

.answerContent {
  width: 215px;
  max-height: 60px;
  word-break: break-all;
  text-align: center;
  /* white-space: nowrap; */
  overflow: hidden;
  text-overflow: ellipsis;
  /* padding: 23px 0 0; */
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  display: -webkit-box;
  font-size: 15px;
  cursor: pointer;
}

.elist_input_box {
  display: flex;
  align-items: flex-start;
  flex-wrap: nowrap;
  padding: 10px 0 15px 30px;
  flex-direction: column;
}

.elist_input {
  /* width: 40%; */
  width: 100%;
}

.elist_input .elist_input_box input {
  font: inherit;
  color: currentColor;
  width: 200px;
  padding: 8px 14px;
  display: block;
  min-width: 0;
  outline: none;
  border: 1px solid rgba(0, 0, 0, 0.23);
  border-radius: 4px;
  box-sizing: border-box;
  background: #fff;
  margin: 0 20px 0 0;
}

.elist_input .elist_input_box span {
  height: 36px;
  line-height: 36px;
  color: rgb(82, 82, 82);
}

.elist_input .elist_input_box .remove {
  height: 20px;
  width: 20px;
  background-size: 100% 100%;
  background-position: unset;
  margin-left: 5px;
}

.elist_input_box>>>.el-rate {
  display: flex;
  height: 36px;
  align-items: center;
}

.elist_input_box .elist_inptu_text {
  min-height: 50px;
  /* width: 500px;
  max-height: 150px; */
  width: 100%;
  line-height: 50px;
  color: rgb(82, 82, 82);
  overflow: auto;
  text-indent: 5px;
  background: #f7f6f9;
  border-radius: 10px;
}

.elist_input_box .elist_inptu_text input {
  width: 500px;
}

.elist_input_box>>>.el-rate__icon {
  font-size: 24px;
}

.isClick {
  background: #4d9def;
}

/*定义滚动条轨道 内阴影+圆角*/
.bzTypeBox::-webkit-scrollbar {
  /*滚动条整体样式*/
  width: 6px;
  /*高宽分别对应横竖滚动条的尺寸*/
  height: 6px;
}

/*定义滚动条轨道 内阴影+圆角*/
.bzTypeBox::-webkit-scrollbar-track {
  border-radius: 10px;
  background-color: rgba(0, 0, 0, 0.1);
}

/*定义滑块 内阴影+圆角*/
.bzTypeBox::-webkit-scrollbar-thumb {
  border-radius: 10px;
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
  background-color: rgba(0, 0, 0, 0.1);
}

.choiceBox {
  display: flex;
  margin: 20px 0;
  width: 100%;
}

.bzTypeBox {
  display: flex;
  width: 100%;
  overflow: auto;
  white-space: nowrap;
}

.bzChild {
  cursor: pointer;
  box-sizing: border-box;
  padding-bottom: 10px;
  font-weight: bold;
  min-width: fit-content;
}

.bzChild.active {
  color: #3e88f4;
  border-bottom: 2px solid #2f80f3;
}

.bzChild+.bzChild {
  margin-left: 25px;
}

.bzBox {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.bzBox>div:nth-child(1) {
  width: 4px;
  height: 40px;
  background-image: linear-gradient(180deg, #2c5cbd, #a1cff4);
}

.bzBox>div:nth-child(2) {
  font-size: 23px;
  font-weight: bold;
  padding: 0px 0px 0 10px;
}

.navTitile {
  padding: 0 0px 0 15px;
  color: #fff;
  height: 40px;
  line-height: 40px;
}

.isTypeOne {
  width: 240px;
  height: 170px;
  /* border: 1px solid #f8f8f8; */
  border-radius: 10px;
  box-shadow: 0 0 6px 1px #dfdada;
}

.e_add_top {
  display: flex;
  justify-content: space-between;
  padding: 20px 20px 0 20px;
  border-radius: 3px;
  background: #fff;
}

.e_add_title2 {
  display: flex;
  align-items: center;
}

.e_add_title2 span {
  width: 40px;
}

.e_add_title {
  display: flex;
  align-items: center;
  color: #b8b8b8;
  font-size: 18px;
  position: relative;
  height: 40px;
}

.e_add_title span {
  margin-right: 10px;
}

.e_add_title .el_input {
  width: 300px;
}

.e_add_title>>>.el-input__inner {
  width: 400px;
}

.e_add_btn {}

.e_add_content {
  display: flex;
  width: 100%;
  max-width: 650px;
  height: 550px;
}

.e_add_list {
  background: #fff;
  height: 500px;
  width: 210px;
  position: relative;
  margin: 15px 5px 0 0;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
}

.e_add_list_title {
  font-size: 20px;
  width: 100%;
  box-sizing: border-box;
  padding: 15px 40px;
  text-align: center;
  border-bottom: 1px solid #eaeaea;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 57px;
  background: #f6f6f6;
}

.e_add_list_title span {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.e_add_list_title img {
  position: absolute;
  right: 15px;
  width: 25px;
  cursor: pointer;
  top: 50%;
  transform: translateY(-50%);
}

.e_add_list_body {
  height: calc(100% - 187px);
  overflow: auto;
}

.e_add_list_child {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  box-sizing: border-box;
  padding: 15px 40px;
  text-align: center;
}

.e_add_list_child span {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  cursor: pointer;
}

.e_add_list_child img {
  position: absolute;
  right: 10px;
  width: 21px;
  cursor: pointer;
  top: 50%;
  transform: translateY(-50%);
}

.e_add_list_child+.e_add_list_child {
  border-top: 1px solid #eaeaea;
}

.e_add_list_child .active {
  color: #409eff;
}

.e_add_list_btn {
  position: absolute;
  bottom: 0;
  height: 50px;
  background: rgb(120, 120, 254);
  width: 100%;
  color: #fff;
  font-size: 16px;
  text-align: center;
  line-height: 50px;
  cursor: pointer;
}

.e_add_list_detail {
  position: absolute;
  bottom: 0;
  height: 130px;
  background: rgb(120, 120, 254);
  width: 100%;
  color: #fff;
  font-size: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.e_add_list_detail textarea {
  height: 90%;
  width: 95%;
  border: none;
  resize: none;
  outline: none;
  padding: 5px;
  box-sizing: border-box;
}

.e_add_list_pbox {
  width: 100%;
  max-width: 650px;
  /* height: 600px; */
}

.e_add_list_pbox_title {
  height: 50px;
  background: #fff;
  display: flex;
  align-items: center;
  width: 100%;
  box-sizing: border-box;
  padding: 0 20px;
}

.type_title {
  font-size: 18px;
  font-weight: 700;
}

.type_content {
  font-size: 16px;
  margin-left: 30px;
}

.type_content span+span {
  margin-left: 20px;
}

.type_content span {
  cursor: pointer;
  padding-bottom: 5px;
  box-sizing: border-box;
}

.type_content .active {
  color: #409eff;
  border-bottom: 2px solid #409eff;
}

.e_add_list_pbox_content {
  height: calc(100% - 50px);
  display: flex;
  align-items: center;
  width: 100%;
  background: #fff;
}

.evaCss {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: flex-start;
}

.cru_line {
  position: absolute;
  bottom: 0px;
  transition: all 0.5s;
  left: 0px;
  width: 125px;
  margin-left: -25px;
}

.isNoMessage {
  width: 20%;
  margin: 25% auto 0;
}

.isNoMessage>img {
  width: 100%;
  height: 100%;
}

.fullStyle>>>.el-dialog__body {
  height: 100% !important;
}

.fullStyle>>>.el-dialog,
.fullStyle {
  width: 100% !important;
  max-width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
}

.full_diy>>>.el-dialog {
  margin: 0 !important;
  height: 100%;
  padding: 4px;
}

.full_diy>>>.el-dialog__body {
  height: calc(100% - 100px);
}

.full_diy2>>>.el-dialog__body {
  height: calc(100% - 50px);
  padding: 0;
}

.switchCss {
  /* width: 100%; */
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  /* justify-content: center; */
}

.isClickNav {
  color: #499eef;
}

.commentImg {
  width: 25px;
  height: 25px;
  cursor: pointer;
}

.commentImg>img {
  width: 100%;
  height: 100%;
}

.comment {
  background: #f9f9f9;
  border-radius: 0 0 15px 15px;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-end;
  height: 35px;
}

.commentList {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  align-content: center;
  /* margin-left: 15px; */
  /* margin-left: 8px; */
}

.scoreImg {
  width: 17px;
  height: 17px;
}

.studentDetail {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  /* align-items: center; */
  align-items: flex-start;
}

.tx {
  width: 50px;
}

.tx>img {
  width: 100%;
  height: 100%;
}

.nameAndTime {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: flex-start;
  margin-left: 10px;
}

.worksAnswer {
  color: #4078dd;
  margin: 10px 0;
  font-size: 16px;
  position: relative;
}

.worksAnswer>img {
  width: 500px;
  height: 300px;
  object-fit: contain;
  margin: 0 auto;
  display: block;
}

.commentTop {
  border-bottom: 1px solid #eaeaea;
  padding-bottom: 10px;
}

.commentBox {
  padding-top: 15px;
}

.pl {
  font-size: 18px;
}

.plPerson {
  width: 100%;
}

.plName {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: baseline;
  color: #78787a;
  width: 100%;
}

.deleteComment {
  cursor: pointer;
  margin-left: auto;
  color: #237ade;
}

.plContent {
  margin-top: 5px;
}

.evalCss {
  background: #fff;
  font-size: 18px;
}

.nav {
  color: #9d9d9d;
  padding: 5px 0 15px 20px;
}

.middleBox {
  padding: 5px 0 15px 20px;
}

.pfBox {
  padding-bottom: 30px;
}

.nameAndrate {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  padding-bottom: 10px;
  height: 30px;
  line-height: 30px;
}

.nameAndrate>div {
  margin-left: 10px;
  color: #000;
  height: 30px;
}

.nameAndrate>>>.el-rate__icon {
  font-size: 28px !important;
}

.pfBox>div:nth-child(2) {
  background: #f7f6f9;
  width: 400px;
  min-height: 45px;
  border-radius: 10px;
  font-size: 16px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  padding: 10px 20px;
  box-sizing: border-box;
  color: #000;
}

.bz {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: flex-start;
}

.bz>div {
  padding: 0 10px;
}

.select_box2_title {
  background: #fff;
  border-radius: 5px;
  padding: 15px 10px;
  box-sizing: border-box;
  margin-bottom: 10px;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
}

.select_box2_title>div:nth-child(2) {
  margin-left: 10px;
  color: #c4c4c4;
}

.select_box2_box {
  display: flex;
  height: 500px;
}

.select_box2_img {
  width: calc(100% - 310px);
  height: 100%;
  overflow: auto;
  background: #fff;
  border-radius: 5px;
}

.select_box2_img img {
  width: 100%;
}

.select_box2_answer {
  background: #fff;
  margin-left: 10px;
  border-radius: 5px;
  width: 300px;
  overflow: auto;
  height: 90%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding-top: 10px;
  box-sizing: border-box;
  position: relative;
}

.select_answer_title {
  padding: 0 0 15px 20px;
  color: #c4c4c4;
}

.select_box2_answer_box {
  margin: 0 0 10px 20px;
  width: 85%;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
}

.select_box2_answer_box>>>.el-input.is-disabled .el-input__inner {
  color: #000;
}

.upAnswerCss {
  position: absolute;
  bottom: 15px;
  right: 15px;
}

.upAnswerCss>>>.el-button {
  width: 95px;
  height: 35px;
  line-height: 35px;
  padding: 0;
}

.rightWidthCss {
  width: 60%;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
}

.rightAnswer {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  color: red;
  margin-bottom: 31px;
}

.rightAnswerCss {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  padding-top: 60px;
}

.blueCss {
  color: #767de1;
  margin-left: 10px;
}

.redCss {
  color: red;
}

.redioStyle>>>.el-radio__input.is-checked+.el-radio__label {
  color: rgb(0 123 255) !important;
}

.redioStyle>>>.el-checkbox__input.is-checked+.el-checkbox__label {
  color: rgb(0 123 255) !important;
}

.zuoyeYulan {
  padding-top: 15px;
  font-size: 18px;
  display: flex;
  align-items: flex-end;
}

.buttonA {
  margin-left: 10px;
  padding: 0;
}

.displayBox {
  margin-bottom: 10px;
  display: block;
  border-bottom: 3px solid #eee;
  display: flex;
  align-items: center;
}

.easy_comment {
  width: calc(100% - 90px);
  margin-left: 10px;
  display: flex;
  flex-wrap: wrap;
}

.easy_comment>div {
  border: 1px solid #4a4a4a;
  color: #666;
  border-radius: 15px;
  padding: 5px 10px;
  font-size: 16px;
  margin-bottom: 10px;
  margin-right: 5px;
  cursor: pointer;
}

.easy_comment div:hover {
  border: 1px solid #f7ba2a;
  color: #c69217;
}

.xuan_right_box {
  padding: 10px;
  background: rgb(247, 247, 247);
  margin: 10px 12px;
  border-radius: 5px;
}

.tool_right_box {
  display: flex;
  align-items: center;
}

.tool_right_box+.tool_right_box {
  margin-top: 10px;
}

.right_box_xuan {
  background: rgb(0 123 255);
  color: #fff;
  border-radius: 5px;
  padding: 5px;
  margin-left: 10px;
}

.pButton:hover {
  opacity: 1 !important;
}

.pButton {
  position: fixed;
  /* right: 5%; */
  /* bottom: 5%; */
  color: #fff;
  /* width: 50px;
  height: 50px; */
  /* border-radius: 50%; */
  text-align: center;
  /* line-height: 50px; */
  /* background-image: -webkit-linear-gradient(left, #72aaf4, #4d81d5); */
  cursor: pointer;
  z-index: 999;
  right: 0;
  top: 83px;
  width: 50px;
  height: 50px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0px 0 8px 2px #c5c5c5;
  border-radius: 5px;
}

.pzClass {
  width: calc(100% - 340px);
}

.newDialogCss {
  /* position: fixed;
  right: 5%;
  top: 50%;
  width: 340px;
  transform: translateY(-50%);
  height: 60%;
  box-shadow: 0px 0 8px 0px #555555;
  border-radius: 15px;
  z-index: 999; */
  position: fixed;
  right: 0;
  top: 70px;
  width: 340px;
  height: calc(100% - 80px);
  z-index: 999;
  background: #fff;
  border-radius: 15px;
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
  overflow: hidden;
}

.pzTop {
  color: #fff;
  background: #000;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  height: 40px;
  border-radius: 15px 15px 0 0;
}

.pzTop2 .checkbox {
  display: flex;
  align-items: center;
  padding: 15px 30px;
  flex: 0 0 auto;
  font-weight: bold;
  border-bottom: 1px solid #eee;
  justify-content: space-between;
}

.pzTop2 .check {
  text-align: center;
  cursor: pointer;
  box-sizing: border-box;
  display: flex;
}

.pzTop2 img {
  width: 25px;
  cursor: pointer;
}

.pzTop>div:nth-child(1) {
  padding-left: 10px;
}

.pzTop>div:nth-child(2) {
  width: 15px;
  height: 15px;
  padding-right: 10px;
  cursor: pointer;
}

.pzTop>div:nth-child(2)>img {
  width: 100%;
  height: 100%;
}

.pzBox,
.noPzBox {
  height: calc(100% - 60px);
  /* background: #ededed; */
  background: #fff;
  /* border-radius: 0 0 15px 15px; */
}

.noPzBox {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
}

.pzList {
  background: #f7f7f7;
  width: 90%;
  margin: 0 auto 15px;
  border-radius: 5px;
}

.pzNavTop {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  padding: 10px 10px 0 10px;
  align-items: center;
}

.pzDelete {
  cursor: pointer;
  margin-left: auto;
  font-size: 14px;
  color: #afafaf;
}

.pzNavTop>div:nth-child(1) {
  background: #3760af;
  width: 35px;
  height: 35px;
  color: #fff;
  text-align: center;
  line-height: 35px;
  border-radius: 50%;
  font-size: 14px;
}

.pzNavTop>div:nth-child(2) {
  font-size: 18px;
  color: #959595;
  margin-left: 5px;
}

.pzContent {
  padding: 10px;
  word-break: break-word;
}

.pzContent audio {
  width: 100%;
}

.pzContent audio::-webkit-media-controls-panel {
  background: #fff;
}

.pzListBox {
  padding-top: 15px;
  height: calc(100% - 60px);
  overflow: auto;
}

.addPzButton {
  position: relative;
  margin-top: 3px;
  width: 100%;
}

.addPzButton .img1 {
  position: absolute;
  top: 50%;
  right: 25px;
  transform: translateY(-50%);
  height: 100%;
  display: flex;
  align-items: center;
}

.addPzButton .img1 div {
  display: flex;
}

.addPzButton .img1 div img {
  width: 28px;
  margin-left: 10px;
  cursor: pointer;
}

.addPzButton .img1 div span {
  font-size: 14px;
  margin: 4px 0 0 3px;
  color: #afafaf;
}

.addPz {
  background: #4b79ce;
  width: 100px;
  color: #fff;
  font-size: 12px;
  height: 30px;
  margin: 0 auto;
  text-align: center;
  line-height: 30px;
  border-radius: 10px;
  cursor: pointer;
}

.addDialogCss {
  position: fixed;
  right: 37%;
  top: 50%;
  width: 600px;
  transform: translateY(-50%);
  height: 70%;
  min-height: 450px;
  box-shadow: 0px 0 8px 0px #555555;
  border-radius: 15px;
  z-index: 999;
}

.teacherPz {
  display: flex;
  flex-direction: row;
  align-items: center;
  flex-wrap: nowrap;
}

.teacherPzImg {
  width: 30px;
  height: 30px;
}

.teacherPzImg>img {
  width: 100%;
  height: 100%;
}

.addPzBox {
  height: calc(100% - 40px);
  background: #ededed;
}

.pzAudioClass {
  margin: 15px 14px;
  background: #fff;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.pzConText {
  width: 95%;
  height: 100%;
  margin: 10px auto 0;
  border: none;
  background: #fff;
  border-radius: 0px;
}

.pzConText>>>.text {
  height: calc(100% - 82px);
}

.addTextCss {
  background: #4b79ce;
  width: 80px;
  height: 30px;
  text-align: center;
  color: #fff;
  line-height: 30px;
  border-radius: 10px;
  margin: 10px auto 0;
  cursor: pointer;
}

.pzConText:focus-visible {
  border: none !important;
}

.maxWidth {
  width: 1000px;
}

.noPz {
  width: 150px;
  margin: 0 auto 20%;
}

.noPz>img {
  width: 100%;
  height: 100%;
}

.pzList .time {
  text-align: right;
  box-sizing: border-box;
  padding: 0 10px 10px 0px;
  color: #949494;
  font-size: 14px;
}

/* table 样式 */
.cont>>>table {
  border-top: 1px solid #ccc;
  border-left: 1px solid #ccc;
}

.cont>>>table td,
.cont>>>table th {
  border-bottom: 1px solid #ccc;
  border-right: 1px solid #ccc;
  padding: 15px 5px;
  max-width: 0px;
}

.cont>>>table th {
  border-bottom: 2px solid #ccc;
  text-align: center;
}

/* blockquote 样式 */
.cont>>>blockquote {
  display: block;
  border-left: 8px solid #d0e5f2;
  padding: 5px 10px;
  margin: 10px 0;
  line-height: 1.4;
  font-size: 100%;
  background-color: #f1f1f1;
}

.addPzCheck {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  padding: 10px 15px 0;
}

.addPzCheck span {
  cursor: pointer;
  padding-bottom: 5px;
  font-weight: bold;
}

.addPzCheck span+span {
  margin-left: 10px;
}

.addPzCheck .isChooseActive {
  color: #3e88f4;
  border-bottom: 2px solid #2f80f3;
}

/* code 样式 */
.cont>>>code {
  display: inline-block;
  *display: inline;
  *zoom: 1;
  background-color: #f1f1f1;
  border-radius: 3px;
  padding: 3px 5px;
  margin: 0 3px;
}

.cont>>>pre code {
  display: block;
}

/* ul ol 样式 */
.cont>>>ul,
ol {
  margin: 10px 0 10px 20px;
}

.scoreBox,
.scoreDetailBox {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  margin-top: 20px;
  font-size: 18px;
  width: 100%;
}

.scoreBox .t,
.scoreDetailBox .t {
  margin-right: 10px;
  width: 100px;
  text-align: right;
}

.scoreDetailBox {
  align-items: flex-start;
}

.scoreDetailBox>>>.el-textarea {
  width: calc(100% - 200px);
}

.scoreBox>>>.el-input {
  width: 130px;
  font-size: 38px;
}

.scoreBox>>>.el-input__inner {
  height: 60px;
}

.answerScore {
  position: absolute;
  top: 10px;
  right: 10px;
  background: #0000008f;
  border-radius: 5px;
  padding: 3px 5px;
  font-size: 14px;
  color: #fff;
  cursor: pointer;
}

.open_box .switch_box {
  width: 100%;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
}

.open_box .switch_box+.switch_box {
  margin-top: 10px;
}

.deleteImg {
  width: 25px !important;
  height: 25px !important;
  cursor: pointer;
  position: absolute;
  top: 10px;
  right: 10px;
}

.deleteImg2 {
  width: 15px !important;
  height: 15px !important;
  top: 5px;
  right: 5px;
}

.rightW {
  right: 40px;
}

.drawPBox {
  display: flex;
  flex-direction: column;
  position: relative;
}

.drawPBox span {
  font-size: 18px;
  color: #606266;
  padding-bottom: 10px;
  margin: 10px 0;
  border-bottom: 1px solid #eaeaea;
}

.drawPBox img {
  width: 500px;
  height: 300px;
  object-fit: contain;
  cursor: pointer;
  margin: 0 auto;
}

.sentenBox {
  background: #fff;
  height: 450px;
  overflow: auto;
  background-image: url("../../assets/icon/conSentences/stuBg.png");
  background-position: 102%;
  background-repeat: no-repeat;
  background-size: 60%;
}

.addSen {
  background: #409efe;
  width: 90px;
  color: #fff;
  height: 35px;
  text-align: center;
  line-height: 35px;
  border-radius: 5px;
  float: right;
  margin: 10px 20px 0 0;
  cursor: pointer;
}

.sentenTop {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  padding: 55px 0 0 20px;
  box-sizing: border-box;
}

.sentenTop>div:nth-child(2) {
  width: 300px;
  margin: 0 15px;
}

.sentenTop>div:nth-child(3) {
  background: #409efe;
  color: #fff;
  width: 65px;
  height: 35px;
  text-align: center;
  line-height: 35px;
  border-radius: 5px;
  cursor: pointer;
}

.cardList,
.cardList1 {
  padding: 10px 0 10px 0;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  box-sizing: border-box;
  border-bottom: 1px solid #f4f4f4;
  width: 98%;
  margin: 0 auto;
  min-width: 60%;
  max-width: 85%;
}

.cardList1 {
  padding: 10px 0 10px 10px !important;
  margin: 0 !important;
}

.cardBox {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  align-content: center;
}

.cardBox>div {
  margin-bottom: 10px;
}

.isCard,
.isChooseCard,
.noCard,
.isCard1 {
  width: 130px;
  height: 60px;
  text-align: center;
  line-height: 60px;
  font-size: 20px;
  cursor: pointer;
  background-image: url("../../assets/icon/conSentences/titleBorder.png");
  background-size: cover;
  transition: all 2s;
  margin-right: 20px;
}

.isCard>div,
.noCard>div,
.isCard1>div {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 75%;
  margin: 0 auto;
}

.noCard {
  background-image: none;
}

.isCard1 {
  background-image: url("../../assets/icon/conSentences/answerBorder.png");
}

.isChooseCard {
  background-image: none;
  border: 1px dashed #b9b9b9;
  border-radius: 10px;
}

.card {
  width: 130px;
  height: 60px;
}

.card>img {
  width: 100%;
  height: 100%;
}

.rightCardBox {
  margin: 10px 0 0 10px;
}

.rightCardBox>div:nth-child(1) {
  margin-bottom: 10px;
}

.cardCss {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: center;
  border-bottom: 3px solid #b4c3d3;
  padding: 0 0 5px 0;
  margin-right: 10px;
}

.cardCss>div:nth-child(2) {
  background: #5b7b9d;
  color: #fff;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  text-align: center;
  line-height: 20px;
}

.isWrong {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-content: center;
  align-items: center;
}

.answerRight {
  width: 25%;
}

.isTj {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
}

.isTj>div:nth-child(2) {
  color: #727070;
  margin-left: 10px;
}

.isTjImg {
  width: 30px;
  height: 30px;
}

.isTjImg>img {
  width: 100%;
  height: 100%;
}

.cardAnswerBox {
  font-size: 18px;
  width: 97%;
  border: 5px;
  padding: 0;
  border-radius: 5px;
  margin: 10px auto;
  word-break: break-word;
}

.w_name {
  margin-bottom: 10px;
}

.w_name span {
  font-size: 16px;
}

.w_teachert {
  width: 50px !important;
  position: absolute;
  height: auto !important;
  z-index: 10;
  right: 25px;
  top: -25px;
}

.group_workBox {}

.group_workBox+.group_workBox {
  margin-top: 20px;
}

.group_box {
  padding-bottom: 20px;
  border-bottom: 2px solid #f0f0f0;
}

.group_title {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.group_name {
  background-image: url(../../assets/icon/groupN.png);
  width: 220px;
  background-size: 100% 100%;
  height: 67px;
  padding: 0 20px 0 43px;
  box-sizing: border-box;
  line-height: 63px;
  color: #fff;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.group_work {
  width: 100%;
  padding: 0 10px;
  box-sizing: border-box;
  display: flex;
  flex-wrap: wrap;
}

.g_d_box {
  display: flex;
  flex-flow: wrap;
  justify-content: space-around;
}

.g_d_box .isChair {
  background-image: url(../../assets/avatar.png) !important;
}

.g_d_group {
  width: 500px;
  margin-bottom: 80px;
}

.g_d_group_chair {
  display: flex;
  align-items: center;
  justify-content: center;
}

.g_d_group_chair>div+div {
  margin-left: 30px;
}

.g_d_group_chair>div,
.g_d_group_chair2>div {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.g_d_group_chair>div>span:nth-child(1),
.g_d_group_chair2>div>span:nth-child(1) {
  background-image: url(../../assets/icon/chair.png);
  width: 50px;
  height: 50px;
  display: block;
  background-size: 100% 100%;
}

.g_d_group_tableBox {
  display: flex;
  align-items: center;
  justify-content: center;
}

.g_d_group_chair2 {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.g_d_group_chair2>div+div {
  margin-top: 10px;
}

.g_d_group_table {
  background-image: url(../../assets/icon/groupBg.png);
  width: 354px;
  height: 196px;
  background-size: 100% 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  color: #fff;
}

.g_d_group_table>div:nth-child(1) {
  font-size: 24px;
  margin-bottom: 5px;
}

.g_d_group_table>div:nth-child(2) div {
  cursor: pointer;
  background: #2e77bf;
  padding: 4px 10px;
  border-radius: 5px;
}

.groupBox {}

.groupContent+.groupContent {
  margin-top: 30px;
}

.groupTitle {
  font-size: 24px;
  color: rgb(80, 80, 80);
  margin-bottom: 20px;
}

.groupName {
  display: flex;
  align-items: center;
}

.groupn {
  font-size: 15px;
  margin-right: 10px;
}

.groupName+.groupName {
  margin-top: 15px;
}

.groupBtn {
  margin-left: 10px;
}

.groupContent>>>.el-input-number.is-without-controls .el-input__inner {
  text-align: left;
}

.g_d_btnBox {
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  margin-bottom: 20px;
}

.updateChair {
  position: relative;
}

.updateChairBtn {
  position: absolute;
  width: 50px;
  height: 50px;
  overflow: hidden;
  /* display: flex; */
  align-items: center;
  justify-content: center;
  background: #00000087;
  color: #fff;
  border-radius: 50px;
  display: none;
  cursor: pointer;
}

.updateChair:hover .updateChairBtn {
  display: flex;
}

.group_staic_box {
  display: flex;
  padding: 30px 40px 10px;
  flex-wrap: wrap;
}

.group_staic {
  /* width: 50%; */
  margin-bottom: 20px;
  display: flex;
  align-items: center;
}

.group_staic span:nth-child(1) {
  width: 150px;
  text-align: right;
  margin-right: 15px;
}

.group_staic span:nth-child(2) {
  background: rgb(0 123 255);
  color: #fff;
  border-radius: 5px;
  padding: 5px;
}

.codeFileBox {
  height: 300px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}

.codeFileBox img {
  width: 200px;
  margin: 0;
  height: auto;
}

.codeFileBox div {
  background: rgb(80, 142, 226);
  color: #fff;
  padding: 10px 20px;
  border-radius: 25px;
  cursor: pointer;
  margin-left: 15px;
}

.radioBox {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: flex-start;
}

.radioBox>div {
  margin: 10px 0 0 10px;
}

/* .radioBox >>> .el-radio__input,
.radioBox >>> .el-checkbox__inner {
  margin-left: 10px;
} */

.radioBox>>>.el-radio__label,
.radioBox>>>.el-checkbox__label {
  display: flex;
  align-items: center;
}

.radioBox >>> .el-radio__label > span {
  width: 100%;
  display: -webkit-box;
  overflow: hidden;
  white-space: normal !important;
  text-overflow: ellipsis;
  word-wrap: break-word;
}

.inImg {
  width: 100px;
  cursor: pointer;
}

.inImg>img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.timuImgBox {
  margin: 10px 0;
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  align-items: flex-start;
}

.timuImg {
  width: 150px;
  margin: 5px 0;
  cursor: pointer;
}

.timuImg>img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.worksTop {
  display: flex;
  flex-direction: row;
  align-items: flex-end;
}

.corOpen {
  margin: 0 0 0 10px;
  font-size: 14px;
  cursor: pointer;
  color: #505050;
}

.corOpen:hover {
  color: #499eef;
}

.navCorOpenBox {
  display: flex;
  flex-direction: row;
  align-items: center;
  background: #1e5cc9;
  justify-content: space-between;
}

.navCorOpen {
  padding-right: 15px;
  cursor: pointer;
  width: 20px;
  display: flex;
}

.navCorOpen>img {
  width: 100%;
  height: 100%;
}

.mlImg {
  width: 25px !important;
  cursor: pointer;
  margin-top: 5px;
}

.mlImg>img {
  width: 100%;
  height: 100%;
}

.navLeftCss {
  width: 100% !important;
  left: 0 !important;
}

.isContentCss {
  width: 100% !important;
}

.isAllWidth {
  width: 100% !important;
}

.toolBoxSteps {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  cursor: pointer;
  width: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.toolBoxSteps:nth-child(1)>img,
.toolBoxSteps:nth-child(2)>img {
  width: 24px;
}

.toolBoxSteps:nth-child(1) {
  left: 0;
}

.toolBoxSteps:nth-child(2) {
  right: 0;
}



.chooseWho {
  display: flex;
  width: 380px;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
  padding-bottom: 10px;
}

.chooseWho>div {
  cursor: pointer;
  padding-bottom: 10px;
  font-weight: bold;
}

.isChooseActive {
  color: #3e88f4;
  border-bottom: 2px solid #2f80f3;
}

.toolSort {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
}

.toolSort>div {
  margin-right: 45px;
}

.tools {
  width: 100%;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: flex-start;
}

.whiteBIcon {
  width: 80px;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: center;
}

.whiteBIcon>img {
  width: 100%;
  height: 100%;
}

.whiteBIcon>img {
  box-shadow: 0px 4px 8px 0px rgb(44 133 255 / 14%);
  border-radius: 15px;
}

.dia_tool_box {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}

.dia_tool_box>div {
  margin-right: 40px;
}
</style>