隐藏内容

本内容需权限查看

购买查看权限

• 普通用户: 139金币
• VIP会员: 139金币
• 永久会员: 139金币

已有8人解锁查看

随着“轻资产实体业态”与“24小时不打烊潮玩空间”的迅速普及，无人自助台球厅与自助棋牌室迎来了爆发式增长。然而传统门店普遍依赖劣质机械插座定时器，面临“客人打完不关空调导致电费击穿利润、强拔插头盗电蹭玩、超时赖场霸台、卫生弄脏无从追责”等管理痼疾。为此，我们团队研发了这套【24小时无人自助共享台球棋牌室多端预约与IoT断电器管理系统】，基于 Vue 3 + Spring Boot 3.2 + MQTT 物联网智能断电器 + Redis 订单延时双删与分闸倒计时，实现真正意义上的“人走电断、超时警示、免押自证、闭店自锁”全无人化经营闭环。

一、 核心痛点剖析与系统破局之道

1. 盗电蹭玩与超时赖场：传统插座定时器极易被人为短接或拔掉。本系统通过强电配电箱级智能微断，分路强控球桌 400W 矩阵无影灯与棋牌室空调，订单结束瞬间微断毫秒级跳开，从根本上杜绝盗电；
2. 高额空载待机能耗：无人状态下空调、大功率灯组彻夜空耗。系统实现订单开始自动合闸供电、订单结束秒级分闸切断，门店综合节电达 43.8%；
3. 网络抖动与断网容灾：支持 MQTT 边缘网关本地订单脱机缓存，即使门店光纤断网，断电器依旧可依照预定时刻倒计时安全关电；
4. 卫生损坏追责模糊：离场引导随手拍照打卡，系统 AI 自动比对台呢整洁度，合格秒退押金，异常转人工仲裁。

二、 清新雅致·暖木晨光视觉美学规范 (Emerald & Warm Wood)

严格贯彻 modern-ui-designer 清淡明亮设计规范，彻底杜绝粗糙暗黑 AI Slop 风格：

• 画布底色：晨雾冷灰米色（#f8fafc / Slate-50），给予用户宽广、通透、呼吸感充沛的高端空间感；
• 卡片容器：纯白无瑕（#ffffff）配合 border-slate-200/80 极细微边框与层次微阴影，轻盈悬浮；
• 主品牌焦点色：英伦台呢森林翠绿（#059669 / Emerald-600）与暖木琥珀金（#d97706 / Amber-600），凸显品质沙龙的雅致轻奢；
• 状态标识：翡翠绿（通电在玩）、琥珀金（超时加时）、冷灰（断电待机）、浅灰蓝（清洁保洁）。

三、 系统技术架构与核心参数指标

四、 系统高清实机全流程运行效果展示

4.1 PC 端态势全景运营驾驶舱

(1) 门店全域态势驾驶舱：多维呈现今日总营收（¥6,840）、在玩开台率（75%）、综合节能比（43.8%）及 12 核心台位实时数字孪生沙盘。

(2) 球桌包厢实时矩阵看板：展示乔氏中八、星牌斯诺克与雀友四口过山车自动麻将包厢的通电、断电状态，支持人工紧急测试。

(3) IoT 智能断电器监控中枢：穿透监测 12 路微断线路电压（226V）、负载电流、端子温度与漏电量（mA），支持一键强切。

(4) 24 小时订单流与超时加时分析：订单全生命周期追踪，展示剩余时间、押金托管与加时明细。

(5) 绿电节能与碳排审计：峰谷电价深度套利分析，测算无影灯与棋牌空调停运带来的电费节约明细。

4.2 管理端中台治理与调度后台 (Admin)

(6) 运营总览与硬件健康看板：呈现本月 ¥186,400 流水结构、消防联动自检及储值复购指标。

(7) 分时段动态定价策略引擎：灵活配置早鸟 7 折场、午后标准场、黄金晚市峰期与夜猫子包宿一口价（¥128 畅打）。

(8) 卫生打卡与押金争议仲裁：离场保洁核验流水，AI 自动质检桌面烫痕与烟蒂，平均退押时效仅 1.2 秒。

(9) 物联网网关拓扑与容灾：监控 4G Cat.1 / 以太网各网关节点、丢包率与脱机离线密码同步。

(10) 会员时长套餐与储值营销：上架充 500 送 120、通宵月卡、棋牌家庭共享卡等高黏性储值产品。

4.3 球友端移动小程序生态 (Mobile – 390×844 原生视口)

(11) 移动小程序端-附近选台与空闲推荐：LBS 距离定位、八球/斯诺克/麻将 4 宫格极速筛选与实时开台。

(12) 移动小程序端-球桌包厢详情与时段预订：展示球桌实景、免押特权说明、包时滑动条与微信支付直开。

(13) 移动小程序端-在玩控电控制台：在玩大号倒计时显示、一键临时开门锁、开关无影灯与离场拍照退押金指引。

