会议室预约微信小程序 (纯前端版)
这是一个基于微信小程序原生框架开发的、纯前端实现的会议室预约系统。它不依赖任何后端服务器或数据库,所有数据都存储在小程序的全局变量中,非常适合用于学习、演示或快速原型开发。
✨ 功能介绍
本项目包含两种角色:普通用户和管理员。
普通用户
- 注册与登录:用户可以注册新账号,并使用账号密码登录。
- 浏览会议室:查看所有可用的会议室及其详细信息(如容量)。
- 提交预约:选择会议室、日期和时间,填写会议主题后提交预约申请。
- 查看我的预约:在"我的"页面可以查看自己所有的预约记录及其审批状态(待审核、已通过、已驳回)。
- 退出登录:可以安全退出当前账号。
管理员
- 专属登录:使用预设的账号
admin和密码admin登录,进入管理员后台。 - 会议室管理:
- 新增会议室:可以添加新的会议室,并设置其名称、容量。
- 删除会议室:可以删除不再使用的会议室。
- 预约审批:
- 查看待审列表:可以查看所有用户提交的、状态为"待审核"的预约申请。
- 退出登录:可以安全退出管理员账号。
🚀 技术实现
- 框架: 微信小程序原生框架
- 数据存储: 小程序全局变量
globalData(位于app.js),用于模拟数据库。 - UI: 使用原生 WXML/WXSS 构建界面,实现了简洁美观的UI。
🛠️ 如何运行
- 下载或克隆本项目代码到本地。
- 打开"微信开发者工具"。
- 点击"导入",选择本项目的根目录。
- 填写你自己的 AppID (如果没有,可使用测试号)。
- 点击"导入"即可在模拟器中查看和运行。
📁 文件结构
├── pages │ ├── admin # 管理员主页 │ ├── approval # 预约审批页 │ ├── book # 预约表单页 │ ├── index # 用户首页 (会议室列表) │ ├── login # 登录页 │ ├── my # 我的预约页 │ ├── register # 注册页 │ └── room-manage # 会议室管理页 ├── app.js # 小程序逻辑,全局数据初始化 ├── app.json # 全局配置,页面注册 ├── app.wxss # 全局样式 └── readme.md # 项目说明文档