当前位置：首页 > news >正文

ThinkPHP+Uniapp实战：如何从零搭建一个企业级设备巡检小程序（附源码）

news 2026/5/12 15:15:40

ThinkPHP+Uniapp实战：从零构建企业级设备巡检小程序的完整指南

在数字化转型浪潮中，移动端设备巡检系统正成为工业4.0时代的基础设施。本文将手把手带你用ThinkPHP6和Uniapp打造一个专业级解决方案，涵盖从环境配置到源码优化的全流程实战经验。

1. 开发环境与项目初始化

1.1 技术栈选型解析

现代巡检系统开发需要兼顾后台稳定性和移动端灵活性。我们的技术组合方案：

后端框架：ThinkPHP6.0（API开发模式）
前端框架：Uniapp（Vue3+TypeScript）
数据库：MySQL8.0（支持JSON字段）
缓存系统：Redis7.0
接口规范：RESTful+JWT鉴权

提示：建议使用Docker统一开发环境，避免"在我机器上能跑"的问题

1.2 项目目录结构规划

规范的目录结构是大型项目的基础，推荐如下组织方式：

/device-inspection ├── /app # ThinkPHP应用核心 │ ├── /controller # API控制器 │ ├── /service # 业务逻辑层 │ └── /model # 数据模型 ├── /uniapp # 前端项目 │ ├── /pages # 页面组件 │ ├── /store # Pinia状态管理 │ └── /api # 接口封装 ├── /config # 配置文件 └── /database # 数据库迁移文件

初始化ThinkPHP项目命令：

composer create-project topthink/think inspection-api cd inspection-api php think multi-app:create api

2. 数据库设计与业务建模

2.1 核心表结构设计

设备巡检系统的数据模型需要支持复杂业务流程，主要包含以下表：

表名	关键字段	索引设计
inspection_task	task_id, plan_id, status, user_id	(plan_id, status)联合索引
inspection_point	point_id, area_id, geofence	GIST空间索引
check_item	item_id, point_id, value_type	(point_id)外键索引
work_order	order_id, task_id, emergency	多列覆盖索引

建表示例SQL：

CREATE TABLE `inspection_plan` ( `plan_id` int(10) UNSIGNED NOT NULL AUTO_INCREMENT, `route_id` int(10) NOT NULL COMMENT '巡检路线', `cycle_type` enum('daily','weekly','monthly') NOT NULL, `time_ranges` json DEFAULT NULL COMMENT '时间段配置', `created_at` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP, PRIMARY KEY (`plan_id`), KEY `idx_route` (`route_id`) ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;

2.2 业务服务层实现

采用DDD领域驱动设计，在Service层封装核心业务逻辑：

class InspectionService { // 生成周期性巡检任务 public function generateTasks(int $planId): array { $plan = InspectionPlan::with('route.points')->find($planId); $tasks = []; foreach ($this->getScheduleDates($plan) as $date) { $task = new InspectionTask([ 'plan_id' => $planId, 'scheduled_at' => $date ]); $task->points()->sync($plan->route->points); $tasks[] = $task; } return $tasks; } // 电子围栏验证 public function verifyGeofence(int $pointId, Location $location): bool { $point = InspectionPoint::find($pointId); if (!$point->geofence) return true; return $this->geoService->contains( $point->geofence, $location ); } }

3. 前后端交互关键实现

3.1 安全接口设计方案

采用JWT+RBAC实现企业级安全控制：

鉴权流程：
- 员工工号+密码登录获取token
- 每次请求携带Authorization头
- 服务端验证token有效性及权限
接口限流配置（在app/middleware.php）：

return [ // API请求频率限制 'throttle' => [ 'type' => 'Counter', 'key' => 'api_ratelimit_{:uid}', 'fill' => 1, // 令牌生成速率 'capacity' => 10, // 最大容量 'wait' => 10, // 超时时间 ] ];

3.2 Uniapp端核心功能实现

巡检任务列表页的关键代码示例：

<script setup lang="ts"> const loadTasks = async (status: TaskStatus) => { const { data } = await api.get('/tasks', { params: { status, page: pagination.value.page, size: pagination.value.size } }); taskList.value = data.list; pagination.value.total = data.total; }; // 地图集成示例 const initMap = () => { uni.createMapContext('inspectionMap').includePoints({ points: routePoints.value, padding: [20, 20, 20, 20] }); }; </script>

4. 高级功能与性能优化

4.1 离线巡检模式实现

针对无网络环境的关键技术方案：

Service Worker缓存策略：

// uniapp/service-worker.js self.addEventListener('fetch', (event) => { event.respondWith( caches.match(event.request) .then(response => response || fetch(event.request)) ); });

IndexedDB本地存储：

// 巡检数据本地保存 const saveInspectionResult = async (data: InspectionData) => { await db.transaction('rw', db.results, () => { db.results.put(data); }); };

4.2 性能优化实战技巧

后端API响应速度优化方案：

优化手段	实施方法	预期效果
OPcache预编译	php.ini中启用opcache.save_comments	提升30%执行效率
数据库查询优化	使用Eloquent的chunk方法处理大数据	内存占用降低70%
接口缓存策略	Redis缓存热点数据+标签管理	QPS提升5倍
图片资源优化	使用WebP格式+CDN分发	带宽节省40%

ThinkPHP查询优化示例：

// 避免N+1查询问题 $tasks = InspectionTask::with(['plan.route.points.items']) ->where('status', 'pending') ->chunk(100, function ($tasks) { // 批量处理逻辑 });

5. 项目部署与监控

5.1 生产环境部署方案

推荐使用Docker-Compose编排服务：

version: '3' services: app: build: ./api ports: - "8000:8000" depends_on: - redis - mysql environment: DB_HOST: mysql mysql: image: mysql:8.0 volumes: - db_data:/var/lib/mysql environment: MYSQL_ROOT_PASSWORD: ${DB_PASSWORD} redis: image: redis:7.0-alpine ports: - "6379:6379"

5.2 监控与日志方案

企业级监控系统配置要点：

应用性能监控：
- 使用ThinkPHP的trace功能
- 集成Prometheus+Grafana

日志收集架构：

应用日志 -> Filebeat -> Logstash -> Elasticsearch -> Kibana

关键指标监控SQL示例：

-- 巡检任务完成率统计 SELECT DATE(created_at) AS day, COUNT(*) AS total, SUM(CASE WHEN status = 'completed' THEN 1 ELSE 0 END) AS completed, ROUND(100.0 * SUM(CASE WHEN status = 'completed' THEN 1 ELSE 0 END) / COUNT(*), 2) AS completion_rate FROM inspection_task GROUP BY day ORDER BY day DESC;

6. 源码架构解析

项目采用分层架构设计，主要模块交互关系：

表示层(Uniapp) -> 应用层(API) -> 领域层(Service) -> 基础设施层(Model/Repository)

典型API控制器代码结构：

class TaskController { #[Route('GET', 'tasks')] public function index(TaskListRequest $request) { $data = $this->taskService->paginateTasks( $request->validated() ); return json_success($data); } #[Route('POST', 'tasks/{id}/complete')] public function complete(int $id, CompleteRequest $request) { $this->taskService->completeTask( $id, $request->input('results') ); return json_success(); } }

在实际项目中，我们遇到最棘手的问题是电子围栏的精度问题。通过引入Turf.js进行客户端预校验，再结合服务端的PostGIS空间计算，最终将误报率控制在0.5%以下。

查看全文

http://www.jsqmd.com/news/540485/