目 录
摘  要 1
Abstract 2
1 概述 3
1.1 研究背景、目的与意义 3
1.2 共享经济体及共享电源的现状 4
1.3 研究/设计的主要内容 4
2 前端开发相关技术简介 5
2.1 HTML 5
2.2 CSS 5
2.3 JavaScript 5
2.4 Jquery框架 5
3 系统分析 7
3.1 前端开发目标 7
3.2 功能需求分析 7
3.3 可行性分析 8
3.4 性能需求分析 9
3.5 运行环境及开发环境 9
4 系统设计 11
4.1 前端结构设计 11
5 系统实现 12
5.1用户登录功能实现 12
5.2 用户注册功能实现 13
5.3 掌电APP首页功能实现 15
5.4 掌电APP扫码租借功能实现 18
5.5 掌电APP归还功能实现 19
5.6 掌电APP搜索功能实现 20
5.7 掌电APP我的页面功能实现 23
5.8 掌电APP充值储蓄功能实现 26
5.9 掌电APP修改信息功能实现 28
5.10 掌电APP咨询阅读功能实现 29
5.11 掌电APP故障报修功能实现 32
结论 34
参考文献 35
致谢 36
摘  要
随时代的进步手机APP开发处于高速发展阶段，并且每个APP也越来越大，导致手机耗电速度大大提高。如果人们出行忘记随身携带一个移动电源，那么很快就会面临手机没电的尴尬处境，影响人们的衣食住行以及社交休闲等等。所以为解决这种尴尬处境，开发一款共享性质的移动电源APP变得很有必要，配合实际生活中的共享移动电源租借设备来使用再合适不过。本论文重点阐述的是一款为线下门店内共享移动电源提供租借服务的线上租借类APP。基于HBUIDER中MUI框架下开发编写的移动端软件。在不连接后台的情况下所开发出来的一款共享移动电源的前端设计，使用了HTML与CSS、JAVASCRIPT、JQUERY等前端技术。掌电APP的前端主要功能包括实现查询用户附近的可共享的移动电源数量以及显示用户与附近可共享的移动电源的距离； 在掌电APP上兼并了租借与归还这两个重要的功能，并且支持用户向掌电APP里充值储备的功能。实现了用户能随时随地畅享共享移动电源的服务功能。
关键词：共享移动电源；掌电；用户注册 ；前端开发
Abstract
With the progress of The Times, mobile phone APP development is in the stage of rapid development, and each APP is getting bigger and bigger, leading to greatly increased power consumption speed of mobile phones. If people forget to carry a mobile power source with them when they go out, they will soon face the embarrassing situation that their mobile phones are out of power, which will affect people's basic necessities of life, such as clothing, food, housing, transportation, social activities and so on. Therefore, in order to solve this awkward situation, it is necessary to develop a Shared mobile power APP, which is suitable for sharing mobile power rental devices in real life. This paper focuses on an online rental APP that provides rental services for sharing mobile power in offline stores. Based on the MUI framework in HBUIDER development and preparation of mobile software. The front-end design of a Shared mobile power supply developed without connecting the background USES HTML, CSS, JAVASCRIPT, JQUERY and other front-end technologies. The main front-end functions of the palm power APP include the realization of inquiring the number of Shared mobile power supplies near the user and displaying the distance between the user and the Shared mobile power supplies nearby. The two important functions of renting and returning are merged in the palm power APP, and the function of charging reserve to the palm power APP is also supported. It realizes the service function that users can enjoy and share mobile power anytime and anywhere
Key  words: Share mobile power supply; The APP; HTML; The front-end development