chore(docs): cleanup layouting example
This commit is contained in:
@@ -1,5 +1,5 @@
|
|||||||
<script setup>
|
<script setup>
|
||||||
import { computed, ref, toRef, watch } from 'vue'
|
import { computed, nextTick, ref, toRef, watch } from 'vue'
|
||||||
import { BaseEdge, EdgeLabelRenderer, Position, getSmoothStepPath, useNodesData } from '@vue-flow/core'
|
import { BaseEdge, EdgeLabelRenderer, Position, getSmoothStepPath, useNodesData } from '@vue-flow/core'
|
||||||
import { TransitionPresets, executeTransition } from '@vueuse/core'
|
import { TransitionPresets, executeTransition } from '@vueuse/core'
|
||||||
|
|
||||||
@@ -94,9 +94,11 @@ watch(isFinished, async (isFinished) => {
|
|||||||
if (isFinished) {
|
if (isFinished) {
|
||||||
await runAnimation()
|
await runAnimation()
|
||||||
|
|
||||||
edgePoint.value = 0
|
nextTick(() => {
|
||||||
currentLength.value = 0
|
edgePoint.value = 0
|
||||||
labelPosition.value = { x: 0, y: 0 }
|
currentLength.value = 0
|
||||||
|
labelPosition.value = { x: 0, y: 0 }
|
||||||
|
})
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
@@ -107,7 +109,9 @@ async function runAnimation() {
|
|||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
isAnimating.value = true
|
nextTick(() => {
|
||||||
|
isAnimating.value = true
|
||||||
|
})
|
||||||
|
|
||||||
const totalLength = pathEl.getTotalLength()
|
const totalLength = pathEl.getTotalLength()
|
||||||
|
|
||||||
|
|||||||
@@ -77,7 +77,7 @@ const processLabel = toRef(() => {
|
|||||||
<Handle v-if="!isSender" type="target" :position="targetPosition" />
|
<Handle v-if="!isSender" type="target" :position="targetPosition" />
|
||||||
<Handle v-if="!isReceiver" type="source" :position="sourcePosition" />
|
<Handle v-if="!isReceiver" type="source" :position="sourcePosition" />
|
||||||
|
|
||||||
<div v-if="data.isRunning" class="spinner" />
|
<div v-if="!isSender && data.isRunning" class="spinner" />
|
||||||
<span v-else>
|
<span v-else>
|
||||||
{{ processLabel }}
|
{{ processLabel }}
|
||||||
</span>
|
</span>
|
||||||
|
|||||||
@@ -37,7 +37,7 @@ export function useRunProcess(dagreGraph) {
|
|||||||
// Randomly decide whether the node will throw an error
|
// Randomly decide whether the node will throw an error
|
||||||
const willThrowError = Math.random() < 0.15
|
const willThrowError = Math.random() < 0.15
|
||||||
|
|
||||||
if (willThrowError) {
|
if (!isStart && willThrowError) {
|
||||||
updateNodeData(node.id, { isRunning: false, hasError: true })
|
updateNodeData(node.id, { isRunning: false, hasError: true })
|
||||||
|
|
||||||
await skipDescendants(node.id)
|
await skipDescendants(node.id)
|
||||||
|
|||||||
Reference in New Issue
Block a user