From ed0d05327d047db7395f1f6c919468ba99d34aed Mon Sep 17 00:00:00 2001
From: chenqi <chen.qi@jin-group.cn>
Date: Thu, 18 Jun 2026 15:16:54 +0800
Subject: [PATCH] =?UTF-8?q?feat(reportmanage):=20=E5=8F=AF=E8=A7=86?=
 =?UTF-8?q?=E5=8C=96=E4=BB=AA=E8=A1=A8=E7=9B=98=E5=89=8D=E7=AB=AF=E9=A1=B5?=
 =?UTF-8?q?=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/views/reportmanage/DashboardData.vue  | 184 ++++++++++++++++++
 1 file changed, 184 insertions(+)
 create mode 100644 healthlink-his-ui/src/views/reportmanage/DashboardData.vue

diff --git a/healthlink-his-ui/src/views/reportmanage/DashboardData.vue b/healthlink-his-ui/src/views/reportmanage/DashboardData.vue
new file mode 100644
index 000000000..d79e94abf
--- /dev/null
+++ b/healthlink-his-ui/src/views/reportmanage/DashboardData.vue
@@ -0,0 +1,184 @@
+<template>
+  <div class="app-container">
+    <el-card shadow="never">
+      <template #header>
+        <div class="card-header">
+          <span>可视化仪表盘</span>
+          <div>
+            <el-select v-model="dashboardType" placeholder="仪表盘类型" clearable style="margin-right:10px;width:160px" @change="loadData">
+              <el-option label="运营总览" value="overview" />
+              <el-option label="财务分析" value="finance" />
+              <el-option label="患者统计" value="patient" />
+            </el-select>
+            <el-button type="primary" :loading="loading" @click="loadData">刷新</el-button>
+          </div>
+        </div>
+      </template>
+
+      <el-row :gutter="16" class="mb16">
+        <el-col :span="6">
+          <el-card shadow="hover" :body-style="{padding:'16px'}">
+            <div style="text-align:center">
+              <div style="font-size:24px;font-weight:bold;color:#409eff">{{ formatMoney(dashData.totalRevenue) }}</div>
+              <div style="font-size:13px;color:#999;margin-top:4px">总收入(万)</div>
+            </div>
+          </el-card>
+        </el-col>
+        <el-col :span="6">
+          <el-card shadow="hover" :body-style="{padding:'16px'}">
+            <div style="text-align:center">
+              <div style="font-size:24px;font-weight:bold;color:#67c23a">{{ formatMoney(dashData.totalProfit) }}</div>
+              <div style="font-size:13px;color:#999;margin-top:4px">总利润(万)</div>
+            </div>
+          </el-card>
+        </el-col>
+        <el-col :span="6">
+          <el-card shadow="hover" :body-style="{padding:'16px'}">
+            <div style="text-align:center">
+              <div style="font-size:24px;font-weight:bold;color:#e6a23c">{{ dashData.totalPatients || 0 }}</div>
+              <div style="font-size:13px;color:#999;margin-top:4px">总患者数</div>
+            </div>
+          </el-card>
+        </el-col>
+        <el-col :span="6">
+          <el-card shadow="hover" :body-style="{padding:'16px'}">
+            <div style="text-align:center">
+              <div style="font-size:24px;font-weight:bold;color:#f56c6c">{{ dashData.totalDrgCases || 0 }}</div>
+              <div style="font-size:13px;color:#999;margin-top:4px">DRG病例数</div>
+            </div>
+          </el-card>
+        </el-col>
+      </el-row>
+
+      <el-row :gutter="16" class="mb16">
+        <el-col :span="6">
+          <el-card shadow="hover" :body-style="{padding:'16px'}">
+            <div style="text-align:center">
+              <div style="font-size:20px;font-weight:bold;color:#409eff">{{ formatMoney(dashData.totalCost) }}</div>
+              <div style="font-size:13px;color:#999;margin-top:4px">总成本(万)</div>
+            </div>
+          </el-card>
+        </el-col>
+        <el-col :span="6">
+          <el-card shadow="hover" :body-style="{padding:'16px'}">
+            <div style="text-align:center">
+              <div style="font-size:20px;font-weight:bold;color:#67c23a">{{ dashData.latestCmiValue || '-' }}</div>
+              <div style="font-size:13px;color:#999;margin-top:4px">最新CMI值</div>
+            </div>
+          </el-card>
+        </el-col>
+        <el-col :span="6">
+          <el-card shadow="hover" :body-style="{padding:'16px'}">
+            <div style="text-align:center">
+              <div style="font-size:20px;font-weight:bold;color:#e6a23c">{{ dashData.latestCostControlRate || '-' }}%</div>
+              <div style="font-size:13px;color:#999;margin-top:4px">成本控制率</div>
+            </div>
+          </el-card>
+        </el-col>
+        <el-col :span="6">
+          <el-card shadow="hover" :body-style="{padding:'16px'}">
+            <div style="text-align:center">
+              <div style="font-size:20px;font-weight:bold;color:#909399">{{ dashData.totalRecords || 0 }}</div>
+              <div style="font-size:13px;color:#999;margin-top:4px">数据记录数</div>
+            </div>
+          </el-card>
+        </el-col>
+      </el-row>
+    </el-card>
+
+    <el-card v-if="charts" shadow="never" class="mt16">
+      <template #header>
+        <span>图表数据</span>
+      </template>
+
+      <el-row :gutter="16">
+        <el-col :span="12">
+          <el-card shadow="never">
+            <template #header><span>月度收支趋势</span></template>
+            <el-table :data="charts.revenueChart || []" border size="small">
+              <el-table-column prop="month" label="月份" width="100" align="center" />
+              <el-table-column label="收入(万)" align="right">
+                <template #default="{ row }">{{ formatMoney(row.revenue) }}</template>
+              </el-table-column>
+              <el-table-column label="成本(万)" align="right">
+                <template #default="{ row }">{{ formatMoney(row.cost) }}</template>
+              </el-table-column>
+            </el-table>
+          </el-card>
+        </el-col>
+        <el-col :span="12">
+          <el-card shadow="never">
+            <template #header><span>科室收入分布</span></template>
+            <el-table :data="charts.departmentChart || []" border size="small">
+              <el-table-column prop="department" label="科室" width="160" show-overflow-tooltip />
+              <el-table-column label="收入(万)" align="right">
+                <template #default="{ row }">{{ formatMoney(row.revenue) }}</template>
+              </el-table-column>
+            </el-table>
+          </el-card>
+        </el-col>
+      </el-row>
+
+      <el-row :gutter="16" class="mt16">
+        <el-col :span="24">
+          <el-card shadow="never">
+            <template #header><span>DRG绩效趋势</span></template>
+            <el-table :data="charts.cmiChart || []" border size="small">
+              <el-table-column prop="month" label="月份" width="120" align="center" />
+              <el-table-column prop="cmiValue" label="CMI值" width="100" align="center" />
+              <el-table-column prop="costControlRate" label="成本控制率(%)" width="120" align="center" />
+              <el-table-column prop="totalCases" label="病例数" width="100" align="center" />
+            </el-table>
+          </el-card>
+        </el-col>
+      </el-row>
+    </el-card>
+  </div>
+</template>
+
+<script setup name="DashboardData" lang="ts">
+import { ref, onMounted } from 'vue'
+import { getDashboardData, getDashboardCharts } from '@/api/reportmanage'
+
+const loading = ref(false)
+const dashboardType = ref('overview')
+const dashData = ref({})
+const charts = ref(null)
+
+function formatMoney(val) {
+  if (!val) return '0.00'
+  return (val / 10000).toFixed(2)
+}
+
+function loadData() {
+  loading.value = true
+  Promise.all([
+    getDashboardData({ dashboardType: dashboardType.value }),
+    getDashboardCharts({ dashboardType: dashboardType.value })
+  ]).then(([dataRes, chartRes]) => {
+    dashData.value = dataRes.data || {}
+    charts.value = chartRes.data || {}
+  }).finally(() => {
+    loading.value = false
+  })
+}
+
+onMounted(() => loadData())
+</script>
+
+<style lang="scss" scoped>
+.app-container {
+  padding: 20px;
+}
+.mt16 {
+  margin-top: 16px;
+}
+.mb16 {
+  margin-bottom: 16px;
+}
+.card-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+</style>