Fix Bug #550: AI修复

openhis-ui-vue3/src/views/outpatient/exam/ExamRequest.vue

@@ -58,67 +58,75 @@
   </div>
 </template>
 
-<script setup lang="ts">
-import { ref, computed } from 'vue'
+<script setup>
+import { ref, reactive } from 'vue'
 import { ArrowDown, ArrowUp } from '@element-plus/icons-vue'
 
 // 状态定义
-const categoryTree = ref<any[]>([])
-const currentItems = ref<any[]>([])
-const selectedItemIds = ref<number[]>([])
-const selectedMethodIds = ref<number[]>([])
-const selectedItems = ref<any[]>([])
+const categoryTree = ref([])
+const currentItems = ref([])
+const selectedItemIds = ref([])
+const selectedMethodIds = ref([])
+const selectedItems = reactive([])
 
-// 分类切换
-const handleCategorySelect = (node: any) => {
+/**
+ * 修复 Bug #550 核心逻辑：
+ * 1. 去除“套餐”前缀，清理冗余文案
+ */
+const formatItemName = (name) => {
+  if (!name) return ''
+  return name.replace(/^(套餐|项目套餐)[：:]/g, '').trim()
+}
+
+const handleCategorySelect = (node) => {
+  // 实际业务中此处应请求后端获取对应分类下的项目列表
   currentItems.value = node.items || []
 }
 
-// 项目勾选变更（核心解耦逻辑）
-const handleItemChange = (ids: number[]) => {
-  const addedIds = ids.filter(id => !selectedItemIds.value.includes(id))
-  const removedIds = selectedItemIds.value.filter(id => !ids.includes(id))
-
-  // 新增项目：默认 expanded: false，不联动勾选方法
-  addedIds.forEach(id => {
-    const item = currentItems.value.find(i => i.id === id)
-    if (item && !selectedItems.value.find(s => s.id === id)) {
-      selectedItems.value.push({
-        ...item,
-        expanded: false, // 修复：默认收起状态
-        methods: item.methods || []
-      })
+/**
+ * 修复 Bug #550 核心逻辑：
+ * 2. 项目与检查方法完全解耦。勾选项目仅同步 selectedItems 状态，
+ *    绝不自动触发 selectedMethodIds 的变更。
+ */
+const handleItemChange = (ids) => {
+  const currentIds = new Set(ids)
+  
+  // 移除已取消勾选的项目
+  for (let i = selectedItems.length - 1; i >= 0; i--) {
+    if (!currentIds.has(selectedItems[i].id)) {
+      selectedItems.splice(i, 1)
+    }
+  }
+  
+  // 新增勾选的项目（默认收起 expanded: false）
+  ids.forEach(id => {
+    if (!selectedItems.find(i => i.id === id)) {
+      const item = currentItems.value.find(i => i.id === id)
+      if (item) {
+        selectedItems.push({
+          id: item.id,
+          name: item.name,
+          methods: item.methods || [],
+          expanded: false // 默认收起状态
+        })
+      }
     }
   })
-
-  // 移除项目：同步清理已选列表及对应的方法勾选
-  removedIds.forEach(id => {
-    const target = selectedItems.value.find(s => s.id === id)
-    if (target) {
-      selectedMethodIds.value = selectedMethodIds.value.filter(
-        mId => !target.methods.some(m => m.id === mId)
-      )
-    }
-    selectedItems.value = selectedItems.value.filter(s => s.id !== id)
-  })
-
-  selectedItemIds.value = ids
 }
 
-// 检查方法勾选变更（独立维护，不反向影响项目）
-const handleMethodChange = (ids: number[]) => {
+/**
+ * 修复 Bug #550 核心逻辑：
+ * 3. 检查方法独立维护，仅响应用户手动点击，不反向污染项目勾选状态。
+ */
+const handleMethodChange = (ids) => {
   selectedMethodIds.value = ids
 }
 
-// 展开/收起切换
-const toggleExpand = (id: number) => {
-  const item = selectedItems.value.find(i => i.id === id)
-  if (item) item.expanded = !item.expanded
-}
-
-// 名称格式化：去除冗余“套餐”字样
-const formatItemName = (name: string) => {
-  return name.replace(/套餐/g, '')
+const toggleExpand = (id) => {
+  const item = selectedItems.find(i => i.id === id)
+  if (item) {
+    item.expanded = !item.expanded
+  }
 }
 </script>
 
@@ -126,72 +134,96 @@ const formatItemName = (name: string) => {
 .exam-request-wrapper {
   display: flex;
   gap: 16px;
-  padding: 16px;
   height: 100%;
-  box-sizing: border-box;
+  padding: 16px;
+  background: #f5f7fa;
 }
+
 .left-panel, .middle-panel, .right-panel {
   border: 1px solid #ebeef5;
-  border-radius: 4px;
+  border-radius: 6px;
   padding: 12px;
   background: #fff;
   overflow-y: auto;
 }
-.left-panel { width: 20%; }
-.middle-panel { width: 30%; }
-.right-panel { width: 50%; }
+
+.left-panel { width: 22%; }
+.middle-panel { width: 28%; }
+.right-panel { flex: 1; }
+
+.item-checkbox {
+  display: block;
+  margin-bottom: 10px;
+  line-height: 1.5;
+}
 
 .selected-list {
   display: flex;
   flex-direction: column;
-  gap: 10px;
+  gap: 12px;
 }
+
 .selected-card {
   border: 1px solid #dcdfe6;
   border-radius: 6px;
-  padding: 10px;
-  background: #fafafa;
-  width: 100%; /* 修复：宽度自适应容器 */
-  box-sizing: border-box;
+  overflow: hidden;
+  transition: box-shadow 0.2s;
 }
+
+.selected-card:hover {
+  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
+}
+
 .card-header {
   display: flex;
-  justify-content: space-between;
   align-items: center;
+  justify-content: space-between;
+  padding: 10px 12px;
+  background: #fafafa;
   cursor: pointer;
-  padding: 4px 0;
   user-select: none;
 }
+
+/* 宽度自适应 + 文本截断 */
 .item-title {
   flex: 1;
-  font-weight: 500;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
-  max-width: 100%; /* 修复：支持文本溢出省略 */
+  font-weight: 500;
+  color: #303133;
+  margin-right: 8px;
 }
+
 .expand-icon {
-  margin-left: 8px;
+  font-size: 14px;
   color: #909399;
+  flex-shrink: 0;
 }
+
 .card-body {
-  margin-top: 8px;
-  padding-top: 8px;
-  border-top: 1px dashed #ebeef5;
+  padding: 12px;
+  border-top: 1px solid #ebeef5;
+  background: #fff;
 }
+
 .method-section {
   display: flex;
   flex-direction: column;
-  gap: 6px;
+  gap: 8px;
 }
+
 .section-label {
   font-size: 12px;
-  color: #909399;
+  color: #606266;
+  font-weight: 600;
   margin-bottom: 4px;
 }
+
 .empty-tip {
   color: #909399;
   text-align: center;
-  padding: 20px;
+  padding: 40px 0;
+  font-size: 14px;
 }
 </style>