From 062089598f92e07890cbab1746a3deb5f7077fb5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=B5=B5=E4=BA=91?= <zhaoyun@his.local>
Date: Wed, 8 Apr 2026 23:45:33 +0800
Subject: [PATCH] chore: merge Bug#334 fix from 720cac8a

---
 .../inspection/inspectionApplication.vue      | 258 +++++-------------
 1 file changed, 67 insertions(+), 191 deletions(-)

diff --git a/openhis-ui-vue3/src/views/doctorstation/components/inspection/inspectionApplication.vue b/openhis-ui-vue3/src/views/doctorstation/components/inspection/inspectionApplication.vue
index 72715c17..d6b21fe4 100644
--- a/openhis-ui-vue3/src/views/doctorstation/components/inspection/inspectionApplication.vue
+++ b/openhis-ui-vue3/src/views/doctorstation/components/inspection/inspectionApplication.vue
@@ -1,24 +1,28 @@
 <template>
   <el-container class="inspection-application-container">
 
-    <!-- 占位 header，保持 el-container 布局结构 -->
-    <el-header height="0" />
+    <!-- 顶部操作按钮区 - Bug#334: 优化垂直空间利用率 -->
+    <el-header class="top-action-bar" height="48px">
+      <el-row class="action-buttons" type="flex" justify="end" :gutter="8">
+        <el-button type="primary" size="default" @click="handleSave" class="save-btn" :loading="saving">
+          <el-icon><Document /></el-icon>
+          保存
+        </el-button>
+        <el-button type="primary" size="default"  @click="handleNewApplication" class="new-btn">
+          <el-icon><Plus /></el-icon>
+          新增
+        </el-button>
+      </el-row>
+    </el-header>
 
     <!-- 检验信息表格区 -->
     <el-main class="inspection-section" style="width: 100%; max-width: 100%">
       <el-card class="table-card" style="width: 100%">
         <template #header>
-          <div class="table-card-header-bar">
-            <span class="table-card-title"><el-icon><DocumentChecked /></el-icon> 检验信息</span>
-            <span class="table-card-btns">
-              <el-button type="primary" size="default" @click="handleSave" :loading="saving">
-                <el-icon><Document /></el-icon> 保存
-              </el-button>
-              <el-button type="primary" size="default" @click="handleNewApplication">
-                <el-icon><Plus /></el-icon> 新增
-              </el-button>
-            </span>
-          </div>
+          <el-row class="card-header" type="flex" align="middle">
+            <el-icon><DocumentChecked /></el-icon>
+            <span>检验信息</span>
+            </el-row>
         </template>
         <el-table
           ref="inspectionTableRef"
@@ -508,58 +512,28 @@
               </el-row>
           </template>
 
-          <!-- 已选项目列表 - 支持树形展开 -->
+          <!-- 已选项目列表 -->
           <el-scrollbar class="selected-tree" style="max-height: 220px">
-            <div v-if="selectedInspectionItems.length > 0" class="selected-items-list">
-              <div
+            <el-list v-if="selectedInspectionItems.length > 0" :data="selectedInspectionItems" class="selected-items-list">
+              <el-list-item
                 v-for="item in selectedInspectionItems"
                 :key="item.itemId"
-                class="selected-item-wrapper"
+                class="selected-list-item"
               >
-                <!-- 主项目行 -->
-                <div
-                  :class="['selected-item-content', { 'is-package': item.feePackageId }]"
-                  @click="item.feePackageId && togglePackageExpand(item)"
-                >
-                  <!-- 套餐展开图标 -->
-                  <el-icon
-                    v-if="item.feePackageId"
-                    :class="['expand-icon', { 'is-expanded': item.expanded }]"
-                  >
-                    <ArrowRight />
-                  </el-icon>
+                <el-row class="selected-item-content" type="flex" align="middle" style="width: 100%">
                   <span class="item-itemName">{{ item.itemName }}</span>
                   <span class="item-price">¥{{ item.itemPrice }}</span>
                   <el-button
                     link
                     size="small"
                     style="color: #f56c6c; margin-left: auto"
-                    @click.stop="removeInspectionItem(item)"
+                    @click="removeInspectionItem(item)"
                   >
                     删除
                   </el-button>
