基于Vue的预约停车位APP设计与实现.doc

《基于Vue的预约停车位APP设计与实现.doc》由会员分享，可在线阅读，更多相关《基于Vue的预约停车位APP设计与实现.doc（35页珍藏版）》请在得力文库 - 分享文档赚钱的网站上搜索。

1、目 录摘 要IAbstractII引 言11 相关技术31.1 Vue简介31.2 Node.js简介31.3 JavaScript基本介绍41.4 Ajax基本介绍41.5 本章小结42 软件需求分析与体系结构设计52.1 系统定义用户52.2 系统功能需求描述52.3 系统用例分析62. 3. 1 用户用例分析62. 3. 2 管理员用例分析72.4 非功能需求分析72.5 本章小结83 系统设计93.1 系统总体设计93. 1. 1 系统体系结构设计93. 1. 2 系统功能结构设计93.2 系统详细设计103. 2. 1 系统数据库设计103. 2. 2 数据库表设计113. 2. 3

2、 系统功能模块详细设计153.3 本章小结164系统具体功能实现174.1车主用户功能实现174. 1. 1 用户预约停车位功能实现174. 1. 2 用户查看已预约车位功能实现194. 1. 3 用户查看已完成车位功能实现204. 1. 4 用户购买闲置车位功能实现214. 1. 5 用户上传闲置车位功能实现224.2 管理员功能实现234. 2. 1 管理员管理停车场信息功能实现234. 2. 2 管理员回答用户问题功能实现234.3 本章小结245 系统测试255.1 系统测试计划模块255.2 登录测试255.3 用户评价停车场测试255.4 系统高并发压力测试265.5 本章小结26

3、结 论27致 谢28参考文献29沈阳城市学院毕业设计（论文）摘 要随着科学技术的不断发展，一些新兴技术不断地改变着人们的生活。在现如今的社会中，停车难问题是大多数车主用户每天都会面临到的一个问题。现在真可谓是一位难求，出现这样的现象正是因为近些年来私家车的迅速增多，让车位供不应求。停车排队、停车场拥堵、停车位难找这些问题时时刻刻都在困扰着车主用户。本文针对当前存在的诸多问题和车主用户需求开发了预约停车位APP系统。通过用户需求和现如今的社会状况，此系统整体的运用到了前后端分离的开发技术。例如前端使用了Vue前端框架技术，后端使用Node.js+MySQL数据库进行系统的设计与开发。此系统可以很

4、好的解决人们日常出行停车难的问题，让车主用户可以随时随地的了解到附近的停车信息。能够在很大程度上降低城市停车场拥堵的问题，能够极大的改善人们的日常出行。此系统具有数据结构复杂性，外部接口多样化，便于用户反复使用等特点。通过后期对系统进行的测试，预约停车位APP系统各个模块都已完成，符合用户的需求。关键词：预约车位； 空闲车位租赁； Vue； AbstractWith the continuous development of science and technology, some emerging technologies are constantly changing peoples li

5、ves. In todays society, parking is a problem that most car owners will face every day. It is difficult to find a parking space now, because the rapid increase of private cars in recent years has caused a shortage of parking Spaces. Parking queue, parking lot congestion, parking space is difficult to

6、 find these problems are always troubling the owners of users. This paper develops an APP system for reserving parking Spaces according to the existing problems and the needs of car owners.Based on user needs and current social conditions, the system as a whole applies the development technology of

7、separation of front and rear ends . For example, the front-end USES Vue front-end framework technology, and the back-end USES node. js+MySQL database to design and develop the system. This system can well solve the problem of parking difficulty in Peoples Daily travel, so that car owners and users c

8、an know the parking information in the vicinity at any time and anywhere. It can greatly reduce the problem of urban parking lot congestion and greatly improve Peoples Daily travel.This system has the characteristics of complex data structure, diversified external interfaces and easy for users to us

9、e repeatedly. After testing the system in the later stage, all modules of the APP system for parking space reservation have been completed to meet the needs of users.Keywords:Reserved parking space; Rental of free parking Spaces; Vue31引 言自从改革开放以来，中国的经济状况越来越好，人们的收入水平越来越高。汽车的出现很好的解决了人们因为路途较远而出行困难的问题，近

