base.html 4.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta name="renderer" content="webkit" />
  5. <meta http-equiv="X-UA-COMPATIBLE" content="IE=edge,chrome=1" />
  6. <title>安装程序 - niushop多商户</title>
  7. <!--<script src="INSTALL_JS/jquery-2.2.js"></script>-->
  8. <link rel="icon" type="image/x-icon" href="__STATIC__/img/shop_bitbug_favicon.ico" />
  9. <link rel="stylesheet" type="text/css" href="INSTALL_CSS/style.css" />
  10. <link rel="stylesheet" type="text/css" href="__STATIC__/ext/layui/css/layui.css" />
  11. <link rel="stylesheet" type="text/css" href="SHOP_CSS/common.css" />
  12. <script src="__STATIC__/js/jquery-3.1.1.js"></script>
  13. <script src="__STATIC__/ext/layui/layui.js"></script>
  14. <script>
  15. layui.use(['layer', 'upload', 'element'], function() {});
  16. window.ns_url = {
  17. baseUrl: "ROOT_URL/",
  18. route: ['install', '{:request()->controller()}', '{:request()->action()}'],
  19. };
  20. </script>
  21. <script src="INSTALL_JS/common.js"></script>
  22. {block name="resources"}{/block}
  23. </head>
  24. <body>
  25. <div class="head-block">
  26. <div class="top">
  27. <div class="top-logo"></div>
  28. <div class="top-sub" style="flex:1;">开源商城多商户V4</div>
  29. <ul class="top-link">
  30. <li><a href="http://www.niushop.com.cn" target="_blank">官方网站</a></li>
  31. <li><a href="http://bbs.niushop.com.cn" target="_blank">技术论坛</a></li>
  32. </ul>
  33. </div>
  34. </div>
  35. <div class="step-content">
  36. <div style="width:1000px;margin:0 auto;">
  37. <!-- 标题进度条 start-->
  38. <div class="content" style="margin:30px 0 0 0;width: 100%;">
  39. <div class="processBar">
  40. <div class="text" style="margin: 10px -25px;"><span class='poetry'>1.许可协议</span></div>
  41. <div id="line0" class="bar">
  42. <div id="point0" class="c-step c-select"></div>
  43. </div>
  44. </div>
  45. <div class="processBar">
  46. <div class="text" style="margin: 10px -30px;"><span class='poetry'>2.环境检测</span></div>
  47. <div id="line1" class="bar">
  48. <div id="point1" class="c-step"></div>
  49. </div>
  50. </div>
  51. <div class="processBar">
  52. <div class="text" style="margin: 10px -30px;"><span class='poetry'>3.参数配置</span></div>
  53. <div id="line2" class="bar">
  54. <div id="point2" class="c-step"></div>
  55. </div>
  56. </div>
  57. <div class="processBar" style="width:10px;">
  58. <div class="text" style="margin: 10px -39px;"><span class='poetry'>4.安装完成</span></div>
  59. <div id="line3" class="bar" style="width: 0;">
  60. <div id="point3" class="c-step"></div>
  61. </div>
  62. </div>
  63. </div>
  64. <!-- 标题进度条 end-->
  65. <div style="clear: both;"></div>
  66. </div>
  67. </div>
  68. <div class="install-content">
  69. {block name='main'}
  70. {/block}
  71. </div>
  72. <script>
  73. var index=0;
  74. $(document).ready(function(){
  75. $("#education").addClass('main-hide');
  76. $("#work").addClass('main-hide');
  77. $("#social").addClass('main-hide');
  78. $('#previous_step').hide();
  79. /*上一步*/
  80. $('#previous_step').bind('click', function () {
  81. index--;
  82. ControlContent(index);
  83. });
  84. /*下一步*/
  85. $('#next_step').bind('click', function () {
  86. index++;
  87. ControlContent(index);
  88. });
  89. });
  90. function ControlContent(index) {
  91. var stepContents = ["basicInfo","education","work","social"];
  92. var key;//数组中元素的索引值
  93. for (key in stepContents) {
  94. var stepContent = stepContents[key];//获得元素的值
  95. if (key == index) {
  96. if(stepContent=='basicInfo'){
  97. $('#previous_step').hide();
  98. }else{
  99. $('#previous_step').show();
  100. }
  101. if(stepContent=='social'){
  102. $('#next_step').hide();
  103. }else{
  104. $('#next_step').show();
  105. }
  106. $('#'+stepContent).removeClass('main-hide');
  107. $('#point'+key).addClass('c-select');
  108. $('#line'+key).removeClass('b-select');
  109. }else {
  110. $('#'+stepContent).addClass('main-hide');
  111. if(key>index){
  112. $('#point'+key).removeClass('c-select');
  113. $('#line'+key).removeClass('b-select');
  114. }else if(key<index){
  115. $('#point'+key).addClass('c-select');
  116. $('#line'+key).addClass('b-select');
  117. }
  118. }
  119. }
  120. }
  121. function success(message){
  122. layer.alert(message, {
  123. icon: 1,
  124. skin: 'layer-ext-moon',
  125. title:'提示'
  126. })
  127. }
  128. function error(message){
  129. layer.alert(message, {
  130. icon: 2,
  131. skin: 'layer-ext-moon',
  132. title:'提示'
  133. })
  134. }
  135. </script>
  136. {block name="script"}
  137. {/block}
  138. </body>
  139. </html>