Files

apple 079076a70e miao33: 从 main 同步 single_uniapp22miao，dart-sass 兼容修复，DEPLOY.md 更新

- 从 main 获取 single_uniapp22miao 子项目
- dart-sass: /deep/ -> ::v-deep，calc 运算符加空格
- DEPLOY.md 采用 shccd159 版本（4 子项目架构说明）

Made-with: Cursor

2026-03-16 11:16:42 +08:00

22 KiB

Raw Permalink Blame History

H5商城网站页面结构分析

网站地址: http://miao1.suzhouyuqi.com/#/pages/index/index
分析时间: 2025-11-08
数据源: static/js/*.js (48个编译文件)
框架: uni-app

📊 统计概览

项目	数量
JS文件总数	48 个
主要页面	3 个
子页面模块	18 个
独立页面	36+ 个
代码总大小	~3.5 MB

🗂️ 页面结构树

单店商城 H5
│
├── 📱 主要页面 (pages/)
│   ├── index/index                    # 首页
│   ├── personal/index                 # 个人中心
│   └── rushing/                       # 抢购模块
│       ├── index                      # 抢购首页
│       └── detail                     # 抢购详情
│
└── 📄 子页面 (pages/sub-pages/)
    │
    ├── 🔐 用户登录模块 (login/)
    │   ├── index                      # 登录页
    │   ├── register                   # 注册页
    │   ├── reset-account              # 重置账号
    │   └── change-pwd                 # 修改密码
    │
    ├── 👤 用户信息模块 (user-info/)
    │   └── index                      # 用户信息页
    │
    ├── 📍 地址管理模块 (address/)
    │   ├── index                      # 地址列表
    │   └── detail                     # 地址详情（新增/编辑）
    │
    ├── 🛍️ 商品模块 (good/)
    │   └── good-detail                # 商品详情
    │
    ├── 🔍 搜索模块 (search/)
    │   └── index                      # 搜索页
    │
    ├── 📦 订单模块
    │   ├── shop-order/index           # 商城订单
    │   └── rushing-order/             # 抢购订单
    │       ├── index                  # 订单列表
    │       └── detail                 # 订单详情
    │
    ├── 💰 财务模块
    │   ├── balance/index              # 分红余额
    │   ├── coupon/index               # 优惠券
    │   ├── withdraw/                  # 提现
    │   │   ├── index                  # 提现页
    │   │   └── list                   # 提现记录
    │   └── prize/index                # 奖品中心
    │
    ├── 💳 收款方式模块 (my-payee/)
    │   ├── index                      # 收款方式列表
    │   ├── zfb-detail                 # 支付宝详情
    │   └── yl-detail                  # 银联详情
    │
    ├── 👥 推广模块
    │   ├── invite/index               # 邀请好友
    │   ├── my-fans/index              # 我的粉丝
    │   └── promote-prize/index        # 推广奖励
    │
    ├── 📄 协议模块 (agreement/)
    │   ├── index                      # 协议列表
    │   ├── contract                   # 合同协议
    │   ├── contract1                  # 合同协议1
    │   └── my-contract                # 我的合同
    │
    ├── ⚙️ 设置模块 (setting/)
    │   ├── index                      # 设置页
    │   └── 404                        # 404页面
    │
    └── 🌐 WebView模块 (webview/)
        ├── index                      # WebView页面
        ├── sign                       # 签名页
        └── sign-preview               # 签名预览 (1.9MB)

📱 一、主要页面（3个）

1. 首页模块

页面	路径	文件	大小	说明
首页	`/pages/index/index`	pages-index-index.116e63f5.js	21K	商城首页

功能:

轮播图展示
商品分类
商品列表
公告信息
快捷入口

2. 个人中心模块

页面	路径	文件	大小	说明
个人中心	`/pages/personal/index`	pages-personal-index.6f5415f9.js	23K	用户个人中心

功能:

用户信息展示
分红余额显示
功能菜单入口
我的订单
我的推广

3. 抢购模块

页面	路径	文件	大小	说明
抢购首页	`/pages/rushing/index`	pages-rushing-index.b68c1e3c.js	25K	抢购商品列表
抢购详情	`/pages/rushing/detail`	pages-rushing-detail.cee18a9d.js	15K	抢购商品详情

功能:

可购买商品列表
商品抢单
营业时间控制
购买限制

📄 二、子页面模块（18个模块，36+页面）

1. 🔐 用户登录模块 (4个页面)

页面	路径	文件	大小	说明
登录页	`/pages/sub-pages/login/index`	pages-sub-pages-login-index.a9a3e737.js	9.8K	用户登录
注册页	`/pages/sub-pages/login/register`	pages-sub-pages-login-register.90ee3c46.js	8.4K	用户注册
重置账号	`/pages/sub-pages/login/reset-account`	pages-sub-pages-login-reset-account.98a38bc1.js	8.2K	重置密码
修改密码	`/pages/sub-pages/login/change-pwd`	pages-sub-pages-login-change-pwd.ee81f1aa.js	8.1K	修改密码

API 调用:

POST /api/user/login - 登录
POST /api/user/register - 注册
POST /api/user/changepwd - 修改密码
POST /api/sms/send - 发送验证码

2. 👤 用户信息模块 (1个页面)

页面	路径	文件	大小	说明
用户信息	`/pages/sub-pages/user-info/index`	pages-sub-pages-user-info-index.9cf7aa59.js	13K	个人资料编辑

功能:

修改昵称
修改头像
查看个人信息

API 调用:

POST /api/user/info - 获取用户信息
POST /api/user/nickname - 修改昵称

3. 📍 地址管理模块 (2个页面)

页面	路径	文件	大小	说明
地址列表	`/pages/sub-pages/address/index`	pages-sub-pages-address-index.c1c668d6.js	9.3K	收货地址列表
地址详情	`/pages/sub-pages/address/detail`	pages-sub-pages-address-detail.23252d60.js	171K	新增/编辑地址

功能:

地址列表展示
新增地址
编辑地址
删除地址
设置默认地址
地区选择器（三级联动）

API 调用:

GET /api/address/list - 地址列表
POST /api/address/insert - 新增地址
POST /api/address/update - 更新地址
POST /api/address/delete - 删除地址
POST /api/address/default - 获取默认地址

注意: address-detail 文件很大（171K），包含了完整的地区数据

4. 🛍️ 商品模块 (1个页面)

页面	路径	文件	大小	说明
商品详情	`/pages/sub-pages/good/good-detail`	pages-sub-pages-good-good-detail.a842e7a3.js	23K	商品详情页

功能:

商品图片展示
商品信息
价格信息
客服联系
立即购买

API 调用:

GET /api/goods/detail?id=xxx - 商品详情

5. 🔍 搜索模块 (1个页面)

页面	路径	文件	大小	说明
搜索页	`/pages/sub-pages/search/index`	pages-sub-pages-search-index.48e410ba.js	13K	商品搜索

功能:

搜索商品
搜索历史
热门搜索

6. 📦 订单模块 (3个页面)

页面	路径	文件	大小	说明
商城订单	`/pages/sub-pages/shop-order/index`	pages-sub-pages-shop-order-index.40968fc8.js	17K	商城订单列表
抢购订单列表	`/pages/sub-pages/rushing-order/index`	pages-sub-pages-rushing-order-index.8ba4fcca.js	12K	抢购订单列表
抢购订单详情	`/pages/sub-pages/rushing-order/detail`	pages-sub-pages-rushing-order-detail.a34d428c.js	8.3K	抢购订单详情

功能:

订单列表（买方仓库/卖方仓库）
订单详情
订单支付
订单确认
订单取消
订单转卖

API 调用:

GET /api/order/list - 订单列表
GET /api/order/detail - 订单详情
POST /api/order/buy - 购买商品
POST /api/order/pay - 支付订单
POST /api/order/confirm - 确认订单
POST /api/order/cancel - 取消订单
POST /api/order/resell - 转卖订单

7. 💰 财务模块 (5个页面)

页面	路径	文件	大小	说明
分红余额	`/pages/sub-pages/balance/index`	pages-sub-pages-balance-index.af701be0.js	4.8K	分红余额明细
优惠券	`/pages/sub-pages/coupon/index`	pages-sub-pages-coupon-index.9fd36b20.js	5.1K	优惠券明细
提现	`/pages/sub-pages/withdraw/index`	pages-sub-pages-withdraw-index.d0ed0300.js	5.3K	申请提现
提现记录	`/pages/sub-pages/withdraw/list`	pages-sub-pages-withdraw-list.257de314.js	4.0K	提现记录
奖品中心	`/pages/sub-pages/prize/index`	pages-sub-pages-prize-index.8e8f86b4.js	4.9K	奖品列表

功能:

余额明细查询
收入支出记录
申请提现
提现记录查询

API 调用:

GET /api/money/list - 财务记录列表
GET /api/money/log - 提现记录
POST /api/money/withdraw - 申请提现

8. 💳 收款方式模块 (3个页面)

页面	路径	文件	大小	说明
收款方式	`/pages/sub-pages/my-payee/index`	pages-sub-pages-my-payee-index.003c7ba7.js	5.5K	收款方式列表
支付宝详情	`/pages/sub-pages/my-payee/zfb-detail`	pages-sub-pages-my-payee-zfb-detail.1d2283db.js	14K	支付宝绑定
银联详情	`/pages/sub-pages/my-payee/yl-detail`	pages-sub-pages-my-payee-yl-detail.1631426a.js	14K	银行卡绑定

功能:

支付宝绑定
银行卡绑定
查看收款方式

API 调用:

GET /api/alipay/index - 获取支付宝信息
POST /api/alipay/bind - 绑定支付宝
GET /api/bank/index - 获取银行卡信息

9. 👥 推广模块 (3个页面)

页面	路径	文件	大小	说明
邀请好友	`/pages/sub-pages/invite/index`	pages-sub-pages-invite-index.86b6c14d.js	23K	邀请推广页
我的粉丝	`/pages/sub-pages/my-fans/index`	pages-sub-pages-my-fans-index.030b9f6a.js	14K	粉丝列表
推广奖励	`/pages/sub-pages/promote-prize/index`	pages-sub-pages-promote-prize-index.710193f9.js	5.4K	推广奖励

功能:

生成邀请码
分享推广链接
查看粉丝列表
查看团队数据
推广收益

API 调用:

GET /api/share/index - 分享首页数据
GET /api/share/select - 我的粉丝列表

10. 📄 协议模块 (4个页面)

页面	路径	文件	大小	说明
协议列表	`/pages/sub-pages/agreement/index`	pages-sub-pages-agreement-index.8810033d.js	15K	协议列表
合同协议	`/pages/sub-pages/agreement/contract`	pages-sub-pages-agreement-contract.9e663c22.js	5.6K	合同详情
合同协议1	`/pages/sub-pages/agreement/contract1`	pages-sub-pages-agreement-contract1.203c29f5.js	6.1K	合同详情1
我的合同	`/pages/sub-pages/agreement/my-contract`	pages-sub-pages-agreement-my-contract.c001c026.js	1.7K	我的合同

功能:

用户协议
隐私政策
合同管理

11. ⚙️ 设置模块 (2个页面)

页面	路径	文件	大小	说明
设置页	`/pages/sub-pages/setting/index`	pages-sub-pages-setting-index.c3f6e7dd.js	24K	系统设置
404页面	`/pages/sub-pages/setting/404`	pages-sub-pages-setting-404.9c54b0c0.js	2.5K	404错误页

功能:

账号设置
关于我们
退出登录

12. 🌐 WebView模块 (3个页面)

页面	路径	文件	大小	说明
WebView页	`/pages/sub-pages/webview/index`	pages-sub-pages-webview-index.1042489b.js	2.2K	WebView容器
签名页	`/pages/sub-pages/webview/sign`	pages-sub-pages-webview-sign.7a3d2cf7.js	1.6K	电子签名
签名预览	`/pages/sub-pages/webview/sign-preview`	pages-sub-pages-webview-sign-preview.5b79b68b.js	1.9MB	签名预览

功能:

H5页面加载
电子签名
PDF预览

注意: sign-preview 文件很大（1.9MB），可能包含了 PDF.js 等第三方库

🔧 三、共享模块

Chunk 文件分析

文件	大小	说明
chunk-vendors.4d47960d.js	1.1MB	第三方依赖库（Vue、Vuex等）
index.6d11616b.js	281KB	主入口文件 v1
index.8bc32d98.js	281KB	主入口文件 v2

共享页面模块

文件	大小	共享页面
pages-index-index~~pages-personal-index~~pages-rushing-detail~~pages-rushing-index~~pages-sub-pages-addr~7968e06c.70e5101c.js	54K	首页、个人中心、抢购等5+页面共享
pages-rushing-detail~~pages-sub-pages-balance-index~~pages-sub-pages-coupon-index~~pages-sub-pages-my-f~~58831170.24d2e61d.js	150K	财务相关页面共享
pages-sub-pages-address-detail~~pages-sub-pages-login-change-pwd~~pages-sub-pages-login-index~~pages-su~~3512e57f.c121044a.js	26K	登录、地址等页面共享
pages-sub-pages-login-change-pwd~~pages-sub-pages-login-register~~pages-sub-pages-login-reset-account.55514425.js	12K	登录模块页面共享
pages-rushing-detail~pages-rushing-index.4a3094d6.js	21K	抢购页面共享
pages-index-index~pages-sub-pages-search-index.5679d08c.js	12K	首页、搜索页面共享
pages-rushing-detail~~pages-sub-pages-balance-index~~pages-sub-pages-coupon-index~~pages-sub-pages-priz~~0d2429df.1e72eb65.js	11K	财务相关共享
pages-sub-pages-agreement-contract~~pages-sub-pages-agreement-contract1~~pages-sub-pages-agreement-index.d5a97a47.js	37K	协议页面共享
pages-sub-pages-rushing-order-detail~pages-sub-pages-rushing-order-index.54c3c947.js	12K	抢购订单共享

📊 四、页面功能矩阵

按功能分类

功能模块	页面数量	主要页面
用户认证	5	登录、注册、修改密码、用户信息、设置
商品浏览	3	首页、商品详情、搜索
抢购交易	2	抢购列表、抢购详情
订单管理	3	商城订单、抢购订单列表、抢购订单详情
地址管理	2	地址列表、地址详情
财务管理	5	分红、优惠券、提现、提现记录、奖品
收款设置	3	收款方式、支付宝、银行卡
推广营销	3	邀请好友、我的粉丝、推广奖励
协议合同	4	协议列表、合同、我的合同
其他功能	6	个人中心、设置、404、WebView等
总计	36+	-

🎯 五、核心业务流程

1. 用户注册登录流程

访问网站
  ↓
注册/登录 (/pages/sub-pages/login/index)
  ↓
发送验证码 (POST /api/sms/send)
  ↓
注册/登录 (POST /api/user/register | POST /api/user/login)
  ↓
获取Token
  ↓
进入首页 (/pages/index/index)

2. 抢购交易流程

首页浏览 (/pages/index/index)
  ↓
进入抢购 (/pages/rushing/index)
  ↓
查看可购买商品 (GET /api/order/goods)
  ↓
抢单 (POST /api/order/buy)
  ↓
选择地址 (/pages/sub-pages/address/index)
  ↓
支付订单 (POST /api/order/pay)
  ↓
卖家确认发货 (POST /api/order/confirm)
  ↓
订单完成
  ↓
分红到账

3. 提现流程

个人中心 (/pages/personal/index)
  ↓
查看余额 (/pages/sub-pages/balance/index)
  ↓
设置收款方式 (/pages/sub-pages/my-payee/index)
  ├─ 支付宝 (/pages/sub-pages/my-payee/zfb-detail)
  └─ 银行卡 (/pages/sub-pages/my-payee/yl-detail)
  ↓
申请提现 (/pages/sub-pages/withdraw/index)
  ↓
提交申请 (POST /api/money/withdraw)
  ↓
查看提现记录 (/pages/sub-pages/withdraw/list)

4. 推广流程

个人中心 (/pages/personal/index)
  ↓
邀请好友 (/pages/sub-pages/invite/index)
  ↓
生成邀请码/链接 (GET /api/share/index)
  ↓
分享给好友
  ↓
好友注册
  ↓
查看粉丝 (/pages/sub-pages/my-fans/index)
  ↓
获取推广收益

📱 六、导航结构

底部导航栏（推测）

位置	页面	图标	说明
1	首页	🏠	/pages/index/index
2	抢购	🎯	/pages/rushing/index
3	订单	📦	/pages/sub-pages/rushing-order/index
4	我的	👤	/pages/personal/index

个人中心菜单（推测）

个人中心
├── 👤 个人信息
├── 📦 我的订单
│   ├── 买方仓库
│   └── 卖方仓库
├── 💰 财务管理
│   ├── 分红余额
│   ├── 优惠券
│   ├── 自购分红
│   └── 提现
├── 👥 推广中心
│   ├── 邀请好友
│   ├── 我的粉丝
│   └── 推广奖励
├── 💳 收款方式
│   ├── 支付宝
│   └── 银行卡
├── 📍 收货地址
├── 📄 协议合同
└── ⚙️ 设置

💾 七、文件大小分析

超大文件（>100KB）

文件	大小	说明	原因
pages-sub-pages-webview-sign-preview	1.9MB	签名预览	包含 PDF.js 等库
chunk-vendors	1.1MB	第三方依赖	Vue、Vuex、uni-app等
index (两个版本)	281KB×2	主入口	应用核心代码
pages-sub-pages-address-detail	171KB	地址详情	包含省市区数据
pages-rushing-detail~...~58831170	150KB	共享模块	多页面共享代码

优化建议

PDF 库按需加载: sign-preview 文件过大，建议使用CDN或懒加载
地区数据优化: address-detail 包含完整地区数据，可考虑API动态加载
代码分割: 进一步优化 chunk 分割，减少首屏加载
图片优化: 检查是否有图片被打包进JS

🔍 八、技术栈分析

前端框架

uni-app: 跨平台开发框架
Vue.js: 核心框架
Vuex: 状态管理

第三方库（从 chunk-vendors 推测）

Vue Router
Axios（HTTP请求）
PDF.js（PDF预览）
可能的UI库（推测为 uni-ui 或其他）

构建工具

Webpack（根据chunk命名规则）
Babel（ES6转译）

📋 九、路由配置参考

// pages.json (推测)
{
  "pages": [
    // 主包页面
    {
      "path": "pages/index/index",
      "style": { "navigationBarTitleText": "首页" }
    },
    {
      "path": "pages/personal/index",
      "style": { "navigationBarTitleText": "个人中心" }
    },
    {
      "path": "pages/rushing/index",
      "style": { "navigationBarTitleText": "抢购" }
    },
    {
      "path": "pages/rushing/detail",
      "style": { "navigationBarTitleText": "抢购详情" }
    }
  ],
  "subPackages": [
    {
      "root": "pages/sub-pages",
      "pages": [
        // 登录模块
        "login/index",
        "login/register",
        "login/reset-account",
        "login/change-pwd",
        
        // 用户信息
        "user-info/index",
        
        // 地址管理
        "address/index",
        "address/detail",
        
        // 商品
        "good/good-detail",
        
        // 搜索
        "search/index",
        
        // 订单
        "shop-order/index",
        "rushing-order/index",
        "rushing-order/detail",
        
        // 财务
        "balance/index",
        "coupon/index",
        "withdraw/index",
        "withdraw/list",
        "prize/index",
        
        // 收款方式
        "my-payee/index",
        "my-payee/zfb-detail",
        "my-payee/yl-detail",
        
        // 推广
        "invite/index",
        "my-fans/index",
        "promote-prize/index",
        
        // 协议
        "agreement/index",
        "agreement/contract",
        "agreement/contract1",
        "agreement/my-contract",
        
        // 设置
        "setting/index",
        "setting/404",
        
        // WebView
        "webview/index",
        "webview/sign",
        "webview/sign-preview"
      ]
    }
  ],
  "tabBar": {
    "list": [
      {
        "pagePath": "pages/index/index",
        "text": "首页"
      },
      {
        "pagePath": "pages/rushing/index",
        "text": "抢购"
      },
      {
        "pagePath": "pages/sub-pages/rushing-order/index",
        "text": "订单"
      },
      {
        "pagePath": "pages/personal/index",
        "text": "我的"
      }
    ]
  }
}

📊 十、页面与API映射表

页面	主要API
首页	/api/index/banner, /api/index/get, /api/goods/category, /api/goods/list
个人中心	/api/user/info
抢购列表	/api/order/goods, /api/order/index
抢购详情	/api/goods/detail
登录	/api/user/login
注册	/api/user/register, /api/sms/send
用户信息	/api/user/info, /api/user/nickname
地址管理	/api/address/list, /api/address/insert, /api/address/update, /api/address/delete
订单列表	/api/order/list
订单详情	/api/order/detail, /api/order/pay, /api/order/confirm
分红余额	/api/money/list?cate=1
优惠券	/api/money/list?cate=2
提现	/api/money/withdraw
支付宝	/api/alipay/index, /api/alipay/bind
银行卡	/api/bank/index
邀请好友	/api/share/index
我的粉丝	/api/share/select

📝 十一、总结

项目特点

功能完整: 涵盖电商、社交分享、财务管理等多个模块
分包加载: 使用 uni-app 分包机制，优化加载性能
代码复用: 通过 chunk 共享模块减少代码冗余
业务清晰: 模块划分明确，易于维护

技术亮点

✅ uni-app 跨平台开发
✅ 分包加载优化
✅ 共享模块复用
✅ 完整的业务闭环
✅ 三级分红体系

改进建议

性能优化:
- sign-preview (1.9MB) 文件过大，建议CDN加载
- address-detail (171KB) 地区数据可API动态获取
代码优化:
- 进一步细化代码分割
- 考虑按需加载第三方库
用户体验:
- 添加骨架屏
- 优化首屏加载速度

📚 相关文档

文档生成时间: 2025-11-08
文档版本: v1.0
分析工具: Cursor AI + JS文件分析

22 KiB Raw Permalink Blame History Unescape Escape

H5商城网站页面结构分析

📊 统计概览

🗂️ 页面结构树

📱 一、主要页面（3个）

1. 首页模块

2. 个人中心模块

3. 抢购模块

📄 二、子页面模块（18个模块，36+页面）

1. 🔐 用户登录模块 (4个页面)

2. 👤 用户信息模块 (1个页面)

3. 📍 地址管理模块 (2个页面)

4. 🛍️ 商品模块 (1个页面)

5. 🔍 搜索模块 (1个页面)

6. 📦 订单模块 (3个页面)

7. 💰 财务模块 (5个页面)

8. 💳 收款方式模块 (3个页面)

9. 👥 推广模块 (3个页面)

10. 📄 协议模块 (4个页面)

11. ⚙️ 设置模块 (2个页面)

12. 🌐 WebView模块 (3个页面)

🔧 三、共享模块

Chunk 文件分析

共享页面模块

📊 四、页面功能矩阵

按功能分类

🎯 五、核心业务流程

1. 用户注册登录流程

2. 抢购交易流程

3. 提现流程

4. 推广流程

📱 六、导航结构

底部导航栏（推测）

个人中心菜单（推测）

💾 七、文件大小分析

超大文件（>100KB）

优化建议

🔍 八、技术栈分析

前端框架

第三方库（从 chunk-vendors 推测）

构建工具

📋 九、路由配置参考

📊 十、页面与API映射表

📝 十一、总结

项目特点

技术亮点

改进建议

📚 相关文档

22 KiB

Raw Permalink Blame History