web_dist/src/views/examination/CovidExamResult.vue

<template>
  <el-container>
    <el-header height="36px" style="margin-top: 8px">
      <el-date-picker
          v-model="dateRange"
          type="datetimerange"
          range-separator="至"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
          :shortcuts="shortcuts"
      ></el-date-picker>
      <span></span>
      <el-select v-model="type" style="width: 130px">
        <el-option v-for="item in types" :key="item.code" :value="item.code" :label="item.name"></el-option>
      </el-select>
      <span></span>
      <el-button type="primary" icon="el-icon-search" @click="fetchResult">查询</el-button>
      <el-button type="primary" icon="el-icon-upload" @click="exportExcel">导出Excel</el-button>
    </el-header>
    <el-main>
      <el-table :data="list" stripe :height="tableHeight">
        <el-table-column type="index"></el-table-column>
        <el-table-column prop="ptntName" label="姓名"></el-table-column>
        <el-table-column prop="idCard" label="身份证"></el-table-column>
        <el-table-column prop="itmStrValue" label="检测结果"></el-table-column>
        <el-table-column prop="ordrCreateDate" label="送检时间"></el-table-column>
      </el-table>
      <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="currentPage"
          :page-sizes="[15, 30, 45, 70, 100]"
          :page-size="pageSize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="totalSize"
          style="margin-top: 5px"
      ></el-pagination>
    </el-main>
  </el-container>
</template>

<script>
import {ref} from 'vue'
import {formatDate, formatDatetime} from '@/utils/date'
import {shortcuts} from '@/data/shortcuts'
import {fetchCovidExamData} from '@/api/inspections'
import store from '@/store'
import {writeExcelFile, createWorkSheet} from '@/utils/excel'
import {ElMessage} from 'element-plus'

export default {
  setup() {
    const windowSize = store.state.app.windowSize
    const tableHeight = windowSize.h - 85

    const dateRange = ref(null)
    const types = initTypes()
    const type = ref(1)

    const totalSize = ref(0)
    const list = ref([])

    const pageSize = ref(30)
    const currentPage = ref(1)
    const handleSizeChange = (val) => {
      pageSize.value = val
      fetchResult()
    }
    const handleCurrentChange = (val) => {
      currentPage.value = val
      fetchResult()
    }

    const fetchResult = () => {
      if (!dateRange.value) {
        ElMessage({
          message: '请选择时间范围',
          type: 'warning',
          duration: 2000,
          showClose: true,
        })
        return
      }
      const param = {
        start: formatDatetime(dateRange.value[0]),
        end: formatDatetime(dateRange.value[1]),
        currentPage: currentPage.value,
        pageSize: pageSize.value,
        type: type.value,
      }
      fetchCovidExamData(param).then((res) => {
        totalSize.value = res.totalSize
        list.value = res.list
      })
    }

    const exportExcel = () => {
      if (!dateRange.value) {
        ElMessage({
          message: '请选择时间范围',
          type: 'warning',
          duration: 2000,
          showClose: true,
        })
        return
      }

      store.commit('app/setLoading', true)

      const param = {
        start: formatDate(dateRange.value[0]),
        end: formatDate(dateRange.value[1]),
        currentPage: 1,
        pageSize: -1,
        type: type.value,
      }
      fetchCovidExamData(param).then((res) => {
        const titName = type.value === 1 ? '新冠核酸检测' : '新冠抗体检测'
        const fileName = titName + '（' + formatDate(dateRange.value[0]) + ' - ' + formatDate(dateRange.value[1]) + '）.xlsx'
        setTimeout(() => {
          const title = {
            ptntName: '姓名',
            idCard: '身份证',
            itmStrValue: '检测结果',
            ordrCreateDate: '送检时间',
          }
          const fields = ['ptntName', 'idCard', 'itmStrValue', 'ordrCreateDate']
          const workSheet = createWorkSheet(res.list, fields, title)
          writeExcelFile(workSheet, fileName)
        }, 50)
      })
    }

    return {
      tableHeight,
      shortcuts,
      dateRange,
      types,
      type,
      fetchResult,
      totalSize,
      list,
      pageSize,
      currentPage,
      handleSizeChange,
      handleCurrentChange,
      exportExcel,
    }
  },
}

function initTypes() {
  return [
    {code: 1, name: '核酸检测'},
    {code: 2, name: '抗体检测'},
  ]
}
</script>