Fix Bug #550: AI修复
This commit is contained in:
@@ -58,67 +58,75 @@
|
|||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup>
|
||||||
import { ref, computed } from 'vue'
|
import { ref, reactive } from 'vue'
|
||||||
import { ArrowDown, ArrowUp } from '@element-plus/icons-vue'
|
import { ArrowDown, ArrowUp } from '@element-plus/icons-vue'
|
||||||
|
|
||||||
// 状态定义
|
// 状态定义
|
||||||
const categoryTree = ref<any[]>([])
|
const categoryTree = ref([])
|
||||||
const currentItems = ref<any[]>([])
|
const currentItems = ref([])
|
||||||
const selectedItemIds = ref<number[]>([])
|
const selectedItemIds = ref([])
|
||||||
const selectedMethodIds = ref<number[]>([])
|
const selectedMethodIds = ref([])
|
||||||
const selectedItems = ref<any[]>([])
|
const selectedItems = reactive([])
|
||||||
|
|
||||||
// 分类切换
|
/**
|
||||||
const handleCategorySelect = (node: any) => {
|
* 修复 Bug #550 核心逻辑:
|
||||||
|
* 1. 去除“套餐”前缀,清理冗余文案
|
||||||
|
*/
|
||||||
|
const formatItemName = (name) => {
|
||||||
|
if (!name) return ''
|
||||||
|
return name.replace(/^(套餐|项目套餐)[::]/g, '').trim()
|
||||||
|
}
|
||||||
|
|
||||||
|
const handleCategorySelect = (node) => {
|
||||||
|
// 实际业务中此处应请求后端获取对应分类下的项目列表
|
||||||
currentItems.value = node.items || []
|
currentItems.value = node.items || []
|
||||||
}
|
}
|
||||||
|
|
||||||
// 项目勾选变更(核心解耦逻辑)
|
/**
|
||||||
const handleItemChange = (ids: number[]) => {
|
* 修复 Bug #550 核心逻辑:
|
||||||
const addedIds = ids.filter(id => !selectedItemIds.value.includes(id))
|
* 2. 项目与检查方法完全解耦。勾选项目仅同步 selectedItems 状态,
|
||||||
const removedIds = selectedItemIds.value.filter(id => !ids.includes(id))
|
* 绝不自动触发 selectedMethodIds 的变更。
|
||||||
|
*/
|
||||||
|
const handleItemChange = (ids) => {
|
||||||
|
const currentIds = new Set(ids)
|
||||||
|
|
||||||
// 新增项目:默认 expanded: false,不联动勾选方法
|
// 移除已取消勾选的项目
|
||||||
addedIds.forEach(id => {
|
for (let i = selectedItems.length - 1; i >= 0; i--) {
|
||||||
const item = currentItems.value.find(i => i.id === id)
|
if (!currentIds.has(selectedItems[i].id)) {
|
||||||
if (item && !selectedItems.value.find(s => s.id === id)) {
|
selectedItems.splice(i, 1)
|
||||||
selectedItems.value.push({
|
}
|
||||||
...item,
|
}
|
||||||
expanded: false, // 修复:默认收起状态
|
|
||||||
methods: item.methods || []
|
// 新增勾选的项目(默认收起 expanded: false)
|
||||||
})
|
ids.forEach(id => {
|
||||||
|
if (!selectedItems.find(i => i.id === id)) {
|
||||||
|
const item = currentItems.value.find(i => i.id === id)
|
||||||
|
if (item) {
|
||||||
|
selectedItems.push({
|
||||||
|
id: item.id,
|
||||||
|
name: item.name,
|
||||||
|
methods: item.methods || [],
|
||||||
|
expanded: false // 默认收起状态
|
||||||
|
})
|
||||||
|
}
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
// 移除项目:同步清理已选列表及对应的方法勾选
|
|
||||||
removedIds.forEach(id => {
|
|
||||||
const target = selectedItems.value.find(s => s.id === id)
|
|
||||||
if (target) {
|
|
||||||
selectedMethodIds.value = selectedMethodIds.value.filter(
|
|
||||||
mId => !target.methods.some(m => m.id === mId)
|
|
||||||
)
|
|
||||||
}
|
|
||||||
selectedItems.value = selectedItems.value.filter(s => s.id !== id)
|
|
||||||
})
|
|
||||||
|
|
||||||
selectedItemIds.value = ids
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// 检查方法勾选变更(独立维护,不反向影响项目)
|
/**
|
||||||
const handleMethodChange = (ids: number[]) => {
|
* 修复 Bug #550 核心逻辑:
|
||||||
|
* 3. 检查方法独立维护,仅响应用户手动点击,不反向污染项目勾选状态。
|
||||||
|
*/
|
||||||
|
const handleMethodChange = (ids) => {
|
||||||
selectedMethodIds.value = ids
|
selectedMethodIds.value = ids
|
||||||
}
|
}
|
||||||
|
|
||||||
// 展开/收起切换
|
const toggleExpand = (id) => {
|
||||||
const toggleExpand = (id: number) => {
|
const item = selectedItems.find(i => i.id === id)
|
||||||
const item = selectedItems.value.find(i => i.id === id)
|
if (item) {
|
||||||
if (item) item.expanded = !item.expanded
|
item.expanded = !item.expanded
|
||||||
}
|
}
|
||||||
|
|
||||||
// 名称格式化:去除冗余“套餐”字样
|
|
||||||
const formatItemName = (name: string) => {
|
|
||||||
return name.replace(/套餐/g, '')
|
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
@@ -126,72 +134,96 @@ const formatItemName = (name: string) => {
|
|||||||
.exam-request-wrapper {
|
.exam-request-wrapper {
|
||||||
display: flex;
|
display: flex;
|
||||||
gap: 16px;
|
gap: 16px;
|
||||||
padding: 16px;
|
|
||||||
height: 100%;
|
height: 100%;
|
||||||
box-sizing: border-box;
|
padding: 16px;
|
||||||
|
background: #f5f7fa;
|
||||||
}
|
}
|
||||||
|
|
||||||
.left-panel, .middle-panel, .right-panel {
|
.left-panel, .middle-panel, .right-panel {
|
||||||
border: 1px solid #ebeef5;
|
border: 1px solid #ebeef5;
|
||||||
border-radius: 4px;
|
border-radius: 6px;
|
||||||
padding: 12px;
|
padding: 12px;
|
||||||
background: #fff;
|
background: #fff;
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
}
|
}
|
||||||
.left-panel { width: 20%; }
|
|
||||||
.middle-panel { width: 30%; }
|
.left-panel { width: 22%; }
|
||||||
.right-panel { width: 50%; }
|
.middle-panel { width: 28%; }
|
||||||
|
.right-panel { flex: 1; }
|
||||||
|
|
||||||
|
.item-checkbox {
|
||||||
|
display: block;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
line-height: 1.5;
|
||||||
|
}
|
||||||
|
|
||||||
.selected-list {
|
.selected-list {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
gap: 10px;
|
gap: 12px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.selected-card {
|
.selected-card {
|
||||||
border: 1px solid #dcdfe6;
|
border: 1px solid #dcdfe6;
|
||||||
border-radius: 6px;
|
border-radius: 6px;
|
||||||
padding: 10px;
|
overflow: hidden;
|
||||||
background: #fafafa;
|
transition: box-shadow 0.2s;
|
||||||
width: 100%; /* 修复:宽度自适应容器 */
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.selected-card:hover {
|
||||||
|
box-shadow: 0 2px 8px rgba(0,0,0,0.08);
|
||||||
|
}
|
||||||
|
|
||||||
.card-header {
|
.card-header {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 10px 12px;
|
||||||
|
background: #fafafa;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
padding: 4px 0;
|
|
||||||
user-select: none;
|
user-select: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* 宽度自适应 + 文本截断 */
|
||||||
.item-title {
|
.item-title {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
font-weight: 500;
|
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
max-width: 100%; /* 修复:支持文本溢出省略 */
|
font-weight: 500;
|
||||||
|
color: #303133;
|
||||||
|
margin-right: 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.expand-icon {
|
.expand-icon {
|
||||||
margin-left: 8px;
|
font-size: 14px;
|
||||||
color: #909399;
|
color: #909399;
|
||||||
|
flex-shrink: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.card-body {
|
.card-body {
|
||||||
margin-top: 8px;
|
padding: 12px;
|
||||||
padding-top: 8px;
|
border-top: 1px solid #ebeef5;
|
||||||
border-top: 1px dashed #ebeef5;
|
background: #fff;
|
||||||
}
|
}
|
||||||
|
|
||||||
.method-section {
|
.method-section {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
gap: 6px;
|
gap: 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.section-label {
|
.section-label {
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
color: #909399;
|
color: #606266;
|
||||||
|
font-weight: 600;
|
||||||
margin-bottom: 4px;
|
margin-bottom: 4px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.empty-tip {
|
.empty-tip {
|
||||||
color: #909399;
|
color: #909399;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
padding: 20px;
|
padding: 40px 0;
|
||||||
|
font-size: 14px;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
Reference in New Issue
Block a user