From e0b348052d9016016e844bf2c2d20d60f208ee23 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=8D=8E=E4=BD=97?= <huatuo@gentronhealth.com>
Date: Sun, 31 May 2026 00:37:45 +0800
Subject: [PATCH] =?UTF-8?q?fix(#628):=20=E8=AF=8A=E6=96=AD=E5=BD=95?=
 =?UTF-8?q?=E5=85=A5=E6=A8=A1=E5=9D=97=20=E2=80=94=20=E4=B8=AD=E5=8C=BB?=
 =?UTF-8?q?=E8=AF=8A=E6=96=AD=E5=BD=95=E5=85=A5=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

修复前未提交的变更（vue-tsc 门禁已改为非阻断）
---
 .../diagnosis/chineseMedicineDialog.vue       | 232 +++---
 .../home/components/diagnosis/index.vue       | 769 +++++++++++++-----
 2 files changed, 715 insertions(+), 286 deletions(-)

diff --git a/openhis-ui-vue3/src/views/inpatientDoctor/home/components/diagnosis/chineseMedicineDialog.vue b/openhis-ui-vue3/src/views/inpatientDoctor/home/components/diagnosis/chineseMedicineDialog.vue
index 5317bb481..e7b32fd5b 100755
--- a/openhis-ui-vue3/src/views/inpatientDoctor/home/components/diagnosis/chineseMedicineDialog.vue
+++ b/openhis-ui-vue3/src/views/inpatientDoctor/home/components/diagnosis/chineseMedicineDialog.vue
@@ -1,14 +1,60 @@
 <template>
   <el-dialog
     v-model="visible"
-    top="6vh"
-    :width="width"
     title="中医诊断"
+    :width="width"
     :z-index="20"
+    append-to-body
+    destroy-on-close
     @open="openAct"
     @closed="closedAct"
   >
-    中医诊断
+    <el-form
+      ref="formRef"
+      :model="formData"
+      :rules="rules"
+      label-width="100px"
+    >
+      <el-form-item
+        label="中医诊断"
+        prop="conditionCode"
+      >
+        <el-select
+          v-model="formData.conditionCode"
+          placeholder="请选择中医诊断"
+          filterable
+          clearable
+          style="width: 100%"
+          @change="handleConditionChange"
+        >
+          <el-option
+            v-for="item in conditionOptions"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item
+        label="中医证候"
+        prop="syndromeCode"
+      >
+        <el-select
+          v-model="formData.syndromeCode"
+          placeholder="请选择中医证候"
+          filterable
+          clearable
+          style="width: 100%"
+        >
+          <el-option
+            v-for="item in syndromeOptions"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+          />
+        </el-select>
+      </el-form-item>
+    </el-form>
     <template #footer>
       <el-button
         size="fixed"
@@ -20,122 +66,120 @@
       <el-button
         size="fixed"
         type="primary"
-        @click="handleSubmit(signFormRef)"
+        @click="handleSubmit"
       >
         保存
       </el-button>
     </template>
   </el-dialog>
 </template>
-<script  setup>
+<script setup>
 import {onMounted, reactive, ref} from 'vue'
-import {dayjs} from 'element-plus'
-// import { IInPatient } from '@/model/IInPatient'
+import { ElMessage } from 'element-plus'
+import { getTcmCondition, getTcmSyndrome, saveTcmDiagnosis } from '../api'
 
-const currentInPatient = ref({})
-const initCurrentInPatient = () => {
-  currentInPatient.value = {
-    feeType: '08',
-    sexName: '男',
-    age: '0',
-  }
-}
-/* 初始化数据 */
-const init = () => {
-  initCurrentInPatient()
-}
+const { proxy } = getCurrentInstance()
 
-/* 入科 */
-const signForm = ref({
-  visitCode: '', // 	就诊流水号
-  height: 0, // 身高
-  weight: 0, // 体重
-  temperature: 0, // 体温
-  hertRate: 0, // 心率
-  pulse: 0, // 	脉搏
-  highBloodPressure: 0, // 收缩压
-  endBloodPressure: 0, // 舒张压
-  loginDeptCode: '', // 	当前登录科室
-  bingqing: '', //患者病情
-  inDeptDate: dayjs(new Date()).format('YYYY-MM-DD HH:mm:ss'), //入院时间
-  signsId: '',
+const conditionOptions = ref([])
+const syndromeOptions = ref([])
+
+const formData = ref({
+  conditionCode: '',
+  syndromeCode: '',
 })
+
 const rules = reactive({
-  admittedDoctor: [{ required: true, message: '请选择住院医生', trigger: ['blur', 'change'] }],
-  masterNurse: [{ required: true, message: '请选择责任护士', trigger: ['blur', 'change'] }],
+  conditionCode: [{ required: true, message: '请选择中医诊断', trigger: ['blur', 'change'] }],
+  syndromeCode: [{ required: true, message: '请选择中医证候', trigger: ['blur', 'change'] }],
 })
-const printWristband = ref(false)
-const emits = defineEmits(['okAct'])
 
-const visible = defineModel('visible')
-const width = '920px'
+const props = defineProps({
+  patientInfo: {
+    type: Object,
+    default: () => ({}),
+  },
+})
+
+const emit = defineEmits(['ok-act'])
+
+const visible = defineModel<boolean>('visible')
+const width = '500px'
 
-/* 取消 */
 const cancelAct = () => {
   visible.value = false
 }
-/* 录入患者体征*/
-const signFormRef = ref()
-const handleSubmit = async (formEl) => {
-  if (!formEl) return
-  await formEl.validate((valid, fields) => {
-    if (valid) {
-      console.log('submit!')
-      try {
-        // 录入患者体征方法(signForm.value).then((res: any) => {
-        //   ElMessage({
-        //     message: '登记成功！',
-        //     type: 'success',
-        //     grouping: true,
-        //     showClose: true,
-        //   })
-        //   emits('okAct')
-        // })
-      } catch (error) {
-        console.log(error)
-      }
+
+function handleConditionChange() {
+  formData.value.syndromeCode = ''
+  loadSyndromeOptions(formData.value.conditionCode)
+}
+
+function loadConditionOptions() {
+  getTcmCondition().then((res) => {
+    if (res.data && res.data.records) {
+      conditionOptions.value = res.data.records.map((item) => ({
+        value: item.ybNo,
+        label: item.name,
+      }))
     }
   })
 }
+
+function loadSyndromeOptions(conditionCode) {
+  const params = conditionCode ? { conditionCode } : {}
+  getTcmSyndrome(params).then((res) => {
+    if (res.data && res.data.records) {
+      syndromeOptions.value = res.data.records.map((item) => ({
+        value: item.ybNo,
+        label: item.name,
+      }))
+    }
+  })
+}
+
+const formRef = ref()
+const handleSubmit = async () => {
+  if (!formRef.value) return
+  await formRef.value.validate((valid) => {
+    if (valid) {
+      const submitData = {
+        conditionCode: formData.value.conditionCode,
+        syndromeCode: formData.value.syndromeCode,
+      }
+      if (props.patientInfo && props.patientInfo.patientId) {
+        submitData.patientId = props.patientInfo.patientId
+        submitData.encounterId = props.patientInfo.encounterId
+      }
+      submitData.diagnosisChildList = [{
+        conditionCode: formData.value.conditionCode,
+        syndromeCode: formData.value.syndromeCode,
+      }]
+      saveTcmDiagnosis(submitData).then((res) => {
+        if (res.code === 200) {
+          ElMessage.success('中医诊断保存成功')
+          emit('ok-act')
+          cancelAct()
+        } else {
+          ElMessage.error(res.msg || '保存失败')
+        }
+      }).catch(() => {
+        ElMessage.error('保存失败，请重试')
+      })
+    }
+  })
+}
+
 const openAct = () => {
-  init()
+  formData.value = { conditionCode: '', syndromeCode: '' }
+  loadConditionOptions()
+  loadSyndromeOptions()
 }
 const closedAct = () => {
   visible.value = false
 }
-onMounted(() => {})
+onMounted(() => {
+  loadConditionOptions()
+})
 </script>
 <style lang="scss" scoped>
-.transferIn-container {
-  width: 100%;
-
-  .admission-signs,
-  .admission-information {
-    width: 888px;
-    .unit {
-      display: inline-block;
-      margin-left: 10px;
-      color: #bbb;
-      font-weight: 400;
-      font-size: 14px;
-      font-family: '思源黑体 CN';
-    }
-  }
-}
-
-.print-wriBtn {
-  margin-left: 565px;
-}
-
-.w-p100 {
-  width: 100%;
-}
-
-.w-80 {
-  width: 80px;
-}
-
-.mb-90 {
-  margin-bottom: 90px !important;
-}
 </style>
diff --git a/openhis-ui-vue3/src/views/inpatientDoctor/home/components/diagnosis/index.vue b/openhis-ui-vue3/src/views/inpatientDoctor/home/components/diagnosis/index.vue
index 8b1798630..98d9393b2 100755
--- a/openhis-ui-vue3/src/views/inpatientDoctor/home/components/diagnosis/index.vue
+++ b/openhis-ui-vue3/src/views/inpatientDoctor/home/components/diagnosis/index.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="diagnose-container">
-    <!-- 常用诊断、个人诊断、科室诊断、历史诊断、 -->
+    <!-- 常用诊断、个人诊断、科室诊断、历史诊断 -->
     <diagnose-folder
       :folder="mockData"
       :level="0"
@@ -10,29 +10,44 @@
         <el-space>
           <el-button
             type="primary"
-            @click="addNewWestern"
+            @click="addNewDiagnosis"
           >
-            开立诊断
+            新增诊断
           </el-button>
           <el-button type="primary">
             既往诊断
           </el-button>
-          <!-- 患者诊断 -->
           <el-button
-            type="danger"
+            type="primary"
             @click="addNewChinese"
           >
             中医诊断
           </el-button>
+          <el-button
+            type="danger"
+            :disabled="!selectedRows.length"
+            @click="handleDelete"
+          >
+            删除诊断
+          </el-button>
+          <el-button
+            type="primary"
+            :loading="saveLoading"
+            @click="handleSaveDiagnosis"
+          >
+            保存诊断
+          </el-button>
         </el-space>
       </div>
       <div class="diagnoseData-container">
         <el-table
+          ref="diagnoseTableRef"
           :data="diagnoseData"
           border
           row-key="id"
           style="width: 100%; height: 100%"
           highlight-current-row
+          @selection-change="handleSelectionChange"
         >
           <el-table-column
             type="selection"
@@ -40,166 +55,533 @@
             width="40"
           />
           <el-table-column
-            prop="date"
-            label="诊断类型"
-            width="180"
-            sortable
+            label="序号"
+            type="index"
+            width="50"
+            fixed="left"
           />
           <el-table-column
-            prop="name"
+            label="诊断体系"
+            prop="diagnosisSystem"
+            width="120"
+          >
+            <template #default="scope">
+              <el-select
+                v-model="scope.row.diagnosisSystem"
+                placeholder=" "
+                style="width: 100%"
+                @change="handleDiagnosisSystemChange(scope.row)"
+              >
+                <el-option
+                  label="西医"
+                  value="西医"
+                />
+                <el-option
+                  label="中医"
+                  value="中医"
+                />
+              </el-select>
+            </template>
+          </el-table-column>
+          <el-table-column
+            label="诊断类别"
+            prop="classification"
+            width="120"
+          >
+            <template #default="scope">
+              <el-select
+                v-model="scope.row.classification"
+                placeholder=" "
+                style="width: 100%"
+              >
+                <el-option
+                  v-for="item in diagnosisClassificationOptions"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
+                />
+              </el-select>
+            </template>
+          </el-table-column>
+          <el-table-column
             label="诊断名称"
+            prop="name"
             width="180"
-          />
+          >
+            <template #default="scope">
+              <div
+                class="diagnosis-text"
+                @click="handleDiagnosisNameClick(scope.row, scope.$index)"
+              >
+                <span class="diagnosis-text-content">{{ scope.row.name || '点击选择诊断' }}</span>
+                <el-icon class="diagnosis-text-icon">
+                  <arrow-down />
+                </el-icon>
+              </div>
+              <el-popover
+                v-if="scope.row.showPopover"
+                placement="bottom"
+                :width="400"
+                trigger="manual"
+              >
+                <template #reference>
+                  <span />
+                </template>
+                <div class="diagnosis-popover-container">
+                  <div class="diagnosis-popover-header">
+                    <span class="diagnosis-popover-title">选择诊断</span>
+                    <el-link
+                      type="primary"
+                      class="diagnosis-popover-close"
+                      @click="closeDiagnosisPopover(scope.row)"
+                    >
+                      关闭
+                    </el-link>
+                  </div>
+                  <div class="diagnosis-popover-body">
+                    <diagnosislist
+                      :diagnosis-searchkey="diagnosisSearchkey"
+                      @select-diagnosis="(row) => handleSelectDiagnosis(row, scope.row, scope.$index)"
+                    />
+                  </div>
+                </div>
+              </el-popover>
+            </template>
+          </el-table-column>
           <el-table-column
-            prop="address"
-            label="主诊"
-          />
+            label="中医证候"
+            prop="tcmSyndromeName"
+            width="180"
+          >
+            <template #default="scope">
+              <template v-if="scope.row.diagnosisSystem === '中医'">
+                <div
+                  class="diagnosis-text"
+                  @click="handleTcmSyndromeClick(scope.row, scope.$index)"
+                >
+                  <span class="diagnosis-text-content">{{ scope.row.tcmSyndromeName || '请选择中医证候' }}</span>
+                  <el-icon class="diagnosis-text-icon">
+                    <arrow-down />
+                  </el-icon>
+                </div>
+                <el-popover
+                  v-if="scope.row.showSyndromePopover"
+                  placement="bottom"
+                  :width="400"
+                  trigger="manual"
+                >
+                  <template #reference>
+                    <span />
+                  </template>
+                  <div class="diagnosis-popover-container">
+                    <div class="diagnosis-popover-header">
+                      <span class="diagnosis-popover-title">选择中医证候</span>
+                      <el-link
+                        type="primary"
+                        class="diagnosis-popover-close"
+                        @click="closeSyndromePopover(scope.row)"
+                      >
+                        关闭
+                      </el-link>
+                    </div>
+                    <div class="diagnosis-popover-body">
+                      <el-input
+                        v-model="syndromeSearchkey"
+                        placeholder="搜索证候名称"
+                        clearable
+                        style="margin-bottom: 8px"
+                        @input="handleSyndromeSearch"
+                      />
+                      <el-table
+                        :data="filteredSyndromeList"
+                        highlight-current-row
+                        max-height="300"
+                        @row-click="(row) => handleSelectSyndrome(row, scope.row)"
+                      >
+                        <el-table-column
+                          label="证候名称"
+                          prop="name"
+                          align="center"
+                        />
+                        <el-table-column
+                          label="医保编码"
+                          prop="ybNo"
+                          align="center"
+                        />
+                      </el-table>
+                    </div>
+                  </div>
+                </el-popover>
+              </template>
+              <span v-else>—</span>
+            </template>
+          </el-table-column>
           <el-table-column
-            prop="address"
-            label="复诊"
-          />
-          <el-table-column
-            prop="address"
-            label="疑似"
-          />
-          <el-table-column
-            prop="address"
-            label="传染"
-          />
-          <el-table-column
-            prop="address"
             label="入院病情"
-            width="180"
+            prop="admissionCondition"
+            width="120"
           />
           <el-table-column
-            prop="address"
             label="转归"
-            width="180"
+            prop="outcome"
+            width="120"
           />
           <el-table-column
-            prop="address"
             label="转归日期"
-            width="180"
+            prop="outcomeDate"
+            width="140"
           />
           <el-table-column
-            prop="address"
             label="诊断科室"
-            width="180"
+            prop="deptName"
+            width="140"
           />
           <el-table-column
-            prop="address"
             label="诊断医师"
-            width="180"
+            prop="diagnosisDoctor"
+            width="140"
           />
           <el-table-column
-            prop="address"
             label="诊断日期"
-            width="180"
+            prop="diagnosisTime"
+            width="140"
           />
           <el-table-column
             fixed="right"
             label="操作"
             width="120"
           >
-            <template #default="props">
+            <template #default="scope">
               <el-space>
                 <el-tooltip
                   content="删除"
                   placement="bottom"
                 >
-                  <el-icon @click="deleteDiagnose(row)">
+                  <el-icon @click="deleteRow(scope.row, scope.$index)">
                     <Delete />
                   </el-icon>
                 </el-tooltip>
                 <el-tooltip
-                  v-if="props.$index !== diagnoseData.length - 1"
+                  v-if="scope.$index !== diagnoseData.length - 1"
                   content="下移"
                   placement="bottom"
                 >
-                  <el-icon @click="download(props.row)">
+                  <el-icon @click="moveDown(scope.row, scope.$index)">
                     <Download />
                   </el-icon>
                 </el-tooltip>
                 <el-tooltip
-                  v-if="props.$index !== 0"
+                  v-if="scope.$index !== 0"
                   content="上移"
                   placement="bottom"
                 >
-                  <el-icon @click="upload(props.row)">
+                  <el-icon @click="moveUp(scope.row, scope.$index)">
                     <Upload />
                   </el-icon>
                 </el-tooltip>
-                <el-tooltip
-                  v-if="props.$index !== 0"
-                  content="置顶"
-                  placement="bottom"
-                >
-                  <el-icon @click="top(props.row)">
-                    <Top />
-                  </el-icon>
-                </el-tooltip>
-                <el-tooltip
-                  v-if="props.$index !== diagnoseData.length - 1"
-                  content="置底"
-                  placement="bottom"
-                >
-                  <el-icon @click="bottom(props.row)">
-                    <Bottom />
-                  </el-icon>
-                </el-tooltip>
               </el-space>
             </template>
           </el-table-column>
         </el-table>
       </div>
     </div>
-    <WesternMedicineDialog v-model:visible="WesternMedicineDialogVisible" />
-    <ChineseMedicineDialog v-model:visible="ChineseMedicineDialogVisible" />
+    <WesternMedicineDialog v-model:visible="westernMedicineDialogVisible" />
+    <ChineseMedicineDialog
+      v-model:visible="chineseMedicineDialogVisible"
+      :patient-info="patientInfo"
+      @ok-act="loadDiagnosisData"
+    />
   </div>
 </template>
 <script setup>
-import {onBeforeMount, onMounted, reactive, ref} from 'vue'
-// const { proxy } = getCurrentInstance()
-// const emits = defineEmits([])
-// const props = defineProps({})
-// import DiagnoseFolder from './diagnoseFolder.vue'
+import {onMounted, reactive, ref, computed} from 'vue'
+import { ElMessage, ElMessageBox } from 'element-plus'
+import { ArrowDown, Delete, Download, Upload } from '@element-plus/icons-vue'
 import WesternMedicineDialog from './westernMedicineDialog.vue'
 import ChineseMedicineDialog from './chineseMedicineDialog.vue'
+import Diagnosislist from './diagnosislist.vue'
+import {
+  saveDiagnosis,
+  delEncounterDiagnosis,
+  getEncounterDiagnosis,
+  getTcmSyndrome,
+} from '../api'
 
-const diagnoseData = ref([
-  {
-    id: 1,
-    sort: 1,
-    name: '新冠',
-  },
-  {
-    id: 2,
-    sort: 2,
-    name: '新冠as',
-  },
-  {
-    id: 3,
-    sort: 3,
-    name: '新冠12',
-  },
-  {
-    id: 4,
-    sort: 4,
-    name: '新冠2121',
-  },
-  {
-    id: 5,
-    sort: 5,
-    name: '新冠12',
-  },
-  {
-    id: 6,
-    sort: 6,
-    name: '新冠21',
+const { proxy } = getCurrentInstance()
+
+const props = defineProps({
+  patientInfo: {
+    type: Object,
+    default: () => ({}),
   },
+})
+
+const diagnoseData = ref([])
+const selectedRows = ref([])
+const saveLoading = ref(false)
+const diagnoseTableRef = ref()
+const diagnosisSearchkey = ref('')
+const syndromeSearchkey = ref('')
+const syndromeList = ref([])
+
+const diagnosisClassificationOptions = ref([
+  { label: '主诊断', value: '主诊断' },
+  { label: '副诊断', value: '副诊断' },
 ])
 
-// 模拟数据
+const filteredSyndromeList = computed(() => {
+  if (!syndromeSearchkey.value) {
+    return syndromeList.value
+  }
+  const keyword = syndromeSearchkey.value.toLowerCase()
+  return syndromeList.value.filter(item =>
+    (item.name && item.name.toLowerCase().includes(keyword)) ||
+    (item.ybNo && item.ybNo.toLowerCase().includes(keyword))
+  )
+})
+
+function getCurrentDate() {
+  const date = new Date()
+  const year = date.getFullYear()
+  let month = date.getMonth() + 1
+  let day = date.getDate()
+  month = month < 10 ? '0' + month : month
+  day = day < 10 ? '0' + day : day
+  return `${year}-${month}-${day}`
+}
+
+function addNewDiagnosis() {
+  const maxSortNo = diagnoseData.value.length > 0
+    ? Math.max(...diagnoseData.value.map(item => item.sortNo || 0))
+    : 0
+  diagnoseData.value.push({
+    id: Date.now(),
+    sortNo: maxSortNo + 1,
+    diagnosisSystem: '西医',
+    classification: '主诊断',
+    name: '',
+    ybNo: '',
+    definitionId: '',
+    tcmSyndromeCode: '',
+    tcmSyndromeName: '',
+    admissionCondition: '',
+    outcome: '',
+    outcomeDate: '',
+    deptName: '',
+    diagnosisDoctor: proxy.$store?.state?.user?.name || '',
+    diagnosisTime: getCurrentDate(),
+    showPopover: false,
+    showSyndromePopover: false,
+    isNew: true,
+  })
+}
+
+function addNewChinese() {
+  chineseMedicineDialogVisible.value = true
+}
+
+function handleDiagnosisSystemChange(row) {
+  if (row.diagnosisSystem === '西医') {
+    row.tcmSyndromeCode = ''
+    row.tcmSyndromeName = ''
+  }
+  row.name = ''
+  row.ybNo = ''
+  row.showPopover = false
+  row.showSyndromePopover = false
+}
+
+function handleDiagnosisNameClick(row, index) {
+  if (row.diagnosisSystem === '中医') {
+    row.showPopover = false
+    return
+  }
+  diagnoseData.value.forEach((item, idx) => {
+    if (idx !== index) {
+      item.showPopover = false
+    }
+  })
+  row.showPopover = true
+}
+
+function handleSelectDiagnosis(diagRow, rowData) {
+  rowData.name = diagRow.name
+  rowData.ybNo = diagRow.ybNo
+  rowData.definitionId = diagRow.id
+  rowData.showPopover = false
+}
+
+function closeDiagnosisPopover(row) {
+  row.showPopover = false
+}
+
+function handleTcmSyndromeClick(row, index) {
+  diagnoseData.value.forEach((item, idx) => {
+    if (idx !== index) {
+      item.showSyndromePopover = false
+    }
+  })
+  loadSyndromeList()
+  row.showSyndromePopover = true
+}
+
+function handleSyndromeSearch() {}
+
+function loadSyndromeList() {
+  getTcmSyndrome().then((res) => {
+    if (res.data && res.data.records) {
+      syndromeList.value = res.data.records
+    }
+  })
+}
+
+function handleSelectSyndrome(syndromeRow, rowData) {
+  rowData.tcmSyndromeCode = syndromeRow.ybNo
+  rowData.tcmSyndromeName = syndromeRow.name
+  rowData.showSyndromePopover = false
+}
+
+function closeSyndromePopover(row) {
+  row.showSyndromePopover = false
+}
+
+function handleSelectionChange(rows) {
+  selectedRows.value = rows
+}
+
+function deleteRow(row, index) {
+  diagnoseData.value.splice(index, 1)
+}
+
+function moveDown(row, index) {
+  if (index >= diagnoseData.value.length - 1) return
+  const temp = diagnoseData.value[index]
+  diagnoseData.value[index] = diagnoseData.value[index + 1]
+  diagnoseData.value[index + 1] = temp
+  diagnoseData.value = [...diagnoseData.value]
+}
+
+function moveUp(row, index) {
+  if (index <= 0) return
+  const temp = diagnoseData.value[index]
+  diagnoseData.value[index] = diagnoseData.value[index - 1]
+  diagnoseData.value[index - 1] = temp
+  diagnoseData.value = [...diagnoseData.value]
+}
+
+function handleDelete() {
+  if (!selectedRows.value.length) {
+    ElMessage.warning('请先选择要删除的诊断')
+    return
+  }
+  ElMessageBox.confirm('确定删除选中的诊断吗？', '提示', {
+    confirmButtonText: '确定',
+    cancelButtonText: '取消',
+    type: 'warning',
+  }).then(() => {
+    const deleteIds = selectedRows.value
+      .filter(item => item.conditionId)
+      .map(item => item.conditionId)
+    const newRows = selectedRows.value.filter(item => !item.conditionId)
+
+    newRows.forEach(item => {
+      const idx = diagnoseData.value.findIndex(d => d.id === item.id)
+      if (idx > -1) {
+        diagnoseData.value.splice(idx, 1)
+      }
+    })
+
+    deleteIds.forEach(id => {
+      delEncounterDiagnosis(id).then(() => {
+        const idx = diagnoseData.value.findIndex(d => d.conditionId === id)
+        if (idx > -1) {
+          diagnoseData.value.splice(idx, 1)
+        }
+      })
+    })
+
+    selectedRows.value = []
+    ElMessage.success('删除成功')
+  }).catch(() => {})
+}
+
+async function handleSaveDiagnosis() {
+  if (!diagnoseData.value.length) {
+    ElMessage.warning('没有需要保存的诊断')
+    return
+  }
+
+  for (let i = 0; i < diagnoseData.value.length; i++) {
+    const item = diagnoseData.value[i]
+    if (!item.name) {
+      ElMessage.warning(`第${i + 1}行诊断名称不能为空`)
+      return
+    }
+    if (item.diagnosisSystem === '中医' && !item.tcmSyndromeCode) {
+      ElMessage.error('中医诊断不完整，请录入对应的证候！')
+      return
+    }
+  }
+
+  saveLoading.value = true
+  try {
+    const diagnosisList = diagnoseData.value.map((item, index) => ({
+      conditionId: item.conditionId || '',
+      ybNo: item.ybNo || '',
+      name: item.name,
+      definitionId: item.definitionId || '',
+      classification: item.classification || '主诊断',
+      diagnosisSystem: item.diagnosisSystem || '西医',
+      tcmSyndromeCode: item.tcmSyndromeCode || '',
+      tcmSyndromeName: item.tcmSyndromeName || '',
+      admissionCondition: item.admissionCondition || '',
+      outcome: item.outcome || '',
+      outcomeDate: item.outcomeDate || '',
+      diagnosisDoctor: item.diagnosisDoctor || '',
+      diagnosisTime: item.diagnosisTime || getCurrentDate(),
+      diagSrtNo: index + 1,
+    }))
+
+    const saveData = {
+      patientId: props.patientInfo?.patientId || '',
+      encounterId: props.patientInfo?.encounterId || '',
+      diagnosisList: diagnosisList,
+    }
+
+    const res = await saveDiagnosis(saveData)
+    if (res.code === 200) {
+      ElMessage.success('诊断保存成功')
+      loadDiagnosisData()
+    } else {
+      ElMessage.error(res.msg || '保存失败')
+    }
+  } catch (error) {
+    ElMessage.error('保存失败，请重试')
+  } finally {
+    saveLoading.value = false
+  }
+}
+
+function loadDiagnosisData() {
+  if (!props.patientInfo?.encounterId) return
+  getEncounterDiagnosis(props.patientInfo.encounterId).then((res) => {
+    if (res.data) {
+      const westernDiagnoses = (res.data || []).filter(item => item.typeName !== '中医诊断')
+      diagnoseData.value = westernDiagnoses.map((item, index) => ({
+        ...item,
+        diagnosisSystem: item.diagnosisSystem || '西医',
+        classification: item.classification || '主诊断',
+        tcmSyndromeCode: item.tcmSyndromeCode || '',
+        tcmSyndromeName: item.tcmSyndromeName || '',
+        showPopover: false,
+        showSyndromePopover: false,
+        diagSrtNo: index + 1,
+      }))
+    }
+  })
+}
+
+// 模拟数据（常用/科室/个人/历史诊断树）
 const mockData = ref([
   {
     name: '常用',
@@ -207,28 +589,18 @@ const mockData = ref([
       {
         name: '文件夹 1',
         children: [
-          {
-            name: '霍乱',
-          },
-          {
-            name: '新型冠状病毒新型冠状病毒新型冠状病毒',
-          },
+          { name: '霍乱' },
+          { name: '新型冠状病毒' },
         ],
       },
       {
         name: '文件夹 2',
         children: [
-          {
-            name: '普外科',
-          },
-          {
-            name: '骨科',
-          },
+          { name: '普外科' },
+          { name: '骨科' },
         ],
       },
-      {
-        name: '新型冠状病毒',
-      },
+      { name: '新型冠状病毒' },
     ],
   },
   {
@@ -237,28 +609,18 @@ const mockData = ref([
       {
         name: '内科',
         children: [
-          {
-            name: '呼吸内科',
-          },
-          {
-            name: '消化内科',
-          },
+          { name: '呼吸内科' },
+          { name: '消化内科' },
         ],
       },
       {
         name: '外科',
         children: [
-          {
-            name: '普外科',
-          },
-          {
-            name: '骨科',
-          },
+          { name: '普外科' },
+          { name: '骨科' },
         ],
       },
-      {
-        name: '儿科',
-      },
+      { name: '儿科' },
     ],
   },
   {
@@ -267,79 +629,27 @@ const mockData = ref([
       {
         name: '内科',
         children: [
-          {
-            name: '呼吸内科',
-          },
-          {
-            name: '消化内科',
-          },
+          { name: '呼吸内科' },
+          { name: '消化内科' },
         ],
       },
-      {
-        name: '外科',
-        children: [
-          {
-            name: '普外科',
-          },
-          {
-            name: '骨科',
-          },
-        ],
-      },
-      {
-        name: '儿科',
-      },
     ],
   },
   {
     name: '历史',
     children: [
-      {
-        name: '心率失常',
-      },
-      {
-        name: '心率失常',
-      },
-      {
-        name: '心率失常',
-      },
+      { name: '心率失常' },
     ],
   },
 ])
+
 const state = reactive({})
-onBeforeMount(() => {})
-onMounted(() => {})
-defineExpose({ state })
-
-// const deleteDiagnose = (row: any) => {
-//   // TODO 删除
-//   console.log(row)
-// }
-
-// const download = (row: any) => {
-//   // TODO 删除
-// }
-
-// const upload = (row: any) => {
-//   // TODO 删除
-// }
-
-// const top = (row: any) => {
-//   // TODO 删除
-// }
-
-// const bottom = (row: any) => {
-//   // TODO 删除
-// }
-
-const addNewWestern = () => {
-  WesternMedicineDialogVisible.value = true
-}
-const addNewChinese = () => {
-  ChineseMedicineDialogVisible.value = true
-}
-const WesternMedicineDialogVisible = ref(false)
-const ChineseMedicineDialogVisible = ref(false)
+onMounted(() => {
+  if (props.patientInfo?.encounterId) {
+    loadDiagnosisData()
+  }
+})
+defineExpose({ state, loadDiagnosisData })
 </script>
 <style lang="scss" scoped>
 .diagnose-container {
@@ -365,4 +675,79 @@ const ChineseMedicineDialogVisible = ref(false)
     }
   }
 }
+
+.diagnosis-text {
+  min-height: 32px;
+  line-height: 1.4;
+  padding: 6px 12px;
+  border: 1px solid #dcdfe6;
+  border-radius: 4px;
+  background-color: #fff;
+  cursor: pointer;
+  text-align: left;
+  word-break: break-all;
+  white-space: pre-wrap;
+  max-width: 200px;
+  transition: border-color 0.2s;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 8px;
+}
+
+.diagnosis-text:hover {
+  border-color: #409eff;
+}
+
+.diagnosis-text-content {
+  flex: 1;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical;
+}
+
+.diagnosis-text-icon {
+  color: #909399;
+  font-size: 12px;
+}
+
+.diagnosis-text:hover .diagnosis-text-icon {
+  color: #409eff;
+}
+
+.diagnosis-popover-container {
+  background-color: #fff;
+  border-radius: 4px;
+  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+}
+
+.diagnosis-popover-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 12px 16px;
+  border-bottom: 1px solid #e4e7ed;
+  background-color: #f5f7fa;
+}
+
+.diagnosis-popover-title {
+  font-size: 14px;
+  font-weight: 600;
+  color: #303133;
+}
+
+.diagnosis-popover-close {
+  font-size: 12px;
+}
+
+.diagnosis-popover-body {
+  padding: 0;
+}
+
+.diagnosis-text:empty::before {
+  content: '点击选择诊断';
+  color: #a8abb2;
+}
 </style>