<template>
  <div class="page-content">
    <div class="mb-5 flex items-center justify-between gap-4">
      <div>
        <h2 class="text-xl font-semibold">运行概览</h2>
        <p class="text-g-500 mt-1 text-sm">平台实时运行状态与近 24 小时用量</p>
      </div>
      <ElButton :loading="loading" @click="load">刷新</ElButton>
    </div>

    <div class="mb-5 grid grid-cols-2 gap-4 lg:grid-cols-4">
      <ElCard shadow="never">
        <div class="text-g-500 text-sm">启用供应商</div>
        <b class="mt-2 block text-2xl">{{ info.enabled_providers ?? '—' }}</b>
      </ElCard>
      <ElCard shadow="never">
        <div class="text-g-500 text-sm">启用模型</div>
        <b class="mt-2 block text-2xl">{{ info.enabled_models ?? '—' }}</b>
      </ElCard>
      <ElCard shadow="never">
        <div class="text-g-500 text-sm">启用 API Key</div>
        <b class="mt-2 block text-2xl">{{ info.enabled_api_keys ?? '—' }}</b>
      </ElCard>
      <ElCard shadow="never">
        <div class="text-g-500 text-sm">运行时长</div>
        <b class="mt-2 block text-2xl">{{ uptimeText }}</b>
      </ElCard>
    </div>

    <div class="mb-5 grid grid-cols-2 gap-4 lg:grid-cols-4">
      <ElCard shadow="never">
        <div class="text-g-500 text-sm">24h 请求</div>
        <b class="mt-2 block text-2xl">{{ overview.requests ?? 0 }}</b>
      </ElCard>
      <ElCard shadow="never">
        <div class="text-g-500 text-sm">24h 失败</div>
        <b class="mt-2 block text-2xl text-red-500">{{ overview.failed_requests ?? 0 }}</b>
      </ElCard>
      <ElCard shadow="never">
        <div class="text-g-500 text-sm">24h Tokens</div>
        <b class="mt-2 block text-2xl">{{ ((overview.prompt_tokens ?? 0) + (overview.completion_tokens ?? 0)).toLocaleString() }}</b>
      </ElCard>
      <ElCard shadow="never">
        <div class="text-g-500 text-sm">平均延迟</div>
        <b class="mt-2 block text-2xl">{{ overview.avg_latency_ms != null ? overview.avg_latency_ms.toFixed(1) + ' ms' : '—' }}</b>
      </ElCard>
    </div>

    <ElDescriptions :column="3" border>
      <ElDescriptionsItem label="版本">{{ info.version }}</ElDescriptionsItem>
      <ElDescriptionsItem label="Go">{{ info.go_version }}</ElDescriptionsItem>
      <ElDescriptionsItem label="License">{{ license.edition_name || '社区版 Free' }}</ElDescriptionsItem>
      <ElDescriptionsItem label="数据库">{{ info.database }}</ElDescriptionsItem>
      <ElDescriptionsItem label="对象存储">{{ info.object_storage ? '已启用' : '未启用' }}</ElDescriptionsItem>
      <ElDescriptionsItem label="统计窗口">{{ overview.window }}</ElDescriptionsItem>
    </ElDescriptions>
  </div>
</template>

<script setup lang="ts">
  import request from '@/utils/http'

  const loading = ref(false)
  const info = ref<Record<string, any>>({})
  const overview = ref<Record<string, any>>({})
  const license = ref<Record<string, any>>({})

  // license API 可能因权限不存在而失败,保持默认值
  

  const uptimeText = computed(() => {
    const seconds = info.value.uptime_seconds || 0
    const days = Math.floor(seconds / 86400)
    const hours = Math.floor((seconds % 86400) / 3600)
    const minutes = Math.floor((seconds % 3600) / 60)
    return days > 0 ? `${days} 天 ${hours} 小时` : `${hours} 小时 ${minutes} 分`
  })

  async function load() {
    loading.value = true
    try {
      const [system, monitor, lic] = await Promise.all([
        request.get<any>({ url: '/api/v1/admin/system-info' }),
        request.get<any>({ url: '/api/v1/admin/monitoring/overview' }),
        request.get<any>({ url: '/api/v1/admin/license' }).catch(() => ({}))
      ])
      info.value = system
      overview.value = monitor
      license.value = lic
    } finally {
      loading.value = false
    }
  }

  onMounted(load)
</script>
