Fix Bug #550: AI修复

openhis-ui-vue3/src/views/outpatient/ExaminationApply.vue

@@ -50,7 +50,7 @@
 </template>
 
 <script setup>
-import { ref, computed } from 'vue'
+import { ref } from 'vue'
 
 // 模拟分类数据
 const categories = ref([
@@ -58,75 +58,156 @@ const categories = ref([
   { id: 'cat2', name: 'CT', children: [] }
 ])
 
-// 模拟当前分类下的项目数据
-const currentItems = ref([
-  { id: 'item1', name: '128线排套餐', isPackage: true, methods: [
-    { id: 'm1', name: '腹部彩超', checked: false },
-    { id: 'm2', name: '心脏彩超', checked: false }
-  ]},
-  { id: 'item2', name: '常规彩超', isPackage: false, methods: [] }
-])
-
+const currentItems = ref([])
 const selectedItemIds = ref([])
 const selectedList = ref([])
 
-// 核心修复 1：联动解耦
-// 项目勾选与检查方法完全独立，不触发任何自动勾选逻辑
-const handleItemSelect = (ids) => {
-  // 同步移除已取消勾选的项目
-  selectedList.value = selectedList.value.filter(s => ids.includes(s.id))
-  
-  // 同步新增勾选的项目
-  ids.forEach(id => {
-    if (!selectedList.value.find(s => s.id === id)) {
-      const item = currentItems.value.find(i => i.id === id)
-      if (item) {
-        selectedList.value.push({
-          id: item.id,
-          originalName: item.name,
-          // 核心修复 2：去除冗余“套餐”前缀
-          displayName: item.name.replace(/套餐/g, ''),
-          // 核心修复 2：默认收起状态
-          expanded: false,
-          // 核心修复 1 & 3：方法独立初始化，默认不勾选，保持层级结构
-          methods: item.methods ? item.methods.map(m => ({ ...m, checked: false })) : []
-        })
-      }
-    }
-  })
+// 模拟项目数据加载
+const handleCategoryClick = (node) => {
+  // 实际应调用 API，此处模拟
+  currentItems.value = [
+    { id: 'item1', name: '128线排套餐', methods: [{ id: 'm1', name: '常规扫描' }, { id: 'm2', name: '增强扫描' }] },
+    { id: 'item2', name: '腹部彩超', methods: [] }
+  ]
+  selectedItemIds.value = []
+}
+
+// 核心修复：解耦项目与方法勾选状态
+const handleItemSelect = (newIds) => {
+  // 1. 保留已存在项目的状态（包括方法勾选状态和展开状态）
+  const preserved = selectedList.value.filter(s => newIds.includes(s.id))
+  
+  // 2. 找出新增的项目并初始化独立状态
+  const addedIds = newIds.filter(id => !preserved.find(s => s.id === id))
+  const newItems = addedIds.map(id => {
+    const item = currentItems.value.find(i => i.id === id)
+    return {
+      id: item.id,
+      originalName: item.name,
+      displayName: item.name.replace(/套餐/g, ''), // 去除冗余“套餐”字样
+      expanded: false, // 默认收起
+      methods: (item.methods || []).map(m => ({ ...m, checked: false })) // 方法独立状态，绝不自动勾选
+    }
+  })
+  
+  // 3. 更新列表
+  selectedList.value = [...preserved, ...newItems]
 }
 
-// 核心修复 2：点击展开/收起
 const toggleExpand = (sel) => {
   sel.expanded = !sel.expanded
 }
 
-// 核心修复 1：方法独立切换，不影响父级项目状态
 const handleMethodToggle = (parent, method) => {
-  // 仅记录或提交方法状态，不反向修改父项目
-  console.log(`[Method Toggle] ${parent.displayName} -> ${method.name}: ${method.checked}`)
-}
-
-const handleCategoryClick = (data) => {
-  // 实际项目中此处应请求接口更新 currentItems
-  console.log('切换分类:', data.name)
+  // 仅更新当前方法状态，不触发父级联动
+  console.log(`方法 ${method.name} 状态变更为: ${method.checked}`)
 }
 </script>
 
 <style scoped>
-.examination-apply-wrapper { padding: 16px; height: 100%; box-sizing: border-box; }
-.layout-container { display: grid; grid-template-columns: 220px 1fr 320px; gap: 16px; height: calc(100% - 32px); }
-.panel { background: #fff; border: 1px solid #ebeef5; border-radius: 4px; padding: 12px; overflow-y: auto; }
-.panel-title { margin: 0 0 12px; font-size: 14px; font-weight: 600; color: #303133; }
-.category-tree { font-size: 13px; }
-.item-list { display: flex; flex-direction: column; gap: 8px; }
-.item-row { padding: 6px 0; border-bottom: 1px dashed #f0f0f0; }
-.selected-card { border: 1px solid #dcdfe6; border-radius: 4px; margin-bottom: 10px; background: #fafafa; }
-.card-header { padding: 10px 12px; cursor: pointer; display: flex; justify-content: space-between; align-items: center; user-select: none; }
-.card-header:hover { background: #f5f7fa; }
-.card-title { font-weight: 500; color: #303133; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 240px; }
-.expand-icon { font-size: 12px; color: #909399; transition: transform 0.2s; }
-.card-body { padding: 8px 12px 12px; border-top: 1px solid #ebeef5; background: #fff; }
-.method-row { padding-left: 16px; margin: 6px 0; display: flex; align-items: center; }
-.empty-state, .empty-tip { color: #909399; font-size: 13px; text-align: center; padding: 20px 0; }
+.examination-apply-wrapper {
+  padding: 16px;
+  height: 100%;
+  box-sizing: border-box;
+}
+
+.layout-container {
+  display: flex;
+  gap: 16px;
+  height: calc(100vh - 120px);
+}
+
+.panel {
+  background: #fff;
+  border: 1px solid #e4e7ed;
+  border-radius: 4px;
+  padding: 12px;
+  display: flex;
+  flex-direction: column;
+}
+
+.category-panel { flex: 1; }
+.item-panel { flex: 2; }
+.selected-panel { flex: 2; }
+
+.panel-title {
+  margin: 0 0 12px;
+  font-size: 14px;
+  font-weight: 600;
+  color: #303133;
+  border-bottom: 1px solid #ebeef5;
+  padding-bottom: 8px;
+}
+
+.category-tree, .item-list {
+  flex: 1;
+  overflow-y: auto;
+}
+
+.item-row {
+  padding: 6px 0;
+  border-bottom: 1px dashed #f0f0f0;
+}
+
+.empty-state {
+  color: #909399;
+  text-align: center;
+  padding: 20px 0;
+}
+
+.selected-card {
+  border: 1px solid #ebeef5;
+  border-radius: 4px;
+  margin-bottom: 8px;
+  background: #fafafa;
+}
+
+.card-header {
+  display: flex;
+  align-items: center;
+  padding: 8px 10px;
+  cursor: pointer;
+  background: #fff;
+  border-bottom: 1px solid #ebeef5;
+}
+
+.card-title {
+  flex: 1;
+  font-size: 13px;
+  font-weight: 500;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  color: #303133;
+}
+
+.expand-icon {
+  font-size: 12px;
+  color: #909399;
+  margin-left: 8px;
+}
+
+.card-body {
+  padding: 8px 10px;
+  background: #f5f7fa;
+}
+
+.method-list {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+}
+
+.method-row {
+  padding-left: 16px; /* 严格层级缩进 */
+  font-size: 12px;
+  color: #606266;
+}
+
+.empty-tip {
+  font-size: 12px;
+  color: #c0c4cc;
+  text-align: center;
+  padding: 4px 0;
+}
 </style>