hanyuqing
/
KGPython
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

工具页面功能补充

mh
hanyuqing 3 months ago
parent
27cefb08be
commit
5302e2e1a3
1 changed files with 93 additions and 107 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 198
      vue/src/system/GraphStyle.vue

198
vue/src/system/GraphStyle.vue
View File

@ -462,8 +462,14 @@ export default {
methods: {
handleEditConfig(item) {
if (this.saveTimer) clearTimeout(this.saveTimer);
this.isInitialEcho = true;
// 如果点击的是当前正在编辑的配置，则退出编辑状态
if (this.editingConfigId === item.id) {
this.exitEditingMode();
return;
}
this.isInitialEcho = true;
this.editingConfigId = item.id;
this.editingConfigLabel = item.current_label;
this.activeTags = item.current_label;
@ -474,6 +480,32 @@ export default {
return;
}
// 将配置应用到控制面板变量
this.applyStylesToPanel(s);
const labelEn = tagToLabelMap[item.current_label];
if (labelEn) this.tagStyles[labelEn] = JSON.parse(JSON.stringify(s));
// 确保该配置在 usingConfigIds 中
if (!this.usingConfigIds.includes(item.id)) {
this.styleGroups.forEach(g => {
g.configs.forEach(c => {
if (this.usingConfigIds.includes(c.id) && c.current_label === item.current_label) {
this.usingConfigIds = this.usingConfigIds.filter(id => id !== c.id);
}
});
});
this.usingConfigIds.push(item.id);
}
this.updateAllElements();
this.$nextTick(() => {
setTimeout(() => { this.isInitialEcho = false; }, 100);
});
},
// 抽离：将样式对象应用到左侧面板变量
applyStylesToPanel(s) {
this.nodeShowLabel = s.nodeShowLabel;
this.nodeFontFamily = s.nodeFontFamily;
this.nodeFontSize = s.nodeFontSize;
@ -491,27 +523,28 @@ export default {
this.edgeType = s.edgeType;
this.edgeLineWidth = s.edgeLineWidth;
this.edgeStroke = s.edgeStroke;
},
const labelEn = tagToLabelMap[item.current_label];
if (labelEn) this.tagStyles[labelEn] = JSON.parse(JSON.stringify(s));
// 退出编辑模式：恢复控制栏到初始默认值
exitEditingMode() {
this.editingConfigId = null;
this.editingConfigLabel = '';
if (!this.usingConfigIds.includes(item.id)) {
this.styleGroups.forEach(g => {
g.configs.forEach(c => {
if (this.usingConfigIds.includes(c.id) && c.current_label === item.current_label) {
this.usingConfigIds = this.usingConfigIds.filter(id => id !== c.id);
}
});
});
this.usingConfigIds.push(item.id);
}
// 获取当前标签对应的系统初始默认样式
const labelEn = tagToLabelMap[this.activeTags];
const defaultStyle = this.getInitialTagParams(labelEn);
this.isInitialEcho = true;
// 1. 恢复控制面板UI
this.applyStylesToPanel(defaultStyle);
// 2. 恢复本地缓存（使图谱在该标签下也回归默认预览色）
this.tagStyles[labelEn] = JSON.parse(JSON.stringify(defaultStyle));
this.updateAllElements();
this.$nextTick(() => {
setTimeout(() => {
this.isInitialEcho = false;
}, 100);
this.updateAllElements();
});
ElMessage.info("已退出编辑模式，控制栏已恢复默认");
},
syncAndRefresh() {
@ -529,9 +562,11 @@ export default {
edgeLineWidth: this.edgeLineWidth, edgeStroke: this.edgeStroke
};
// 实时预览更新
this.tagStyles[labelEn] = currentStyle;
this.updateAllElements();
// 只有在编辑模式下才同步到数据库
if (this.editingConfigId) {
if (this.saveTimer) clearTimeout(this.saveTimer);
const currentEditId = this.editingConfigId;
@ -593,12 +628,12 @@ export default {
}
this.edgeLineWidth = val;
},
getInitialTagParams(label) {
const fill = INITIAL_FILL_MAP[label] || '#59d1d4';
getInitialTagParams(labelEn) {
const fill = INITIAL_FILL_MAP[labelEn] || '#59d1d4';
return {
nodeShowLabel: true, nodeFontFamily: 'Microsoft YaHei, sans-serif', nodeFontSize: 12, nodeFontColor: '#ffffff',
nodeShape: 'circle', nodeSize: 60, nodeFill: fill,
nodeStroke: INITIAL_STROKE_MAP[label] || '#40999b', nodeLineWidth: 2, edgeShowLabel: true, edgeEndArrow: true,
nodeStroke: INITIAL_STROKE_MAP[labelEn] || '#40999b', nodeLineWidth: 2, edgeShowLabel: true, edgeEndArrow: true,
edgeFontFamily: 'Microsoft YaHei, sans-serif', edgeFontSize: 10, edgeFontColor: '#666666', edgeType: 'line',
edgeLineWidth: 2, edgeStroke: fill
};
@ -623,10 +658,17 @@ export default {
performTagSwitch(tag) {
this.activeTags = tag;
const labelEn = tagToLabelMap[tag];
const style = this.tagStyles[labelEn];
// 如果不在编辑模式，切换标签时让控制栏显示该标签的默认样式
const style = this.editingConfigId ? this.tagStyles[labelEn] : this.getInitialTagParams(labelEn);
if (style) {
this.isInitialEcho = true;
Object.assign(this, style);
this.applyStylesToPanel(style);
// 如果是退出编辑后的切换，也要更新预览缓存
if (!this.editingConfigId) {
this.tagStyles[labelEn] = JSON.parse(JSON.stringify(style));
}
this.$nextTick(() => { this.isInitialEcho = false; });
}
this.updateAllElements();
@ -757,7 +799,7 @@ export default {
const currentActiveConf = activeGroup.configs.find(c => c.current_label === this.activeTags);
if (currentActiveConf) {
this.isInitialEcho = true;
Object.assign(this, currentActiveConf.styles);
this.applyStylesToPanel(currentActiveConf.styles);
this.editingConfigId = currentActiveConf.id;
this.editingConfigLabel = currentActiveConf.current_label;
this.$nextTick(() => { this.isInitialEcho = false; });
@ -778,8 +820,7 @@ export default {
if (idx > -1) {
this.usingConfigIds.splice(idx, 1);
if (this.editingConfigId === item.id) {
this.editingConfigId = null;
this.editingConfigLabel = '';
this.exitEditingMode(); // 退出应用的同时退出编辑
}
} else {
this.handleEditConfig(item);
@ -787,59 +828,36 @@ export default {
this.updateAllElements();
},
// 修改 validateGroupConstraint 函数
validateGroupConstraint(groupName, labelName, excludeId = null) {
const group = this.styleGroups.find(g => g.group_name === groupName);
if (!group) return true;
// 1. 检查标签是否重复
const isLabelExist = group.configs.some(c => c.current_label === labelName && c.id !== excludeId);
if (isLabelExist) {
// 使用 alert 而不是 confirm，因为它不需要处理“取消”逻辑，且必须加 .catch() 规避报错
ElMessageBox.alert(
`方案【${groupName}】中已存在【${labelName}】标签的配置，请先删除旧配置或选择其他方案。`,
'校验失败',
{ type: 'error' }
).catch(() => {}); // 捕获关闭弹窗时的异常
ElMessageBox.alert(`方案【${groupName}】中已存在【${labelName}】标签的配置，请先删除旧配置或选择其他方案。`, '校验失败', { type: 'error' }).catch(() => {});
return false;
}
// 2. 检查总量是否已达5个
if (group.configs.length >= 5 && !group.configs.some(c => c.id === excludeId)) {
ElMessageBox.alert(
`方案【${groupName}】的配置已满（上限5个），无法添加。`,
'校验失败',
{ type: 'error' }
).catch(() => {});
ElMessageBox.alert(`方案【${groupName}】的配置已满（上限5个），无法添加。`, '校验失败', { type: 'error' }).catch(() => {});
return false;
}
return true;
},
async moveConfigToGroup(config, targetGroup) {
// 移动时的校验
if (!this.validateGroupConstraint(targetGroup.group_name, config.current_label, config.id)) {
return;
}
if (!this.validateGroupConstraint(targetGroup.group_name, config.current_label, config.id)) return;
try {
const payload = {
id: config.id,
canvas_name: config.canvas_name,
group_name: targetGroup.group_name,
current_label: config.current_label,
styles: config.styles,
is_auto_save: false
id: config.id, canvas_name: config.canvas_name, group_name: targetGroup.group_name,
current_label: config.current_label, styles: config.styles, is_auto_save: false
};
const res = await saveGraphStyle(payload);
if (res.code === 200) {
ElMessage.success(`已移动至【${targetGroup.group_name}】`);
await this.fetchConfigs();
}
} catch (err) {
ElMessage.error("操作失败");
}
} catch (err) { ElMessage.error("操作失败"); }
},
handleSaveClick() {
@ -849,22 +867,12 @@ export default {
},
async confirmSave() {
if (!this.saveForm.group_name?.trim() || !this.saveForm.canvas_name?.trim()) {
return ElMessage.warning("请完善名称");
}
// 保存时的校验
if (!this.validateGroupConstraint(this.saveForm.group_name.trim(), this.activeTags)) {
return;
}
if (!this.saveForm.group_name?.trim() || !this.saveForm.canvas_name?.trim()) return ElMessage.warning("请完善名称");
if (!this.validateGroupConstraint(this.saveForm.group_name.trim(), this.activeTags)) return;
const labelEn = tagToLabelMap[this.activeTags];
const payload = {
canvas_name: this.saveForm.canvas_name.trim(),
group_name: this.saveForm.group_name.trim(),
current_label: this.activeTags,
styles: { ...this.tagStyles[labelEn] },
is_auto_save: false
canvas_name: this.saveForm.canvas_name.trim(), group_name: this.saveForm.group_name.trim(),
current_label: this.activeTags, styles: { ...this.tagStyles[labelEn] }, is_auto_save: false
};
const res = await saveGraphStyle(payload);
if (res.code === 200) {
@ -873,95 +881,73 @@ export default {
await this.fetchConfigs();
}
},
// ===========================================================================
async applyWholeGroup(group) {
if (this.saveTimer) clearTimeout(this.saveTimer);
this.isInitialEcho = true;
this.editingConfigId = null;
this.editingConfigLabel = '';
try {
const REQUIRED_TAGS = ['疾病', '症状', '药品', '检查', '其他'];
const currentLabels = group.configs.map(conf => conf.current_label);
const hasTags = new Set(currentLabels);
const missingTags = REQUIRED_TAGS.filter(tag => !hasTags.has(tag));
const missingTags = REQUIRED_TAGS.filter(tag => !new Set(currentLabels).has(tag));
if (missingTags.length > 0) {
this.isInitialEcho = false;
return ElMessageBox.alert(
`该方案配置不完整，无法应用。<br/>缺失：<b style="color: #f56c6c">${missingTags.join('、')}</b>`,
'提示', { dangerouslyUseHTMLString: true, type: 'warning' }
);
return ElMessageBox.alert(`该方案配置不完整，缺失：${missingTags.join('、')}`, '提示', { type: 'warning' }).catch(() => {});
}
this.usingConfigIds = group.configs.map(c => c.id);
const res = await applyGraphStyleGroup(group.id);
if (res.code === 200) {
await this.fetchConfigs();
if (group.configs.length > 0) {
this.handleEditConfig(group.configs[0]);
}
// 应用全案后，默认开启第一个配置的编辑模式
if (group.configs.length > 0) this.handleEditConfig(group.configs[0]);
ElMessage.success(`已应用方案【${group.group_name}】`);
}
} catch (err) {
this.isInitialEcho = false;
ElMessage.error("切换失败");
}
} catch (err) { this.isInitialEcho = false; ElMessage.error("切换失败"); }
},
resetStyle() {
const labelEn = tagToLabelMap[this.activeTags];
const initial = this.getInitialTagParams(labelEn);
this.tagStyles[labelEn] = initial;
this.isInitialEcho = true;
Object.assign(this, initial);
this.applyStylesToPanel(initial);
this.$nextTick(() => {
this.isInitialEcho = false;
this.syncAndRefresh();
});
},
async deleteSingleConfig(id) {
if (this.usingConfigIds.includes(id)) return ElMessage.error("应用中无法删除");
try {
await ElMessageBox.confirm('确定删除吗？', '提示');
const res = await deleteGraphStyle(id);
if (res.code === 200) {
ElMessage.success("删除成功");
this.fetchConfigs();
}
if (res.code === 200) { ElMessage.success("删除成功"); this.fetchConfigs(); }
} catch (err) { }
},
async deleteGroup(groupId) {
const group = this.styleGroups.find(g => g.id === groupId);
if (!group || group.is_active) return ElMessage.error("应用中无法删除");
try {
await ElMessageBox.confirm('确定删除全案吗？', '提示');
const res = await deleteGraphStyleGroup(groupId);
if (res.code === 200) {
ElMessage.success("已删除");
this.fetchConfigs();
}
if (res.code === 200) { ElMessage.success("已删除"); this.fetchConfigs(); }
} catch (err) { }
},
async handleUnifiedBatchDelete() {
if (this.checkedConfigIds.length === 0 && this.checkedGroupIds.length === 0) return;
try {
await ElMessageBox.confirm('确定批量删除吗？', '提示');
if (this.checkedGroupIds.length > 0) {
for (const gid of this.checkedGroupIds) await deleteGraphStyleGroup(gid);
}
if (this.checkedConfigIds.length > 0) {
await batchDeleteGraphStyle({ ids: this.checkedConfigIds });
}
ElMessage.success("成功");
this.clearSelection();
this.fetchConfigs();
if (this.checkedGroupIds.length > 0) { for (const gid of this.checkedGroupIds) await deleteGraphStyleGroup(gid); }
if (this.checkedConfigIds.length > 0) { await batchDeleteGraphStyle({ ids: this.checkedConfigIds }); }
ElMessage.success("成功"); this.clearSelection(); this.fetchConfigs();
} catch (e) { }
},
clearSelection() {
this.checkedConfigIds = [];
this.checkedGroupIds = [];
},
clearSelection() { this.checkedConfigIds = []; this.checkedGroupIds = []; },
handleResize() {
if (this._graph && this.$refs.graphContainer) {
this._graph.setSize(this.$refs.graphContainer.clientWidth, this.$refs.graphContainer.clientHeight);

Write Preview
Loading…
Cancel
Save