Fix Bug #550: AI修复

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

@@ -31,7 +31,7 @@
     <el-card class="selected-panel" shadow="never">
       <template #header>已选择</template>
       <div v-if="selectedItems.length === 0" class="empty-tip">暂无已选项目</div>
-      <el-collapse v-else v-model="activeCollapseNames" accordion>
+      <el-collapse v-else v-model="activeCollapseNames">
         <el-collapse-item
           v-for="sel in selectedItems"
           :key="sel.id"
@@ -60,70 +60,64 @@
 </template>
 
 <script setup lang="ts">
-import { ref, computed } from 'vue'
+import { ref } from 'vue'
 
 interface ExamMethod {
-  id: string
+  id: number | string
   name: string
   checked: boolean
 }
 
 interface ExamItem {
-  id: string
+  id: number | string
   name: string
   checked: boolean
   methods: ExamMethod[]
 }
 
-interface Category {
-  id: string
-  name: string
-  children?: Category[]
-  items?: ExamItem[]
+const categories = ref<any[]>([])
+const currentItems = ref<ExamItem[]>([])
+const selectedItems = ref<ExamItem[]>([])
+// 默认收起状态：不自动展开任何明细面板
+const activeCollapseNames = ref<(number | string)[]>([])
+
+const handleCategorySelect = (node: any) => {
+  // 实际项目中此处应调用 API 获取对应分类下的项目
+  currentItems.value = node.items || []
 }
 
-const categories = ref<Category[]>([])
-const currentCategory = ref<Category | null>(null)
-// 修复3：默认收起状态，activeCollapseNames 初始化为空数组
-const activeCollapseNames = ref<string[]>([])
-
-const currentItems = computed(() => {
-  return currentCategory.value?.items || []
-})
-
-const selectedItems = computed(() => {
-  const selected: ExamItem[] = []
-  categories.value.forEach(cat => {
-    cat.items?.forEach(item => {
-      if (item.checked) {
-        selected.push(item)
-      }
-    })
-  })
-  return selected
-})
-
-const handleCategorySelect = (node: Category) => {
-  currentCategory.value = node
+/**
+ * 清理名称：去除“套餐”等冗余标识，避免遮挡
+ */
+const cleanName = (name: string): string => {
+  if (!name) return ''
+  return name.replace(/套餐/g, '').trim()
 }
 
-// 修复1：项目勾选与检查方法解耦。仅切换项目自身状态，不触发方法自动勾选
+/**
+ * 处理项目勾选：严格解耦，不联动勾选下属检查方法
+ */
 const handleItemCheck = (item: ExamItem) => {
-  // 若取消勾选项目，同步清空其下方法状态，避免脏数据残留
-  if (!item.checked) {
-    item.methods.forEach(m => (m.checked = false))
+  if (item.checked) {
+    // 若未加入已选列表，则添加，并强制重置其方法为未勾选状态
+    if (!selectedItems.value.find(s => s.id === item.id)) {
+      selectedItems.value.push({
+        ...item,
+        methods: item.methods.map(m => ({ ...m, checked: false }))
+      })
+    }
+  } else {
+    // 取消勾选则从已选列表移除
+    selectedItems.value = selectedItems.value.filter(s => s.id !== item.id)
   }
 }
 
-// 修复1：检查方法独立勾选，不反向影响父级项目
-const handleMethodCheck = (_item: ExamItem, _method: ExamMethod) => {
-  // 仅更新 method.checked，保持父子状态独立
-}
-
-// 修复2：清理名称冗余“套餐”字样，支持自适应宽度与 Tooltip 完整提示
-const cleanName = (name: string) => {
-  if (!name) return ''
-  return name.replace(/套餐/g, '').trim()
+/**
+ * 处理检查方法勾选：独立控制，不影响父级项目状态
+ */
+const handleMethodCheck = (sel: ExamItem, method: ExamMethod) => {
+  // 仅更新当前方法状态，保持父子级独立
+  // 可根据后续业务需求扩展：如所有方法取消时是否自动移除父项目
 }
 </script>
 
@@ -132,38 +126,46 @@ const cleanName = (name: string) => {
   display: flex;
   flex-direction: column;
   gap: 16px;
+  padding: 16px;
   height: 100%;
 }
-.category-panel, .item-panel, .selected-panel {
-  flex: 1;
-  min-height: 0;
+
+.category-panel,
+.item-panel,
+.selected-panel {
+  width: 100%;
+}
+
+.item-list,
+.method-container {
   display: flex;
   flex-direction: column;
+  gap: 10px;
+  padding: 8px 0;
 }
-.item-list {
-  overflow-y: auto;
-  flex: 1;
-}
-.item-row, .method-row {
+
+.item-row,
+.method-row {
   display: flex;
   align-items: center;
-  padding: 8px 0;
   gap: 8px;
+  padding: 4px 0;
 }
-/* 修复2：名称区域宽度自适应，超长省略，配合 Tooltip 展示完整内容 */
-.item-name, .method-name, .collapse-title {
-  flex: 1;
+
+.item-name,
+.method-name,
+.collapse-title {
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
-  cursor: pointer;
-}
-.method-container {
-  padding-left: 24px;
+  max-width: 320px;
+  cursor: default;
 }
+
 .empty-tip {
-  text-align: center;
   color: #909399;
-  padding: 20px 0;
+  text-align: center;
+  padding: 24px 0;
+  font-size: 14px;
 }
 </style>