step3.html 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318
  1. <!doctype html>
  2. <html>
  3. <head>
  4. <include file="public/head"/>
  5. </head>
  6. <body>
  7. <div class="wrap">
  8. <include file="public/header"/>
  9. <section class="section">
  10. <div class="step">
  11. <ul class="unstyled">
  12. <li class="on"><em>1</em>检测环境</li>
  13. <li class="current"><em>2</em>创建数据</li>
  14. <li><em>3</em>完成安装</li>
  15. </ul>
  16. </div>
  17. <form id="js-install-form" action="{:url('index/step4')}" method="post">
  18. <input type="hidden" name="force" value="0"/>
  19. <div class="server">
  20. <table width="100%">
  21. <tr>
  22. <td class="td1" width="100">数据库信息</td>
  23. <td class="td1" width="200">&nbsp;</td>
  24. <td class="td1">&nbsp;</td>
  25. </tr>
  26. <tr>
  27. <td class="text-left">数据库服务器:</td>
  28. <td><input type="text" name="dbhost" id="dbhost" value="127.0.0.1" class="input"></td>
  29. <td>
  30. <div id="js-install-tip-dbhost">
  31. <span class="gray">数据库服务器地址,一般为127.0.0.1或localhost</span>
  32. </div>
  33. </td>
  34. </tr>
  35. <tr>
  36. <td class="text-left">数据库端口:</td>
  37. <td><input type="text" name="dbport" id="dbport" value="3306" class="input"></td>
  38. <td>
  39. <div id="js-install-tip-dbport">
  40. <span class="gray">数据库服务器端口,一般为3306</span>
  41. </div>
  42. </td>
  43. </tr>
  44. <tr>
  45. <td class="text-left">数据库用户名:</td>
  46. <td><input type="text" name="dbuser" id="dbuser" value="root" class="input"></td>
  47. <td>
  48. <div id="js-install-tip-dbuser"></div>
  49. </td>
  50. </tr>
  51. <tr>
  52. <td class="text-left">数据库密码:</td>
  53. <td>
  54. <input type="password" name="dbpw" id="dbpw" value="" class="input" autoComplete="off"
  55. onblur="TestDbPwd()">
  56. </td>
  57. <td>
  58. <div id="js-install-tip-dbpw"></div>
  59. </td>
  60. </tr>
  61. <tr>
  62. <td class="text-left">数据库名:</td>
  63. <td><input type="text" name="dbname" id="dbname" value="thinkcmf" class="input"></td>
  64. <td>
  65. <div id="js-install-tip-dbname">
  66. <span class="gray">最好小写字母</span>
  67. </div>
  68. </td>
  69. </tr>
  70. <tr>
  71. <td class="text-left">数据库表前缀:</td>
  72. <td><input type="text" name="dbprefix" id="dbprefix" value="cmf_" class="input"></td>
  73. <td>
  74. <div id="js-install-tip-dbprefix">
  75. <span class="gray">建议使用默认,同一数据库安装多个ThinkCMF时需修改</span>
  76. </div>
  77. </td>
  78. </tr>
  79. <tr>
  80. <td class="text-left">数据库编码:</td>
  81. <td>
  82. <select type="text" name="dbcharset" id="dbcharset" value="" class="input">
  83. <option value="utf8mb4">utf8mb4</option>
  84. <option value="utf8">utf8</option>
  85. </select>
  86. </td>
  87. <td>
  88. <div id="js-install-tip-dbcharset">
  89. <span class="gray">如果您的服务器是虚拟空间不支持uft8mb4,请选择 utf8</span>
  90. </div>
  91. </td>
  92. </tr>
  93. </table>
  94. <table width="100%">
  95. <tr>
  96. <td class="td1" width="100">网站配置</td>
  97. <td class="td1" width="200">&nbsp;</td>
  98. <td class="td1">&nbsp;</td>
  99. </tr>
  100. <tr>
  101. <td class="text-left">网站名称:</td>
  102. <td><input type="text" name="sitename" value="ThinkCMF内容管理框架" class="input"></td>
  103. <td>
  104. <div id="js-install-tip-sitename"></div>
  105. </td>
  106. </tr>
  107. <tr>
  108. <td class="text-left">关键词:</td>
  109. <td>
  110. <input type="text" name="sitekeywords"
  111. value="ThinkCMF,php,内容管理框架,cmf,cms,简约风, simplewind,framework" class="input"
  112. autoComplete="off">
  113. </td>
  114. <td>
  115. <div id="js-install-tip-sitekeywords"></div>
  116. </td>
  117. </tr>
  118. <tr>
  119. <td class="text-left">描述:</td>
  120. <td>
  121. <input type="text" name="siteinfo" class="input" value="ThinkCMF是简约风网络科技发布的一款用于快速开发的内容管理框架">
  122. </td>
  123. <td>
  124. <div id="js-install-tip-siteinfo"></div>
  125. </td>
  126. </tr>
  127. </table>
  128. <table width="100%">
  129. <tr>
  130. <td class="td1" width="100">创始人信息</td>
  131. <td class="td1" width="200">&nbsp;</td>
  132. <td class="td1">&nbsp;</td>
  133. </tr>
  134. <tr>
  135. <td class="text-left">管理员帐号:</td>
  136. <td><input type="text" name="manager" value="admin" class="input"></td>
  137. <td>
  138. <div id="js-install-tip-manager"></div>
  139. </td>
  140. </tr>
  141. <tr>
  142. <td class="text-left">密码:</td>
  143. <td>
  144. <input type="password" name="manager_pwd" id="js-manager-pwd" class="input"
  145. autoComplete="off">
  146. </td>
  147. <td>
  148. <div id="js-install-tip-manager_pwd">
  149. <span class="gray">
  150. 密码长度不低于6位,不高于32位。
  151. </span>
  152. </div>
  153. </td>
  154. </tr>
  155. <tr>
  156. <td class="text-left">重复密码:</td>
  157. <td>
  158. <input type="password" name="manager_ckpwd" class="input" autoComplete="off">
  159. </td>
  160. <td>
  161. <div id="js-install-tip-manager_ckpwd"></div>
  162. </td>
  163. </tr>
  164. <tr>
  165. <td class="text-left">Email:</td>
  166. <td><input type="text" name="manager_email" class="input" value=""></td>
  167. <td>
  168. <div id="js-install-tip-manager_email"></div>
  169. </td>
  170. </tr>
  171. </table>
  172. <div id="js-response-tips" style="display: none;"></div>
  173. </div>
  174. <div class="bottom text-center">
  175. <a href="{:url('index/step2')}" class="btn btn-primary">上一步</a>
  176. <button type="submit" class="btn btn-primary">创建数据</button>
  177. </div>
  178. </form>
  179. </section>
  180. <script src="__STATIC__/js/jquery.js"></script>
  181. <script src="__STATIC__/js/validate.js"></script>
  182. <script src="__STATIC__/js/ajaxForm.js"></script>
  183. <script>
  184. function TestDbPwd() {
  185. var dbHost = $('#dbhost').val();
  186. var dbUser = $('#dbuser').val();
  187. var dbPwd = $('#dbpw').val();
  188. var dbName = $('#dbname').val();
  189. var dbPort = $('#dbport').val();
  190. data = {
  191. 'hostname': dbHost,
  192. 'username': dbUser,
  193. 'password': dbPwd,
  194. 'hostport': dbPort
  195. };
  196. var url = "{:url('index/testDbPwd')}";
  197. $.ajax({
  198. type: "POST",
  199. url: url,
  200. dataType: 'JSON',
  201. data: data,
  202. beforeSend: function () {
  203. },
  204. success: function (data) {
  205. if (data.code) {
  206. } else {
  207. $('#dbpw').val("");
  208. //数据库链接配置失败
  209. $('#js-install-tip-dbpw').html('<span for="dbname" generated="true" class="tips-error" style="">' + data.msg + '</span>');
  210. }
  211. },
  212. complete: function () {
  213. },
  214. error: function () {
  215. $('#js-install-tip-dbpw').html('<span for="dbname" generated="true" class="tips-error" style="">数据库链接配置失败</span>');
  216. $('#dbpw').val("");
  217. }
  218. });
  219. }
  220. $(function () {
  221. //聚焦时默认提示
  222. var focus_tips = {
  223. dbhost: '数据库服务器地址,一般为127.0.0.1或localhost',
  224. dbport: '数据库服务器端口,一般为3306',
  225. dbuser: '',
  226. dbpw: '',
  227. dbname: '',
  228. dbprefix: '建议使用默认,同一数据库安装多个ThinkCMF时需修改',
  229. dbcharset: '如果您的服务器是虚拟空间不支持uft8mb4,请选择 utf8',
  230. manager: '创始人帐号,拥有站点后台所有管理权限',
  231. manager_pwd: '密码长度不低于6位,不高于32位',
  232. manager_ckpwd: '',
  233. sitename: '',
  234. siteurl: '请以“/”结尾',
  235. sitekeywords: '',
  236. siteinfo: '',
  237. manager_email: ''
  238. };
  239. var install_form = $("#js-install-form");
  240. //validate插件修改了remote ajax验证返回的response处理方式;增加密码强度提示 passwordRank
  241. install_form.validate({
  242. //debug : true,
  243. //onsubmit : false,
  244. errorPlacement: function (error, element) {
  245. //错误提示容器
  246. $('#js-install-tip-' + element[0].name).html(error);
  247. },
  248. errorElement: 'span',
  249. //invalidHandler : , 未验证通过 回调
  250. //ignore : '.ignore' 忽略验证
  251. //onkeyup : true,
  252. errorClass: 'tips-error',
  253. validClass: 'tips-error',
  254. onkeyup: false,
  255. focusInvalid: false,
  256. rules: {
  257. dbhost: {required: true},
  258. dbport: {required: true},
  259. dbuser: {required: true},
  260. /* dbpw: {required : true}, */
  261. dbname: {required: true},
  262. dbprefix: {required: true},
  263. manager: {required: true},
  264. manager_pwd: {required: true, minlength: 6, maxlength: 32},
  265. manager_ckpwd: {required: true, equalTo: '#js-manager-pwd'},
  266. manager_email: {required: true, email: true}
  267. },
  268. highlight: false,
  269. unhighlight: function (element, errorClass, validClass) {
  270. var tip_elem = $('#js-install-tip-' + element.name);
  271. tip_elem.html('<span class="' + validClass + '" data-text="text"><span>');
  272. },
  273. onfocusin: function (element) {
  274. var name = element.name;
  275. $('#js-install-tip-' + name).html('<span data-text="text">' + focus_tips[name] + '</span>');
  276. $(element).parents('tr').addClass('current');
  277. },
  278. onfocusout: function (element) {
  279. var _this = this;
  280. $(element).parents('tr').removeClass('current');
  281. if (element.name === 'email') {
  282. //邮箱匹配点击后,延时处理
  283. setTimeout(function () {
  284. _this.element(element);
  285. }, 150);
  286. } else {
  287. _this.element(element);
  288. }
  289. },
  290. messages: {
  291. dbhost: {required: '数据库服务器地址不能为空'},
  292. dbport: {required: '数据库服务器端口不能为空'},
  293. dbuser: {required: '数据库用户名不能为空'},
  294. dbpw: {required: '数据库密码不能为空'},
  295. dbname: {required: '数据库名不能为空'},
  296. dbprefix: {required: '数据库表前缀不能为空'},
  297. manager: {required: '管理员帐号不能为空'},
  298. manager_pwd: {required: '密码不能为空', minlength: '密码长度不低于{0}位', maxlength: '密码长度不超过{0}位'},
  299. manager_ckpwd: {required: '重复密码不能为空', equalTo: '两次输入的密码不一致,请重新输入.'},
  300. manager_email: {required: 'Email不能为空', email: '请输入正确的电子邮箱地址'}
  301. },
  302. submitHandler: function (form) {
  303. form.submit();
  304. return true;
  305. }
  306. });
  307. });
  308. </script>
  309. </div>
  310. <include file="public/footer"/>
  311. </body>
  312. </html>