-                </div>
-
-                <!-- 套餐明细项（树形展开） -->
-                <div v-if="item.feePackageId && item.expanded" class="package-details">
-                  <div v-if="item.loadingDetails" class="loading-details">
-                    <el-icon class="is-loading"><Loading /></el-icon>
-                    <span>加载中...</span>
-                  </div>
-                  <div v-else-if="item.details && item.details.length > 0">
-                    <div
-                      v-for="detail in item.details"
-                      :key="detail.detailId"
-                      class="detail-item"
-                    >
-                      <span class="detail-name">{{ detail.itemName }}</span>
-                      <span class="detail-price">¥{{ detail.unitPrice || 0 }}</span>
-                    </div>
-                  </div>
-                  <div v-else class="no-details">暂无明细</div>
-                </div>
-              </div>
-            </div>
+                </el-row>
+              </el-list-item>
+            </el-list>
             <el-empty v-if="selectedInspectionItems.length === 0" class="no-selection" description="暂无选择项目" />
           </el-scrollbar>
         </el-card>
@@ -572,16 +546,15 @@
 <script setup>
 import {onMounted, onUnmounted, reactive, ref, watch, computed, getCurrentInstance} from 'vue'
 import {ElMessage, ElMessageBox} from 'element-plus'
-import { DocumentChecked, Plus, Document, Printer, Delete, Check, Loading, ArrowRight } from '@element-plus/icons-vue'
+import { DocumentChecked, Plus, Document, Printer, Delete, Check, Loading } from '@element-plus/icons-vue'
 import {
   deleteInspectionApplication, getApplyList,
   saveInspectionApplication,
   getInspectionTypeList,
+  getInspectionItemList,
   getEncounterDiagnosis,
   getInspectionApplyDetail
 } from '../api'
-import { getLabActivityDefinitionPage } from '@/api/lab/labActivityDefinition'
-import { listInspectionPackageDetails } from '@/api/system/inspectionPackage'
 import useUserStore from '@/store/modules/user.js'
 // 迁移到 hiprint
 import { previewPrint } from '@/utils/printUtils.js'
@@ -833,7 +806,7 @@ const loadCategoryItems = async (categoryKey, loadMore = false) => {
       params.inspectionTypeId = category.typeId
     }
 
-    const res = await getLabActivityDefinitionPage(params)
+    const res = await getInspectionItemList(params)
 
     // 解析数据
     let records = []
@@ -849,31 +822,22 @@ const loadCategoryItems = async (categoryKey, loadMore = false) => {
       total = records.length
     }
 
-    // 映射数据格式，计算套餐价格
-    const mappedItems = records.map(item => {
-      // 计算价格：套餐项目使用 packageAmount + serviceFee，否则使用 retailPrice
-      let itemPrice = item.retailPrice || 0
-      if (item.feePackageId && item.packageAmount) {
-        itemPrice = (Number(item.packageAmount) || 0) + (Number(item.serviceFee) || 0)
-      }
-
-      return {
-        itemId: item.id || Math.random().toString(36).substring(2, 11),
-        itemName: item.name || '',
-        itemPrice: itemPrice,
-        itemAmount: itemPrice,
-        sampleType: item.specimenCode_dictText || '血液',
-        unit: item.permittedUnitCode || '',
-        itemQty: 1,
-        serviceFee: item.serviceFee || 0,
-        type: category.label,
-        isSelfPay: false,
-        code: item.busNo || '',
-        inspectionTypeId: item.inspectionTypeId || null,
-        feePackageId: item.feePackageId || null,
-        packageName: item.packageName || null
-      }
-    })
+    // 映射数据格式
+    const mappedItems = records.map(item => ({
+      itemId: item.id || item.activityId || Math.random().toString(36).substring(2, 11),
+      itemName: item.name || item.itemName || '',
+      itemPrice: item.retailPrice || item.price || 0,
+      itemAmount: item.retailPrice || item.price || 0,
+      sampleType: item.specimenCode_dictText || item.sampleType || '血液',
+      unit: item.unit || '',
+      itemQty: 1,
+      serviceFee: 0,
+      type: category.label,
+      isSelfPay: false,
+      activityId: item.activityId,
+      code: item.busNo || item.code || item.activityCode,
+      inspectionTypeId: item.inspectionTypeId || null
+    }))
 
     // 更新分类数据
     if (loadMore) {
@@ -972,28 +936,21 @@ const querySearchInspectionItems = async (queryString, cb) => {
       searchKey: queryString
     }
 
-    const res = await getLabActivityDefinitionPage(params)
+    const res = await getInspectionItemList(params)
 
     let suggestions = []
     if (res.data && res.data.records) {
       // 映射数据格式，与 loadInspectionItemsByType 保持一致
-      suggestions = res.data.records.map(item => {
-        // 计算价格
-        let itemPrice = item.retailPrice || 0
-        if (item.feePackageId && item.packageAmount) {
-          itemPrice = (Number(item.packageAmount) || 0) + (Number(item.serviceFee) || 0)
-        }
-        return {
-          itemId: item.id,
-          itemName: item.name || '',
-          itemPrice: itemPrice,
-          sampleType: item.specimenCode_dictText || '血液',
-          unit: item.permittedUnitCode || '',
-          code: item.busNo || '',
-          inspectionTypeId: item.inspectionTypeId || null,
-          feePackageId: item.feePackageId || null
-        }
-      })
+      suggestions = res.data.records.map(item => ({
+        itemId: item.id || item.activityId,
+        itemName: item.name || item.itemName || '',
+        itemPrice: item.retailPrice || item.price || 0,
+        sampleType: item.specimenCode_dictText || item.sampleType || '血液',
+        unit: item.unit || '',
+        code: item.busNo || item.code || item.activityCode,
+        activityId: item.activityId,
+        inspectionTypeId: item.inspectionTypeId || null
+      }))
     }
 
     cb(suggestions)
@@ -1427,25 +1384,6 @@ const removeInspectionItem = (item) => {
   }
 }
 
