大家好我是Java1234_小锋老师分享一套锋哥原创的微信小程序网约车(打车在线叫车移动出行)系统(SpringBoot4Vue3)。项目介绍随着移动互联网与共享出行模式的快速发展网约车已成为城市居民日常出行的重要方式。传统电话召车或路边扬招方式存在信息不对称、匹配效率低、服务过程难追溯等问题。微信小程序具有即用即走、无需安装、传播成本低等优势适合作为网约车业务的移动入口。本文围绕“微信小程序网约车系统”开展需求分析、总体设计、数据库设计与系统实现构建覆盖乘客端、司机端与管理后台的一体化出行服务平台。系统采用前后端分离架构。后端基于Spring Boot构建RESTful接口结合MyBatis-Plus完成数据持久化使用JWT实现多端统一身份认证并通过WebSocket完成订单实时推送与状态同步管理后台采用Vue3、Vite、Element Plus与ECharts实现可视化运营管理乘客端与司机端分别使用微信小程序原生技术开发完成地图叫车、抢单接驾、行程推进、余额支付、评价投诉与个人中心等核心业务。数据库选用MySQL库名为db_taxi相关业务表均以t_为前缀进行规范化设计。论文详细给出了系统功能结构图、实体属性图、实体关系图与关键业务时序图并对每个数据表字段字段名、类型、长度、是否为空、备注进行了完整说明。系统实现章节结合核心代码阐述了登录注册、价格预估、下单派单、并发抢单、余额支付、司机审核与后台统计等关键模块。测试结果表明系统功能完整、流程闭环能够满足本科毕业设计对工程实践与文档规范的要求对同类校园或区域出行平台建设具有一定参考价值。源码下载链接: https://pan.baidu.com/s/1aL90CVm2HeRnpSSug4Rt1Q?pwd1234提取码: 1234系统展示核心代码package com.taxi.controller.app; import com.baomidou.mybatisplus.core.conditions.query.LambdaQueryWrapper; import com.taxi.common.Constants; import com.taxi.common.Result; import com.taxi.dto.*; import com.taxi.entity.*; import com.taxi.interceptor.JwtTokenInterceptor; import com.taxi.mapper.*; import com.taxi.service.DriverService; import com.taxi.service.OrderService; import com.taxi.utils.FileUploadUtil; import com.taxi.vo.LoginVO; import com.taxi.vo.OrderDetailVO; import jakarta.servlet.http.HttpServletRequest; import org.springframework.beans.factory.annotation.Autowired; import org.springframework.web.bind.annotation.*; import org.springframework.web.multipart.MultipartFile; import java.util.List; /** * 司机端小程序控制器 * * author taxi */ RestController RequestMapping(/app/driver) public class AppDriverController { Autowired private DriverService driverService; Autowired private OrderService orderService; Autowired private VehicleMapper vehicleMapper; Autowired private CarTypeMapper carTypeMapper; Autowired private BalanceRecordMapper balanceRecordMapper; Autowired private FileUploadUtil fileUploadUtil; /** 司机登录 */ PostMapping(/login) public ResultLoginVO login(RequestBody LoginDTO dto) { return Result.success(driverService.login(dto)); } /** 司机注册入驻申请 */ PostMapping(/register) public ResultVoid register(RequestBody DriverRegisterDTO dto) { driverService.register(dto); return Result.success(); } /** 获取个人信息 */ GetMapping(/info) public ResultDriver info(HttpServletRequest request) { Long id (Long) request.getAttribute(JwtTokenInterceptor.ATTR_USER_ID); return Result.success(driverService.getInfo(id)); } /** 修改资料 */ PutMapping(/profile) public ResultVoid updateProfile(HttpServletRequest request, RequestBody Driver driver) { Long id (Long) request.getAttribute(JwtTokenInterceptor.ATTR_USER_ID); driverService.updateProfile(id, driver); return Result.success(); } /** 修改密码 */ PutMapping(/password) public ResultVoid updatePassword(HttpServletRequest request, RequestBody PasswordDTO dto) { Long id (Long) request.getAttribute(JwtTokenInterceptor.ATTR_USER_ID); driverService.updatePassword(id, dto); return Result.success(); } /** 上传头像 */ PostMapping(/upload) public ResultString upload(RequestParam(file) MultipartFile file) { return Result.success(fileUploadUtil.upload(file)); } /** 切换工作状态上线/下线 */ PutMapping(/workStatus) public ResultVoid toggleWorkStatus(HttpServletRequest request, RequestParam Integer workStatus) { Long id (Long) request.getAttribute(JwtTokenInterceptor.ATTR_USER_ID); driverService.toggleWorkStatus(id, workStatus); return Result.success(); } /** 获取车辆信息 */ GetMapping(/vehicle) public ResultVehicle vehicle(HttpServletRequest request) { Long id (Long) request.getAttribute(JwtTokenInterceptor.ATTR_USER_ID); Vehicle vehicle vehicleMapper.selectOne(new LambdaQueryWrapperVehicle() .eq(Vehicle::getDriverId, id)); return Result.success(vehicle); } /** 待接订单列表 */ GetMapping(/orders/pending) public ResultListOrderDetailVO pendingOrders() { return Result.success(orderService.pendingOrders()); } /** 抢单 */ PostMapping(/order/accept/{id}) public ResultVoid acceptOrder(HttpServletRequest request, PathVariable Long id) { Long driverId (Long) request.getAttribute(JwtTokenInterceptor.ATTR_USER_ID); orderService.acceptOrder(driverId, id); return Result.success(); } /** 到达乘客位置 */ PostMapping(/order/arrive/{id}) public ResultVoid arriveOrder(HttpServletRequest request, PathVariable Long id) { Long driverId (Long) request.getAttribute(JwtTokenInterceptor.ATTR_USER_ID); orderService.arriveOrder(driverId, id); return Result.success(); } /** 开始行程 */ PostMapping(/order/start/{id}) public ResultVoid startTrip(HttpServletRequest request, PathVariable Long id) { Long driverId (Long) request.getAttribute(JwtTokenInterceptor.ATTR_USER_ID); orderService.startTrip(driverId, id); return Result.success(); } /** 结束行程 */ PostMapping(/order/end/{id}) public ResultVoid endTrip(HttpServletRequest request, PathVariable Long id) { Long driverId (Long) request.getAttribute(JwtTokenInterceptor.ATTR_USER_ID); orderService.endTrip(driverId, id); return Result.success(); } /** 我的订单列表 */ GetMapping(/orders) public ResultListOrderDetailVO orders(HttpServletRequest request, RequestParam(required false) Integer status) { Long id (Long) request.getAttribute(JwtTokenInterceptor.ATTR_USER_ID); return Result.success(orderService.driverOrders(id, status)); } /** 订单详情 */ GetMapping(/order/{id}) public ResultOrderDetailVO orderDetail(PathVariable Long id) { return Result.success(orderService.getOrderDetail(id)); } /** 收入流水 */ GetMapping(/incomeRecords) public ResultListBalanceRecord incomeRecords(HttpServletRequest request) { Long id (Long) request.getAttribute(JwtTokenInterceptor.ATTR_USER_ID); ListBalanceRecord records balanceRecordMapper.selectList( new LambdaQueryWrapperBalanceRecord() .eq(BalanceRecord::getUserId, id) .eq(BalanceRecord::getUserType, Constants.USER_TYPE_DRIVER) .orderByDesc(BalanceRecord::getCreateTime)); return Result.success(records); } }template div classpage-container !-- 统计卡片 -- el-row :gutter20 stylemargin-bottom: 20px el-col :span6 div classstat-card div classstat-label订单总数/div div classstat-value{{ data.totalOrders || 0 }}/div /div /el-col el-col :span6 div classstat-card green div classstat-label乘客总数/div div classstat-value{{ data.totalPassengers || 0 }}/div /div /el-col el-col :span6 div classstat-card orange div classstat-label司机总数/div div classstat-value{{ data.totalDrivers || 0 }}/div /div /el-col el-col :span6 div classstat-card blue div classstat-label总营收(元)/div div classstat-value{{ data.totalRevenue || 0 }}/div /div /el-col /el-row !-- 图表区域 -- el-row :gutter20 el-col :span12 div classchart-card h3近7日订单量/h3 div reforderChartRef styleheight: 300px/div /div /el-col el-col :span12 div classchart-card h3近7日营收/h3 div refrevenueChartRef styleheight: 300px/div /div /el-col /el-row el-row :gutter20 el-col :span12 div classchart-card h3订单状态分布/h3 div refstatusChartRef styleheight: 300px/div /div /el-col el-col :span12 div classchart-card h3司机接单排行/h3 div refrankChartRef styleheight: 300px/div /div /el-col /el-row /div /template script setup import { ref, onMounted, onUnmounted } from vue import * as echarts from echarts import request from /utils/request import { orderStatusMap } from /utils/date const data ref({}) const orderChartRef ref(null) const revenueChartRef ref(null) const statusChartRef ref(null) const rankChartRef ref(null) let charts [] /** 加载统计数据并渲染图表 */ async function loadData() { const res await request.get(/admin/stat/dashboard) data.value res.data // 近7日订单折线图 const orderChart echarts.init(orderChartRef.value) const dailyOrders res.data.dailyOrders || [] orderChart.setOption({ tooltip: { trigger: axis }, xAxis: { type: category, data: dailyOrders.map(i i.date) }, yAxis: { type: value, minInterval: 1 }, series: [{ type: line, data: dailyOrders.map(i i.count), smooth: true, areaStyle: { opacity: 0.3 }, itemStyle: { color: #667eea } }] }) charts.push(orderChart) // 近7日营收柱状图 const revenueChart echarts.init(revenueChartRef.value) const dailyRevenue res.data.dailyRevenue || [] revenueChart.setOption({ tooltip: { trigger: axis }, xAxis: { type: category, data: dailyRevenue.map(i i.date) }, yAxis: { type: value }, series: [{ type: bar, data: dailyRevenue.map(i i.amount), itemStyle: { color: #11998e, borderRadius: [4, 4, 0, 0] } }] }) charts.push(revenueChart) // 订单状态饼图 const statusChart echarts.init(statusChartRef.value) const statusData (res.data.orderStatusDistribution || []).map(i ({ name: orderStatusMap[i.status] || 未知, value: i.count })) statusChart.setOption({ tooltip: { trigger: item }, legend: { bottom: 0 }, series: [{ type: pie, radius: [40%, 70%], data: statusData, emphasis: { itemStyle: { shadowBlur: 10 } } }] }) charts.push(statusChart) // 司机排行横向柱状图 const rankChart echarts.init(rankChartRef.value) const ranking res.data.driverRanking || [] rankChart.setOption({ tooltip: { trigger: axis }, yAxis: { type: category, data: ranking.map(i i.driverName).reverse() }, xAxis: { type: value, minInterval: 1 }, series: [{ type: bar, data: ranking.map(i i.orderCount).reverse(), itemStyle: { color: #f5576c, borderRadius: [0, 4, 4, 0] } }] }) charts.push(rankChart) } onMounted(() loadData()) onUnmounted(() charts.forEach(c c.dispose())) /script