Sofio
79fede5cb0
- React + TypeScript + Vite 项目结构 - WalletConnect 钱包连接功能 - WUSD 铸造页面（含边界测试） - Vault 交易页面（买入/卖出 YT，含边界测试） - Factory 管理页面（创建 Vault、更新价格，含权限测试） - 中英文国际化支持 - 显示 Owner/Manager 角色信息 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
169 lines
4.3 KiB
Markdown
169 lines
4.3 KiB
Markdown
# YT Asset 合约测试前端项目
|
||
|
||
## 项目概述
|
||
|
||
这是一个用于测试 YT Asset 合约的前端项目，使用 React + TypeScript + WalletConnect 技术栈。
|
||
|
||
## 仓库信息
|
||
|
||
- **Git仓库**: https://code.desunweb3.com/xie/Heyue_test.git
|
||
- **账号**: xie
|
||
- **访问令牌**: ed6a912e50da5e7c67ce64608f112fa1e6b7b71d
|
||
- **克隆命令**:
|
||
```bash
|
||
git clone https://xie:ed6a912e50da5e7c67ce64608f112fa1e6b7b71d@code.desunweb3.com/xie/Heyue_test.git
|
||
```
|
||
|
||
## 部署信息
|
||
|
||
- **域名**: https://maxfight.vip
|
||
- **服务器IP**: 152.69.205.186
|
||
- **端口**: 50001
|
||
- **反向代理配置**: /opt/1panel/apps/openresty/openresty/www/sites/maxfight.vip/proxy/root.conf
|
||
|
||
## 合约信息 (Arbitrum Sepolia 测试网)
|
||
|
||
### 测试私钥
|
||
```
|
||
0xa082a7037105ebd606bee80906687e400d89899bbb6ba0273a61528c2f5fab89
|
||
```
|
||
|
||
### 合约地址
|
||
| 合约 | 地址 |
|
||
|------|------|
|
||
| YTAssetFactory | 0x6DaB73519DbaFf23F36FEd24110e2ef5Cfc8aAC9 |
|
||
| YT-A | 0x0cA35994F033685E7a57ef9bc5d00dd3cf927330 |
|
||
| YT-B | 0x333805C9EE75f59Aa2Cc79DfDe2499F920c7b408 |
|
||
| YT-C | 0x6DF0ED6f0345F601A206974973dE9fC970598587 |
|
||
| WUSD | 0x939cf46F7A4d05da2a37213E7379a8b04528F590 |
|
||
|
||
### 合约文档位置
|
||
```
|
||
/root/Heyue_test/document/合约文档.md
|
||
```
|
||
|
||
## 项目结构
|
||
|
||
```
|
||
/root/Heyue_test/
|
||
├── frontend/ # 前端项目目录
|
||
│ ├── src/
|
||
│ │ ├── config/
|
||
│ │ │ ├── wagmi.ts # WalletConnect配置
|
||
│ │ │ └── contracts.ts # 合约地址和ABI
|
||
│ │ ├── components/
|
||
│ │ │ ├── ConnectButton.tsx # 钱包连接按钮
|
||
│ │ │ ├── LanguageSwitch.tsx # 语言切换组件
|
||
│ │ │ ├── WUSDPanel.tsx # WUSD铸造面板
|
||
│ │ │ ├── VaultPanel.tsx # Vault交易面板
|
||
│ │ │ └── FactoryPanel.tsx # Factory管理面板
|
||
│ │ ├── i18n/
|
||
│ │ │ ├── index.ts # i18n配置
|
||
│ │ │ └── locales/
|
||
│ │ │ ├── en.json # 英文翻译
|
||
│ │ │ └── zh.json # 中文翻译
|
||
│ │ ├── App.tsx
|
||
│ │ ├── App.css
|
||
│ │ ├── main.tsx
|
||
│ │ └── index.css
|
||
│ ├── vite.config.ts
|
||
│ └── package.json
|
||
├── document/
|
||
│ └── 合约文档.md # 合约ABI和详细信息
|
||
└── PROJECT_INFO.md # 本文档
|
||
```
|
||
|
||
## 技术栈
|
||
|
||
- **React**: 19.2.3
|
||
- **TypeScript**: 5.9.3
|
||
- **Vite**: 7.3.0
|
||
- **wagmi**: 3.1.0
|
||
- **viem**: 2.42.1
|
||
- **@web3modal/wagmi**: 5.1.11
|
||
- **react-i18next**: 国际化支持
|
||
|
||
## WalletConnect配置
|
||
|
||
- **Project ID**: 3a8170812b534d0ff9d794f19a901d64 (临时测试ID)
|
||
- **获取自己的ID**: https://cloud.walletconnect.com/
|
||
|
||
## 功能列表
|
||
|
||
### 1. WUSD页面
|
||
- 显示WUSD余额
|
||
- 铸造WUSD代币
|
||
|
||
### 2. Vault交易页面
|
||
- 选择Vault (YT-A/B/C)
|
||
- 显示Vault信息 (总资产、闲置资产、总供应量、硬顶、价格等)
|
||
- 买入YT (用WUSD购买)
|
||
- 卖出YT (换回WUSD)
|
||
- 预览交易结果
|
||
|
||
### 3. Factory管理页面
|
||
- 显示Factory信息
|
||
- 显示所有Vault列表
|
||
- Owner可创建新Vault
|
||
- Owner可更新Vault价格
|
||
|
||
### 4. 国际化
|
||
- 支持英文和简体中文
|
||
- 语言切换按钮在右上角
|
||
- 语言设置保存到localStorage
|
||
|
||
## 常用命令
|
||
|
||
```bash
|
||
# 进入前端目录
|
||
cd /root/Heyue_test/frontend
|
||
|
||
# 安装依赖
|
||
npm install
|
||
|
||
# 开发模式运行 (端口50001)
|
||
npm run dev
|
||
|
||
# 构建生产版本
|
||
npm run build
|
||
|
||
# 后台启动开发服务器
|
||
nohup npm run dev > /tmp/vite.log 2>&1 &
|
||
|
||
# 查看运行日志
|
||
cat /tmp/vite.log
|
||
|
||
# 杀掉占用50001端口的进程
|
||
lsof -i :50001 | grep -v "^COMMAND" | awk '{print $2}' | xargs -r kill -9
|
||
```
|
||
|
||
## Vite配置 (vite.config.ts)
|
||
|
||
```typescript
|
||
export default defineConfig({
|
||
plugins: [react()],
|
||
server: {
|
||
port: 50001,
|
||
host: '0.0.0.0',
|
||
strictPort: true,
|
||
allowedHosts: ['maxfight.vip', 'localhost', '127.0.0.1'],
|
||
}
|
||
})
|
||
```
|
||
|
||
## 注意事项
|
||
|
||
1. @web3modal/wagmi 已被官方弃用，建议迁移到 Reown AppKit
|
||
2. 当前使用的是公共测试WalletConnect项目ID，生产环境建议使用自己的ID
|
||
3. 合约部署在Arbitrum Sepolia测试网
|
||
|
||
## 待办事项
|
||
|
||
- [ ] 迁移到 Reown AppKit (替代 @web3modal/wagmi)
|
||
- [ ] 添加交易历史记录
|
||
- [ ] 添加更多错误处理和用户提示
|
||
- [ ] 优化打包大小 (当前有大chunk警告)
|
||
|
||
---
|
||
*文档更新时间: 2025-12-15*
|