<script setup lang="ts" name="PreviewNode">
import { type Ref, inject } from 'vue'
import { Nodes } from './Nodes'
import nodesDefault from '../utils/nodesDefault' // 默认节点属性对象
import type { INodes, IPaths, IPoint, IState } from '../utils/INodes'

const props = defineProps<{
  node: INodes
}>()

const nodeRunList = inject('nodeRunList', [])

const {
  PreviewNodeStart,
  PreviewNodeEnd,
  PreviewNodeTask,
  PreviewNodeCondition,
  PreviewNodeGatewayExclusive,
  PreviewNodeGatewayParallel
} = Nodes

const NodesWidgets = {
  1: PreviewNodeStart,
  2: PreviewNodeEnd,
  3: PreviewNodeTask,
  4: PreviewNodeCondition,
  5: PreviewNodeGatewayExclusive,
  6: PreviewNodeGatewayParallel
}
</script>

<template>
  <component
    :is="NodesWidgets[props.node.nodeType]"
    :class="{
      'is-run': nodeRunList.some((item: any) => item.nodeCode === props.node.nodeCode)
    }"
    :node="props.node"
    :x="props.node.nodePath.position.x - nodesDefault[props.node.nodeType].size.width / 2"
    :y="props.node.nodePath.position.y - nodesDefault[props.node.nodeType].size.height / 2" />
</template>

<style lang="less" scoped>

.is-run {
  filter: drop-shadow(0 0 6px #ff0000);
}
</style>