# xin-study **Repository Path**: xiaoxin0214/xin-study ## Basic Information - **Project Name**: xin-study - **Description**: XinStudy在线学习网站 - **Primary Language**: Java - **License**: Not specified - **Default Branch**: master - **Homepage**: None - **GVP Project**: No ## Statistics - **Stars**: 0 - **Forks**: 0 - **Created**: 2023-03-05 - **Last Updated**: 2023-03-08 ## Categories & Tags **Categories**: Uncategorized **Tags**: None ## README # 项目介绍 鑫Study在线学习网站，是分为前台网站系统和后台运营平台，B2C模式。 前台用户系统包括课程、讲师、我的收藏几大大部分，使用了微服务技术架构，前后端分离开发。 后端的主要技术架构是：SpringBoot + SpringCloud + MyBatis-Plus + HttpClient + MySQL + Maven+EasyExcel 使用Swagger生成接口文档 前端的架构是：Node.js + Vue.js +element-ui+NUXT+ECharts 其他涉及到的中间件包括Redis、阿里云OSS、阿里云视频点播 业务中使用了ECharts做图表展示，使用EasyExcel完成分类批量添加、注册分布式单点登录使用了JWT。 前台用户系统包括：首页、课程、名师、我的收藏。 后台管理系统包括：讲师管理、课程分类管理、课程管理、统计分析、CMS管理、订单查看、权限管理、会员查看等功能。 # 后台管理 ## 1.主页 ![image-20230306165315488](https://xiaoxintypora.oss-cn-chengdu.aliyuncs.com/imgs/image-20230306165315488.png) ## 2.权限管理 ### 2.1.添加角色 ![image-20230306165459855](https://xiaoxintypora.oss-cn-chengdu.aliyuncs.com/imgs/image-20230306165459855.png) ### 2.2添加用户 ![image-20230306165607218](https://xiaoxintypora.oss-cn-chengdu.aliyuncs.com/imgs/image-20230306165607218.png) ### 2.3为角色分配菜单权限 ![image-20230306165900780](https://xiaoxintypora.oss-cn-chengdu.aliyuncs.com/imgs/image-20230306165900780.png) ### 2.4为用户分配角色 ![image-20230306172338613](https://xiaoxintypora.oss-cn-chengdu.aliyuncs.com/imgs/image-20230306172338613.png) ### 2.5切换用户登录，显示拥有权限列表 ![image-20230306173214883](https://xiaoxintypora.oss-cn-chengdu.aliyuncs.com/imgs/image-20230306173214883.png) ## 3.课程分类（根据模板，采用excel导入上传到服务器进行添加） ### 3.1上传 ![image-20230306173427445](https://xiaoxintypora.oss-cn-chengdu.aliyuncs.com/imgs/image-20230306173427445.png) ![image-20230306175121330](https://xiaoxintypora.oss-cn-chengdu.aliyuncs.com/imgs/image-20230306175121330.png) ![image-20230306175028581](https://xiaoxintypora.oss-cn-chengdu.aliyuncs.com/imgs/image-20230306175028581.png) ### 3.2成功之后课程分类列表 ![image-20230306212503886](https://xiaoxintypora.oss-cn-chengdu.aliyuncs.com/imgs/image-20230306212503886.png) ## 4.讲师管理，课程管理、会员管理的列表查看、修改、删除差不多。讲师新增就是表单的提交，不做阐述。 ![image-20230306212716214](https://xiaoxintypora.oss-cn-chengdu.aliyuncs.com/imgs/image-20230306212716214.png) ## 5.课程发布 ### 5.1编辑课程信息 ![image-20230306220044385](https://xiaoxintypora.oss-cn-chengdu.aliyuncs.com/imgs/image-20230306220044385.png) ### 课程封面上传到阿里云对象存储OSS ![image-20230306220817485](https://xiaoxintypora.oss-cn-chengdu.aliyuncs.com/imgs/image-20230306220817485.png) ### 5.2编辑课程大纲信息 ![image-20230306222340353](https://xiaoxintypora.oss-cn-chengdu.aliyuncs.com/imgs/image-20230306222340353.png) ![image-20230306222559839](https://xiaoxintypora.oss-cn-chengdu.aliyuncs.com/imgs/image-20230306222559839.png) ### 5.3发布课程（未发布也行，在列表页进行确定修改之后再进行发布） ![image-20230306222826481](https://xiaoxintypora.oss-cn-chengdu.aliyuncs.com/imgs/image-20230306222826481.png) ### 5.4删除课程（将会删除阿里云存的图片和视频） ![image-20230307160721846](https://xiaoxintypora.oss-cn-chengdu.aliyuncs.com/imgs/image-20230307160721846.png) #### 删除之前 ![image-20230307160900478](https://xiaoxintypora.oss-cn-chengdu.aliyuncs.com/imgs/image-20230307160900478.png) ![image-20230307160916260](https://xiaoxintypora.oss-cn-chengdu.aliyuncs.com/imgs/image-20230307160916260.png) #### 删除之后 ![image-20230307161049885](https://xiaoxintypora.oss-cn-chengdu.aliyuncs.com/imgs/image-20230307161049885.png) ![image-20230307161122937](https://xiaoxintypora.oss-cn-chengdu.aliyuncs.com/imgs/image-20230307161122937.png) ## 6.统计图表的查看 ![image-20230306224339242](https://xiaoxintypora.oss-cn-chengdu.aliyuncs.com/imgs/image-20230306224339242.png) # 前台用户界面 ## 1.前台主页 ![image-20230307161321289](https://xiaoxintypora.oss-cn-chengdu.aliyuncs.com/imgs/image-20230307161321289.png) ## 2.课程页 ![image-20230307161412645](https://xiaoxintypora.oss-cn-chengdu.aliyuncs.com/imgs/image-20230307161412645.png) ## 3.名师页 ![image-20230307161430982](https://xiaoxintypora.oss-cn-chengdu.aliyuncs.com/imgs/image-20230307161430982.png) ## 4.登录注册页面 ![image-20230307161457684](https://xiaoxintypora.oss-cn-chengdu.aliyuncs.com/imgs/image-20230307161457684.png) ### 4.1微信登录界面 ![image-20230307161534308](https://xiaoxintypora.oss-cn-chengdu.aliyuncs.com/imgs/image-20230307161534308.png) ![image-20230307161602124](https://xiaoxintypora.oss-cn-chengdu.aliyuncs.com/imgs/image-20230307161602124.png) ### 4.2微信确定登录之后 ![image-20230307163428450](https://xiaoxintypora.oss-cn-chengdu.aliyuncs.com/imgs/image-20230307163428450.png) ## 5.我的收藏界面 ![image-20230307163851875](https://xiaoxintypora.oss-cn-chengdu.aliyuncs.com/imgs/image-20230307163851875.png) ## 6.课程观看（免费直接看，不免费购买观看，包括课程收藏，评论等） ### 6.1付费课程购买之前 ![image-20230307170715090](https://xiaoxintypora.oss-cn-chengdu.aliyuncs.com/imgs/image-20230307170715090.png) ### 6.2购买界面 ![image-20230307170650543](https://xiaoxintypora.oss-cn-chengdu.aliyuncs.com/imgs/image-20230307170650543.png) ### 6.3扫码支付界面 ![image-20230307170829864](https://xiaoxintypora.oss-cn-chengdu.aliyuncs.com/imgs/image-20230307170829864.png) ### 6.4支付成功 ![image-20230307170912667](https://xiaoxintypora.oss-cn-chengdu.aliyuncs.com/imgs/image-20230307170912667.png) ![image-20230307171103912](https://xiaoxintypora.oss-cn-chengdu.aliyuncs.com/imgs/image-20230307171103912.png) ### 6.5视频观看界面 ![image-20230307171255007](https://xiaoxintypora.oss-cn-chengdu.aliyuncs.com/imgs/image-20230307171255007.png)