406 lines
10 KiB
Vue
406 lines
10 KiB
Vue
<template>
|
|
<ContentWrap>
|
|
<el-row>
|
|
<el-form-item label="统计时间">
|
|
<el-radio-group v-model="radioType" @change="changeRadio">
|
|
<el-radio v-for="item in radioSelector" :value="item.value" :key="item.value">{{
|
|
item.label
|
|
}}</el-radio>
|
|
</el-radio-group>
|
|
<el-date-picker
|
|
style="margin-left: 10px"
|
|
value-format="YYYY-MM-DD"
|
|
v-model="time"
|
|
type="daterange"
|
|
range-separator="To"
|
|
start-placeholder="开始时间"
|
|
end-placeholder="结束时间"
|
|
:default-time="[new Date().getDate() - 7, new Date()]"
|
|
:shortcuts="shortcuts"
|
|
size="big"
|
|
@change="changeDatePick"
|
|
/>
|
|
<el-button type="primary" @click="getList" style="margin-left: 20px">
|
|
<Icon icon="ep:search" class="mr-5px" /> 查询
|
|
</el-button>
|
|
<el-button type="primary" @click="printData" style="margin-left: 20px">
|
|
<Icon icon="ep:printer" class="mr-5px" /> 打印
|
|
</el-button>
|
|
<el-button
|
|
type="primary"
|
|
@click="exportExcel"
|
|
style="margin-left: 20px"
|
|
:loading="exportLoading"
|
|
>
|
|
<Icon icon="ep:download" class="mr-5px" /> 导出excel
|
|
</el-button>
|
|
</el-form-item>
|
|
</el-row>
|
|
</ContentWrap>
|
|
<ContentWrap>
|
|
<el-table
|
|
:data="data1"
|
|
show-summary
|
|
max-height="650"
|
|
default-expand-all
|
|
row-key="orgname"
|
|
:tree-props="{ children: 'children' }"
|
|
:default-sort="{ prop: 'sum', order: 'descending' }"
|
|
>
|
|
<el-table-column label="卫生院" align="left" prop="orgname" min-width="180" />
|
|
<el-table-column label="行政村" align="center" prop="districtname" min-width="160" />
|
|
<el-table-column label="体检数" align="center">
|
|
<el-table-column label="老年人" align="center" prop="oldmanflag" min-width="80" />
|
|
<el-table-column label="高血压" align="center" prop="htnflag" min-width="80" />
|
|
<el-table-column label="糖尿病" align="center" prop="diaflag" min-width="80" />
|
|
<el-table-column label="精神病" align="center" prop="smiflag" min-width="80" />
|
|
<el-table-column label="肺结核" align="center" prop="pulflag" min-width="80" />
|
|
<el-table-column label="总数" align="center" prop="sum" min-width="80" />
|
|
</el-table-column>
|
|
</el-table>
|
|
</ContentWrap>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import dayjs from 'dayjs'
|
|
import { PatientApi } from '@/api/inspect/inspectpatient'
|
|
import { formatDate } from '@/utils/formatTime'
|
|
import workload from './workload'
|
|
import { hiprint } from 'vue-plugin-hiprint'
|
|
import { newHiprintPrintTemplate, preparePrintData } from './printHelper'
|
|
import download from '@/utils/download'
|
|
const message = useMessage() // 消息弹窗
|
|
const { t } = useI18n() // 国际化
|
|
const loading = ref(true) // 列表的加载中
|
|
const time = ref() // 日期
|
|
const data = ref([
|
|
{
|
|
orgname: '北京',
|
|
districtname: 'A村',
|
|
oldmanflag: 1,
|
|
htnflag: 2,
|
|
diaflag: 1,
|
|
smiflag: 1,
|
|
pulflag: 1,
|
|
sum: 6
|
|
},
|
|
{
|
|
orgname: '北京',
|
|
districtname: 'B村',
|
|
oldmanflag: 2,
|
|
htnflag: 1,
|
|
diaflag: 1,
|
|
smiflag: 1,
|
|
pulflag: 1,
|
|
sum: 6
|
|
},
|
|
{
|
|
orgname: '天津',
|
|
districtname: 'C村',
|
|
oldmanflag: 1,
|
|
htnflag: 4,
|
|
diaflag: 1,
|
|
smiflag: 1,
|
|
pulflag: 1,
|
|
sum: 8
|
|
},
|
|
{
|
|
orgname: '天津',
|
|
districtname: 'D村',
|
|
oldmanflag: 3,
|
|
htnflag: 1,
|
|
diaflag: 1,
|
|
smiflag: 1,
|
|
pulflag: 1,
|
|
sum: 7
|
|
},
|
|
{
|
|
orgname: '安徽',
|
|
districtname: 'E村',
|
|
oldmanflag: 4,
|
|
htnflag: 3,
|
|
diaflag: 1,
|
|
smiflag: 1,
|
|
pulflag: 1,
|
|
sum: 10
|
|
},
|
|
{
|
|
orgname: '安徽',
|
|
districtname: 'F村',
|
|
oldmanflag: 4,
|
|
htnflag: 3,
|
|
diaflag: 1,
|
|
smiflag: 1,
|
|
pulflag: 1,
|
|
sum: 10
|
|
},
|
|
{
|
|
orgname: '安徽',
|
|
districtname: 'G村',
|
|
oldmanflag: 4,
|
|
htnflag: 3,
|
|
diaflag: 1,
|
|
smiflag: 1,
|
|
pulflag: 1,
|
|
sum: 10
|
|
}
|
|
]) // 表格数据
|
|
/*const data1=ref([
|
|
{
|
|
orgname:'北京',oldmanflag:3,htnflag :5 ,diaflag:2, smiflag:5 ,pulflag:6 ,sum : 21,
|
|
list:[
|
|
{ districtname:'A村',oldmanflag:1 ,htnflag :2 ,diaflag:1, smiflag:1 ,pulflag:1 ,sum : 6},
|
|
{ districtname:'B村',oldmanflag:2 ,htnflag :3 ,diaflag:1, smiflag:4 ,pulflag:5 ,sum : 15}
|
|
],
|
|
},
|
|
{
|
|
orgname:'天津',oldmanflag:3,htnflag :5 ,diaflag:2, smiflag:5 ,pulflag:6 ,sum : 21,
|
|
list:[
|
|
{ districtname:'C村',oldmanflag:1 ,htnflag :2 ,diaflag:1, smiflag:1 ,pulflag:1 ,sum : 6},
|
|
{ districtname:'D村',oldmanflag:2 ,htnflag :3 ,diaflag:1, smiflag:4 ,pulflag:5 ,sum : 15}
|
|
],
|
|
},
|
|
])*/
|
|
const data1 = ref([])
|
|
const radioSelector = ref([
|
|
{ value: 2, label: '今天' },
|
|
{ value: 3, label: '最近一周' },
|
|
{ value: 4, label: '最近一个月' }
|
|
])
|
|
const radioType = ref(3) //
|
|
const shortcuts = [
|
|
{
|
|
text: '最近一周',
|
|
value: () => {
|
|
const end = new Date()
|
|
const start = new Date()
|
|
start.setDate(start.getDate() - 7)
|
|
return [start, end]
|
|
}
|
|
},
|
|
{
|
|
text: '最近一个月',
|
|
value: () => {
|
|
const end = new Date()
|
|
const start = new Date()
|
|
start.setMonth(start.getMonth() - 1)
|
|
return [start, end]
|
|
}
|
|
},
|
|
{
|
|
text: '今日',
|
|
value: () => {
|
|
const end = new Date()
|
|
const start = new Date()
|
|
return [start, end]
|
|
}
|
|
}
|
|
]
|
|
/**
|
|
* 改变单选框
|
|
* @param e
|
|
*/
|
|
const changeRadio = (e) => {
|
|
let end = new Date()
|
|
let start = new Date()
|
|
let date = null
|
|
switch (e) {
|
|
case 2:
|
|
start = new Date()
|
|
end = new Date()
|
|
break
|
|
case 3:
|
|
start.setDate(start.getDate() - 7)
|
|
break
|
|
case 4:
|
|
start.setMonth(start.getMonth() - 1)
|
|
break
|
|
default:
|
|
start.setDate(start.getDate() - 7)
|
|
}
|
|
time.value = [formatDate(start, 'YYYY-MM-DD'), formatDate(end, 'YYYY-MM-DD')]
|
|
// 清空现有数据
|
|
data1.value = []
|
|
// 重新获取数据
|
|
getList()
|
|
}
|
|
const changeDatePick = () => {
|
|
radioType.value = null
|
|
// getList()
|
|
}
|
|
/**
|
|
* 获取统计数据
|
|
*/
|
|
const getList = async () => {
|
|
// 清空现有数据
|
|
data1.value = []
|
|
|
|
const params = {
|
|
dates: [dayjs(time.value[0]).format('YYYY-MM-DD'), dayjs(time.value[1]).format('YYYY-MM-DD')]
|
|
}
|
|
try {
|
|
let resp = await PatientApi.getData(params)
|
|
const rawData = toRaw(resp)
|
|
data1.value = dataProcessing(rawData)
|
|
console.log(data1.value)
|
|
} catch (error) {
|
|
console.error('获取数据失败:', error)
|
|
}
|
|
}
|
|
/**
|
|
* 统计数据处理
|
|
* @param data 需要处理的统计数据
|
|
*/
|
|
const dataProcessing = (data) => {
|
|
const result = data.reduce((acc, current) => {
|
|
const key = current.orgname
|
|
// 初始化分组（若不存在）
|
|
if (!acc[key]) {
|
|
acc[key] = {
|
|
orgname: key,
|
|
oldmanflag: 0,
|
|
htnflag: 0,
|
|
diaflag: 0,
|
|
smiflag: 0,
|
|
pulflag: 0,
|
|
sum: 0,
|
|
children: []
|
|
}
|
|
}
|
|
// 累加各字段值
|
|
acc[key].oldmanflag += current.oldmanflag
|
|
acc[key].htnflag += current.htnflag
|
|
acc[key].diaflag += current.diaflag
|
|
acc[key].smiflag += current.smiflag
|
|
acc[key].pulflag += current.pulflag
|
|
acc[key].sum += current.sum
|
|
// 将当前对象添加到 children 中，移除 orgname
|
|
const child = { ...current }
|
|
delete child.orgname
|
|
acc[key].children.push(child)
|
|
acc[key].children.sort((a, b) => b.sum - a.sum)
|
|
return acc
|
|
}, {})
|
|
let value = Object.values(result)
|
|
value.sort((a, b) => b.sum - a.sum)
|
|
|
|
return value
|
|
}
|
|
const exportLoading = ref(false) // 导出的加载中
|
|
const exportExcel = async () => {
|
|
// 导出的二次确认
|
|
await message.exportConfirm()
|
|
// 发起导出
|
|
try {
|
|
exportLoading.value = true
|
|
const data = await PatientApi.exportData({ dates: time.value })
|
|
download.excel(data, '统计.xls')
|
|
} catch (e) {
|
|
} finally {
|
|
exportLoading.value = false
|
|
}
|
|
}
|
|
/**
|
|
* 打印数据
|
|
*/
|
|
const printData = () => {
|
|
try {
|
|
// 创建打印模板
|
|
const hiprintTemplate = newHiprintPrintTemplate('workload', {
|
|
template: workload,
|
|
settingContainer: '#workloadPrintElementOptionSetting'
|
|
})
|
|
// 准备打印数据
|
|
const printData = preparePrintData(data1.value, time.value)
|
|
// 打印参数配置
|
|
const options = {
|
|
leftOffset: 0,
|
|
topOffset: 0,
|
|
paperType: 'A4',
|
|
enableColumnsMerge: true,
|
|
enableRowsMerge: true,
|
|
firstPageTitle: true,
|
|
onlyFirstTitle: true,
|
|
notAllowRepeat: ['title'],
|
|
firstPanelPageOnly: true,
|
|
pageMode: 'single',
|
|
displayMode: {
|
|
title: 'firstPage'
|
|
},
|
|
printPanelIndex: 0,
|
|
noRepeatPrint: false,
|
|
disableHeaderRepeat: false
|
|
}
|
|
|
|
// 样式设置
|
|
const ext = {
|
|
callback: () => {
|
|
console.log('打印窗口已打开')
|
|
// 添加表头样式
|
|
setTimeout(() => {
|
|
const table = document.querySelector('.hiprint-printPanel table')
|
|
if (table) {
|
|
const ths = table.querySelectorAll('th')
|
|
ths.forEach((th, index) => {})
|
|
}
|
|
}, 100)
|
|
},
|
|
styleHandler: () => {
|
|
return `<style>
|
|
@page {
|
|
size: A4;
|
|
margin: 0;
|
|
}
|
|
@media print {
|
|
body {
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
.hiprint-printPanel table th:nth-child(1) b,
|
|
.hiprint-printPanel table th:nth-child(2) b {
|
|
font-weight: bold !important;
|
|
font-size: 10px !important;
|
|
}
|
|
.hiprint-printPanel table td {
|
|
font-size: 10px;
|
|
}
|
|
td[colspan="0"],
|
|
td[rowspan="0"] {
|
|
display: none;
|
|
}
|
|
|
|
/* 强制隐藏除第一页外的标题 */
|
|
.hiprint-printPanel:not(:first-of-type) [data-options*='"title":"体检工作量统计表"'] {
|
|
display: none !important;
|
|
visibility: hidden !important;
|
|
height: 0 !important;
|
|
overflow: hidden !important;
|
|
position: absolute !important;
|
|
z-index: -1 !important;
|
|
}
|
|
|
|
/* 隐藏除第一页外的表头 */
|
|
.hiprint-printPanel:not(:first-of-type) .hiprint-table-header-row {
|
|
display: none !important;
|
|
}
|
|
}
|
|
</style>`
|
|
}
|
|
}
|
|
|
|
// 调用打印
|
|
hiprintTemplate.print(printData, options, ext)
|
|
|
|
console.log('打印成功')
|
|
} catch (error) {
|
|
console.error('打印失败:', error)
|
|
}
|
|
}
|
|
onMounted(() => {
|
|
changeRadio(3)
|
|
// getList()
|
|
})
|
|
</script>
|
|
|
|
<style scoped></style>
|