<template>
	<JingrowUIBadge :size="size" :theme="_color">
		{{ label }}
		<template #prefix>
			<slot name="prefix"></slot>
		</template>
		<template #suffix>
			<slot name="suffix"></slot>
		</template>
	</JingrowUIBadge>
</template>

<script>
import { Badge as JingrowUIBadge } from 'jingrow-ui';

export default {
	name: 'Badge',
	props: ['label', 'theme', 'size'],
	components: {
		JingrowUIBadge,
	},
	computed: {
		_color() {
			if (this.theme) return this.theme;
			
			// 状态配置数组 - 每个配置包含英文、中文、颜色三个属性
			const statusConfigs = [
				// 服务器状态
				{ en: 'Pending', zh: '待处理', color: 'orange' },
				{ en: 'Starting', zh: '启动中', color: 'orange' },
				{ en: 'Running', zh: '运行中', color: 'green' },
				{ en: 'Stopping', zh: '停止中', color: 'orange' },
				{ en: 'Stopped', zh: '已停止', color: 'red' },
				{ en: 'Resetting', zh: '重置中', color: 'blue' },
				{ en: 'Upgrading', zh: '升级中', color: 'purple' },
				{ en: 'Disabled', zh: '已禁用', color: 'gray' },
				
				// 其他状态
				{ en: 'Approved', zh: '已批准', color: 'green' },
				{ en: 'Recovering', zh: '恢复中', color: 'orange' },
				{ en: 'Recovered', zh: '已恢复', color: 'blue' },
				{ en: 'Broken', zh: '损坏', color: 'red' },
				{ en: 'Installing', zh: '安装中', color: 'orange' },
				{ en: 'Failure', zh: '失败', color: 'red' },
				{ en: 'Fatal', zh: '致命错误', color: 'red' },
				{ en: 'Failed', zh: '失败', color: 'red' },
				{ en: 'Success', zh: '成功', color: 'green' },
				{ en: 'Completed', zh: '已完成', color: 'green' },
				{ en: 'Deployed', zh: '已部署', color: 'green' },
				{ en: 'Expired', zh: '已过期', color: 'red' },
				{ en: 'Paid', zh: '已支付', color: 'green' },
				{ en: 'Unpaid', zh: '未支付', color: 'orange' },
				{ en: 'Rejected', zh: '已拒绝', color: 'red' },
				{ en: 'Active', zh: '激活', color: 'green' },
				{ en: 'Trial', zh: '试用', color: 'orange' },
				{ en: 'Published', zh: '已发布', color: 'green' },
				{ en: 'Owner', zh: '所有者', color: 'blue' },
				{ en: 'Primary', zh: '主要', color: 'green' },
			];
			
			// 查找匹配的配置
			const config = statusConfigs.find(item => item.en === this.label || item.zh === this.label);
			return config ? config.color : 'gray';
		},
	},
};
</script>
