DaXingTiJian/el-admin/src/views/Report/ConflictRecord.vue

<template>
	<div>
		<div class="head">
			<el-row :gutter="10">
				<el-form-item>
					<el-input v-model="searchInfo.name" placeholder="姓名" clearable />
				</el-form-item>
				<el-form-item>
					<el-input v-model="searchInfo.id_card_num" placeholder="身份证号" clearable />
				</el-form-item>
				<el-form-item>
					<el-input v-model="searchInfo.current_org_name" placeholder="当前机构" clearable />
				</el-form-item>
				<el-form-item>
					<el-select v-model="searchInfo.type" placeholder="类型" clearable>
						<el-option label="健康证体检" value="1" />
						<el-option label="老年人体检" value="2" />
					</el-select>
				</el-form-item>
				<el-form-item>
					<el-select v-model="searchInfo.source" placeholder="来源" clearable>
						<el-option label="预约检查" value="CheckAppointment" />
					</el-select>
				</el-form-item>
				<el-form-item>
					<el-date-picker v-model="searchInfo.dateRange" value-format="YYYY-MM-DD" type="daterange"
						range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" />
				</el-form-item>
				<el-form-item>
					<el-button type="primary" @click="Search">搜索</el-button>
					<el-button type="success" @click="ExportExcel" :loading="exportLoading">导出Excel</el-button>
				</el-form-item>
			</el-row>
		</div>
		<el-table border :data="tableData" style="width: 100%;" row-key="id" v-loading="loading">
			<el-table-column prop="id" label="ID" width="80" />
			<el-table-column prop="name" label="姓名" width="100" />
			<el-table-column prop="id_card_num" label="身份证号" width="180" />
			<el-table-column prop="current_org_name" label="当前机构" />
			<el-table-column prop="doctor_name" label="医生姓名" width="100" />
			<el-table-column prop="last_org_name" label="上次机构" />
			<el-table-column prop="last_checkup_time" label="上次体检时间" width="180" />
			<el-table-column prop="type" label="类型" width="100">
				<template #default="scope">{{ typeMap[scope.row.type] || scope.row.type }}</template>
			</el-table-column>
			<el-table-column prop="source" label="来源" width="100">
				<template #default="scope">{{ sourceMap[scope.row.source] || scope.row.source }}</template>
			</el-table-column>
			<el-table-column prop="created_at" label="创建时间" width="180" />
		</el-table>
		<div class="page">
			<el-pagination v-model:current-page="currentPage" v-model:page-size="pageSize"
				:page-sizes="[15, 50, 100, 200]" layout="total,sizes, prev, pager, next" :total="total"
				@size-change="PageSizeChange" @current-change="PageCurrentChange" />
		</div>
	</div>
</template>

<script setup>
	import { ref, onMounted } from 'vue'
	import { ElMessage } from 'element-plus'
	import { ConflictRecordGetList, ConflictRecordExport } from '@/api/api.js'
	import * as XLSX from 'xlsx'

	let typeMap = { '1': '健康证体检', '2': '老年人体检' }
	let sourceMap = { 'CheckAppointment': '预约检查' }

	let loading = ref(false)
	let exportLoading = ref(false)
	let tableData = ref([])
	let currentPage = ref(1)
	let pageSize = ref(15)
	let total = ref(0)
	let searchInfo = ref({
		name: '',
		id_card_num: '',
		current_org_name: '',
		type: '',
		source: '',
		dateRange: [],
	})

	const PageSizeChange = (e) => {
		pageSize.value = e
		GetList()
	}
	const PageCurrentChange = (e) => {
		currentPage.value = e
		GetList()
	}
	const Search = () => {
		currentPage.value = 1
		GetList()
	}
	const GetList = () => {
		loading.value = true
		ConflictRecordGetList({
			page: currentPage.value,
			pageSize: pageSize.value,
			searchInfo: searchInfo.value,
		}).then(res => {
			loading.value = false
			if (res.status) {
				tableData.value = res.data.list
				total.value = res.data.count
			} else {
				ElMessage.error(res.msg)
			}
		})
	}
	const ExportExcel = () => {
		exportLoading.value = true
		ConflictRecordExport({
			searchInfo: searchInfo.value,
		}).then(res => {
			exportLoading.value = false
			if (res.status) {
				const exportData = res.data.list.map(item => ({
					'ID': item.id,
					'姓名': item.name,
					'身份证号': item.id_card_num,
					'当前机构': item.current_org_name,
					'医生姓名': item.doctor_name,
					'上次机构': item.last_org_name,
					'上次体检时间': item.last_checkup_time,
					'类型': typeMap[item.type] || item.type,
					'来源': sourceMap[item.source] || item.source,
					'创建时间': item.created_at,
				}))
				const ws = XLSX.utils.json_to_sheet(exportData)
				const wb = XLSX.utils.book_new()
				XLSX.utils.book_append_sheet(wb, ws, '冲突记录')
				XLSX.writeFile(wb, '冲突记录_' + new Date().getTime() + '.xlsx')
				ElMessage.success('导出成功')
			} else {
				ElMessage.error(res.msg)
			}
		})
	}
	onMounted(() => {
		GetList()
	})
</script>

<style scoped>
	.page {
		display: flex;
		justify-content: flex-end;
		margin-top: 10px;
	}
</style>