This commit is contained in:
lxd 2024-12-09 18:34:25 +08:00
commit e9138ec837
2 changed files with 194 additions and 0 deletions

View File

@ -81,4 +81,8 @@ export const EcganalysisparasApi = {
getlist: async (regId:String,orgId:String) => {
return await request.get({ url: `/tblist/ecganalysisparas/list?regId=${regId}&orgId=${orgId}` })
},
// 获取开始和结束时间的心电分析数据记录
getDateStaAndEndData: async (orgId:String,startDate:String,endDate:String) => {
return await request.get({ url: `/tblist/ecganalysisparas/getDateStaAndEndData?orgId=${orgId}&TimeSta=${startDate}&TimeEnd=${endDate}` })
},
}

View File

@ -0,0 +1,190 @@
<template>
<ContentWrap style="height: 50px; display: flex; align-items: center">
<div class="demo-date-picker">
<div class="block">
<el-date-picker
v-model="value"
type="daterange"
start-placeholder="开始日期"
end-placeholder="结束日期"
:default-time="defaultTime"
:disabledDate="disabledDate"
@change="handleDateChange"
/>
<el-button style="margin-left: 20px" @click="toggleChartType">
{{ chartType === 'line' ? '切换为柱状图' : '切换为折线图' }}
</el-button>
<el-button style="margin-left: 20px" @click="getdata()">查询</el-button>
</div>
</div>
</ContentWrap>
<ContentWrap style="height: 80vh">
<div id="main" style="width: 100%; height: 80vh"> </div>
</ContentWrap>
</template>
<script setup lang="ts">
import * as echarts from 'echarts'
import { ref } from 'vue'
import { EcganalysisparasApi } from '@/api/tblist/ecganalysisparas'
import { getUserProfile, ProfileVO } from '@/api/system/user/profile'
const Profilevo = ref<ProfileVO>({} as ProfileVO) //
const endDate = new Date()
const startDate = new Date(endDate.getTime() - 7 * 24 * 3600 * 1000)
const value = ref<[Date, Date]>([startDate, endDate])
const getlogininfo = async () => {
Profilevo.value = await getUserProfile()
}
const defaultTime = ref<[Date, Date]>([
new Date(2000, 1, 1, 0, 0, 0),
new Date(2000, 2, 1, 23, 59, 59)
])
//
const disabledDate = (time: Date) => {
if (value.value && value.value[0]) {
const start = value.value[0]
const diff = 7 * 24 * 3600 * 1000
//
if (!value.value[1]) {
const today = new Date()
return time.getTime() > today.getTime()
}
//
return time.getTime() > start.getTime() + diff || time.getTime() < start.getTime()
}
//
const today = new Date()
return time.getTime() > today.getTime()
}
//
const generateDateArray = (startDate: Date, endDate: Date) => {
const dates = []
let currentDate = new Date(startDate)
while (currentDate <= endDate) {
dates.push(currentDate.toLocaleDateString('zh-CN', { month: '2-digit', day: '2-digit' }))
currentDate = new Date(currentDate.setDate(currentDate.getDate() + 1))
}
return dates
}
//
const chartType = ref('line')
//
const cachedData = ref<any[]>([])
// getdata
async function getdata() {
const startDate = `${formatDate(value.value[0])} 00:00:00`
const endDate = `${formatDate(value.value[1])} 23:59:59`
const data = await EcganalysisparasApi.getDateStaAndEndData(Profilevo.value.orgId, startDate, endDate)
cachedData.value = data //
updateChartWithData(data)
}
//
const updateChartWithData = (data: any[]) => {
const dateArray = generateDateArray(value.value[0], value.value[1])
const countArray = calculateDailyDiagnosisCounts(data, dateArray)
const myChart = echarts.init(document.getElementById('main'))
const option = {
tooltip: {},
xAxis: {
data: dateArray
},
yAxis: {},
series: [
{
name: '诊断数量',
type: chartType.value,
data: countArray
}
]
}
myChart.setOption(option)
}
//
const toggleChartType = () => {
chartType.value = chartType.value === 'line' ? 'bar' : 'line'
updateChartWithData(cachedData.value) // 使
}
// handleDateChange
const handleDateChange = (val: [Date, Date]) => {
if (val && val[0] && val[1]) {
const diff = val[1].getTime() - val[0].getTime()
if (diff > 7 * 24 * 3600 * 1000) {
// 7
value.value = [val[0], new Date(val[0].getTime() + 7 * 24 * 3600 * 1000 - 1)]
}
updateChart() // 使
}
}
//
const calculateDailyDiagnosisCounts = (data: any[], dateArray: string[]) => {
//
const countMap = {}
dateArray.forEach(date => {
countMap[date] = 0
})
//
data.forEach(item => {
const date = new Date(item.doctorDiagTime)
const dateStr = date.toLocaleDateString('zh-CN', { month: '2-digit', day: '2-digit' })
if (countMap[dateStr] !== undefined) {
countMap[dateStr]++
}
})
//
return dateArray.map(date => countMap[date])
}
//
const formatDate = (date: Date) => {
const year = date.getFullYear()
const month = String(date.getMonth() + 1).padStart(2, '0')
const day = String(date.getDate()).padStart(2, '0')
return `${year}-${month}-${day}`
}
// onMounted
onMounted(() => {
getlogininfo()
// 7
const endDate = new Date()
const startDate = new Date(endDate.getTime() - 7 * 24 * 3600 * 1000)
value.value = [startDate, endDate]
updateChart()
})
</script>
<style scoped>
.demo-date-picker {
display: flex;
flex-wrap: wrap;
margin-left: 5px;
}
.demo-date-picker .block {
text-align: left;
flex: 0 auto;
}
.demo-date-picker .block:last-child {
border-right: none;
}
</style>