31 lines
767 B
Vue
31 lines
767 B
Vue
|
<script setup lang="ts">
|
||
|
|
import { LoadingOutlined } from "@ant-design/icons-vue";
|
||
|
|
import { computed } from "vue";
|
||
|
|
|
||
|
|
import { getGenerateStatusMeta } from "@/lib/display";
|
||
|
|
|
||
|
|
const props = defineProps<{
|
||
|
|
status?: string | null;
|
||
|
|
}>();
|
||
|
|
|
||
|
|
const statusMeta = computed(() => getGenerateStatusMeta(props.status));
|
||
|
|
const isLoading = computed(() => props.status === "queued" || props.status === "generating" || props.status === "running");
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<template>
|
||
|
|
<a-tag :color="statusMeta.color">
|
||
|
|
<span class="article-generate-status">
|
||
|
|
<LoadingOutlined v-if="isLoading" spin />
|
||
|
|
<span>{{ statusMeta.label }}</span>
|
||
|
|
</span>
|
||
|
|
</a-tag>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<style scoped>
|
||
|
|
.article-generate-status {
|
||
|
|
display: inline-flex;
|
||
|
|
align-items: center;
|
||
|
|
gap: 6px;
|
||
|
|
}
|
||
|
|
</style>
|