10、些年来汽车价格不断下调，所以人们都会选择购买私家车来改善自己家庭的生活品质。然而随着人们购买私家车的数目越来也多，许多问题也显现出来。首当其冲的就是“停车难”的问题，而且停车难的问题在中国的许多城市越演越烈。在一些小区，公共车位被随意私自霸占，小区的篮球场和活动场都被人们私自停放了汽车，甚至一些车主为了争抢一个停车位而大打出手。这些问题的出现不仅仅会影响人们的日常生活状态，更有可能会扰乱社会的安全秩序。 近些年来，政府虽然大力修建停车场，对停车场进行规划，努力改变现有的停车状况。但是私家车的增涨速度早已远远的超过了停车场的建成速度。市中心的一些停车场每天依旧车水马龙，依然需要排队停车。所以急需

11、一种方式，让车主用户们在任何时间任何地点都可以知道哪里的停车场有空余车位，哪里的停车场需要排队。这样可以减少了到处寻找空余停车位的时间，也能避免停车场排队带来的道路交通拥堵问题。本系统可以让车主用户随时随地的了解到附近的停车场信息，还配备了用户上传和购买闲置停车位等一系列功能。极大的便捷了人们日常出行，很好的解决了人们为停车而发愁的问题。在英国伦敦，由于人们普遍收入较高，所以停车费用也比较昂贵。伦敦市政府特意开发和完成了本市的停车场网站。当伦敦市民想要外出的时候，可以在本市的停车场网站查看目的地周围的停车场信息，了解到哪些停车场有空余的停车位并且可以对这些空余停车位进行预约。当车主到达预约停车

12、场时，只需要出示特定的二维码即可进行停车Error! Reference source not found.。伦敦市政府为了鼓励市民使用停车网站进行停车位预约，提供了一系列的优惠服务。在线上预约的停车位可以比普通的停车位便宜百分之二十。车主不仅可以在网站上预约停车位，还可以在网站上直接对停车费用进行交付。这一功能可以直接避免车主出停车场排队缴费的问题Error! Reference source not found.。2016年重庆市开启了“智慧停车”的项目，在一些主城区取得了可观的成果。“智慧停车”集成了本市主要大型停车场和公共停车位的停车信息。市民们可以在手机软件上对这些停车信息进行查看。

13、重庆市还对一些停车场设施进行改造，各种智能化停车场相继建成。同时还鼓励企业单位、住宅小区对各自的私有停车场进行智能化改造。 本文主要对预约停车位APP系统所使用到的相关技术、系统的详细设计、系统的具体实现以及系统测试做出详细的介绍，主要包括以下几个章节。第一章：介绍所运用到的技术，包括Vue前端框架技术、Node.js技术和Ajax异步传输数据技术。第二章：系统分析，对系统进行需求分析，分析各个功能之间的用例关系。第三章：系统设计，介绍系统的设计流程和中心设计思想。包括系统的结构设计、功能模块设计以及系统的数据库设计Error! Reference source not found.。第四章：

14、系统功能实现介绍，介绍了项目编码流程和前后端的接口实现。第五章：系统测试，系统测试是开发系统的最后一个环节，是为了验证所开发完成的系统是否满足设计要求和之前所列出的需求分析，以及检查系统是否存在问题并及时改正。结论：总结所完成的工作，并分析系统有哪些部分可以优化。1 相关技术1.1 Vue简介Vue是一款目前主流的前端开发框架，Vue具有响应式数据绑定的特点。当界面的数据发生变化的时候，界面的视图可以自动更新。前端界面可以专心的进行数据处理，不需要再进行一些没有必要的dom操作。Vue官方操作说明文档也较为清晰，比其他的一些前端框架更加简单易学。缺点是Vue是一个种新的前端框架技术Error!