-// 切换套餐展开状态（Bug #325）
-const togglePackageExpand = async (item) => {
-  item.expanded = !item.expanded
-  if (item.expanded && !item.details && item.feePackageId) {
-    item.loadingDetails = true
-    try {
-      const res = await listInspectionPackageDetails(item.feePackageId)
-      if (res.code === 200 && res.data) {
-        item.details = res.data
-      }
-    } catch (error) {
-      console.error('获取套餐明细失败', error)
-      item.details = []
-    } finally {
-      item.loadingDetails = false
-    }
-  }
-}
-
 // 清空所有选择
 const clearAllSelected = () => {
   selectedInspectionItems.value = []
@@ -1709,25 +1647,15 @@ defineExpose({
   padding: 0;
 }
 
-/* 表格卡片标题行：标题在左，按钮在右 */
-.table-card-header-bar {
+/* Bug#334: 顶部操作按钮区 - 优化垂直空间利用率 */
+.top-action-bar {
   display: flex;
   align-items: center;
-  justify-content: space-between;
-  width: 100%;
-}
-
-.table-card-header-bar .table-card-title {
-  display: flex;
-  align-items: center;
-  gap: 6px;
-  font-weight: 600;
-  color: var(--el-text-color-primary);
-}
-
-.table-card-header-bar .table-card-btns {
-  display: flex;
-  gap: 8px;
+  justify-content: flex-end;
+  border-bottom: 1px solid var(--el-border-color-light);
+  background: var(--el-bg-color);
+  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
+  padding: 0 12px;
 }
 
 .action-buttons {
@@ -2317,24 +2245,6 @@ defineExpose({
   margin: 2px 0;
 }
 
-.selected-item-content.is-package {
-  cursor: pointer;
-}
-
-.selected-item-content.is-package:hover {
-  background: #f0f1f2;
-}
-
-.selected-item-content .expand-icon {
-  margin-right: 6px;
-  transition: transform 0.3s;
-  color: #909399;
-}
-
-.selected-item-content .expand-icon.is-expanded {
-  transform: rotate(90deg);
-}
-
 .selected-item-content .item-itemName {
   flex: 1;
   font-weight: 500;
@@ -2346,44 +2256,6 @@ defineExpose({
   margin-right: 10px;
 }
 
-/* 套餐明细样式 */
-.package-details {
-  margin-left: 24px;
-  padding: 4px 0 4px 12px;
-  border-left: 2px solid #e4e7ed;
-}
-
-.package-details .detail-item {
-  display: flex;
-  align-items: center;
-  padding: 4px 8px;
-  font-size: 13px;
-  color: #606266;
-}
-
-.package-details .detail-name {
-  flex: 1;
-}
-
-.package-details .detail-price {
-  color: #e6a23c;
-}
-
-.package-details .loading-details {
-  display: flex;
-  align-items: center;
-  gap: 6px;
-  padding: 8px;
-  color: #909399;
-  font-size: 13px;
-}
-
-.package-details .no-details {
-  padding: 8px;
-  color: #909399;
-  font-size: 13px;
-}
-
 .no-selection {
   text-align: center;
   padding: 40px 20px;
@@ -2464,6 +2336,10 @@ defineExpose({
     display: none;
   }
   
+  .top-action-bar {
+    padding: 0 10px;
+  }
+  
   .action-buttons {
     flex-direction: column;
     gap: 5px;