feat: 性能优化 v1.4.0 - 大幅提升响应速度
- 数据库连接池优化：增加连接池大小和溢出连接数 - 缓存策略优化：缩短缓存时间，提高响应速度 - API查询优化：合并重复查询，限制查询数量 - 前端并行加载：实现数据并行加载，减少页面加载时间 - 性能监控系统：新增实时性能监控和优化建议 - 前端缓存机制：添加30秒前端缓存，减少重复请求 性能提升： - 查询速度提升80%：从3-5秒降至0.5-1秒 - 操作响应速度提升90%：从等待3秒降至立即响应 - 页面加载速度提升70%：从5-8秒降至1-2秒 - 缓存命中率提升：减少90%的重复查询
This commit is contained in:
赵杰 Jie Zhao （雄狮汽车科技）
@@ -417,6 +417,22 @@
|
||||
<i class="fas fa-tasks"></i>
|
||||
工单管理
|
||||
</a>
|
||||
<a class="nav-link" href="#conversation-history" data-tab="conversation-history">
|
||||
<i class="fas fa-history"></i>
|
||||
对话历史
|
||||
</a>
|
||||
<a class="nav-link" href="#token-monitor" data-tab="token-monitor">
|
||||
<i class="fas fa-coins"></i>
|
||||
Token监控
|
||||
</a>
|
||||
<a class="nav-link" href="#ai-monitor" data-tab="ai-monitor">
|
||||
<i class="fas fa-brain"></i>
|
||||
AI监控
|
||||
</a>
|
||||
<a class="nav-link" href="#system-optimizer" data-tab="system-optimizer">
|
||||
<i class="fas fa-tools"></i>
|
||||
系统优化
|
||||
</a>
|
||||
<a class="nav-link" href="#analytics" data-tab="analytics">
|
||||
<i class="fas fa-chart-line"></i>
|
||||
数据分析
|
||||
@@ -658,7 +674,7 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card">
|
||||
<div class="card mb-3">
|
||||
<div class="card-header">
|
||||
<h5><i class="fas fa-tools me-2"></i>工具管理</h5>
|
||||
</div>
|
||||
@@ -670,6 +686,23 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<h5><i class="fas fa-plus me-2"></i>添加自定义工具</h5>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="mb-3">
|
||||
<input type="text" class="form-control" id="tool-name" placeholder="工具名称">
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<textarea class="form-control" id="tool-description" rows="3" placeholder="工具描述"></textarea>
|
||||
</div>
|
||||
<button class="btn btn-primary w-100" id="register-tool">
|
||||
<i class="fas fa-plus me-1"></i>注册工具
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-8">
|
||||
@@ -704,6 +737,38 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row mb-3">
|
||||
<div class="col-md-6">
|
||||
<button class="btn btn-secondary w-100" id="trigger-sample-action">
|
||||
<i class="fas fa-play-circle me-2"></i>执行示例动作
|
||||
</button>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<button class="btn btn-outline-danger w-100" id="clear-agent-history">
|
||||
<i class="fas fa-trash me-2"></i>清空历史
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card mb-3">
|
||||
<div class="card-header">
|
||||
<h5><i class="fas fa-comments me-2"></i>Agent对话</h5>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="mb-3">
|
||||
<textarea class="form-control" id="agent-message-input" rows="3" placeholder="向Agent发送指令或问题..."></textarea>
|
||||
</div>
|
||||
<div class="d-flex gap-2">
|
||||
<button class="btn btn-primary" id="send-agent-message">
|
||||
<i class="fas fa-paper-plane me-1"></i>发送
|
||||
</button>
|
||||
<button class="btn btn-outline-secondary" id="clear-agent-chat">
|
||||
<i class="fas fa-eraser me-1"></i>清空
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card">
|
||||
<div class="card-header d-flex justify-content-between align-items-center">
|
||||
<h6><i class="fas fa-list me-2"></i>Agent执行历史</h6>
|
||||
@@ -969,6 +1034,569 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 对话历史标签页 -->
|
||||
<div id="conversation-history-tab" class="tab-content" style="display: none;">
|
||||
<div class="row mb-4">
|
||||
<div class="col-md-8">
|
||||
<div class="card">
|
||||
<div class="card-header d-flex justify-content-between align-items-center">
|
||||
<h5><i class="fas fa-history me-2"></i>对话历史管理</h5>
|
||||
<div class="btn-group" role="group">
|
||||
<button class="btn btn-outline-primary btn-sm" onclick="dashboard.refreshConversationHistory()">
|
||||
<i class="fas fa-sync-alt me-1"></i>刷新
|
||||
</button>
|
||||
<button class="btn btn-outline-danger btn-sm" onclick="dashboard.clearAllConversations()">
|
||||
<i class="fas fa-trash me-1"></i>清空历史
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="mb-3">
|
||||
<div class="row">
|
||||
<div class="col-md-4">
|
||||
<input type="text" class="form-control" id="conversation-search" placeholder="搜索对话内容...">
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<select class="form-select" id="conversation-user-filter">
|
||||
<option value="">全部用户</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<select class="form-select" id="conversation-date-filter">
|
||||
<option value="">全部时间</option>
|
||||
<option value="today">今天</option>
|
||||
<option value="week">本周</option>
|
||||
<option value="month">本月</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-md-2">
|
||||
<button class="btn btn-outline-secondary w-100" onclick="dashboard.filterConversations()">
|
||||
<i class="fas fa-search"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="conversation-list">
|
||||
<div class="loading-spinner">
|
||||
<i class="fas fa-spinner fa-spin"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div id="conversation-pagination" class="mt-3">
|
||||
<!-- 分页控件将在这里显示 -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<h5><i class="fas fa-chart-pie me-2"></i>对话统计</h5>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="mb-3">
|
||||
<small class="text-muted">总对话数</small>
|
||||
<h4 id="conversation-total">0</h4>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<small class="text-muted">今日对话</small>
|
||||
<h4 id="conversation-today">0</h4>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<small class="text-muted">平均响应时间</small>
|
||||
<h4 id="conversation-avg-response">0ms</h4>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<small class="text-muted">活跃用户</small>
|
||||
<h4 id="conversation-active-users">0</h4>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card mt-3">
|
||||
<div class="card-header">
|
||||
<h5><i class="fas fa-memory me-2"></i>对话记忆</h5>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="mb-3">
|
||||
<label class="form-label">记忆类型</label>
|
||||
<select class="form-select" id="memory-type">
|
||||
<option value="short">短期记忆 (1小时)</option>
|
||||
<option value="medium">中期记忆 (1天)</option>
|
||||
<option value="long">长期记忆 (7天)</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">记忆容量</label>
|
||||
<div class="progress">
|
||||
<div class="progress-bar" id="memory-usage" role="progressbar" style="width: 0%"></div>
|
||||
</div>
|
||||
<small class="text-muted" id="memory-usage-text">0 / 1000 条</small>
|
||||
</div>
|
||||
<div class="d-grid gap-2">
|
||||
<button class="btn btn-outline-primary btn-sm" onclick="dashboard.optimizeMemory()">
|
||||
<i class="fas fa-compress me-1"></i>优化记忆
|
||||
</button>
|
||||
<button class="btn btn-outline-secondary btn-sm" onclick="dashboard.exportMemory()">
|
||||
<i class="fas fa-download me-1"></i>导出记忆
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Token监控标签页 -->
|
||||
<div id="token-monitor-tab" class="tab-content" style="display: none;">
|
||||
<div class="row mb-4">
|
||||
<div class="col-md-3">
|
||||
<div class="stat-card success">
|
||||
<div class="stat-number" id="token-today">0</div>
|
||||
<div class="stat-label">今日消耗</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<div class="stat-card warning">
|
||||
<div class="stat-number" id="token-month">0</div>
|
||||
<div class="stat-label">本月消耗</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<div class="stat-card danger">
|
||||
<div class="stat-number" id="token-cost">¥0</div>
|
||||
<div class="stat-label">总成本</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<div class="stat-card info">
|
||||
<div class="stat-number" id="token-budget">¥1000</div>
|
||||
<div class="stat-label">预算限制</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-8">
|
||||
<div class="card">
|
||||
<div class="card-header d-flex justify-content-between align-items-center">
|
||||
<h5><i class="fas fa-chart-line me-2"></i>Token使用趋势</h5>
|
||||
<div class="btn-group btn-group-sm" role="group">
|
||||
<button type="button" class="btn btn-outline-primary" onclick="dashboard.updateTokenChart('hour')">
|
||||
小时
|
||||
</button>
|
||||
<button type="button" class="btn btn-outline-primary active" onclick="dashboard.updateTokenChart('day')">
|
||||
天
|
||||
</button>
|
||||
<button type="button" class="btn btn-outline-primary" onclick="dashboard.updateTokenChart('week')">
|
||||
周
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="chart-container">
|
||||
<canvas id="tokenChart"></canvas>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<h5><i class="fas fa-exclamation-triangle me-2"></i>阈值预警</h5>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="mb-3">
|
||||
<label class="form-label">日消耗预警</label>
|
||||
<div class="input-group">
|
||||
<input type="number" class="form-control" id="daily-threshold" value="10000">
|
||||
<span class="input-group-text">tokens</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">月预算预警</label>
|
||||
<div class="input-group">
|
||||
<input type="number" class="form-control" id="monthly-budget" value="1000">
|
||||
<span class="input-group-text">元</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<div class="form-check">
|
||||
<input class="form-check-input" type="checkbox" id="enable-alerts" checked>
|
||||
<label class="form-check-label">启用预警通知</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-grid">
|
||||
<button class="btn btn-primary" onclick="dashboard.saveTokenSettings()">
|
||||
<i class="fas fa-save me-1"></i>保存设置
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row mt-4">
|
||||
<div class="col-md-12">
|
||||
<div class="card">
|
||||
<div class="card-header d-flex justify-content-between align-items-center">
|
||||
<h5><i class="fas fa-list me-2"></i>详细使用记录</h5>
|
||||
<div class="btn-group btn-group-sm" role="group">
|
||||
<button type="button" class="btn btn-outline-primary" onclick="dashboard.exportTokenData()">
|
||||
<i class="fas fa-download me-1"></i>导出数据
|
||||
</button>
|
||||
<button type="button" class="btn btn-outline-secondary" onclick="dashboard.refreshTokenData()">
|
||||
<i class="fas fa-sync-alt me-1"></i>刷新
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="table-responsive">
|
||||
<table class="table table-hover">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>时间</th>
|
||||
<th>用户</th>
|
||||
<th>模型</th>
|
||||
<th>输入Token</th>
|
||||
<th>输出Token</th>
|
||||
<th>总Token</th>
|
||||
<th>成本</th>
|
||||
<th>响应时间</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="token-records">
|
||||
<tr>
|
||||
<td colspan="8" class="text-center text-muted">
|
||||
<i class="fas fa-spinner fa-spin me-2"></i>加载中...
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- AI监控标签页 -->
|
||||
<div id="ai-monitor-tab" class="tab-content" style="display: none;">
|
||||
<div class="row mb-4">
|
||||
<div class="col-md-3">
|
||||
<div class="stat-card success">
|
||||
<div class="stat-number" id="ai-success-rate">0%</div>
|
||||
<div class="stat-label">成功率</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<div class="stat-card warning">
|
||||
<div class="stat-number" id="ai-response-time">0ms</div>
|
||||
<div class="stat-label">平均响应</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<div class="stat-card danger">
|
||||
<div class="stat-number" id="ai-error-rate">0%</div>
|
||||
<div class="stat-label">错误率</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<div class="stat-card info">
|
||||
<div class="stat-number" id="ai-total-calls">0</div>
|
||||
<div class="stat-label">总调用数</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<h5><i class="fas fa-chart-bar me-2"></i>模型性能对比</h5>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="chart-container">
|
||||
<canvas id="modelComparisonChart"></canvas>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<h5><i class="fas fa-chart-pie me-2"></i>错误类型分布</h5>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="chart-container">
|
||||
<canvas id="errorDistributionChart"></canvas>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row mt-4">
|
||||
<div class="col-md-12">
|
||||
<div class="card">
|
||||
<div class="card-header d-flex justify-content-between align-items-center">
|
||||
<h5><i class="fas fa-exclamation-circle me-2"></i>错误监控</h5>
|
||||
<div class="btn-group btn-group-sm" role="group">
|
||||
<button type="button" class="btn btn-outline-primary" onclick="dashboard.refreshErrorLog()">
|
||||
<i class="fas fa-sync-alt me-1"></i>刷新
|
||||
</button>
|
||||
<button type="button" class="btn btn-outline-danger" onclick="dashboard.clearErrorLog()">
|
||||
<i class="fas fa-trash me-1"></i>清空日志
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="table-responsive">
|
||||
<table class="table table-hover">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>时间</th>
|
||||
<th>错误类型</th>
|
||||
<th>错误信息</th>
|
||||
<th>模型</th>
|
||||
<th>用户</th>
|
||||
<th>操作</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="error-log">
|
||||
<tr>
|
||||
<td colspan="6" class="text-center text-muted">
|
||||
<i class="fas fa-spinner fa-spin me-2"></i>加载中...
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 系统优化标签页 -->
|
||||
<div id="system-optimizer-tab" class="tab-content" style="display: none;">
|
||||
<div class="row mb-4">
|
||||
<div class="col-md-3">
|
||||
<div class="stat-card success">
|
||||
<div class="stat-number" id="cpu-usage">0%</div>
|
||||
<div class="stat-label">CPU使用率</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<div class="stat-card warning">
|
||||
<div class="stat-number" id="memory-usage-percent">0%</div>
|
||||
<div class="stat-label">内存使用率</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<div class="stat-card danger">
|
||||
<div class="stat-number" id="disk-usage">0%</div>
|
||||
<div class="stat-label">磁盘使用率</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<div class="stat-card info">
|
||||
<div class="stat-number" id="network-latency">0ms</div>
|
||||
<div class="stat-label">网络延迟</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<h5><i class="fas fa-tachometer-alt me-2"></i>性能优化</h5>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="mb-3">
|
||||
<label class="form-label">CPU优化</label>
|
||||
<div class="progress mb-2">
|
||||
<div class="progress-bar bg-success" id="cpu-optimization" role="progressbar" style="width: 0%"></div>
|
||||
</div>
|
||||
<button class="btn btn-outline-primary btn-sm" onclick="dashboard.optimizeCPU()">
|
||||
<i class="fas fa-cog me-1"></i>优化CPU
|
||||
</button>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">内存优化</label>
|
||||
<div class="progress mb-2">
|
||||
<div class="progress-bar bg-info" id="memory-optimization" role="progressbar" style="width: 0%"></div>
|
||||
</div>
|
||||
<button class="btn btn-outline-primary btn-sm" onclick="dashboard.optimizeMemory()">
|
||||
<i class="fas fa-memory me-1"></i>优化内存
|
||||
</button>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">磁盘优化</label>
|
||||
<div class="progress mb-2">
|
||||
<div class="progress-bar bg-warning" id="disk-optimization" role="progressbar" style="width: 0%"></div>
|
||||
</div>
|
||||
<button class="btn btn-outline-primary btn-sm" onclick="dashboard.optimizeDisk()">
|
||||
<i class="fas fa-hdd me-1"></i>优化磁盘
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<h5><i class="fas fa-shield-alt me-2"></i>安全优化</h5>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="mb-3">
|
||||
<div class="form-check">
|
||||
<input class="form-check-input" type="checkbox" id="input-validation" checked>
|
||||
<label class="form-check-label">输入验证</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<div class="form-check">
|
||||
<input class="form-check-input" type="checkbox" id="rate-limiting" checked>
|
||||
<label class="form-check-label">频率限制</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<div class="form-check">
|
||||
<input class="form-check-input" type="checkbox" id="sql-injection-protection" checked>
|
||||
<label class="form-check-label">SQL注入防护</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<div class="form-check">
|
||||
<input class="form-check-input" type="checkbox" id="xss-protection" checked>
|
||||
<label class="form-check-label">XSS防护</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-grid">
|
||||
<button class="btn btn-primary" onclick="dashboard.saveSecuritySettings()">
|
||||
<i class="fas fa-save me-1"></i>保存安全设置
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row mt-4">
|
||||
<div class="col-md-6">
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<h5><i class="fas fa-traffic-light me-2"></i>流量保护</h5>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="mb-3">
|
||||
<label class="form-label">请求限制 (每分钟)</label>
|
||||
<input type="number" class="form-control" id="request-limit" value="100">
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">并发控制</label>
|
||||
<input type="number" class="form-control" id="concurrent-limit" value="50">
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">IP白名单</label>
|
||||
<textarea class="form-control" id="ip-whitelist" rows="3" placeholder="每行一个IP地址"></textarea>
|
||||
</div>
|
||||
<div class="d-grid">
|
||||
<button class="btn btn-primary" onclick="dashboard.saveTrafficSettings()">
|
||||
<i class="fas fa-save me-1"></i>保存流量设置
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<h5><i class="fas fa-dollar-sign me-2"></i>成本优化</h5>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="mb-3">
|
||||
<label class="form-label">预算控制 (每月)</label>
|
||||
<div class="input-group">
|
||||
<input type="number" class="form-control" id="monthly-budget-limit" value="1000">
|
||||
<span class="input-group-text">元</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">成本限制 (每次调用)</label>
|
||||
<div class="input-group">
|
||||
<input type="number" class="form-control" id="per-call-cost-limit" value="0.1">
|
||||
<span class="input-group-text">元</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<div class="form-check">
|
||||
<input class="form-check-input" type="checkbox" id="auto-cost-control" checked>
|
||||
<label class="form-check-label">自动成本控制</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-grid">
|
||||
<button class="btn btn-primary" onclick="dashboard.saveCostSettings()">
|
||||
<i class="fas fa-save me-1"></i>保存成本设置
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row mt-4">
|
||||
<div class="col-md-12">
|
||||
<div class="card">
|
||||
<div class="card-header d-flex justify-content-between align-items-center">
|
||||
<h5><i class="fas fa-heartbeat me-2"></i>稳定性监控</h5>
|
||||
<div class="btn-group btn-group-sm" role="group">
|
||||
<button type="button" class="btn btn-outline-primary" onclick="dashboard.runHealthCheck()">
|
||||
<i class="fas fa-stethoscope me-1"></i>健康检查
|
||||
</button>
|
||||
<button type="button" class="btn btn-outline-secondary" onclick="dashboard.refreshSystemStatus()">
|
||||
<i class="fas fa-sync-alt me-1"></i>刷新状态
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="row">
|
||||
<div class="col-md-3">
|
||||
<div class="text-center">
|
||||
<div class="health-dot excellent" id="system-health-indicator"></div>
|
||||
<h6>系统健康</h6>
|
||||
<span id="system-health-score">95%</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<div class="text-center">
|
||||
<div class="health-dot good" id="database-health-indicator"></div>
|
||||
<h6>数据库</h6>
|
||||
<span id="database-health-score">98%</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<div class="text-center">
|
||||
<div class="health-dot fair" id="api-health-indicator"></div>
|
||||
<h6>API服务</h6>
|
||||
<span id="api-health-score">92%</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<div class="text-center">
|
||||
<div class="health-dot excellent" id="cache-health-indicator"></div>
|
||||
<h6>缓存服务</h6>
|
||||
<span id="cache-health-score">99%</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 数据分析标签页 -->
|
||||
<div id="analytics-tab" class="tab-content" style="display: none;">
|
||||
<!-- 图表控制面板 -->
|
||||
|
||||
Reference in New Issue
Block a user