SCADATrainSys/src/components/business/EasyProcess/node/operation_node.vue

<template>
  <div class="flex flex-row items-center gap-2">
    <Icon :icon="getIcon" :width="26" :height="26"></Icon>
    <div>{{ nodeData?.templateName || '常规操作' }}</div>
  </div>
</template>
<script setup lang="ts">
  import { Process } from '../common/process.type'

  const props = withDefaults(defineProps<{ node: Process.OperationNode }>(), {})
  const nodeData = ref<Record<string, unknown>>(props.node.nodeData || {})

  const roleIcon: string[] = ['role_default', 'role_substation', 'role_catenary', 'role_dispatch', 'role_isolator', 'role_supply']

  const getIcon = computed(() => {
    const role = nodeData.value?.role || 'role_default'
    if (roleIcon.some((item) => item === role)) {
      return `svg:${role}`
    }
    return 'svg:role_default'
  })
</script>