From 3df460667d74868d0a54fce12d5e881bbd6c0c1a Mon Sep 17 00:00:00 2001
From: WXL <wl_5969728@163.com>
Date: 星期四, 17 九月 2026 17:11:18 +0800
Subject: [PATCH] 青岛维护统计
---
src/views/statistics/utilization.vue | 657 ++++++++++++-----------------------------------------------
1 files changed, 140 insertions(+), 517 deletions(-)
diff --git a/src/views/statistics/utilization.vue b/src/views/statistics/utilization.vue
index 51ea1c9..76c03b1 100644
--- a/src/views/statistics/utilization.vue
+++ b/src/views/statistics/utilization.vue
@@ -29,124 +29,56 @@
<el-card style="margin-bottom: 20px;">
<div slot="header" class="clearfix">
<h3>2. 鍣ㄥ畼寮冪敤鍘熷洜鍒嗘瀽</h3>
- <el-form :inline="true" style="float: right;">
- <el-form-item label="鍣ㄥ畼绫诲瀷" style="margin-bottom: 0;">
- <el-select
- v-model="abandonQuery.organType"
- placeholder="璇烽�夋嫨鍣ㄥ畼绫诲瀷"
- clearable
- size="mini"
- style="width: 150px"
- @change="handleAbandonQuery"
- >
- <el-option
- v-for="item in organOptions"
- :key="item.value"
- :label="item.label"
- :value="item.value"
- />
- </el-select>
- </el-form-item>
- </el-form>
</div>
<EChartsWrapper
+ v-if="useMock"
:id="'abandon-analysis-chart'"
:options="abandonChartOptions"
height="400px"
/>
+ <el-empty v-else description="鍚庣鏆傛湭鎻愪緵鍣ㄥ畼寮冪敤鍘熷洜缁熻鎺ュ彛"></el-empty>
</el-card>
<!-- 绗笁閮ㄥ垎锛氭瘡渚涗綋鍣ㄥ畼鑾峰彇鏁伴噺 -->
<el-card>
<div slot="header" class="clearfix">
<h3>3. 姣忎緵浣撳櫒瀹樿幏鍙栨暟閲�</h3>
- <el-form :inline="true" style="float: right;">
- <el-form-item label="骞翠唤" style="margin-bottom: 0;">
- <el-date-picker
- v-model="perDonorQuery.year"
- type="year"
- placeholder="閫夋嫨骞翠唤"
- value-format="yyyy"
- size="mini"
- style="width: 120px"
- @change="handlePerDonorQuery"
- />
- </el-form-item>
-
- <el-form-item label="鍣ㄥ畼绫诲瀷" style="margin-bottom: 0;">
- <el-select
- v-model="perDonorQuery.organType"
- placeholder="璇烽�夋嫨鍣ㄥ畼绫诲瀷"
- clearable
- size="mini"
- style="width: 150px"
- @change="handlePerDonorQuery"
- >
- <el-option
- v-for="item in organOptions"
- :key="item.value"
- :label="item.label"
- :value="item.value"
- />
- </el-select>
- </el-form-item>
- </el-form>
</div>
- <el-table
- v-loading="loading"
- :data="tableData"
- style="width: 100%"
- border
- stripe
- >
- <el-table-column label="骞翠唤" prop="year" align="center" />
- <el-table-column label="渚涗綋濮撳悕" prop="donorName" align="center" />
- <el-table-column label="鑾峰彇鏁伴噺" prop="acquisitionCount" align="center" >
- <template slot-scope="{ row }">
- <el-tag :type="getCountTag(row.acquisitionCount)" size="small">
- {{ row.acquisitionCount }}
- </el-tag>
- </template>
- </el-table-column>
- <el-table-column label="鍏ㄨ倽" prop="liver" align="center" />
- <el-table-column label="宸﹀崐鑲�" prop="leftLiver" align="center" />
- <el-table-column label="鍙冲崐鑲�" prop="rightLiver" align="center" />
- <el-table-column label="蹇冭剰" prop="heart" align="center" />
- <el-table-column label="灏忚偁" prop="intestine" align="center" />
- <el-table-column label="鑳拌吅" prop="pancreas" align="center" />
- <el-table-column label="宸﹁偩" prop="leftKidney" align="center" />
- <el-table-column label="鍙宠偩" prop="rightKidney" align="center" />
- <el-table-column label="鍏ㄨ偤" prop="fullLung" align="center" />
- <el-table-column label="宸﹁偤" prop="leftLung" align="center" />
- <el-table-column label="鍙宠偤" prop="rightLung" align="center" />
- <el-table-column label="宸︾溂瑙掕啘" prop="leftCornea" align="center" />
- <el-table-column label="鍙崇溂瑙掕啘" prop="rightCornea" align="center" />
- <el-table-column label="鍦板尯" prop="region" align="center" />
- <el-table-column label="鎿嶄綔" align="center" fixed="right">
- <template slot-scope="{ row }">
- <el-button
- type="text"
- size="mini"
- @click="viewDonorDetail(row)"
- >
- 璇︽儏
- </el-button>
- </template>
- </el-table-column>
- </el-table>
-
- <el-pagination
- v-show="total > 0"
- :total="total"
- :page.sync="query.page"
- :limit.sync="query.limit"
- @current-change="handlePagination"
- @size-change="handlePageSizeChange"
- style="margin-top: 20px;"
- layout="total, sizes, prev, pager, next, jumper"
- :page-sizes="[10, 20, 50, 100]"
- />
+ <template v-if="useMock">
+ <el-table
+ v-loading="loading"
+ :data="perDonorTable"
+ style="width: 100%"
+ border
+ stripe
+ >
+ <el-table-column label="骞翠唤" prop="year" align="center" />
+ <el-table-column label="渚涗綋濮撳悕" prop="donorName" align="center" />
+ <el-table-column label="鑾峰彇鏁伴噺" prop="acquisitionCount" align="center">
+ <template slot-scope="{ row }">
+ <el-tag :type="getCountTag(row.acquisitionCount)" size="small">
+ {{ row.acquisitionCount }}
+ </el-tag>
+ </template>
+ </el-table-column>
+ <el-table-column label="鍏ㄨ倽" prop="liver" align="center" />
+ <el-table-column label="宸﹀崐鑲�" prop="leftLiver" align="center" />
+ <el-table-column label="鍙冲崐鑲�" prop="rightLiver" align="center" />
+ <el-table-column label="蹇冭剰" prop="heart" align="center" />
+ <el-table-column label="灏忚偁" prop="intestine" align="center" />
+ <el-table-column label="鑳拌吅" prop="pancreas" align="center" />
+ <el-table-column label="宸﹁偩" prop="leftKidney" align="center" />
+ <el-table-column label="鍙宠偩" prop="rightKidney" align="center" />
+ <el-table-column label="鍏ㄨ偤" prop="fullLung" align="center" />
+ <el-table-column label="宸﹁偤" prop="leftLung" align="center" />
+ <el-table-column label="鍙宠偤" prop="rightLung" align="center" />
+ <el-table-column label="宸︾溂瑙掕啘" prop="leftCornea" align="center" />
+ <el-table-column label="鍙崇溂瑙掕啘" prop="rightCornea" align="center" />
+ <el-table-column label="鍦板尯" prop="region" align="center" />
+ </el-table>
+ </template>
+ <el-empty v-else description="鍚庣鏆傛湭鎻愪緵姣忎緵浣撳櫒瀹樿幏鍙栨槑缁嗘帴鍙�"></el-empty>
</el-card>
</div>
</template>
@@ -154,6 +86,10 @@
<script>
import FilterPanel from '@/components/charts/FilterPanel.vue';
import EChartsWrapper from '@/components/charts/EChartsWrapper.vue';
+import { organType } from '@/api/businessApi';
+import { toTotalsList, toNum } from '@/utils/totals';
+import statisticsMode, { isStatisticsMock } from '@/utils/statisticsMode';
+import { COLORS, axisTooltip, grid, xAxis, yAxis, legend, barSeries } from '@/utils/chartStyle';
export default {
name: 'OrganUtilization',
@@ -167,8 +103,6 @@
query: {
region: [],
monthRange: [],
- ageRange: [],
- chinaCategory: [],
organType: null,
page: 1,
limit: 10
@@ -182,13 +116,13 @@
type: 'select',
multiple: true,
options: [
- { label: '闈掑矝鍦板尯', value: 'qingdao' },
- { label: '鏃ョ収鍦板尯', value: 'rizhao' },
- { label: '娴庡崡鍦板尯', value: 'jinan' },
- { label: '鐑熷彴鍦板尯', value: 'yantai' },
- { label: '濞佹捣鍦板尯', value: 'weihai' },
- { label: '娼嶅潑鍦板尯', value: 'weifang' },
- { label: '涓存矀鍦板尯', value: 'linyi' }
+ { label: '闈掑矝鍦板尯', value: '闈掑矝鍦板尯' },
+ { label: '鏃ョ収鍦板尯', value: '鏃ョ収鍦板尯' },
+ { label: '娴庡崡鍦板尯', value: '娴庡崡鍦板尯' },
+ { label: '鐑熷彴鍦板尯', value: '鐑熷彴鍦板尯' },
+ { label: '濞佹捣鍦板尯', value: '濞佹捣鍦板尯' },
+ { label: '娼嶅潑鍦板尯', value: '娼嶅潑鍦板尯' },
+ { label: '涓存矀鍦板尯', value: '涓存矀鍦板尯' }
],
width: '300px'
},
@@ -203,60 +137,19 @@
width: '300px'
},
{
- label: '骞撮緞娈�',
- prop: 'ageRange',
- type: 'select',
- multiple: true,
- options: [
- { label: '<17宀�', value: '0-17' },
- { label: '18-49宀�', value: '18-49' },
- { label: '50-69宀�', value: '50-69' },
- { label: '>69宀�', value: '70-100' }
- ],
- width: '200px'
- },
- {
- label: '涓浗鍒嗙被',
- prop: 'chinaCategory',
- type: 'select',
- multiple: true,
- options: [
- { label: '涓浗涓�绫�(DBD)', value: '1' },
- { label: '涓浗浜岀被(DCD)', value: '2' },
- { label: '涓浗涓夌被(DBCD)', value: '3' }
- ],
- width: '200px'
- },
- {
label: '鍣ㄥ畼绫诲瀷',
prop: 'organType',
type: 'select',
options: [
- { label: '鍏ㄨ倽', value: 'liver' },
- { label: '鑲捐剰', value: 'kidney' },
- { label: '蹇冭剰', value: 'heart' },
- { label: '鑲�', value: 'lung' },
- { label: '鐪艰鑶�', value: 'cornea' }
+ { label: '鍏ㄨ倽', value: '鍏ㄨ倽' },
+ { label: '鑲捐剰', value: '鑲捐剰' },
+ { label: '蹇冭剰', value: '蹇冭剰' },
+ { label: '鑲�', value: '鑲�' },
+ { label: '鑳拌吅', value: '鑳拌吅' },
+ { label: '鐪艰鑶�', value: '鐪艰鑶�' }
],
width: '200px'
}
- ],
-
- // 鍣ㄥ畼閫夐」
- organOptions: [
- { label: '鍏ㄨ倽', value: 'liver' },
- { label: '宸﹀崐鑲�', value: 'leftLiver' },
- { label: '鍙冲崐鑲�', value: 'rightLiver' },
- { label: '蹇冭剰', value: 'heart' },
- { label: '灏忚偁', value: 'intestine' },
- { label: '鑳拌吅', value: 'pancreas' },
- { label: '宸﹁偩', value: 'leftKidney' },
- { label: '鍙宠偩', value: 'rightKidney' },
- { label: '鍏ㄨ偤', value: 'fullLung' },
- { label: '宸﹁偤', value: 'leftLung' },
- { label: '鍙宠偤', value: 'rightLung' },
- { label: '宸︾溂瑙掕啘', value: 'leftCornea' },
- { label: '鍙崇溂瑙掕啘', value: 'rightCornea' }
],
// 鍔犺浇鐘舵��
@@ -264,322 +157,33 @@
// 鍥捐〃閰嶇疆
acquisitionChartOptions: {},
- abandonChartOptions: {},
- // 琛ㄦ牸鏁版嵁
- tableData: [],
- total: 0,
+ // 鍣ㄥ畼绫诲瀷鍒嗗竷鏁版嵁
+ organData: [],
- // 寮冪敤鍒嗘瀽鏌ヨ鍙傛暟
- abandonQuery: {
- organType: null
- },
-
- // 姣忎緵浣撴煡璇㈠弬鏁�
- perDonorQuery: {
- year: '2024',
- organType: null
- },
-
- // 妯℃嫙鏁版嵁
- mockData: {
- acquisition: [
- {
- month: '2024-01',
- region: '闈掑矝鍦板尯',
- liver: { acquisition: 8, transplant: 7 },
- kidney: { acquisition: 12, transplant: 10 },
- heart: { acquisition: 3, transplant: 3 },
- lung: { acquisition: 5, transplant: 4 },
- cornea: { acquisition: 20, transplant: 18 }
- },
- {
- month: '2024-02',
- region: '闈掑矝鍦板尯',
- liver: { acquisition: 10, transplant: 9 },
- kidney: { acquisition: 15, transplant: 13 },
- heart: { acquisition: 4, transplant: 3 },
- lung: { acquisition: 6, transplant: 5 },
- cornea: { acquisition: 25, transplant: 22 }
- },
- {
- month: '2024-01',
- region: '鏃ョ収鍦板尯',
- liver: { acquisition: 5, transplant: 4 },
- kidney: { acquisition: 8, transplant: 7 },
- heart: { acquisition: 2, transplant: 2 },
- lung: { acquisition: 3, transplant: 2 },
- cornea: { acquisition: 15, transplant: 13 }
- }
- ],
- abandon: [
- { name: '鍣ㄥ畼璐ㄩ噺涓嶅悎鏍�', value: 45 },
- { name: '渚涗綋鐤剧梾', value: 25 },
- { name: '杩愯緭闂', value: 15 },
- { name: '鍙椾綋鍖归厤闂', value: 10 },
- { name: '鍏朵粬鍘熷洜', value: 5 }
- ],
- table: [
- {
- id: 1,
- year: '2024',
- donorName: '寮犱笁',
- acquisitionCount: 5,
- liver: 1,
- leftLiver: 0,
- rightLiver: 0,
- heart: 0,
- intestine: 0,
- pancreas: 0,
- leftKidney: 1,
- rightKidney: 1,
- fullLung: 0,
- leftLung: 0,
- rightLung: 0,
- leftCornea: 1,
- rightCornea: 1,
- region: '闈掑矝鍦板尯'
- },
- {
- id: 2,
- year: '2024',
- donorName: '鏉庡洓',
- acquisitionCount: 3,
- liver: 0,
- leftLiver: 0,
- rightLiver: 0,
- heart: 1,
- intestine: 0,
- pancreas: 0,
- leftKidney: 0,
- rightKidney: 0,
- fullLung: 0,
- leftLung: 1,
- rightLung: 1,
- leftCornea: 0,
- rightCornea: 0,
- region: '闈掑矝鍦板尯'
- },
- {
- id: 3,
- year: '2024',
- donorName: '鐜嬩簲',
- acquisitionCount: 6,
- liver: 1,
- leftLiver: 0,
- rightLiver: 0,
- heart: 0,
- intestine: 0,
- pancreas: 1,
- leftKidney: 1,
- rightKidney: 1,
- fullLung: 0,
- leftLung: 0,
- rightLung: 0,
- leftCornea: 1,
- rightCornea: 1,
- region: '鏃ョ収鍦板尯'
- },
- {
- id: 4,
- year: '2024',
- donorName: '璧靛叚',
- acquisitionCount: 4,
- liver: 0,
- leftLiver: 0,
- rightLiver: 0,
- heart: 0,
- intestine: 0,
- pancreas: 0,
- leftKidney: 1,
- rightKidney: 1,
- fullLung: 0,
- leftLung: 0,
- rightLung: 0,
- leftCornea: 1,
- rightCornea: 1,
- region: '娴庡崡鍦板尯'
- },
- {
- id: 5,
- year: '2023',
- donorName: '閽变竷',
- acquisitionCount: 3,
- liver: 0,
- leftLiver: 0,
- rightLiver: 0,
- heart: 1,
- intestine: 0,
- pancreas: 0,
- leftKidney: 0,
- rightKidney: 0,
- fullLung: 1,
- leftLung: 0,
- rightLung: 1,
- leftCornea: 0,
- rightCornea: 0,
- region: '鐑熷彴鍦板尯'
- }
- ]
- }
+ // 鏃犳帴鍙ｉ儴鍒嗙殑妯℃嫙鏁版嵁锛堜粎 mock 妯″紡灞曠ず锛�
+ abandonReasons: [
+ { name: '鍣ㄥ畼璐ㄩ噺涓嶅悎鏍�', value: 45 },
+ { name: '渚涗綋鐤剧梾', value: 25 },
+ { name: '杩愯緭闂', value: 15 },
+ { name: '鍙椾綋鍖归厤闂', value: 10 },
+ { name: '鍏朵粬鍘熷洜', value: 5 }
+ ],
+ perDonorTable: [
+ { id: 1, year: '2024', donorName: '寮犱笁', acquisitionCount: 5, liver: 1, leftLiver: 0, rightLiver: 0, heart: 0, intestine: 0, pancreas: 0, leftKidney: 1, rightKidney: 1, fullLung: 0, leftLung: 0, rightLung: 0, leftCornea: 1, rightCornea: 1, region: '闈掑矝鍦板尯' },
+ { id: 2, year: '2024', donorName: '鏉庡洓', acquisitionCount: 3, liver: 0, leftLiver: 0, rightLiver: 0, heart: 1, intestine: 0, pancreas: 0, leftKidney: 0, rightKidney: 0, fullLung: 0, leftLung: 1, rightLung: 1, leftCornea: 0, rightCornea: 0, region: '闈掑矝鍦板尯' },
+ { id: 3, year: '2024', donorName: '鐜嬩簲', acquisitionCount: 6, liver: 1, leftLiver: 0, rightLiver: 0, heart: 0, intestine: 0, pancreas: 1, leftKidney: 1, rightKidney: 1, fullLung: 0, leftLung: 0, rightLung: 0, leftCornea: 1, rightCornea: 1, region: '鏃ョ収鍦板尯' },
+ { id: 4, year: '2024', donorName: '璧靛叚', acquisitionCount: 4, liver: 0, leftLiver: 0, rightLiver: 0, heart: 0, intestine: 0, pancreas: 0, leftKidney: 1, rightKidney: 1, fullLung: 0, leftLung: 0, rightLung: 0, leftCornea: 1, rightCornea: 1, region: '娴庡崡鍦板尯' },
+ { id: 5, year: '2023', donorName: '閽变竷', acquisitionCount: 3, liver: 0, leftLiver: 0, rightLiver: 0, heart: 1, intestine: 0, pancreas: 0, leftKidney: 0, rightKidney: 0, fullLung: 1, leftLung: 0, rightLung: 1, leftCornea: 0, rightCornea: 0, region: '鐑熷彴鍦板尯' }
+ ]
};
},
- created() {
- this.loadData();
- },
- methods: {
- // 鍔犺浇鏁版嵁
- async loadData() {
- this.loading = true;
- try {
- await new Promise(resolve => setTimeout(resolve, 500));
-
- // 澶勭悊琛ㄦ牸鏁版嵁
- let filteredData = [...this.mockData.table];
-
- if (this.query.region.length > 0) {
- filteredData = filteredData.filter(item =>
- this.query.region.includes(item.region.replace('鍦板尯', '').toLowerCase())
- );
- }
-
- if (this.query.monthRange && this.query.monthRange.length === 2) {
- // 杩欓噷鍙互娣诲姞鏈堜唤绛涢�夐�昏緫
- }
-
- if (this.query.ageRange.length > 0) {
- // 杩欓噷鍙互娣诲姞骞撮緞绛涢�夐�昏緫
- }
-
- if (this.query.chinaCategory.length > 0) {
- // 杩欓噷鍙互娣诲姞涓浗鍒嗙被绛涢�夐�昏緫
- }
-
- if (this.query.organType) {
- const organMap = { liver: 'liver', kidney: ['leftKidney', 'rightKidney'], heart: 'heart', lung: ['fullLung', 'leftLung', 'rightLung'], cornea: ['leftCornea', 'rightCornea'] };
- const organProp = organMap[this.query.organType];
- if (organProp) {
- if (Array.isArray(organProp)) {
- filteredData = filteredData.filter(item =>
- organProp.some(prop => item[prop] > 0)
- );
- } else {
- filteredData = filteredData.filter(item => item[organProp] > 0);
- }
- }
- }
-
- // 鍒嗛〉
- const start = (this.query.page - 1) * this.query.limit;
- this.tableData = filteredData.slice(start, start + this.query.limit);
- this.total = filteredData.length;
-
- // 鏇存柊鍥捐〃
- this.updateCharts();
-
- } catch (error) {
- console.error('鍔犺浇鏁版嵁澶辫触:', error);
- this.$message.error('鏁版嵁鍔犺浇澶辫触');
- } finally {
- this.loading = false;
- }
+ computed: {
+ useMock() {
+ return isStatisticsMock();
},
-
- // 鏇存柊鍥捐〃
- updateCharts() {
- // 鑾峰彇绉绘缁熻鍥�
- const regions = [...new Set(this.mockData.acquisition.map(item => item.region))];
- const months = [...new Set(this.mockData.acquisition.map(item => item.month))];
- const organTypes = ['liver', 'kidney', 'heart', 'lung', 'cornea'];
- const organNames = ['鑲濊剰', '鑲捐剰', '蹇冭剰', '鑲�', '鐪艰鑶�'];
-
- const seriesData = [];
- const xAxisData = [];
-
- // 鐢熸垚x杞存暟鎹�
- months.forEach(month => {
- regions.forEach(region => {
- xAxisData.push(`${month}\n${region}`);
- });
- });
-
- // 鐢熸垚绯诲垪鏁版嵁
- organTypes.forEach((organType, index) => {
- const data = [];
- months.forEach(month => {
- regions.forEach(region => {
- const item = this.mockData.acquisition.find(d => d.month === month && d.region === region);
- if (item) {
- data.push(item[organType]?.acquisition || 0);
- } else {
- data.push(0);
- }
- });
- });
-
- seriesData.push({
- name: `${organNames[index]}-鑾峰彇`,
- type: 'bar',
- stack: '鎬婚噺',
- data: data,
- itemStyle: this.getSeriesColor(index * 2)
- });
-
- const transplantData = [];
- months.forEach(month => {
- regions.forEach(region => {
- const item = this.mockData.acquisition.find(d => d.month === month && d.region === region);
- if (item) {
- transplantData.push(item[organType]?.transplant || 0);
- } else {
- transplantData.push(0);
- }
- });
- });
-
- seriesData.push({
- name: `${organNames[index]}-绉绘`,
- type: 'bar',
- stack: '鎬婚噺',
- data: transplantData,
- itemStyle: this.getSeriesColor(index * 2 + 1)
- });
- });
-
- this.acquisitionChartOptions = {
- tooltip: {
- trigger: 'axis',
- axisPointer: {
- type: 'shadow'
- }
- },
- legend: {
- data: seriesData.map(item => item.name),
- top: 20
- },
- grid: {
- left: '3%',
- right: '4%',
- bottom: '3%',
- containLabel: true
- },
- xAxis: {
- type: 'category',
- data: xAxisData,
- axisLabel: {
- interval: 0,
- rotate: 45
- }
- },
- yAxis: {
- type: 'value',
- name: '鏁伴噺(涓�)'
- },
- series: seriesData
- };
-
- // 寮冪敤鍒嗘瀽鍥�
- this.abandonChartOptions = {
+ abandonChartOptions() {
+ return {
tooltip: {
trigger: 'item',
formatter: '{a} <br/>{b} : {c} ({d}%)'
@@ -587,7 +191,7 @@
legend: {
orient: 'vertical',
left: 'left',
- data: this.mockData.abandon.map(item => item.name)
+ data: this.abandonReasons.map(item => item.name)
},
series: [
{
@@ -595,7 +199,7 @@
type: 'pie',
radius: '55%',
center: ['50%', '60%'],
- data: this.mockData.abandon,
+ data: this.abandonReasons,
emphasis: {
itemStyle: {
shadowBlur: 10,
@@ -606,18 +210,65 @@
}
]
};
+ }
+ },
+ created() {
+ this.loadData();
+ // 鏁版嵁婧�(mock/鐪熷疄鎺ュ彛)鍒囨崲鏃堕噸鏂板姞杞�
+ this.$watch(() => statisticsMode.useMock, () => this.loadData());
+ },
+ methods: {
+ // 缁勮鏌ヨ鏉′欢
+ buildQuery() {
+ const q = {};
+ if (this.query.region && this.query.region.length) {
+ q.area = this.query.region.join(',');
+ }
+ if (this.query.monthRange && this.query.monthRange.length === 2) {
+ q.startTime = this.query.monthRange[0];
+ q.endTime = this.query.monthRange[1];
+ }
+ if (this.query.organType) {
+ q.organName = this.query.organType;
+ }
+ return q;
},
- // 鑾峰彇绯诲垪棰滆壊
- getSeriesColor(index) {
- const colors = [
- '#409EFF', '#8cc5ff', // 鑲濊剰
- '#67C23A', '#95d475', // 鑲捐剰
- '#E6A23C', '#f3c96b', // 蹇冭剰
- '#F56C6C', '#f89898', // 鑲�
- '#909399', '#b1b3b8' // 鐪艰鑶�
- ];
- return { color: colors[index % colors.length] };
+ // 鍔犺浇鏁版嵁
+ async loadData() {
+ this.loading = true;
+ try {
+ const q = this.buildQuery();
+ const typeRes = await organType(q);
+
+ this.organData = toTotalsList(typeRes).map(item => ({
+ name: item.organName || '鏈煡',
+ acquisition: toNum(item.getCount),
+ transplant: toNum(item.useCount)
+ }));
+
+ this.updateCharts();
+ } catch (error) {
+ console.error('鍔犺浇鏁版嵁澶辫触:', error);
+ this.$message.error('鏁版嵁鍔犺浇澶辫触');
+ } finally {
+ this.loading = false;
+ }
+ },
+
+ // 鏇存柊鍥捐〃
+ updateCharts() {
+ this.acquisitionChartOptions = {
+ tooltip: axisTooltip(),
+ legend: legend(['鑾峰彇鏁伴噺', '绉绘鏁伴噺']),
+ grid: grid(),
+ xAxis: xAxis(this.organData.map(item => item.name)),
+ yAxis: yAxis('鏁伴噺(涓�)'),
+ series: [
+ barSeries('鑾峰彇鏁伴噺', this.organData.map(item => item.acquisition), COLORS.blue),
+ barSeries('绉绘鏁伴噺', this.organData.map(item => item.transplant), COLORS.green)
+ ]
+ };
},
// 鑾峰彇鏁伴噺鏍囩
@@ -638,8 +289,6 @@
this.query = {
region: [],
monthRange: [],
- ageRange: [],
- chinaCategory: [],
organType: null,
page: 1,
limit: 10
@@ -647,42 +296,16 @@
this.loadData();
},
- // 澶勭悊鍒嗛〉
- handlePagination(page) {
- this.query.page = page;
- this.loadData();
- },
-
- // 澶勭悊鍒嗛〉澶у皬鍙樺寲
- handlePageSizeChange(size) {
- this.query.limit = size;
- this.query.page = 1;
- this.loadData();
- },
-
- // 澶勭悊寮冪敤鏌ヨ
- handleAbandonQuery() {
- // 杩欓噷鍙互鏍规嵁abandonQuery绛涢�夋暟鎹�
- console.log('寮冪敤鏌ヨ:', this.abandonQuery);
- },
-
- // 澶勭悊姣忎緵浣撴煡璇�
- handlePerDonorQuery() {
- this.loadData();
- },
-
// 澶勭悊瀵煎嚭
handleExport() {
this.$message.info('瀵煎嚭鍔熻兘寮�鍙戜腑...');
- },
-
- // 鏌ョ湅鎹愮尞鑰呰鎯�
- viewDonorDetail(row) {
- this.$router.push({
- path: '/donor/detail',
- query: { id: row.id }
- });
}
}
};
</script>
+
+<style scoped>
+.statistics-page {
+ padding: 20px;
+}
+</style>
--
Gitblit v1.9.3