diff --git a/openhis-ui-vue3/package-lock.json b/openhis-ui-vue3/package-lock.json
index 245d498b..c68c9013 100644
--- a/openhis-ui-vue3/package-lock.json
+++ b/openhis-ui-vue3/package-lock.json
@@ -13,9 +13,10 @@
         "@vueup/vue-quill": "1.2.0",
         "@vueuse/core": "10.6.1",
         "axios": "0.27.2",
+        "chart.js": "^4.5.1",
         "d3": "^7.9.0",
         "decimal.js": "^10.5.0",
-        "echarts": "5.4.3",
+        "echarts": "^5.4.3",
         "element-china-area-data": "^6.1.0",
         "element-plus": "2.9.11",
         "file-saver": "2.0.5",
@@ -544,6 +545,11 @@
       "resolved": "https://registry.npmmirror.com/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.5.0.tgz",
       "integrity": "sha512-gv3ZRaISU3fjPAgNsriBRqGWQL6quFx04YMPW/zD8XMLsU32mhCCbfbO6KZFLjvYpCZ8zyDEgqsgf+PwPaM7GQ=="
     },
+    "node_modules/@kurkle/color": {
+      "version": "0.3.4",
+      "resolved": "https://registry.npmmirror.com/@kurkle/color/-/color-0.3.4.tgz",
+      "integrity": "sha512-M5UknZPHRu3DEDWoipU6sE8PdkZ6Z/S+v4dD+Ke8IaNlpdSQah50lz1KtcFBa2vsdOnwbbnxJwVM4wty6udA5w=="
+    },
     "node_modules/@nodelib/fs.scandir": {
       "version": "2.1.5",
       "resolved": "https://registry.npmmirror.com/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz",
@@ -1686,6 +1692,17 @@
         "url": "https://github.com/chalk/chalk?sponsor=1"
       }
     },
+    "node_modules/chart.js": {
+      "version": "4.5.1",
+      "resolved": "https://registry.npmmirror.com/chart.js/-/chart.js-4.5.1.tgz",
+      "integrity": "sha512-GIjfiT9dbmHRiYi6Nl2yFCq7kkwdkp1W/lp2J99rX0yo9tgJGn3lKQATztIjb5tVtevcBtIdICNWqlq5+E8/Pw==",
+      "dependencies": {
+        "@kurkle/color": "^0.3.0"
+      },
+      "engines": {
+        "pnpm": ">=8"
+      }
+    },
     "node_modules/china-division": {
       "version": "2.7.0",
       "resolved": "https://registry.npmmirror.com/china-division/-/china-division-2.7.0.tgz",
@@ -7817,6 +7834,11 @@
       "resolved": "https://registry.npmmirror.com/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.5.0.tgz",
       "integrity": "sha512-gv3ZRaISU3fjPAgNsriBRqGWQL6quFx04YMPW/zD8XMLsU32mhCCbfbO6KZFLjvYpCZ8zyDEgqsgf+PwPaM7GQ=="
     },
+    "@kurkle/color": {
+      "version": "0.3.4",
+      "resolved": "https://registry.npmmirror.com/@kurkle/color/-/color-0.3.4.tgz",
+      "integrity": "sha512-M5UknZPHRu3DEDWoipU6sE8PdkZ6Z/S+v4dD+Ke8IaNlpdSQah50lz1KtcFBa2vsdOnwbbnxJwVM4wty6udA5w=="
+    },
     "@nodelib/fs.scandir": {
       "version": "2.1.5",
       "resolved": "https://registry.npmmirror.com/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz",
@@ -8634,6 +8656,14 @@
         "supports-color": "^7.1.0"
       }
     },