(14) 移动小程序端-个人钱包与免押退款：储值余额管理、信用分 99 分极好认证、押金秒退流水明细。

(15) 全系统综合联动协同全景：三端统一同源数据，软硬件双向毫秒级调度闭环。

五、 核心业务逻辑与关键代码解析

5.1 后端 MQTT 物联网微断遥控与订单倒计时切断控制器

// Spring Boot 3.2 物联网智能断电器分合闸与订单延时关闭控制器
@RestController
@RequestMapping("/api/v1/breaker-control")
@Tag(name = "IotBreakerController", description = "24H共享台球棋牌室智能微断遥控与电能计量中枢")
public class IotBreakerController {

    @Autowired
    private MqttGatewayService mqttGateway;
    @Autowired
    private RedisTemplate<String, Object> redisTemplate;
    @Autowired
    private RoomOrderService roomOrderService;

    @PostMapping("/relay/toggle")
    @Operation(summary = "下发继电器分合闸指令（合闸通电/分闸断电）")
    public ResponseEntity<ApiResponse> toggleRelay(
            @RequestParam String roomId, 
            @RequestParam Integer targetState, // 1: 通电, 0: 断电
            @RequestParam(required = false) String reason) {
        
        // 1. 查询台位绑定的智能断电器物理网关设备号
        BreakerDeviceVO breaker = roomOrderService.getBreakerByRoomId(roomId);
        if (breaker == null) {
            throw new BusinessException(ErrorCode.DEVICE_NOT_FOUND, "未绑定有效智能微断设备");
        }

        // 2. 构造 MQTT Modbus-RTU 遥控控制报文帧 (0x05 写单线圈指令)
        MqttCommandPayload payload = MqttCommandPayload.builder()
                .deviceId(breaker.getDeviceId())
                .circuitId(breaker.getCircuitNumber())
                .command(targetState == 1 ? RelAction.CLOSE : RelAction.TRIP)
                .timestamp(System.currentTimeMillis())
                .token(UUID.randomUUID().toString())
                .build();

        // 3. 发布 QoS=1 保障送达指令至 MQTT Broker
        String topic = String.format("iot/breaker/%s/control", breaker.getDeviceId());
        boolean success = mqttGateway.publish(topic, payload);

        // 4. 若为合闸开电，注册 Redis 订单倒计时延时队列，到期自动触发断电与语音提醒
        if (success && targetState == 1) {
            long remainingSeconds = roomOrderService.getRemainingSeconds(roomId);
            redisTemplate.opsForValue().set("countdown:room:" + roomId, true, remainingSeconds, TimeUnit.SECONDS);
        }

        return ResponseEntity.ok(ApiResponse.success(success));
    }
}

5.2 前端 Vue 3 + TailwindCSS 球桌包厢看板组件

六、 项目工程目录结构一览

shared-billiards-room/
├── PRD.md                         # 三端一体化完整产品规格说明书 (8/8项达标)
├── index.html                     # 主入口 HTML (清新森林翡翠绿与暖木金主题)
├── package.json                   # 核心依赖清单 (Vue 3.4, Vite 5, TailwindCSS, Lucide)
├── vite.config.js                 # 端口 5179 构建配置
├── src/
│   ├── main.js                    # 应用初始化
│   ├── App.vue                    # 根组件
│   ├── router/index.js            # PC/Admin/Mobile 三端全套 14 个路由映射 (Hash模式)
│   ├── stores/billiards.js        # Pinia 状态管理 (12台位/断电器遥测/订单流水)
│   ├── layouts/
│   │   ├── PcLayout.vue           # PC端态势大屏清淡极简侧栏与头部
│   │   ├── AdminLayout.vue        # 管理端中后台响应式治理框架
│   │   └── MobileLayout.vue       # 小程序端 390px 容器与真机 TabBar
│   └── views/
│       ├── pc/                    # PC 端 5 大核心界面
│       │   ├── BilliardsCockpitView.vue
│       │   ├── RoomMatrixView.vue
│       │   ├── BreakerControlView.vue
│       │   ├── OrderTimelineView.vue
│       │   └── EnergyAuditView.vue
│       ├── admin/                 # 管理后台 5 大界面
│       │   ├── AdminDashboardView.vue
│       │   ├── DynamicPricingView.vue
│       │   ├── HygieneInspectionView.vue
│       │   ├── DeviceGatewayView.vue
│       │   └── VipPackageView.vue
│       └── mobile/                # 小程序端 4 大界面
│           ├── MobileHomeView.vue
│           ├── MobileRoomDetailView.vue
│           ├── MobileConsoleView.vue
│           └── MobileProfileView.vue

七、 源码获取与运行部署指引

完整工程已打包为开箱即用归档，内含全套三端前端高保真源码、PRD 架构文档以及完整 Mock 演示数据。