base.html 4.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148
  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>安装程序 - 单商户V5版</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/style1/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;">单商户V5版</div>
  29. <ul class="top-link">
  30. <li><a href="https://www.niushop.com" target="_blank">官方网站</a></li>
  31. <li><a href="https://bbs.niushop.com" 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'}{/block}
  70. </div>
  71. <script>
  72. var index=0;
  73. $(document).ready(function(){
  74. $("#education").addClass('main-hide');
  75. $("#work").addClass('main-hide');
  76. $("#social").addClass('main-hide');
  77. $('#previous_step').hide();
  78. /*上一步*/
  79. $('#previous_step').bind('click', function () {
  80. index--;
  81. ControlContent(index);
  82. });
  83. /*下一步*/
  84. $('#next_step').bind('click', function () {
  85. index++;
  86. ControlContent(index);
  87. });
  88. });
  89. function ControlContent(index) {
  90. var stepContents = ["basicInfo","education","work","social"];
  91. var key;//数组中元素的索引值
  92. for (key in stepContents) {
  93. var stepContent = stepContents[key];//获得元素的值
  94. if (key == index) {
  95. if(stepContent=='basicInfo'){
  96. $('#previous_step').hide();
  97. }else{
  98. $('#previous_step').show();
  99. }
  100. if(stepContent=='social'){
  101. $('#next_step').hide();
  102. }else{
  103. $('#next_step').show();
  104. }
  105. $('#'+stepContent).removeClass('main-hide');
  106. $('#point'+key).addClass('c-select');
  107. $('#line'+key).removeClass('b-select');
  108. }else {
  109. $('#'+stepContent).addClass('main-hide');
  110. if(key>index){
  111. $('#point'+key).removeClass('c-select');
  112. $('#line'+key).removeClass('b-select');
  113. }else if(key<index){
  114. $('#point'+key).addClass('c-select');
  115. $('#line'+key).addClass('b-select');
  116. }
  117. }
  118. }
  119. }
  120. function success(message){
  121. layer.alert(message, {
  122. icon: 1,
  123. skin: 'layer-ext-moon',
  124. title:'提示'
  125. })
  126. }
  127. function error(message){
  128. layer.alert(message, {
  129. icon: 2,
  130. skin: 'layer-ext-moon',
  131. title:'提示'
  132. })
  133. }
  134. </script>
  135. {block name="script"}{/block}
  136. </body>
  137. </html>