Go to file
刘华勇 abe1a29931 feat: 初始化交易纪律系统前端
- 基于 Vue 3 + TypeScript + Vite 的前端应用
- 数据源管理页面(健康监控、请求日志、重放诊断弹窗)
- 日志弹窗分区卡片布局,符合 A 股红涨绿跌配色规范
- 配置 .gitignore:忽略 node_modules、dist 构建产物、.env 密钥
2026-06-17 15:46:48 +08:00
.vscode feat: 初始化交易纪律系统前端 2026-06-17 15:46:48 +08:00
docs feat: 初始化交易纪律系统前端 2026-06-17 15:46:48 +08:00
public feat: 初始化交易纪律系统前端 2026-06-17 15:46:48 +08:00
src feat: 初始化交易纪律系统前端 2026-06-17 15:46:48 +08:00
.gitignore feat: 初始化交易纪律系统前端 2026-06-17 15:46:48 +08:00
index.html feat: 初始化交易纪律系统前端 2026-06-17 15:46:48 +08:00
package-lock.json feat: 初始化交易纪律系统前端 2026-06-17 15:46:48 +08:00
package.json feat: 初始化交易纪律系统前端 2026-06-17 15:46:48 +08:00
README.md feat: 初始化交易纪律系统前端 2026-06-17 15:46:48 +08:00
tsconfig.app.json feat: 初始化交易纪律系统前端 2026-06-17 15:46:48 +08:00
tsconfig.json feat: 初始化交易纪律系统前端 2026-06-17 15:46:48 +08:00
tsconfig.node.json feat: 初始化交易纪律系统前端 2026-06-17 15:46:48 +08:00
vite.config.ts feat: 初始化交易纪律系统前端 2026-06-17 15:46:48 +08:00

🎯 交易纪律管理系统

基于 TypeScript + Vue 3 + Vite 的纯前端交易纪律管理工具。 数据存储在浏览器本地localStorage无需后端开箱即用。

核心理念

「严守纪律,知行合一」 — 交易不是预测市场,而是管理风险和执行纪律。

四大铁律

  1. 进场前先定止损
  2. 到价必执行,不犹豫
  3. 止损只上移不下移
  4. 单笔亏损 ≤ 总资金 2%

📦 功能模块

1. 📊 交易仪表盘Dashboard

  • 纪律等级评估A+ / B / C / D
  • 核心指标:累计盈亏、胜率、盈亏比、最大回撤、纪律执行率
  • 当前持仓概览、待执行计划
  • 最近交易记录

2. 📋 交易计划单Plans

  • 进场前强制填写完整计划
  • 实时风险计算:投入资金、仓位占比、止损金额、风险占比、盈亏比
  • 智能预警:风险占比超 2%、仓位超 20%、盈亏比<E4BA8F><E6AF94>于 2:1 时自动警告
  • 分批止盈目标设置
  • 买入理由 + 认错条件(失效条件)

3. 📈 持仓管理Positions

  • 执行买入(计划单 → 持仓)
  • 移动止损(只能上移,保护利润)
  • 平仓记录(卖出价、原因、纪律自评、复盘笔记)
  • 持仓详情:买入价、止损价、止损金额、止盈目标

4. 检查清单Checklist

  • 三大场景:买入前 / 持有中 / 卖出前
  • 16 项默认检查(可自定义增删)
  • 今日完成度追踪
  • 防止情绪化操作的关键防线

5. 📒 交易记录Records

  • 完整交易历史
  • ECharts 可视化:累计盈亏曲线、盈亏分布饼图
  • 筛选:全部 / 盈利 / 亏损 / 违纪
  • 每笔交易复盘笔记 + 星级自评
  • 数据导出JSON 格式)

6. 📓 复盘日志Journal

  • 时间线式日记
  • 心情记录(🤩😊😐😰😱
  • 标签分类
  • 市场观察、操作反思、经验总结

7. 🤖 AI 智能分析AI Analysis

  • Agent 模式8 步自动编排分析流程,实时展示思考过程
  • 三维评分技术面40%+ 基本面35%+ 资金面25%)加权评分
  • 技术指标引擎MA / MACD / RSI / KDJ / BOLL / ATR 全量计算
  • 基本面分析:营收增长 / 净利润 / ROE / 毛利率 / 负债率 / PE 估值
  • 资金面分析:主力资金流向 / 北向资金 / 换手率
  • 风险评级:低 / 中 / 高 / 极高风险
  • 智能建议止损位ATR×1.5)、目标价、支撑压力位、操作策略
  • 对话式交互:搜索股票 → 选择 → Agent 自动分析,支持历史对话
  • 内置 28 只 A 股热门股票数据(可扩展)

🚀 快速开始

# 安装依赖
npm install

# 启动开发服务器
npm run dev

# 构建生产版本
npm run build

# 预览生产构建
npm run preview

访问 http://localhost:5173(或控制台显示的端口)即可使用。


🛠 技术栈

技术 用途
Vue 3 + Composition API 响应式 UI 框架
TypeScript 类型安全
Vite 构建工具
Pinia 状态管理
Vue Router 路由
ECharts 数据可视化(按需导入)
localStorage 本地数据持久化

📁 项目结构

src/
├── assets/
│   └── main.css          # 全局样式(暗色主题)
├── router/
│   └── index.ts          # 路由配置
├── stores/
│   ├── trade.ts          # 交易业务状态管理
│   └── ai.ts             # AI 分析状态管理
├── types/
│   └── index.ts          # TypeScript 类型定义
├── utils/
│   ├── format.ts         # 格式化工具函数
│   ├── storage.ts        # localStorage 封装 + 默认数据
│   └── aiEngine.ts       # AI 分析引擎(数据模拟/技术指标/Agent编排
├── views/
│   ├── DashboardView.vue # 仪表盘
│   ├── PlansView.vue     # 交易计划单
│   ├── PositionsView.vue # 持仓管理
│   ├── ChecklistView.vue # 检查清单
│   ├── RecordsView.vue   # 交易记录
│   ├── JournalView.vue   # 复盘日志
│   └── AIAnalysisView.vue# AI 智能分析
├── App.vue               # 根组件(侧边栏布局)
└── main.ts               # 应用入口

💡 使用建议

日常操作流程

1. 盘前:打开「计划单」→ 填写今日交易计划
2. 盘前:打开「检查清单」→ 逐项确认买入前检查
3. 盘中:在「持仓管理」→ 执行买入、更新移动止损
4. 盘后:在「持仓管理」→ 记录平仓
5. 盘后:打开「复盘日志」→ 写下今日心得
6. 周末:查看「交易记录」→ 分析曲线、复盘改进

数据安全

  • 所有数据存储在浏览器 localStorage 中
  • 建议定期在「交易记录」页导出 JSON 备份
  • 清除浏览器数据会导致数据丢失