mirror of https://github.com/jumpserver/jumpserver
290 lines
14 KiB
HTML
290 lines
14 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Jumpserver Install</title>
|
|
<!-- <link href="css/bootstrap.min.css" rel="stylesheet"> -->
|
|
<link href="/static/css/bootstrap.min.css" rel="stylesheet">
|
|
<!-- <link href="font-awesome/css/font-awesome.css" rel="stylesheet"> -->
|
|
<!-- <link href="css/plugins/iCheck/custom.css" rel="stylesheet"> -->
|
|
<link href="/static/css/plugins/steps/jquery.steps.css" rel="stylesheet">
|
|
<!-- <link href="css/animate.css" rel="stylesheet"> -->
|
|
<!-- <link href="css/style.css" rel="stylesheet"> -->
|
|
<link href="/static/css/style.css" rel="stylesheet">
|
|
<style>
|
|
.wizard-big.wizard > .content {
|
|
min-height: 320px;
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body>
|
|
<div id="wrapper">
|
|
<div class="row" >
|
|
<div class="col-sm-12" >
|
|
<div class="ibox">
|
|
<div class="ibox-title">
|
|
<h5>向导</h5>
|
|
<div class="ibox-tools">
|
|
<a class="collapse-link">
|
|
<i class="fa fa-chevron-up"></i>
|
|
</a>
|
|
<a class="dropdown-toggle" data-toggle="dropdown" href="#">
|
|
<i class="fa fa-wrench"></i>
|
|
</a>
|
|
<a class="close-link">
|
|
<i class="fa fa-times"></i>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<div class="ibox-content" style="height: 900px;">
|
|
<h2>
|
|
安装向导
|
|
</h2>
|
|
<p>
|
|
请输入相关信息完成安装
|
|
</p>
|
|
|
|
<form id="form" action="#" class="wizard-big" >
|
|
{# <h1>管理员账户</h1>#}
|
|
{# <fieldset>#}
|
|
{# <h2>管理员账号是首次登陆的账号</h2>#}
|
|
{# <div class="row">#}
|
|
{# <div class="col-sm-6">#}
|
|
{# <div class="form-group">#}
|
|
{# <label>用户名 *</label>#}
|
|
{# <input id="username" name="username" type="text" class="form-control required" minlength="5" >#}
|
|
{# </div>#}
|
|
{# <div class="form-group">#}
|
|
{# <label>密码 *</label>#}
|
|
{# <input id="password" name="password" type="password" class="form-control required password" minlength="8">#}
|
|
{# </div>#}
|
|
{# </div>#}
|
|
{# <div class="col-sm-6">#}
|
|
{# <div class="form-group">#}
|
|
{# <label>邮件 *</label>#}
|
|
{# <input id="email" name="email" type="email" class="form-control required">#}
|
|
{# </div>#}
|
|
{# <div class="form-group">#}
|
|
{# <label>确认密码 *</label>#}
|
|
{# <input id="pass_confirm" name="pass_confirm" type="password" equalto="#password" class="form-control required">#}
|
|
{# </div>#}
|
|
{# </div>#}
|
|
{# <div class="col-sm-4">#}
|
|
{# <div class="text-center">#}
|
|
{# <div style="margin-top: 20px">#}
|
|
{# <i class="fa fa-sign-in" style="font-size: 180px;color: #e5e5e5 "></i>#}
|
|
{# </div>#}
|
|
{# </div>#}
|
|
{# </div>#}
|
|
{# </div>#}
|
|
{# </fieldset>#}
|
|
<h1>数据库</h1>
|
|
<fieldset>
|
|
<h2>数据库连接信息</h2>
|
|
<div class="row">
|
|
<div class="col-sm-6">
|
|
<div class="form-group">
|
|
<label>地址 *</label>
|
|
<input id="db_host" name="db_host" type="text" class="form-control required">
|
|
</div>
|
|
<div class="form-group">
|
|
<label>端口 *</label>
|
|
<input id="db_port" name="db_port" type="text" class="form-control required number">
|
|
</div>
|
|
<div class="form-group">
|
|
<label>数据库 *</label>
|
|
<input id="db" name="db" type="text" class="form-control required">
|
|
</div>
|
|
</div>
|
|
<div class="col-sm-6">
|
|
<div class="form-group">
|
|
<label>用户名 *</label>
|
|
<input id="db_user" name="db_user" type="text" class="form-control required">
|
|
</div>
|
|
<div class="form-group">
|
|
<label>密码 *</label>
|
|
<input id="db_pass" name="db_pass" type="password" class="form-control">
|
|
</div>
|
|
<div class="form-group">
|
|
<div></div>
|
|
<a id="db_btn" value="{% url 'install_test' 'db' %}" class="btn btn-sm btn-warning" style="float: right"> 测试连接 </a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</fieldset>
|
|
|
|
<h1>邮件设置</h1>
|
|
<fieldset>
|
|
<h2>邮件设置</h2>
|
|
<div class="row">
|
|
<div class="col-sm-6">
|
|
<div class="form-group">
|
|
<label>SMTP *</label>
|
|
<input id="smtp_host" name="smtp_host" type="text" class="form-control required">
|
|
</div>
|
|
<div class="form-group">
|
|
<label>端口 *</label>
|
|
<input id="smtp_port" name="smtp_port" type="text" class="form-control required">
|
|
</div>
|
|
</div>
|
|
<div class="col-sm-6">
|
|
<div class="form-group">
|
|
<label>邮件地址 *</label>
|
|
<input id="mail_addr" name="mail_addr" type="text" class="form-control required">
|
|
</div>
|
|
<div class="form-group">
|
|
<label>密码 *</label>
|
|
<input id="mail_pass" name="mail_pass" type="password" class="form-control">
|
|
</div>
|
|
<div class="form-group">
|
|
<div></div>
|
|
<a id="mail_btn" href="{% url 'install_test' 'mail' %}" class="btn btn-sm btn-warning" style="float: right"> 测试邮件 </a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</fieldset>
|
|
|
|
<h1>完成</h1>
|
|
<fieldset>
|
|
<h2>Terms and Conditions</h2>
|
|
<input id="acceptTerms" name="acceptTerms" type="checkbox" class="required"> <label for="acceptTerms">I agree with the Terms and Conditions.</label>
|
|
</fieldset>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
<!-- Mainly scripts -->
|
|
<!-- // <script src="js/jquery-2.1.1.js"></script> -->
|
|
<script src="/static/js/jquery-2.1.1.js"></script>
|
|
<script src="/static/js/bootstrap.min.js"></script>
|
|
<!-- // <script src="js/plugins/metisMenu/jquery.metisMenu.js"></script> -->
|
|
<script src="/static/js/plugins/metisMenu/jquery.metisMenu.js"></script>
|
|
<!-- // <script src="js/plugins/slimscroll/jquery.slimscroll.min.js"></script> -->
|
|
|
|
<!-- Custom and plugin javascript -->
|
|
<!-- // <script src="js/inspinia.js"></script> -->
|
|
<!-- // <script src="js/plugins/pace/pace.min.js"></script> -->
|
|
|
|
<!-- Steps -->
|
|
<script src="/static/js/plugins/steps/jquery.steps.min.js"></script>
|
|
|
|
<!-- Jquery Validate -->
|
|
<script src="/static/js/plugins/validate/jquery.validate.min.js"></script>
|
|
|
|
|
|
<script>
|
|
$(document).ready(function(){
|
|
// $("#wizard").steps();
|
|
|
|
$('#db_btn').click(function(){
|
|
console.log('hello');
|
|
var db_host = $('#db_host').val();
|
|
var db_port = $('#db_port').val();
|
|
var db_user = $('#db_user').val();
|
|
var db_pass = $('#db_pass').val();
|
|
$.post(
|
|
$(this).attr('value'),
|
|
{'db_host': db_host,
|
|
'db_port': db_port,
|
|
'db_user': db_user,
|
|
'db_pass': db_pass
|
|
},
|
|
function(data, status){
|
|
alert(data)
|
|
}
|
|
|
|
);
|
|
return false;
|
|
|
|
});
|
|
|
|
$("#form").steps({
|
|
bodyTag: "fieldset",
|
|
onStepChanging: function (event, currentIndex, newIndex)
|
|
{
|
|
// Always allow going backward even if the current step contains invalid fields!
|
|
if (currentIndex > newIndex)
|
|
{
|
|
return true;
|
|
}
|
|
|
|
// Forbid suppressing "Warning" step if the user is to young
|
|
if (newIndex === 3 && Number($("#age").val()) < 18)
|
|
{
|
|
return false;
|
|
}
|
|
|
|
var form = $(this);
|
|
|
|
// Clean up if user went backward before
|
|
if (currentIndex < newIndex)
|
|
{
|
|
// To remove error styles
|
|
$(".body:eq(" + newIndex + ") label.error", form).remove();
|
|
$(".body:eq(" + newIndex + ") .error", form).removeClass("error");
|
|
}
|
|
|
|
// Disable validation on fields that are disabled or hidden.
|
|
form.validate().settings.ignore = ":disabled,:hidden";
|
|
|
|
// Start validation; Prevent going forward if false
|
|
return form.valid();
|
|
},
|
|
onStepChanged: function (event, currentIndex, priorIndex)
|
|
{
|
|
// Suppress (skip) "Warning" step if the user is old enough.
|
|
if (currentIndex === 2 && Number($("#age").val()) >= 18)
|
|
{
|
|
$(this).steps("next");
|
|
}
|
|
|
|
// Suppress (skip) "Warning" step if the user is old enough and wants to the previous step.
|
|
if (currentIndex === 2 && priorIndex === 3)
|
|
{
|
|
$(this).steps("previous");
|
|
}
|
|
},
|
|
onFinishing: function (event, currentIndex)
|
|
{
|
|
var form = $(this);
|
|
|
|
// Disable validation on fields that are disabled.
|
|
// At this point it's recommended to do an overall check (mean ignoring only disabled fields)
|
|
form.validate().settings.ignore = ":disabled";
|
|
|
|
// Start validation; Prevent form submission if false
|
|
return form.valid();
|
|
},
|
|
onFinished: function (event, currentIndex)
|
|
{
|
|
var form = $(this);
|
|
|
|
// Submit form input
|
|
form.submit();
|
|
}
|
|
}).validate({
|
|
errorPlacement: function (error, element)
|
|
{
|
|
element.before(error);
|
|
},
|
|
rules: {
|
|
confirm: {
|
|
equalTo: "#password"
|
|
}
|
|
}
|
|
});
|
|
});
|
|
</script>
|
|
|
|
</body>
|
|
|
|
</html>
|