15、 Reference source not found.，没有其他的前端框架那么成熟。影响度不是很大，只是在一些中小型的项目上应用，在大多数大型项目上并没有广泛应用。易上手的特点也使得Vue框架成为诸多前端开发人员第一个学习和掌握的前端框架技术。Vue项目中各个组件之间通讯及其方便，父子组件传参、子父组件传参、兄弟组件传参以及路由之间的相互通讯。都可以解决开发过程中的数据传递问题Error! Reference source not found.。Vue特有的模块化开发思想，可以把页面中相同的部分作为一个组件，这个组件可以被每个页面随意调用。对页面重复代码做出了很好的规划，符合现如今程序开发代

16、码重用的思想，在一定程度上减少了开发人员的工作量，提高了开发人员的开发体验。1.2 Node.js简介Node.js为前端开发人员提供了一个使用js代码来实现后端操作的平台，可以实现现有后端语言的功能，一定程度上降低了项目开发的成本。通过Node.js当中的router模块，可以创建本地服务和后端路由接口。通过这些后端路由接口可以接收前端界面通过Ajax传递过来的参数，对数据库和数据库当中的数据进行操作。并且Node.js配备了自己独立的第三方库安装程序。开发人员可以通过快捷指令npm去下载任何开发过程中需要使用的第三方库。省去了开发人员寻找第三方库进行下载，然后再引用到本地的过程。缩短了开发

17、的时间。Node.js的实现代码与普通的原生js代码大同小异。所以开发人员只需要掌握原生js代码即可使用Node.js对项目程序进行编写，操作难度较低Error! Reference source not found.。Node.js和JavaScript的区别是：原生js必须依赖于浏览器而运行，而Node.js则可以不在依赖于浏览器而运行。并且因为Node.js不需要依赖于浏览器，所以不会存在特别大的兼容问题。Node.js可以完成创建本地服务，连接数据库，操作本地文件读写等操作，而原生js则不能。Node.js在大型项目中存在计算量少的缺陷，目前只作为中间层或者用来做一些小项目的后端。1.

18、 3 JavaScript基本介绍JavaScript是一门轻量级弱势编程语言，可以实现页面之间的动态交互。JavaScript 是一种可以插入 HTML 页面，并且辅助HTML页面进行功能展示和界面交互的编程语言Error! Reference source not found.，可以给页面增添一些动态功能。JavaScript被当今许多浏览器所支持。1. 4 Ajax基本介绍Ajax为前后端数据交互提供了一个桥梁，使用脚本语言将前后端进行连接，可以实现前后端数据的交互功能。可以提高前后端交互的运行效率，提高用户的使用体验，让多件事情可同时发生。可以在不刷新界面的情况下对局部数据进行加载和刷

19、新Error! Reference source not found.。Ajax相当于创建了一个请求代理，通过这个代理去完成客户端与服务器端的数据信息交互。交互的过程中，客户端不需要进行数据的请求等待，还可以进行网页的其他功能操作。等待交互完成之后，代理再将交互的结果返回给客户端界面Error! Reference source not found.。1. 5 本章小结 以上介绍的就是预约停车位APP所使用的所有相关技术，预约停车位APP系统使用Visual Studio Code作为系统的开发工作。通过百度地图api接口可以让用户通过地图显示了解到停车场信息。通过各个技术的灵活应用和相互嵌套

20、，可以完整的完成此系统。 2 软件需求分析与体系结构设计2.1 系统定义用户通过对系统的分析，最后将系统的使用者分为两种类型车主用户和系统管理员。各个人物都有自己的管理权限和实际功能，使用者的身份不一样所提供的功能也不一样Error! Reference source not found.。车主用户使用APP查询附近空余车位，并预约空余车位，停车结束并进行线上支付。查看自己之前的停车记录，对余额进行充值，查看充值记录。上传自己的空余车位和购买他人上传的空余车位。对APP提出建议和使用当中的问题。作为APP之后升级和改进的依据Error! Reference source not found.。

21、“管理员”可以对数据库中的停车场信息进行操作，查看用户的注册和登录记录。查看用户提出的建议并且回答用户使用当中出现的问题。2.2 系统功能需求描述对于预约停车位APP系统为用户提供的需求描述如下。（1）用户注册功能。当新用户首次使用软件时，提供注册服务。（2）用户登录功能。用户可以通过用户名和密码进行登录。（3）如果用户想修改密码，提供修改密码服务。（4）用户预约停车位。为用户提供查看附近空余车位的功能，用户可以通过地图显示了解到附近有哪些停车场有空余车位，填写完成相关信息即可完成预约Error! Reference source not found.。（5）用户完成停车订单并线上支付后可以对

