nodelqs0915/installPage/views/home.ejs

263 lines
11 KiB
Plaintext
Raw Permalink Normal View History

2024-09-16 22:54:51 +08:00
<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>