feat: 安装页面

This commit is contained in:
禾几海
2020-10-22 00:21:23 +08:00
parent 9dafc6d5a7
commit 76f3d16e09
4 changed files with 91 additions and 0 deletions

View File

@@ -100,4 +100,10 @@ public class InstallController {
return Response.success(installParam);
}
@GetMapping("/install")
public String install() {
return "install.html";
}
}

View File

@@ -13,4 +13,10 @@ public class InstallParam {
private String dbUrl;
private String dbUsername;
private String dbPassword;
/**
* user 相关
*/
private String email;
private String password;
}

View File

@@ -0,0 +1,33 @@
* {
margin: 0;
padding: 0;
}
html, body {
width: 100%;
height: 100%;
}
.box {
width: 40vw;
height: 50vh;
padding: 8px 10px;
border: 1px solid rgba(50, 50, 50, .1);
border-radius: 3px;
position: relative;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.box-inner {
height: 100%;
width: 100%;
background: #ececec;
}
.box-inner select, input, button {
width: 90%;
margin: 8px 5%;
}

View File

@@ -0,0 +1,46 @@
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>博客安装页面</title>
<link rel="stylesheet" href="css/install.css">
<script src="//cdn.bootcdn.net/ajax/libs/jquery/1.10.0/jquery.min.js"></script>
</head>
<body>
<div class="box">
<div class="box-inner">
<!-- 数据库-->
<select id="db-type">
<option value="h2">H2数据库</option>
<option value="mysql">Mysql数据库</option>
</select>
<input id="db-url" type="text" placeholder="请输入数据库的地址">
<input id="db-username" type="text" placeholder="数据库用户名">
<input id="db-password" type="text" placeholder="数据库密码">
<button onclick="postInstallEvent()">安装</button>
</div>
</div>
<script type="text/javascript">
function postInstallEvent() {
const requestData = {
dbPassword: $('#db-password').val(),
dbType: $('#db-type').val(),
dbUrl: $('#db-url').val(),
dbUsername: $('#db-username').val(),
email: '',
password: '',
}
$.ajax('/install', {
method: "POST",
contentType: 'application/json',
data: JSON.stringify(requestData),
dataType: 'json',
success: function (data) {
console.log("data", data);
console.log("requestData",requestData);
}
})
}
</script>
</body>
</html>