邮轮穿舱件管理系统-小程序端文件结构文档
项目概述
邮轮穿舱件管理系统是一个基于微信小程序平台开发的管理系统，主要用于邮轮穿舱件的任务管理、用户管理和信息展示。项目采用UniApp框架开发，支持微信小程序环境运行。
参考文件：
目录结构分析
1. 根目录结构
├── LICENSE # 开源许可证文件
├── README.md # 项目说明文档
├── api/ # API接口模块
├── app.js # 小程序入口文件
├── app.json # 小程序配置文件
├── app.less # 全局样式文件
├── behaviors/ # 行为模块
├── codebases/ # 代码库文件
├── components/ # 组件库
├── config/ # 配置模块
├── config.js # 配置文件
├── custom-tab-bar/ # 自定义底部导航栏
├── docs/ # 文档目录
├── errors.log # 错误日志文件
├── git_docs/ # Git文档
├── package-lock.json # 包锁定文件
├── package.json # 项目依赖配置
├── pages/ # 页面目录
├── project.config.json # 项目配置文件
├── project.private.config.json # 私有项目配置
├── sitemap.json # 站点地图
├── static/ # 静态资源
└── utils/ # 工具函数库
2. 核心模块详细分析
2.1 应用入口模块 (app.js)
职责： 小程序全局应用实例，负责应用生命周期管理和全局状态管理。
核心功能：
- 应用启动初始化
- 全局事件总线管理
- WebSocket连接管理
- 未读消息数量管理
依赖关系：
- 导入
./utils/eventBus事件总线模块 - 依赖微信小程序API：
wx.getUpdateManager(),wx.showModal()
关键代码片段：
App({
onLaunch() {
// 应用启动逻辑
this.connect();
},
globalData: {
userInfo: null,
unreadNum: 0,
socket: null,
},
eventBus: createBus(),
});
参考文件：
2.2 应用配置模块 (app.json)
职责： 定义小程序页面结构、导航配置、权限设置等。
核心配置：
- 主包页面配置（首页、任务页、搜索页、个人中心）
- 分包配置（支持模块、工件详情、绑定用户等）
- 自定义底部导航栏
- 网络超时设置
- 位置权限配置
分包结构：
"subpackages": [
{
"root": "pages/support",
"name": "support",
"pages": ["index"]
},
// ... 其他分包配置
]
参考文件：
2.3 API接口模块 (api/)
文件结构：
api/
├── bindUser.js # 用户绑定接口
└── request.js # 网络请求封装
request.js 核心功能：
- 统一的HTTP请求封装
- Token自动管理
- Mock数据支持
- 错误处理机制
依赖关系：
- 导入
~/config配置模块 - 依赖微信小程序API：
wx.request(),wx.getStorageSync()
关键代码：
function request(url, method = 'GET', data = {}) {
const header = {
'content-type': 'application/json',
};
const tokenString = wx.getStorageSync('access_token');
if (tokenString) {
header.Authorization = `Bearer ${tokenString}`;
}
// ... 请求逻辑
}
参考文件：
2.4 工具函数库 (utils/)
文件结构：
utils/
├── crypto.js # 加密工具
├── eventBus.js # 事件总线
└── util.js # 通用工具函数
eventBus.js 核心功能：
- 发布-订阅模式实现
- 事件监听和管理
- 内存泄漏防护
关键代码：
export default function createBus() {
return {
events: {},
on(event, callback) {
if (!this.events[event]) this.events[event] = [];
this.events[event].push(callback);
},
// ... 其他方法
};
}
参考文件：
2.5 组件库 (components/)
文件结构：
components/
├── card/ # 卡片组件
│ ├── index.js
│ ├── index.json
│ ├── index.less
│ └── index.wxml
└── nav/ # 导航组件
├── index.js
├── index.json
├── index.less
└── index.wxml
nav组件功能：
- 侧边栏导航管理
- 页面路由跳转
- 状态栏高度适配
参考文件：
2.6 页面模块 (pages/)
主要页面结构：
pages/
├── home/ # 首页
├── taskPage/ # 任务页面
├── searchPage/ # 搜索页面
├── my/ # 个人中心
├── login/ # 登录页面
├── message/ # 消息页面
└── ... 其他功能页面
首页 (home/index.js) 核心功能：
- 统计数据展示
- 文章列表管理
- 用户登录状态判断
- 导航功能集成
参考文件：
依赖关系图
1. 模块依赖关系图
flowchart TD
A[app.js] --> B[utils/eventBus.js]
A --> C[api/request.js]
C --> D[config/index.js]
E[pages/home/index.js] --> C
E --> F[tdesign-miniprogram]
G[components/nav/index.js] --> H[微信小程序API]
subgraph 核心模块
A
C
B
end
subgraph 页面模块
E
I[其他页面]
end
subgraph 第三方依赖
F
H
end
B --> E
C --> E
2. 数据流关系图
sequenceDiagram
participant U as 用户
participant P as 页面组件
participant A as app.js
participant API as API模块
participant WX as 微信平台
U->>P: 用户操作
P->>A: 触发全局事件
A->>API: 发起网络请求
API->>WX: 调用微信API
WX->>API: 返回数据
API->>A: 处理响应
A->>P: 更新页面状态
P->>U: 更新界面显示
3. 组件调用关系图
flowchart LR
A[首页] --> B[导航组件]
A --> C[卡片组件]
B --> D[任务页面]
B --> E[搜索页面]
B --> F[个人中心]
C --> G[文章详情]
style A fill:#e1f5fe
style B fill:#f3e5f5
style C fill:#e8f5e8
架构设计模式
1. 事件驱动架构
系统采用事件总线模式实现组件间通信，通过 eventBus 模块实现松耦合的组件交互。
事件类型：
unread-num-change: 未读消息数量变化- 其他自定义业务事件
2. 分层架构设计
表示层 (UI层)
├── 页面组件 (pages/)
├── 通用组件 (components/)
│
业务逻辑层
├── API服务 (api/)
├── 工具函数 (utils/)
│
数据层
├── 本地存储
├── 网络请求
│
基础设施层
├── 微信小程序平台
├── 第三方组件库
3. 分包加载策略
采用微信小程序分包机制，将功能模块按业务维度拆分，优化首屏加载性能。
分包策略：
- 主包：核心功能（首页、导航）
- 分包：业务功能（支持、详情、设置等）
关键技术特性
1. 网络请求优化
- 统一的请求拦截器
- 自动Token管理
- Mock数据支持
- 错误重试机制
2. 状态管理
- 全局状态 (
globalData) - 事件驱动的状态更新
- 本地存储同步
3. 组件化开发
- 可复用的UI组件
- 样式隔离配置
- 自定义组件生命周期
索引
邮轮穿舱件管理系统小程序端采用了模块化、组件化的架构设计，具有良好的可维护性和扩展性。通过事件总线和分层架构实现了松耦合的组件通信，分包策略优化了应用性能。系统集成了完整的用户管理、任务管理和信息展示功能，为邮轮穿舱件管理提供了便捷的移动端解决方案。
主要技术栈：
- 开发框架：UniApp
- UI组件库：TDesign MiniProgram
- 构建工具：HBuilderX
- 目标平台：微信小程序
该架构设计充分考虑了小程序平台的特性和限制，在保证功能完整性的同时，优化了用户体验和开发效率。