# 迎宾巡逻安防机器人机身屏前端项目 基于 Vue3 + Vite 构建的机器人屏幕端交互系统。 ## 技术栈 - Vue 3 - Vite 5 - Vue Router 4 - Pinia 2 ## 快速开始 ```bash # 安装依赖 npm install # 开发模式 npm run dev # 构建生产版本 npm run build # 预览构建结果 npm run preview ``` ## 项目结构 ``` src/ ├── api/ # API 封装层 ├── assets/ # 静态资源 │ └── styles/ # 全局样式 ├── components/ # 通用组件 ├── layouts/ # 页面布局 ├── mock/ # Mock 数据 ├── router/ # 路由配置 ├── stores/ # Pinia 状态管理 ├── utils/ # 工具函数 ├── views/ # 页面视图 │ ├── idle/ # 待机展示 │ ├── menu/ # 主菜单 │ ├── visitor/ # 访客登记 │ ├── navigation/ # 路线引导 │ ├── notice/ # 通知公告 │ ├── call-staff/ # 呼叫工作人员 │ ├── recognition/ # 识别结果 │ └── system/ # 系统信息 ├── App.vue └── main.js ``` ## 页面路由 | 路径 | 页面 | |------|------| | / | 重定向到 /idle | | /idle | 待机展示页 | | /menu | 主菜单页 | | /visitor | 访客登记首页 | | /visitor/appointment | 预约核验页 | | /visitor/appointment-confirm | 预约确认页 | | /visitor/walk-in | 现场登记页 | | /visitor/success | 登记成功页 | | /recognition/result | 识别结果页 | | /navigation | 路线引导页 | | /navigation/status | 导航状态页 | | /notice | 通知公告页 | | /call-staff | 呼叫工作人员页 | | /system-info | 系统信息页(长按 Logo 进入) | ## 设计参考 详见 `robot_screen_design_doc.html`