6d82e8bf3d
## 新增功能 - 🏦 账户管理：支持多币种账户创建和管理 - 💰 交易管理：收入/支出记录，支持自定义分类和币种 - 🏷️ 分类管理：自定义分类图标和预算币种设置 - 🎯 预算管理：智能预算控制和实时监控 - 📊 报表分析：可视化财务数据展示 - ⚙️ 系统设置：个性化配置和数据管理 ## 技术特性 - 自定义币种：支持7种常用币种 + 用户自定义 - 自定义分类：支持自定义图标和分类名称 - 自定义账户：支持自定义账户类型和银行 - 响应式设计：完美适配各种屏幕尺寸 - 深色主题：统一的视觉体验 - 中文界面：完全本地化的用户体验 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
246 lines
8.3 KiB
HTML
246 lines
8.3 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="zh-CN">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>TokenRecords 财务管理系统 - 主页</title>
|
|
<style>
|
|
* { margin: 0; padding: 0; box-sizing: border-box; }
|
|
body {
|
|
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', sans-serif;
|
|
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
|
min-height: 100vh;
|
|
color: #333;
|
|
}
|
|
.container {
|
|
max-width: 1200px;
|
|
margin: 0 auto;
|
|
padding: 20px;
|
|
}
|
|
.header {
|
|
text-align: center;
|
|
color: white;
|
|
margin-bottom: 40px;
|
|
padding: 40px 0;
|
|
}
|
|
.header h1 {
|
|
font-size: 3rem;
|
|
margin-bottom: 1rem;
|
|
text-shadow: 2px 2px 4px rgba(0,0,0,0.3);
|
|
}
|
|
.header p {
|
|
font-size: 1.2rem;
|
|
opacity: 0.9;
|
|
}
|
|
.success-banner {
|
|
background: rgba(255,255,255,0.95);
|
|
border-radius: 15px;
|
|
padding: 30px;
|
|
margin: 20px 0;
|
|
box-shadow: 0 8px 32px rgba(0,0,0,0.1);
|
|
text-align: center;
|
|
}
|
|
.success-banner h2 {
|
|
color: #28a745;
|
|
margin-bottom: 15px;
|
|
font-size: 2rem;
|
|
}
|
|
.feature-grid {
|
|
display: grid;
|
|
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
|
|
gap: 25px;
|
|
margin: 30px 0;
|
|
}
|
|
.feature-card {
|
|
background: white;
|
|
border-radius: 12px;
|
|
padding: 30px 20px;
|
|
box-shadow: 0 8px 25px rgba(0,0,0,0.1);
|
|
text-align: center;
|
|
transition: transform 0.3s ease, box-shadow 0.3s ease;
|
|
border: 2px solid transparent;
|
|
}
|
|
.feature-card:hover {
|
|
transform: translateY(-5px);
|
|
box-shadow: 0 15px 40px rgba(0,0,0,0.15);
|
|
border-color: #667eea;
|
|
}
|
|
.feature-icon {
|
|
font-size: 3rem;
|
|
margin-bottom: 15px;
|
|
display: block;
|
|
}
|
|
.feature-card h3 {
|
|
color: #2c3e50;
|
|
margin-bottom: 10px;
|
|
font-size: 1.3rem;
|
|
}
|
|
.feature-card p {
|
|
color: #7f8c8d;
|
|
margin-bottom: 20px;
|
|
line-height: 1.5;
|
|
}
|
|
.btn {
|
|
display: inline-block;
|
|
padding: 12px 24px;
|
|
background: linear-gradient(45deg, #667eea, #764ba2);
|
|
color: white;
|
|
text-decoration: none;
|
|
border-radius: 25px;
|
|
font-weight: 500;
|
|
transition: all 0.3s ease;
|
|
border: none;
|
|
cursor: pointer;
|
|
}
|
|
.btn:hover {
|
|
background: linear-gradient(45deg, #5a6fd8, #6b4190);
|
|
transform: scale(1.05);
|
|
box-shadow: 0 5px 15px rgba(0,0,0,0.2);
|
|
}
|
|
.status-grid {
|
|
display: grid;
|
|
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
|
|
gap: 20px;
|
|
background: white;
|
|
border-radius: 12px;
|
|
padding: 25px;
|
|
margin-top: 30px;
|
|
box-shadow: 0 8px 25px rgba(0,0,0,0.1);
|
|
}
|
|
.status-item {
|
|
text-align: center;
|
|
padding: 15px;
|
|
}
|
|
.status-value {
|
|
font-size: 1.5rem;
|
|
font-weight: bold;
|
|
margin-bottom: 5px;
|
|
}
|
|
.status-label {
|
|
color: #7f8c8d;
|
|
font-size: 0.9rem;
|
|
}
|
|
.working { color: #28a745; }
|
|
.info { color: #007bff; }
|
|
.warning { color: #ffc107; }
|
|
.time { color: #17a2b8; }
|
|
|
|
.footer {
|
|
text-align: center;
|
|
margin-top: 40px;
|
|
color: rgba(255,255,255,0.8);
|
|
}
|
|
|
|
@media (max-width: 768px) {
|
|
.header h1 { font-size: 2rem; }
|
|
.container { padding: 10px; }
|
|
.feature-grid { grid-template-columns: 1fr; }
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="container">
|
|
<div class="header">
|
|
<h1>🎉 TokenRecords 财务管理系统</h1>
|
|
<p>基于 Vue 3 + Vite + Ant Design Vue 的现代化财务管理平台</p>
|
|
</div>
|
|
|
|
<div class="success-banner">
|
|
<h2>✅ 系统启动成功！</h2>
|
|
<p><strong>恭喜！</strong> 您的财务管理系统已成功部署并正在运行。</p>
|
|
<p>🕒 启动时间: <span id="time"></span></p>
|
|
</div>
|
|
|
|
<div class="feature-grid">
|
|
<div class="feature-card">
|
|
<div class="feature-icon">📊</div>
|
|
<h3>财务分析</h3>
|
|
<p>查看详细的收支统计、趋势分析和财务报表</p>
|
|
<a href="/analytics/overview" class="btn">进入分析</a>
|
|
</div>
|
|
|
|
<div class="feature-card">
|
|
<div class="feature-icon">💰</div>
|
|
<h3>交易记录</h3>
|
|
<p>管理所有收入和支出记录，支持批量导入导出</p>
|
|
<a href="/finance/transaction" class="btn">管理交易</a>
|
|
</div>
|
|
|
|
<div class="feature-card">
|
|
<div class="feature-icon">📝</div>
|
|
<h3>快速记账</h3>
|
|
<p>快速添加收支记录，支持智能分类和标签</p>
|
|
<a href="/quick-add" class="btn">快速记账</a>
|
|
</div>
|
|
|
|
<div class="feature-card">
|
|
<div class="feature-icon">👥</div>
|
|
<h3>人员管理</h3>
|
|
<p>管理付款人、收款人和相关联系信息</p>
|
|
<a href="/finance/person" class="btn">管理人员</a>
|
|
</div>
|
|
|
|
<div class="feature-card">
|
|
<div class="feature-icon">🏷️</div>
|
|
<h3>分类设置</h3>
|
|
<p>设置和管理收支分类，支持层级结构</p>
|
|
<a href="/finance/category" class="btn">分类设置</a>
|
|
</div>
|
|
|
|
<div class="feature-card">
|
|
<div class="feature-icon">⚙️</div>
|
|
<h3>系统设置</h3>
|
|
<p>配置系统参数、用户权限和数据备份</p>
|
|
<a href="/settings" class="btn">系统设置</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="status-grid">
|
|
<div class="status-item">
|
|
<div class="status-value working">正常运行</div>
|
|
<div class="status-label">系统状态</div>
|
|
</div>
|
|
<div class="status-item">
|
|
<div class="status-value info">5666</div>
|
|
<div class="status-label">Web端口</div>
|
|
</div>
|
|
<div class="status-item">
|
|
<div class="status-value info">5320</div>
|
|
<div class="status-label">API端口</div>
|
|
</div>
|
|
<div class="status-item">
|
|
<div class="status-value warning">Vue 3.5</div>
|
|
<div class="status-label">前端版本</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="footer">
|
|
<p>🚀 TokenRecords 财务管理系统 | 基于 Vben Admin 架构</p>
|
|
<p>💡 如需帮助，请查看开发者工具控制台 | 标准版本: <a href="http://localhost:5667/" style="color: #ffeb3b;">http://localhost:5667/</a></p>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
// 更新时间显示
|
|
function updateTime() {
|
|
const now = new Date();
|
|
document.getElementById('time').textContent = now.toLocaleString('zh-CN');
|
|
}
|
|
|
|
updateTime();
|
|
setInterval(updateTime, 1000);
|
|
|
|
console.log('🎉 TokenRecords 静态页面加载成功！');
|
|
console.log('📊 系统信息:');
|
|
console.log(' - Web端口: 5666');
|
|
console.log(' - API端口: 5320');
|
|
console.log(' - 状态: 正常运行');
|
|
|
|
// 检查Vue应用是否也在加载
|
|
setTimeout(() => {
|
|
console.log('💡 提示: 如果您能看到这个静态页面，说明服务器工作正常');
|
|
console.log('🔧 可以点击上面的功能按钮来测试各个模块');
|
|
}, 1000);
|
|
</script>
|
|
</body>
|
|
</html> |