351c861777
- Migrate source to packages/client and packages/server directories - Namespace all Hermes-specific code under hermes/ subdirectories (api/hermes/, components/hermes/, views/hermes/, stores/hermes/) - Add hermes.* route names and /hermes/* path prefixes - Upgrade @koa/router to v15, adapt path-to-regexp v8 syntax - Fix proxy path rewriting: /api/hermes/v1/* → /v1/*, /api/hermes/* → /api/* - Fix frontend API paths to match backend /api/hermes/* routes - Fix WebSocket terminal path to /api/hermes/terminal - Add proxyMiddleware for reliable unmatched route proxying - Add profiles route module and hermes-cli profile commands - Update CLAUDE.md development guide with new architecture - Add Chinese README (README_zh.md) - Add Web Terminal feature to README Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
77 lines
1.7 KiB
Vue
77 lines
1.7 KiB
Vue
<script setup lang="ts">
|
|
import { NButton } from 'naive-ui'
|
|
import { onMounted } from 'vue'
|
|
import { useI18n } from 'vue-i18n'
|
|
import { useUsageStore } from '@/stores/hermes/usage'
|
|
import StatCards from '@/components/hermes/usage/StatCards.vue'
|
|
import ModelBreakdown from '@/components/hermes/usage/ModelBreakdown.vue'
|
|
import DailyTrend from '@/components/hermes/usage/DailyTrend.vue'
|
|
|
|
const { t } = useI18n()
|
|
const usageStore = useUsageStore()
|
|
|
|
onMounted(() => {
|
|
usageStore.loadSessions()
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<div class="usage-view">
|
|
<header class="page-header">
|
|
<h2 class="header-title">{{ t('usage.title') }}</h2>
|
|
<NButton size="small" quaternary :loading="usageStore.isLoading" @click="usageStore.loadSessions()">
|
|
{{ t('usage.refresh') }}
|
|
</NButton>
|
|
</header>
|
|
|
|
<div class="usage-content">
|
|
<div v-if="usageStore.isLoading && usageStore.sessions.length === 0" class="usage-loading">
|
|
{{ t('common.loading') }}
|
|
</div>
|
|
|
|
<template v-else-if="usageStore.sessions.length > 0">
|
|
<StatCards />
|
|
<ModelBreakdown />
|
|
<DailyTrend />
|
|
</template>
|
|
|
|
<div v-else class="usage-empty">
|
|
{{ t('usage.noData') }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped lang="scss">
|
|
@use '@/styles/variables' as *;
|
|
|
|
.usage-view {
|
|
height: 100%;
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.usage-content {
|
|
flex: 1;
|
|
overflow-y: auto;
|
|
padding: 20px;
|
|
max-width: 960px;
|
|
margin: 0 auto;
|
|
width: 100%;
|
|
scrollbar-width: none;
|
|
-ms-overflow-style: none;
|
|
|
|
&::-webkit-scrollbar {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
.usage-loading,
|
|
.usage-empty {
|
|
text-align: center;
|
|
padding: 60px 0;
|
|
color: $text-muted;
|
|
font-size: 14px;
|
|
}
|
|
</style>
|