+    "chart.js": {
+      "version": "4.5.1",
+      "resolved": "https://registry.npmmirror.com/chart.js/-/chart.js-4.5.1.tgz",
+      "integrity": "sha512-GIjfiT9dbmHRiYi6Nl2yFCq7kkwdkp1W/lp2J99rX0yo9tgJGn3lKQATztIjb5tVtevcBtIdICNWqlq5+E8/Pw==",
+      "requires": {
+        "@kurkle/color": "^0.3.0"
+      }
+    },
     "china-division": {
       "version": "2.7.0",
       "resolved": "https://registry.npmmirror.com/china-division/-/china-division-2.7.0.tgz",
diff --git a/openhis-ui-vue3/package.json b/openhis-ui-vue3/package.json
index c8b9e966..6082e8e7 100644
--- a/openhis-ui-vue3/package.json
+++ b/openhis-ui-vue3/package.json
@@ -21,9 +21,10 @@
     "@vueup/vue-quill": "1.2.0",
     "@vueuse/core": "10.6.1",
     "axios": "0.27.2",
+    "chart.js": "^4.5.1",
     "d3": "^7.9.0",
     "decimal.js": "^10.5.0",
-    "echarts": "5.4.3",
+    "echarts": "^5.4.3",
     "element-china-area-data": "^6.1.0",
     "element-plus": "2.9.11",
     "file-saver": "2.0.5",
diff --git a/openhis-ui-vue3/src/views/index.vue b/openhis-ui-vue3/src/views/index.vue
index f084f71c..7788c97a 100644
--- a/openhis-ui-vue3/src/views/index.vue
+++ b/openhis-ui-vue3/src/views/index.vue
@@ -1,106 +1,457 @@
 <template>
-  <div class="container">
-    <div class="awaitingBtn">
-      <el-button @click="awaitingMedicineBtn">效期预警 <span>{{total}}</span></el-button>
+  <div class="dashboard-container">
+    <!-- 顶部导航栏 -->
+    <header class="header">
+      <div class="logo">
+        <span class="logo-text">医院信息管理系统</span>
+      </div>
+      <div class="header-right">
+        <div class="notification-badge">
+          <i class="header-icon">🔔</i>
+          <span class="badge">2</span>
+        </div>
+        <i class="header-icon">⚙️</i>
+        <div class="user-info">
+          <span class="user-avatar">👤</span>
+          <span>用户</span>
+        </div>
+      </div>
+    </header>
+
+    <!-- 主体内容 -->
+    <div class="main-content">
+      <!-- 左侧导航栏 -->
+      <nav class="sidebar">
+        <div class="menu-item active">
+          <span class="menu-icon">📊</span>
+          <span>仪表盘</span>
+        </div>
+        <div class="menu-item">
+          <span class="menu-icon">👥</span>
+          <span>患者管理</span>
+        </div>
+        <div class="menu-item">
+          <span class="menu-icon">💉</span>
+          <span>预约管理</span>
+        </div>
+        <div class="menu-item">
+          <span class="menu-icon">🏥</span>
+          <span>门诊管理</span>
+        </div>
+        <div class="menu-item">
+          <span class="menu-icon">⚕️</span>
+          <span>住院管理</span>
+        </div>
+        <div class="menu-item">
+          <span class="menu-icon">💊</span>
+          <span>药房管理</span>
+        </div>
+        <div class="menu-item">
+          <span class="menu-icon">📋</span>
+          <span>报表统计</span>
+        </div>
+        <div class="menu-item">
+          <span class="menu-icon">⚙️</span>
+          <span>系统设置</span>
+        </div>
+      </nav>
+
+      <!-- 主内容区 -->
+      <div class="content-wrapper">
+        <div class="awaitingBtn">
+          <el-button @click="awaitingMedicineBtn">效期预警 <span>{{ total }}</span></el-button>
+        </div>
+
+        <h1 class="section-title">仪表盘</h1>
+
+        <!-- 关键指标卡片 -->
+        <div class="dashboard-grid">
+          <div class="card">
+            <div class="card-title">今日预约量</div>
+            <div class="card-value">126</div>
+            <div class="card-stats">
+              <span class="stats-icon">↑</span>
+              <span>12% 较昨日</span>
+            </div>
+          </div>
+          <div class="card">
+            <div class="card-title">门诊量统计</div>
+            <div class="card-value">342</div>
+            <div class="card-stats">
+              <span class="stats-icon">↑</span>
+              <span>8% 较上周</span>
+            </div>
+          </div>
+          <div class="card">
+            <div class="card-title">住院患者数</div>
+            <div class="card-value">78</div>
+            <div class="card-stats down">
+              <span class="stats-icon">↓</span>
+              <span>3% 较上周</span>
+            </div>
+          </div>
+          <div class="card">
+            <div class="card-title">药品库存预警</div>
+            <div class="card-value">8</div>
+            <div class="card-stats">
+              <span class="stats-icon">!</span>
+              <span>需要立即处理</span>
+            </div>
+          </div>
+        </div>
+
+        <!-- 图表展示区 -->
+        <div class="chart-container">
+          <canvas id="statsChart"></canvas>
+        </div>
+
+        <!-- 重要通知和待办事项 -->
+        <div class="bottom-content">
+          <div class="notification-container">
+            <div class="notification-title">重要通知</div>
+            <ul class="notification-list">
+              <li class="notification-item">系统将于周六凌晨2:00进行维护升级</li>
+              <li class="notification-item">新的门诊排班系统已上线，请尽快熟悉</li>
+              <li class="notification-item">三季度医疗质量分析报告已发布</li>
+            </ul>
+          </div>
+          <div class="todo-container">
+            <div class="todo-title">待办事项</div>
+            <ul class="todo-list">
+              <li class="todo-item">
+                <span>未完成预约</span>
+                <span class="todo-count">12个</span>
+              </li>
+              <li class="todo-item">
+                <span>待处理检查结果</span>
+                <span class="todo-count">7份</span>
+              </li>
+              <li class="todo-item">
+                <span>待开处方</span>
+                <span class="todo-count">3张</span>
+              </li>
+            </ul>
+            <button class="btn btn-primary">查看详情</button>
+          </div>
+        </div>
+
+        <!-- 患者列表 -->
+        <h2 class="section-title">最近患者</h2>
+        <div class="table-container">
+          <table>
+            <thead>
+              <tr>
+                <th>患者姓名</th>
+                <th>病历号</th>
+                <th>年龄</th>
+                <th>最后就诊时间</th>
+                <th>状态</th>
+                <th>操作</th>
+              </tr>
+            </thead>
+            <tbody>
+              <tr>
+                <td>张明</td>
+                <td>HN2023001</td>
+                <td>45</td>
+                <td>2023-10-20 09:30</td>
+                <td><span style="color: #67c23a;">已完成</span></td>
+                <td>
+                  <button class="btn btn-outline">详情</button>
+                </td>
+              </tr>
+              <tr>
+                <td>李红</td>
+                <td>HN2023002</td>
+                <td>32</td>
+                <td>2023-10-20 10:15</td>
+                <td><span style="color: #ff9800;">待检查</span></td>
+                <td>
+                  <button class="btn btn-outline">详情</button>
+                </td>
+              </tr>
+              <tr>
+                <td>王建军</td>
+                <td>HN2023003</td>
+                <td>68</td>
+                <td>2023-10-19 14:20</td>
+                <td><span style="color: #d45d79;">住院中</span></td>
+                <td>
+                  <button class="btn btn-outline">详情</button>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </div>
+      </div>
     </div>
-    <!-- <div class="logo"> -->
-      <!-- <img src="/src/assets/images/jlau.jpg" /> -->
-    <!-- </div> -->
   </div>
 </template>
 
 <script setup name="Index">
+import { ref, onMounted } from 'vue';
+import { useRouter } from 'vue-router';
+import Chart from 'chart.js/auto';
 import {
   getExpirationWarning,
 } from "./medicationmanagement/statisticalManagement/statisticalManagent";
 
 const router = useRouter();
-const version = ref('3.8.7');
-const total = ref(0)
-function awaitingMedicineBtn(){
-  router.push({ path: '/medicationmanagement/statisticalManagement/earlyWarning' })
+const total = ref(0);
+
+function awaitingMedicineBtn() {
+  router.push({ path: '/medicationmanagement/statisticalManagement/earlyWarning' });
 }
-function goTarget(url) {
-  window.open(url, '__blank');
-}
-function getExpirationWarningCount(){
-  getExpirationWarning({pageNo: 1,pageSize: 10}).then((res) => {
-    total.value = res.data.total||0
+
+function getExpirationWarningCount() {
+  getExpirationWarning({ pageNo: 1, pageSize: 10 }).then((res) => {
+    total.value = res.data.total || 0;
+  }).catch((err) => {
+    console.error('获取效期预警数量失败:', err);
+    total.value = 0;
   });
 }
-getExpirationWarningCount()
+
+let chartInstance = null;
+
+onMounted(() => {
+  getExpirationWarningCount();
+
+  const ctx = document.getElementById('statsChart');
+  if (!ctx) return;
+
+  // 销毁已有实例
+  if (chartInstance) {
+    chartInstance.destroy();
+  }
+
+  // 模拟数据：近7天门诊量与预约量
+  const labels = ['周一', '周二', '周三', '周四', '周五', '周六', '周日'];
+  const outpatientData = [310, 335, 305, 345, 370, 270, 210]; // 门诊量（柱状图）
+  const appointmentData = [100, 120, 110, 130, 140, 90, 70]; // 预约量（折线图）
+
+  chartInstance = new Chart(ctx.getContext('2d'), {
+    type: 'bar',
+    data: {
+      labels: labels,
+      datasets: [
+        {
+          label: '门诊量',
+          data: outpatientData,
+          backgroundColor: '#91c8e5',
+          borderColor: '#66a8cc',
+          borderWidth: 1,
+          borderRadius: 4,
+          borderSkipped: false,
+        },
+        {
+          label: '预约量',
+          data: appointmentData,
+          type: 'line',
+          borderColor: '#f56c6c',
+          backgroundColor: 'rgba(245, 108, 108, 0.1)',
+          borderWidth: 2,
+          pointBackgroundColor: '#f56c6c',
+          pointBorderColor: '#fff',
+          pointBorderWidth: 2,
+          pointRadius: 4,
+          fill: true,
+          tension: 0.3,
+          lineTension: 0.3,
+        }
+      ]
+    },
+    options: {
+      responsive: true,
+      maintainAspectRatio: false,
+      plugins: {
+        legend: {
+          position: 'top',
+          labels: {
+            font: {
+              size: 12,
+              weight: 'bold'
+            }
+          }
+        },
+        tooltip: {
+          mode: 'index',
+          intersect: false,
+          backgroundColor: 'rgba(0, 0, 0, 0.7)',
+          titleFont: {
+            size: 13
+          },
+          bodyFont: {
+            size: 12
+          }
+        }
+      },
+      scales: {
+        x: {
+          grid: {
+            display: false
+          },
+          ticks: {
+            font: {
+              size: 11
+            }
+          }
+        },
+        y: {
+          beginAtZero: true,
+          max: 400,
+          stepSize: 50,
+          grid: {
+            color: 'rgba(0, 0, 0, 0.05)'
+          },
+          ticks: {
+            font: {
+              size: 11
+            }
+          }
+        }
+      }
+    }
+  });
+});
 </script>
 
 <style scoped lang="scss">
-.home {
-  blockquote {
-    padding: 10px 20px;
-    margin: 0 0 20px;
-    font-size: 17.5px;
-    border-left: 5px solid #eee;
-  }
-  hr {
-    margin-top: 20px;
-    margin-bottom: 20px;
-    border: 0;
-    border-top: 1px solid #eee;
-  }
-  .col-item {
-    margin-bottom: 20px;
-  }
-
-  ul {
-    padding: 0;
-    margin: 0;
-  }
-
-  font-family: 'open sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
-  font-size: 13px;
-  color: #676a6c;
-  overflow-x: hidden;
-
-  ul {
-    list-style-type: none;
-  }
-
-  h4 {
-    margin-top: 0px;
-  }
-
-  h2 {
-    margin-top: 10px;
-    font-size: 26px;
-    font-weight: 100;
-  }
-
-  p {
-    margin-top: 10px;
-
-    b {
-      font-weight: 700;
-    }
-  }
-
-  .update-log {
-    ol {
-      display: block;
-      list-style-type: decimal;
-      margin-block-start: 1em;
-      margin-block-end: 1em;
-      margin-inline-start: 0;
-      margin-inline-end: 0;
-      padding-inline-start: 40px;
-    }
-  }
-}
-.container {
+.dashboard-container {
   display: flex;
-  justify-content: center; /* 水平居中 */
-  align-items: center; /* 垂直居中 */
-  height: 70vh; /* 确保容器高度至少为视口高度 */
-  width: 100%;
+  flex-direction: column;
+  height: 100vh;
+  background-color: #f5f7fa;
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
+  padding: 0;
 }
-.awaitingBtn{
+
+.header {
+  height: 60px;
+  background-color: white;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 0 24px;
+  position: sticky;
+  top: 0;
+  z-index: 1000;
+}
+
+.logo {
+  display: flex;
+  align-items: center;
+}
+
+.logo-text {
+  font-size: 18px;
+  font-weight: 600;
+  color: #166773;
+}
+
+.header-right {
+  display: flex;
+  align-items: center;
+  gap: 16px;
+}
+
+.notification-badge {
+  position: relative;
+  cursor: pointer;
+}
+
+.header-icon {
+  font-size: 20px;
+  cursor: pointer;
+  padding: 8px;
+  border-radius: 4px;
+  transition: background-color 0.3s;
+}
+
+.header-icon:hover {
+  background-color: #f5f7fa;
+}
+
+.badge {
+  position: absolute;
+  top: 0;
+  right: 0;
+  background-color: #ff4d4f;
+  color: white;
+  font-size: 12px;
+  padding: 2px 6px;
+  border-radius: 10px;
+  min-width: 16px;
+  text-align: center;
+}
+
+.user-info {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 6px 12px;
+  border-radius: 4px;
+  cursor: pointer;
+  transition: background-color 0.3s;
+}
+
+.user-info:hover {
+  background-color: #f5f7fa;
+}
+
+.user-avatar {
+  font-size: 20px;
+}
+
+.main-content {
+  display: flex;
+  flex: 1;
+  overflow: hidden;
+}
+
+.sidebar {
+  width: 200px;
+  background-color: white;
+  box-shadow: 2px 0 4px rgba(0, 0, 0, 0.1);
+  overflow-y: auto;
+}
+
+.menu-item {
+  display: flex;
+  align-items: center;
+  padding: 16px 24px;
+  cursor: pointer;
+  transition: all 0.3s;
+  border-left: 3px solid transparent;
+}
+
+.menu-item:hover {
+  background-color: #f0f9ff;
+}
+
+.menu-item.active {
+  background-color: #e6f7ff;
+  border-left-color: #1890ff;
+  color: #1890ff;
+  font-weight: 500;
+}
+
+.menu-icon {
+  margin-right: 12px;
+  font-size: 18px;
+}
+
+.content-wrapper {
+  flex: 1;
+  padding: 20px;
+  overflow-y: auto;
+  background-color: #f5f7fa;
+}
+
+.awaitingBtn {
+  margin-bottom: 20px;
+  
   .el-button{
     border: 1px #166773 solid;
     span{
@@ -108,6 +459,7 @@ getExpirationWarningCount()
       margin-left: 5px;
     }
   }
+  
   .el-button:hover{
     border: 1px #166773 solid;
     color: #166773;
@@ -116,15 +468,204 @@ getExpirationWarningCount()
       margin-left: 5px;
     }
   }
-  position: absolute;
-  top:20px;
-  left: 20px;
 }
-.logo {
-  width: 1000px;
-  margin: 0 auto;
-  background: url(../assets/images/logo_bg.jpg) no-repeat right bottom;
-  overflow: hidden;
-}
-</style>
 
+.section-title {
+  font-size: 24px;
+  margin-bottom: 20px;
+  color: #333;
+  font-weight: 600;
+}
+
+.card {
+  background-color: #fff;
+  border-radius: 8px;
+  padding: 24px;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
+  transition: all 0.3s ease;
+}
+
+.card:hover {
+  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
+}
+
+.card-title {
+  font-size: 14px;
+  color: #606266;
+  margin-bottom: 12px;
+}
+
+.card-value {
+  font-size: 32px;
+  font-weight: 600;
+  color: #303133;
+  margin-bottom: 8px;
+}
+
+.card-stats {
+  display: flex;
+  align-items: center;
+  font-size: 12px;
+  color: #67c23a;
+}
+
+.card-stats.down {
+  color: #f56c6c;
+}
+
+.stats-icon {
+  margin-right: 4px;
+}
+
+.dashboard-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
+  gap: 20px;
+  margin-bottom: 30px;
+}
+
+.chart-container {
+  background-color: #fff;
+  border-radius: 8px;
+  padding: 24px;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
+  margin-bottom: 30px;
+  height: 300px;
+  
+  canvas {
+    width: 100% !important;
+    height: 100% !important;
+  }
+}
+
+.bottom-content {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  gap: 20px;
+  margin-bottom: 30px;
+}
+
+.notification-container,
+.todo-container {
+  background-color: #fff;
+  border-radius: 8px;
+  padding: 24px;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
+}
+
+.notification-title,
+.todo-title {
+  font-size: 18px;
+  font-weight: 600;
+  color: #303133;
+  margin-bottom: 16px;
+}
+
+.notification-list {
+  list-style: none;
+  padding: 0;
+  margin: 0;
+}
+
+.notification-item {
+  padding: 12px 0;
+  border-bottom: 1px solid #ebeef5;
+  
+  &:last-child {
+    border-bottom: none;
+  }
+}
+
+.todo-list {
+  list-style: none;
+  padding: 0;
+  margin: 0;
+  margin-bottom: 20px;
+}
+
+.todo-item {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 12px 0;
+  border-bottom: 1px solid #ebeef5;
+  
+  &:last-child {
+    border-bottom: none;
+  }
+}
+
+.todo-count {
+  color: #606266;
+  font-size: 14px;
+}
+
+.table-container {
+  background-color: #fff;
+  border-radius: 8px;
+  padding: 24px;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
+}
+
+table {
+  width: 100%;
+  border-collapse: collapse;
+}
+
+th, td {
+  padding: 12px;
+  text-align: left;
+  border-bottom: 1px solid #ebeef5;
+}
+
+th {
+  background-color: #f5f7fa;
+  font-weight: 600;
+  color: #303133;
+}
+
+tr:last-child td {
+  border-bottom: none;
+}
+
+.btn {
+  padding: 6px 12px;
+  border-radius: 4px;
+  font-size: 14px;
+  cursor: pointer;
+  transition: all 0.3s ease;
+  border: none;
+  outline: none;
+}
+
+.btn-primary {
+  background-color: #1890ff;
+  color: #fff;
+}
+
+.btn-primary:hover {
+  background-color: #40a9ff;
+}
+
+.btn-outline {
+  background-color: transparent;
+  border: 1px solid #dcdfe6;
+  color: #606266;
+}
+
+.btn-outline:hover {
+  border-color: #c6e2ff;
+  color: #40a9ff;
+  background-color: #ecf5ff;
+}
+
+@media (max-width: 768px) {
+  .bottom-content {
+    grid-template-columns: 1fr;
+  }
+  
+  .dashboard-grid {
+    grid-template-columns: 1fr;
+  }
+}
+</style>
\ No newline at end of file
diff --git a/openhis-ui-vue3/src/views/inpatientDoctor/home/components/diagnosis/diagnosis.vue b/openhis-ui-vue3/src/views/inpatientDoctor/home/components/diagnosis/diagnosis.vue
index 81f120f8..b648e09d 100644
--- a/openhis-ui-vue3/src/views/inpatientDoctor/home/components/diagnosis/diagnosis.vue
+++ b/openhis-ui-vue3/src/views/inpatientDoctor/home/components/diagnosis/diagnosis.vue
@@ -2,19 +2,17 @@
   <div>
     <el-row :gutter="24">
       <el-col :span="4" :xs="24">
-        <div style="height: 44px; display: flex; align-items: center; flex: none">
-          <el-input
-            v-model="diagnosis"
-            placeholder="诊断名称"
-            clearable
-            style="width: 100%"
-            @keyup.enter="queryDiagnosisUse"
-          >
-            <template #append>
-              <el-button icon="Search" @click="queryDiagnosisUse" />
-            </template>
-          </el-input>
-        </div>
+        <el-input
+          v-model="diagnosis"
+          placeholder="诊断名称"
+          clearable
+          style="width: 100%; margin-bottom: 10px"
+          @keyup.enter="queryDiagnosisUse"
+        >
+          <template #append>
+            <el-button icon="Search" @click="queryDiagnosisUse" />
+          </template>
+        </el-input>
         <el-tree
           ref="treeRef"
           :data="tree"
@@ -68,16 +66,21 @@
         </el-tree>
       </el-col>
       <el-col :span="20" :xs="24">
-        <div style="height: 44px; display: flex; align-items: center; flex: none">
+        <div style="margin-bottom: 10px">
           <el-button type="primary" plain @click="handleAddDiagnosis()"> 新增诊断 </el-button>
           <el-button type="primary" plain @click="handleSaveDiagnosis()"> 保存诊断 </el-button>
           <el-button type="primary" plain @click="handleAddTcmDiagonsis()"> 中医诊断 </el-button>
           <el-button type="primary" plain @click="handleImport()"> 导入慢性病诊断 </el-button>
         </div>
+
         <el-form :model="form" :rules="rules" ref="formRef">
           <el-table ref="diagnosisTableRef" :data="form.diagnosisList" height="650">
-            <el-table-column label="序号" type="index" width="50" />
-            <el-table-column label="诊断排序" align="center" prop="diagSrtNo" width="180">
+            <el-table-column label="序号"  width="50" >
+            <template #default="scope">
+    {{ scope.$index + 1 }}
+  </template>
+</el-table-column>
+            <el-table-column label="诊断排序" align="center" prop="diagSrtNo" width="120">
               <template #default="scope">
                 <el-form-item
                   :prop="`diagnosisList.${scope.$index}.diagSrtNo`"
@@ -136,9 +139,13 @@
                 </el-form-item>
               </template>
             </el-table-column>
-            <el-table-column label="医保码" align="center" prop="ybNo" width="180" />
-            <el-table-column label="诊断类型" align="center" prop="maindiseFlag">
+            
+            <el-table-column label="诊断医生" align="center" prop="diagnosisDoctor" width="120" />
+            <el-table-column label="诊断时间" align="center" prop="diagnosisTime" width="150" />
+            <el-table-column label="诊断代码" align="center" prop="ybNo" width="180" />
+            <el-table-column label="诊断类型" align="center" prop="maindiseFlag" width="120">
               <template #default="scope">
+              <div style="display:flex;flex-direction:column;align-items:center;gap:5px;">
                 <el-checkbox
                   label="主诊断"
                   :trueLabel="1"
@@ -151,7 +158,7 @@
                 <el-select
                   v-model="scope.row.verificationStatusEnum"
                   placeholder=" "
-                  style="width: 40%; padding-bottom: 5px; padding-left: 10px"
+                  style="width: 100%; padding-bottom: 5px; padding-left: 10px"
                   size="small"
                 >
                   <el-option
@@ -161,6 +168,7 @@
                     :value="item.value"
                   />
                 </el-select>
+              </div>
               </template>
             </el-table-column>
             <el-table-column label="操作" align="center" width="130">
@@ -185,28 +193,30 @@
     />
     <AddDiagnosisDialog
       :openAddDiagnosisDialog="openAddDiagnosisDialog"
-      :patientInfo="patientInfo"
+      :patientInfo="props.patientInfo"
       @close="closeDiagnosisDialog"
     />
   </div>
 </template>
 
 <script setup>
-import { getCurrentInstance } from 'vue';
+import { getCurrentInstance, nextTick } from 'vue'; // 添加 nextTick 导入
+import useUserStore from '@/store/modules/user';
 import {
   getConditionDefinitionInfo,
   saveDiagnosis,
   diagnosisInit,
   deleteDiagnosisBind,
   getEncounterDiagnosis,
+  getEmrDetail,
   getChronicDisease,
   getTcmDiagnosis,
   delEncounterDiagnosis,
+  isFoodDiseasesNew,
 } from '../api';
 import diagnosisdialog from '../diagnosis/diagnosisdialog.vue';
 import AddDiagnosisDialog from './addDiagnosisDialog.vue';
 import diagnosislist from '../diagnosis/diagnosislist.vue';
-import { patientInfo } from '../../store/patient.js';
 // const diagnosisList = ref([]);
 const allowAdd = ref(false);
 const tree = ref([]);
@@ -228,50 +238,93 @@ const props = defineProps({
 });
 const emits = defineEmits(['diagnosisSave']);
 const { proxy } = getCurrentInstance();
+const userStore = useUserStore();
 const { med_type } = proxy.useDict('med_type');
 const rules = ref({
   name: [{ required: true, message: '请选择诊断', trigger: 'change' }],
   medTypeCode: [{ required: true, message: '请选择诊断类型', trigger: 'change' }],
   diagSrtNo: [{ required: true, message: '请输入诊断序号', trigger: 'change' }],
 });
-
+const isSaving = ref(false);
 watch(
   () => form.value.diagnosisList,
   () => {
-    emits('diagnosisSave', false);
+    // 如果正在保存，则不触发更新事件
+    if (!isSaving.value) {
+      emits('diagnosisSave', false);
+    }
   },
   { deep: true }
 );
 
-// function getDetail(encounterId) {
-//   getEmrDetail(encounterId).then((res) => {
-//     allowAdd.value = res.data ? true : false;
-//   });
-// }
+function getDetail(encounterId) {
+  if (!encounterId) {
+    console.warn('未提供有效的就诊ID，无法获取病历详情');
+    return;
+  }
+  
+  getEmrDetail(encounterId).then((res) => {
+    allowAdd.value = res.data ? true : false;
+  });
+}
 
 function getList() {
-  getEncounterDiagnosis(patientInfo.value.encounterId).then((res) => {
+  if (!props.patientInfo || !props.patientInfo.encounterId) {
+    console.warn('患者就诊信息不完整，无法获取诊断数据');
+    return;
+  }
+  
+  getEncounterDiagnosis(props.patientInfo.encounterId).then((res) => {
     if (res.code == 200) {
-      form.value.diagnosisList = res.data;
+      // 为每个诊断项添加默认的诊断医生和时间（如果不存在）
+      const diagnosisList = res.data.map(item => ({
+        ...item,
+        diagnosisDoctor: item.diagnosisDoctor || props.patientInfo.practitionerName || props.patientInfo.doctorName || props.patientInfo.physicianName || userStore.name,
+        diagnosisTime: item.diagnosisTime || new Date().toLocaleString('zh-CN')
+      }));
+      
+      // 对获取的数据进行排序
+      diagnosisList.sort((a, b) => {
+        const aNo = typeof a.diagSrtNo === 'number' ? a.diagSrtNo : 9999;
+        const bNo = typeof b.diagSrtNo === 'number' ? b.diagSrtNo : 9999;
+        return aNo - bNo;
+      });
+      
+      form.value.diagnosisList = diagnosisList;
       emits('diagnosisSave', false);
       console.log(form.value.diagnosisList);
     }
   });
-  getTcmDiagnosis({ encounterId: patientInfo.value.encounterId }).then((res) => {
+  
+  getTcmDiagnosis({ encounterId: props.patientInfo.encounterId }).then((res) => {
     if (res.code == 200) {
-      if (res.data.illness.length > 0) {
+      if (res.data.illness && res.data.illness.length > 0 && res.data.symptom) {
+        const newList = [];
         res.data.illness.forEach((item, index) => {
-          form.value.diagnosisList.push({
-            name: item.name + '-' + res.data.symptom[index].name,
+          newList.push({
+            name: item.name + '-' + (res.data.symptom[index]?.name || ''),
             ybNo: item.ybNo,
             medTypeCode: item.medTypeCode,
+            diagnosisDoctor: props.patientInfo.practitionerName || props.patientInfo.doctorName || props.patientInfo.physicianName || userStore.name,
+            diagnosisTime: new Date().toLocaleString('zh-CN')
           });
         });
+        
+        // 将新数据添加到现有列表中
+        form.value.diagnosisList.push(...newList);
+        
+        // 重新排序整个列表
+        form.value.diagnosisList.sort((a, b) => {
+          const aNo = typeof a.diagSrtNo === 'number' ? a.diagSrtNo : 9999;
+          const bNo = typeof b.diagSrtNo === 'number' ? b.diagSrtNo : 9999;
+          return aNo - bNo;
+        });
       }
       emits('diagnosisSave', false);
       console.log(form.value.diagnosisList);
     }
   });
+  
   getTree();
 }
 
@@ -285,19 +338,28 @@ function init() {
 }
 
 function handleImport() {
-  if (patientInfo.value.contractName != '自费') {
+  if (!props.patientInfo || !props.patientInfo.encounterId) {
+    console.warn('患者就诊信息不完整，无法导入慢性病信息');
+    return;
+  }
+  
+  if (props.patientInfo.contractName != '自费') {
     // 获取患者慢性病信息
-    getChronicDisease({ encounterId: patientInfo.value.encounterId }).then((res) => {
-      if (res.data.length > 0) {
+    getChronicDisease({ encounterId: props.patientInfo.encounterId }).then((res) => {
+      if (res.data && res.data.length > 0) {
         res.data.forEach((item, index) => {
           form.value.diagnosisList.push({
-            ...item,
-            ...{
-              medTypeCode: '140104',
-              verificationStatusEnum: 4,
-              definitionId: item.id,
-              diagSrtNo: form.value.diagnosisList.length + 1,
-            },
+        ...item,
+        ...{
+          medTypeCode: '140104',
+          verificationStatusEnum: 4,
+          definitionId: item.id,
+          diagSrtNo: form.value.diagnosisList.length + 1,
+          iptDiseTypeCode: 2,
+          diagnosisDesc: '',
+              diagnosisDoctor: props.patientInfo.practitionerName || props.patientInfo.doctorName || props.patientInfo.physicianName || userStore.name,
+              diagnosisTime: new Date().toLocaleString('zh-CN')
+        },
           });
         });
       }
@@ -340,7 +402,8 @@ const filterNode = (value, data) => {
  * 获取诊断树列表
  */
 function getTree() {
-  getConditionDefinitionInfo(patientInfo.value ? patientInfo.value.patientId : '').then((res) => {
+  const patientId = props.patientInfo?.patientId || '';
+  getConditionDefinitionInfo(patientId).then((res) => {
     if (res.code == 200) {
       let list = [];
       list = res.data.patientHistoryList;
@@ -377,14 +440,20 @@ function getTree() {
 function handleAddDiagnosis() {
   proxy.$refs.formRef.validate((valid) => {
     if (valid) {
+      if (!allowAdd.value) {
+        proxy.$modal.msgWarning('请先填写病历');
+        return;
+      }
       form.value.diagnosisList.push({
         showPopover: false,
         name: undefined,
         verificationStatusEnum: 4,
-        medTypeCode: '21',
+        medTypeCode: '11',
         diagSrtNo: form.value.diagnosisList.length + 1,
-        iptDiseTypeCode: 31,
+        iptDiseTypeCode: 2,
         diagnosisDesc: '',
+        diagnosisDoctor: props.patientInfo.practitionerName || props.patientInfo.doctorName || props.patientInfo.physicianName || userStore.name,
+        diagnosisTime: new Date().toLocaleString('zh-CN')
       });
       if (form.value.diagnosisList.length == 1) {
         form.value.diagnosisList[0].maindiseFlag = 1;
@@ -398,13 +467,31 @@ function handleAddTcmDiagonsis() {
   openAddDiagnosisDialog.value = true;
 }
 
+/**
+ * 删除诊断
+ */
 /**
  * 删除诊断
  */
 function handleDeleteDiagnosis(row, index) {
   if (row.conditionId) {
     delEncounterDiagnosis(row.conditionId).then(() => {
-      getList();
+      // 不要立即调用getList()，而是从当前列表中移除
+      form.value.diagnosisList.splice(index, 1);
+      // 重新排序剩余的项目
+      const sortedList = [...form.value.diagnosisList].sort((a, b) => {
+        const aNo = typeof a.diagSrtNo === 'number' ? a.diagSrtNo : 9999;
+        const bNo = typeof b.diagSrtNo === 'number' ? b.diagSrtNo : 9999;
+        return aNo - bNo;
+      });
+      
+      // 重新分配连续的序号
+      sortedList.forEach((item, idx) => {
+        item.diagSrtNo = idx + 1;
+      });
+      
+      // 更新列表
+      form.value.diagnosisList = sortedList.map(item => ({ ...item }));
       getTree();
     });
   } else {
@@ -428,35 +515,72 @@ function handleMaindise(value, index) {
   }
 }
 
+/**
+ * 保存诊断
+ */
+/**
+ * 保存诊断
+ */
+/**
+ * 保存诊断
+ */
 /**
  * 保存诊断
  */
 function handleSaveDiagnosis() {
   proxy.$refs.formRef.validate((valid) => {
     if (valid) {
-      if (form.value.diagnosisList.length == 0) {
+      if (form.value.diagnosisList.length === 0) {
         proxy.$modal.msgWarning('诊断不能为空');
-        return false;
+        return;
       } else if (!form.value.diagnosisList.some((diagnosis) => diagnosis.maindiseFlag === 1)) {
         proxy.$modal.msgWarning('至少添加一条主诊断');
-      } else {
-        saveDiagnosis({
-          patientId: patientInfo.value.patientId,
-          encounterId: patientInfo.value.encounterId,
-          diagnosisChildList: form.value.diagnosisList,
-        }).then((res) => {
-          if (res.code == 200) {
-            getTree();
-            getList();
-            emits('diagnosisSave', false);
-            proxy.$modal.msgSuccess('诊断已保存');
-          }
-        });
+        return;
       }
+
+      // 设置保存标志，避免触发watch监听器
+      isSaving.value = true;
+
+      // 步骤1：深拷贝并按 diagSrtNo 排序
+      const sortedList = [...form.value.diagnosisList].sort((a, b) => {
+        const aNo = typeof a.diagSrtNo === 'number' ? a.diagSrtNo : 9999;
+        const bNo = typeof b.diagSrtNo === 'number' ? b.diagSrtNo : 9999;
+        return aNo - bNo;
+      });
+
+      // 步骤2：重新分配连续的序号（从1开始）
+      sortedList.forEach((item, index) => {
+        item.diagSrtNo = index + 1; // 这里是关键！把“诊断排序”改成新顺序
+      });
+
+      // 步骤3：提交排序后的数据
+      saveDiagnosis({
+        patientId: props.patientInfo.patientId,
+        encounterId: props.patientInfo.encounterId,
+        diagnosisChildList: sortedList,
+      }).then((res) => {
+        if (res.code === 200) {
+          // 步骤4：更新本地数据，使用全新对象防止响应式问题
+          form.value.diagnosisList = sortedList.map(item => ({ ...item }));
+
+          emits('diagnosisSave', false);
+          proxy.$modal.msgSuccess('诊断已保存');
+
+          // 食源性疾病逻辑
+          isFoodDiseasesNew({ encounterId: props.patientInfo.encounterId }).then((res2) => {
+            if (res2.code === 20?('data') && res2.data) {
+              window.open(res2.data, '_blank');
+            }
+          });
+        }
+      }).finally(() => {
+        setTimeout(() => {
+          isSaving.value = false;
+        }, 100);
+      });
     }
   });
 }
-
 /**
  * 关闭诊断弹窗
  */
@@ -519,12 +643,15 @@ function handleNodeClick(data) {
     medTypeCode: '11',
     diagSrtNo: form.value.diagnosisList.length + 1,
     definitionId: data.definitionId,
+    diagnosisDoctor: props.patientInfo.practitionerName || props.patientInfo.doctorName || props.patientInfo.physicianName || userStore.name,
+    diagnosisTime: new Date().toLocaleString('zh-CN')
   });
   if (form.value.diagnosisList.length == 1) {
     form.value.diagnosisList[0].maindiseFlag = 1;
   }
 }
-defineExpose({ getList, handleSaveDiagnosis });
+
+defineExpose({ getList, getDetail, handleSaveDiagnosis });
 </script>
 
 <style lang="scss" scoped>
@@ -542,4 +669,5 @@ defineExpose({ getList, handleSaveDiagnosis });
   display: flex;
   align-items: center;
 }
-</style>
\ No newline at end of file
+</style>
+