263 lines
11 KiB
Plaintext
263 lines
11 KiB
Plaintext
<html>
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<title>首页</title>
|
||
<link rel="stylesheet" href="/css/home.css">
|
||
</head>
|
||
<body>
|
||
<div class="loading-style u-f u-f-ac u-f-ajc">
|
||
<div class="loading-icon">
|
||
<span style="background:blue"></span>
|
||
<span style="background:blue"></span>
|
||
<span style="background:blue"></span>
|
||
<span style="background:blue"></span>
|
||
<span style="background:blue"></span>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="container">
|
||
<%if(isConfigItem == true){%>
|
||
<input type="text" value="1" style="display: none" id="isConfigItem">
|
||
<%}else{%>
|
||
<input type="text" value="2" style="display: none" id="isConfigItem">
|
||
<%}%>
|
||
<%if(isConfigItem == true){%>
|
||
<div class="u-f u-f-ac u-f-ajc" style="margin-top:20px;">
|
||
<button class="btn startItem" style="margin-right: 10px;">开启项目</button>
|
||
<button class="btn reconfigure" style="margin-right: 10px;">重新配置</button>
|
||
</div>
|
||
<%}else{%>
|
||
<div class="form">
|
||
<div class="form-title">
|
||
redis配置
|
||
</div>
|
||
<label>
|
||
<input type="text" class="input redis-input" id="redisHost" autocomplete="false" placeholder="redis的ip地址(必填)">
|
||
</label>
|
||
<label>
|
||
<input type="text" class="input redis-input" id="redisPort" autocomplete="false" placeholder="redis端口号(必填)">
|
||
</label>
|
||
<label>
|
||
<input type="text" class="input redis-input" id="redisPassword" autocomplete="false" placeholder="redis的密码(必填)">
|
||
</label>
|
||
<div class="u-f u-f-ac u-f-ajc">
|
||
<button class="btn connectRedis" style="margin-right:10px;">测试连接</button>
|
||
<div style="color:green;display: none" id="redis-status-success">redis连接成功!</div>
|
||
<div style="color:red;display: none" id="redis-status-fail">redis连接失败!</div>
|
||
</div>
|
||
</div>
|
||
<div class="form mysql-form-style" style="margin-top:30px;">
|
||
<div class="form-title">
|
||
mysql配置
|
||
</div>
|
||
<label>
|
||
<input type="text" class="input mysql-input" id="mysqlIp" autocomplete="false" placeholder="mysql的ip地址(必填)">
|
||
</label>
|
||
<label>
|
||
<input type="text" class="input mysql-input" id="mysqlPort" autocomplete="false" placeholder="mysql端口号(必填)">
|
||
</label>
|
||
<label>
|
||
<input type="text" class="input mysql-input" id="mysqlUser" autocomplete="false" placeholder="mysql用户名(必填)">
|
||
</label>
|
||
<label>
|
||
<input type="text" class="input mysql-input" id="mysqlPassword" autocomplete="false" placeholder="mysql密码(必填)">
|
||
</label>
|
||
<div class="u-f u-f-ac u-f-ajc">
|
||
<button class="btn connectMysql" style="margin-right: 10px;">测试连接</button>
|
||
<div style="color:green;display: none" id="mysql-status-success">mysql连接成功!</div>
|
||
<div style="color:red;display: none" id="mysql-status-fail">mysql连接失败!</div>
|
||
</div>
|
||
</div>
|
||
<div class="form importSql-form-style" style="margin-top:30px;">
|
||
<label>
|
||
<input type="file" class="importSql-input" name="sqlFile" id="sqlFile" accept=".sql" autocomplete="false">
|
||
</label>
|
||
<label>
|
||
<input type="text" class="input importSql-input" id="dbName" autocomplete="false" placeholder="数据库名(非必填)">
|
||
</label>
|
||
<div class="u-f u-f-ac u-f-ajc">
|
||
<button class="btn importDBase" style="margin-right: 10px;">导入数据库</button>
|
||
<div style="color:green;display: none" id="importSql-status-success">数据库导入成功!</div>
|
||
<div style="color:red;display: none" id="importSql-status-fail">数据库导入失败!</div>
|
||
</div>
|
||
</div>
|
||
<div class="u-f u-f-ac u-f-ajc" style="margin-top:20px;">
|
||
<button class="btn startItem startBtn" style="margin-right: 10px;">开启项目</button>
|
||
</div>
|
||
<%}%>
|
||
|
||
</div>
|
||
|
||
<script type="text/javascript" src="/js/axios.min.js"></script>
|
||
<script type="text/javascript" src="/js/jquery.min.js"></script>
|
||
<script>
|
||
$(function() {
|
||
$('.loading-style').attr('style','display:none!important;');
|
||
$('.connectRedis').click(function() {
|
||
let redisHost = $('#redisHost').val().trim()
|
||
let redisPort = $('#redisPort').val().trim()
|
||
let redisPassword = $('#redisPassword').val().trim()
|
||
if(!redisHost || !redisPort || !redisPassword) {
|
||
alert('redis配置不能为空！');
|
||
return false;
|
||
}
|
||
$('.loading-style').show()
|
||
let data = new FormData()
|
||
data.append("redisHost",redisHost)
|
||
data.append("redisPort",redisPort)
|
||
data.append("redisPassword",redisPassword)
|
||
axios.post("/connectRedis",data).then(res=>{
|
||
let {msg,data,code} = res.data;
|
||
if(data==true){
|
||
$("#redis-status-success").show()
|
||
$("#redis-status-fail").hide()
|
||
$(".mysql-form-style").show()
|
||
$(".redis-input").attr("disabled","disabled");
|
||
$(".connectRedis").attr("disabled","disabled");
|
||
}else{
|
||
$("#redis-status-fail").hide()
|
||
$("#redis-status-fail").show()
|
||
$(".mysql-form-style").hide()
|
||
$(".importSql-form-style").hide()
|
||
}
|
||
$('.loading-style').attr('style','display:none!important');
|
||
})
|
||
});
|
||
|
||
$('.connectMysql').click(function() {
|
||
let mysqlIp = $('#mysqlIp').val().trim()
|
||
let mysqlPort = $('#mysqlPort').val().trim()
|
||
let mysqlUser = $('#mysqlUser').val().trim()
|
||
let mysqlPassword = $('#mysqlPassword').val().trim()
|
||
if(!mysqlIp || !mysqlPort || !mysqlUser || !mysqlPassword) {
|
||
alert('mysql配置不能为空！');
|
||
return false;
|
||
}
|
||
$('.loading-style').show()
|
||
let data = new FormData()
|
||
data.append("mysqlIp",mysqlIp)
|
||
data.append("mysqlPort",mysqlPort)
|
||
data.append("mysqlUser",mysqlUser)
|
||
data.append("mysqlPassword",mysqlPassword)
|
||
axios.post("/connectMysql",data).then(res=>{
|
||
let {msg,data,code} = res.data;
|
||
if(data==true){
|
||
$("#mysql-status-success").show()
|
||
$("#mysql-status-fail").hide()
|
||
$(".importSql-form-style").show()
|
||
$(".mysql-input").attr("disabled","disabled");
|
||
$(".connectMysql").attr("disabled","disabled");
|
||
}else{
|
||
$("#mysql-status-fail").hide()
|
||
$("#mysql-status-fail").show()
|
||
$(".importSql-form-style").hide()
|
||
}
|
||
$('.loading-style').attr('style','display:none!important');
|
||
})
|
||
});
|
||
$('.importDBase').click(function() {
|
||
let sqlFile = $('#sqlFile')[0].files[0];
|
||
let dbName = $('#dbName').val().trim()
|
||
let mysqlIp = $('#mysqlIp').val().trim()
|
||
let mysqlPort = $('#mysqlPort').val().trim()
|
||
let mysqlUser = $('#mysqlUser').val().trim()
|
||
let mysqlPassword = $('#mysqlPassword').val().trim()
|
||
let redisHost = $('#redisHost').val().trim()
|
||
let redisPort = $('#redisPort').val().trim()
|
||
let redisPassword = $('#redisPassword').val().trim()
|
||
if(!redisHost || !redisPort || !redisPassword || !mysqlIp || !mysqlPort || !mysqlUser || !mysqlPassword || !sqlFile) {
|
||
alert('配置不能为空！');
|
||
return false;
|
||
}
|
||
$('.loading-style').show()
|
||
let data = new FormData()
|
||
data.append("sqlFile",sqlFile)
|
||
data.append("redisHost",redisHost)
|
||
data.append("redisPort",redisPort)
|
||
data.append("redisPassword",redisPassword)
|
||
data.append("dbName",dbName)
|
||
data.append("mysqlIp",mysqlIp)
|
||
data.append("mysqlPort",mysqlPort)
|
||
data.append("mysqlUser",mysqlUser)
|
||
data.append("mysqlPassword",mysqlPassword)
|
||
axios.post("/importDBase",data).then(res=>{
|
||
let {msg,data,code} = res.data;
|
||
if(msg == 1 && data){
|
||
$("#importSql-status-success").show()
|
||
$("#importSql-status-fail").hide()
|
||
$(".connectMysql").hide()
|
||
$(".importSql-input").attr("disabled","disabled");
|
||
$(".connectRedis").attr("disabled","disabled");
|
||
$(".importDBase").attr("disabled","disabled");
|
||
$(".importDBase").attr("disabled","disabled");
|
||
$(".startBtn").attr("style","display:block;margin-right: 10px;");
|
||
}else if(msg == 2){//数据库存在
|
||
alert("数据库已存在，请清空再导入")
|
||
}else{
|
||
$("#importSql-status-fail").hide()
|
||
$("#importSql-status-fail").show()
|
||
}
|
||
$('.loading-style').attr('style','display:none!important');
|
||
})
|
||
});
|
||
$('.startItem').click(function() {
|
||
let isConfigItem = $('#isConfigItem').val()
|
||
if(isConfigItem == 1){
|
||
let data = new FormData()
|
||
data.append("isConfigItem",isConfigItem)
|
||
axios.post("/startItem",data).then(res=>{
|
||
console.log(res);
|
||
let {msg,data,code} = res.data;
|
||
|
||
$('.loading-style').attr('style','display:none!important');
|
||
})
|
||
}else{
|
||
let sqlFile = $('#sqlFile')[0].files[0];
|
||
let dbName = $('#dbName').val().trim()
|
||
let mysqlIp = $('#mysqlIp').val().trim()
|
||
let mysqlPort = $('#mysqlPort').val().trim()
|
||
let mysqlUser = $('#mysqlUser').val().trim()
|
||
let mysqlPassword = $('#mysqlPassword').val().trim()
|
||
let redisHost = $('#redisHost').val().trim()
|
||
let redisPort = $('#redisPort').val().trim()
|
||
let redisPassword = $('#redisPassword').val().trim()
|
||
if(!redisHost || !redisPort || !redisPassword || !mysqlIp || !mysqlPort || !mysqlUser || !mysqlPassword || !sqlFile) {
|
||
alert('mysql配置不能为空！');
|
||
return false;
|
||
}
|
||
$('.loading-style').show()
|
||
let data = new FormData()
|
||
data.append("sqlFile",sqlFile)
|
||
data.append("dbName",dbName)
|
||
data.append("mysqlIp",mysqlIp)
|
||
data.append("mysqlPort",mysqlPort)
|
||
data.append("mysqlUser",mysqlUser)
|
||
data.append("mysqlPassword",mysqlPassword)
|
||
data.append("redisHost",redisHost)
|
||
data.append("redisPort",redisPort)
|
||
data.append("redisPassword",redisPassword)
|
||
data.append("isConfigItem",isConfigItem)
|
||
axios.post("/startItem",data).then(res=>{
|
||
console.log(res);
|
||
let {msg,data,code} = res.data;
|
||
|
||
$('.loading-style').attr('style','display:none!important');
|
||
})
|
||
}
|
||
});
|
||
$('.reconfigure').click(function() {
|
||
if (window.confirm("是否确定要重新配置?")) {
|
||
$('.loading-style').show()
|
||
axios.post("/reconfigure").then(res=>{
|
||
console.log(res);
|
||
|
||
$('.loading-style').attr('style','display:none!important');
|
||
window.location.Reload()
|
||
})
|
||
}
|
||
});
|
||
});
|
||
</script>
|
||
</body>
|
||
</html>
|