uniapp_ycc/README.md

# 一查查小程序 (uniapp-ycc)

## 项目说明

本项目参考 `qncV3uni-app` 的 UI 框架，使用 `ycc-proxy-webview` 的接口和路由，对接 `ycc-proxy-server` 的后端逻辑。

## 已完成的工作

### 1. 布局组件
- ✅ `src/layouts/HomeLayout.vue` - 首页布局（带底部导航和投诉按钮）
- ✅ `src/layouts/PageLayout.vue` - 普通页面布局
- ✅ `src/layouts/GlobalLayout.vue` - 全局布局

### 2. API 调用模块
- ✅ `src/composables/useApiFetch.js` - 统一的 API 请求封装
- ✅ `src/api/user.js` - 用户相关 API
- ✅ `src/api/agent.js` - 代理相关 API

### 3. 状态管理
- ✅ `src/stores/userStore.js` - 用户状态管理
- ✅ `src/stores/agentStore.js` - 代理状态管理

### 4. 工具函数
- ✅ `src/composables/useWechatShare.js` - 微信分享配置
- ✅ `src/composables/useEnv.js` - 环境检测

### 5. 核心功能
- ✅ `src/App.vue` - 应用入口，包含微信登录逻辑和 token 刷新
- ✅ `src/main.js` - 应用初始化，包含全局分享配置
- ✅ `src/pages/index.vue` - 首页（已更新）
- ✅ `src/components/SectionTitle.vue` - 章节标题组件

### 6. 路由配置
- ✅ `pages.config.js` - 页面路由配置，包含 tabBar 配置

## 已完成的页面

所有页面文件已从 `qncV3uni-app` 复制完成：

### TabBar 页面
1. ✅ `src/pages/index.vue` - 首页
2. ✅ `src/pages/agent/index.vue` - 数据页
3. ✅ `src/pages/me/index.vue` - 我的页

### 其他页面
- ✅ `src/pages/help/index.vue` - 帮助中心
- ✅ `src/pages/help/detail.vue` - 帮助详情
- ✅ `src/pages/help/guide.vue` - 引导指南
- ✅ `src/pages/register/index.vue` - 注册成为代理
- ✅ `src/pages/historyQuery/index.vue` - 历史查询
- ✅ `src/pages/report/index.vue` - 报告详情
- ✅ `src/pages/service/index.vue` - 客服
- ✅ `src/pages/agentSystemGuide/index.vue` - 代理系统指南
- ✅ `src/pages/userAgreement/index.vue` - 用户协议
- ✅ `src/pages/privacyPolicy/index.vue` - 隐私政策
- ✅ `src/pages/agentManageAgreement/index.vue` - 代理管理协议
- ✅ `src/pages/teamList/index.vue` - 我的团队
- ✅ `src/pages/agentUpgrade/index.vue` - 升级代理
- ✅ `src/pages/promoteDetails/index.vue` - 我的推广收益
- ✅ `src/pages/rewardsDetails/index.vue` - 下级推广收益
- ✅ `src/pages/invitation/index.vue` - 邀请下级代理
- ✅ `src/pages/promote/report.vue` - 推广报告
- ✅ `src/pages/withdrawDetails/index.vue` - 提现记录
- ✅ `src/pages/upgradeSubordinate/index.vue` - 调整下级级别（仅小程序）

### 组件
- ✅ `src/components/AppFooter.vue`
- ✅ `src/components/AppLogos.vue`
- ✅ `src/components/InputEntry.vue`
- ✅ `src/components/InvitePoster.vue`
- ✅ `src/components/PriceInputPopup.vue`
- ✅ `src/components/QRcode.vue`
- ✅ `src/components/ReportFeatures.vue`
- ✅ `src/components/SectionTitle.vue`

### API 文件
- ✅ `src/api/user.js` - 用户相关 API
- ✅ `src/api/agent.js` - 代理相关 API
- ✅ `src/api/pay.js` - 支付相关 API

### 工具文件
- ✅ `src/utils/debug.js` - 调试工具函数

## 参考项目

- **UI 框架参考**: `qncV3uni-app`
- **接口和路由参考**: `ycc-proxy-webview`
- **后端逻辑参考**: `ycc-proxy-server`

## 环境变量配置

需要在项目根目录创建 `.env` 文件，配置以下变量：

```env
VITE_API_URL=http://your-api-url
VITE_API_PREFIX=/api/v1
VITE_APP_NAME=一查查
VITE_COMPANY_NAME=公司名称
VITE_ICP_RECORD=ICP备案号
VITE_PUBLIC_SECURITY_RECORD=公安备案号
VITE_SHOW_PUBLIC_SECURITY_RECORD=true
VITE_SERVICE_URL=客服链接
```

## 静态资源

✅ 已从 `qncV3uni-app` 复制所有静态资源到 `src/static/`：

- ✅ `homelayout/` - 底部导航图标
- ✅ `index/` - 首页图片
- ✅ `promote/` - 推广页图片
- ✅ `me/` - 我的页面图标
- ✅ `login/` - 登录页图片
- ✅ `public_security_record_icon.png` - 公安备案图标

## 开发命令

```bash
# 安装依赖
pnpm install

# 开发模式（H5）
pnpm dev

# 开发模式（微信小程序）
pnpm dev:mp-weixin

# 构建（微信小程序）
pnpm build:mp-weixin
```

## 注意事项

1. API 基础路径配置在 `src/composables/useApiFetch.js` 中，默认使用 `/api/v1`
2. 微信小程序登录逻辑在 `src/App.vue` 的 `onLaunch` 中
3. Token 自动刷新逻辑已实现
4. 页面路由使用 `@uni-helper/vite-plugin-uni-pages` 自动生成
5. 布局组件通过 `layout` 属性指定

## 已完成的工作总结

✅ **所有文件已从 `qncV3uni-app` 复制完成**

1. ✅ 所有页面文件（23个页面）
2. ✅ 所有组件文件（8个组件）
3. ✅ 所有静态资源文件
4. ✅ API 文件（user.js, agent.js, pay.js）
5. ✅ 工具文件（debug.js）
6. ✅ 布局组件（HomeLayout, PageLayout, GlobalLayout）
7. ✅ Store 文件（userStore.js, agentStore.js）
8. ✅ Composables（useApiFetch.js, useWechatShare.js, useEnv.js）
9. ✅ 路由配置（pages.config.js）
10. ✅ 环境变量示例文件（.env.example）

## 下一步

1. 配置环境变量（复制 `.env.example` 为 `.env` 并填写实际值）
2. 根据实际需求调整页面内容（如修改应用名称、公司名称等）
3. 测试 API 接口连接
4. 根据后端接口调整 API 调用（如有差异）
5. 测试各页面功能和交互