Fix Bug #550: AI修复

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

@@ -20,7 +20,7 @@
             v-model="item.checked"
             @change="handleItemCheck(item)"
           />
-          <el-tooltip :content="cleanName(item.name)" placement="top" :show-after="300">
+          <el-tooltip :content="item.name" placement="top" :show-after="300">
             <span class="item-name">{{ cleanName(item.name) }}</span>
           </el-tooltip>
         </div>
@@ -38,7 +38,7 @@
           :name="sel.id"
         >
           <template #title>
-            <el-tooltip :content="cleanName(sel.name)" placement="top" :show-after="300">
+            <el-tooltip :content="sel.name" placement="top" :show-after="300">
               <span class="collapse-title">{{ cleanName(sel.name) }}</span>
             </el-tooltip>
           </template>
@@ -48,7 +48,9 @@
                 v-model="method.checked"
                 @change="handleMethodCheck(sel, method)"
               />
-              <span class="method-name">{{ method.name }}</span>
+              <el-tooltip :content="method.name" placement="top" :show-after="300">
+                <span class="method-name">{{ cleanName(method.name) }}</span>
+              </el-tooltip>
             </div>
           </div>
         </el-collapse-item>
@@ -73,60 +75,56 @@ interface ExamItem {
   methods: ExamMethod[]
 }
 
-// 模拟分类与项目数据（实际由接口注入）
-const categories = ref([
-  { id: 'cat1', label: '彩超', children: [] },
-  { id: 'cat2', label: 'X光', children: [] }
-])
+interface Category {
+  id: string
+  name: string
+  children?: Category[]
+  items?: ExamItem[]
+}
 
-const currentItems = ref<ExamItem[]>([
-  { id: '101', name: '128线排彩超套餐', checked: false, methods: [
-    { id: 'm1', name: '常规检查', checked: false },
-    { id: 'm2', name: '血管多普勒', checked: false }
-  ]},
-  { id: '102', name: '腹部彩超', checked: false, methods: [] }
-])
-
-// 默认收起所有已选面板
+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
+}
+
+// 修复1：项目勾选与检查方法解耦。仅切换项目自身状态，不触发方法自动勾选
+const handleItemCheck = (item: ExamItem) => {
+  // 若取消勾选项目，同步清空其下方法状态，避免脏数据残留
+  if (!item.checked) {
+    item.methods.forEach(m => (m.checked = false))
+  }
+}
+
+// 修复1：检查方法独立勾选，不反向影响父级项目
+const handleMethodCheck = (_item: ExamItem, _method: ExamMethod) => {
+  // 仅更新 method.checked，保持父子状态独立
+}
+
+// 修复2：清理名称冗余“套餐”字样，支持自适应宽度与 Tooltip 完整提示
 const cleanName = (name: string) => {
+  if (!name) return ''
   return name.replace(/套餐/g, '').trim()
 }
-
-// 选择分类（触发项目列表刷新）
-const handleCategorySelect = (data: any) => {
-  console.log('切换分类:', data.label)
-  // 实际业务：调用API加载对应分类下的项目
-}
-
-// 勾选项目（解耦：仅控制项目本身，不联动勾选方法）
-const handleItemCheck = (item: ExamItem) => {
-  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)
-  }
-}
-
-// 勾选方法（独立控制，不影响父级或其他同级方法）
-const handleMethodCheck = (sel: ExamItem, method: ExamMethod) => {
-  const target = selectedItems.value.find(s => s.id === sel.id)
-  if (target) {
-    const m = target.methods.find(m => m.id === method.id)
-    if (m) m.checked = method.checked
-  }
-}
-
-// 已选项目列表（响应式维护）
-const selectedItems = ref<ExamItem[]>([])
 </script>
 
 <style scoped>
@@ -134,9 +132,7 @@ const selectedItems = ref<ExamItem[]>([])
   display: flex;
   flex-direction: column;
   gap: 16px;
-  padding: 16px;
   height: 100%;
-  box-sizing: border-box;
 }
 .category-panel, .item-panel, .selected-panel {
   flex: 1;
@@ -144,30 +140,30 @@ const selectedItems = ref<ExamItem[]>([])
   display: flex;
   flex-direction: column;
 }
-.item-list, .method-container {
-  flex: 1;
+.item-list {
   overflow-y: auto;
-  padding-right: 4px;
+  flex: 1;
 }
 .item-row, .method-row {
   display: flex;
   align-items: center;
-  padding: 8px 4px;
-  border-bottom: 1px solid #f5f7fa;
-  cursor: pointer;
+  padding: 8px 0;
+  gap: 8px;
 }
+/* 修复2：名称区域宽度自适应，超长省略，配合 Tooltip 展示完整内容 */
 .item-name, .method-name, .collapse-title {
   flex: 1;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
-  margin-left: 8px;
-  font-size: 14px;
+  cursor: pointer;
+}
+.method-container {
+  padding-left: 24px;
 }
 .empty-tip {
-  color: #909399;
   text-align: center;
-  padding: 24px 0;
-  font-size: 13px;
+  color: #909399;
+  padding: 20px 0;
 }
 </style>