zhouwx
2024-10-12 359cb0048589f23a08ad980c77f103a9de2f8d6c
src/views/onlineEducation/classCertManage/index.vue
@@ -11,6 +11,7 @@
          size="small"
          type="primary"
          style="margin-bottom: 10px;margin-left: 20px"
          @click="exportData"
        >批量导出</el-button>
      </json-excel>
      <el-date-picker
@@ -24,22 +25,23 @@
        style="margin-left: 30px;"
      >
      </el-date-picker>
      <el-select v-model="queryParams.institutionId"  size="small" style="margin-left: 40px;" placeholder="请选择平台">
      <el-select v-model="queryParams.institutionName"  size="small" style="margin-left: 40px;" placeholder="请选择平台">
        <el-option
          v-for="item in platformList"
          :key="item.id"
          :label="item.institutionalName"
          :value="item.id">
          :value="item.institutionalName">
        </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-input size="small" style="margin-left: 30px;width: 200px" v-model="queryParams.trainOrgName" placeholder="请输入机构"></el-input>
<!--      <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"
@@ -62,11 +64,11 @@
      <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="createTime" />
      <el-table-column label="证书生成时间" align="center" prop="certTime" />
      <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" @click="viewPic(scope.row)">查看</el-button>
          <el-button size="mini" type="text" style="color: #1890ff" @click="downloadByBlob(scope.row)">下载</el-button>
          <el-button size="mini" type="text" style="color: #1890ff">打印</el-button>
        </template>
      </el-table-column>
@@ -78,6 +80,18 @@
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />
    <el-dialog
      :visible.sync="picDialog"
      width="500px"
      :before-close="handleClose">
      <div style="display: flex;justify-content: center">
        <el-image
          style="width: 450px; height: auto"
          :src="viewUrl"
          :preview-src-list="srcList">
        </el-image>
      </div>
    </el-dialog>
  </div>
</template>
@@ -87,6 +101,7 @@
import moment from 'moment/moment'
import JsonExcel from 'vue-json-excel'
import { getSubject } from '@/api/onlineEducation/count'
import { getCert } from '@/api/onlineEducation/question'
export default {
  name: "nPeopleManage",
  dicts: [],
@@ -101,39 +116,17 @@
      addForm: false,
      total: 0,
      platformList: [],
      expertList: [
        // {
        //   id: 1,
        //   name: 'xxx',
        //   idcard: 'xxx',
        //   institutionName: 'xxx',
        //   trainOrgName: 'xxx',
        //   batchName: 'xxx',
        //   createTime: 'xxx'
        // },
        // {
        //   id: 2,
        //   name: 'xxx',
        //   idcard: 'xxx',
        //   institutionName: 'xxx',
        //   trainOrgName: 'xxx',
        //   batchName: 'xxx',
        //   createTime: 'xxx'
        // },
      ],
      expertList: [],
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        institutionId: '',
        institutionName: '',
        startTime: '',
        endTime: '',
        trainOrgId: ''
        trainOrgName: ''
      },
      trainOrgList: [],
      jsonData: [
      ],
      jsonData: [],
      json_fields: {
        ID: "id",
        姓名: "name",
@@ -141,8 +134,11 @@
        推送平台: "institutionName",
        所属机构: "trainOrgName",
        批次: "batchName",
        证书生成时间: "createTime",
      }
        证书生成时间: "certTime",
      },
      picDialog: false,
      viewUrl: '',
      srcList: []
    };
  },
  created() {
@@ -151,36 +147,36 @@
    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]
    },
    // 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.queryParams.startTime = moment(this.time[0]).format('YYYY-MM-DD') + ' 00:00:00'
        this.queryParams.endTime = moment(this.time[1]).format('YYYY-MM-DD') + ' 00:00:00'
      }
      // 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;
      //   }
      // })
      this.loading = true;
      getCert( 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 : '--',
            }
          })
          this.total = res.total
          this.loading = false;
        }
        console.log('this.expertList',this.expertList)
      })
    },
    getPlat() {
      listPlatSelect().then((res) => {
@@ -189,10 +185,17 @@
        }
      })
    },
    exportData(){
      if(this.jsonData && this.jsonData.length <= 0){
        this.$message({
          message: '请选择要导出的数据',
          type: 'warning'
        })
      }
    },
    changeCheckBoxValue(val) {
      console.log('val',val)
      this.jsonData = val;
    },
    handleChange(){
@@ -205,13 +208,48 @@
      this.queryParams = {
        pageNum: 1,
        pageSize: 10,
        institutionId: '',
        institutionName: '',
        startTime: '',
        endTime: '',
        trainOrgId: ''
        trainOrgName: ''
      }
      this.time = [];
      this.getList();
    },
    viewPic(val){
      this.viewUrl = val.certUrl
      this.srcList[0] = val.certUrl
      this.picDialog = true
    },
    handleClose() {
      this.viewUrl = ''
      // this.srcList = []
      this.picDialog = false
    },
    downloadByBlob(val) {
      let image = new Image()
      image.setAttribute('crossOrigin', 'anonymous')
      image.src = val.certUrl
      image.onload = () => {
        let canvas = document.createElement('canvas')
        canvas.width = image.width
        canvas.height = image.height
        let ctx = canvas.getContext('2d')
        ctx.drawImage(image, 0, 0, image.width, image.height)
        canvas.toBlob((blob) => {
          let url = URL.createObjectURL(blob)
          this.download(url,val.name + '_学时证书')
          // 用完释放URL对象
          URL.revokeObjectURL(url)
        })
      }
    },
    download(href, name) {
      let eleLink = document.createElement('a')
      eleLink.download = name
      eleLink.href = href
      eleLink.click()
      eleLink.remove()
    }
  }
};