|
|
@@ -1,580 +0,0 @@
|
|
|
-<template>
|
|
|
- <div id="classHoursReview">
|
|
|
- <div style="margin-bottom: 10px">
|
|
|
- <el-button
|
|
|
- :size="size"
|
|
|
- :type="active === 1 ? 'primary' : ''"
|
|
|
- @click="changeActive(1)"
|
|
|
- >班级学员</el-button
|
|
|
- >
|
|
|
- <el-button
|
|
|
- :size="size"
|
|
|
- :type="active === 2 ? 'primary' : ''"
|
|
|
- @click="changeActive(2)"
|
|
|
- >学时管理</el-button
|
|
|
- >
|
|
|
- </div>
|
|
|
- <div class="dis_fs">
|
|
|
- <ul class="ul_ls">
|
|
|
- <li>学员编码：{{ userData.studentCode }}</li>
|
|
|
- <li>学员姓名：{{ userData.realName }}</li>
|
|
|
- <li>学员身份证号码：{{ userData.idCard }}</li>
|
|
|
- <li>绑定手机号码：{{ userData.telPhone }}</li>
|
|
|
- </ul>
|
|
|
- <div class="photoSty1">
|
|
|
- <el-image
|
|
|
- style="width: 100%; height: 100%"
|
|
|
- :src="$methodsTools.splitImgHost(userData.oneInchPhotos)"
|
|
|
- :preview-src-list="[
|
|
|
- $methodsTools.splitImgHost(userData.oneInchPhotos),
|
|
|
- ]"
|
|
|
- >
|
|
|
- </el-image>
|
|
|
- <div class="pos_bottom">一寸头像图</div>
|
|
|
- </div>
|
|
|
- <div class="photoSty2">
|
|
|
- <el-image
|
|
|
- style="width: 100%; height: 100%"
|
|
|
- :src="$methodsTools.splitImgHost(userData.idCardImg1)"
|
|
|
- :preview-src-list="[$methodsTools.splitImgHost(userData.idCardImg1)]"
|
|
|
- >
|
|
|
- </el-image>
|
|
|
- <div class="pos_bottom">身份证正面照片</div>
|
|
|
- </div>
|
|
|
- <div class="photoSty2" style="margin-right: 0px">
|
|
|
- <el-image
|
|
|
- style="width: 100%; height: 100%"
|
|
|
- :src="$methodsTools.splitImgHost(userData.idCardImg2)"
|
|
|
- :preview-src-list="[$methodsTools.splitImgHost(userData.idCardImg2)]"
|
|
|
- >
|
|
|
- </el-image>
|
|
|
- <div class="pos_bottom">身份证背面照片</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="dis_fls">
|
|
|
- <div class="s_sd">
|
|
|
- <div class="dis_colu">
|
|
|
- <div class="jdNumSty">
|
|
|
- 视频学习进度：{{ userData.stuAllNum }}/{{ userData.secAllNum }}
|
|
|
- {{
|
|
|
- userData.stuAllNum == 0 && userData.secAllNum == 0
|
|
|
- ? "0"
|
|
|
- : (userData.stuAllNum / userData.secAllNum) * 100
|
|
|
- }}% 通过：{{ userData.pass }}节 作弊：{{ userData.cheat }}节
|
|
|
- 待审：{{ userData.pending }}节
|
|
|
- </div>
|
|
|
- <div class="jdNumSty">
|
|
|
- 做题学习进度：{{ userData.recordNum }}/{{ userData.examNum }}
|
|
|
- {{
|
|
|
- userData.recordNum == 0 && userData.examNum == 0
|
|
|
- ? "0"
|
|
|
- : (userData.recordNum / userData.examNum) * 100
|
|
|
- }}% 通过：{{ userData.pass }}节 作弊：{{ userData.cheat }}节
|
|
|
- 待审：{{ userData.pending }}节
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="shbtns">学时审批状态：待审核</div>
|
|
|
- </div>
|
|
|
- <div class="s_sd">
|
|
|
- <div class="btnStys">确定审核结果</div>
|
|
|
- <div class="btnStys">待审核全部通过</div>
|
|
|
- <div class="btnStys">待审核全部作弊</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <template v-for="(asrt, insrt) in 3">
|
|
|
- <el-table
|
|
|
- v-loading="loading"
|
|
|
- :key="insrt"
|
|
|
- :data="
|
|
|
- listData[
|
|
|
- insrt === 0
|
|
|
- ? 'tableData1'
|
|
|
- : insrt === 1
|
|
|
- ? 'tableData2'
|
|
|
- : insrt === 2
|
|
|
- ? 'tableData3'
|
|
|
- : ''
|
|
|
- ]
|
|
|
- "
|
|
|
- style="width: 100%"
|
|
|
- :default-expand-all="false"
|
|
|
- :header-cell-style="
|
|
|
- insrt === 0
|
|
|
- ? {
|
|
|
- 'background-color': 'skyblue',
|
|
|
- padding: '8px',
|
|
|
- color: '#333',
|
|
|
- }
|
|
|
- : insrt === 1
|
|
|
- ? {
|
|
|
- 'background-color': 'rgb(255,255,204)',
|
|
|
- padding: '8px',
|
|
|
- color: '#333',
|
|
|
- }
|
|
|
- : insrt === 2
|
|
|
- ? {
|
|
|
- 'background-color': '#eee',
|
|
|
- padding: '8px',
|
|
|
- color: '#333',
|
|
|
- }
|
|
|
- : ''
|
|
|
- "
|
|
|
- >
|
|
|
- <el-table-column type="expand" width="40px">
|
|
|
- <template slot-scope="scope">
|
|
|
- <ul v-if="scope.row.type === 3">
|
|
|
- <li
|
|
|
- v-for="(its, inds) in scope.row.userPeriodStatusVos[0]
|
|
|
- .userStudyRecordPhotoList"
|
|
|
- :key="inds"
|
|
|
- class="liImgs"
|
|
|
- >
|
|
|
- <img
|
|
|
- style="width: 100%; height: 100%"
|
|
|
- :src="$methodsTools.splitImgHost(its.photo)"
|
|
|
- alt=""
|
|
|
- />
|
|
|
- </li>
|
|
|
- <div style="clear: both"></div>
|
|
|
- </ul>
|
|
|
- <el-table
|
|
|
- v-else
|
|
|
- border
|
|
|
- :data="
|
|
|
- scope.row.type === 1
|
|
|
- ? scope.row.classPeriods
|
|
|
- : scope.row.type === 2
|
|
|
- ? scope.row.classPeriodSectionList
|
|
|
- : ''
|
|
|
- "
|
|
|
- style="width: 100%"
|
|
|
- :default-expand-all="false"
|
|
|
- :header-cell-style="
|
|
|
- scope.row.type === 1
|
|
|
- ? {
|
|
|
- 'background-color': 'rgb(255,255,204)',
|
|
|
- padding: '8px',
|
|
|
- color: '#333',
|
|
|
- }
|
|
|
- : scope.row.type === 2
|
|
|
- ? {
|
|
|
- 'background-color': '#eee',
|
|
|
- padding: '8px',
|
|
|
- color: '#333',
|
|
|
- }
|
|
|
- : ''
|
|
|
- "
|
|
|
- >
|
|
|
- <el-table-column type="expand">
|
|
|
- <template slot-scope="scope">
|
|
|
- <span v-if="scope.row.type === 3">节</span>
|
|
|
- <el-table
|
|
|
- v-else
|
|
|
- border
|
|
|
- :data="
|
|
|
- scope.row.type === 2
|
|
|
- ? scope.row.classPeriodSectionList
|
|
|
- : ''
|
|
|
- "
|
|
|
- style="width: 100%"
|
|
|
- :default-expand-all="false"
|
|
|
- :header-cell-style="
|
|
|
- scope.row.type === 2
|
|
|
- ? {
|
|
|
- 'background-color': '#eee',
|
|
|
- padding: '8px',
|
|
|
- color: '#333',
|
|
|
- }
|
|
|
- : ''
|
|
|
- "
|
|
|
- >
|
|
|
- <el-table-column type="expand">照片</el-table-column>
|
|
|
- <template
|
|
|
- v-for="(item, index) in scope.row.type === 2
|
|
|
- ? tableSet3
|
|
|
- : ''"
|
|
|
- >
|
|
|
- <el-table-column
|
|
|
- :width="item.width"
|
|
|
- :key="index"
|
|
|
- :label="item.label"
|
|
|
- align="center"
|
|
|
- >
|
|
|
- <template slot-scope="scope">
|
|
|
- <span v-if="item.scope === 'select'">
|
|
|
- <span v-for="(k, ds) in item.options" :key="ds">
|
|
|
- {{
|
|
|
- k.value == scope.row[item.prop] ? k.label : ""
|
|
|
- }}
|
|
|
- </span>
|
|
|
- </span>
|
|
|
- <span v-else-if="item.scope === 'aTime'">
|
|
|
- {{ $methodsTools.onlyForma(scope.row[item.prop]) }}
|
|
|
- </span>
|
|
|
- <span v-else> {{ scope.row[item.prop] }} </span>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </template>
|
|
|
- </el-table>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <template
|
|
|
- v-for="(item, index) in scope.row.type === 1
|
|
|
- ? tableSet2
|
|
|
- : scope.row.type === 2
|
|
|
- ? tableSet3
|
|
|
- : ''"
|
|
|
- >
|
|
|
- <el-table-column
|
|
|
- :width="item.width"
|
|
|
- :key="index"
|
|
|
- :label="item.label"
|
|
|
- align="center"
|
|
|
- >
|
|
|
- <template slot-scope="scope">
|
|
|
- <span v-if="item.scope === 'select'">
|
|
|
- <span v-for="(k, ds) in item.options" :key="ds">
|
|
|
- {{ k.value == scope.row[item.prop] ? k.label : "" }}
|
|
|
- </span>
|
|
|
- </span>
|
|
|
- <span v-else-if="item.scope === 'aTime'">
|
|
|
- {{ $methodsTools.onlyForma(scope.row[item.prop]) }}
|
|
|
- </span>
|
|
|
- <span v-else> {{ scope.row[item.prop] }} </span>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </template>
|
|
|
- </el-table>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <template
|
|
|
- v-for="(item, index) in insrt === 0
|
|
|
- ? tableSet1
|
|
|
- : insrt === 1
|
|
|
- ? tableSet2
|
|
|
- : insrt === 2
|
|
|
- ? tableSet3
|
|
|
- : ''"
|
|
|
- >
|
|
|
- <el-table-column
|
|
|
- :width="item.width"
|
|
|
- :key="index"
|
|
|
- :label="item.label"
|
|
|
- align="center"
|
|
|
- >
|
|
|
- <template slot-scope="scope">
|
|
|
- <span v-if="item.scope === 'select'">
|
|
|
- <span v-for="(k, ds) in item.options" :key="ds">
|
|
|
- {{ k.value == scope.row[item.prop] ? k.label : "" }}
|
|
|
- </span>
|
|
|
- </span>
|
|
|
- <div v-else-if="item.scope === 'activeNum'">123</div>
|
|
|
- <span v-else-if="item.scope === 'aTime'">
|
|
|
- {{ $methodsTools.onlyForma(scope.row[item.prop]) }}
|
|
|
- </span>
|
|
|
- <span v-else>
|
|
|
- {{ scope.row[item.prop] }}{{ item.ch ? item.ch : "" }}
|
|
|
- </span>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </template>
|
|
|
- </el-table>
|
|
|
- </template>
|
|
|
- </div>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script>
|
|
|
-export default {
|
|
|
- data() {
|
|
|
- return {
|
|
|
- size: "medium",
|
|
|
- active: "",
|
|
|
- loading: false,
|
|
|
- arr: ["tableData1", "tableData2", "tableData3"],
|
|
|
- listData: {
|
|
|
- tableData1: [],
|
|
|
- tableData2: [],
|
|
|
- tableData3: [],
|
|
|
- },
|
|
|
- userData: {},
|
|
|
- tableData: [],
|
|
|
- tableSet1: [
|
|
|
- {
|
|
|
- label: "姓名",
|
|
|
- prop: "realName",
|
|
|
- },
|
|
|
- {
|
|
|
- label: "模块标题",
|
|
|
- prop: "typeName",
|
|
|
- },
|
|
|
- {
|
|
|
- label: "学时",
|
|
|
- prop: "classHours",
|
|
|
- },
|
|
|
- ],
|
|
|
- tableSet2: [
|
|
|
- {
|
|
|
- label: "姓名",
|
|
|
- prop: "realName",
|
|
|
- },
|
|
|
- {
|
|
|
- label: "章标题",
|
|
|
- prop: "typeName",
|
|
|
- },
|
|
|
- {
|
|
|
- label: "学时",
|
|
|
- prop: "classHours",
|
|
|
- },
|
|
|
- {
|
|
|
- label: "开始学习时间",
|
|
|
- prop: "studyStartTime",
|
|
|
- scope: "aTime",
|
|
|
- },
|
|
|
- {
|
|
|
- label: "结束学习时间",
|
|
|
- prop: "studyEndTime",
|
|
|
- scope: "aTime",
|
|
|
- },
|
|
|
- {
|
|
|
- label: "测试成绩",
|
|
|
- prop: "classHours",
|
|
|
- },
|
|
|
- ],
|
|
|
- tableSet3: [
|
|
|
- {
|
|
|
- label: "选择",
|
|
|
- scope: "activeNum",
|
|
|
- },
|
|
|
- {
|
|
|
- label: "姓名",
|
|
|
- prop: "realName",
|
|
|
- },
|
|
|
- {
|
|
|
- label: "节标题",
|
|
|
- prop: "typeName",
|
|
|
- },
|
|
|
- {
|
|
|
- label: "开始学习时间",
|
|
|
- prop: "studyStartTime",
|
|
|
- scope: "aTime",
|
|
|
- },
|
|
|
- {
|
|
|
- label: "结束学习时间",
|
|
|
- prop: "studyEndTime",
|
|
|
- scope: "aTime",
|
|
|
- },
|
|
|
- {
|
|
|
- label: "审核状态",
|
|
|
- prop: "status",
|
|
|
- scope: "select",
|
|
|
- options: [
|
|
|
- {
|
|
|
- label: "通过",
|
|
|
- value: 1,
|
|
|
- },
|
|
|
- {
|
|
|
- label: "作弊",
|
|
|
- value: 0,
|
|
|
- },
|
|
|
- ],
|
|
|
- },
|
|
|
- {
|
|
|
- label: "审核时间",
|
|
|
- prop: "auditTime",
|
|
|
- scope: "aTime",
|
|
|
- },
|
|
|
- ],
|
|
|
- tableDataChild: {},
|
|
|
- tableSetChild: [],
|
|
|
- };
|
|
|
- },
|
|
|
- mounted() {
|
|
|
- this.getUserInfo();
|
|
|
- this.search();
|
|
|
- },
|
|
|
- methods: {
|
|
|
- //获取用户信息
|
|
|
- getUserInfo() {
|
|
|
- this.$api
|
|
|
- .inquireGradegradelistUserlistPeriod({
|
|
|
- userId: this.$route.query.userId,
|
|
|
- })
|
|
|
- .then((res) => {
|
|
|
- this.userData = res.rows[0];
|
|
|
- });
|
|
|
- },
|
|
|
- search() {
|
|
|
- let data = {
|
|
|
- gradeId: this.$route.query.id,
|
|
|
- userId: this.$route.query.userId,
|
|
|
- };
|
|
|
- this.loading = true;
|
|
|
- this.$api
|
|
|
- .inquireGradegradelistPeriodAudit(data)
|
|
|
- .then((res) => {
|
|
|
- let tab1 = [];
|
|
|
- let tab2 = [];
|
|
|
- let tab3 = [];
|
|
|
- for (let i = 0; i < res.rows.length; i++) {
|
|
|
- if (res.rows[i].type === 1) {
|
|
|
- tab1.push(res.rows[i]);
|
|
|
- }
|
|
|
- if (res.rows[i].type === 2) {
|
|
|
- tab2.push(res.rows[i]);
|
|
|
- }
|
|
|
- if (res.rows[i].type === 3) {
|
|
|
- tab3.push(res.rows[i]);
|
|
|
- }
|
|
|
- }
|
|
|
- this.$nextTick(() => {});
|
|
|
- this.listData.tableData1 = tab1;
|
|
|
- this.listData.tableData2 = tab2;
|
|
|
- this.listData.tableData3 = tab3;
|
|
|
- console.log(tab3);
|
|
|
- })
|
|
|
- .finally(() => {
|
|
|
- this.loading = false;
|
|
|
- });
|
|
|
- },
|
|
|
- //切换顶部BTN
|
|
|
- changeActive(int) {
|
|
|
- if (int === 1) {
|
|
|
- this.active = int;
|
|
|
- this.$router.push({
|
|
|
- path: "studentMenu",
|
|
|
- query: {
|
|
|
- id: this.$route.query.id,
|
|
|
- },
|
|
|
- });
|
|
|
- }
|
|
|
- if (int === 2) {
|
|
|
- this.active = int;
|
|
|
- this.$router.push({
|
|
|
- path: "classHours",
|
|
|
- query: {
|
|
|
- id: this.$route.query.id,
|
|
|
- },
|
|
|
- });
|
|
|
- }
|
|
|
- },
|
|
|
- },
|
|
|
-};
|
|
|
-</script>
|
|
|
-
|
|
|
-<style lang="less" scoped>
|
|
|
-.dis_fs {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- height: 211px;
|
|
|
- background-color: #eee;
|
|
|
- padding: 0px 30px;
|
|
|
- overflow: auto;
|
|
|
- .ul_ls {
|
|
|
- margin-right: 30px;
|
|
|
- align-self: flex-start;
|
|
|
- li {
|
|
|
- font-size: 14px;
|
|
|
- white-space: nowrap;
|
|
|
- margin-bottom: 14px;
|
|
|
- }
|
|
|
- }
|
|
|
- &::-webkit-scrollbar {
|
|
|
- width: 14px;
|
|
|
- height: 14px;
|
|
|
- }
|
|
|
-
|
|
|
- &::-webkit-scrollbar-track,
|
|
|
- &::-webkit-scrollbar-thumb {
|
|
|
- border-radius: 999px;
|
|
|
- border: 5px solid transparent;
|
|
|
- }
|
|
|
-
|
|
|
- &::-webkit-scrollbar-track {
|
|
|
- box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2) inset;
|
|
|
- }
|
|
|
-
|
|
|
- &::-webkit-scrollbar-thumb {
|
|
|
- min-height: 20px;
|
|
|
- background-clip: content-box;
|
|
|
- box-shadow: 0 0 0 5px rgba(0, 0, 0, 0.2) inset;
|
|
|
- }
|
|
|
-
|
|
|
- &::-webkit-scrollbar-corner {
|
|
|
- background: transparent;
|
|
|
- }
|
|
|
-}
|
|
|
-.photoSty1 {
|
|
|
- flex-shrink: 0;
|
|
|
- width: 150px;
|
|
|
- height: 160px;
|
|
|
- background-color: #fff;
|
|
|
- margin-right: 60px;
|
|
|
- position: relative;
|
|
|
-}
|
|
|
-.photoSty2 {
|
|
|
- position: relative;
|
|
|
- flex-shrink: 0;
|
|
|
- width: 230px;
|
|
|
- height: 160px;
|
|
|
- margin-right: 60px;
|
|
|
- background-color: #fff;
|
|
|
-}
|
|
|
-.pos_bottom {
|
|
|
- position: absolute;
|
|
|
- height: 20px;
|
|
|
- bottom: 0px;
|
|
|
- left: 0px;
|
|
|
- right: 0px;
|
|
|
- background-color: rgba(0, 0, 0, 0.8);
|
|
|
- text-align: center;
|
|
|
- line-height: 20px;
|
|
|
- font-size: 14px;
|
|
|
- color: #fff;
|
|
|
-}
|
|
|
-.dis_fls {
|
|
|
- margin: 16px 0px;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: space-between;
|
|
|
- flex-wrap: wrap;
|
|
|
- .s_sd {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- flex-shrink: 0;
|
|
|
- margin-bottom: 10px;
|
|
|
- .dis_colu {
|
|
|
- height: 55px;
|
|
|
- margin-right: 14px;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- justify-content: space-around;
|
|
|
- font-size: 14px;
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-.jdNumSty {
|
|
|
- border: 1px solid #000;
|
|
|
-}
|
|
|
-.shbtns {
|
|
|
- padding: 0px 10px;
|
|
|
- height: 55px;
|
|
|
- line-height: 55px;
|
|
|
- background-color: #eee;
|
|
|
- border-radius: 6px;
|
|
|
-}
|
|
|
-.btnStys {
|
|
|
- border: 1px solid #666;
|
|
|
- padding: 0px 8px;
|
|
|
- border-radius: 4px;
|
|
|
- font-size: 15px;
|
|
|
- margin-right: 8px;
|
|
|
- cursor: pointer;
|
|
|
-}
|
|
|
-.liImgs {
|
|
|
- float: left;
|
|
|
- width: 100px;
|
|
|
- height: 100px;
|
|
|
- margin-right: 10px;
|
|
|
- margin-bottom: 10px;
|
|
|
-}
|
|
|
-</style>
|
