diff --git a/openhis-ui-vue3/src/views/doctorstation/components/examination/examinationApplication.vue b/openhis-ui-vue3/src/views/doctorstation/components/examination/examinationApplication.vue index 7c763f07..1ee2188d 100755 --- a/openhis-ui-vue3/src/views/doctorstation/components/examination/examinationApplication.vue +++ b/openhis-ui-vue3/src/views/doctorstation/components/examination/examinationApplication.vue @@ -522,6 +522,7 @@ const categoryList = ref([]); // 原始分类+项目数据 const dictSearchKey = ref(''); const activeNames = ref(''); // 当前展开的折叠项 const categoryLoadingSet = ref(new Set()); // Bug #500: 正在加载方法的分类集合 +const isAnimating = ref(false); // Bug #500: 防止快速切换时折叠动画重叠导致抖动 const allMethods = ref([]); @@ -669,8 +670,13 @@ async function handleCategoryExpand(cat) { categoryLoadingSet.value.delete(cat.typeId); } } -// Bug #500: 改为非 async 函数,避免 el-collapse 的 @change 等待异步完成导致抖动 +// Bug #500: 添加防抖逻辑,快速切换时跳过中间状态的动画,避免高度跳变和白屏闪烁 function handleCollapseChange(activeName) { + if (isAnimating.value) return; // 动画进行中,忽略后续点击 + + isAnimating.value = true; + setTimeout(() => { isAnimating.value = false; }, 300); // 与 CSS 过渡时长一致 + if (activeName) { const cat = filteredCategoryList.value.find(c => c.typeId == activeName); if (cat && (!cat.methods || cat.methods.length === 0)) { @@ -1307,6 +1313,7 @@ defineExpose({ getList }); .collapse-scroll { flex: 1; overflow-y: auto; + overflow-x: hidden; /* Bug #500: 防止切换时水平方向溢出导致抖动 */ } .empty-hint { color: #909399; @@ -1479,10 +1486,10 @@ defineExpose({ getList }); padding-bottom: 4px; transition: all 0.3s ease; } -/* Bug #500: 折叠面板展开/收起动画使用 will-change 优化性能 */ +/* Bug #500: 折叠面板动画容器,添加 overflow:hidden 防止展开时内容溢出导致闪烁 */ :deep(.el-collapse-item__wrap) { border: none; - will-change: height; + overflow: hidden; } :deep(.el-collapse-item) { transition: margin 0.2s ease;