2022-12-04 18:17:36 +08:00
|
|
|
<template>
|
2023-01-09 14:30:49 +08:00
|
|
|
<el-tag :type="getType(status)" round effect="light">
|
2022-12-04 18:17:36 +08:00
|
|
|
{{ $t('commons.status.' + status) }}
|
2023-01-16 15:30:24 +08:00
|
|
|
<el-icon v-if="status === 'installing'" class="is-loading">
|
|
|
|
<Loading />
|
|
|
|
</el-icon>
|
2023-01-09 14:30:49 +08:00
|
|
|
</el-tag>
|
2022-12-04 18:17:36 +08:00
|
|
|
</template>
|
|
|
|
|
|
|
|
<script lang="ts" setup>
|
|
|
|
import { onMounted, ref } from 'vue';
|
|
|
|
|
|
|
|
const props = defineProps({
|
|
|
|
status: {
|
|
|
|
type: String,
|
|
|
|
default: 'runnning',
|
|
|
|
},
|
|
|
|
});
|
2022-12-08 19:07:32 +08:00
|
|
|
let status = ref('running');
|
2022-12-04 18:17:36 +08:00
|
|
|
|
2023-01-09 14:30:49 +08:00
|
|
|
const getType = (status: string) => {
|
2022-12-04 18:17:36 +08:00
|
|
|
switch (status) {
|
|
|
|
case 'running':
|
2023-01-09 14:30:49 +08:00
|
|
|
return 'success';
|
2022-12-04 18:17:36 +08:00
|
|
|
case 'error':
|
2023-01-09 14:30:49 +08:00
|
|
|
return 'danger';
|
|
|
|
case 'stopped':
|
2023-03-11 21:46:43 +08:00
|
|
|
return 'danger';
|
2022-12-04 18:17:36 +08:00
|
|
|
default:
|
|
|
|
return '';
|
|
|
|
}
|
|
|
|
};
|
|
|
|
|
|
|
|
onMounted(() => {
|
|
|
|
status.value = props.status.toLocaleLowerCase();
|
|
|
|
});
|
|
|
|
</script>
|