From c3bb35b20d6e076f73a1cad50fd6b9b94ca399a7 Mon Sep 17 00:00:00 2001 From: zhouwx <1175765986@qq.com> Date: 星期一, 06 一月 2025 16:15:05 +0800 Subject: [PATCH] Merge remote-tracking branch 'origin/master' --- src/views/onlineEducation/realtimeStatus/index.vue | 450 +++++++++++++++++++++---------------------------------- 1 files changed, 172 insertions(+), 278 deletions(-) diff --git a/src/views/onlineEducation/realtimeStatus/index.vue b/src/views/onlineEducation/realtimeStatus/index.vue index eaa3cb1..0bb4f9c 100644 --- a/src/views/onlineEducation/realtimeStatus/index.vue +++ b/src/views/onlineEducation/realtimeStatus/index.vue @@ -29,47 +29,86 @@ </div> </div> <!-- 查询数据--> - <div style="margin: 30px 20%" > - <div v-if="data"> + <div style="margin: 30px 10%" > + <div v-if="show"> <div style="display: flex;align-items: center;margin-bottom: -15px" > <span style="font-size: 18px;font-weight: 550">姓名:</span> <span style="font-size: 17px;margin-right: 60px">{{data.name}}</span> - <span style="font-size: 18px;font-weight: 550">查询平台:</span> - <span style="font-size: 17px">{{data.institutionalName}}</span> +<!-- <span style="font-size: 18px;font-weight: 550">查询平台:</span>--> +<!-- <span style="font-size: 17px">{{data.institutionalName}}</span>--> </div> <el-divider></el-divider> <div> <div v-for="(batch,index) in data.batchList" :key="index" > - <div style="display: flex;align-items: center;margin-bottom: -15px" > - <span style="font-size: 18px">班级(批次):</span> - <span style="font-size: 16px;margin-right: 60px">{{batch.batchName}}</span> - <span style="font-size: 18px">创建时间:</span> - <span style="font-size: 16px">{{batch.createTime}}</span> - </div> - <div v-for="(course,index) in batch.courseList" :key="index" style="margin-top: 40px;margin-bottom: 50px"> - <div style="margin-bottom: -15px;display: flex;justify-content: space-between" > - <div style="display: flex;align-items: center;"> - <span style="font-size: 18px">课程名称:</span> - <span style="font-size: 16px;margin-right: 60px">{{course.courseName}}</span> - <span style="font-size: 18px">总学时:</span> - <span style="font-size: 16px;margin-right: 60px">{{course.lessonNum}}</span> - <span style="font-size: 18px">当前学时:</span> - <span style="font-size: 16px;margin-right: 60px">{{course.duration}}</span> - </div> - <el-progress :percentage="course.durationRate" style="width: 250px" ></el-progress> +<!-- <div style="display: flex;align-items: center;margin-bottom: -15px" >--> + <el-form :model="batch" size="default" ref="busRef" style="display: flex" label-width="95px"> + <el-form-item label="班级(批次):"> + <span>{{batch.batchName}}</span> + </el-form-item> + <el-form-item label="创建时间:"> + <span>{{batch.createTime}}</span> + </el-form-item> + </el-form> +<!-- <span style="font-size: 18px">班级(批次):</span>--> +<!-- <span style="font-size: 16px;margin-right: 60px">{{batch.batchName}}</span>--> +<!-- <span style="font-size: 18px">创建时间:</span>--> +<!-- <span style="font-size: 16px">{{batch.createTime}}</span>--> +<!-- </div>--> + <div v-for="(course,index) in batch.courseList" :key="index" > + <div style="display: flex;justify-content: space-between"> + <el-form :model="course" size="default" ref="busRef" style="display: flex;align-items: center" label-width="95px"> + <el-form-item label="课程名称:"> + <span>{{course.courseName}}</span> + </el-form-item> + <el-form-item label="总学时:"> + <span>{{course.courseLessonNum}}</span> + </el-form-item> + <el-form-item label="当前学时:"> + <span>{{course.coCompleteLessonNum}}</span> + </el-form-item> + </el-form> + <el-progress :percentage="course.durationRate" style="width: 250px;margin-top: 5px" :text-inside="true" :stroke-width="23"></el-progress> </div> - <div v-for="(chapter,index) in course.chapterList" :key="index" style="margin-top: 50px;margin-left: 40px;"> - <div style="margin-bottom: -15px;display: flex;justify-content: space-between" > - <div style="display: flex;align-items: center" > - <span style="font-size: 16px;margin-right: 60px">{{chapter.chapterName}}</span> - <span style="font-size: 16px">总时长:</span> - <span style="font-size: 16px;margin-right: 60px">{{chapter.lessonTocal}}</span> - <span style="font-size: 16px"> 已学时长:</span> - <span style="font-size: 16px">{{chapter.lessonNum}}</span> - </div> - <span v-if="chapter.lessonTocal == chapter.lessonNum " style="color: #13ce66">[已完成]</span> + +<!-- <div style="margin-bottom: -15px;display: flex;justify-content: space-between" >--> +<!-- <div style="display: flex;align-items: center;">--> +<!-- <span style="font-size: 18px">课程名称:</span>--> +<!-- <span style="font-size: 16px;margin-right: 60px">{{course.courseName}}</span>--> +<!-- <span style="font-size: 18px">总学时:</span>--> +<!-- <span style="font-size: 16px;margin-right: 60px">{{course.courseLessonNum}}</span>--> +<!-- <span style="font-size: 18px">当前学时:</span>--> +<!-- <span style="font-size: 16px;margin-right: 60px">{{course.coCompleteLessonNum}}</span>--> +<!-- </div>--> +<!-- <el-progress :percentage="course.durationRate" style="width: 250px" ></el-progress>--> +<!-- </div>--> + <div v-for="(chapter,index) in course.chapterList" :key="index"> + <div style="display: flex;justify-content: space-between"> + <el-form :model="chapter" size="default" ref="busRef" style="display: flex;align-items: center" label-width="95px"> + <el-form-item> + <span>{{chapter.chapterName}}</span> + </el-form-item> + <el-form-item label="总时长:"> + <span>{{dayjs.duration(chapter.chapterDuration,'seconds').format('HH:mm:ss')}}</span> + </el-form-item> + <el-form-item label="已学时长:"> + <span>{{dayjs.duration(chapter.chCompleteDuration,'seconds').format('HH:mm:ss')}}</span> + </el-form-item> + </el-form> + <span v-if="chapter.chapterStatus == 1 " style="color: #13ce66">[已完成]</span> <span v-else style="color: #1890ff">[学习中]</span> </div> + +<!-- <div style="margin-bottom: -15px;display: flex;justify-content: space-between" >--> +<!-- <div style="display: flex;align-items: center" >--> +<!-- <span style="font-size: 16px;margin-right: 60px">{{chapter.chapterName}}</span>--> +<!-- <span style="font-size: 16px">总时长:</span>--> +<!-- <span style="font-size: 16px;margin-right: 60px">{{chapter.chapterLessonNum}}</span>--> +<!-- <span style="font-size: 16px"> 已学时长:</span>--> +<!-- <span style="font-size: 16px">{{chapter.lessonNum}}</span>--> +<!-- </div>--> +<!-- <span v-if="chapter.chapterStatus == 1 " style="color: #13ce66">[已完成]</span>--> +<!-- <span v-else style="color: #1890ff">[学习中]</span>--> +<!-- </div>--> </div> </div> <el-divider></el-divider> @@ -81,7 +120,7 @@ v-show="total>0" :total="total" :layout="layout" - :page.sync="queryParams.pageIndex" + :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList" /> @@ -95,271 +134,121 @@ import studentList from '@/views/onlineEducation/count/components/studentList.vue' import { delJobRegist } from '@/api/coalMine/jobRegist' import { listPlat, listPlatSelect } from '@/api/onlineEducation/plat' -import { listCourse } from '@/api/onlineEducation/course' +import { listCourse, realTimeQuery } from '@/api/onlineEducation/course' +import dayjs from 'dayjs' +import duration from 'dayjs/plugin/duration' +dayjs.extend(duration); export default { name: "nPeopleManage", dicts: [], components: { courseDialog,studentList}, data() { return { - total: 2, + dayjs:dayjs, + total: 0, platformList: [], - data: {}, + data: { + idcard: '620202199001060217 ', + batchList: [] + }, queryParams: { - pageIndex: 1, - pageSize: 2, + pageNum: 1, + pageSize: 10, institutionId: '', idcard: '' }, - layout: 'total,prev, pager, next, jumper' + layout: 'total,prev, pager, next, jumper', + show:false + }; }, created() { this.getPlat(); - this.getList(); + // this.getList(); }, methods: { getList(){ console.log("111",this.queryParams) - this.data = - { - id: null, - idcard: '11111', - name: '李四', - institutionalName: '链工宝', - batchList: [ - { - batchName: 'xxxx', - createTime: 'xxxx', - courseList: [ - { - courseName: 'xx', - lessonNum: 100, - duration: 90, - durationRate: 90, - chapterList: [ - { - chapterName: '第5章:章节名称', - lessonTocal: 20, - lessonNum: 10 - }, - { - chapterName: '第1章:章节名称', - lessonTocal: 80, - lessonNum: 80 - }, - ] - }, - { - courseName: 'xx', - lessonNum: 100, - duration: 90, - durationRate: 90, - chapterList: [ - { - chapterName: '第5章:章节名称', - lessonTocal: 20, - lessonNum: 10 - }, - { - chapterName: '第1章:章节名称', - lessonTocal: 80, - lessonNum: 80 - }, - ] - } - ] - }, - { - batchName: 'xxxx', - createTime: 'xxxx', - courseList: [ - { - courseName: 'xx', - lessonNum: 100, - duration: 90, - durationRate: 90, - chapterList: [ - { - chapterName: '第5章:章节名称', - lessonTocal: 20, - lessonNum: 10 - }, - { - chapterName: '第1章:章节名称', - lessonTocal: 80, - lessonNum: 80 - }, - ] - }, - { - courseName: 'xx', - lessonNum: 100, - duration: 90, - durationRate: 90, - chapterList: [ - { - chapterName: '第5章:章节名称', - lessonTocal: 20, - lessonNum: 10 - }, - { - chapterName: '第1章:章节名称', - lessonTocal: 80, - lessonNum: 80 - }, - ] - } - ] - }, - { - batchName: 'xxxx', - createTime: 'xxxx', - courseList: [ - { - courseName: 'xx', - lessonNum: 100, - duration: 90, - durationRate: 90, - chapterList: [ - { - chapterName: '第5章:章节名称', - lessonTocal: 20, - lessonNum: 10 - }, - { - chapterName: '第1章:章节名称', - lessonTocal: 80, - lessonNum: 80 - }, - ] - }, - { - courseName: 'xx', - lessonNum: 100, - duration: 90, - durationRate: 90, - chapterList: [ - { - chapterName: '第5章:章节名称', - lessonTocal: 20, - lessonNum: 10 - }, - { - chapterName: '第1章:章节名称', - lessonTocal: 80, - lessonNum: 80 - }, - ] - } - ] - }, - { - batchName: 'xxxx', - createTime: 'xxxx', - courseList: [ - { - courseName: 'xx', - lessonNum: 100, - duration: 90, - durationRate: 90, - chapterList: [ - { - chapterName: '第5章:章节名称', - lessonTocal: 20, - lessonNum: 10 - }, - { - chapterName: '第1章:章节名称', - lessonTocal: 80, - lessonNum: 80 - }, - ] - }, - { - courseName: 'xx', - lessonNum: 100, - duration: 90, - durationRate: 90, - chapterList: [ - { - chapterName: '第5章:章节名称', - lessonTocal: 20, - lessonNum: 10 - }, - { - chapterName: '第1章:章节名称', - lessonTocal: 80, - lessonNum: 80 - }, - ] - } - ] - } - - ] - } - // { - // id: null, - // idcard: '11111', - // name: '李四', - // institutionalName: '链工宝', - // batchList: [ - // { - // batchName: 'xxxx', - // createTime: 'xxxx', - // courseList: [ - // { - // courseName: 'xx', - // lessonNum: 100, - // duration: 90, - // durationRate: 90, - // chapterList: [ - // { - // chapterName: '第5章:章节名称', - // lessonTocal: 20, - // lessonNum: 10 - // }, - // { - // chapterName: '第1章:章节名称', - // lessonTocal: 80, - // lessonNum: 80 - // }, - // ] - // }, - // { - // courseName: 'xx', - // lessonNum: 100, - // duration: 90, - // durationRate: 90, - // chapterList: [ - // { - // chapterName: '第5章:章节名称', - // lessonTocal: 20, - // lessonNum: 10 - // }, - // { - // chapterName: '第1章:章节名称', - // lessonTocal: 80, - // lessonNum: 80 - // }, - // ] - // } - // ] - // } - // ] - // } - this.total = 4; - // listCourse( this.queryParams).then((res) => { - // if (res.code == 200) { - // this.expertList = res.rows.map(item => { - // return { - // ...item, - // courseNum: item.outline ? item.outline.length : '' + // this.data = + // { + // id: null, + // idcard: '11111', + // name: '李四', + // institutionalName: '链工宝', + // batchList: [ + // { + // batchName: 'xxxx', + // createTime: 'xxxx', + // courseList: [ + // { + // courseName: 'xx', + // lessonNum: 100, + // duration: 90, + // durationRate: 90, + // chapterList: [ + // { + // chapterName: '第5章:章节名称', + // lessonTocal: 20, + // lessonNum: 10 + // }, + // { + // chapterName: '第1章:章节名称', + // lessonTocal: 80, + // lessonNum: 80 + // }, + // ] + // }, + // { + // courseName: 'xx', + // lessonNum: 100, + // duration: 90, + // durationRate: 90, + // chapterList: [ + // { + // chapterName: '第5章:章节名称', + // lessonTocal: 20, + // lessonNum: 10 + // }, + // { + // chapterName: '第1章:章节名称', + // lessonTocal: 80, + // lessonNum: 80 + // }, + // ] + // } + // ] + // }, + // + // ] // } - // }) - // } - // }) + // this.total = 1; + realTimeQuery( this.queryParams).then((res) => { + if (res.code == 200) { + this.data = res.data + if(res.data ){ + const batchList = res.data.batchList?.map(item => { + return { + ...item, + courseList:item.courseList.map(c => { + return { + ...c, + durationRate: Math.round( c.coCompleteLessonNum/c.courseLessonNum *10000 ) /100 + + } + }) + } + }) + this.data.batchList = batchList + this.show = true + }else { + this.show = false + } + + + // this.total = res.total + } + console.log('res',this.data) + }) }, getPlat() { listPlatSelect().then((res) => { @@ -376,7 +265,7 @@ }, resetQuery(){ this.queryParams = { - pageIndex: 1, + pageNum: 1, pageSize: 10, institutionId: '', idcard: '' @@ -387,3 +276,8 @@ } }; </script> +<style lang="scss" scoped> +::v-deep .el-form-item__content{ + font-size: 16px; +} +</style> -- Gitblit v1.9.2