feat: 新增战报弹窗与舰队模拟器,重构UI组件

新增 BattleReportDialog、SpyReportDialog、NumberWithTooltip 等组件,完善舰队模拟器功能。重构并引入 Sheet、Sidebar、Tooltip、Skeleton 等 UI 组件,优化界面结构。实现 battle.worker 支持战斗计算,增加 universeStore、fleetStorageLogic 等核心逻辑,完善多语言与类型定义。
This commit is contained in:
谦君
2025-12-13 11:14:23 +08:00
parent 8637e50115
commit 731d79673b
160 changed files with 6302 additions and 1931 deletions

View File

@@ -0,0 +1,50 @@
<template>
<Popover>
<PopoverTrigger as-child>
<span class="cursor-pointer underline decoration-dotted underline-offset-4 touch-manipulation">{{ abbreviatedValue }}</span>
</PopoverTrigger>
<PopoverContent class="w-auto p-2" side="top" align="center">
<p class="font-mono text-sm">{{ formattedValue }}</p>
</PopoverContent>
</Popover>
</template>
<script setup lang="ts">
import { computed } from 'vue'
import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover'
const props = defineProps<{
value: number
}>()
// 完整格式化的数字(带千位分隔符)
const formattedValue = computed(() => {
return props.value.toLocaleString()
})
// 缩写格式的数字
const abbreviatedValue = computed(() => {
const num = props.value
// 小于1000直接显示
if (num < 1000) {
return num.toString()
}
// 1000 - 999,999: 使用 K (千)
if (num < 1000000) {
const k = num / 1000
return k % 1 === 0 ? `${k}K` : `${k.toFixed(1)}K`
}
// 1,000,000 - 999,999,999: 使用 M (百万)
if (num < 1000000000) {
const m = num / 1000000
return m % 1 === 0 ? `${m}M` : `${m.toFixed(1)}M`
}
// 1,000,000,000+: 使用 B (十亿)
const b = num / 1000000000
return b % 1 === 0 ? `${b}B` : `${b.toFixed(1)}B`
})
</script>