Introduction:
With the development of society, all walks of life are taking advantage of the information age. The superiority and popularization of computer make it necessary to develop all kinds of information system. Bike online rental management system, the main modules include home page, personal center, user management, member management, bike rental management, rental management, member rental management, return car management, member return car management, classification column management, message board management, system management and other functions. The system administrator is mainly for the safe and effective storage and management of all kinds of information, but also can manage the system and update maintenance operations, and has the corresponding operation rights on the background. In order to realize the functions of the bicycle online rental management system, it needs the strong support of the background database. The administrator verifies the registration information, collects the information, and thus obtains the association information and so on the large amount of data by the database management. In this paper, the database server uses Mysql as the background database, so that the Web and database are closely linked. In the design process, the system code is fully guaranteed to be readable, practical, easy to expand, universal, easy to maintain, easy to operate and simple page characteristics. The development of this system makes it more convenient to obtain the information of the bicycle online rental management system, and also makes the management information of the bicycle online rental management system become more systematic and orderly. The system interface is friendly and easy to operate.
Functional design:
The bicycle online rental management system is based on Web service mode, which is a model structure suitable for Internet environment. As long as users can connect to the Internet, they can use this system in no time or place. The working principle diagram of the online bicycle rental management system is shown in the figure below:
System architecture diagram belongs to the system design stage, system architecture diagram is only a product of this stage, the overall architecture of the system determines the mode of the whole system, is the foundation of the system. The overall structure design of the bicycle online rental management system is shown in the figure.
Function screenshots:
Home Login registration:
Client: bicycle online rental management system, in the home page of the system can view the home page, bicycle rental, activities, message feedback, personal center, background management, online customer service and other information for detailed operation
Bicycle rental, in the bicycle rental page, you can view the bicycle number, brand, classification, specifications, profile, current price, current price of members, click times, pictures and other information, and conduct rental, member rental operations.
Cycling activities
Feedback:
Personal Center:
Administrator side: Administrator login into the system, you can to see all of the information, you can view the home page, personal center, user management, member management, bicycle rental, lease management, leasing management, car management, members also car management, classified management, message board management, system management, etc., and can also carry on the corresponding operation management
User Information:
Bicycle rental management:
Car return management:
Classified column:
Message boards and replies:
Home page rotation map:
Event Management:
Key code:
Back-end login controller:
/** * Login related */
@RequestMapping("users")
@RestController
public class UserController{
@Autowired
private UserService userService;
@Autowired
private TokenService tokenService;
/** * login */
@IgnoreAuth
@PostMapping(value = "/login")
public R login(String username, String password, String captcha, HttpServletRequest request) {
UserEntity user = userService.selectOne(new EntityWrapper<UserEntity>().eq("username", username));
if(user==null| |! user.getPassword().equals(password)) {return R.error("Incorrect account number or password");
}
String token = tokenService.generateToken(user.getId(),username, "users", user.getRole());
return R.ok().put("token", token);
}
/** * Register */
@IgnoreAuth
@PostMapping(value = "/register")
public R register(@RequestBody UserEntity user){
// ValidatorUtils.validateEntity(user);
if(userService.selectOne(new EntityWrapper<UserEntity>().eq("username", user.getUsername())) ! =null) {
return R.error("User already exists");
}
userService.insert(user);
return R.ok();
}
/** * exit */
@GetMapping(value = "logout")
public R logout(HttpServletRequest request) {
request.getSession().invalidate();
return R.ok("Exit successful");
}
/**
* 密码重置
*/
@IgnoreAuth
@RequestMapping(value = "/resetPass")
public R resetPass(String username, HttpServletRequest request){
UserEntity user = userService.selectOne(new EntityWrapper<UserEntity>().eq("username", username));
if(user==null) {
return R.error("Account does not exist");
}
user.setPassword("123456");
userService.update(user,null);
return R.ok("Password reset to 123456");
}
/** * list */
@RequestMapping("/page")
public R page(@RequestParam Map<String, Object> params,UserEntity user){
EntityWrapper<UserEntity> ew = new EntityWrapper<UserEntity>();
PageUtils page = userService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.allLike(ew, user), params), params));
return R.ok().put("data", page);
}
/** * list */
@RequestMapping("/list")
public R list( UserEntity user){
EntityWrapper<UserEntity> ew = new EntityWrapper<UserEntity>();
ew.allEq(MPUtil.allEQMapPre( user, "user"));
return R.ok().put("data", userService.selectListView(ew));
}
/** * info */
@RequestMapping("/info/{id}")
public R info(@PathVariable("id") String id){
UserEntity user = userService.selectById(id);
return R.ok().put("data", user);
}
/** * Get user session user information */
@RequestMapping("/session")
public R getCurrUser(HttpServletRequest request){
Long id = (Long)request.getSession().getAttribute("userId");
UserEntity user = userService.selectById(id);
return R.ok().put("data", user);
}
/** * save */
@PostMapping("/save")
public R save(@RequestBody UserEntity user){
// ValidatorUtils.validateEntity(user);
if(userService.selectOne(new EntityWrapper<UserEntity>().eq("username", user.getUsername())) ! =null) {
return R.error("User already exists");
}
userService.insert(user);
return R.ok();
}
/** * modify */
@RequestMapping("/update")
public R update(@RequestBody UserEntity user){
// ValidatorUtils.validateEntity(user);
UserEntity u = userService.selectOne(new EntityWrapper<UserEntity>().eq("username", user.getUsername()));
if(u! =null&& u.getId()! =user.getId() && u.getUsername().equals(user.getUsername())) {return R.error("User name already exists.");
}
userService.updateById(user);// All updates
return R.ok();
}
/** * delete */
@RequestMapping("/delete")
public R delete(@RequestBody Long[] ids){
userService.deleteBatchIds(Arrays.asList(ids));
returnR.ok(); }}Copy the codeFront-end login VUE code:
<template>
<div>
<div class="container loginIn" style="backgroundImage: url(http://localhost:8080/springbootl5za3/upload/login_bg.png)">
<div :class="2 == 1 ? 'left' : 2 == 2 ? 'left center' : 'left right'" style=BackgroundColor: RGBA (221, 239, 223, 0.3)>
<el-form class="login-form" label-position="left" :label-width="1 == 3 ? '56px' : '0px'">
<div class="title-container"><h3 class="title" style="Color: rgba(86, 188, 225, 0.89)>Bicycle online rental management system login</h3></div>
<el-form-item :label="1 = = 3? 'Username' : '" :class="'style'+1">
<span v-if="1 != 3" class="svg-container" style="Color: rgba (16, 15, 15, 0.97); line-height:44px"><svg-icon icon-class="user" /></span>
<el-input placeholder="Please enter user name" name="username" type="text" v-model="rulesForm.username" />
</el-form-item>
<el-form-item :label="1 = = 3? 'Password' :" :class="'style'+1">
<span v-if="1 != 3" class="svg-container" style="Color: rgba (16, 15, 15, 0.97); line-height:44px"><svg-icon icon-class="password" /></span>
<el-input placeholder="Please enter your password" name="password" type="password" v-model="rulesForm.password" />
</el-form-item>
<el-form-item v-if="0 = = '1'" class="code" :label="1 = = 3? 'Verification code' :" :class="'style'+1">
<span v-if="1 != 3" class="svg-container" style="Color: rgba (16, 15, 15, 0.97); line-height:44px"><svg-icon icon-class="code" /></span>
<el-input placeholder="Please enter the verification code." name="code" type="text" v-model="rulesForm.code" />
<div class="getCodeBt" @click="getRandCode(4)" style="height:44px; line-height:44px">
<span v-for="(item, index) in codes" :key="index" :style="{color:item.color,transform:item.rotate,fontSize:item.size}">{{ item.num }}</span>
</div>
</el-form-item>
<el-form-item label="Role" prop="loginInRole" class="role">
<el-radio
v-for="item in menus"
v-if="Item. HasBackLogin = = 'is'"
v-bind:key="item.roleName"
v-model="rulesForm.role"
:label="item.roleName"
>{{item.roleName}}</el-radio>
</el-form-item>
<el-button type="primary" @click="login()" class="loginInBt" style="padding:0; font-size:16px; border-radius:20px; height:44px; line-height:44px; width:100%; backgroundColor:rgba(64, 158, 255, 1); borderColor:rgba(64, 158, 255, 1); color:rgba(17, 17, 17, 1)">{{' 1 '= =' 1 '? 'login' : 'login'}}</el-button>
<el-form-item class="setting">
<! - < div style = "color: rgba (10, 10, 10, 1)" class = "reset" > change password < / div > -- >
</el-form-item>
</el-form>
</div>
</div>
</div>
</template>
<script>Copy the codeDatabase design:
Transform the e-R diagram of database conceptual design into a relational database. In a relational database, data relationships consist of data tables, but the structure of the table is expressed in the fields of the table.
Table 4-1: Token table
| The field names | type | The length of the | Fields that |
| id | bigint | A primary key | |
| userid | bigint | The user id | |
| username | varchar | 100 | The user name |
| tablename | varchar | 100 | The name of the table |
| role | varchar | 100 | role |
| token | varchar | 200 | password |
| addtime | timestamp | The new time | |
| expiratedtime | timestamp | Expiration time |
Table 4-2: Activities
| The field names | type | The length of the | Fields that |
| id | bigint | A primary key | |
| addtime | timestamp | Creation time | |
| title | varchar | 200 | The title |
| introduction | longtext | 4294967295 | Introduction to the |
| picture | varchar | 200 | The picture |
| content | longtext | 4294967295 | content |
Table 4-3: Message boards
| The field names | type | The length of the | Fields that |
| id | bigint | A primary key | |
| addtime | timestamp | Creation time | |
| userid | bigint | A message people id | |
| username | varchar | 200 | The user name |
| content | longtext | 4294967295 | Message content |
| cpicture | varchar | 200 | Message pictures |
| reply | longtext | 4294967295 | Reply content |
| rpicture | varchar | 200 | Reply the picture |
Table 4-4: Membership rental
| The field names | type | The length of the | Fields that |
| id | bigint | A primary key | |
| addtime | timestamp | Creation time | |
| zixingchebianhao | varchar | 200 | Bicycle number |
| pinpai | varchar | 200 | brand |
| fenlei | varchar | 200 | classification |
| guige | varchar | 200 | specifications |
| jianjie | longtext | 4294967295 | Introduction to the |
| huiyuanshijia | int | Member of the current price | |
| zulinshizhang | int | The length of lease | |
| zongjia | int | The total price | |
| quchedian | varchar | 200 | Pick up some |
| zucheshijian | date | Rental time | |
| tupian | varchar | 200 | The picture |
| zhanghao | varchar | 200 | account |
| xingming | varchar | 200 | The name |
| sfsh | varchar | 200 | Whether the audit |
| shhf | longtext | 4294967295 | Review the reply |
| ispay | varchar | 200 | Whether or not to pay |
| longitude | float | longitude | |
| latitude | float | latitude | |
| fulladdress | varchar | 200 | address |
Table 4-5: Members return cars
| The field names | type | The length of the | Fields that |
| id | bigint | A primary key | |
| addtime | timestamp | Creation time | |
| zixingchebianhao | varchar | 200 | Bicycle number |
| pinpai | varchar | 200 | brand |
| fenlei | varchar | 200 | classification |
| guige | varchar | 200 | specifications |
| haichedian | varchar | 200 | Car point |
| haicheshijian | datetime | Car time | |
| zhanghao | varchar | 200 | account |
| tupian | varchar | 200 | The picture |
| xingming | varchar | 200 | The name |
| sfsh | varchar | 200 | Whether the audit |
| shhf | longtext | 4294967295 | Review the reply |
| longitude | float | longitude | |
| latitude | float | latitude | |
| fulladdress | varchar | 200 | address |
Thesis Report:
Pick to
1 System Overview
1.1 an overview of the
1.2 Significance of the project
1.3 Main Contents
2 System development environment
2.1 Spring Boot Framework
2.2 JAVA introduction
2.3 Access database implementation method
2.4 Two connection modes of the MySQL database
2.5 MySql Database
3 Demand Analysis
3.1 Technical feasibility: Technical background
3.2 Economic Feasibility
3.3 Operation Feasibility
3.4 System design rules
3.5 System flow and logic
4. System outline design
4.1 an overview of the
4.2 System Architecture
4.3. Database design
4.3.1 Database Entities
4.3.2 Database design table
5 Detailed system design
5.1 System Function Modules
5.2 Administrator Function Modules
5.3 User Function Modules
5.4 Member Function modules
6 System Test
6.1 Purpose of system Test
6.2 System test method
6.3 Test Results
conclusion
Thank you
reference
Source code:
Thumb up, collection, attention, comment, view 👇 🏻 👇 🏻 👇 🏻 WeChat public number for contact 👇 🏻 👇 🏻 👇 🏻
Clocked articles updated 212/365 days
Subscribe to the following column 👇🏻👇🏻 🏻👇 👇
Excellent practical case of Java Project 100 Sets
Web front-end final big homework Web combat “100 sets”