uni-app课程预约小程序,会员管理系统

101 阅读5分钟

写了一个基于uni-app开发的微信小程序,集学员端和管理端于一体,提供便捷的课程预约管理功能,适用于健身房、舞蹈室、教育培训等场景。

先看下小程序截图 预约课程页面 class.jpg

首页和工作室介绍页、我的页面 New Project.jpg

🎓 学员端功能

一键登录:支持微信授权手机号快捷登录
自定义头像:用户可上传个性化头像
课程预约:美观的课程卡片展示,轻松预约心仪课程
预约详情:查看已预约用户的头像列表,了解上课伙伴
取消预约:支持在开课前 X 小时内自主取消课程
我的预约:查看所有预约记录,包含上课历史
数据可视化:图表直观展示上课情况和会员卡使用情况
会员卡管理:随时查看会员卡类型及有效期


🧑‍🏫 管理端功能

🔹 课程管理:灵活排课,支持发布、修改和取消课程
🔹 会员卡管理:管理会员卡种类、有效期等信息
🔹 工作室介绍:配置品牌信息,提升用户体验
🔹 预约规则:可设置开课前多久允许取消
🔹 自动取消课程:未达最低预约人数时,开课前自动取消
🔹 预约开放时间:仅开放 今明两天 的课程供学员预约


小程序使用uni-app云开发,自己建数据表,管理数据。接下来主要讲下以下2点

  • 小程序的项目结构
  • 主要数据表
小程序的项目结构
├── components
├── pages
│   ├── address
│   ├── index
│   ├── login
│   ├── me
│   ├── reserve
├── pages-courses
│   ├── courseList
│   └── newCourse
├── pages-me-dashboard
│   ├── classAttendanceRecord
│   ├── myReserve
│   └── uni_modules
├── pages-membership-card
│   └── my-membership-card
├── pages-reserve
│   └── reserveDetail
├── pages-studio
│   ├── album
│   ├── classroom
│   ├── promotion
│   └── studio
└── pages-users
    ├── newUser
    └── userList

项目目前为止有一个主包和6个分包,下面是对各个目录的详细介绍:

主包 (pages)

主包包含小程序的主要页面,主要用于学员端的功能。

address: 工作室地址页面。
index: 首页,展示工作室基本信息。
login: 处理用户登录,包括手机号一键登录等。
me: 用户个人中心,显示我的页面等。
reserve: 课程预约相关页面,学员可通过此页面进行预约。

分包

分包通常用于更细分的功能,减小主包的体积并优化加载速度。

pages-courses
courseList: 显示所有课程的列表,学员可以浏览和选择课程。
newCourse: 用于创建新的课程,管理端功能,增删改课程。

pages-me-dashboard
classAttendanceRecord: 学员查看自己的出勤记录,了解自己上课情况。
myReserve: 学员查看自己的预约情况,包括已预约课程和状态。
uni_modules: 学员可视化自己上课情况模块,echarts。

pages-membership-card
my-membership-card: 会员卡相关页面,显示当前用户的会员卡类型和有效期。

pages-reserve
reserveDetail: 课程预约的详细信息页面,学员可以查看具体课程内容。

pages-studio
album: 展示工作室照片页面。
classroom: 教室管理页面。
promotion: 用于展示优惠活动、课程推广信息。
studio: 工作室的介绍页面,展示工作室信息和设施。

pages-users
newUser: 用于添加新用户,管理员功能。
userList: 用户列表页面,显示所有注册用户的基本信息。

小程序的主要数据表
├── database
│   ├── class-schedule.schema.json
│   ├── classroom.schema.json
│   ├── configurations.schema.json
│   ├── studio.schema.json
│   ├── teachers.schema.json
│   ├── user-membership-card.schema.json
│   ├── user-reserve.schema.json
│   └── users.schema.json
  1. class-schedule.schema.json
    存储课程安排的信息,包括课程的开始时间、结束时间、课程类型、课程难度、课程老师名称、课程老师照片等。这个表用于管理课程的时间表,确保课程按时安排和预约。

  2. classroom.schema.json
    存储课程的教室信息。包括每个教室的名称、装修风格、容量、教师相册等。这个表帮助管理多个教室的使用情况,确保每堂课都有合适的教室。

  3. configurations.schema.json
    配置信息,比如小程序的appid, secret

  4. studio.schema.json
    存储工作室的基本信息,包括工作室的名称、简介、设施等。这个表为用户提供有关工作室的详细介绍。

  5. teachers.schema.json
    存储教师信息,包括教师的姓名、照片、课程卡片、教课次数等。这表帮助管理课程的教师,并将其与课程安排相关联。

  6. user-membership-card.schema.json
    存储学员的会员卡信息,包括卡类型、有效期、剩余次数等。这个表帮助管理学员的会员卡状态,用于课程预约和取消。

  7. user-reserve.schema.json
    存储学员的课程预约信息。包括学员的预约记录、预约状态、上课时间等。这个表用于管理和查询学员的预约情况。

  8. users.schema.json
    存储用户信息,包括用户的基本信息、联系方式等。该表用于管理平台上的所有用户,支持学员和管理员等角色的区分。

这些表设计主要用于支持小程序的核心功能,如课程预约、工作室管理、会员卡管理和用户信息管理。

会员管理页面 会员查看上课记录页面 编辑课程页面 管理员页面 admin.jpg

这个项目涉及到学员端和管理端的功能,涵盖了课程管理、会员卡、预约、出勤等功能,适合用于教育、健身等场景。

在线体验,扫码体验小程序完整功能。

IMG_3158.JPG

Github仓库链接

🎉 这款小程序已开源,欢迎大家体验和改进! 🚀