22、停车场进行评价，可以在已完成界面查看到之前的停车记录。（6）用户可以在订单记录页面查看到之前每一笔停车记录的扣款详情。（7）用户可以在钱包界面进行余额充值，并可以详细的看到之前的充值记录。（8）用户可以收藏停车场信息，并且在我的收藏界面可以看到之前的收藏记录。（9）用户可以查看并且购买闲置车位。（10）用户可以上传和查看自己之前上传的空闲车位。（11）用户可以提交简历并且有机会成为开发此APP的一员。（12）为用户提供导航服务，用户可以使用此系统查看所在地到预约停车场的路线规划。（13）系统提供两种车位，闲置车位是用户上传的私有车位，是长时间车位，是按月起租的。普通车位是系统管理员记录在系统的

23、临时停车位，是按小时起租的。对于预约停车位APP系统为系统管理员提供的需求描述如下。（1）管理员可以查看用户的相关信息。（2）管理员可以对停车场的信息进行操作。（3）管理员可以查看用户提出的问题并回答问题。2.3 系统用例分析2. 3. 1 用户用例分析如图2.1所示，车主用户参与用例登录、注册、参与招聘、提出意见、查看空闲车位、上传空闲车位、提出使用中的问题、收藏车位信息、查看收藏车位、查看余额充值记录Error! Reference source not found.。在查看停车场信息时，主要分为查看停车场空余车位和查看停车场联系人信息，将这两个功能抽象为两个用例。当预约停车位的时候，需要

24、进行预约停车场导航这个功能，而在正常情况下用不到这个功能，所以用例预约停车位和用例预约停车场导航之间是拓展关系。当支付停车费用的时候，需要进行评价停车场这个功能，而在正常情况下用不到这个功能，所以支付停车费用和评价停车场之间是拓展关系。其中余额充值有两种方式，一种是支付宝充值，另一种是微信充值。所以余额充值是父用例，而支付宝充值和微信充值是子用例，之间的关系是泛化关系Error! Reference source not found.。图2.1 用户的用例图2. 3. 2 管理员用例分析如图2.2所示，系统管理员可以登录、查看用户登录信息、查看用户注册信息、查看用户修改密码信息、查看提交简历。

25、查看用户提出的问题，回答用户提出的问题。在管理停车场信息时，主要分为新增停车场信息、修改停车场信息、删除停车场信息。将这三个功能分别抽象为三个用例Error! Reference source not found.。因为修改、新增和删除停车场信息的时候都要保存停车场信息，所以将保存停车场信息抽象出来作为单独的一个用例Error! Reference source not found.。当查看用户提出问题的时候，需要进行回答用户提出问题的功能，而在正常情况下用不到回答用户提出问题这个功能。所以用例查看用户提出问题和用例回答用户提出问题之间是扩展关系。图2.2 管理员的用例图2.4 非功能需求分析

26、所有编写完成的界面要符合简介明了的设计理念，重点要展示出界面的功能展示部分，让使用者可以很好的了解到此页面的具体功能。所有页面的页面布局要尽可能的保持统一。页面中的字体大小、文字与图片之间的距离、各个模块之间的边距和间距、页面当中内容的布局要保持一致。选取的图标要含义明确、色彩鲜明，输入框要位于界面的明显位置，页面整体布局要简介大方，使得用户有很好的观感体验，进而可以提升用户的使用体验。 系统各个模块和组织结构之间要求密切相关，保证模块和界面之间的数据可以顺利传递。因为采取的是前后端分离的开发思想，所以项目要保证前后端分别创建的服务都可以顺利启动，数据可以顺利传输。 在开发系统的时候，需要保证

