Fix Bug #550: AI修复
This commit is contained in:
@@ -60,21 +60,21 @@
|
||||
<script setup>
|
||||
import { ref, computed } from 'vue'
|
||||
|
||||
// 模拟数据源（实际应从后端API获取）
|
||||
// 模拟分类数据（实际应从API获取）
|
||||
const categories = ref([
|
||||
{ id: 1, name: '彩超' },
|
||||
{ id: 2, name: 'CT' }
|
||||
{ id: 2, name: 'CT' },
|
||||
{ id: 3, name: 'MRI' }
|
||||
])
|
||||
|
||||
const allItems = ref([
|
||||
{ id: 101, categoryId: 1, name: '128线排彩超套餐', methods: [
|
||||
{ id: 1001, name: '腹部彩超', selected: false },
|
||||
{ id: 1002, name: '心脏彩超', selected: false }
|
||||
]},
|
||||
{ id: 102, categoryId: 1, name: '常规彩超', methods: [] }
|
||||
])
|
||||
|
||||
const selectedCategory = ref(null)
|
||||
|
||||
// 模拟项目数据
|
||||
const allItems = ref([
|
||||
{ id: 128, categoryId: 1, name: '套餐：128线排', methods: [{ id: 1281, name: '常规扫描', selected: false }, { id: 1282, name: '增强扫描', selected: false }] },
|
||||
{ id: 102, categoryId: 1, name: '普通彩超', methods: [] },
|
||||
{ id: 201, categoryId: 2, name: '胸部CT平扫', methods: [{ id: 2011, name: '薄层重建', selected: false }] }
|
||||
])
|
||||
|
||||
const selectedItems = ref([])
|
||||
|
||||
const currentItems = computed(() => {
|
||||
@@ -86,60 +86,151 @@ const selectCategory = (cat) => {
|
||||
selectedCategory.value = cat
|
||||
}
|
||||
|
||||
const isSelected = (itemId) => {
|
||||
return selectedItems.value.some(i => i.id === itemId)
|
||||
const isSelected = (id) => {
|
||||
return selectedItems.value.some(i => i.id === id)
|
||||
}
|
||||
|
||||
// 核心修复1：项目勾选与检查方法解耦
|
||||
// 修复：项目勾选与检查方法解耦，新增时默认收起，方法状态独立初始化为未勾选
|
||||
const toggleItem = (item) => {
|
||||
const exists = selectedItems.value.find(i => i.id === item.id)
|
||||
if (exists) {
|
||||
selectedItems.value = selectedItems.value.filter(i => i.id !== item.id)
|
||||
const idx = selectedItems.value.findIndex(i => i.id === item.id)
|
||||
if (idx > -1) {
|
||||
selectedItems.value.splice(idx, 1)
|
||||
} else {
|
||||
// 新增项目时，默认不勾选其下的检查方法，保持独立状态
|
||||
const newItem = {
|
||||
...item,
|
||||
expanded: false, // 默认收起
|
||||
methods: item.methods.map(m => ({ ...m, selected: false }))
|
||||
}
|
||||
selectedItems.value.push(newItem)
|
||||
selectedItems.value.push({
|
||||
...item,
|
||||
expanded: false,
|
||||
methods: item.methods ? item.methods.map(m => ({ ...m, selected: false })) : []
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
// 核心修复2：独立控制检查方法勾选
|
||||
const toggleMethod = (parentItem, method) => {
|
||||
method.selected = !method.selected
|
||||
}
|
||||
|
||||
// 核心修复3：展开/收起控制
|
||||
const toggleExpand = (item) => {
|
||||
item.expanded = !item.expanded
|
||||
}
|
||||
|
||||
// 核心修复4：清理“套餐”字样，提供完整名称提示
|
||||
// 修复：清理名称前缀，避免“套餐”字样冗余
|
||||
const cleanName = (name) => {
|
||||
return name.replace(/套餐/g, '').trim()
|
||||
if (!name) return ''
|
||||
return name.replace(/^(项目)?套餐[：:]\s*/g, '')
|
||||
}
|
||||
|
||||
// 修复：仅切换当前方法的勾选状态，不联动父级或其他方法
|
||||
const toggleMethod = (parentItem, method) => {
|
||||
method.selected = !method.selected
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.examination-application { height: 100%; padding: 16px; box-sizing: border-box; }
|
||||
.layout-container { display: flex; gap: 16px; height: 100%; }
|
||||
.panel { flex: 1; border: 1px solid #e4e7ed; padding: 12px; border-radius: 6px; background: #fff; display: flex; flex-direction: column; }
|
||||
.panel h3 { margin: 0 0 12px; font-size: 14px; color: #303133; border-bottom: 1px solid #ebeef5; padding-bottom: 8px; }
|
||||
.category-list, .item-list { list-style: none; padding: 0; margin: 0; overflow-y: auto; flex: 1; }
|
||||
.category-list li, .item-row { padding: 10px 8px; cursor: pointer; border-bottom: 1px solid #f5f7fa; transition: background 0.2s; }
|
||||
.examination-application {
|
||||
height: 100%;
|
||||
padding: 10px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.layout-container {
|
||||
display: flex;
|
||||
gap: 12px;
|
||||
height: 100%;
|
||||
}
|
||||
.panel {
|
||||
border: 1px solid #e0e0e0;
|
||||
border-radius: 6px;
|
||||
padding: 12px;
|
||||
background: #fff;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.panel h3 {
|
||||
margin: 0 0 10px 0;
|
||||
font-size: 14px;
|
||||
color: #333;
|
||||
border-bottom: 1px solid #eee;
|
||||
padding-bottom: 8px;
|
||||
}
|
||||
.category-panel { width: 20%; }
|
||||
.item-panel { width: 30%; }
|
||||
.selected-panel { width: 50%; }
|
||||
.category-list, .item-list {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
flex: 1;
|
||||
overflow-y: auto;
|
||||
}
|
||||
.category-list li, .item-row {
|
||||
padding: 8px 10px;
|
||||
cursor: pointer;
|
||||
border-bottom: 1px solid #f5f5f5;
|
||||
font-size: 13px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
}
|
||||
.category-list li:hover, .item-row:hover { background: #f0f7ff; }
|
||||
.category-list li.active { background: #ecf5ff; color: #409eff; font-weight: 500; }
|
||||
.selected-list { overflow-y: auto; flex: 1; }
|
||||
.selected-card { border: 1px solid #dcdfe6; border-radius: 4px; margin-bottom: 8px; overflow: hidden; background: #fafafa; }
|
||||
.card-header { display: flex; justify-content: space-between; align-items: center; padding: 10px 12px; cursor: pointer; user-select: none; }
|
||||
.card-header:hover { background: #f5f7fa; }
|
||||
.item-title { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; color: #303133; }
|
||||
.toggle-icon { font-size: 12px; color: #909399; margin-left: 8px; }
|
||||
.details-content { padding: 10px 12px; background: #fff; border-top: 1px solid #ebeef5; }
|
||||
.method-list { display: flex; flex-direction: column; gap: 6px; }
|
||||
.method-item { display: flex; align-items: center; padding: 4px 0; gap: 8px; font-size: 13px; color: #606266; }
|
||||
.no-methods { color: #909399; font-size: 12px; padding: 4px 0; }
|
||||
.empty-tip { color: #909399; text-align: center; padding: 40px 0; font-size: 13px; }
|
||||
.category-list li.active { background: #e6f7ff; color: #1890ff; font-weight: 500; }
|
||||
.selected-list {
|
||||
flex: 1;
|
||||
overflow-y: auto;
|
||||
padding-right: 4px;
|
||||
}
|
||||
.selected-card {
|
||||
border: 1px solid #d9d9d9;
|
||||
border-radius: 4px;
|
||||
margin-bottom: 8px;
|
||||
background: #fafafa;
|
||||
overflow: hidden;
|
||||
}
|
||||
.card-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 8px 10px;
|
||||
cursor: pointer;
|
||||
background: #fff;
|
||||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
.item-title {
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
font-weight: 500;
|
||||
margin-right: 8px;
|
||||
font-size: 13px;
|
||||
}
|
||||
.toggle-icon {
|
||||
font-size: 12px;
|
||||
color: #666;
|
||||
user-select: none;
|
||||
}
|
||||
.details-content {
|
||||
padding: 8px 10px;
|
||||
background: #fff;
|
||||
}
|
||||
.method-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 4px;
|
||||
}
|
||||
.method-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 4px 0;
|
||||
font-size: 12px;
|
||||
color: #555;
|
||||
}
|
||||
.method-item input {
|
||||
margin-right: 8px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.empty-tip {
|
||||
color: #999;
|
||||
text-align: center;
|
||||
margin-top: 30px;
|
||||
font-size: 13px;
|
||||
}
|
||||
.no-methods {
|
||||
color: #999;
|
||||
font-size: 12px;
|
||||
padding: 4px 0;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user