Fix Bug #550
This commit is contained in:
@@ -397,11 +397,12 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="right-column">
|
||||
<!-- 右侧:已选择(检查项目、检查方法为两类独立选择结果) -->
|
||||
<div class="selected-panel">
|
||||
<div class="panel-label">已选择:</div>
|
||||
<div class="selected-tags">
|
||||
<template v-if="selectedItems.length === 0 && selectedMethods.length === 0 && methodsForActiveCategory.length === 0">
|
||||
<template v-if="selectedItems.length === 0 && selectedMethods.length === 0">
|
||||
<div class="empty-selected">–</div>
|
||||
</template>
|
||||
<template v-else>
|
||||
@@ -454,7 +455,7 @@
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
<div v-else class="fold-strip-muted">暂无项目套餐明细</div>
|
||||
<div v-else class="fold-strip-muted">暂无明细数据</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -525,43 +526,47 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 底部:独立勾选检查方法,样式与左侧项目选择一致 -->
|
||||
<div
|
||||
v-if="methodsForActiveCategory.length > 0"
|
||||
class="selected-global-method-picker"
|
||||
@click.stop
|
||||
>
|
||||
<div class="method-picker-collapse-title" @click="methodPickerExpanded = !methodPickerExpanded">
|
||||
<span class="method-picker-title-main">检查方法</span>
|
||||
<span v-if="activeCategoryName" class="global-method-picker-scope">{{ activeCategoryName }}</span>
|
||||
<el-icon :class="['method-picker-arrow', { expanded: methodPickerExpanded }]">
|
||||
<ArrowDown />
|
||||
</el-icon>
|
||||
</div>
|
||||
<div v-show="methodPickerExpanded" class="global-method-picker-list">
|
||||
<div
|
||||
v-for="method in methodsForActiveCategory"
|
||||
:key="'g-m-' + method.id"
|
||||
class="item-row method-picker-row"
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 独立检查方法勾选区:与"已选择"区域解耦,支持分别手动勾选 -->
|
||||
<div class="method-picker-section">
|
||||
<div
|
||||
v-if="methodsForActiveCategory.length > 0"
|
||||
class="selected-global-method-picker"
|
||||
@click.stop
|
||||
>
|
||||
<div class="method-picker-collapse-title" @click="methodPickerExpanded = !methodPickerExpanded">
|
||||
<span class="method-picker-title-main">检查方法</span>
|
||||
<span v-if="activeCategoryName" class="global-method-picker-scope">{{ activeCategoryName }}</span>
|
||||
<el-icon :class="['method-picker-arrow', { expanded: methodPickerExpanded }]">
|
||||
<ArrowDown />
|
||||
</el-icon>
|
||||
</div>
|
||||
<div v-show="methodPickerExpanded" class="global-method-picker-list">
|
||||
<div
|
||||
v-for="method in methodsForActiveCategory"
|
||||
:key="'g-m-' + method.id"
|
||||
class="item-row method-picker-row"
|
||||
>
|
||||
<el-checkbox
|
||||
:model-value="isStandaloneMethodSelected(method)"
|
||||
@change="(val) => onStandaloneMethodChange(!!val, method)"
|
||||
class="item-checkbox"
|
||||
>
|
||||
<el-checkbox
|
||||
:model-value="isStandaloneMethodSelected(method)"
|
||||
@change="(val) => onStandaloneMethodChange(!!val, method)"
|
||||
class="item-checkbox"
|
||||
>
|
||||
<span class="method-label-inner">{{ formatExamMethodCaption(method.name) }}</span>
|
||||
</el-checkbox>
|
||||
<span class="item-price">¥{{ formatDetailAmount(method.packagePrice || method.price || 0) }}</span>
|
||||
</div>
|
||||
<span class="method-label-inner">{{ formatExamMethodCaption(method.name) }}</span>
|
||||
</el-checkbox>
|
||||
<span class="item-price">¥{{ formatDetailAmount(method.packagePrice || method.price || 0) }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
@@ -588,7 +593,7 @@ const activeDetailTab = ref('applyForm');
|
||||
const applicationList = ref([]);
|
||||
const selectedItems = ref([]);
|
||||
const selectedMethods = ref([]);
|
||||
const methodPickerExpanded = ref(true);
|
||||
const methodPickerExpanded = ref(false);
|
||||
|
||||
// Bug #499: 查询过滤状态
|
||||
const searchForm = reactive({
|
||||
@@ -1109,8 +1114,7 @@ async function handleCategoryExpand(cat) {
|
||||
function handleCollapseChange(activeName) {
|
||||
// 始终记录当前激活的分类,确保 handleCategoryExpand 能正确忽略过期请求
|
||||
currentActiveCategory.value = activeName || null;
|
||||
// 底部「检查方法」勾选区默认展开,不因切换左侧分类而收起
|
||||
methodPickerExpanded.value = true;
|
||||
|
||||
|
||||
if (activeName) {
|
||||
// Bug #428修复: 直接从 categoryList(原始响应式数组)查找分类,
|
||||
@@ -2102,6 +2106,23 @@ defineExpose({ getList });
|
||||
|
||||
/* 已选择 tags */
|
||||
/* 已选择:加宽,避免套餐明细挤成一团 */
|
||||
.right-column {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.method-picker-section {
|
||||
width: 260px;
|
||||
min-width: 240px;
|
||||
max-width: 320px;
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
.selected-panel {
|
||||
width: 260px;
|
||||
min-width: 240px;
|
||||
|
||||
Reference in New Issue
Block a user