Fix Bug #550: 检查申请项目选择交互优化 — isMethodSelected 排除 methodAutoSelected 避免联动冲突,移除冗余套餐标签+加宽面板+橙色边框区分套餐

根因: handleItemSelect 中 pickDefaultMethod 自动设置 selectedMethod 后,
isMethodSelected 没有区分手动/自动选中,导致右侧检查方法 checkbox 被动勾选。

修复:
1. isMethodSelected 增加 !item.methodAutoSelected 条件,过滤自动选中的方法
2. handleItemSelect 设置/清除 methodAutoSelected 标记
3. 移除已选卡片冗余"套餐"标签,改用 is-package 类+左侧橙色边框区分
4. 已选面板 max-width 从 280px 加宽到 340px,减少名称截断

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
2026-05-19 10:06:41 +08:00
parent 724760edec
commit 83ea8b7027

View File

@@ -440,9 +440,8 @@
class="selected-item-card"
:class="{ 'is-expanded': item.expanded }"
>
<!-- Bug #384修复 + #426修复: 项目卡片头部,可展开/收起 -->
<div class="card-header" @click="toggleItemExpand(item)">
<el-tag v-if="item.isPackage || item.packageName" size="small" type="warning" style="margin-right: 4px; flex-shrink: 0;">套餐</el-tag>
<!-- Bug #384修复 + #426修复 + #550修复: 项目卡片头部,移除冗余"套餐"标签 -->
<div class="card-header" @click="toggleItemExpand(item)" :class="{ 'is-package': item.isPackage || item.packageName }">
<el-tooltip :content="item.name" placement="top" :show-after="400">
<span class="card-name">{{ item.name }}</span>
</el-tooltip>
@@ -1360,9 +1359,10 @@ function handleDelete(row) {
}
// Bug #428修复: 判断某个检查方法是否已被选中(任意项目关联了该方法)
// Bug #550修复: 排除 methodAutoSelected 的项目,避免自动选中的方法导致右侧 checkbox 被动勾选
function isMethodSelected(method, cat) {
return selectedItems.value.some(item =>
item.selectedMethod?.id === method.id && item.checkType === cat.typeName
item.selectedMethod?.id === method.id && item.checkType === cat.typeName && !item.methodAutoSelected
);
}
@@ -1524,6 +1524,10 @@ async function handleItemSelect(checked, item, cat) {
// 右侧不再展示「检查方法」列表:自动选默认方法(保存、计价仍依赖 selectedMethod
if (methods.length >= 1) {
row.selectedMethod = pickDefaultMethod(methods, item);
// Bug #550修复: 标记为自动选择isMethodSelected 需排除,避免右侧方法被被动勾选
row.methodAutoSelected = true;
} else {
row.methodAutoSelected = false;
}
updateMethodDisplay();
@@ -1958,7 +1962,7 @@ defineExpose({ getList });
.selected-panel {
width: 220px;
min-width: 200px;
max-width: 280px;
max-width: 340px; /* Bug #550修复: 从280px加宽到340px让项目名更完整显示 */
flex-shrink: 0;
display: flex;
flex-direction: column;
@@ -2008,6 +2012,11 @@ defineExpose({ getList });
background: linear-gradient(180deg, #ecf5ff 0%, #e3eef8 100%);
}
/* Bug #550修复: 套餐项目左侧加橙色边框标识,与普通项目区分 */
.selected-item-card .card-header.is-package {
border-left: 3px solid #e6a23c;
}
.selected-item-card.is-expanded .card-header {
border-bottom-color: #ebeef5;
}