KennethCheng/llm_log_frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
minimax2.7
llm_log_frontend/index.html
kennethcheng 297e59e7a4 minimax m2.7生成
2026-04-26 02:16:36 +08:00

701 lines
17 KiB
HTML
Raw Permalink Blame History

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>LLM Log Dashboard</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet">
<style>
:root {
--color-primary: #6366f1;
--color-primary-hover: #4f46e5;
--color-primary-light: #eef2ff;
--color-success: #10b981;
--color-warning: #f59e0b;
--color-danger: #ef4444;
--color-surface: #ffffff;
--color-surface-elevated: #f8fafc;
--color-background: #f1f5f9;
--color-text-primary: #0f172a;
--color-text-secondary: #475569;
--color-text-tertiary: #94a3b8;
--color-border: #e2e8f0;
--radius-sm: 6px;
--radius-md: 10px;
--radius-lg: 16px;
--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
--shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
--font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
--font-mono: 'JetBrains Mono', 'Fira Code', Consolas, monospace;
--transition-fast: 150ms ease-out;
--transition-normal: 250ms ease-out;
--spacing-unit: 4px;
}
*, *::before, *::after {
box-sizing: border-box;
margin: 0;
padding: 0;
}
html {
font-size: 16px;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
body {
font-family: var(--font-sans);
background-color: var(--color-background);
color: var(--color-text-primary);
line-height: 1.6;
min-height: 100vh;
}
.navbar {
position: sticky;
top: 0;
z-index: 100;
background-color: var(--color-surface);
border-bottom: 1px solid var(--color-border);
padding: 0 24px;
height: 64px;
display: flex;
align-items: center;
justify-content: space-between;
box-shadow: var(--shadow-sm);
}
.navbar-brand {
display: flex;
align-items: center;
gap: 12px;
font-size: 18px;
font-weight: 600;
color: var(--color-text-primary);
text-decoration: none;
letter-spacing: -0.01em;
}
.navbar-brand svg {
color: var(--color-primary);
}
.navbar-meta {
display: flex;
align-items: center;
gap: 8px;
font-size: 13px;
color: var(--color-text-tertiary);
}
.container {
max-width: 1200px;
margin: 0 auto;
padding: 32px 24px;
}
.card {
background-color: var(--color-surface);
border-radius: var(--radius-lg);
box-shadow: var(--shadow-md);
border: 1px solid var(--color-border);
overflow: hidden;
transition: box-shadow var(--transition-normal), transform var(--transition-normal);
}
.card:hover {
box-shadow: var(--shadow-lg);
transform: translateY(-2px);
}
.card-header {
padding: 20px 24px;
border-bottom: 1px solid var(--color-border);
background-color: var(--color-surface-elevated);
}
.card-title {
font-size: 15px;
font-weight: 600;
color: var(--color-text-primary);
display: flex;
align-items: center;
gap: 8px;
}
.card-title svg {
color: var(--color-primary);
}
.card-body {
padding: 24px;
}
.log-entry {
margin-bottom: 32px;
}
.log-entry:last-child {
margin-bottom: 0;
}
.log-date {
font-size: 13px;
font-weight: 500;
color: var(--color-text-tertiary);
text-transform: uppercase;
letter-spacing: 0.05em;
margin-bottom: 16px;
display: flex;
align-items: center;
gap: 8px;
}
.log-date::before {
content: '';
display: inline-block;
width: 8px;
height: 8px;
background-color: var(--color-primary);
border-radius: 50%;
}
table {
width: 100%;
border-collapse: collapse;
font-size: 14px;
}
thead {
background-color: var(--color-surface-elevated);
}
th {
text-align: left;
padding: 12px 16px;
font-weight: 600;
font-size: 12px;
text-transform: uppercase;
letter-spacing: 0.05em;
color: var(--color-text-secondary);
border-bottom: 2px solid var(--color-border);
}
td {
padding: 12px 16px;
border-bottom: 1px solid var(--color-border);
color: var(--color-text-primary);
transition: background-color var(--transition-fast);
}
tr:last-child td {
border-bottom: none;
}
tr:hover td {
background-color: var(--color-primary-light);
}
td:first-child, th:first-child {
border-left: none;
}
td:last-child, th:last-child {
border-right: none;
}
.table-highlight {
background-color: var(--color-primary-light) !important;
font-weight: 600;
}
.table-highlight td {
color: var(--color-primary);
}
code {
font-family: var(--font-mono);
font-size: 13px;
background-color: var(--color-surface-elevated);
padding: 2px 6px;
border-radius: var(--radius-sm);
color: var(--color-primary);
}
blockquote {
border-left: 4px solid var(--color-primary);
padding-left: 16px;
margin: 16px 0;
color: var(--color-text-secondary);
font-style: italic;
}
a {
color: var(--color-primary);
text-decoration: none;
transition: color var(--transition-fast);
}
a:hover {
color: var(--color-primary-hover);
text-decoration: underline;
}
@media (max-width: 768px) {
.container {
padding: 16px;
}
.card-body {
padding: 16px;
overflow-x: auto;
}
table {
font-size: 12px;
}
th, td {
padding: 8px 10px;
}
.navbar {
padding: 0 16px;
}
.navbar-meta {
display: none;
}
}
@media (prefers-reduced-motion: reduce) {
*, *::before, *::after {
animation-duration: 0.01ms !important;
animation-iteration-count: 1 !important;
transition-duration: 0.01ms !important;
}
}
</style>
</head>
<body>
<nav class="navbar" role="navigation" aria-label="Main navigation">
<a href="#" class="navbar-brand">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M12 2L2 7l10 5 10-5-10-5z"/>
<path d="M2 17l10 5 10-5"/>
<path d="M2 12l10 5 10-5"/>
</svg>
LLM Log Dashboard
</a>
<div class="navbar-meta">
<span id="last-updated"></span>
</div>
</nav>
<main class="container" id="main-content">
<div class="card">
<div class="card-header">
<h1 class="card-title">
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<rect x="3" y="3" width="18" height="18" rx="2" ry="2"/>
<line x1="3" y1="9" x2="21" y2="9"/>
<line x1="9" y1="21" x2="9" y2="9"/>
</svg>
日志记录
</h1>
</div>
<div class="card-body" id="log-content">
<section class="log-entry" aria-label="2026-04-26">
<div class="log-date">2026-04-26</div>
<table>
<thead>
<tr>
<th align="center">小时</th>
<th align="center">平均输入t/s</th>
<th align="center">平均输出t/s</th>
<th align="center">输入token总数</th>
<th align="center">输出token总数</th>
<th align="center">token总数</th>
</tr>
</thead>
<tbody><tr>
<td align="center">00</td>
<td align="center">216.04</td>
<td align="center">26.08</td>
<td align="center">115,105</td>
<td align="center">5,701</td>
<td align="center">120,806</td>
</tr>
<tr>
<td align="center">08</td>
<td align="center">300.02</td>
<td align="center">34.15</td>
<td align="center">96,329</td>
<td align="center">16,921</td>
<td align="center">113,250</td>
</tr>
<tr>
<td align="center">09</td>
<td align="center">190.30</td>
<td align="center">28.20</td>
<td align="center">19,066</td>
<td align="center">1,389</td>
<td align="center">20,455</td>
</tr>
<tr>
<td align="center">10</td>
<td align="center">58.32</td>
<td align="center">24.36</td>
<td align="center">538</td>
<td align="center">2,076</td>
<td align="center">2,614</td>
</tr>
<tr>
<td align="center">12</td>
<td align="center">166.90</td>
<td align="center">18.84</td>
<td align="center">45,509</td>
<td align="center">8,311</td>
<td align="center">53,820</td>
</tr>
<tr>
<td align="center">13</td>
<td align="center">52.57</td>
<td align="center">28.39</td>
<td align="center">39</td>
<td align="center">1,438</td>
<td align="center">1,477</td>
</tr>
<tr>
<td align="center">15</td>
<td align="center">245.35</td>
<td align="center">17.57</td>
<td align="center">54,168</td>
<td align="center">3,735</td>
<td align="center">57,903</td>
</tr>
<tr>
<td align="center">16</td>
<td align="center">259.63</td>
<td align="center">27.41</td>
<td align="center">69,957</td>
<td align="center">7,702</td>
<td align="center">77,659</td>
</tr>
<tr>
<td align="center">17</td>
<td align="center">304.44</td>
<td align="center">25.81</td>
<td align="center">44,088</td>
<td align="center">1,764</td>
<td align="center">45,852</td>
</tr>
<tr>
<td align="center">18</td>
<td align="center">233.83</td>
<td align="center">27.90</td>
<td align="center">206,821</td>
<td align="center">17,378</td>
<td align="center">224,199</td>
</tr>
<tr>
<td align="center">20</td>
<td align="center">374.10</td>
<td align="center">25.27</td>
<td align="center">30,747</td>
<td align="center">3,918</td>
<td align="center">34,665</td>
</tr>
<tr>
<td align="center">21</td>
<td align="center">237.74</td>
<td align="center">31.39</td>
<td align="center">1,516</td>
<td align="center">5,912</td>
<td align="center">7,428</td>
</tr>
<tr>
<td align="center">23</td>
<td align="center">283.86</td>
<td align="center">25.43</td>
<td align="center">39,894</td>
<td align="center">1,999</td>
<td align="center">41,893</td>
</tr>
<tr>
<td align="center"><strong>全天</strong></td>
<td align="center"><strong>233.31</strong></td>
<td align="center"><strong>26.56</strong></td>
<td align="center"><strong>723,777</strong></td>
<td align="center"><strong>78,244</strong></td>
<td align="center"><strong>802,021</strong></td>
</tr>
</tbody></table>
<table>
<thead>
<tr>
<th align="left">厂商</th>
<th align="left">模型</th>
<th align="center">输入费用 (元)</th>
<th align="center">输出费用 (元)</th>
<th align="center">总费用 (元)</th>
</tr>
</thead>
<tbody><tr>
<td align="left">🚀 DeepSeek</td>
<td align="left">DeepSeek-V4-Flash</td>
<td align="center">0.72</td>
<td align="center">0.16</td>
<td align="center"><strong>0.88</strong></td>
</tr>
<tr>
<td align="left">🚀 DeepSeek</td>
<td align="left">DeepSeek-V4-Pro</td>
<td align="center">8.69</td>
<td align="center">1.88</td>
<td align="center"><strong>10.57</strong></td>
</tr>
<tr>
<td align="left">☁️ 千问 (Qwen)</td>
<td align="left">Qwen3.6-Plus</td>
<td align="center">1.45</td>
<td align="center">0.94</td>
<td align="center"><strong>2.39</strong></td>
</tr>
<tr>
<td align="left">🌐 MiniMax</td>
<td align="left">MiniMax-M2.7</td>
<td align="center">1.52</td>
<td align="center">0.66</td>
<td align="center"><strong>2.18</strong></td>
</tr>
<tr>
<td align="left">🌐 MiniMax</td>
<td align="left">MiniMax-M2.7-highspeed</td>
<td align="center">3.04</td>
<td align="center">1.31</td>
<td align="center"><strong>4.35</strong></td>
</tr>
<tr>
<td align="left">🤖 智谱 (GLM)</td>
<td align="left">GLM-5.1</td>
<td align="center">4.34</td>
<td align="center">1.88</td>
<td align="center"><strong>6.22</strong></td>
</tr>
<tr>
<td align="left">🏠 小米 (MiMo)</td>
<td align="left">MiMo-V2-Pro (256K 档)</td>
<td align="center">2.03</td>
<td align="center">1.10</td>
<td align="center"><strong>3.13</strong></td>
</tr>
</tbody></table>
</section>
<section class="log-entry" aria-label="2026-04-26 - 副本">
<div class="log-date">2026-04-26 - 副本</div>
<table>
<thead>
<tr>
<th align="center">小时</th>
<th align="center">平均输入t/s</th>
<th align="center">平均输出t/s</th>
<th align="center">输入token总数</th>
<th align="center">输出token总数</th>
<th align="center">token总数</th>
</tr>
</thead>
<tbody><tr>
<td align="center">00</td>
<td align="center">216.04</td>
<td align="center">26.08</td>
<td align="center">115,105</td>
<td align="center">5,701</td>
<td align="center">120,806</td>
</tr>
<tr>
<td align="center">08</td>
<td align="center">300.02</td>
<td align="center">34.15</td>
<td align="center">96,329</td>
<td align="center">16,921</td>
<td align="center">113,250</td>
</tr>
<tr>
<td align="center">09</td>
<td align="center">190.30</td>
<td align="center">28.20</td>
<td align="center">19,066</td>
<td align="center">1,389</td>
<td align="center">20,455</td>
</tr>
<tr>
<td align="center">10</td>
<td align="center">58.32</td>
<td align="center">24.36</td>
<td align="center">538</td>
<td align="center">2,076</td>
<td align="center">2,614</td>
</tr>
<tr>
<td align="center">12</td>
<td align="center">166.90</td>
<td align="center">18.84</td>
<td align="center">45,509</td>
<td align="center">8,311</td>
<td align="center">53,820</td>
</tr>
<tr>
<td align="center">13</td>
<td align="center">52.57</td>
<td align="center">28.39</td>
<td align="center">39</td>
<td align="center">1,438</td>
<td align="center">1,477</td>
</tr>
<tr>
<td align="center">15</td>
<td align="center">245.35</td>
<td align="center">17.57</td>
<td align="center">54,168</td>
<td align="center">3,735</td>
<td align="center">57,903</td>
</tr>
<tr>
<td align="center">16</td>
<td align="center">259.63</td>
<td align="center">27.41</td>
<td align="center">69,957</td>
<td align="center">7,702</td>
<td align="center">77,659</td>
</tr>
<tr>
<td align="center">17</td>
<td align="center">304.44</td>
<td align="center">25.81</td>
<td align="center">44,088</td>
<td align="center">1,764</td>
<td align="center">45,852</td>
</tr>
<tr>
<td align="center">18</td>
<td align="center">233.83</td>
<td align="center">27.90</td>
<td align="center">206,821</td>
<td align="center">17,378</td>
<td align="center">224,199</td>
</tr>
<tr>
<td align="center">20</td>
<td align="center">374.10</td>
<td align="center">25.27</td>
<td align="center">30,747</td>
<td align="center">3,918</td>
<td align="center">34,665</td>
</tr>
<tr>
<td align="center">21</td>
<td align="center">237.74</td>
<td align="center">31.39</td>
<td align="center">1,516</td>
<td align="center">5,912</td>
<td align="center">7,428</td>
</tr>
<tr>
<td align="center">23</td>
<td align="center">283.86</td>
<td align="center">25.43</td>
<td align="center">39,894</td>
<td align="center">1,999</td>
<td align="center">41,893</td>
</tr>
<tr>
<td align="center"><strong>全天</strong></td>
<td align="center"><strong>233.31</strong></td>
<td align="center"><strong>26.56</strong></td>
<td align="center"><strong>723,777</strong></td>
<td align="center"><strong>78,244</strong></td>
<td align="center"><strong>802,021</strong></td>
</tr>
</tbody></table>
<table>
<thead>
<tr>
<th align="left">厂商</th>
<th align="left">模型</th>
<th align="center">输入费用 (元)</th>
<th align="center">输出费用 (元)</th>
<th align="center">总费用 (元)</th>
</tr>
</thead>
<tbody><tr>
<td align="left">🚀 DeepSeek</td>
<td align="left">DeepSeek-V4-Flash</td>
<td align="center">0.72</td>
<td align="center">0.16</td>
<td align="center"><strong>0.88</strong></td>
</tr>
<tr>
<td align="left">🚀 DeepSeek</td>
<td align="left">DeepSeek-V4-Pro</td>
<td align="center">8.69</td>
<td align="center">1.88</td>
<td align="center"><strong>10.57</strong></td>
</tr>
<tr>
<td align="left">☁️ 千问 (Qwen)</td>
<td align="left">Qwen3.6-Plus</td>
<td align="center">1.45</td>
<td align="center">0.94</td>
<td align="center"><strong>2.39</strong></td>
</tr>
<tr>
<td align="left">🌐 MiniMax</td>
<td align="left">MiniMax-M2.7</td>
<td align="center">1.52</td>
<td align="center">0.66</td>
<td align="center"><strong>2.18</strong></td>
</tr>
<tr>
<td align="left">🌐 MiniMax</td>
<td align="left">MiniMax-M2.7-highspeed</td>
<td align="center">3.04</td>
<td align="center">1.31</td>
<td align="center"><strong>4.35</strong></td>
</tr>
<tr>
<td align="left">🤖 智谱 (GLM)</td>
<td align="left">GLM-5.1</td>
<td align="center">4.34</td>
<td align="center">1.88</td>
<td align="center"><strong>6.22</strong></td>
</tr>
<tr>
<td align="left">🏠 小米 (MiMo)</td>
<td align="left">MiMo-V2-Pro (256K 档)</td>
<td align="center">2.03</td>
<td align="center">1.10</td>
<td align="center"><strong>3.13</strong></td>
</tr>
</tbody></table>
</section>
</div>
</div>
</main>
<script>
document.getElementById('last-updated').textContent = new Date().toLocaleString('zh-CN');
</script>
</body>
</html>
Reference in New Issue View Git Blame Copy Permalink