27、系统具有较强的可维护性，这样可以使系统有较长的可使用期限。一个系统可使用期限的长短，可以直接显现出项目投资的收益。一个系统的可维护性，在开发初期就必须要进行考虑。 系统需要保持较高的可拓展性，这样可以便于提高系统的稳定性。当系统具有较高的可拓展性之后，就可以满足用户不断变化发展的用户需求。便于系统日后的升级与维护，减少了系统二次开发所带来的成本，可以在一定程度上降低开发成本。2.5 本章小结本章讲述了预约停车位APP系统的需求分析及其功能的用例描述。将系统功能使用用例图的方式进行组织和描述，可以很直观的看出系统具有哪些功能，各个功能之间的相互依赖关系。系统分为车主用户和系统管理员两个角色，不同

28、角色登录会进入到不同的界面中，进行不同的操作和使用不同的功能。在今后，系统的一些功能会与一些停车场的硬件设备进行进行连接，通过软件和硬件的相互结合，可以给给用户带来更好的用户体验。3 系统设计3.1 系统总体设计3. 1. 1 系统体系结构设计预约停车位APP系统体系结构分为5层，分为视图层、调度层、数据存储层、数据访问层、数据层。第一层为视图层，一般情况下为使用HTML所编写的前端界面，供用户查看显示页面。第二层为调度层，分割试图层和数据存储层，使得两者之间不会有直接联系Error! Reference source not found.。如果两者需要进行数据传递需要使用调度层做中间处理。第

29、三层为数据存储层，这一层主要存储了从后端接口请求到的数据。这三层符合Vue前端框架的MVVM设计模式。第四层为数据访问层，主要是对MySQL数据库中的数据进行访问和应用。第五层为数据层，是指MySQL数据库中的数据Error! Reference source not found.。 预约停车位APP采用前后端分离开发的思想，所以会启用两个服务器。两个服务器之间通过特定的IP地址和端口号进行数据的交换。在Vue框架所开启的服务中包括了视图层、调度层、数据存储层。在Node.js所开启的服务中包括了数据访问层Error! Reference source not found.。3. 1. 2 系

30、统功能结构设计预约停车位APP系统主要分为了两个模块车主用户模块和系统管理员模块。车主用户的功能模块包括： （1）用户预约停车位功能模块，此模块可以实现用户预约停车位的功能。用户可以查看附近停车场的空余车位信息，包括停车场地点、空余车位数量、停车场联系人信号等等。用户可以线上预约空余车位，并且支持用户收藏停车场信息。 （2）用户闲置停车位功能模块。此模块可以实现用户上传和购买闲置停车位的功能。用户可以查看其他用户上传的闲置停车位，并且购买闲置停车位。 （3）用户个人中心功能模块。此功能模块可以实现用户查看个人信息及消费记录的功能。用户可以修改自己的登陆账号密码。用户可以对账户的余额进行充值，并

31、且查看之前对账户余额的充值记录。用户可以查看之前所收藏的停车场信息。用户可以查看使用过程中可能会出现的问题及其解决方法，还可以向管理员提出使用中出现的问题。用户可以查看到之前的停车消费记录。用户可以向系统提出意见及建议。 （4）用户订单详情功能模块。此功能模块可以实现用户对停车订单的管理功能。当用户到达预约停车场时，可以开始停车订单。当用户结束停车，可以结束该停车订单，并对此停车订单进行线上支付。用户还可以对之前所消费过的停车场进行评价。 （5）用户提交简历功能模块。此模块可以实现用户提交简历的功能。如果用户很看好此系统在未来的发展形势，可以向系统提交自己的简历，并有可能成为开发此系统的一员。

32、系统管理员的功能模块包括：（1）管理员管理停车场信息功能模块。此模块可以实现管理员对系统数据库中停车场信息进行管理的功能。管理员可以把一些新增的停车场信息上传到系统的数据库中。可以对之前所保存的停车场信息进行信息修改。还可以删除掉一些没有用的停车场信息。这个功能模块可以保证系统当中存储的停车场信息每时每刻都在刷新，保证了数据信息的时效性。 （2）管理员查看用户相关信息功能模块。此模块可以实现管理员对车主用户信息进行查看的功能。管理员可以查看用户的登录、注册、修改密码的相关信号。 （3）管理员回答用户提出问题功能模块。此模块可以实现管理员对用户使用过程中提出的问题进行查看和回答的功能。管理员可以

