vue.js毕业设计，基于vue.js前后端分离教室预约系统（H5移动项目）开题报告

雨点打透心脏的1/2处 2024-03-31 05:03 90阅读 0赞

**毕业论文**

基于Vue.js的教室预约系统（H5）

开题报告

学 院：

专 业：

年 级：

学生姓名：

指导教师： 黄菊华

**XXXX****大学本科生毕业论文（设计）开题报告书**

<table style="width:471.95pt;"> 
 <tbody> 
 <tr> 
 <td colspan="2" style="border-color:#000000;width:65.85pt;"> 姓&nbsp;&nbsp; 名 </td> 
 <td style="border-color:#000000;width:62.75pt;"> Xxx </td> 
 <td style="border-color:#000000;width:34.2pt;"> 学院 </td> 
 <td style="border-color:#000000;width:73.2pt;"> XXXXXXX </td> 
 <td style="border-color:#000000;width:34.25pt;"> 专业 </td> 
 <td style="border-color:#000000;width:65.15pt;"> Xxx </td> 
 <td style="border-color:#000000;width:2cm;"> 年级（班） </td> 
 <td style="border-color:#000000;width:79.85pt;"> </td> 
 </tr> 
 <tr> 
 <td colspan="2" style="border-color:#000000;width:65.85pt;"> 论文题目 </td> 
 <td colspan="5" style="width:269.55pt;"> 基于Vue.js的教室预约系统（H5） </td> 
 <td style="width:2cm;"> 指导教师 </td> 
 <td style="width:79.85pt;"> </td> 
 </tr> 
 <tr> 
 <td style="border-color:#000000;width:27.6pt;"> 课题论证 </td> 
 <td colspan="8" style="vertical-align:top;width:444.35pt;"> 
 <ul> 
 <li style="text-align:justify;">课题背景</li> 
 </ul>Vue (读音 /vjuː/，类似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。另一方面，Vue 完全有能力驱动采用单文件组件和Vue生态系统支持的库开发的复杂单页应用。 Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。 uni-app 是一个使用 Vue.js 开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、Web（响应式）、以及各种小程序（微信/支付宝/百度/头条/飞书/QQ/快手/钉钉/淘宝）、快应用等多个平台。 uni-app在手，做啥都不愁。即使不跨端，uni-app也是更好的小程序开发框架（详见）、更好的App跨平台框架、更方便的H5开发框架。不管领导安排什么样的项目，你都可以快速交付，不需要转换开发思维、不需要更改开发习惯。 
 <ul> 
 <li style="text-align:justify;">课题的目的与意义</li> 
 </ul>目的：本课题主要目标是设计并能够实现一个基于Vue.js的教室预约系统，前台用户使用小程序，后台管理使用PHP开发的网站后台管理系统，使用Mysql8存储数据；通过后台添加教室信息、管理用户信息、管理预约信息；前台用户通过小程序登录，查看教室信息、发起预约。 意义：基于Vue.js的教室预约系统是计算机技术与教室管理相结合的产物，通过该教室预约系统实现了对教室使用的高效管理。随着计算机技术的不断提高,计算机已经深入到社会生活的各个角落。在工作人员的具备一定的计算机操作能力的前提下，特编此基于Vue.js的教室预约系统软件以提高教室的管理效率。 三、可行性分析 基于Vue.js的教室预约系统有以下三方面可以总结系统开发的可行性，具体如下： 1.技术可行性 以Windows7或10为操作系统，采用phpstorm软件开发后台管理系统，运用mysql8进行数据库存储，使用Navicat管理Mysql8数据库，使用HbuilderX开发用户端；用本地PC电脑安装服务器环境模拟服务器运行系统，用户登录H5移动网页地址使用系统。 2.经济可行性 一方面，我们所使用的Mysql8，数据库管理工具Navicat，系统后台开发软件phpstorm，用户端开发工具HbuilderX这些都可以找到免费版本使用，系统的制作成本低，在现有的PC机上即可使用。另一方面，系统使管理员在教室管理的工作效率进一步提高从而节省人力、物力； 3.操作可行性 系统管理员主要凭借使用Windows操作技术，常规的会word操作，会打字即可完成数据的录入、修改、删除等功能，简单方便。用户登录H5移动网页教室预约系统来使用，也非常方便快捷。 </td> 
 </tr> 
 <tr> 
 <td style="border-color:#000000;width:27.6pt;"> 方案设计 </td> 
 <td colspan="8" style="vertical-align:top;width:444.35pt;"> 用户首次登陆系统需要注册一个用户作为账号，用户在登录平台后，可以进行平台的操作。主要模块包括以下几点： 
 <ol> 
 <li style="text-align:justify;">登录功能：注册普通账号登录；登录后可以修改用户的基本信息，也可以退出。</li> 
 <li style="text-align:justify;">资讯功能：后台录入资讯，在系统资讯模板展示，用户可以任意浏览资讯列表和详细信息&nbsp;&nbsp;</li> 
 <li style="text-align:justify;">教室列表：点击预约，我们在顶部可以查询对外开放能预约的教室列表。</li> 
 <li style="text-align:justify;">预约规则：需要提前一天预约；也就是只能预约明天的。</li> 
 <li style="text-align:justify;">发起预约：在预约列表；查看还能预约的教室，查找还能预约的哪节课，点击右侧的“预约”，跳转到预约页面。</li> 
 <li style="text-align:justify;">填写预约：根据预约时间、教室、哪节；填写预约信息。</li> 
 <li style="text-align:justify;">我的预约：已经发起预约，包含预约信息，状态</li> 
 <li style="text-align:justify;">取消申请：在我的预约列表，如果后台管理员还没审核通过，可以点击“取消申请”发起取消操作，已经审核过的不能取消。</li> 
 <li style="text-align:left;">用户信息：填写姓名、qq、邮箱、备注等信息</li> 
 </ol></td> 
 </tr> 
 <tr> 
 <td style="border-color:#000000;width:27.6pt;"> 进度计划 </td> 
 <td colspan="8" style="vertical-align:top;width:444.35pt;"> 2022.09.10—2022.10.15&nbsp; 查看大量的文献，收集课题有关资料，确定论文选题； 2022.10.16—2022.10.30&nbsp; 在老师的指导下，填写毕业论文任务书； 2022.10.31—2022.11.15&nbsp; 大量收集论文资料，理清论文思路，对论文思路进行完善。 2022.11.16—2022.12.22&nbsp; 完成开题报告答辩； 2022.12.23—2022.12.27&nbsp; 根据指导老师提出的建议再进行修改，完善系统功能设计 2022.12.28—2023.04.10&nbsp; 在查阅大量文献之后，运用多种研究方案，完成系统开发并基本完成论文初稿。 2023.04.01—2023.04.15&nbsp; 将初稿完善交由导师审阅，提出修改建议。 2023.04.16—2023.05.14&nbsp; 在导师指导下，对论文进行反复修改形成终稿，装订成册上交学院，同时为毕业论文答辩做准备工作 2023.05.15&nbsp; 进行毕业论文答辩 </td> 
 </tr> 
 <tr> 
 <td style="border-color:#000000;width:27.6pt;"> 导 教 师 意见 </td> 
 <td colspan="8" style="vertical-align:top;width:444.35pt;"> &nbsp; &nbsp;指导教师： &nbsp;&nbsp; 年&nbsp; &nbsp;&nbsp;&nbsp;月&nbsp; &nbsp;&nbsp;&nbsp;日 </td> 
 </tr> 
 <tr> 
 <td style="border-color:#000000;width:27.6pt;"> 教研室意见 </td> 
 <td colspan="8" style="vertical-align:top;width:444.35pt;"> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;教研室主任： &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 年&nbsp; &nbsp;&nbsp;&nbsp;月&nbsp; &nbsp;&nbsp;&nbsp;日 </td> 
 </tr> 
 <tr> 
 <td></td> 
 <td></td> 
 <td></td> 
 <td></td> 
 <td></td> 
 <td></td> 
 <td></td> 
 <td></td> 
 <td></td> 
 </tr> 
 </tbody> 
</table>