4 系统设计
4.1 系统架构设计
本系统采用 B/S(Browser/Server)架构模式。该模式开发及后期维护成本较低,用户体验良好且操作便捷。B/S 体系结构仅需在客户端安装浏览器即可访问,维护和升级均在服务器端完成,无需客户端干预,有效降低了运维开销。此外,B/S 模式保证了软件的跨平台性和通用性。

图 4-1 B/S 模式示意图
4.2 系统结构设计
系统结构设计是系统设计的关键环节。首先进行需求分析,随后进行初步设计,细化功能模块,明确各模块的具体功能,最后整合各模块以实现系统整体结构。
本基于 Web 的足球青训俱乐部管理后台系统由学员、教练和管理员三大功能模块构成。

图 4-2 系统结构图
4.3 数据库设计
4.3.1 数据库 E-R 图设计
数据库是系统的核心基础,本系统采用 MySQL 数据库。SQL 是访问数据库的标准语言。良好的数据库设计有助于数据整洁、便于后期维护与功能扩展。E-R 图能直观展示实体与属性间的关系。
(1)课程安排信息实体 E-R 图,如图 4-5 所示:

图 4-5 课程安排信息实体图
(2)教练信息实体 E-R 图,如图 4-6 所示:

图 4-6 教练信息实体图
(3)订单实体 E-R 图,如图 4-7 所示:

图 4-7 订单实体图
(4)管理员实体 E-R 图,如图 4-8 所示:

图 4-8 管理员实体图
(5)学员实体 E-R 图,如图 4-9 所示:

图 4-9 学员实体图
(6)商品实体 E-R 图,如图 4-10 所示:

图 4-10 商品实体图
4.3.2 数据库表设计
本系统采用 MySQL 数据库管理系统,主要数据表设计如下:
表 4-1 kechenganpai 课程安排信息表
| 列名 | 说明 | 类型 ( 长度 ) | 备注 |
|---|---|---|---|
| id | 编号 | bigint(20) | 不允许空,主键 |
| addtime | 创建时间 | timestamp | 允许空 |
| xueyuanzhanghao | 学员账号 | varchar(200) | 允许空 |
| xueyuanxingming | 学员姓名 | varchar(200) | 允许空 |
| jiaoliangonghao | 教练工号 | varchar(200) | 允许空 |
| jiaolianxingming | 教练姓名 | varchar(200) | 允许空 |
| kechengbianhao | 课程编号 | varchar(200) | 允许空 |
| kechengming | 课程名 | varchar(200) | 允许空 |
| fengmian | 封面 | varchar(200) | 允许空 |
| shangkeshijian | 上课时间 | datetime | 允许空 |
| shangkedidian | 上课地点 | varchar(200) | 允许空 |
| xiangqing | 详情 | longtext | 允许空 |
| userid | 用户编号 | bigint(20) | 允许空 |
表 4-2 jiaolian 教练信息表
| 列名 | 说明 | 类型 ( 长度 ) | 备注 |
|---|---|---|---|
| id | 编号 | bigint(20) | 不允许空,主键 |
| addtime | 添加时间 | timestamp | 允许空 |
| jiaoliangonghao | 教练工号 | varchar(200) | 允许空 |
| mima | 密码 | varchar(200) | 允许空 |
| jiaolianxingming | 教练姓名 | varchar(200) | 允许空 |
| touxiang | 头像 | varchar(200) | 允许空 |
| nianling | 年龄 | varchar(200) | 允许空 |
| xingbie | 性别 | varchar(200) | 允许空 |
| shenfenzheng | 身份证 | varchar(200) | 允许空 |
| lianxidianhua | 联系电话 | varchar(200) | 允许空 |
| gongzuojingyan | 工作经验 | longtext | 允许空 |
| money | 余额 | float | 允许空 |
表 4-3 orders 订单信息表
| 列名 | 说明 | 类型 ( 长度 ) | 备注 |
|---|---|---|---|
| id | 编号 | bigint(20) | 不允许空,主键 |
| addtime | 添加时间 | timestamp | 允许空 |
| orderid | 订单编号 | varchar(200) | 允许空 |
| tablename | 商品表名 | varchar(200) | 允许空 |
| userid | 用户编号 | bigint(20) | 允许空 |
| goodid | 商品编号 | bigint(20) | 允许空 |
| goodname | 商品名称 | varchar(200) | 允许空 |
| picture | 商品图片 | varchar(200) | 允许空 |
| buynumber | 购买数量 | int(11) | 允许空 |
| price | 价格 | float | 允许空 |
| discountprice | 折扣价格 | float | 允许空 |
| total | 总价格 | float | 允许空 |
| discounttotal | 折扣总价格 | float | 允许空 |
| type | 支付类型 | int(11) | 允许空 |
| status | 状态 | varchar(200) | 允许空 |
| address | 地址 | varchar(200) | 允许空 |
| tel | 电话 | varchar(200) | 允许空 |
| consignee | 收货人 | varchar(200) | 允许空 |
表 4-4 users 管理员信息表
| 列名 | 说明 | 类型 ( 长度 ) | 备注 |
|---|---|---|---|
| id | 编号 | bigint(20) | 不允许空,主键 |
| username | 用户名 | varchar(100) | 允许空 |
| password | 密码 | varchar(100) | 允许空 |
| role | 角色 | varchar(100) | 允许空 |
| addtime | 添加时间 | timestamp | 允许空 |
表 4-5 xueyuan 学员信息表
| 列名 | 说明 | 类型 ( 长度 ) | 备注 |
|---|---|---|---|
| id | 编号 | bigint(20) | 不允许空,主键 |
| addtime | 添加时间 | timestamp | 允许空 |
| xueyuanzhanghao | 学员账号 | varchar(200) | 允许空 |
| mima | 密码 | varchar(200) | 允许空 |
| xueyuanxingming | 学员姓名 | bigint(20) | 允许空 |
| xingbie | 性别 | bigint(20) | 允许空 |
| shoujihao | 手机号 | varchar(200) | 允许空 |
| chushengnianyue | 出生年月 | date | 允许空 |
| touxiang | 头像 | varchar(200) | 允许空 |
| jiatingzhuzhi | 家庭住址 | varchar(200) | 允许空 |
| money | 余额 | float | 允许空 |
表 4-6 shangpinxinxi 商品信息表
| 列名 | 说明 | 类型 ( 长度 ) | 备注 |
|---|---|---|---|
| id | 编号 | bigint(20) | 不允许空,主键 |
| addtime | 添加时间 | timestamp | 允许空 |
| shangpinID | 商品编号 | varchar(200) | 允许空 |
| shangpinmingcheng | 商品名称 | varchar(200) | 允许空 |
| leixing | 类型 | varchar(200) | 允许空 |
| tupian | 图片 | varchar(200) | 允许空 |
| shangpinxiangqing | 商品详情 | varchar(200) | 允许空 |
| price | 价格 | float | 允许空 |
5 系统实现
5.1 学员功能模块的实现
学员进入系统可查看系统信息,前台主界面展示如图 5-1 所示。

