123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147 |
- <!DOCTYPE html>
- <html>
- <head>
- <meta name="renderer" content="webkit" />
- <meta http-equiv="X-UA-COMPATIBLE" content="IE=edge,chrome=1" />
- <title>安装程序 - NiuCloud-Admin</title>
- <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>
|