双击连线
This commit is contained in:
@@ -8,7 +8,7 @@
|
|||||||
:prevent-scrolling="true" :fit-view="true" :min-zoom="1" :max-zoom="1"
|
:prevent-scrolling="true" :fit-view="true" :min-zoom="1" :max-zoom="1"
|
||||||
:nodesConnectable="checkStore.nodesConnectable" :elements-selectable="false" auto-connect
|
:nodesConnectable="checkStore.nodesConnectable" :elements-selectable="false" auto-connect
|
||||||
@connect="handleConnect" @connect-start="handleConnectStart" @connect-end="handleConnectEnd"
|
@connect="handleConnect" @connect-start="handleConnectStart" @connect-end="handleConnectEnd"
|
||||||
@pane-ready="onPaneReady" v-on:pane-mouse-move="false"></VueFlow>
|
@pane-ready="onPaneReady" @node-double-click="handleNodeDoubleClick" v-on:pane-mouse-move="false"></VueFlow>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- 底部操作按钮 -->
|
<!-- 底部操作按钮 -->
|
||||||
@@ -74,6 +74,138 @@ const { edges, setViewport } = useVueFlow({
|
|||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
||||||
|
const handleNodeDoubleClick = (event: any) => {
|
||||||
|
const { node } = event
|
||||||
|
|
||||||
|
// 判断节点类型
|
||||||
|
if (node.type === 'input') {
|
||||||
|
// 被检通道节点,检查是否已经连接
|
||||||
|
const isConnected = edges.value.some(edge => edge.source === node.id)
|
||||||
|
|
||||||
|
if (isConnected) {
|
||||||
|
ElMessage.warning('该被检通道已经连接,不能重复连接')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
// 寻找未连接的标准通道节点(优先寻找未被连接的标准通道)
|
||||||
|
const targetNodes = nodes.value.filter(n => n.type === 'output')
|
||||||
|
|
||||||
|
// 首先尝试连接尚未被连接的标准通道
|
||||||
|
for (const targetNode of targetNodes) {
|
||||||
|
const isTargetConnected = edges.value.some(edge => edge.target === targetNode.id)
|
||||||
|
|
||||||
|
if (!isTargetConnected) {
|
||||||
|
// 检查是否已存在连接(虽然这里应该不会存在)
|
||||||
|
const isAlreadyConnected = edges.value.some(edge =>
|
||||||
|
edge.source === node.id && edge.target === targetNode.id
|
||||||
|
)
|
||||||
|
|
||||||
|
if (!isAlreadyConnected) {
|
||||||
|
const newEdge = {
|
||||||
|
id: `edge-${node.id}-${targetNode.id}`,
|
||||||
|
source: node.id,
|
||||||
|
target: targetNode.id,
|
||||||
|
type: 'default'
|
||||||
|
}
|
||||||
|
edges.value.push(newEdge)
|
||||||
|
return
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 如果所有标准通道都已被连接,尝试连接已被连接但连接的是其他被检通道的标准通道
|
||||||
|
for (const targetNode of targetNodes) {
|
||||||
|
// 检查是否已存在连接
|
||||||
|
const isAlreadyConnected = edges.value.some(edge =>
|
||||||
|
edge.source === node.id && edge.target === targetNode.id
|
||||||
|
)
|
||||||
|
|
||||||
|
if (!isAlreadyConnected) {
|
||||||
|
const isTargetConnected = edges.value.some(edge => edge.target === targetNode.id)
|
||||||
|
|
||||||
|
// 如果标准通道已被连接,但不是连接到当前被检通道,则不能连接
|
||||||
|
if (isTargetConnected) {
|
||||||
|
continue
|
||||||
|
}
|
||||||
|
|
||||||
|
const newEdge = {
|
||||||
|
id: `edge-${node.id}-${targetNode.id}`,
|
||||||
|
source: node.id,
|
||||||
|
target: targetNode.id,
|
||||||
|
type: 'default'
|
||||||
|
}
|
||||||
|
edges.value.push(newEdge)
|
||||||
|
ElMessage.success(`已自动连接到 ${targetNode.data.label.children[1].children[0].children[0].replace('设备名称:', '')} 的标准通道`)
|
||||||
|
return
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
ElMessage.warning('没有可用的标准通道进行连接')
|
||||||
|
} else if (node.type === 'output') {
|
||||||
|
// 标准通道节点,检查是否已经连接
|
||||||
|
const isConnected = edges.value.some(edge => edge.target === node.id)
|
||||||
|
|
||||||
|
if (isConnected) {
|
||||||
|
ElMessage.warning('该标准通道已经连接,不能重复连接')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
// 寻找未连接的被检通道节点(优先寻找未被连接的被检通道)
|
||||||
|
const sourceNodes = nodes.value.filter(n => n.type === 'input')
|
||||||
|
|
||||||
|
// 首先尝试连接尚未被连接的被检通道
|
||||||
|
for (const sourceNode of sourceNodes) {
|
||||||
|
const isSourceConnected = edges.value.some(edge => edge.source === sourceNode.id)
|
||||||
|
|
||||||
|
if (!isSourceConnected) {
|
||||||
|
// 检查是否已存在连接(虽然这里应该不会存在)
|
||||||
|
const isAlreadyConnected = edges.value.some(edge =>
|
||||||
|
edge.source === sourceNode.id && edge.target === node.id
|
||||||
|
)
|
||||||
|
|
||||||
|
if (!isAlreadyConnected) {
|
||||||
|
const newEdge = {
|
||||||
|
id: `edge-${sourceNode.id}-${node.id}`,
|
||||||
|
source: sourceNode.id,
|
||||||
|
target: node.id,
|
||||||
|
type: 'default'
|
||||||
|
}
|
||||||
|
edges.value.push(newEdge)
|
||||||
|
return
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 如果所有被检通道都已被连接,尝试连接已被连接但连接的是其他标准通道的被检通道
|
||||||
|
for (const sourceNode of sourceNodes) {
|
||||||
|
// 检查是否已存在连接
|
||||||
|
const isAlreadyConnected = edges.value.some(edge =>
|
||||||
|
edge.source === sourceNode.id && edge.target === node.id
|
||||||
|
)
|
||||||
|
|
||||||
|
if (!isAlreadyConnected) {
|
||||||
|
const isSourceConnected = edges.value.some(edge => edge.source === sourceNode.id)
|
||||||
|
|
||||||
|
// 如果被检通道已被连接,但不是连接到当前标准通道,则不能连接
|
||||||
|
if (isSourceConnected) {
|
||||||
|
continue
|
||||||
|
}
|
||||||
|
|
||||||
|
const newEdge = {
|
||||||
|
id: `edge-${sourceNode.id}-${node.id}`,
|
||||||
|
source: sourceNode.id,
|
||||||
|
target: node.id,
|
||||||
|
type: 'default'
|
||||||
|
}
|
||||||
|
edges.value.push(newEdge)
|
||||||
|
return
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
ElMessage.warning('没有可用的被检通道进行连接')
|
||||||
|
}
|
||||||
|
}
|
||||||
// 初始化时锁定画布位置
|
// 初始化时锁定画布位置
|
||||||
const onPaneReady = () => {
|
const onPaneReady = () => {
|
||||||
setViewport({ x: 0, y: 0, zoom: 1 })
|
setViewport({ x: 0, y: 0, zoom: 1 })
|
||||||
@@ -207,11 +339,13 @@ const handleConnect = (params: any) => {
|
|||||||
// 删除不合法连接
|
// 删除不合法连接
|
||||||
const removeEdge = (params: any) => {
|
const removeEdge = (params: any) => {
|
||||||
console.log('删除不合法连接:', params);
|
console.log('删除不合法连接:', params);
|
||||||
const edgeIndex = edges.value.findIndex(edge => edge.source === params.source && edge.target === params.target)
|
|
||||||
console.log('删除连接信息:', edges.value);
|
console.log('删除连接信息:', edges.value);
|
||||||
if (edgeIndex !== -1) {
|
const edgeIndex = edges.value.findIndex(edge => edge.source === params.source && edge.target === params.target)
|
||||||
edges.value.splice(edgeIndex, 1)
|
console.log('删除连接索引:', edgeIndex);
|
||||||
}
|
if (edgeIndex !== -1) {
|
||||||
|
edges.value.splice(edgeIndex, 1)
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
const nodes = ref([])
|
const nodes = ref([])
|
||||||
|
|||||||
@@ -396,16 +396,22 @@ const open = async (sign: string, data: Monitor.ResPqMon, device: Device.ResPqDe
|
|||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
|
|
||||||
// 清空表单校验
|
// 清空PT和CT的临时变量
|
||||||
dialogFormRef.value?.clearValidate()
|
ptPrimary.value = ''
|
||||||
|
ptSecondary.value = ''
|
||||||
|
ctPrimary.value = ''
|
||||||
|
ctSecondary.value = ''
|
||||||
|
|
||||||
|
// 重置表单内容,但保留devId
|
||||||
|
const devId = formContent.value.devId
|
||||||
resetFormContent()
|
resetFormContent()
|
||||||
// 清空PT和CT的临时变量
|
formContent.value.devId = devId
|
||||||
ptPrimary.value = ''
|
|
||||||
ptSecondary.value = ''
|
|
||||||
ctPrimary.value = ''
|
|
||||||
ctSecondary.value = ''
|
|
||||||
originalNum.value = null
|
originalNum.value = null
|
||||||
|
|
||||||
|
// 使用nextTick确保DOM更新后再清除验证
|
||||||
|
setTimeout(() => {
|
||||||
|
dialogFormRef.value?.clearValidate()
|
||||||
|
}, 0)
|
||||||
// 设置默认选中第一个线路号
|
// 设置默认选中第一个线路号
|
||||||
if (lineNum.value.length > 0) {
|
if (lineNum.value.length > 0) {
|
||||||
formContent.value.num = lineNum.value[0].id
|
formContent.value.num = lineNum.value[0].id
|
||||||
|
|||||||
Reference in New Issue
Block a user