图 5-1 系统主界面图
5.1.1 学员注册界面
未注册学员可在此进行操作,界面展示如图 5-2 所示。

图 5-2 学员注册界面图
5.1.2 学员登录界面
学员需登录系统进行商品购买等操作,界面展示如图 5-3 所示。

图 5-3 学员登录界面图
5.1.3 商品详情界面
学员可查看商品详细信息,登录后支持加入购物车或立即购买,界面展示如图 5-4 所示。

图 5-4 商品详情界面图
5.1.4 课程安排详情界面
学员可选择课程查看详情并签到,界面展示如图 5-5 所示。

图 5-5 课程安排详情界面图
5.1.5 上课签到界面
学员登录后可进行签到操作,界面展示如图 5-6 所示。

图 5-6 上课签到界面图
5.1.6 个人中心界面
学员可管理个人信息,界面展示如图 5-7 所示。

图 5-7 个人中心界面图
5.1.7 我的订单界面
学员可查看个人订单信息,界面展示如图 5-8 所示。

图 5-8 我的订单界面图
5.2 管理员功能模块的实现
5.2.1 管理员登录界面
管理员需登录系统后台进行管理,界面展示如图 5-9 所示。

图 5-9 管理员管理界面图
5.2.2 公告信息管理界面
管理员可对公告信息进行增删改查,界面展示如图 5-10 所示。

图 5-10 公告信息管理界面图
5.2.3 学员管理界面
管理员可查看、添加、修改和删除学员信息,界面展示如图 5-11 所示。

图 5-11 学员管理界面图
5.2.4 商品信息管理界面
管理员可对商品信息进行增删改查,界面展示如图 5-12 所示。

图 5-12 商品信息管理界面图
5.2.5 课程安排管理界面
管理员可添加、修改和删除课程安排信息,界面展示如图 5-13 所示。

图 5-13 课程安排管理界面图
5.3 教练功能模块的实现
5.3.1 课程安排界面
教练登录后可查看课程安排信息,界面展示如图 5-14 所示。

图 5-14 课程安排界面图
5.3.2 课程签到管理界面
教练可查看学员签到信息并进行审核,界面展示如图 5-15 所示。

图 5-15 课程签到管理界面图