33、查看到用户向管理员提出的所有问题，并对每一个问题进行针对性的回答。 （4）管理员查看提交简历功能模块。此模块可以实现管理员对用户所提交的简历进行查看的功能。管理员可以查看之前用户提交的简历信息。3.2 系统详细设计3. 2. 1 系统数据库设计此系统一共用到二十张数据表，包括停车场信息表、用户预约车位信息表、闲置车位信息表等等。系统的E-R图如图3.1所示Error! Reference source not found.。通过这些数据表中字段的相互结合和嵌套可以很好的对停车场信号、用户信息、用户停车订单信息进行存储。图3.1 预约停车位APP系统E-R图3. 2. 2 数据库表设计（1）停车

34、场信息表用来存储停车场的相关信息。一共8个字段，3个整型字段，5个字符串字段，id为自增长字段，所有字段不能为空，如表3.1所示。表3.1停车场信息表条件字段名称数据类型（精度范围）空/非空 约束条件其它说明idint非空主键、自增长自增idtitlevarchar非空停车场名称pointvarchar非空停车场经纬度numberint非空停车场空余车位telvarchar非空停车场电话contactvarchar非空停车场联系人priceint非空停车场价格imgSrcvarchar非空停车场图片路径（2）预约停车位信息表用来存储用户预约的停车位信息。一共10个字段，3个整型字段，7个字符串

35、字段，id为自增长字段，所有字段不能为空，如表3.2所示。表3.2 预约车位信息表条件字段名称数据类型（精度范围）空/非空 约束条件其它说明idint非空主键、自增长自增idstartAddressvarchar非空开始地址endAddressvarchar非空结束地址timevarchar非空预约车位时间namevarchar非空预约车位联系人addressvarcahr非空预约车位地址carNumbervarchar非空预约车位车牌号priceint非空预约停车场价格peopleIdint非空用户idimgSrcvarchar非空预约停车场图片（3）用户已评价停车位信息表用来存储用户已评价

36、的停车信息。一共9个字段，3个整型字段，6个字符串字段，id为自增长字段，所有字段不能为空，如表3.3所示。表3.3 已评价车位信息表条件字段名称数据类型（精度范围）空/非空 约束条件其它说明idint非空主键、自增长自增idaddressvarchar非空停车场名称startTimevarchar非空停车开始时间endTimevarchar非空停车结束时间totalint非空停车总金额gradevarchar非空停车场评价等级remarkvarchar非空备注imgSrcvarchar非空停车场图片路径peopleIdint非空用户id（4）用户已完成停车位信息表用来存储用户已完成的停车信息

37、。一共8个字段，4个整型字段，4个字符串字段，id为自增长字段，所有字段不能为空，如表3.4所示。表3.4 已完成车位信息表条件字段名称数据类型（精度范围）空/非空 约束条件其它说明idint非空主键、自增长自增idaddressvarchar非空停车场名称startTimevarchar非空停车开始时间endTimevarchar非空停车结束时间totalint非空停车总金额priceint非空停车场价格imgSrcvarchar非空停车场图片路径peopleIdint非空用户id（5）用户收藏车位信息表用来存储用户所收藏的车位信息。一共5个字段，3个整型字段，2个字符串字段，id为自增长字

38、段，所有字段不能为空，如表3.5所示。表3.5 收藏车位信息表条件字段名称数据类型（精度范围）空/非空 约束条件其它说明idint非空主键、自增长自增idtitlevarchar非空收藏停车场名称priceint非空收藏停车场价格imgSrcvarchar非空收藏停车场图片peopleIdint非空用户id（6）用户进行中停车位信息表用来存储用户正在进行中的停车信息。一共4个字段，3个整型字段，1个字符串字段，id为自增长字段，所有字段不能为空，如表3.6所示。表3.6 进行中车位信息表条件字段名称数据类型（精度范围）空/非空 约束条件其它说明idint非空主键、自增长自增idaddressv

