test_lgq/niucloud/app/install/view/base.html
2024-01-24 17:36:08 +08:00

148 lines
4.1 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<meta name="renderer" content="webkit" />
<meta http-equiv="X-UA-COMPATIBLE" content="IE=edge,chrome=1" />
<title>安装程序 - NiuCloud-Admin</title>
<!-- <script src="INSTALL_JS/jquery-2.2.js"></script>-->
<link rel="icon" type="image/x-icon" href="INSTALL_IMG/shop_bitbug_favicon.ico" />
<link rel="stylesheet" type="text/css" href="INSTALL_CSS/style.css" />
<link rel="stylesheet" type="text/css" href="INSTALL_CSS/layui.css" />
<link rel="stylesheet" type="text/css" href="INSTALL_CSS/common.css" />
<script src="INSTALL_JS/jquery-3.1.1.js"></script>
<script src="INSTALL_JS/layui.js"></script>
<script>
layui.use(['layer', 'upload', 'element'], function() {});
</script>
{block name="resources"}{/block}
</head>
<body>
<div class="head-block">
<div class="top">
<div class="top-logo">
<div class="top-logo-img">
<img src="INSTALL_IMG/logo.jpg">
</div>
<span class="bar">|</span>
<span class="logo-text">快速开发通用管理后台框架</span>
</div>
<div class="top-sub" style="flex:1;"></div>
<ul class="top-link">
<li><a href="https://www.niucloud.com/" target="_blank">官方网站</a></li>
<li><a href="https://bbs.niucloud.com/" target="_blank">技术论坛</a></li>
</ul>
</div>
</div>
<div class="step-content">
<div style="width:1000px;margin:0 auto;">
<!-- 标题进度条 start-->
<div class="content" style="margin:30px 0 0 0;width: 100%;">
<div class="processBar">
<div class="text" style="margin: 10px -25px;"><span class='poetry'>1.许可协议</span></div>
<div id="line0" class="bar">
<div id="point0" class="c-step c-select"></div>
</div>
</div>
<div class="processBar">
<div class="text" style="margin: 10px -30px;"><span class='poetry'>2.环境检测</span></div>
<div id="line1" class="bar">
<div id="point1" class="c-step"></div>
</div>
</div>
<div class="processBar">
<div class="text" style="margin: 10px -30px;"><span class='poetry'>3.参数配置</span></div>
<div id="line2" class="bar">
<div id="point2" class="c-step"></div>
</div>
</div>
<div class="processBar" style="width:10px;">
<div class="text" style="margin: 10px -39px;"><span class='poetry'>4.安装完成</span></div>
<div id="line3" class="bar" style="width: 0;">
<div id="point3" class="c-step"></div>
</div>
</div>
</div>
<!-- 标题进度条 end-->
<div style="clear: both;"></div>
</div>
</div>
<div class="install-content">
{block name='main'}{/block}
</div>
<script>
var index=0;
$(document).ready(function(){
$("#education").addClass('main-hide');
$("#work").addClass('main-hide');
$("#social").addClass('main-hide');
$('#previous_step').hide();
/*上一步*/
$('#previous_step').bind('click', function () {
index--;
ControlContent(index);
});
/*下一步*/
$('#next_step').bind('click', function () {
index++;
ControlContent(index);
});
});
function ControlContent(index) {
var stepContents = ["basicInfo","education","work","social"];
var key;//数组中元素的索引值
for (key in stepContents) {
var stepContent = stepContents[key];//获得元素的值
if (key == index) {
if(stepContent=='basicInfo'){
$('#previous_step').hide();
}else{
$('#previous_step').show();
}
if(stepContent=='social'){
$('#next_step').hide();
}else{
$('#next_step').show();
}
$('#'+stepContent).removeClass('main-hide');
$('#point'+key).addClass('c-select');
$('#line'+key).removeClass('b-select');
}else {
$('#'+stepContent).addClass('main-hide');
if(key>index){
$('#point'+key).removeClass('c-select');
$('#line'+key).removeClass('b-select');
}else if(key<index){
$('#point'+key).addClass('c-select');
$('#line'+key).addClass('b-select');
}
}
}
}
function success(message){
layer.alert(message, {
icon: 1,
skin: 'layer-ext-moon',
title:'提示'
})
}
function error(message){
layer.alert(message, {
icon: 2,
skin: 'layer-ext-moon',
title:'提示'
})
}
</script>
{block name="script"}{/block}
</body>
</html>