nodejs+vue+elementui校园车辆校车管理系统

 
  开发语言 node.js
框架:Express
前端:Vue.js
数据库:mysql 
数据库工具:Navicat
开发软件:VScode 
本界面为学生用车信息的添加界面

本界面是校园车辆的使用记录信息,包括校车的编号,校车的名称,车牌号,司机工号,司机姓名。离开时间,进入时间以及乘坐人数。

下图是校车的管理界面,主要包括校车的编号,校车的名称,车牌,乘坐人数和图片等内容


软件编程是孤独的,也是枯燥的。在外行看似简单的一个操作,背后却是数以百行的代码,有时一个项目的开发甚至需要连续十几天甚至一个月。 软件开发入行的同学很多,但真正能坚持下去的却很少,因为软件行业加班是出了名的,并且技术更新速度非常快,可能这一刻这个技术你才掌握,下一刻他的升级替代品就已经出来了。这让我们意识到更新自己知识的重要性。所以,我一直提醒自己,只要你不努力,你就随时有可能被别人超越和取代。nodejs+vue+elementui校园车辆校车管理系统_第1张图片nodejs+vue+elementui校园车辆校车管理系统_第2张图片nodejs+vue+elementui校园车辆校车管理系统_第3张图片

前端技术:nodejs+vue+elementui本项目的应用场景描述如下:为减少学生等待校车的时间,合理安排校车调度,设计并开发一个校车预约系统,系统由手机端、服务器端、车载刷卡端三部分组成。学生通过手机应用(或微信应用)查看校车运行时段,并提交某时段的校车预约;服务端收到预约信息后从学生一卡通中扣减乘车费用(爽约不退费),根据预约量决定某时段发车数,并于发车前10分钟短信通知学生在哪个乘车点乘坐哪辆车(车牌号);车载刷卡端在学生上车时匹配该校园卡是否预约了本时段并且被安排到该辆车,若不是则语音提示该同学没有预约或者是坐错了车。vue的文件结构其实就是一个index.html
中间的内容,用的是vue,但最终都会转译为html内容html、css、js
|- node_modules: node的一些基础依赖包,可能还有拓展的安装的别的插件(npm install下载的依赖包,主要是根据package.json获取对应的依赖包)
|- public: 存放一些主要的打包文件,如index.html等等,可以放置一些需要在index.html配置的文件
|- src: 项目的主文件夹(vue是SPA单页面应用,可以看做是一个主页面的应用里面的内容组件详情可看vue 代码格式解析)
|- assets: 资源文件,用于存放一些静态文件,如字体、图片、css样式之类的
|- components: vue主要内容的公共组件,可以进行复用
|- router: 设置路由,指定路由对应的组件
 
 MTV模式
 M:model,模型,负责与数据库交互
 V:view,视图是核心,负责接收请求、获取数据、返回结果
 T:template,模板,负责呈现内容到浏览器
不像传统模式,通过页面表单FORM BODY上传参数,
前后端通讯一般都是采取标准的JSON格式来交互。
前后端分离 的核心思想是前端页面通过 ajax 调用后端的 restuful api 进行数据交互,而 单页面应用(single page web application,SPA),就是只有一张页面,并在用户与应用程序交互时动态更新该页面的 Web 应用


 

你可能感兴趣的:(vue.js,elementui,前端)