|
|
@@ -0,0 +1,3553 @@
|
|
|
+<template>
|
|
|
+ <div class="pb_content" style="background: unset">
|
|
|
+ <div
|
|
|
+ class="pb_content_body"
|
|
|
+ style="
|
|
|
+ background: #fff;
|
|
|
+ padding: 20px 20px 0px 20px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ border-radius: 5px;
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ class="pb_head"
|
|
|
+ style="
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <span class="sub_head">学生评价管理</span>
|
|
|
+ <!-- <span>备注：教师可以根据课程、班级条件筛选学生并查看该学生信息</span> -->
|
|
|
+ </div>
|
|
|
+ <div class="student_head">
|
|
|
+ <!-- <div class="student_search">
|
|
|
+ <div>班级筛选</div>
|
|
|
+ <el-select v-model="sClass" placeholder="请选择班级" @change="searchWork">
|
|
|
+ <el-option label="所有班级" value></el-option>
|
|
|
+ <el-option
|
|
|
+ v-for="(item, index) in grade"
|
|
|
+ :key="index"
|
|
|
+ :label="item.name"
|
|
|
+ :value="item.id"
|
|
|
+ ></el-option>
|
|
|
+ </el-select>
|
|
|
+ </div>-->
|
|
|
+ <!-- chooseDy
|
|
|
+ chooseTask-->
|
|
|
+ <div class="student_search">
|
|
|
+ <div>课程筛选</div>
|
|
|
+ <div style="display: flex; width: 90%">
|
|
|
+ <el-select
|
|
|
+ class="r_select"
|
|
|
+ v-model="uname"
|
|
|
+ placeholder="请选择课程"
|
|
|
+ @change="searchWork2"
|
|
|
+ >
|
|
|
+ <el-option label="所有课程" value></el-option>
|
|
|
+ <el-option
|
|
|
+ v-for="item in userAarray"
|
|
|
+ :key="item.courseId"
|
|
|
+ :label="item.title"
|
|
|
+ :value="item.courseId"
|
|
|
+ >
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ <el-select
|
|
|
+ v-model="chooseDy"
|
|
|
+ placeholder="请选择阶段"
|
|
|
+ @change="searchWork1"
|
|
|
+ >
|
|
|
+ <el-option label="所有阶段" value></el-option>
|
|
|
+ <el-option
|
|
|
+ v-for="(item, index) in dyList"
|
|
|
+ :key="index"
|
|
|
+ :label="item.name"
|
|
|
+ :value="item.id"
|
|
|
+ ></el-option>
|
|
|
+ </el-select>
|
|
|
+ <el-select
|
|
|
+ v-model="chooseTask"
|
|
|
+ placeholder="请选择任务"
|
|
|
+ @change="searchWork2"
|
|
|
+ >
|
|
|
+ <el-option label="所有任务" value></el-option>
|
|
|
+ <el-option
|
|
|
+ v-for="(item, index) in dyList[chooseDy]
|
|
|
+ ? dyList[chooseDy].taskList
|
|
|
+ : []"
|
|
|
+ :key="index"
|
|
|
+ :label="item.name"
|
|
|
+ :value="item.id"
|
|
|
+ ></el-option>
|
|
|
+ </el-select>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="pb_content_body">
|
|
|
+ <div class="student_table">
|
|
|
+ <el-table
|
|
|
+ ref="table"
|
|
|
+ :data="tableData"
|
|
|
+ border
|
|
|
+ :height="tableHeight"
|
|
|
+ :fit="true"
|
|
|
+ v-loading="isLoading"
|
|
|
+ style="width: 100%"
|
|
|
+ :header-cell-style="{ background: '#f1f1f1' }"
|
|
|
+ :row-class-name="tableRowClassName"
|
|
|
+ stripe
|
|
|
+ >
|
|
|
+ <el-table-column
|
|
|
+ prop="sName"
|
|
|
+ label="姓名"
|
|
|
+ min-width="15"
|
|
|
+ align="center"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="class"
|
|
|
+ label="班级"
|
|
|
+ min-width="20"
|
|
|
+ align="center"
|
|
|
+ >
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div>{{ scope.row.class ? scope.row.class : "暂无班级" }}</div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="course"
|
|
|
+ label="课程"
|
|
|
+ min-width="20"
|
|
|
+ align="center"
|
|
|
+ show-overflow-tooltip
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="course"
|
|
|
+ label="阶段"
|
|
|
+ min-width="20"
|
|
|
+ align="center"
|
|
|
+ show-overflow-tooltip
|
|
|
+ >
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div>
|
|
|
+ {{ dyList.length > 0 ? dyList[scope.row.stage].name : "" }}
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="course"
|
|
|
+ label="任务"
|
|
|
+ min-width="20"
|
|
|
+ align="center"
|
|
|
+ show-overflow-tooltip
|
|
|
+ >
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div>
|
|
|
+ {{
|
|
|
+ dyList.length > 0
|
|
|
+ ? dyList[scope.row.stage].taskList[scope.row.task]
|
|
|
+ ? dyList[scope.row.stage].taskList[scope.row.task].name
|
|
|
+ : ""
|
|
|
+ : ""
|
|
|
+ }}
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="time"
|
|
|
+ label="时间"
|
|
|
+ width="100px"
|
|
|
+ align="center"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column label="操作" width="300px">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ size="small"
|
|
|
+ @click="
|
|
|
+ lookWork(scope.row.id, scope.row.userid, scope.row.courseid)
|
|
|
+ "
|
|
|
+ >查看作业</el-button
|
|
|
+ >
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ size="small"
|
|
|
+ @click="getReport(scope.row)"
|
|
|
+ >查看报告</el-button
|
|
|
+ >
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ size="small"
|
|
|
+ @click="lookWork2(scope.row.id, scope.row.userid, scope.row.courseid)"
|
|
|
+ >导出报告</el-button
|
|
|
+ >
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <el-dialog
|
|
|
+ title="查看作业"
|
|
|
+ :visible.sync="dialogVisible3"
|
|
|
+ :append-to-body="true"
|
|
|
+ :before-close="handleClose"
|
|
|
+ width="100%"
|
|
|
+ class="dialog_diy2 max_diy"
|
|
|
+ :class="{ fullStyle: full }"
|
|
|
+ >
|
|
|
+ <div slot="title" class="header-title">
|
|
|
+ <div style="color: #fff">查看作业</div>
|
|
|
+ <div style="position: absolute; top: 14px; right: 50px">
|
|
|
+ <img
|
|
|
+ src="../../../assets/full.png"
|
|
|
+ style="height: 14px; cursor: pointer"
|
|
|
+ alt=""
|
|
|
+ @click="fullTools"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="zyBoxC">
|
|
|
+ <div class="courseTitle" v-if="allWorks.course">
|
|
|
+ <div class="txName">
|
|
|
+ <div class="tx"><img :src="tx" alt="" /></div>
|
|
|
+ <div>{{ allWorks.sName }}</div>
|
|
|
+ <div>{{ allWorks.course }}</div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="topButton" v-if="tableData.length > 1">
|
|
|
+ <div>学生切换：</div>
|
|
|
+ <el-button @click="preStep(0)" v-if="isPre == false"
|
|
|
+ >上一位</el-button
|
|
|
+ >
|
|
|
+ <el-button @click="nextStep(0)" v-if="isNext == false"
|
|
|
+ >下一位</el-button
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="cBox">
|
|
|
+ <div class="pb_left">
|
|
|
+ <el-tooltip
|
|
|
+ class="cTitle"
|
|
|
+ effect="light"
|
|
|
+ :content="allWorks.course"
|
|
|
+ placement="top"
|
|
|
+ >
|
|
|
+ <div>{{ allWorks.course }}</div>
|
|
|
+ </el-tooltip>
|
|
|
+ <div class="ml">目录</div>
|
|
|
+ <div class="cru_selectBox">
|
|
|
+ <div v-for="(dy, dyIndex) in dyList2" :key="dyIndex">
|
|
|
+ <div class="blue_box_one" @click="isOpen(dyIndex)">
|
|
|
+ <div>第{{ dy.id + 1 }}阶段</div>
|
|
|
+ <div>{{ dy.name }}</div>
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ class="twoChild"
|
|
|
+ :class="{
|
|
|
+ navActive: dy.isOpen,
|
|
|
+ }"
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ class="navChild"
|
|
|
+ v-for="(nav, navIndex) in dy.taskList"
|
|
|
+ :key="navIndex"
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ class="navTask"
|
|
|
+ @click="openTask(dy.id, nav.id)"
|
|
|
+ :class="{
|
|
|
+ openTaskActive:
|
|
|
+ nav.id == taskCount &&
|
|
|
+ dy.id + '-' + nav.id == navId &&
|
|
|
+ dy.id == stageIndex,
|
|
|
+ }"
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ class="vedioNav"
|
|
|
+ :class="{
|
|
|
+ isClick:
|
|
|
+ nav.id == taskCount &&
|
|
|
+ dy.id + '-' + nav.id == navId &&
|
|
|
+ dy.id == stageIndex,
|
|
|
+ }"
|
|
|
+ style="margin: 0"
|
|
|
+ >
|
|
|
+ 任务{{ navIndex + 1 }}
|
|
|
+ </div>
|
|
|
+ <el-tooltip
|
|
|
+ class="navTaskname item"
|
|
|
+ effect="light"
|
|
|
+ :content="nav.name"
|
|
|
+ placement="top"
|
|
|
+ >
|
|
|
+ <div>{{ nav.name }}</div>
|
|
|
+ </el-tooltip>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ class="shuBox"
|
|
|
+ v-if="worksDetail.length"
|
|
|
+ :class="{ fullBox: full }"
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ class="allBox"
|
|
|
+ v-for="(sin, sIndex) in sInfo"
|
|
|
+ :key="sIndex"
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ class="zyBox"
|
|
|
+ v-if="sin.course"
|
|
|
+ :class="{ fullZyBox: full }"
|
|
|
+ >
|
|
|
+ <div class="top">
|
|
|
+ <div class="jdName">
|
|
|
+ <div>
|
|
|
+ {{
|
|
|
+ "第" +
|
|
|
+ (sin.stage + 1) +
|
|
|
+ "阶段 " +
|
|
|
+ dyList[sin.stage].name
|
|
|
+ }}
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ class="taskName"
|
|
|
+ style="width: 100%; justify-content: space-between"
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ class="taskName"
|
|
|
+ :id="sin.stage + '-' + sin.task"
|
|
|
+ :scrollindex="sIndex"
|
|
|
+ >
|
|
|
+ <div class="task">任务{{ sin.task + 1 }}</div>
|
|
|
+ <div>
|
|
|
+ {{ dyList[sin.stage].taskList[sin.task].name }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div v-if="worksDetail[sIndex].wpptInfo.length > 0">
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ size="small"
|
|
|
+ @click="openFile(worksDetail[sIndex].wpptInfo[0])"
|
|
|
+ >
|
|
|
+ 查看文档</el-button
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="contentBox">
|
|
|
+ <div
|
|
|
+ class="left_top"
|
|
|
+ :style="{
|
|
|
+ width: worksDetail[sIndex].eList.length
|
|
|
+ ? '45%'
|
|
|
+ : '95%',
|
|
|
+ }"
|
|
|
+ v-if="worksDetail[sIndex].img.length > 0"
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ class="bigImg"
|
|
|
+ v-if="
|
|
|
+ worksDetail[sIndex].img &&
|
|
|
+ worksDetail[sIndex].img.length
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <img
|
|
|
+ @click="
|
|
|
+ previewImg(
|
|
|
+ worksDetail[sIndex].img[
|
|
|
+ worksDetail[sIndex].imgIndex
|
|
|
+ ].src
|
|
|
+ )
|
|
|
+ "
|
|
|
+ :src="
|
|
|
+ worksDetail[sIndex].img[
|
|
|
+ worksDetail[sIndex].imgIndex
|
|
|
+ ].src
|
|
|
+ "
|
|
|
+ alt
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ class="thumbnail"
|
|
|
+ v-if="
|
|
|
+ worksDetail[sIndex].img &&
|
|
|
+ worksDetail[sIndex].img.length
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ v-for="(item, index) in worksDetail[sIndex].img"
|
|
|
+ :key="index"
|
|
|
+ :class="
|
|
|
+ worksDetail[sIndex].imgIndex == index
|
|
|
+ ? 'isClick'
|
|
|
+ : ''
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <img
|
|
|
+ :src="item.src"
|
|
|
+ alt
|
|
|
+ @click="worksDetail[sIndex].imgIndex = index"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="work_nopicture" v-else>暂无上传截图</div>
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ class="left_top"
|
|
|
+ :style="{
|
|
|
+ width: worksDetail[sIndex].eList.length
|
|
|
+ ? '45%'
|
|
|
+ : '95%',
|
|
|
+ }"
|
|
|
+ v-else-if="worksDetail[sIndex].answerInfo.length > 0"
|
|
|
+ >
|
|
|
+ <div class="answerbox">
|
|
|
+ <div style="min-width: 80px">问答标题</div>
|
|
|
+ <div>
|
|
|
+ {{ worksDetail[sIndex].answerInfo[0].answerTitle }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="answerbox1">
|
|
|
+ <div>学生回答</div>
|
|
|
+ <div>
|
|
|
+ {{ worksDetail[sIndex].answerInfo[0].answer }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ class="left_top"
|
|
|
+ :style="{
|
|
|
+ width: worksDetail[sIndex].eList.length
|
|
|
+ ? '45%'
|
|
|
+ : '95%',
|
|
|
+ }"
|
|
|
+ v-else-if="worksDetail[sIndex].askInfo.length > 0"
|
|
|
+ >
|
|
|
+ <div>
|
|
|
+ <div
|
|
|
+ class="a_add_title"
|
|
|
+ style="
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <div style="margin-right: 20px; font-size: 20px">
|
|
|
+ 标题:
|
|
|
+ </div>
|
|
|
+ <div style="font-size: 20px">
|
|
|
+ {{ worksDetail[sIndex].askInfo[0].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 worksDetail[sIndex]
|
|
|
+ .askInfo[0].askCount"
|
|
|
+ :key="index1"
|
|
|
+ >
|
|
|
+ <div class="a_add_head">
|
|
|
+ <div style="display: flex">
|
|
|
+ {{ index1 + 1 + "、" }}
|
|
|
+ <div>
|
|
|
+ 题目：{{
|
|
|
+ worksDetail[sIndex].askInfo[0].askJson[
|
|
|
+ index1
|
|
|
+ ].askstitle
|
|
|
+ }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="a_add_body">
|
|
|
+ <div class="a_add_input">
|
|
|
+ <el-radio-group
|
|
|
+ v-model="
|
|
|
+ worksDetail[sIndex].askInfo[0].radio[
|
|
|
+ index1
|
|
|
+ ]
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <el-radio
|
|
|
+ v-for="(item2, checkIndex) in worksDetail[
|
|
|
+ sIndex
|
|
|
+ ].askInfo[0].askJson[index1].checkList"
|
|
|
+ :key="checkIndex"
|
|
|
+ :label="checkIndex"
|
|
|
+ disabled
|
|
|
+ class="redioStyle"
|
|
|
+ ><span v-html="item2"></span
|
|
|
+ ></el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ class="left_top"
|
|
|
+ :style="{
|
|
|
+ width: '95%',
|
|
|
+ }"
|
|
|
+ v-else-if="worksDetail[sIndex].chooseInfo.length > 0"
|
|
|
+ >
|
|
|
+ <div>
|
|
|
+ <div class="a_addBox">
|
|
|
+ <div style="font-size: 16px; color: #c7c7c7">
|
|
|
+ 题目内容
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ class="a_add_box"
|
|
|
+ v-for="(item1, index1) in worksDetail[sIndex]
|
|
|
+ .chooseInfo[0].testCount"
|
|
|
+ :key="index1"
|
|
|
+ >
|
|
|
+ <div class="a_add_head">
|
|
|
+ <div style="display: flex">
|
|
|
+ {{ index1 + 1 + "、" }}
|
|
|
+ <div>
|
|
|
+ 题目：{{
|
|
|
+ worksDetail[sIndex].chooseInfo[0]
|
|
|
+ .testJson[index1].teststitle
|
|
|
+ }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <img
|
|
|
+ v-if="
|
|
|
+ worksDetail[sIndex].chooseInfo[0].testJson[
|
|
|
+ index1
|
|
|
+ ].img
|
|
|
+ "
|
|
|
+ :src="
|
|
|
+ worksDetail[sIndex].chooseInfo[0].testJson[
|
|
|
+ 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="
|
|
|
+ worksDetail[sIndex].chooseInfo[0].radio[
|
|
|
+ index1
|
|
|
+ ]
|
|
|
+ "
|
|
|
+ v-if="
|
|
|
+ worksDetail[sIndex].chooseInfo[0]
|
|
|
+ .testJson[index1].type == '1'
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <div class="radioBox">
|
|
|
+ <el-radio
|
|
|
+ v-for="(
|
|
|
+ item2, checkIndex
|
|
|
+ ) in worksDetail[sIndex].chooseInfo[0]
|
|
|
+ .testJson[index1].checkList"
|
|
|
+ :key="checkIndex"
|
|
|
+ :label="checkIndex"
|
|
|
+ disabled
|
|
|
+ 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="
|
|
|
+ worksDetail[sIndex].chooseInfo[0].radio[
|
|
|
+ index1
|
|
|
+ ]
|
|
|
+ "
|
|
|
+ v-if="
|
|
|
+ worksDetail[sIndex].chooseInfo[0]
|
|
|
+ .testJson[index1].type == '2'
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <div class="radioBox">
|
|
|
+ <el-checkbox
|
|
|
+ v-for="(
|
|
|
+ item2, checkIndex
|
|
|
+ ) in worksDetail[sIndex].chooseInfo[0]
|
|
|
+ .testJson[index1].checkList"
|
|
|
+ :key="checkIndex"
|
|
|
+ :label="checkIndex"
|
|
|
+ disabled
|
|
|
+ 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>
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ class="left_top"
|
|
|
+ :style="{
|
|
|
+ width: worksDetail[sIndex].eList.length
|
|
|
+ ? '45%'
|
|
|
+ : '95%',
|
|
|
+ }"
|
|
|
+ v-else-if="worksDetail[sIndex].wpptInfo.length > 0"
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ style="height: 238px"
|
|
|
+ @click="openFile(worksDetail[sIndex].wpptInfo[0])"
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ @click="openFile(worksDetail[sIndex].wpptInfo[0])"
|
|
|
+ style="
|
|
|
+ width: 300px;
|
|
|
+ height: 300px;
|
|
|
+ position: absolute;
|
|
|
+ z-index: 999;
|
|
|
+ "
|
|
|
+ ></div>
|
|
|
+ <pdf
|
|
|
+ v-if="showPDF"
|
|
|
+ :pdfUrl="worksDetail[sIndex].wpptInfo[0]"
|
|
|
+ style="width: 100%; height: 520px; overflow: auto"
|
|
|
+ ></pdf>
|
|
|
+ <iframe
|
|
|
+ v-else
|
|
|
+ :src="worksDetail[sIndex].wpptInfo[0]"
|
|
|
+ frameborder="0"
|
|
|
+ width="100%"
|
|
|
+ height="100%"
|
|
|
+ ></iframe>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ class="right_top"
|
|
|
+ v-show="
|
|
|
+ worksDetail[sIndex].eList.length &&
|
|
|
+ (worksDetail[sIndex].img.length > 0 ||
|
|
|
+ worksDetail[sIndex].askInfo.length > 0 ||
|
|
|
+ worksDetail[sIndex].answerInfo.length > 0 ||
|
|
|
+ worksDetail[sIndex].wpptInfo.length > 0)
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <div class="ech">
|
|
|
+ <img src="../../../assets/icon/pj/ech.png" alt="" />
|
|
|
+ </div>
|
|
|
+ <div class="data_body">
|
|
|
+ <div style="width: 100%">
|
|
|
+ <div
|
|
|
+ class="echart charts_canvas"
|
|
|
+ style="
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ margin: 0 0 0 1rem;
|
|
|
+ "
|
|
|
+ ></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="right_score" :class="{ rightScoreFullBox: full }">
|
|
|
+ <!-- <div
|
|
|
+ v-if="
|
|
|
+ tType &&
|
|
|
+ ((tType == 2 && sIsOpen == true) ||
|
|
|
+ tType == 1 ||
|
|
|
+ tType == 4) &&
|
|
|
+ tool.tool.indexOf(45) != -1 &&
|
|
|
+ (tool.testJson.testJson[0].answer ||
|
|
|
+ tool.testJson.testJson[0].answer === 0) &&
|
|
|
+ checkJson[toolIndex].length
|
|
|
+ "
|
|
|
+ class="xuan_right_box"
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ class="tool_right_box"
|
|
|
+ v-for="(item, index) in tool.testJson.testJson"
|
|
|
+ :key="index"
|
|
|
+ >
|
|
|
+ <div>
|
|
|
+ <span>{{ index + 1 + "、" + item.teststitle }}</span>
|
|
|
+ </div>
|
|
|
+ <div class="right_box_xuan">
|
|
|
+ <span>正确率</span>
|
|
|
+ <span>{{
|
|
|
+ (checkJson[toolIndex][index].right
|
|
|
+ ? checkJson[toolIndex][index].right
|
|
|
+ : 0) + "%"
|
|
|
+ }}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ class="xuan_right_box"
|
|
|
+ style="background: unset"
|
|
|
+ v-if="
|
|
|
+ tType &&
|
|
|
+ ((tType == 2 && sIsOpen == true) ||
|
|
|
+ tType == 1 ||
|
|
|
+ tType == 4) &&
|
|
|
+ tool.tool.indexOf(45) != -1
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <AskStatic2
|
|
|
+ v-if="
|
|
|
+ worksStudent.length &&
|
|
|
+ worksStudent[toolIndex].length > 0
|
|
|
+ "
|
|
|
+ :askJSON="tool"
|
|
|
+ :checkJson="checkJson[toolIndex]"
|
|
|
+ ></AskStatic2>
|
|
|
+ </div> -->
|
|
|
+ <div
|
|
|
+ class="sd_score"
|
|
|
+ style="
|
|
|
+ box-sizing: border-box;
|
|
|
+ width: 100%;
|
|
|
+ box-shadow: none;
|
|
|
+ position: relative;
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <div class="worksTime">
|
|
|
+ 作业提交时间：<span style="width: auto"
|
|
|
+ >{{ worksDetail[sIndex].time }}
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ v-if="
|
|
|
+ worksDetail[sIndex].img.length == 0 &&
|
|
|
+ worksDetail[sIndex].askInfo.length == 0 &&
|
|
|
+ worksDetail[sIndex].answerInfo.length == 0 &&
|
|
|
+ worksDetail[sIndex].wpptInfo.length == 0 &&
|
|
|
+ worksDetail[sIndex].chooseInfo.length > 0
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ style="
|
|
|
+ font-size: 16px;
|
|
|
+ color: #c7c7c7;
|
|
|
+ margin-left: 15px;
|
|
|
+ "
|
|
|
+ >
|
|
|
+ 题目统计
|
|
|
+ </div>
|
|
|
+ <div class="xuan_right_box">
|
|
|
+ <div
|
|
|
+ class="tool_right_box"
|
|
|
+ v-for="(tItem, tIndex) in worksDetail[sIndex]
|
|
|
+ .chooseInfo[0].testJson"
|
|
|
+ :key="tIndex"
|
|
|
+ >
|
|
|
+ <div>
|
|
|
+ <span>{{
|
|
|
+ tIndex + 1 + "、" + tItem.teststitle
|
|
|
+ }}</span>
|
|
|
+ </div>
|
|
|
+ <div class="right_box_xuan">
|
|
|
+ <span>正确率</span>
|
|
|
+ <span>{{
|
|
|
+ (checkJson[sIndex][tIndex].right
|
|
|
+ ? checkJson[sIndex][tIndex].right
|
|
|
+ : 0) + "%"
|
|
|
+ }}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="allRightBox">
|
|
|
+ <span>全部道题的正确率：</span
|
|
|
+ ><span>{{ checkJson[sIndex].allRight + "%" }}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div v-else>
|
|
|
+ <div class="ech" style="margin-left: 23px">
|
|
|
+ <img src="../../../assets/icon/pj/score.png" alt="" />
|
|
|
+ </div>
|
|
|
+ <div style="height: 80%; overflow: auto">
|
|
|
+ <div
|
|
|
+ class="score_box"
|
|
|
+ v-for="(item, index) in worksDetail[sIndex].eList"
|
|
|
+ :key="index"
|
|
|
+ >
|
|
|
+ <el-tooltip
|
|
|
+ class="item"
|
|
|
+ effect="dark"
|
|
|
+ :content="item.value"
|
|
|
+ placement="top-start"
|
|
|
+ >
|
|
|
+ <span>{{ item.value }}</span>
|
|
|
+ </el-tooltip>
|
|
|
+ <el-rate
|
|
|
+ class="rate_size"
|
|
|
+ style="min-width: 120px"
|
|
|
+ v-model="worksDetail[sIndex].rateList[item.value]"
|
|
|
+ @change="getStar(sIndex)"
|
|
|
+ ></el-rate>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="buttonCss">
|
|
|
+ <el-button type="primary" size="small" @click="updatePj"
|
|
|
+ >保存评分</el-button
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+ <div class="student_page">
|
|
|
+ <el-pagination
|
|
|
+ background
|
|
|
+ layout="prev, pager, next"
|
|
|
+ :page-size="10"
|
|
|
+ :total="total"
|
|
|
+ v-if="page"
|
|
|
+ @current-change="handleCurrentChange"
|
|
|
+ ></el-pagination>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <el-dialog :visible.sync="pictureDialog" size="tiny">
|
|
|
+ <img width="100%" :src="dialogImageUrl" alt />
|
|
|
+ </el-dialog>
|
|
|
+ <el-dialog
|
|
|
+ title="课程评分"
|
|
|
+ :visible.sync="dataVisible"
|
|
|
+ :append-to-body="true"
|
|
|
+ width="1100px"
|
|
|
+ :before-close="handleClose"
|
|
|
+ class="dialog_diy"
|
|
|
+ >
|
|
|
+ <div>
|
|
|
+ <div class="a_addBox2">
|
|
|
+ <StudentData :studentInfo="studentInfo"></StudentData>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <span slot="footer" class="dialog-footer">
|
|
|
+ <el-button @click="dataVisible = false">关 闭</el-button>
|
|
|
+ </span>
|
|
|
+ </el-dialog>
|
|
|
+ <el-dialog
|
|
|
+ title="查看选择题"
|
|
|
+ :visible.sync="dialogVisible4"
|
|
|
+ :append-to-body="true"
|
|
|
+ width="800px"
|
|
|
+ :before-close="handleClose"
|
|
|
+ class="dialog_diy"
|
|
|
+ >
|
|
|
+ <div>
|
|
|
+ <div
|
|
|
+ class="a_add_title"
|
|
|
+ style="
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <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="(item, index) in askJson.askJson"
|
|
|
+ :key="index"
|
|
|
+ >
|
|
|
+ <div class="a_add_head">
|
|
|
+ <div style="display: flex">
|
|
|
+ {{ index + 1 + "、" }}
|
|
|
+ <div>题目：{{ item.askstitle }}</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="a_add_body">
|
|
|
+ <div class="a_add_input">
|
|
|
+ <el-radio-group v-model="askJson.radio[index]">
|
|
|
+ <el-radio
|
|
|
+ v-for="(item3, checkIndex1) in item.checkList"
|
|
|
+ :key="checkIndex1"
|
|
|
+ :label="checkIndex1"
|
|
|
+ class="redioStyle"
|
|
|
+ disabled
|
|
|
+ >{{ item3 }}</el-radio
|
|
|
+ >
|
|
|
+ </el-radio-group>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <span slot="footer" class="dialog-footer">
|
|
|
+ <el-button type="primary" @click="dialogVisible4 = false"
|
|
|
+ >关 闭</el-button
|
|
|
+ >
|
|
|
+ </span>
|
|
|
+ </el-dialog>
|
|
|
+ <el-dialog
|
|
|
+ title="文件预览"
|
|
|
+ :visible.sync="dialogVisible6"
|
|
|
+ width="100%"
|
|
|
+ :before-close="handleClose"
|
|
|
+ class="full_diy"
|
|
|
+ :append-to-body="true"
|
|
|
+ >
|
|
|
+ <div slot="title" class="header-title">
|
|
|
+ <div style="color: #fff">文件预览</div>
|
|
|
+ </div>
|
|
|
+ <pdf
|
|
|
+ v-if="showPDF"
|
|
|
+ :pdfUrl="pptImgUrl"
|
|
|
+ style="width: 100%; height: 520px; overflow: auto"
|
|
|
+ ></pdf>
|
|
|
+ <iframe
|
|
|
+ v-else
|
|
|
+ :src="pptImgUrl"
|
|
|
+ frameborder="0"
|
|
|
+ width="100%"
|
|
|
+ height="600"
|
|
|
+ ></iframe>
|
|
|
+ </el-dialog>
|
|
|
+ <div class="report_box" v-if="reportVisible">
|
|
|
+ <studentReport
|
|
|
+ :checkCourse="checkCourse"
|
|
|
+ :checkStudent="checkStudent"
|
|
|
+ :oid="oid"
|
|
|
+ ></studentReport>
|
|
|
+ </div>
|
|
|
+ <div class="cancelbox" v-if="reportVisible">
|
|
|
+ <el-button @click="cancelR" type="primary" size="small">返回</el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import StudentData from "./studentData";
|
|
|
+import studentReport from "./studentReport.vue";
|
|
|
+import htmlDocx from "html-docx-js/dist/html-docx";
|
|
|
+import saveAs from "file-saver";
|
|
|
+export default {
|
|
|
+ components: {
|
|
|
+ StudentData,
|
|
|
+ studentReport,
|
|
|
+ },
|
|
|
+ props: ["uid", "ooid", "oorg"],
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ tableHeight: "500px",
|
|
|
+ isLoading: false,
|
|
|
+ id: this.cid,
|
|
|
+ userid: this.uid,
|
|
|
+ oid: this.ooid,
|
|
|
+ org: this.oorg,
|
|
|
+ formLabelWidth: "100px",
|
|
|
+ dialogImageUrl: "",
|
|
|
+ pictureDialog: false,
|
|
|
+ dialogVisible: false,
|
|
|
+ dialogVisible1: false,
|
|
|
+ dialogVisible2: false,
|
|
|
+ dialogVisible3: false,
|
|
|
+ dialogVisible4: false,
|
|
|
+ dataVisible: false,
|
|
|
+ checkCourse: "",
|
|
|
+ checkStudent: "",
|
|
|
+ reportVisible: false,
|
|
|
+ full: true,
|
|
|
+ isStar: 0,
|
|
|
+ studentInfo: {},
|
|
|
+ courseByUser: "诗词中的植物",
|
|
|
+ userName: "林点",
|
|
|
+ answerName: "宿赞公房",
|
|
|
+ studentAnswer: "雨荒深院菊,霜倒半池莲.唐杜甫《宿赞公房》",
|
|
|
+ commentCount: 0,
|
|
|
+ publicIndex: 0,
|
|
|
+ allWorks: [],
|
|
|
+ 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, //全屏按钮
|
|
|
+ },
|
|
|
+ },
|
|
|
+ playerO: {},
|
|
|
+ commentName: "谭子松",
|
|
|
+ commentTime: "2021/2/5",
|
|
|
+ commentAnswer:
|
|
|
+ "作为家长我很高兴看到孩子的进步，希望这个进步只是一个开始，在新学期能够继续延续，这样才能不负老师的期望",
|
|
|
+ tableData: [],
|
|
|
+ uploadBoolean: false,
|
|
|
+ studentMessage: [],
|
|
|
+ subject: "",
|
|
|
+ sClass: "",
|
|
|
+ stageIndex: "",
|
|
|
+ taskCount: "",
|
|
|
+ navId: "",
|
|
|
+ chooseDy: "",
|
|
|
+ uname: "",
|
|
|
+ chooseTask: "",
|
|
|
+ pptImgUrl: "",
|
|
|
+ grade: [],
|
|
|
+ mr: require("../../../assets/icon/wheel.png"),
|
|
|
+ tx: require("../../../assets/avatar.png"),
|
|
|
+ projectchoose: "",
|
|
|
+ scopeId: "",
|
|
|
+ scopeId1: "",
|
|
|
+ thumbnail: [],
|
|
|
+ rateList: {
|
|
|
+ ca: 0,
|
|
|
+ sia: 0,
|
|
|
+ eta: 0,
|
|
|
+ pia: 0,
|
|
|
+ lra: 0,
|
|
|
+ content: "",
|
|
|
+ },
|
|
|
+ rateParams: [],
|
|
|
+ page: 1,
|
|
|
+ total: 0,
|
|
|
+ worksDetail: [],
|
|
|
+ suserId: "",
|
|
|
+ sInfo: {},
|
|
|
+ chapInfo: [],
|
|
|
+ showPDF: false,
|
|
|
+ dialogVisible6: false,
|
|
|
+ vedio: [],
|
|
|
+ file: [],
|
|
|
+ tType: 0,
|
|
|
+ chartObj: [],
|
|
|
+ pptImgUrl: "",
|
|
|
+ ooption: [],
|
|
|
+ option: {
|
|
|
+ tooltip: {
|
|
|
+ trigger: "item",
|
|
|
+ },
|
|
|
+ series: [
|
|
|
+ {
|
|
|
+ name: "量规评分",
|
|
|
+ type: "pie",
|
|
|
+ radius: "70%",
|
|
|
+ center: ["50%", "50%"],
|
|
|
+ data: [
|
|
|
+ { value: 0, name: "意识能力" },
|
|
|
+ { value: 0, name: "科学探究能力" },
|
|
|
+ { value: 0, name: "实践创新能力" },
|
|
|
+ { value: 0, name: "学习反思能力" },
|
|
|
+ { value: 0, name: "工程思维能力" },
|
|
|
+ ],
|
|
|
+ itemStyle: {
|
|
|
+ emphasis: {
|
|
|
+ shadowBlur: 10,
|
|
|
+ shadowOffsetX: 0,
|
|
|
+ shadowColor: "rgba(0, 0, 0, 0.5)",
|
|
|
+ },
|
|
|
+ normal: {
|
|
|
+ label: {
|
|
|
+ show: true,
|
|
|
+ formatter: "{d}%",
|
|
|
+ inside: true,
|
|
|
+ position: "inner",
|
|
|
+ },
|
|
|
+ labelLine: { show: false },
|
|
|
+ },
|
|
|
+ },
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ // 雷达图的数据
|
|
|
+ radarOption: {
|
|
|
+ splitNumber: 5,
|
|
|
+ tooltip: {
|
|
|
+ triggerOn: "mousemove",
|
|
|
+ //雷达图的tooltip不会超出div，也可以设置position属性，position定位的tooltip 不会随着鼠标移动而位置变化，不友好
|
|
|
+ confine: true,
|
|
|
+ enterable: true, //鼠标是否可以移动到tooltip区域内
|
|
|
+ backgroundColor: "rgba(255,255,255,0.7)",
|
|
|
+ textStyle: {
|
|
|
+ // 文字样式
|
|
|
+ align: "left",
|
|
|
+ },
|
|
|
+ left: "right",
|
|
|
+ top: "bottom",
|
|
|
+ },
|
|
|
+ radar: {
|
|
|
+ radius: ["0%", "70%"],
|
|
|
+ shape: "circle",
|
|
|
+ center: ["50%", "50%"],
|
|
|
+ axisName: {
|
|
|
+ textStyle: {
|
|
|
+ // 文字样式
|
|
|
+ color: "#58a5e6",
|
|
|
+ },
|
|
|
+ formatter: function (value, indicator) {
|
|
|
+ // value = value.replace(/\S{2}/g, function (match) {
|
|
|
+ // return match + "\n";
|
|
|
+ // });
|
|
|
+ return value;
|
|
|
+ },
|
|
|
+ },
|
|
|
+ indicator: [
|
|
|
+ // 雷达图的指示器，用来指定雷达图中的多个变量（维度）
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ // 雷达图背景的颜色，在这儿随便设置了一个颜色，完全不透明度为0，就实现了透明背景
|
|
|
+ splitArea: {
|
|
|
+ show: true,
|
|
|
+ areaStyle: {
|
|
|
+ color: "rgba(255,0,0,0)", // 图表背景的颜色
|
|
|
+ },
|
|
|
+ },
|
|
|
+ splitLine: {
|
|
|
+ show: true,
|
|
|
+ lineStyle: {
|
|
|
+ width: 1,
|
|
|
+ color: "rgba(131,141,158,.1)", // 设置网格的颜色
|
|
|
+ },
|
|
|
+ },
|
|
|
+ series: [
|
|
|
+ {
|
|
|
+ name: "能力图", // tooltip中的标题
|
|
|
+ type: "radar", // 表示是雷达图
|
|
|
+ symbol: "circle", // 拐点的样式，还可以取值'rect','angle'等
|
|
|
+ symbolSize: 8, // 拐点的大小
|
|
|
+ areaStyle: {
|
|
|
+ normal: {
|
|
|
+ width: 1,
|
|
|
+ opacity: 0.2,
|
|
|
+ },
|
|
|
+ },
|
|
|
+ data: [
|
|
|
+ {
|
|
|
+ // 设置各个指标原始值
|
|
|
+ value: [],
|
|
|
+ // 设置区域边框和区域的颜色
|
|
|
+ itemStyle: {
|
|
|
+ normal: {
|
|
|
+ color: "#58a5e6",
|
|
|
+ lineStyle: {
|
|
|
+ color: "#58a5e6",
|
|
|
+ },
|
|
|
+ },
|
|
|
+ },
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ askJson: {},
|
|
|
+ dyList: [],
|
|
|
+ dyList2: [],
|
|
|
+ userAarray: [],
|
|
|
+ isPre: false,
|
|
|
+ isNext: false,
|
|
|
+ checkJson: [],
|
|
|
+ };
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.$nextTick(function () {
|
|
|
+ this.tableHeight =
|
|
|
+ window.innerHeight - this.$refs.table.$el.offsetTop - 200;
|
|
|
+ if (this.tableHeight <= 530) {
|
|
|
+ this.tableHeight = 530;
|
|
|
+ }
|
|
|
+ // 监听窗口大小变化
|
|
|
+ let self = this;
|
|
|
+ window.onresize = function () {
|
|
|
+ self.tableHeight =
|
|
|
+ window.innerHeight - self.$refs.table.$el.offsetTop - 200;
|
|
|
+ if (self.tableHeight <= 530) {
|
|
|
+ self.tableHeight = 530;
|
|
|
+ }
|
|
|
+ };
|
|
|
+ });
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ goTo(path) {
|
|
|
+ this.$router.push(path);
|
|
|
+ },
|
|
|
+ previewImg(url) {
|
|
|
+ this.$hevueImgPreview(url);
|
|
|
+ },
|
|
|
+ lookData(uid) {
|
|
|
+ let params = {
|
|
|
+ uid: uid,
|
|
|
+ cid: this.id,
|
|
|
+ };
|
|
|
+ this.ajax
|
|
|
+ .get(this.$store.state.api + "selectWorksDetail", params)
|
|
|
+ .then((res) => {
|
|
|
+ this.studentInfo = res.data[0][0];
|
|
|
+ this.dataVisible = true;
|
|
|
+ })
|
|
|
+ .catch((err) => {
|
|
|
+ console.error(err);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ tableRowClassName({ row, rowIndex }) {
|
|
|
+ if ((rowIndex + 1) % 2 === 0) {
|
|
|
+ return "even_row";
|
|
|
+ } else {
|
|
|
+ return "";
|
|
|
+ }
|
|
|
+ },
|
|
|
+ handleClose(done) {
|
|
|
+ done();
|
|
|
+ },
|
|
|
+ tableRowClassName({ row, rowIndex }) {
|
|
|
+ if ((rowIndex + 1) % 2 === 0) {
|
|
|
+ return "even_row";
|
|
|
+ } else {
|
|
|
+ return "";
|
|
|
+ }
|
|
|
+ },
|
|
|
+ handleCurrentChange(val) {
|
|
|
+ this.page = val;
|
|
|
+ this.getWorks();
|
|
|
+ },
|
|
|
+ lookWork(id, uid, cid) {
|
|
|
+ this.scopeId1 = id;
|
|
|
+ let params = {
|
|
|
+ uid: uid,
|
|
|
+ cid: cid,
|
|
|
+ };
|
|
|
+ this.ajax
|
|
|
+ .get(this.$store.state.api + "selectWorksDetail3", params)
|
|
|
+ .then((res) => {
|
|
|
+ this.sInfo = res.data[0];
|
|
|
+ var chapters = [],
|
|
|
+ eList = [],
|
|
|
+ _ooption = [],
|
|
|
+ _rate = [],
|
|
|
+ _rateList = [];
|
|
|
+ var worksDetail = res.data[1];
|
|
|
+ // this.scopeId = res.data[2][0].id;
|
|
|
+ // var scopeId = res.data[2][0].id;
|
|
|
+ var askInfo = res.data[3];
|
|
|
+ var answerInfo = res.data[4];
|
|
|
+ var pptInfo = res.data[5];
|
|
|
+ var chooseInfo = res.data[6];
|
|
|
+ var workJson = [];
|
|
|
+ for (var k = 0; k < res.data[0].length; k++) {
|
|
|
+ this.allWorks = res.data[0][k];
|
|
|
+ this.chapInfo.push(JSON.parse(res.data[0][k].chapters));
|
|
|
+ chapters.push(JSON.parse(res.data[0][k].chapters));
|
|
|
+ if (
|
|
|
+ !chapters[0][res.data[0][k].stage].chapterInfo[0].taskJson[
|
|
|
+ res.data[0][k].task
|
|
|
+ ]
|
|
|
+ ) {
|
|
|
+ continue;
|
|
|
+ }
|
|
|
+
|
|
|
+ workJson.push({
|
|
|
+ img: [],
|
|
|
+ imgIndex: 0,
|
|
|
+ eList: [],
|
|
|
+ rateList: {},
|
|
|
+ askInfo: [],
|
|
|
+ answerInfo: [],
|
|
|
+ wpptInfo: [],
|
|
|
+ chooseInfo: [],
|
|
|
+ scopeId: res.data[0][k].id,
|
|
|
+ stagetask: "",
|
|
|
+ time: "",
|
|
|
+ });
|
|
|
+ this.checkJson[k] = {};
|
|
|
+ eList =
|
|
|
+ chapters[0][res.data[0][k].stage].chapterInfo[0].taskJson[
|
|
|
+ res.data[0][k].task
|
|
|
+ ].eList;
|
|
|
+ workJson[k].time = res.data[0][k].time;
|
|
|
+ workJson[k].stagetask =
|
|
|
+ res.data[0][k].stage + "-" + res.data[0][k].task;
|
|
|
+ if (eList && eList.length) {
|
|
|
+ _ooption = [];
|
|
|
+ workJson[k].eList = eList;
|
|
|
+ for (var i = 0; i < eList.length; i++) {
|
|
|
+ _ooption.push({ value: 0, name: eList[i].value });
|
|
|
+ workJson[k].rateList[eList[i].value] = 0;
|
|
|
+ }
|
|
|
+ workJson[k].rateList.content = "";
|
|
|
+ this.ooption[k] = _ooption;
|
|
|
+ }
|
|
|
+ // else {
|
|
|
+ // _ooption = [];
|
|
|
+ // workJson[k].eList = [
|
|
|
+ // { value: "意识能力", detail: "", score: 5 },
|
|
|
+ // { value: "科学探究能力", detail: "", score: 5 },
|
|
|
+ // { value: "实践创新能力", detail: "", score: 5 },
|
|
|
+ // { value: "学习反思能力", detail: "", score: 5 },
|
|
|
+ // { value: "工程思维能力", detail: "", score: 5 },
|
|
|
+ // ];
|
|
|
+ // for (var i = 0; i < workJson[k].eList.length; i++) {
|
|
|
+ // _ooption.push({ value: 0, name: workJson[k].eList[i].value });
|
|
|
+ // workJson[k].rateList[workJson[k].eList[i].value] = 0;
|
|
|
+ // }
|
|
|
+ // workJson[k].rateList.content = "";
|
|
|
+ // this.ooption[k] = [
|
|
|
+ // { value: 0, name: "意识能力" },
|
|
|
+ // { value: 0, name: "科学探究能力" },
|
|
|
+ // { value: 0, name: "实践创新能力" },
|
|
|
+ // { value: 0, name: "学习反思能力" },
|
|
|
+ // { value: 0, name: "工程思维能力" },
|
|
|
+ // ];
|
|
|
+ // }
|
|
|
+ if (res.data[0][k].rate && eList && eList.length) {
|
|
|
+ _rate[k] = JSON.parse(res.data[0][k].rate);
|
|
|
+ _rateList[k] = Object.keys(JSON.parse(res.data[0][k].rate));
|
|
|
+ for (var i = 0; i < _rateList[k].length; i++) {
|
|
|
+ var _c = Object.keys(workJson[k].rateList);
|
|
|
+ if (_c.indexOf(_rateList[k][i]) != -1) {
|
|
|
+ workJson[k].rateList[_rateList[k][i]] =
|
|
|
+ _rate[k][_rateList[k][i]];
|
|
|
+ }
|
|
|
+ }
|
|
|
+ for (var i = 0; i < this.ooption[k].length; i++) {
|
|
|
+ if (_rateList[k].indexOf(this.ooption[k][i].name) != -1) {
|
|
|
+ this.ooption[k][i].value = _rate[k][this.ooption[k][i].name];
|
|
|
+ }
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ _rate[k] = [];
|
|
|
+ _rateList[k] = [];
|
|
|
+ }
|
|
|
+
|
|
|
+ for (var i = 0; i < worksDetail.length; i++) {
|
|
|
+ if (
|
|
|
+ res.data[0][k].stage == worksDetail[i].stage &&
|
|
|
+ res.data[0][k].task == worksDetail[i].task
|
|
|
+ ) {
|
|
|
+ workJson[k].img.push({ src: worksDetail[i].content, id: i });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ for (var i = 0; i < askInfo.length; i++) {
|
|
|
+ if (
|
|
|
+ res.data[0][k].stage == askInfo[i].stage &&
|
|
|
+ res.data[0][k].task == askInfo[i].task
|
|
|
+ ) {
|
|
|
+ const element = askInfo[i];
|
|
|
+ let a = JSON.parse(element.content)[0];
|
|
|
+ let b = a.anwer.split(",");
|
|
|
+ let c = [];
|
|
|
+ for (var j = 0; j < b.length; j++) {
|
|
|
+ c.push(parseInt(b[j]));
|
|
|
+ }
|
|
|
+ a.askJson.radio = c;
|
|
|
+ a.askJson.time = element.time;
|
|
|
+ workJson[k].askInfo.push(a.askJson);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ for (var i = 0; i < chooseInfo.length; i++) {
|
|
|
+ if (
|
|
|
+ res.data[0][k].stage == chooseInfo[i].stage &&
|
|
|
+ res.data[0][k].task == chooseInfo[i].task
|
|
|
+ ) {
|
|
|
+ const element1 = chooseInfo[i];
|
|
|
+ let t = JSON.parse(element1.content)[0].testJson;
|
|
|
+ let e = [];
|
|
|
+ for (var y = 0; y < t.testJson.length; y++) {
|
|
|
+ if (t.testJson[y].type == "2") {
|
|
|
+ e.push(JSON.parse(chooseInfo[i].content)[0].anwer[y]);
|
|
|
+ } else {
|
|
|
+ e.push(JSON.parse(chooseInfo[i].content)[0].anwer[y]);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ t.radio = e;
|
|
|
+ workJson[k].chooseInfo.push(t);
|
|
|
+ this.checkJson[k].allRight = 0;
|
|
|
+ var isCount = 0;
|
|
|
+ for (var p = 0; p < t.radio.length; p++) {
|
|
|
+ if (!this.checkJson[k][p]) {
|
|
|
+ this.checkJson[k][p] = {
|
|
|
+ checkCount: [],
|
|
|
+ checkPerson: [],
|
|
|
+ };
|
|
|
+ // this.checkJson[k].push({
|
|
|
+ // checkCount: [],
|
|
|
+ // checkPerson: [],
|
|
|
+ // rightPerson: [],
|
|
|
+ // });
|
|
|
+ }
|
|
|
+ if (!this.checkJson[k][p].checkCount.length) {
|
|
|
+ this.checkJson[k][p].checkCount = [];
|
|
|
+ let _askItemCount = t.testJson[p].testItem;
|
|
|
+ for (var aic = 0; aic < _askItemCount; aic++) {
|
|
|
+ this.checkJson[k][p].checkCount.push(0);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if (t.radio[p] instanceof Array) {
|
|
|
+ if (
|
|
|
+ workJson[k].chooseInfo[0].testJson[p].answer
|
|
|
+ .sort()
|
|
|
+ .join(",") == t.radio[p].sort().join(",")
|
|
|
+ ) {
|
|
|
+ // this.checkJson[k][p].rightPerson.push(
|
|
|
+ // res.data[0][k].sName
|
|
|
+ // );
|
|
|
+ this.checkJson[k][p].right = 100;
|
|
|
+ isCount += this.checkJson[k][p].right;
|
|
|
+ } else {
|
|
|
+ this.checkJson[k][p].right = 0;
|
|
|
+ isCount += 0;
|
|
|
+ }
|
|
|
+ for (var q = 0; q < t.radio[p].length; q++) {
|
|
|
+ this.checkJson[k][p].checkPerson[parseInt(t.radio[p][q])]
|
|
|
+ ? this.checkJson[k][p].checkPerson[
|
|
|
+ parseInt(t.radio[p][q])
|
|
|
+ ].push(res.data[0][k].sName)
|
|
|
+ : (this.checkJson[k][p].checkPerson[
|
|
|
+ parseInt(t.radio[p][q])
|
|
|
+ ] = [res.data[0][k].sName]);
|
|
|
+ this.checkJson[k][p].checkCount[parseInt(t.radio[p][q])]
|
|
|
+ ? this.checkJson[k][p].checkCount[
|
|
|
+ parseInt(t.radio[p][q])
|
|
|
+ ]++
|
|
|
+ : (this.checkJson[k][p].checkCount[
|
|
|
+ parseInt(t.radio[p][q])
|
|
|
+ ] = 1);
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ if (
|
|
|
+ workJson[k].chooseInfo[0].testJson[p].answer == t.radio[p]
|
|
|
+ ) {
|
|
|
+ // this.checkJson[k][p].rightPerson.push(
|
|
|
+ // res.data[0][k].sName
|
|
|
+ // );
|
|
|
+ this.checkJson[k][p].right = 100;
|
|
|
+ isCount += this.checkJson[k][p].right;
|
|
|
+ } else {
|
|
|
+ this.checkJson[k][p].right = 0;
|
|
|
+ isCount += 0;
|
|
|
+ }
|
|
|
+ if (parseInt(t.radio[p]) || parseInt(t.radio[p]) == 0) {
|
|
|
+ this.checkJson[k][p].checkPerson[parseInt(t.radio[p])]
|
|
|
+ ? this.checkJson[k][p].checkPerson[
|
|
|
+ parseInt(t.radio[p])
|
|
|
+ ].push(res.data[0][k].sName)
|
|
|
+ : (this.checkJson[k][p].checkPerson[
|
|
|
+ parseInt(t.radio[p])
|
|
|
+ ] = [res.data[0][k].sName]);
|
|
|
+ this.checkJson[k][p].checkCount[parseInt(t.radio[p])]
|
|
|
+ ? this.checkJson[k][p].checkCount[
|
|
|
+ parseInt(t.radio[p])
|
|
|
+ ]++
|
|
|
+ : (this.checkJson[k][p].checkCount[
|
|
|
+ parseInt(t.radio[p])
|
|
|
+ ] = 1);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.checkJson[k].allRight = isCount / t.radio.length;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ for (var i = 0; i < pptInfo.length; i++) {
|
|
|
+ if (
|
|
|
+ res.data[0][k].stage == pptInfo[i].stage &&
|
|
|
+ res.data[0][k].task == pptInfo[i].task
|
|
|
+ ) {
|
|
|
+ var a = ["PPT", "PPTX", "XLSX", "XLS", "DOC", "DOCX"];
|
|
|
+ if (
|
|
|
+ a.indexOf(
|
|
|
+ pptInfo[i].content
|
|
|
+ .split(".")
|
|
|
+ [
|
|
|
+ pptInfo[i].content.split(".").length - 1
|
|
|
+ ].toLocaleUpperCase()
|
|
|
+ ) != -1
|
|
|
+ ) {
|
|
|
+ var a =
|
|
|
+ "https://view.officeapps.live.com/op/view.aspx?src=" +
|
|
|
+ pptInfo[i].content;
|
|
|
+ workJson[k].wpptInfo.push(a);
|
|
|
+ this.showPDF = false;
|
|
|
+ } else if (
|
|
|
+ pptInfo[i].content
|
|
|
+ .split(".")
|
|
|
+ [
|
|
|
+ pptInfo[i].content.split(".").length - 1
|
|
|
+ ].toLocaleUpperCase() == "PDF"
|
|
|
+ ) {
|
|
|
+ workJson[k].wpptInfo.push(pptInfo[i].content);
|
|
|
+ this.showPDF = true;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ for (var i = 0; i < answerInfo.length; i++) {
|
|
|
+ if (
|
|
|
+ res.data[0][k].stage == answerInfo[i].stage &&
|
|
|
+ res.data[0][k].task == answerInfo[i].task
|
|
|
+ ) {
|
|
|
+ const element = answerInfo[i];
|
|
|
+ workJson[k].answerInfo.push(JSON.parse(element.content)[0]);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ // debugger
|
|
|
+ // for(var i = 0; i < chooseInfo.length; i++){
|
|
|
+ // if (chooseInfo[i].type == 8) {
|
|
|
+ // console.log(this.checkJson)
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ // for (var k = 0; k < res.data[0].length; k++) {
|
|
|
+ // console.log(workJson[k].chooseInfo);
|
|
|
+ // for (var i = 0; i < chooseInfo.length; i++) {
|
|
|
+ // if (chooseInfo[i].type == 8) {
|
|
|
+ // for (var z = 0; z < this.checkJson[k].length; z++) {
|
|
|
+ // this.checkJson[k][z].checkPerent = [];
|
|
|
+ // this.checkJson[k][z].right = Math.round(
|
|
|
+ // (this.checkJson[k][z].rightPerson.length /
|
|
|
+ // parseInt(workJson[k].chooseInfo.length)) *
|
|
|
+ // 100
|
|
|
+ // );
|
|
|
+ // for (
|
|
|
+ // var w = 0;
|
|
|
+ // w < this.checkJson[k][z].checkCount.length;
|
|
|
+ // w++
|
|
|
+ // ) {
|
|
|
+ // this.checkJson[k][z].checkPerent.push(
|
|
|
+ // Math.round(
|
|
|
+ // (this.checkJson[k][z].checkCount[w] /
|
|
|
+ // parseInt(workJson[k].chooseInfo.length)) *
|
|
|
+ // 100
|
|
|
+ // )
|
|
|
+ // );
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+
|
|
|
+ this.worksDetail = workJson;
|
|
|
+
|
|
|
+ this.courseDetail = res.data[0][0];
|
|
|
+
|
|
|
+ this.$forceUpdate;
|
|
|
+ this.dialogVisible3 = true;
|
|
|
+ setTimeout(() => {
|
|
|
+ for (var p = 0; p < res.data[0].length; p++) {
|
|
|
+ if (!this.ooption[p]) {
|
|
|
+ this.chartObj[p] = null;
|
|
|
+ continue;
|
|
|
+ }
|
|
|
+ var _ooption = JSON.parse(JSON.stringify(this.ooption[p]));
|
|
|
+ var _option = JSON.parse(JSON.stringify(this.radarOption));
|
|
|
+ _option.radar.indicator = [];
|
|
|
+ _option.series[0].data[0].value = [];
|
|
|
+ for (var i = 0; i < _ooption.length; i++) {
|
|
|
+ _option.radar.indicator.push({
|
|
|
+ name: _ooption[i].name,
|
|
|
+ max: 5,
|
|
|
+ });
|
|
|
+ _option.series[0].data[0].value.push(_ooption[i].value);
|
|
|
+ }
|
|
|
+ this.setChart(_option, p);
|
|
|
+ }
|
|
|
+ }, 0);
|
|
|
+ let _dyList = JSON.parse(JSON.stringify(this.dyList));
|
|
|
+ let _dyList2 = [];
|
|
|
+ let _dyList3 = [];
|
|
|
+ for (var c = 0; c < _dyList.length; c++) {
|
|
|
+ _dyList[c].taskList = [];
|
|
|
+ _dyList2.push(_dyList[c]);
|
|
|
+ }
|
|
|
+ _dyList = JSON.parse(JSON.stringify(this.dyList));
|
|
|
+ for (var c = 0; c < workJson.length; c++) {
|
|
|
+ let _stage = workJson[c].stagetask.split("-")[0];
|
|
|
+ let _task = workJson[c].stagetask.split("-")[1];
|
|
|
+ _dyList2[_stage].taskList.push(_dyList[_stage].taskList[_task]);
|
|
|
+ _dyList2[_stage].taskList;
|
|
|
+ }
|
|
|
+ for (var c = 0; c < _dyList2.length; c++) {
|
|
|
+ if (_dyList2[c].taskList.length) {
|
|
|
+ _dyList2[c].isOpen = c === 0 ? true : false;
|
|
|
+ _dyList3.push(_dyList2[c]);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.dyList2 = _dyList3;
|
|
|
+ this.stageIndex = this.dyList2[0].id;
|
|
|
+ this.taskCount = this.dyList2[0].taskList[0].id;
|
|
|
+ this.navId =
|
|
|
+ this.dyList2[0].id + "-" + this.dyList2[0].taskList[0].id;
|
|
|
+ // this.sInfo = res.data[0][0];
|
|
|
+ // this.chapInfo = JSON.parse(res.data[0][0].chapters);
|
|
|
+ // var chapters = JSON.parse(res.data[0][0].chapters);
|
|
|
+ // var worksDetail = res.data[1];
|
|
|
+ // // var askArray = res.data[2];
|
|
|
+ // this.scopeId = res.data[2].length ? res.data[2][0].id : this.sInfo.id;
|
|
|
+ // var askInfo = res.data[3];
|
|
|
+ // var answerInfo = res.data[4];
|
|
|
+ // var workJson = {
|
|
|
+ // img: [],
|
|
|
+ // imgIndex: 0,
|
|
|
+ // eList: [],
|
|
|
+ // rateList: {},
|
|
|
+ // askInfo: [],
|
|
|
+ // answerInfo: [],
|
|
|
+ // };
|
|
|
+ // var eList =
|
|
|
+ // chapters[this.sInfo.stage].chapterInfo[0].taskJson[this.sInfo.task]
|
|
|
+ // .eList;
|
|
|
+ // var _ooption = [];
|
|
|
+ // if (eList) {
|
|
|
+ // workJson.eList = eList;
|
|
|
+ // for (var i = 0; i < eList.length; i++) {
|
|
|
+ // _ooption.push({ value: 0, name: eList[i].value });
|
|
|
+ // workJson.rateList[eList[i].value] = 0;
|
|
|
+ // }
|
|
|
+ // workJson.rateList.content = "";
|
|
|
+ // this.ooption = _ooption;
|
|
|
+ // } else {
|
|
|
+ // workJson.eList = [
|
|
|
+ // { value: "意识能力", detail: "", score: 5 },
|
|
|
+ // { value: "科学探究能力", detail: "", score: 5 },
|
|
|
+ // { value: "实践创新能力", detail: "", score: 5 },
|
|
|
+ // { value: "学习反思能力", detail: "", score: 5 },
|
|
|
+ // { value: "工程思维能力", detail: "", score: 5 },
|
|
|
+ // ];
|
|
|
+ // for (var i = 0; i < workJson.eList.length; i++) {
|
|
|
+ // _ooption.push({ value: 0, name: workJson.eList[i].value });
|
|
|
+ // workJson.rateList[workJson.eList[i].value] = 0;
|
|
|
+ // }
|
|
|
+ // workJson.rateList.content = "";
|
|
|
+ // this.ooption = [
|
|
|
+ // { value: 0, name: "意识能力" },
|
|
|
+ // { value: 0, name: "科学探究能力" },
|
|
|
+ // { value: 0, name: "实践创新能力" },
|
|
|
+ // { value: 0, name: "学习反思能力" },
|
|
|
+ // { value: 0, name: "工程思维能力" },
|
|
|
+ // ];
|
|
|
+ // }
|
|
|
+ // if (this.sInfo.rate) {
|
|
|
+ // var _rate = JSON.parse(this.sInfo.rate);
|
|
|
+ // var _rateList = Object.keys(JSON.parse(this.sInfo.rate));
|
|
|
+ // for (var i = 0; i < _rateList.length; i++) {
|
|
|
+ // var _c = Object.keys(workJson.rateList);
|
|
|
+ // if (_c.indexOf(_rateList[i]) != -1) {
|
|
|
+ // workJson.rateList[_rateList[i]] = _rate[_rateList[i]];
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ // for (var i = 0; i < this.ooption.length; i++) {
|
|
|
+ // if (_rateList.indexOf(this.ooption[i].name) != -1) {
|
|
|
+ // this.ooption[i].value = _rate[this.ooption[i].name];
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+
|
|
|
+ // for (var i = 0; i < worksDetail.length; i++) {
|
|
|
+ // workJson.img.push({ src: worksDetail[i].content, id: i });
|
|
|
+ // }
|
|
|
+ // for (var i = 0; i < askInfo.length; i++) {
|
|
|
+ // const element = askInfo[i];
|
|
|
+ // let a = JSON.parse(element.content)[0];
|
|
|
+ // let b = a.anwer.split(",");
|
|
|
+ // let c = [];
|
|
|
+ // for (var j = 0; j < b.length; j++) {
|
|
|
+ // c.push(parseInt(b[j]));
|
|
|
+ // }
|
|
|
+ // a.askJson.radio = c;
|
|
|
+ // a.askJson.time = element.time;
|
|
|
+ // workJson.askInfo.push(a.askJson);
|
|
|
+ // }
|
|
|
+
|
|
|
+ // for (var i = 0; i < answerInfo.length; i++) {
|
|
|
+ // const element = answerInfo[i];
|
|
|
+ // workJson.answerInfo.push(JSON.parse(element.content)[0]);
|
|
|
+ // }
|
|
|
+
|
|
|
+ // this.worksDetail = workJson;
|
|
|
+
|
|
|
+ // this.courseDetail = res.data[0][0];
|
|
|
+
|
|
|
+ // this.$forceUpdate;
|
|
|
+ // this.dialogVisible3 = true;
|
|
|
+
|
|
|
+ // setTimeout(() => {
|
|
|
+ // var _ooption = JSON.parse(JSON.stringify(this.ooption));
|
|
|
+ // var _option = this.radarOption;
|
|
|
+ // _option.radar.indicator = [];
|
|
|
+ // _option.series[0].data[0].value = [];
|
|
|
+ // for (var i = 0; i < _ooption.length; i++) {
|
|
|
+ // _option.radar.indicator.push({ name: _ooption[i].name, max: 5 });
|
|
|
+ // _option.series[0].data[0].value.push(_ooption[i].value);
|
|
|
+ // }
|
|
|
+ // this.setChart(_option);
|
|
|
+
|
|
|
+ // }, 0);
|
|
|
+ this.isPre = false;
|
|
|
+ this.isNext = false;
|
|
|
+ this.preStep(1);
|
|
|
+ this.nextStep(1);
|
|
|
+ })
|
|
|
+ .catch((err) => {
|
|
|
+ console.error(err);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ lookWork2(id, uid,cid) {
|
|
|
+ // this.scopeId = id;
|
|
|
+ let params = {
|
|
|
+ uid: uid,
|
|
|
+ cid: cid,
|
|
|
+ };
|
|
|
+ this.ajax
|
|
|
+ .get(this.$store.state.api + "selectWorksDetail3", params)
|
|
|
+ .then((res) => {
|
|
|
+ this.sInfo = res.data[0][0];
|
|
|
+ this.chapInfo = JSON.parse(res.data[0][0].chapters);
|
|
|
+ var chapters = JSON.parse(res.data[0][0].chapters);
|
|
|
+ var worksDetail = res.data[1];
|
|
|
+ // var askArray = res.data[2];
|
|
|
+ this.scopeId = res.data[2].length ? res.data[2][0].id : this.sInfo.id;
|
|
|
+ var askInfo = res.data[3];
|
|
|
+ var answerInfo = res.data[4];
|
|
|
+ var linkInfo = res.data[5];
|
|
|
+ var workJson = {
|
|
|
+ img: [],
|
|
|
+ imgIndex: 0,
|
|
|
+ eList: [],
|
|
|
+ rateList: {},
|
|
|
+ wpptInfo: [],
|
|
|
+ askInfo: [],
|
|
|
+ answerInfo: [],
|
|
|
+ };
|
|
|
+ var eList =
|
|
|
+ chapters[this.sInfo.stage].chapterInfo[0].taskJson[this.sInfo.task]
|
|
|
+ .eList;
|
|
|
+ // ooption: [
|
|
|
+ // { value: 0, name: "意识能力" },
|
|
|
+ // { value: 0, name: "科学探究能力" },
|
|
|
+ // { value: 0, name: "实践创新能力" },
|
|
|
+ // { value: 0, name: "学习反思能力" },
|
|
|
+ // { value: 0, name: "工程思维能力" },
|
|
|
+ // ],
|
|
|
+ var _ooption = [];
|
|
|
+ if (eList) {
|
|
|
+ workJson.eList = eList;
|
|
|
+ for (var i = 0; i < eList.length; i++) {
|
|
|
+ _ooption.push({ value: 0, name: eList[i].value });
|
|
|
+ workJson.rateList[eList[i].value] = 0;
|
|
|
+ }
|
|
|
+ workJson.rateList.content = "";
|
|
|
+ this.ooption = _ooption;
|
|
|
+ } else {
|
|
|
+ workJson.eList = [
|
|
|
+ { value: "意识能力", detail: "", score: 5 },
|
|
|
+ { value: "科学探究能力", detail: "", score: 5 },
|
|
|
+ { value: "实践创新能力", detail: "", score: 5 },
|
|
|
+ { value: "学习反思能力", detail: "", score: 5 },
|
|
|
+ { value: "工程思维能力", detail: "", score: 5 },
|
|
|
+ ];
|
|
|
+ for (var i = 0; i < workJson.eList.length; i++) {
|
|
|
+ _ooption.push({ value: 0, name: workJson.eList[i].value });
|
|
|
+ workJson.rateList[workJson.eList[i].value] = 0;
|
|
|
+ }
|
|
|
+ workJson.rateList.content = "";
|
|
|
+ this.ooption = [
|
|
|
+ { value: 0, name: "意识能力" },
|
|
|
+ { value: 0, name: "科学探究能力" },
|
|
|
+ { value: 0, name: "实践创新能力" },
|
|
|
+ { value: 0, name: "学习反思能力" },
|
|
|
+ { value: 0, name: "工程思维能力" },
|
|
|
+ ];
|
|
|
+ }
|
|
|
+ if (this.sInfo.rate) {
|
|
|
+ var _rate = JSON.parse(this.sInfo.rate);
|
|
|
+ var _rateList = Object.keys(JSON.parse(this.sInfo.rate));
|
|
|
+ for (var i = 0; i < _rateList.length; i++) {
|
|
|
+ var _c = Object.keys(workJson.rateList);
|
|
|
+ if (_c.indexOf(_rateList[i]) != -1) {
|
|
|
+ workJson.rateList[_rateList[i]] = _rate[_rateList[i]];
|
|
|
+ }
|
|
|
+ }
|
|
|
+ for (var i = 0; i < this.ooption.length; i++) {
|
|
|
+ if (_rateList.indexOf(this.ooption[i].name) != -1) {
|
|
|
+ this.ooption[i].value = _rate[this.ooption[i].name];
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ for (var i = 0; i < worksDetail.length; i++) {
|
|
|
+ workJson.img.push({ src: worksDetail[i].content, id: i });
|
|
|
+ }
|
|
|
+ for (var i = 0; i < askInfo.length; i++) {
|
|
|
+ const element = askInfo[i];
|
|
|
+ let a = JSON.parse(element.content)[0];
|
|
|
+ let b = a.anwer.split(",");
|
|
|
+ let c = [];
|
|
|
+ for (var j = 0; j < b.length; j++) {
|
|
|
+ c.push(parseInt(b[j]));
|
|
|
+ }
|
|
|
+ a.askJson.radio = c;
|
|
|
+ a.askJson.time = element.time;
|
|
|
+ workJson.askInfo.push(a.askJson);
|
|
|
+ }
|
|
|
+
|
|
|
+ for (var i = 0; i < answerInfo.length; i++) {
|
|
|
+ const element = answerInfo[i];
|
|
|
+ workJson.answerInfo.push(JSON.parse(element.content)[0]);
|
|
|
+ }
|
|
|
+
|
|
|
+ this.worksDetail = workJson;
|
|
|
+
|
|
|
+ this.courseDetail = res.data[0][0];
|
|
|
+
|
|
|
+ this.$forceUpdate;
|
|
|
+
|
|
|
+ var _course = `<h1>${this.sInfo.course}</h1>`;
|
|
|
+ var _title =
|
|
|
+ "<h2>" +
|
|
|
+ "第" +
|
|
|
+ (this.sInfo.stage + 1) +
|
|
|
+ "阶段 " +
|
|
|
+ this.dyList[this.sInfo.stage].name +
|
|
|
+ "</h2>";
|
|
|
+ var _subtitle =
|
|
|
+ "<h3>" +
|
|
|
+ "任务" +
|
|
|
+ (this.sInfo.task + 1) +
|
|
|
+ " " +
|
|
|
+ this.dyList[this.sInfo.stage].taskList[this.sInfo.task].name +
|
|
|
+ "-" +
|
|
|
+ this.sInfo.sName +
|
|
|
+ "</h3>";
|
|
|
+ var _img = "";
|
|
|
+ if (workJson.img.length > 0) {
|
|
|
+ for (var i = 0; i < workJson.img.length; i++) {
|
|
|
+ // _img += `<div style="margin-top:10px"><div>图片${
|
|
|
+ // i + 1
|
|
|
+ // }:<a href='${workJson.img[i].src}'>${
|
|
|
+ // workJson.img[i].src
|
|
|
+ // }</a></div>`;
|
|
|
+ _img += `<div style="margin-top:10px"><div>图片${
|
|
|
+ i + 1
|
|
|
+ }</div><img style="max-width:500px" src="${
|
|
|
+ workJson.img[i].src
|
|
|
+ }"/></div>`;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ var _ask = "";
|
|
|
+ if (workJson.askInfo.length > 0) {
|
|
|
+ var _ask = "<h3>选择题</h3>";
|
|
|
+ for (var i = 0; i < workJson.askInfo.length; i++) {
|
|
|
+ var _div = document.createElement("div");
|
|
|
+ _div.innerHTML = `<h4>标题:${workJson.askInfo[i].askTitle}</h4>`;
|
|
|
+ for (var j = 0; j < workJson.askInfo[i].askJson.length; j++) {
|
|
|
+ var _div2 = document.createElement("div");
|
|
|
+ _div2.innerHTML = `<h5>第${j + 1}题:${
|
|
|
+ workJson.askInfo[i].askJson[j].askstitle
|
|
|
+ } 选择:${workJson.askInfo[i].radio[j] + 1}</h5> `;
|
|
|
+ var _div3 = document.createElement("div");
|
|
|
+ for (
|
|
|
+ var z = 0;
|
|
|
+ z < workJson.askInfo[i].askJson[j].checkList.length;
|
|
|
+ z++
|
|
|
+ ) {
|
|
|
+ _div3.innerHTML += `<span style="margin-right:5px">${z + 1}.${
|
|
|
+ workJson.askInfo[i].askJson[j].checkList[z]
|
|
|
+ }</span>`;
|
|
|
+ }
|
|
|
+ _div2.innerHTML += `<div>${_div3.innerHTML}</div>`;
|
|
|
+ _div.innerHTML += `<div>${_div2.innerHTML}</div>`;
|
|
|
+ }
|
|
|
+ _ask += `<div>${_div.innerHTML}</div>`;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ var _answer = "";
|
|
|
+ if (workJson.answerInfo.length > 0) {
|
|
|
+ var _answer = "<h3>问答</h3>";
|
|
|
+ for (var i = 0; i < workJson.answerInfo.length; i++) {
|
|
|
+ var _div = document.createElement("div");
|
|
|
+ _div.innerHTML = `<h4>问答：${workJson.answerInfo[i].answerTitle}</h4>`;
|
|
|
+ _div.innerHTML += `<div>${workJson.answerInfo[i].answer}</div>`;
|
|
|
+ _answer += `<div>${_div.innerHTML}</div>`;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ var _link = "";
|
|
|
+ if (linkInfo.length > 0) {
|
|
|
+ for (var i = 0; i < linkInfo.length; i++) {
|
|
|
+ _link += `<div style="margin-top:10px"><a href='${linkInfo[i].content}'>${linkInfo[i].content}</a></div>`;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ var _html =
|
|
|
+ _course + _title + _subtitle + _img + _ask + _answer + _link;
|
|
|
+ this.generate(_html);
|
|
|
+ })
|
|
|
+ .catch((err) => {
|
|
|
+ console.error(err);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ checkAsk(askJson) {
|
|
|
+ this.askJson = askJson;
|
|
|
+ this.dialogVisible4 = true;
|
|
|
+ },
|
|
|
+ setChart(option, k) {
|
|
|
+ let _this = this;
|
|
|
+ // 雷达图显示的标签
|
|
|
+ let newPromise = new Promise((resolve) => {
|
|
|
+ resolve();
|
|
|
+ });
|
|
|
+ //然后异步执行echarts的初始化函数
|
|
|
+ newPromise.then(() => {
|
|
|
+ const chartObj = _this.$echarts.init(
|
|
|
+ //劳动课程
|
|
|
+ // _this.$el.querySelector("#charts_canvas")
|
|
|
+ document.getElementsByClassName("charts_canvas")[k]
|
|
|
+ );
|
|
|
+ // 初始化雷达图
|
|
|
+ _this.chartObj[k] = chartObj;
|
|
|
+ _this.chartObj[k].setOption(option);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ giveScore() {
|
|
|
+ this.rateList = this.chapInfo[this.publicIndex].rate;
|
|
|
+ this.dialogVisible2 = true;
|
|
|
+ },
|
|
|
+ openFile(f) {
|
|
|
+ this.pptImgUrl = f;
|
|
|
+ this.dialogVisible6 = true;
|
|
|
+ },
|
|
|
+ searchWork1() {
|
|
|
+ this.page = 1;
|
|
|
+ this.chooseTask = "";
|
|
|
+ this.getWorks();
|
|
|
+ },
|
|
|
+ searchWork2() {
|
|
|
+ this.page = 1;
|
|
|
+ this.getWorks();
|
|
|
+ },
|
|
|
+ fullTools() {
|
|
|
+ this.full = !this.full;
|
|
|
+ },
|
|
|
+ //获取作业
|
|
|
+ getWorks() {
|
|
|
+ this.isLoading = true;
|
|
|
+ let params = {
|
|
|
+ uid: this.uid,
|
|
|
+ cid: this.uname,
|
|
|
+ stage: this.chooseDy,
|
|
|
+ task: this.chooseTask,
|
|
|
+ page: this.page,
|
|
|
+ };
|
|
|
+ this.ajax
|
|
|
+ .get(this.$store.state.api + "selectStudentCourseWorks", params)
|
|
|
+ .then((res) => {
|
|
|
+ this.isLoading = false;
|
|
|
+ this.total = res.data[0].length > 0 ? res.data[0][0].num : 0;
|
|
|
+ this.tableData = res.data[0];
|
|
|
+ })
|
|
|
+ .catch((err) => {
|
|
|
+ this.isLoading = false;
|
|
|
+ console.error(err);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ getCourseDetail() {
|
|
|
+ let params = {
|
|
|
+ uid: this.uid,
|
|
|
+ };
|
|
|
+ this.ajax
|
|
|
+ .get(this.$store.state.api + "getStudentCourseWorksReport", params)
|
|
|
+ .then((res) => {
|
|
|
+ this.course = res.data[0][0];
|
|
|
+ var dyJSON = JSON.parse(res.data[0][0].chapters);
|
|
|
+ let dyList = [];
|
|
|
+ for (var i = 0; i < dyJSON.length; i++) {
|
|
|
+ dyList.push({ name: dyJSON[i].dyName, id: i, taskList: [] });
|
|
|
+ var a = dyJSON[i].chapterInfo[0].taskJson;
|
|
|
+ for (var j = 0; j < a.length; j++) {
|
|
|
+ dyList[i].taskList.push({ name: a[j].task, id: j });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.dyList = dyList;
|
|
|
+ this.userAarray = res.data[1];
|
|
|
+ })
|
|
|
+ .catch((err) => {
|
|
|
+ console.error(err);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ handlePictureCardPreview(url) {
|
|
|
+ this.dialogImageUrl = url;
|
|
|
+ this.pictureDialog = true;
|
|
|
+ },
|
|
|
+ updatePj() {
|
|
|
+ for (var i = 0; i < this.worksDetail.length; i++) {
|
|
|
+ if (!this.worksDetail[i].eList.length) {
|
|
|
+ continue;
|
|
|
+ }
|
|
|
+ this.updateWorks(
|
|
|
+ this.worksDetail[i].scopeId,
|
|
|
+ this.worksDetail[i].rateList,
|
|
|
+ i
|
|
|
+ );
|
|
|
+ }
|
|
|
+ },
|
|
|
+ getStar(i) {
|
|
|
+ const k = i;
|
|
|
+ var _ooption = JSON.parse(JSON.stringify(this.ooption[k]));
|
|
|
+ var _rate = this.worksDetail[i].rateList;
|
|
|
+ var _rateList = Object.keys(this.worksDetail[i].rateList);
|
|
|
+ for (var i = 0; i < _ooption.length; i++) {
|
|
|
+ if (_rateList.indexOf(_ooption[i].name) != -1) {
|
|
|
+ _ooption[i].value = _rate[_ooption[i].name];
|
|
|
+ }
|
|
|
+ }
|
|
|
+ // var _option = JSON.parse(JSON.stringify(this.radarOption));
|
|
|
+ var _option = this.radarOption;
|
|
|
+ _option.radar.indicator = [];
|
|
|
+ _option.series[0].data[0].value = [];
|
|
|
+ for (var i = 0; i < _ooption.length; i++) {
|
|
|
+ _option.radar.indicator.push({ name: _ooption[i].name, max: 5 });
|
|
|
+ _option.series[0].data[0].value.push(_ooption[i].value);
|
|
|
+ }
|
|
|
+ if (this.chartObj && this.chartObj[k]) {
|
|
|
+ // _option.series[0].data = _ooption;
|
|
|
+ this.chartObj[k].setOption(_option);
|
|
|
+ } else {
|
|
|
+ this.setChart(_ooption);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ updateWorks(scopeId, rateList, i) {
|
|
|
+ let params = {
|
|
|
+ rate: rateList,
|
|
|
+ tuid: this.userid,
|
|
|
+ id: scopeId,
|
|
|
+ };
|
|
|
+ const k = i;
|
|
|
+ this.ajax
|
|
|
+ .get(this.$store.state.api + "updateWorks", params)
|
|
|
+ .then((res) => {
|
|
|
+ var _ooption = JSON.parse(JSON.stringify(this.ooption[k]));
|
|
|
+ // var _option = JSON.parse(JSON.stringify(this.option));
|
|
|
+
|
|
|
+ var _rate = rateList;
|
|
|
+ var _rateList = Object.keys(rateList);
|
|
|
+ for (var i = 0; i < _ooption.length; i++) {
|
|
|
+ if (_rateList.indexOf(_ooption[i].name) != -1) {
|
|
|
+ _ooption[i].value = _rate[_ooption[i].name];
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // var _option = JSON.parse(JSON.stringify(this.radarOption));
|
|
|
+ var _option = this.radarOption;
|
|
|
+ _option.radar.indicator = [];
|
|
|
+ _option.series[0].data[0].value = [];
|
|
|
+ for (var i = 0; i < _ooption.length; i++) {
|
|
|
+ _option.radar.indicator.push({ name: _ooption[i].name, max: 5 });
|
|
|
+ _option.series[0].data[0].value.push(_ooption[i].value);
|
|
|
+ }
|
|
|
+ if (this.chartObj) {
|
|
|
+ // _option.series[0].data = _ooption;
|
|
|
+ this.chartObj[k].setOption(_option);
|
|
|
+ } else {
|
|
|
+ this.setChart(_ooption);
|
|
|
+ }
|
|
|
+ // this.uploadBoolean = false;
|
|
|
+ // this.dialogVisible2 = false;
|
|
|
+ let _k = 0;
|
|
|
+ for (var i = 0; i < this.worksDetail.length; i++) {
|
|
|
+ if (this.worksDetail[i].eList.length) {
|
|
|
+ _k = i;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if (k == _k) {
|
|
|
+ this.$message({
|
|
|
+ message: "评价成功",
|
|
|
+ type: "success",
|
|
|
+ });
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .catch((err) => {
|
|
|
+ this.$message.error("评价失败");
|
|
|
+ console.error(err);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ cancelR() {
|
|
|
+ this.checkStudent = "";
|
|
|
+ this.checkCourse = "";
|
|
|
+ this.reportVisible = false;
|
|
|
+ },
|
|
|
+ getReport(row) {
|
|
|
+ this.checkStudent = row.userid;
|
|
|
+ this.checkCourse = row.courseid;
|
|
|
+ this.reportVisible = true;
|
|
|
+ },
|
|
|
+ switchVideo(media, index) {
|
|
|
+ this.playerO = {};
|
|
|
+ this.playerOptions.poster = "";
|
|
|
+ this.playerOptions.sources[0].src = media;
|
|
|
+ this.playerO = this.playerOptions;
|
|
|
+ },
|
|
|
+ onPlayerPlay() {},
|
|
|
+ // this.$store.commit("update", ["userInfo", userInfo]);
|
|
|
+ isOpen(s) {
|
|
|
+ // this.stageIndex = s;
|
|
|
+ this.dyList2[s].isOpen = !this.dyList2[s].isOpen;
|
|
|
+ },
|
|
|
+ openTask(s, i) {
|
|
|
+ var a = s + "-" + i;
|
|
|
+ var b = document.getElementById(a);
|
|
|
+ var d = b.getAttribute("scrollindex");
|
|
|
+ var c = document.getElementsByClassName("shuBox")[0];
|
|
|
+ c.scrollTop = parseInt(d) * 375;
|
|
|
+ this.stageIndex = s;
|
|
|
+ this.taskCount = i;
|
|
|
+ this.navId = a;
|
|
|
+ },
|
|
|
+ async generate(a) {
|
|
|
+ // 将html文件中需要用到的数据挂载到store上
|
|
|
+ this.$store.commit("update", ["report", a]);
|
|
|
+ const content = `<!DOCTYPE html>
|
|
|
+ <html lang="en">
|
|
|
+ <head>
|
|
|
+ <meta charset="UTF-8">
|
|
|
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
|
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
+ <title>报告</title>
|
|
|
+ </head>
|
|
|
+ <body>
|
|
|
+ ${this.$store.state.report}
|
|
|
+ </body>
|
|
|
+ </html>`;
|
|
|
+ // debugger
|
|
|
+ // 生成报告
|
|
|
+ const link = document.createElement("a");
|
|
|
+ let dname = this.sInfo.course + "-" + this.sInfo.sName + ".html";
|
|
|
+ // link.download = "报告.html"; // 文件名
|
|
|
+ link.download = dname; // 文件名
|
|
|
+ link.style.display = "none";
|
|
|
+ // 创建文件流
|
|
|
+ // 创建bolb实例时，内容一定要放在[]中
|
|
|
+ const blob = new Blob([content], {
|
|
|
+ type: "text/plain;charset='utf-8'",
|
|
|
+ });
|
|
|
+ link.href = window.URL.createObjectURL(blob);
|
|
|
+ document.body.appendChild(link);
|
|
|
+ link.click();
|
|
|
+ document.body.removeChild(link);
|
|
|
+ // saveAs(
|
|
|
+ // htmlDocx.asBlob(content, {
|
|
|
+ // orientation: "landscape", //跨域设置
|
|
|
+ // }),
|
|
|
+ // //文件名
|
|
|
+ // "报告.doc"
|
|
|
+ // );
|
|
|
+ },
|
|
|
+ preStep(t) {
|
|
|
+ var ti = 0;
|
|
|
+ var uid = "";
|
|
|
+ var st = 0;
|
|
|
+ var ta = 0;
|
|
|
+ for (var i = 0; i < this.tableData.length; i++) {
|
|
|
+ if (this.scopeId1 == this.tableData[i].id) {
|
|
|
+ ti = i;
|
|
|
+ if (ti == 0) {
|
|
|
+ this.isPre = true;
|
|
|
+ } else {
|
|
|
+ if (t != 1) {
|
|
|
+ uid = this.tableData[i - 1].userid;
|
|
|
+ st = this.tableData[i - 1].stage;
|
|
|
+ ta = this.tableData[i - 1].task;
|
|
|
+ this.lookWork(this.tableData[i - 1].id, uid, st, ta);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ nextStep(t) {
|
|
|
+ var ti = 0;
|
|
|
+ var uid = "";
|
|
|
+ var st = 0;
|
|
|
+ var ta = 0;
|
|
|
+ for (var i = 0; i < this.tableData.length; i++) {
|
|
|
+ if (this.scopeId1 == this.tableData[i].id) {
|
|
|
+ ti = i;
|
|
|
+ if (ti == 9) {
|
|
|
+ this.isNext = true;
|
|
|
+ } else {
|
|
|
+ if (t != 1) {
|
|
|
+ uid = this.tableData[i + 1].userid;
|
|
|
+ st = this.tableData[i + 1].stage;
|
|
|
+ ta = this.tableData[i + 1].task;
|
|
|
+ this.lookWork(this.tableData[i + 1].id, uid, st, ta);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.page = 1;
|
|
|
+ this.getCourseDetail();
|
|
|
+ this.getWorks();
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+.pb_head > span:nth-child(2) {
|
|
|
+ font-size: 16px;
|
|
|
+ margin-left: 80px;
|
|
|
+ color: #ab582f;
|
|
|
+}
|
|
|
+
|
|
|
+.pb_head {
|
|
|
+ margin: 0 !important;
|
|
|
+ width: 100% !important;
|
|
|
+}
|
|
|
+
|
|
|
+.student_page {
|
|
|
+ margin-top: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.student_head {
|
|
|
+ margin-top: 10px;
|
|
|
+ padding-bottom: 15px;
|
|
|
+}
|
|
|
+
|
|
|
+.student_search {
|
|
|
+ display: flex;
|
|
|
+}
|
|
|
+
|
|
|
+.student_search > div:nth-child(1) {
|
|
|
+ line-height: 35px;
|
|
|
+ font-size: 14px;
|
|
|
+}
|
|
|
+
|
|
|
+.student_search >>> .el-input__inner {
|
|
|
+ width: 190px;
|
|
|
+ height: 35px;
|
|
|
+ margin-left: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.student_table >>> .el-table--border td {
|
|
|
+ border-right: 0px !important;
|
|
|
+}
|
|
|
+
|
|
|
+.add_work >>> .el-dialog__header {
|
|
|
+ padding: 20px 20px 10px;
|
|
|
+ text-align: center;
|
|
|
+ background: #32455b;
|
|
|
+}
|
|
|
+
|
|
|
+.add_work >>> .el-dialog__title {
|
|
|
+ font-size: 14px !important;
|
|
|
+ color: #fff !important;
|
|
|
+}
|
|
|
+
|
|
|
+.add_work >>> .el-dialog__headerbtn {
|
|
|
+ font-size: 20px !important;
|
|
|
+ top: 5px !important;
|
|
|
+ right: 8px !important;
|
|
|
+}
|
|
|
+
|
|
|
+.add_work >>> .el-form-item__label {
|
|
|
+ margin-left: 65px;
|
|
|
+}
|
|
|
+
|
|
|
+.add_work >>> .el-form-item {
|
|
|
+ display: flex;
|
|
|
+}
|
|
|
+
|
|
|
+.add_work >>> .el-form-item__content {
|
|
|
+ margin: 0 !important;
|
|
|
+}
|
|
|
+
|
|
|
+.add_work >>> .el-dialog__footer {
|
|
|
+ text-align: center !important;
|
|
|
+}
|
|
|
+
|
|
|
+.add_work >>> .el-dialog {
|
|
|
+ min-width: 650px !important;
|
|
|
+ width: 1080px;
|
|
|
+}
|
|
|
+
|
|
|
+.add_work >>> .el-dialog__body {
|
|
|
+ background: #fff;
|
|
|
+ height: 660px;
|
|
|
+ overflow: auto;
|
|
|
+}
|
|
|
+
|
|
|
+.header-title {
|
|
|
+ display: flex;
|
|
|
+}
|
|
|
+
|
|
|
+.logoImg {
|
|
|
+ width: 30px;
|
|
|
+}
|
|
|
+
|
|
|
+.logoImg > img {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.title_add_student {
|
|
|
+ margin: 0 auto;
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+.first {
|
|
|
+ margin-top: 25px;
|
|
|
+ border-bottom: 1px solid #c5c5c5;
|
|
|
+}
|
|
|
+
|
|
|
+.one_top {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+}
|
|
|
+
|
|
|
+.one_top > div:nth-child(1) {
|
|
|
+ color: #2490bf;
|
|
|
+ font-size: 16px;
|
|
|
+}
|
|
|
+
|
|
|
+.one_top > button {
|
|
|
+ width: 100px;
|
|
|
+ background: #24a0a4;
|
|
|
+ height: 30px;
|
|
|
+ color: #e0e0e0;
|
|
|
+ font-size: 13px;
|
|
|
+ padding: 0 !important;
|
|
|
+}
|
|
|
+
|
|
|
+.work_Img {
|
|
|
+ width: 150px;
|
|
|
+ margin: 10px 0;
|
|
|
+}
|
|
|
+
|
|
|
+.assess_Img {
|
|
|
+ width: 400px;
|
|
|
+ margin: 0 auto;
|
|
|
+ padding: 15px 0;
|
|
|
+}
|
|
|
+
|
|
|
+.work_Img > img,
|
|
|
+.assess_Img > img {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.work_input {
|
|
|
+ border: 1px solid;
|
|
|
+ width: 135px;
|
|
|
+ height: 20px;
|
|
|
+ line-height: 20px;
|
|
|
+ font-size: 13px;
|
|
|
+ padding: 5px;
|
|
|
+}
|
|
|
+
|
|
|
+.poetry {
|
|
|
+ margin: 10px 0 15px 0;
|
|
|
+}
|
|
|
+
|
|
|
+.assess {
|
|
|
+ background: #169bd5 !important;
|
|
|
+}
|
|
|
+
|
|
|
+.assess_top {
|
|
|
+ border-bottom: 2px solid #eee;
|
|
|
+ padding-bottom: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.assess_top > div:nth-child(1) {
|
|
|
+ color: #2490bf;
|
|
|
+ font-size: 16px;
|
|
|
+}
|
|
|
+
|
|
|
+.student_Answer {
|
|
|
+ display: flex;
|
|
|
+ margin: 5px 10px;
|
|
|
+ /* padding-bottom: 25px; */
|
|
|
+}
|
|
|
+
|
|
|
+.workName {
|
|
|
+ font-size: 18px;
|
|
|
+ font-weight: bold;
|
|
|
+ margin: 5px 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.toux {
|
|
|
+ width: 35px;
|
|
|
+ /* margin: auto 0; */
|
|
|
+ height: 35px;
|
|
|
+}
|
|
|
+
|
|
|
+.toux > img {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.nav {
|
|
|
+ display: flex;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ margin-top: 10px;
|
|
|
+ flex-direction: column;
|
|
|
+}
|
|
|
+
|
|
|
+.studentName {
|
|
|
+ margin-left: 10px;
|
|
|
+ font-size: 13px;
|
|
|
+}
|
|
|
+
|
|
|
+.studentAnswer {
|
|
|
+ font-size: 12px;
|
|
|
+ margin: 5px 0 0 10px;
|
|
|
+ height: 42px;
|
|
|
+ overflow: auto;
|
|
|
+}
|
|
|
+
|
|
|
+.comment {
|
|
|
+ /* margin: 20px 0 0 10px;
|
|
|
+ overflow: auto;
|
|
|
+ height: 75%;
|
|
|
+ max-height: 330px; */
|
|
|
+ overflow: auto;
|
|
|
+ /* height: 290px; */
|
|
|
+ height: 525px;
|
|
|
+ background: #fff;
|
|
|
+ border-radius: 5px;
|
|
|
+ padding: 10px;
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+
|
|
|
+.comment_body {
|
|
|
+ height: calc(100% - 25px);
|
|
|
+ overflow: auto;
|
|
|
+}
|
|
|
+
|
|
|
+.comment > .comment_title {
|
|
|
+ font-size: 18px;
|
|
|
+}
|
|
|
+
|
|
|
+.comment > .comment_title > span {
|
|
|
+ font-size: 14px;
|
|
|
+}
|
|
|
+
|
|
|
+.other_Answer {
|
|
|
+ display: flex;
|
|
|
+ margin: 5px 10px;
|
|
|
+ padding: 15px 0;
|
|
|
+ justify-content: center;
|
|
|
+}
|
|
|
+
|
|
|
+.nav {
|
|
|
+ margin-left: 5px;
|
|
|
+ width: 80%;
|
|
|
+}
|
|
|
+
|
|
|
+.nameAndTime {
|
|
|
+ display: flex;
|
|
|
+}
|
|
|
+
|
|
|
+.otherName {
|
|
|
+ font-weight: bold;
|
|
|
+ margin-left: 10px;
|
|
|
+ font-size: 13px;
|
|
|
+}
|
|
|
+
|
|
|
+.time {
|
|
|
+ margin-left: 25px;
|
|
|
+ font-size: 12px;
|
|
|
+ margin-top: 3px;
|
|
|
+}
|
|
|
+
|
|
|
+.otherAnswer {
|
|
|
+ width: 80%;
|
|
|
+ word-wrap: break-word;
|
|
|
+ word-break: break-all;
|
|
|
+ overflow: hidden;
|
|
|
+ font-size: 12px;
|
|
|
+ margin: 5px 0 0 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.doingAssess {
|
|
|
+ margin: 0 auto;
|
|
|
+ width: 300px;
|
|
|
+ background: #169bd5;
|
|
|
+ height: 35px;
|
|
|
+ line-height: 35px;
|
|
|
+ border-radius: 3px;
|
|
|
+ font-size: 13px;
|
|
|
+ text-align: center;
|
|
|
+ color: #fff;
|
|
|
+ margin-top: 30px;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+
|
|
|
+.score_top {
|
|
|
+ display: flex;
|
|
|
+ margin-bottom: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.userTou {
|
|
|
+ width: 50px;
|
|
|
+}
|
|
|
+
|
|
|
+.userTou > img {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.score_user_name {
|
|
|
+ line-height: 53px;
|
|
|
+ margin-left: 15px;
|
|
|
+}
|
|
|
+
|
|
|
+.course_top {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+
|
|
|
+.course_top > div:nth-child(1) {
|
|
|
+ line-height: 25px;
|
|
|
+}
|
|
|
+
|
|
|
+.course_top > div:nth-child(2) {
|
|
|
+ border: 1px solid #ccc;
|
|
|
+ width: 250px;
|
|
|
+ text-align: center;
|
|
|
+ height: 25px;
|
|
|
+ line-height: 25px;
|
|
|
+ margin-left: 30px;
|
|
|
+}
|
|
|
+
|
|
|
+.sd_score {
|
|
|
+ font-size: 15px;
|
|
|
+ background: #fff;
|
|
|
+ height: 100%;
|
|
|
+ padding-top: 40px;
|
|
|
+ border-radius: 5px;
|
|
|
+ width: 90%;
|
|
|
+ box-shadow: 2px 2px 5px #909090;
|
|
|
+ overflow: auto;
|
|
|
+}
|
|
|
+
|
|
|
+.sd_score .score_box {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: flex-start;
|
|
|
+ margin-bottom: 15px;
|
|
|
+ margin: 10px 0 0 30px;
|
|
|
+}
|
|
|
+.sd_score .score_box > span:nth-child(1) {
|
|
|
+ margin-right: 20px;
|
|
|
+ text-align-last: justify;
|
|
|
+ max-width: 120px;
|
|
|
+ width: 80px;
|
|
|
+ white-space: nowrap;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ word-break: break-word;
|
|
|
+}
|
|
|
+.sd_score .score_box:last-child {
|
|
|
+ margin-bottom: 0;
|
|
|
+}
|
|
|
+
|
|
|
+.rate_size >>> .el-rate__icon {
|
|
|
+ font-size: 25px;
|
|
|
+}
|
|
|
+
|
|
|
+.rate_size >>> .el-icon-star-off {
|
|
|
+ font-size: 22px;
|
|
|
+}
|
|
|
+
|
|
|
+.sd_score > span:nth-child(1) {
|
|
|
+ width: 130px;
|
|
|
+ text-align: justify;
|
|
|
+ text-align-last: justify;
|
|
|
+ display: block;
|
|
|
+ margin-right: 20px;
|
|
|
+ white-space: nowrap;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ font-size: 16px;
|
|
|
+}
|
|
|
+
|
|
|
+.moreSay {
|
|
|
+ margin: 0px 0 5px 20px;
|
|
|
+}
|
|
|
+
|
|
|
+.more_say_input {
|
|
|
+ margin-left: 20px;
|
|
|
+ width: 80%;
|
|
|
+}
|
|
|
+
|
|
|
+.more_say_input >>> .el-input__inner {
|
|
|
+ height: 75px;
|
|
|
+ font-size: 13px;
|
|
|
+ padding: 0 0 0 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.assess_right {
|
|
|
+ width: 200px;
|
|
|
+ background: #82b0ee;
|
|
|
+ color: #fff;
|
|
|
+ text-align: center;
|
|
|
+ height: 30px;
|
|
|
+ line-height: 30px;
|
|
|
+ border-radius: 5px;
|
|
|
+ margin: 0 auto;
|
|
|
+ margin-top: 20px;
|
|
|
+ font-size: 13px;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+
|
|
|
+.student_page {
|
|
|
+ margin-top: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.display {
|
|
|
+ display: none;
|
|
|
+}
|
|
|
+
|
|
|
+.firstTop {
|
|
|
+ background: #fff;
|
|
|
+ display: flex;
|
|
|
+ margin-bottom: 15px;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: flex-start;
|
|
|
+ height: 90px;
|
|
|
+ padding: 10px 25px;
|
|
|
+ border-radius: 5px;
|
|
|
+ width: 90%;
|
|
|
+ box-shadow: 2px 2px 5px #909090;
|
|
|
+}
|
|
|
+
|
|
|
+.talkScore >>> .el-dialog__body {
|
|
|
+ background: #efefef;
|
|
|
+ margin: 0 !important;
|
|
|
+}
|
|
|
+
|
|
|
+.lastTop {
|
|
|
+ background: #fff;
|
|
|
+ border-radius: 5px;
|
|
|
+ width: 98%;
|
|
|
+ height: 120px;
|
|
|
+ box-shadow: 2px 2px 5px #909090;
|
|
|
+}
|
|
|
+
|
|
|
+.left,
|
|
|
+.right {
|
|
|
+ /* background: #fff; */
|
|
|
+ border-radius: 5px;
|
|
|
+ /* padding: 10px; */
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+
|
|
|
+.left {
|
|
|
+ margin-right: 10px;
|
|
|
+ width: 30%;
|
|
|
+ min-height: 425px;
|
|
|
+}
|
|
|
+
|
|
|
+/* .left .left_top {
|
|
|
+ background: #fff;
|
|
|
+ padding: 10px;
|
|
|
+ border-radius: 5px;
|
|
|
+ margin-bottom: 15px;
|
|
|
+} */
|
|
|
+.left .left_bottom {
|
|
|
+ background: #fff;
|
|
|
+ padding: 10px;
|
|
|
+ border-radius: 5px;
|
|
|
+ height: 160px;
|
|
|
+}
|
|
|
+
|
|
|
+.right {
|
|
|
+ width: 20%;
|
|
|
+ background: none;
|
|
|
+ padding: 0;
|
|
|
+}
|
|
|
+
|
|
|
+.courseTitle {
|
|
|
+ font-size: 16px;
|
|
|
+ color: #7c7c7c;
|
|
|
+ width: 100%;
|
|
|
+ margin-bottom: 10px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+
|
|
|
+.course_t {
|
|
|
+ font-size: 19px;
|
|
|
+ display: flex;
|
|
|
+ align-items: flex-end;
|
|
|
+}
|
|
|
+
|
|
|
+.course_t span:nth-child(2) {
|
|
|
+ font-size: 16px;
|
|
|
+ margin-left: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.courseTitle span:nth-child(2) {
|
|
|
+ /* font-size: 14px;
|
|
|
+ cursor: pointer; */
|
|
|
+}
|
|
|
+
|
|
|
+.bigImg {
|
|
|
+ margin-top: 10px;
|
|
|
+ /* height: 300px; */
|
|
|
+ height: 150px;
|
|
|
+}
|
|
|
+
|
|
|
+.bigImg > img,
|
|
|
+.thumbnail > div > img {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ object-fit: contain;
|
|
|
+}
|
|
|
+
|
|
|
+.thumbnail {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ justify-content: flex-start;
|
|
|
+ margin: 5px 0 8px;
|
|
|
+ overflow-x: auto;
|
|
|
+ overflow-y: hidden;
|
|
|
+}
|
|
|
+
|
|
|
+.isClick {
|
|
|
+ border: 3px solid #5f89d4;
|
|
|
+ border-radius: 5px;
|
|
|
+}
|
|
|
+
|
|
|
+.thumbnail > div {
|
|
|
+ width: 80px;
|
|
|
+ height: 80px;
|
|
|
+ margin-right: 5px;
|
|
|
+ cursor: pointer;
|
|
|
+ flex-shrink: 0;
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+
|
|
|
+.zyBoxC {
|
|
|
+ background: #ededed;
|
|
|
+ display: flex;
|
|
|
+ align-items: flex-start;
|
|
|
+ justify-content: center;
|
|
|
+ flex-direction: column;
|
|
|
+ height: calc(100% - 50px);
|
|
|
+}
|
|
|
+
|
|
|
+.zyBox {
|
|
|
+ display: flex;
|
|
|
+ min-width: 600px;
|
|
|
+ width: 600px;
|
|
|
+ position: relative;
|
|
|
+ background: #fff;
|
|
|
+ flex-direction: column;
|
|
|
+ flex-wrap: nowrap;
|
|
|
+ align-items: flex-start;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+
|
|
|
+.zyBoxC + .zyBoxC {
|
|
|
+ margin-top: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.rbButtom {
|
|
|
+ position: absolute;
|
|
|
+ bottom: 0;
|
|
|
+ right: 0;
|
|
|
+ background: #06a7ff;
|
|
|
+ width: 100px;
|
|
|
+ height: 30px;
|
|
|
+ border-radius: 5px;
|
|
|
+ text-align: center;
|
|
|
+ color: #fff;
|
|
|
+ line-height: 30px;
|
|
|
+ font-size: 14px;
|
|
|
+ cursor: pointer;
|
|
|
+ right: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.bigImg >>> .vjs-tech,
|
|
|
+.bigImg >>> .video-js {
|
|
|
+ height: 300px !important;
|
|
|
+}
|
|
|
+
|
|
|
+.el-table >>> .even_row {
|
|
|
+ background-color: #f1f1f1;
|
|
|
+}
|
|
|
+
|
|
|
+.data_body {
|
|
|
+ height: 200px;
|
|
|
+ display: flex;
|
|
|
+ position: relative;
|
|
|
+ border-radius: 5px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ width: 100%;
|
|
|
+ background: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+.data_body .title {
|
|
|
+ position: absolute;
|
|
|
+ top: 10px;
|
|
|
+ left: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.dialog_diy >>> .el-dialog__header {
|
|
|
+ padding: 9px 20px 10px;
|
|
|
+ background: #32455b !important;
|
|
|
+}
|
|
|
+
|
|
|
+.dialog_diy >>> .el-dialog__title {
|
|
|
+ color: #fff;
|
|
|
+ font-size: 15px;
|
|
|
+}
|
|
|
+
|
|
|
+.dialog_diy >>> .el-dialog__headerbtn {
|
|
|
+ top: 14px;
|
|
|
+}
|
|
|
+
|
|
|
+.dialog_diy >>> .el-dialog__headerbtn .el-dialog__close {
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+.dialog_diy >>> .el-dialog__headerbtn .el-dialog__close:hover {
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+.dialog_diy >>> .el-dialog__body,
|
|
|
+.dialog_diy >>> .el-dialog__footer {
|
|
|
+ background: #fafafa;
|
|
|
+}
|
|
|
+
|
|
|
+.max_diy >>> .el-dialog {
|
|
|
+ /* max-width: 1200px; */
|
|
|
+ max-width: 1300px;
|
|
|
+ /* height:800px */
|
|
|
+}
|
|
|
+
|
|
|
+.max_diy >>> .el-dialog__body {
|
|
|
+ height: 800px;
|
|
|
+}
|
|
|
+
|
|
|
+.dialog_diy2 >>> .el-dialog__header {
|
|
|
+ padding: 9px 20px 10px;
|
|
|
+ background: #32455b !important;
|
|
|
+}
|
|
|
+
|
|
|
+.dialog_diy2 >>> .el-dialog__title {
|
|
|
+ color: #fff;
|
|
|
+ font-size: 15px;
|
|
|
+}
|
|
|
+
|
|
|
+.dialog_diy2 >>> .el-dialog__headerbtn {
|
|
|
+ top: 12px;
|
|
|
+}
|
|
|
+
|
|
|
+.dialog_diy2 >>> .el-dialog__headerbtn .el-dialog__close {
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+.dialog_diy2 >>> .el-dialog__headerbtn .el-dialog__close:hover {
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+.dialog_diy2 >>> .el-dialog__body,
|
|
|
+.dialog_diy2 >>> .el-dialog__footer {
|
|
|
+ background: #ededed;
|
|
|
+ padding: 15px 20px;
|
|
|
+}
|
|
|
+
|
|
|
+.a_addBox2 {
|
|
|
+ margin: 10px 0;
|
|
|
+ background: #fff;
|
|
|
+ padding: 15px;
|
|
|
+}
|
|
|
+
|
|
|
+.a_addBox {
|
|
|
+ margin: 10px 0;
|
|
|
+ background: #fff;
|
|
|
+ padding: 15px;
|
|
|
+ /* max-height: 400px; */
|
|
|
+ max-height: 160px;
|
|
|
+ overflow: auto;
|
|
|
+}
|
|
|
+
|
|
|
+.a_add_box {
|
|
|
+ border-bottom: 2px solid #eee;
|
|
|
+ padding-bottom: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.a_add_head {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ margin: 10px 0;
|
|
|
+ font-size: 18px;
|
|
|
+}
|
|
|
+
|
|
|
+.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;
|
|
|
+ /* flex-direction: column; */
|
|
|
+ /* width: 100%; */
|
|
|
+}
|
|
|
+
|
|
|
+.a_add_input >>> el-radio-group {
|
|
|
+ margin: 10px 0;
|
|
|
+}
|
|
|
+
|
|
|
+.a_add_input >>> .el-radio-group {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ flex-wrap: wrap;
|
|
|
+}
|
|
|
+
|
|
|
+.redioStyle >>> .el-radio__label {
|
|
|
+ font-size: 18px;
|
|
|
+}
|
|
|
+
|
|
|
+.task_title {
|
|
|
+ font-size: 18px;
|
|
|
+ font-weight: 700;
|
|
|
+}
|
|
|
+
|
|
|
+.ask_Answer {
|
|
|
+ /* margin-top: 10px; */
|
|
|
+}
|
|
|
+
|
|
|
+.ask_Answer_title {
|
|
|
+ font-size: 18px;
|
|
|
+}
|
|
|
+
|
|
|
+.ask_Answer_content {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ margin: 10px 0;
|
|
|
+}
|
|
|
+
|
|
|
+.answer_body {
|
|
|
+ padding: 10px 0;
|
|
|
+ border-bottom: 1px solid #f5f5f5;
|
|
|
+}
|
|
|
+
|
|
|
+.answer_title {
|
|
|
+ font-size: 15px;
|
|
|
+ font-weight: 700;
|
|
|
+}
|
|
|
+
|
|
|
+.answer_content {
|
|
|
+ margin-top: 5px;
|
|
|
+}
|
|
|
+
|
|
|
+.ask_body {
|
|
|
+ display: flex;
|
|
|
+ font-size: 16px;
|
|
|
+ margin-top: 10px;
|
|
|
+ flex-direction: column;
|
|
|
+ height: 130px;
|
|
|
+ overflow: auto;
|
|
|
+ /* padding: 0 10px; */
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+
|
|
|
+.ask_body div {
|
|
|
+ /* cursor: pointer; */
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+}
|
|
|
+
|
|
|
+.ask_body div .btn {
|
|
|
+ cursor: pointer;
|
|
|
+ color: #fff;
|
|
|
+ background-color: #409eff;
|
|
|
+ text-align: center;
|
|
|
+ font-size: 12px;
|
|
|
+ padding: 6px 12px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ border-radius: 5px;
|
|
|
+ width: 60px;
|
|
|
+}
|
|
|
+
|
|
|
+.ask_body div span:nth-child(1) {
|
|
|
+ max-width: 250px;
|
|
|
+ white-space: nowrap;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+}
|
|
|
+
|
|
|
+.ask_body div + div {
|
|
|
+ margin-top: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.work_nopicture {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ /* height: 350px; */
|
|
|
+ height: 352px;
|
|
|
+}
|
|
|
+
|
|
|
+.student_table >>> .el-table,
|
|
|
+.student_table >>> .el-table__body-wrapper {
|
|
|
+ height: auto !important;
|
|
|
+}
|
|
|
+
|
|
|
+.tx {
|
|
|
+ width: 35px;
|
|
|
+}
|
|
|
+
|
|
|
+.ech {
|
|
|
+ width: 100px;
|
|
|
+}
|
|
|
+
|
|
|
+.tx > img,
|
|
|
+.ech > img {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.txName {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ align-items: center;
|
|
|
+ margin-left: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.txName > div:nth-child(2),
|
|
|
+.txName > div:nth-child(3) {
|
|
|
+ margin-left: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.top {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ padding: 15px 0 15px 20px;
|
|
|
+ flex-direction: row;
|
|
|
+ flex-wrap: nowrap;
|
|
|
+ width: 95%;
|
|
|
+}
|
|
|
+
|
|
|
+.jdName > div:nth-child(1) {
|
|
|
+ font-size: 20px;
|
|
|
+ font-weight: bold;
|
|
|
+}
|
|
|
+
|
|
|
+.taskName {
|
|
|
+ font-size: 14px;
|
|
|
+ margin-top: 10px;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+
|
|
|
+.task {
|
|
|
+ background: #49a0f0;
|
|
|
+ color: #fff;
|
|
|
+ width: 50px;
|
|
|
+ height: 22px;
|
|
|
+ border-radius: 5px;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 22px;
|
|
|
+ margin-right: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.contentBox {
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ flex-wrap: nowrap;
|
|
|
+ align-items: flex-start;
|
|
|
+ height: 253px;
|
|
|
+}
|
|
|
+
|
|
|
+.left_top {
|
|
|
+ width: 45%;
|
|
|
+ padding-left: 20px;
|
|
|
+}
|
|
|
+
|
|
|
+.right_top {
|
|
|
+ width: 53%;
|
|
|
+}
|
|
|
+
|
|
|
+.cBox {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ flex-wrap: nowrap;
|
|
|
+ align-items: flex-start;
|
|
|
+ width: 100%;
|
|
|
+ height: calc(100% - 60px);
|
|
|
+ overflow: auto;
|
|
|
+}
|
|
|
+
|
|
|
+.right_score {
|
|
|
+ min-width: 370px;
|
|
|
+ height: 351px;
|
|
|
+ margin-left: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.pb_left {
|
|
|
+ width: 20%;
|
|
|
+ margin-right: 10px;
|
|
|
+ background: rgb(255, 255, 255);
|
|
|
+ /* padding-right: 10px; */
|
|
|
+ /* height: 500px; */
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.cTitle {
|
|
|
+ background: #205cc6;
|
|
|
+ width: 85%;
|
|
|
+ margin: 10px auto;
|
|
|
+ height: 50px;
|
|
|
+ color: #fff;
|
|
|
+ line-height: 50px;
|
|
|
+ text-align: center;
|
|
|
+ font-size: 20px;
|
|
|
+ font-weight: bold;
|
|
|
+ border-radius: 5px;
|
|
|
+ cursor: pointer;
|
|
|
+ white-space: nowrap;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ padding: 0 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.ml {
|
|
|
+ margin-left: 20px;
|
|
|
+ color: #5b7dba;
|
|
|
+ border-left: 3px solid #5b7dba;
|
|
|
+ padding-left: 5px;
|
|
|
+ font-weight: bold;
|
|
|
+}
|
|
|
+
|
|
|
+.cru_selectBox {
|
|
|
+ width: 100%;
|
|
|
+ margin: 0 auto;
|
|
|
+ overflow: auto;
|
|
|
+ height: calc(100% - 90px);
|
|
|
+ overflow-x: hidden;
|
|
|
+}
|
|
|
+
|
|
|
+.cru_selectBox::-webkit-scrollbar {
|
|
|
+ /*滚动条整体样式*/
|
|
|
+ width: 6px;
|
|
|
+ /*高宽分别对应横竖滚动条的尺寸*/
|
|
|
+ height: 6px;
|
|
|
+}
|
|
|
+
|
|
|
+/*定义滚动条轨道 内阴影+圆角*/
|
|
|
+.cru_selectBox::-webkit-scrollbar-track {
|
|
|
+ border-radius: 10px;
|
|
|
+ background-color: #b8bdc9;
|
|
|
+}
|
|
|
+
|
|
|
+/*定义滑块 内阴影+圆角*/
|
|
|
+.cru_selectBox::-webkit-scrollbar-thumb {
|
|
|
+ border-radius: 10px;
|
|
|
+ -webkit-box-shadow: inset 0 0 6px rgb(96, 125, 184);
|
|
|
+ background-color: #2c5ab3;
|
|
|
+}
|
|
|
+
|
|
|
+.blue_box_one {
|
|
|
+ text-align: center;
|
|
|
+ color: #fff;
|
|
|
+ background-image: linear-gradient(90deg, #477cd7, #65b9fc);
|
|
|
+ border-radius: 7px;
|
|
|
+ margin: 10px auto;
|
|
|
+ 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;
|
|
|
+}
|
|
|
+
|
|
|
+.twoChild {
|
|
|
+ width: 95%;
|
|
|
+ margin: 10px auto;
|
|
|
+ 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;
|
|
|
+}
|
|
|
+
|
|
|
+.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;
|
|
|
+}
|
|
|
+
|
|
|
+.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;
|
|
|
+}
|
|
|
+
|
|
|
+.navTaskname {
|
|
|
+ white-space: nowrap;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ overflow: hidden;
|
|
|
+ word-break: break-all;
|
|
|
+ padding-left: 5px;
|
|
|
+}
|
|
|
+
|
|
|
+.allBox {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ flex-wrap: nowrap;
|
|
|
+ align-items: flex-start;
|
|
|
+ width: 100%;
|
|
|
+ height: 351px;
|
|
|
+ margin-bottom: 20px;
|
|
|
+}
|
|
|
+
|
|
|
+.shuBox {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ flex-wrap: nowrap;
|
|
|
+ align-items: center;
|
|
|
+ width: 100%;
|
|
|
+ flex-wrap: nowrap;
|
|
|
+ overflow: auto;
|
|
|
+ /* height: 500px; */
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.answerbox {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ /* align-items: center; */
|
|
|
+ margin-bottom: 20px;
|
|
|
+ font-size: 18px;
|
|
|
+ font-weight: bold;
|
|
|
+}
|
|
|
+
|
|
|
+.answerbox > div:nth-child(2) {
|
|
|
+ margin-left: 15px;
|
|
|
+}
|
|
|
+
|
|
|
+.answerbox1 {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: flex-start;
|
|
|
+ flex-wrap: nowrap;
|
|
|
+ font-size: 16px;
|
|
|
+}
|
|
|
+
|
|
|
+.answerbox1 > div:nth-child(2) {
|
|
|
+ margin-top: 10px;
|
|
|
+ width: 265px;
|
|
|
+ max-height: 147px;
|
|
|
+ overflow: auto;
|
|
|
+}
|
|
|
+
|
|
|
+.jdName {
|
|
|
+ width: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.full_diy >>> .el-dialog {
|
|
|
+ margin: 0 !important;
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.full_diy >>> .el-dialog__body {
|
|
|
+ height: calc(100% - 100px);
|
|
|
+}
|
|
|
+
|
|
|
+.openTaskActive {
|
|
|
+ color: #4386e6;
|
|
|
+}
|
|
|
+
|
|
|
+.isClick {
|
|
|
+ background: #4d9def;
|
|
|
+}
|
|
|
+
|
|
|
+.buttonCss {
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ flex-wrap: nowrap;
|
|
|
+ justify-content: flex-end;
|
|
|
+ margin: 10px 0;
|
|
|
+}
|
|
|
+
|
|
|
+.fullStyle >>> .el-dialog__body {
|
|
|
+ height: 100% !important;
|
|
|
+ overflow: auto;
|
|
|
+}
|
|
|
+
|
|
|
+.fullStyle >>> .el-dialog,
|
|
|
+.fullStyle {
|
|
|
+ width: 100% !important;
|
|
|
+ max-width: 100% !important;
|
|
|
+ height: 100% !important;
|
|
|
+ margin: 0 !important;
|
|
|
+}
|
|
|
+
|
|
|
+.worksTime {
|
|
|
+ position: absolute;
|
|
|
+ top: 10px;
|
|
|
+ right: 20px;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ flex-wrap: nowrap;
|
|
|
+ align-items: baseline;
|
|
|
+}
|
|
|
+
|
|
|
+.fullBox {
|
|
|
+ /* overflow: unset !important;
|
|
|
+ height: auto !important; */
|
|
|
+}
|
|
|
+
|
|
|
+.fullZyBox {
|
|
|
+ width: 60% !important;
|
|
|
+}
|
|
|
+
|
|
|
+.rightScoreFullBox {
|
|
|
+ width: 40%;
|
|
|
+}
|
|
|
+.topButton {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ flex-wrap: nowrap;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+.topButton >>> .el-button {
|
|
|
+ color: #409eff;
|
|
|
+ border-color: #c6e2ff;
|
|
|
+ background-color: #ecf5ff;
|
|
|
+}
|
|
|
+.topButton >>> .el-button:hover {
|
|
|
+ color: #606266;
|
|
|
+ border-color: #dcdfe6;
|
|
|
+ background-color: #fff;
|
|
|
+}
|
|
|
+.radioBox {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ flex-wrap: nowrap;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+.radioBox > div {
|
|
|
+ margin: 10px 0 0 10px;
|
|
|
+}
|
|
|
+.radioBox >>> .el-radio__input,
|
|
|
+.radioBox >>> .el-checkbox__inner {
|
|
|
+ margin-left: 10px;
|
|
|
+}
|
|
|
+.radioBox >>> .el-radio,
|
|
|
+.radioBox >>> .el-checkbox {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+.inImg {
|
|
|
+ width: 100px;
|
|
|
+}
|
|
|
+.inImg > img {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ object-fit: cover;
|
|
|
+}
|
|
|
+.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,
|
|
|
+.allRightBox > span:nth-child(2) {
|
|
|
+ background: rgb(0 123 255);
|
|
|
+ color: #fff;
|
|
|
+ border-radius: 5px;
|
|
|
+ padding: 5px;
|
|
|
+ margin-left: 10px;
|
|
|
+}
|
|
|
+.allRightBox {
|
|
|
+ padding: 10px 12px;
|
|
|
+}
|
|
|
+.returnWorks >>> .el-button {
|
|
|
+ background-color: #409eff;
|
|
|
+ border-color: #409eff;
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+.cancelbox {
|
|
|
+ position: absolute;
|
|
|
+ z-index: 3;
|
|
|
+ top: 2%;
|
|
|
+ left: 50%;
|
|
|
+ width: 95%;
|
|
|
+ transform: translateX(-50%);
|
|
|
+ display: flex;
|
|
|
+ justify-content: flex-end;
|
|
|
+ padding: 0 90px 0px 0px;
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+
|
|
|
+.report_box {
|
|
|
+ height: 100%;
|
|
|
+ position: absolute;
|
|
|
+ top: 0;
|
|
|
+ /* background: #fff; */
|
|
|
+ background: rgb(231, 242, 252);
|
|
|
+ overflow: auto;
|
|
|
+ z-index: 3;
|
|
|
+ width: 100%;
|
|
|
+ left: 50%;
|
|
|
+ transform: translateX(-50%);
|
|
|
+ padding: 20px;
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+</style>
|
zengyicheng