63 lines
1.3 KiB
TypeScript
63 lines
1.3 KiB
TypeScript
import type { FunctionalComponent } from 'vue'
|
|
import BaseEdge from './BaseEdge'
|
|
import type { EdgeProps } from '~/types'
|
|
|
|
const StraightEdge: FunctionalComponent<EdgeProps> = function ({
|
|
label,
|
|
labelStyle = {},
|
|
labelShowBg = true,
|
|
labelBgStyle = {},
|
|
labelBgPadding,
|
|
labelBgBorderRadius,
|
|
sourceY,
|
|
sourceX,
|
|
targetX,
|
|
targetY,
|
|
markerEnd,
|
|
markerStart,
|
|
style,
|
|
}) {
|
|
const centerY = computed(() => {
|
|
const yOffset = Math.abs(targetY - sourceY) / 2
|
|
return targetY < sourceY ? targetY + yOffset : targetY - yOffset
|
|
})
|
|
const centerX = computed(() => {
|
|
const xOffset = Math.abs(targetX - sourceX) / 2
|
|
return targetX < sourceX ? targetX + xOffset : targetX - xOffset
|
|
})
|
|
|
|
return h(BaseEdge, {
|
|
path: `M ${sourceX},${sourceY}L ${targetX},${targetY}`,
|
|
centerX: centerX.value,
|
|
centerY: centerY.value,
|
|
label,
|
|
labelStyle,
|
|
labelShowBg,
|
|
labelBgStyle,
|
|
labelBgPadding,
|
|
labelBgBorderRadius,
|
|
style,
|
|
markerEnd,
|
|
markerStart,
|
|
})
|
|
}
|
|
|
|
StraightEdge.props = [
|
|
'label',
|
|
'labelStyle',
|
|
'labelShowBg',
|
|
'labelBgStyle',
|
|
'labelBgPadding',
|
|
'labelBgBorderRadius',
|
|
'sourceY',
|
|
'sourceX',
|
|
'targetX',
|
|
'targetY',
|
|
'markerEnd',
|
|
'markerStart',
|
|
'style',
|
|
]
|
|
StraightEdge.inheritAttrs = false
|
|
|
|
export default StraightEdge
|