|
@@ -1,347 +0,0 @@
|
|
|
-<template>
|
|
|
- <div id="hoursTimesRecord">
|
|
|
- <StudentInfo :userData="userData"></StudentInfo>
|
|
|
- <div style="margin-top: 12px; overflow: auto; height: 100%">
|
|
|
- <el-table
|
|
|
- v-loading="loading"
|
|
|
- ref="multipleTable"
|
|
|
- :data="tableData"
|
|
|
- border
|
|
|
- :header-cell-style="{
|
|
|
- 'background-color': '#eee',
|
|
|
- padding: '8px',
|
|
|
- color: '#333',
|
|
|
- }"
|
|
|
- >
|
|
|
- <el-table-column
|
|
|
- v-for="(item, index) in tableList"
|
|
|
- :width="item.width"
|
|
|
- :key="index"
|
|
|
- :label="item.label"
|
|
|
- align="center"
|
|
|
- :show-overflow-tooltip="true"
|
|
|
- header-align="center"
|
|
|
- >
|
|
|
- <template slot-scope="scope">
|
|
|
- <span v-if="item.scope === 'status'">
|
|
|
- {{
|
|
|
- scope.row[item.prop] === 1
|
|
|
- ? "有效"
|
|
|
- : scope.row[item.prop] === 0
|
|
|
- ? "无效"
|
|
|
- : "未知"
|
|
|
- }}
|
|
|
- </span>
|
|
|
- <div v-else-if="item.scope === 'moreTime'">
|
|
|
- {{ $methodsTools.onlyForma(scope.row[item.prop1]) }} -
|
|
|
- {{ $methodsTools.onlyForma(scope.row[item.prop2]) }}
|
|
|
- </div>
|
|
|
- <span v-else-if="item.scope === 'durationTime'">
|
|
|
- {{ $methodsTools.secondToDate(scope.row[item.prop], false) }}
|
|
|
- </span>
|
|
|
- <span v-else-if="item.scope === 'score'">
|
|
|
- {{ scope.row[item.prop] ? scope.row[item.prop] + "分" : "" }}
|
|
|
- </span>
|
|
|
- <span v-else>{{ scope.row[item.prop] }}</span></template
|
|
|
- >
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
- <!-- <pagination
|
|
|
- :total="total"
|
|
|
- :pageSize="formData.pageSize"
|
|
|
- :currentPage="formData.pageNum"
|
|
|
- @handleSizeChange="handleSizeChange"
|
|
|
- @handleCurrentChange="handleCurrentChange"
|
|
|
- /> -->
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script>
|
|
|
-import pagination from "@/components/pagination";
|
|
|
-import StudentInfo from "@/components/Study/StudentInfo.vue";
|
|
|
-export default {
|
|
|
- components: { pagination, StudentInfo },
|
|
|
- props: {
|
|
|
- objs: {
|
|
|
- type: Object,
|
|
|
- default: {},
|
|
|
- },
|
|
|
- },
|
|
|
- data() {
|
|
|
- return {
|
|
|
- size: "medium",
|
|
|
- active: "",
|
|
|
- loading: false,
|
|
|
- studentCode: "",
|
|
|
- realName: "",
|
|
|
- idCard: "",
|
|
|
- telPhone: "",
|
|
|
- recent_photos: "",
|
|
|
- idcard_face_photo: "",
|
|
|
- idcard_national_photo: "",
|
|
|
- userData: {},
|
|
|
- tableList: [
|
|
|
- {
|
|
|
- label: "模块标题",
|
|
|
- prop: "moduleName",
|
|
|
- },
|
|
|
- {
|
|
|
- label: "章标题",
|
|
|
- prop: "chapterName",
|
|
|
- },
|
|
|
- {
|
|
|
- label: "节标题",
|
|
|
- prop: "sectionName",
|
|
|
- },
|
|
|
- {
|
|
|
- label: "节时长(秒)",
|
|
|
- prop: "durationTime",
|
|
|
- scope: "durationTime",
|
|
|
- },
|
|
|
- {
|
|
|
- label: "学习/做题时间",
|
|
|
- prop1: "studyStartTime",
|
|
|
- prop2: "studyEndTime",
|
|
|
- scope: "moreTime",
|
|
|
- width: "310px",
|
|
|
- },
|
|
|
- {
|
|
|
- label: "学习/做题时长",
|
|
|
- prop: "studyTimeLongTxt",
|
|
|
- },
|
|
|
- {
|
|
|
- label: "学习/做题状态",
|
|
|
- prop: "studyStatusTxt",
|
|
|
- },
|
|
|
- {
|
|
|
- label: "测试成绩",
|
|
|
- prop: "score",
|
|
|
- scope: "score",
|
|
|
- },
|
|
|
- ],
|
|
|
- tableData: [],
|
|
|
- formData: {
|
|
|
- // pageSize: 10,
|
|
|
- // pageNum: 1,
|
|
|
- },
|
|
|
- total: 0,
|
|
|
- showBox: true,
|
|
|
- };
|
|
|
- },
|
|
|
- mounted() {
|
|
|
- this.getUserInfo();
|
|
|
- this.search();
|
|
|
- },
|
|
|
- methods: {
|
|
|
- // handleSizeChange(v) {
|
|
|
- // this.formData.pageSize = v;
|
|
|
- // this.formData.pageNum = 1;
|
|
|
- // this.search();
|
|
|
- // },
|
|
|
- // handleCurrentChange(v) {
|
|
|
- // this.formData.pageNum = v;
|
|
|
- // this.search();
|
|
|
- // },
|
|
|
- //获取用户信息
|
|
|
- getUserInfo() {
|
|
|
- this.$api
|
|
|
- .inquireGradegradelistUserlistPeriod({
|
|
|
- gradeId: this.objs.gradeId,
|
|
|
- userId: this.objs.userId,
|
|
|
- goodsId: this.objs.goodsId,
|
|
|
- })
|
|
|
- .then((res) => {
|
|
|
- if (res.rows[0].keyValue) {
|
|
|
- var data = JSON.parse(res.rows[0].keyValue);
|
|
|
- this.recent_photos = data.recent_photos
|
|
|
- ? data.recent_photos.value
|
|
|
- : "";
|
|
|
- this.idcard_face_photo = data.idcard_face_photo
|
|
|
- ? data.idcard_face_photo.value
|
|
|
- : "";
|
|
|
- this.idcard_national_photo = data.idcard_national_photo
|
|
|
- ? data.idcard_national_photo.value
|
|
|
- : "";
|
|
|
- this.realName = data.name.value;
|
|
|
- this.idCard = data.idcard.value;
|
|
|
- this.telPhone = data.telphone.value;
|
|
|
- }
|
|
|
- this.userData = res.rows[0];
|
|
|
- });
|
|
|
- },
|
|
|
- search() {
|
|
|
- this.loading = true;
|
|
|
- let data = {
|
|
|
- gradeId: this.objs.gradeId,
|
|
|
- userId: this.objs.userId,
|
|
|
- goodsId: this.objs.goodsId,
|
|
|
- // pageSize: this.formData.pageSize,
|
|
|
- // pageNum: this.formData.pageNum,
|
|
|
- };
|
|
|
- this.$api
|
|
|
- .gradegradelistUserStudyRecord(data)
|
|
|
- .then((res) => {
|
|
|
- this.tableData = res.rows;
|
|
|
- this.total = res.total;
|
|
|
- })
|
|
|
- .finally(() => {
|
|
|
- this.loading = false;
|
|
|
- });
|
|
|
- },
|
|
|
- },
|
|
|
-};
|
|
|
-</script>
|
|
|
-
|
|
|
-<style lang="less" scoped>
|
|
|
-#hoursTimesRecord {
|
|
|
- max-height: 70vh;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
-}
|
|
|
-.btn_styleShow {
|
|
|
- float: right;
|
|
|
-}
|
|
|
-.styFlex {
|
|
|
- width: 80px;
|
|
|
- text-align: center;
|
|
|
-}
|
|
|
-.btnstyles {
|
|
|
- margin-left: 0px;
|
|
|
- margin-bottom: 10px;
|
|
|
-}
|
|
|
-.dis_flexs {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
-}
|
|
|
-.dis_fs {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- height: 211px;
|
|
|
- background-color: #eee;
|
|
|
- padding: 0px 30px;
|
|
|
- overflow: auto;
|
|
|
- flex-shrink: 0;
|
|
|
- .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;
|
|
|
- border-radius: 6px;
|
|
|
- padding: 6px;
|
|
|
-}
|
|
|
-.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: 250px;
|
|
|
- height: 250px;
|
|
|
- margin-right: 20px;
|
|
|
- margin-bottom: 20px;
|
|
|
- position: relative;
|
|
|
- .abos {
|
|
|
- position: absolute;
|
|
|
- bottom: 0px;
|
|
|
- width: 100%;
|
|
|
- height: 44px;
|
|
|
- line-height: 44px;
|
|
|
- font-size: 16px;
|
|
|
- color: #000;
|
|
|
- text-align: center;
|
|
|
- background-color: rgba(90, 90, 90, 0.7);
|
|
|
- }
|
|
|
-}
|
|
|
-</style>
|