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

all

hanyuqing
hanyuqing 3 months ago
parent
911c8946bb
commit
2212e576bf
3 changed files with 29 additions and 56 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. 25
      vue/src/system/GraphQA.vue
  2. 42
      vue/src/system/GraphStyle.vue
  3. 18
      vue/src/system/KGData.vue

25
vue/src/system/GraphQA.vue
View File

@ -130,12 +130,8 @@ export default {
},
// =======================================================================
mounted() {
this.$nextTick(() => {
setTimeout(() => {
this.getDefault()
}, 300);
});
async mounted() {
await this.getDefault()
// =============== 👇【新增】页面加载时从 localStorage 恢复数据 ===============
this.restoreDataFromLocalStorage();
// =======================================================================
@ -277,13 +273,12 @@ export default {
// === 1. 构建 nodeId → label 映射 ===
const nodeIdToEnLabel = {};
data.nodes.forEach(node => {
nodeIdToEnLabel[node.id] = node.data.label; // e.g. "Disease"
nodeIdToEnLabel[node.id] = node.data.type; // e.g. "Disease"
});
// === 2. 处理节点：根据自身 label 设置样式 ===
const updatedNodes = data.nodes.map(node => {
const enLabel = node.data.label;
const zhLabel = this.enToZhLabelMap[enLabel] || '其他'; // 默认回退到“其他”
const styleConf = this.parsedStyles[zhLabel] || {};
const enLabel = node.data.type;
const styleConf = this.parsedStyles[enLabel] || {};
return {
...node,
type: styleConf.nodeShape || this.nodeShape,
@ -304,8 +299,7 @@ export default {
const updatedEdges = data.edges.map(edge => {
console.log(edge)
const sourceEnLabel = nodeIdToEnLabel[edge.source]; // e.g. "Disease"
const sourceZhLabel = this.enToZhLabelMap[sourceEnLabel] || '其他';
const styleConf = this.parsedStyles[sourceZhLabel] || {};
const styleConf = this.parsedStyles[sourceEnLabel] || {};
return {
...edge,
@ -342,14 +336,16 @@ export default {
this._graph.destroy()
this._graph = null;
}
console.log(data)
// === 1. 构建 nodeId → label 映射 ===
const nodeIdToEnLabel = {};
data.nodes.forEach(node => {
nodeIdToEnLabel[node.id] = node.type; // e.g. "Disease"
nodeIdToEnLabel[node.id] = node.data.type; // e.g. "Disease"
});
console.log(nodeIdToEnLabel)
// === 2. 处理节点：根据自身 label 设置样式 ===
const updatedNodes = data.nodes.map(node => {
const enLabel = node.data.label;
const enLabel = node.data.type;
const styleConf = this.parsedStyles[enLabel] || {};
return {
...node,
@ -478,7 +474,6 @@ export default {
edge: {
style: {
labelText: (d) => {
console.log(d)
return d.data.label},
// stroke: (d) => {
// const targetLabel = this._nodeLabelMap.get(d.source); // d.target 是目标节点 ID

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

@ -52,7 +52,8 @@
<div class="color-picker-item">
<label>字体颜色</label>
<div class="color-picker-border">
<input v-model="nodeFontColor" type="color" class="square-picker"/>
<el-color-picker v-model="nodeFontColor" show-alpha class="square-picker"/>
<!-- <input v-model="nodeFontColor" type="color" class="square-picker"/>-->
</div>
</div>
@ -80,14 +81,16 @@
<div class="color-picker-item">
<label>填充颜色</label>
<div class="color-picker-border">
<input v-model="nodeFill" type="color" class="square-picker"/>
<el-color-picker v-model="nodeFill" show-alpha class="square-picker"/>
<!-- <input v-model="nodeFill" type="color" class="square-picker"/>-->
</div>
</div>
<div class="color-picker-item">
<label>边框颜色</label>
<div class="color-picker-border">
<input v-model="nodeStroke" type="color" class="square-picker"/>
<el-color-picker v-model="nodeStroke" show-alpha class="square-picker"/>
<!-- <input v-model="nodeStroke" type="color" class="square-picker"/>-->
</div>
</div>
@ -136,7 +139,8 @@
<div class="color-picker-item">
<label>字体颜色</label>
<div class="color-picker-border">
<input v-model="edgeFontColor" type="color" class="square-picker"/>
<el-color-picker v-model="edgeFontColor" class="square-picker" show-alpha />
<!-- <input v-model="edgeFontColor" type="color" class="square-picker"/>-->
</div>
</div>
@ -164,7 +168,8 @@
<div class="color-picker-item">
<label>线条颜色</label>
<div class="color-picker-border">
<input v-model="edgeStroke" type="color" class="square-picker"/>
<el-color-picker v-model="edgeStroke" class="square-picker" show-alpha />
<!-- <input v-model="edgeStroke" type="color" class="square-picker"/>-->
</div>
</div>
</div>
@ -507,6 +512,7 @@ export default {
},
syncAndRefresh() {
const label = tagToLabelMap[this.activeTags];
console.log(this.nodeFill)
if (label) {
this.tagStyles[label] = {
nodeShowLabel: this.nodeShowLabel, nodeFontFamily: this.nodeFontFamily, nodeFontSize: this.nodeFontSize,
@ -744,16 +750,7 @@ export default {
// 4. 【新增】拦截逻辑：如果标签不全，弹出提示并返回
if (missingTags.length > 0) {
return ElMessageBox.alert(
`该方案配置不完整，无法应用。必须配齐 5 个核心标签。` +
`<br/>目前缺失：<b style="color: #f56c6c">${missingTags.join('、')}</b>`,
'校验未通过',
{
confirmButtonText: '我知道了',
dangerouslyUseHTMLString: true,
type: 'warning'
}
);
return ElMessage.warning('该方案配置不完整，无法应用。目前缺少：'+missingTags.join('、'));
}
// 获取当前正在使用的所有标签名（用于外部排他）
const currentlyUsingLabels = [];
@ -902,11 +899,7 @@ export default {
.some(g => g.configs.some(c => this.usingConfigIds.includes(c.id)));
if (isAnyCheckedConfigUsing || isAnyCheckedGroupUsing) {
return ElMessageBox.alert(
'选中的项目中包含“正在应用”的配置，请先取消应用后再执行删除操作。',
'无法执行删除',
{ type: 'error', confirmButtonText: '我知道了' }
);
return ElMessage.warning('选中的项目中包含“正在应用”的配置，请先取消应用后再执行删除操作。');
}
// 3. 最小保留数判断 (针对方案组)
@ -1144,9 +1137,11 @@ export default {
.form-group select, .form-group input[type="number"] {
flex: 1;
padding: 5px;
border: 1px solid #e2e8f0;
border: none;
border-radius: 4px;
width: 100px;
box-shadow: 0 0 0 2px #EBF0FF;
outline: none;
}
.slider-wrapper {
@ -1178,14 +1173,11 @@ export default {
.val-text-black {
color: #000;
font-weight: bold;
font-size: 13px;
min-width: 35px;
}
.color-picker-border {
padding: 3px;
border: 1px solid #e2e8f0;
border-radius: 4px;
display: flex;
}
@ -1489,7 +1481,6 @@ export default {
<style>
.el-message-box__header {
text-align: left !important;
padding-top: 15px !important;
}
.el-message-box__title {
@ -1502,4 +1493,5 @@ export default {
background-color: #1559f3 !important;
border-color: #1559f3 !important;
}
</style>

18
vue/src/system/KGData.vue
View File

@ -656,8 +656,8 @@ onMounted(() => {
.folder-tab-item { padding: 8px 20px; font-size: 12px; color: #86909c; cursor: pointer; background-color: #ecf2ff; border: 1px solid #dcdfe6; border-bottom: none; border-radius: 8px 8px 0 0; }
.folder-tab-item.active { background-color: #f1f6ff !important; color: #2869ff; font-weight: bold; border: 2px solid #6896ff; border-bottom: 2px solid #ffffff; margin-bottom: -1px; z-index: 3; }
.data-card-container { background: #ffffff; border-radius: 30px; padding: 20px 20px; box-shadow: 2px -1px 14px 4px #E1EAFF; border: 1px solid #eff4ff; position: relative; z-index: 4; }
.filter-bar { display: flex; justify-content: flex-end; align-items: center; margin-bottom: 20px; }
.filter-inputs { display: flex; gap: 35px; flex-wrap: nowrap;margin-right: 20px; }
.filter-bar { display: flex; justify-content: flex-end; align-items: center; margin-bottom: 20px;gap: 20px }
.filter-inputs { display: flex; gap: 35px; flex-wrap: nowrap;}
.input-group-inline { display: flex; align-items: center; gap: 12px; flex-shrink: 0; white-space: nowrap; }
.filter-label-text { font-size: 14px; color: #165dff; font-weight: 600; flex-shrink: 0; }
.search-input,.input-group-inline :deep(.el-input) { width: 200px !important;box-shadow: 0 0 0 2px #EBF0FF;border: none;border-radius: 5px; }
@ -817,18 +817,7 @@ onMounted(() => {
min-height: 300px;
}
.filter-bar {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 30px;
}
.filter-inputs {
display: flex;
gap: 35px;
flex-wrap: nowrap;
}
.input-group-inline {
display: flex;
@ -845,9 +834,6 @@ onMounted(() => {
flex-shrink: 0;
}
.search-input, .search-select {
width: 160px !important;
}
.btn-search-ref {
background: #165dff !important;

Write Preview
Loading…
Cancel
Save