<script setup lang="ts">
import { computed } from 'vue';

import { $t } from '@vben/locales';

import { ElTag } from 'element-plus';

const props = defineProps<{ status: string }>();

const tagType = computed(() => {
  switch (props.status) {
    case 'completed':
      return 'success';
    case 'failed':
      return 'danger';
    case 'running':
      return 'primary';
    case 'waiting':
      return 'warning';
    case 'stopped':
      return 'info';
    default:
      return 'info';
  }
});

const label = computed(() => {
  const key = `ai-platform.workflowRuns.status.${props.status}`;
  const translated = $t(key);
  return translated === key ? props.status : translated;
});
</script>

<template>
  <ElTag :type="tagType" size="small">{{ label }}</ElTag>
</template>