39、archar非空停车场名称peopleIdint非空用户idpriceint非空停车场价格（7）用户消费明细表用来存储用户的消费明细信息，用户可以查看到之前所有的停车地点和停车支付价格。一共7个字段，3个整型字段，4个字符串字段，id为自增长字段，所有字段不能为空，如表3.7所示。表3.7 消费明细信息表条件字段名称数据类型（精度范围）空/非空 约束条件其它说明idint非空主键、自增长自增idstartTimevarchar非空停车开始时间endTimevarchar非空停车结束时间addressvarchar非空停车地址namevarchar非空停车场名称totalint非空停车总金额pe

40、opleIdint非空用户id（8）用户余额信息表用来存储用户的账户余额信息。一共3个字段，3个整型字段， id为自增长字段，所有字段不能为空，如表3.8所示。表3.8 余额信息表条件字段名称数据类型（精度范围）空/非空 约束条件其它说明idint非空主键、自增长自增idpeopleMoneyint非空用户账户余额数值peopleIdint非空用户id（9）用户疑问表用来存储用户使用中所提出的问题信息。一共4个字段，2个整型字段，2个字符串字段，id为自增长字段，answer字段可以为空，其余所有字段不能为空，如表3.9所示。表3.9 问题信息表条件字段名称数据类型（精度范围）空/非空 约束条

41、件其它说明idint非空主键、自增长自增idquestionvarchar非空用户提出的问题answervarchar空问题的解答peopleIdint非空用户id（10）用户购买闲置车位信息表用来存储用户所购买的闲着车位信息。一共10个字段，4个整型字段，6个字符串字段，id为自增长字段，所有字段不能为空，如表3.10所示。表3.10 购买闲置车位信息表条件字段名称数据类型（精度范围）空/非空 约束条件其它说明idint非空主键、自增长自增idaddressvarchar非空购买车位名称namevarchar非空购买车位地址startTimevarchar非空购买车位开始时间buyTimei

42、nt非空购买车位时间priceint非空购买车位价格personvarchar非空购买车位联系人phonevarchar非空车位联系人电话imgSrcvarchar非空停车场图片路径peopleIdint非空用户id（11）用户简历表用来存储用户使用中所提出的简历信息。一共4个字段，2个整型字段，2个字符串字段，id为自增长字段，所有字段不能为空，如表3.11所示。表3.11 简历信息表条件字段名称数据类型（精度范围）空/非空 约束条件其它说明idint非空主键、自增长自增idpostvarchar非空岗位contactvarchar空备注peopleIdint非空用户id3. 2. 3 系统

43、功能模块详细设计（1）用户查看附近停车场信息功能模块，用户可以通过此模块查看附近的停车场信息。当用户访问预约停车位页面时，此页面中Vue实例的生命周期函数created函数自动执行。其中包含的getMessage方法也随之执行，getMessage方法通过内部Ajax向后端路由接口getMap发送请求。getMap方法接收到请求之后通过SQL语句查询停车场信息数据表中的信息，并将此结果通过res.send方法返回给前端路由。前端界面接收到返回的数据后，用此数据对界面进行数据渲染，供用户查看附近停车场信息Error! Reference source not found.。 （2）用户预约停车位

44、功能模块。用户可以通过此模块预约停车位。用户点击预约按钮，触发页面中的appointment方法。此方法把用户所输入的个人信息当作参数通过Ajax传递给后端路由接口getApp。getApp方法接收到所传递的参数后通过SQL语句插入到数据库中。执行后返回一个结果值，并将此结果值通过res.send方法返回给前端路由。前端界面接收到返回的结果值后，对此结果值进行判断，提示用户是否预约成功。 （3）管理员回答用户提出问题功能模块。管理员可以通过此模块对用户提出的问题进行回答。当管理员点击问题后面的回答按钮时，触发页面中的toAnswer方法Error! Reference source not found.。此方法把回答问题的id和问题内容当作参数携带到回答界面并进行数据显示。当管理员将问题的回答内容输入完成之后点击提交按钮时。触发页面中的answer方法。此方法把管理员所输入的回答信息和问题id当作参数通过Ajax传递给后端路由接口getAnswer。getAnswer方法接收到所传递的参数后通过SQL语句修改数据库中对应问题的answer字段Error! Reference source not found.。执行后返回一个结果值，并将此结果值通过res.send方法返回给前端路由。前端界面接收到返回的结果值后，对此结