新增学时证书管理空页面

马宇豪

2024-10-11 bd60fa52fe36c8444e89f3c85dae1201e4c399a8

新增学时证书管理空页面

 src/views/onlineEducation/classCertManage/index.vue

对比新文件
@@ -0,0 +1,173 @@
<template>
  <div class="app-container">
    <div style="margin-left: -35px;margin-top: 15px">
      <el-button
        size="small"
        type="primary"
        style="margin-bottom: 10px;margin-left: 20px"
      >批量导出</el-button>
      <el-date-picker
        v-model="time"
        size="small"
        type="daterange"
        range-separator="至"
        start-placeholder="开始日期"
        end-placeholder="结束日期"
        format="yyyy-MM-dd"
        style="margin-left: 30px;"
      >
      </el-date-picker>
      <el-select v-model="queryParams.institutionId"  size="small" style="margin-left: 40px;" placeholder="请选择平台">
        <el-option
          v-for="item in platformList"
          :key="item.id"
          :label="item.institutionalName"
          :value="item.id">
        </el-option>
      </el-select>
      <el-select v-model="queryParams.trainOrgId"  size="small" style="margin-left: 40px;" placeholder="请选择培训机构">
        <el-option
          v-for="item in trainOrgList"
          :key="item.id"
          :label="item.trainOrgName"
          :value="item.id">
        </el-option>
      </el-select>
      <el-button
        size="small"
        type="primary"
        style="margin-bottom: 10px;margin-left: 20px"
        @click="handleQuery()"
      >查询</el-button>
      <el-button
        plain
        size="small"
        type="primary"
        style="margin-bottom: 10px"
        @click="resetQuery()"
      >重置</el-button>
    </div>
    <el-table v-loading="loading" :data="expertList" style="margin-top: 10px">
      <el-table-column type="selection" width="55"></el-table-column>
      <el-table-column label="ID" align="center" prop="id" />
      <el-table-column label="姓名" align="center" prop="name" />
      <el-table-column label="身份证号" align="center" prop="idCard" />
      <el-table-column label="推送平台" align="center" prop="institutionName" />
      <el-table-column label="所属机构" align="center" prop="trainOrgName" />
      <el-table-column label="批次" align="center" prop="batch" />
      <el-table-column label="证书生成时间" align="center" prop="certCreateTime" />
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
        <template #default="scope">
          <el-button size="mini" type="text" style="color: #1890ff">查看</el-button>
          <el-button size="mini" type="text" style="color: #1890ff">下载</el-button>
          <el-button size="mini" type="text" style="color: #1890ff">打印</el-button>
        </template>
      </el-table-column>
    </el-table>
    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />
  </div>
</template>

<script>
import { listBatch, listQuestion } from '@/api/onlineEducation/student'
import { listPlatSelect } from '@/api/onlineEducation/plat'
import moment from 'moment/moment'
import { getSubject } from '@/api/onlineEducation/count'
export default {
  name: "nPeopleManage",
  dicts: [],
  components: { },
  data() {
    return {
      time: [],
      loading: false,
      single: true,
      multiple: true,
      showSearch: true,
      addForm: false,
      total: 0,
      platformList: [],
      expertList: [],
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        institutionId: '',
        startTime: '',
        endTime: '',
        trainOrgId: ''
      },
      trainOrgList: []
    };
  },
  created() {
    this.setDate();
    // this.getList();
    this.getPlat();
  },
  methods: {
    setDate(){
      const end = new Date();
      const start = new Date();
      start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
      const s = moment(start).format('YYYY-MM-DD')
      const e = moment(end).format('YYYY-MM-DD')
      this.time = [s,e]
    },
    getList(){
      if(this.time && this.time.length >0){
        this.queryParams.startTime = moment(this.time[0]).format('YYYY-MM-DD')
        this.queryParams.endTime = moment(this.time[1]).format('YYYY-MM-DD')
      }

      this.loading = true;
      listBatch( this.queryParams).then((res) => {
        if (res.code == 200) {
          this.expertList = res.rows.map(item => {
            return {
              ...item,
              trainOrgName: item.trainOrgName ? item.trainOrgName : '--',
              startTime: item.startTime ? item.startTime : '--',
              endTime: item.endTime ? item.endTime : '--',
              category: item.category ? item.category : '--'
            }
          })
          this.total = res.total
          this.loading = false;
        }
      })
    },
    getPlat() {
      listPlatSelect().then((res) => {
        if (res.code == 200) {
          this.platformList = res.data
        }
      })
    },
    handleChange(){

    },
    handleQuery(){
      this.getList();

    },
    resetQuery(){
      this.queryParams = {
        pageNum: 1,
        pageSize: 10,
        institutionId: '',
        startTime: '',
        endTime: '',
        trainOrgId: ''
      }
      this.time = [];
      this.getList();
    }
  }
};
</script>