Initial commit
This commit is contained in:
@@ -268,14 +268,14 @@ export default defineComponent({
|
|||||||
// X6 只能作为连线目标(入)
|
// X6 只能作为连线目标(入)
|
||||||
magnet: passive;
|
magnet: passive;
|
||||||
box-shadow: none;
|
box-shadow: none;
|
||||||
width: 20px;
|
width: 15px;
|
||||||
height: 20px;
|
height: 15px;
|
||||||
display: block;
|
display: block;
|
||||||
background: url('@/assets/icons/point.svg') center / 100% 100%;
|
background: url('@/assets/icons/point.svg') center / 100% 100%;
|
||||||
|
|
||||||
position: absolute;
|
position: absolute;
|
||||||
left: 5px;
|
left: 5px;
|
||||||
top: 10px;
|
top: 12px;
|
||||||
}
|
}
|
||||||
|
|
||||||
// 右侧出桩样式
|
// 右侧出桩样式
|
||||||
@@ -285,14 +285,14 @@ export default defineComponent({
|
|||||||
// X6 只能作为连线源(出)
|
// X6 只能作为连线源(出)
|
||||||
magnet: active;
|
magnet: active;
|
||||||
box-shadow: none;
|
box-shadow: none;
|
||||||
width: 20px;
|
width: 15px;
|
||||||
height: 20px;
|
height: 15px;
|
||||||
display: block;
|
display: block;
|
||||||
background: url('@/assets/icons/arrow-right.svg') center / 100% 100%;
|
background: url('@/assets/icons/point.svg') center / 100% 100%;
|
||||||
|
|
||||||
position: absolute;
|
position: absolute;
|
||||||
right: 5px;
|
right: 5px;
|
||||||
top: 10px;
|
top: 12px;
|
||||||
}
|
}
|
||||||
|
|
||||||
// 节点文本样式
|
// 节点文本样式
|
||||||
|
|||||||
@@ -6,6 +6,7 @@
|
|||||||
<div class="ks-model-builder-body">
|
<div class="ks-model-builder-body">
|
||||||
<div class="ks-model-builder-left">
|
<div class="ks-model-builder-left">
|
||||||
<TressCard
|
<TressCard
|
||||||
|
ref="treesCardRef"
|
||||||
@select-tree="handleSelectTree"
|
@select-tree="handleSelectTree"
|
||||||
/>
|
/>
|
||||||
<NodesCard
|
<NodesCard
|
||||||
@@ -107,7 +108,8 @@ export default defineComponent({
|
|||||||
const currentNodeGraph = ref<NodeGraph | null>(null);
|
const currentNodeGraph = ref<NodeGraph | null>(null);
|
||||||
const selectedModelNode = ref<Node<NodeProperties> | null>(null);
|
const selectedModelNode = ref<Node<NodeProperties> | null>(null);
|
||||||
const selectedNodeTaskElement = ref<GraphTaskElement | null>(null);
|
const selectedNodeTaskElement = ref<GraphTaskElement | null>(null);
|
||||||
const changed = ref<boolean>(false)
|
const changed = ref<boolean>(false);
|
||||||
|
const treesCardRef = ref<HTMLElement|null>(null);
|
||||||
|
|
||||||
const {
|
const {
|
||||||
handleGraphEvent,
|
handleGraphEvent,
|
||||||
@@ -238,28 +240,34 @@ export default defineComponent({
|
|||||||
|
|
||||||
const createElements = () => {
|
const createElements = () => {
|
||||||
nextTick(() => {
|
nextTick(() => {
|
||||||
graph.value?.clearCells();
|
try{
|
||||||
if (currentBehaviorTree.value?.graph && graph.value) {
|
graph.value?.clearCells();
|
||||||
if (currentBehaviorTree.value?.graph.nodes) {
|
} catch (e: any){
|
||||||
currentBehaviorTree.value?.graph.nodes.forEach(ele => {
|
console.error('clear cells error, cause:',e);
|
||||||
const node = createGraphTaskElement(ele as GraphTaskElement);
|
|
||||||
console.info('create node: ', ele);
|
|
||||||
// 将节点添加到画布
|
|
||||||
graph.value?.addNode(node as Node);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
if (currentBehaviorTree.value?.graph.edges) {
|
|
||||||
// 然后添加所有边,确保包含桩点信息
|
|
||||||
setTimeout(() => {
|
|
||||||
currentBehaviorTree.value?.graph.edges.forEach(edgeData => {
|
|
||||||
graph.value?.addEdge({
|
|
||||||
...edgeData,
|
|
||||||
...createLineOptions(),
|
|
||||||
});
|
|
||||||
});
|
|
||||||
}, 100); // 延迟一会儿,免得连线错位
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
setTimeout(()=> {
|
||||||
|
if (currentBehaviorTree.value?.graph && graph.value) {
|
||||||
|
if (currentBehaviorTree.value?.graph.nodes) {
|
||||||
|
currentBehaviorTree.value?.graph.nodes.forEach(ele => {
|
||||||
|
const node = createGraphTaskElement(ele as GraphTaskElement);
|
||||||
|
console.info('create node: ', ele);
|
||||||
|
// 将节点添加到画布
|
||||||
|
graph.value?.addNode(node as Node);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
if (currentBehaviorTree.value?.graph.edges) {
|
||||||
|
// 然后添加所有边,确保包含桩点信息
|
||||||
|
setTimeout(() => {
|
||||||
|
currentBehaviorTree.value?.graph.edges.forEach(edgeData => {
|
||||||
|
graph.value?.addEdge({
|
||||||
|
...edgeData,
|
||||||
|
...createLineOptions(),
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}, 100); // 延迟一会儿,免得连线错位
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}, 100)
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -352,6 +360,7 @@ export default defineComponent({
|
|||||||
}
|
}
|
||||||
res.then(r => {
|
res.then(r => {
|
||||||
if (r.code === 200) {
|
if (r.code === 200) {
|
||||||
|
treesCardRef.value?.refresh();
|
||||||
message.success(r.msg ?? '操作成功.');
|
message.success(r.msg ?? '操作成功.');
|
||||||
} else {
|
} else {
|
||||||
message.error(r.msg ?? '操作失败.');
|
message.error(r.msg ?? '操作失败.');
|
||||||
@@ -379,6 +388,7 @@ export default defineComponent({
|
|||||||
});
|
});
|
||||||
|
|
||||||
return {
|
return {
|
||||||
|
treesCardRef,
|
||||||
currentTreeEditing,
|
currentTreeEditing,
|
||||||
currentBehaviorTree,
|
currentBehaviorTree,
|
||||||
currentNodeGraph,
|
currentNodeGraph,
|
||||||
|
|||||||
@@ -107,11 +107,14 @@ export default defineComponent({
|
|||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const refresh = ()=> loadTress();
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
loadTress();
|
loadTress();
|
||||||
});
|
});
|
||||||
|
|
||||||
return {
|
return {
|
||||||
|
refresh,
|
||||||
totalTress,
|
totalTress,
|
||||||
substring,
|
substring,
|
||||||
activeKey,
|
activeKey,
|
||||||
|
|||||||
Reference in New Issue
Block a user