马宇豪
2025-03-04 509f1d71c91242b11fd287cfcdeafe3d19b2d807
src/views/onlineEducation/learnRecord/index.vue
@@ -1,13 +1,57 @@
<template>
  <div class="app-container">
    <el-table v-loading="loading" :data="expertList">
    <el-radio-group v-model="queryParams.status" @change="changeTimeStatus" style="margin-bottom: 10px">
      <el-radio-button label="0">全部</el-radio-button>
      <el-radio-button label="2">异常记录</el-radio-button>
      <el-radio-button label="1">正常记录</el-radio-button>
    </el-radio-group>
    <div style="margin-bottom: 10px">
      <el-select v-model="queryParams.institutionId" placeholder="请选择平台" style="margin-right: 10px">
        <el-option
          v-for="item in platformList"
          :key="item.id"
          :label="item.institutionalName"
          :value="item.id">
        </el-option>
      </el-select>
      <el-input
        v-model="queryParams.idcard"
        placeholder="请输入身份证号"
        clearable
        style="width: 300px;margin-right: 10px"
      />
      <el-date-picker
        v-model="dateValue"
        value-format="yyyy-MM-dd HH:mm:ss"
        type="datetimerange"
        range-separator="-"
        start-placeholder="开始日期"
        end-placeholder="结束日期"
        style="width: 380px"
      ></el-date-picker>
      <el-button
        size="small"
        type="primary"
        style="margin-bottom: 10px;margin-left: 20px"
        @click="handleQuery()"
      >查询
      </el-button>
      <el-button
        size="small"
        type="primary"
        style="margin-bottom: 10px"
        @click="resetQuery()"
      >重置
      </el-button>
    </div>
    <el-table v-loading="loading" :data="expertList" :row-class-name="tableAddClass">
      <el-table-column label="记录编号" align="center" prop="id" />
      <el-table-column label="身份证号" align="center" prop="idcard" :show-overflow-tooltip="true" />
      <el-table-column label="上报平台" align="center" prop="institutionName" />
      <el-table-column label="所属培训机构" align="center" prop="trainOrgName" />
      <el-table-column label="班级批次" align="center" prop="batchName" />
      <el-table-column label="课程" align="center" prop="courseName" />
      <el-table-column label="章节" align="center" prop="catalogName" />
      <el-table-column label="章节" align="center" prop="chapterName" />
      <el-table-column label="学习时长" align="center" prop="durationDesc" />
      <el-table-column label="是否彻底完成" align="center" prop="finishStatus" >
        <template #default="scope">
@@ -28,7 +72,7 @@
    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryParams.pageIndex"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />
@@ -39,6 +83,8 @@
<script>
import detailDialog from './components/detailDialog.vue'
import { listRecord, listStudent } from '@/api/onlineEducation/student'
import Cookies from 'js-cookie'
import {listPlatSelect} from "@/api/onlineEducation/plat";
export default {
  name: "nPeopleManage",
  dicts: [],
@@ -53,38 +99,71 @@
      total: 0,
      expertTypes: [],
      expertList: [],
      platformList: [],
      dateValue: [],
      queryParams: {
        pageIndex: 1,
        pageSize: 10
        pageNum: 1,
        pageSize: 10,
        status: 0,
        institutionId: null,
        idcard: '',
        startTime: '',
        endTime: ''
      },
    };
  },
  created() {
    this.getList({});
      this.getList()
      this.getPlat()
  },
  methods: {
    getList(data){
      if(data){
        this.queryParams.idcard = data.idcard
        this.expertList = []
      }
      this.loading = true;
    getList(){
      this.loading = true
      this.queryParams.startTime = this.dateValue[0]?this.dateValue[0]:''
      this.queryParams.endTime = this.dateValue[1]?this.dateValue[1]:''
      listRecord( this.queryParams).then((res) => {
        if (res.code == 200) {
          this.expertList = res.rows
          this.total = res.total
          this.loading = false;
          this.loading = false
        }
      })
    },
    getPlat() {
      listPlatSelect().then((res) => {
        if (res.code == 200) {
          this.platformList = res.data
        }
      })
    },
    changeTimeStatus(val) {
      this.getList()
    },
    tableAddClass({ row, rowIndex }) {
      if (row.difference < row.duration) {
        return "tr-red";
      }
      return "";
    },
    handleChange(){
    },
    handleQuery(){
      this.queryParams.pageNum = 1
      this.getList();
    },
    resetQuery(){
      this.queryParams = {
        pageNum: 1,
        pageSize: 10,
        status: 0,
        institutionId: null,
        idcard: '',
        startTime: '',
        endTime: ''
      }
      this.dateValue = []
      this.getList()
    },
    handleView(data){
      this.$refs.detailDialogRef.openDialog(data);
@@ -92,3 +171,9 @@
  }
};
</script>
<style scoped>
.app-container /deep/ .el-table .tr-red {
  color: red !important;
}
</style>