Newer
Older
smart-home-server / webclient-vue / src / features / devices / components / DeviceConnectionBadge.vue
@Eugene Sukhodolskiy Eugene Sukhodolskiy 1 day ago 508 bytes Add script detail pages with scope grouping
<template>
  <GnBadge :variant="variant">{{ label }}</GnBadge>
</template>

<script setup>
import { computed } from "vue";
import { GnBadge } from "gnexus-ui-kit/vue";

const props = defineProps({
  status: {
    type: String,
    default: "unknown",
  },
});

const label = computed(() => props.status || "unknown");
const variant = computed(() => {
  if (props.status === "active") {
    return "success";
  }

  if (props.status === "lost") {
    return "danger";
  }

  return "secondary";
});
</script>