- 资产卡片区域:深色骨架屏匹配原有卡片风格 - 持仓列表区域:模拟卡片布局的骨架占位 - 添加 loading 状态控制,数据加载完成后切换 - 骨架屏带渐变动画效果,提升用户体验
48 lines
3.2 KiB
Markdown
Executable File
48 lines
3.2 KiB
Markdown
Executable File
# 智投策略管家 (Smart Strategy Portfolio) - 移动端
|
||
|
||
[](https://vuejs.org/)
|
||
[](https://uniapp.dcloud.net.cn/)
|
||
[](LICENSE)
|
||
|
||
> 专注为个人投资者打造的**多策略、信号驱动**的量化资产管理工具前端项目。
|
||
> *“不要让混杂的持仓影响你的判断,让纪律和策略接管交易。”*
|
||
|
||
## 🎯 为什么做这个项目?
|
||
|
||
在实际投资中,成熟的投资者通常会在同一个证券账户中运行多种不同的交易策略(例如:50% 资金跑 **HFEA 资产配置**,20% 资金跑 **TQQQ 吊灯止损**)。
|
||
传统券商 App 只能提供“账户维度”的汇总,导致资产混杂、信号钝化、极易引发情绪化交易。
|
||
|
||
本项目旨在通过**“虚拟策略子账户”**的概念,在 UI 层面上将物理账户中的资产进行逻辑隔离,并以可视化的方式输出明确的交易信号(买入/卖出/再平衡),辅助投资者坚守交易纪律。
|
||
|
||
## ✨ 前端核心特性
|
||
|
||
* **🚥 信号驱动看板**:首页摒弃传统的“总资产金额”视觉中心,重点展示各策略的分组卡片及当前状态(安全/预警/触发止损)。
|
||
* **🧩 策略深度隔离**:每个自定义组合等同于一个独立的“虚拟子账户”,内聚对应的持仓明细、盈亏状况及交易记录。
|
||
* **🛠️ 完善的 Mock 机制**:内置离线 Mock 数据拦截(位于 `utils/api.js`),即使在无后端服务的情况下也能完整体验核心交互流程。
|
||
* **📱 极简金融 UI**:采用统一的深绿色主题 (`#064E3B`),配合精致的卡片阴影与响应式交互,遵循 WeUI 极简设计规范。
|
||
|
||
## 🏗️ 技术栈
|
||
|
||
* **核心框架**:[uni-app](https://uniapp.dcloud.net.cn/) (跨端应用框架)
|
||
* **视图层**:Vue 3.x (Composition API 组合式注入)
|
||
* **样式处理**:Tailwind-like utility classes + CSS 变量
|
||
* **运行平台**:优先适配**微信小程序**,支持编译至 H5 及 App 端。
|
||
|
||
## 📁 目录结构
|
||
|
||
```text
|
||
AssetManager.UniApp/
|
||
├── pages/ # 核心业务页面
|
||
│ ├── index/ # 首页:资产总览与策略看板
|
||
│ ├── strategies/ # 策略中心:内置经典量化策略库
|
||
│ ├── detail/ # 详情页:特定策略的持仓与信号明细
|
||
│ ├── config/ # 配置页:策略参数调节
|
||
│ └── me/ # 我的:个人中心与设置
|
||
├── utils/ # 工具类库
|
||
│ └── api.js # 统一 API 封装与 Mock 数据拦截
|
||
├── static/ # 静态资源 (图片、Icon 等)
|
||
├── uni_modules/ # uni-app 官方或第三方插件模块
|
||
├── App.vue # 应用全局生命周期与状态入口
|
||
├── main.js # Vue 3 初始化入口
|
||
├── manifest.json # 跨端编译及应用信息配置
|
||
└── pages.json # 路由注册与全局外观配置 |