| | |
| | | style="float: right; margin-left: 10px;" |
| | | type="primary" |
| | | icon="el-icon-zoom-in" |
| | | @click="showOrganDetail = true" |
| | | @click="viewAllOrganDetail" |
| | | > |
| | | 查看器官明细 |
| | | </el-button> |
| | |
| | | import FilterPanel from '@/components/charts/FilterPanel.vue'; |
| | | import EChartsWrapper from '@/components/charts/EChartsWrapper.vue'; |
| | | import OrganDetail from './components/OrganDetail.vue'; |
| | | import { organ, organMoon, organType } from '@/api/businessApi'; |
| | | import { organ, organMoon, organType, organTotals } from '@/api/businessApi'; |
| | | import { toTotalsList, toMonth, toNum } from '@/utils/totals'; |
| | | import statisticsMode from '@/utils/statisticsMode'; |
| | | import { COLORS, PALETTE, axisTooltip, grid, xAxis, yAxis, legend, barSeries } from '@/utils/chartStyle'; |
| | |
| | | this.loading = true; |
| | | try { |
| | | const q = this.buildQuery(); |
| | | const [moonRes, typeRes, organRes] = await Promise.all([ |
| | | const [moonRes, typeRes, organRes, totalsRes] = await Promise.all([ |
| | | organMoon(q), |
| | | organType(q), |
| | | organ(q) |
| | | organ(q), |
| | | organTotals(q) |
| | | ]); |
| | | |
| | | // 获取/移植趋势 |
| | |
| | | const start = (this.query.page - 1) * this.query.limit; |
| | | this.tableData = all.slice(start, start + this.query.limit); |
| | | |
| | | // 更新概览 |
| | | this.updateOverviewData(all); |
| | | // 更新概览(总获取/移植/移植率/弃用,来自 /organTotals) |
| | | this.updateOverviewData(toTotalsList(totalsRes)[0] || {}); |
| | | |
| | | // 更新图表 |
| | | this.updateCharts(); |
| | |
| | | } |
| | | }, |
| | | |
| | | // 更新概览数据 |
| | | updateOverviewData(data) { |
| | | const totalAcquisition = data.reduce((sum, item) => sum + toNum(item.acquisitionCount), 0); |
| | | const totalTransplant = data.reduce((sum, item) => sum + toNum(item.transplantCount), 0); |
| | | const totalAbandon = data.reduce((sum, item) => sum + toNum(item.abandonCount), 0); |
| | | const transplantRate = totalAcquisition > 0 ? ((totalTransplant / totalAcquisition) * 100).toFixed(1) : 0; |
| | | // 更新概览数据(来自 /organTotals 的总获取/总移植/总弃用,移植率=移植/获取) |
| | | updateOverviewData(totals) { |
| | | const totalGet = toNum(totals.totalGet); |
| | | const totalTransplant = toNum(totals.totalTransplant); |
| | | const totalDiscard = toNum(totals.totalDiscard); |
| | | const transplantRate = totalGet > 0 ? ((totalTransplant / totalGet) * 100).toFixed(1) : 0; |
| | | |
| | | this.overviewData[0].value = totalAcquisition; |
| | | this.overviewData[0].value = totalGet; |
| | | this.overviewData[1].value = totalTransplant; |
| | | this.overviewData[2].value = `${transplantRate}%`; |
| | | this.overviewData[3].value = totalAbandon; |
| | | this.overviewData[3].value = totalDiscard; |
| | | }, |
| | | |
| | | // 更新图表 |
| | |
| | | this.$message.info('导出功能开发中...'); |
| | | }, |
| | | |
| | | // 查看器官详情 |
| | | // 查看器官详情(某一行:年份 + 器官 + 地区,时间范围精确到天) |
| | | viewOrganDetail(row) { |
| | | this.detailQuery = { |
| | | year: row.year, |
| | | organType: row.organName, |
| | | region: row.region |
| | | }; |
| | | const q = {}; |
| | | if (row.year) { |
| | | q.startTime = `${row.year}-01-01`; |
| | | q.endTime = `${row.year}-12-31`; |
| | | } |
| | | if (row.organName) q.organName = row.organName; |
| | | if (row.region) q.area = row.region; |
| | | this.detailQuery = q; |
| | | this.showOrganDetail = true; |
| | | }, |
| | | |
| | | // 查看全部器官明细(按当前筛选条件,时间范围精确到天) |
| | | viewAllOrganDetail() { |
| | | const q = {}; |
| | | if (this.query.region && this.query.region.length) { |
| | | q.area = this.query.region.join(','); |
| | | } |
| | | if (this.query.yearRange && this.query.yearRange.length === 2) { |
| | | q.startTime = `${this.query.yearRange[0]}-01-01`; |
| | | q.endTime = `${this.query.yearRange[1]}-12-31`; |
| | | } |
| | | if (this.query.organType) { |
| | | q.organName = this.query.organType; |
| | | } |
| | | this.detailQuery = q; |
| | | this.showOrganDetail = true; |
| | | } |
| | | } |