add.html 22 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513
  1. <!DOCTYPE html>
  2. <html lang="zh" xmlns:th="http://www.thymeleaf.org" >
  3. <head>
  4. <th:block th:include="include :: header('新增档案管理')" />
  5. <th:block th:include="include :: datetimepicker-css" />
  6. </head>
  7. <body class="white-bg">
  8. <div class="wrapper wrapper-content animated fadeInRight ibox-content">
  9. <form class="form-horizontal m" id="form-dangan-add">
  10. <div class="row">
  11. <div class="col-sm-6">
  12. <div class="form-group">
  13. <label class="col-sm-3 control-label is-required">系统名称:</label>
  14. <div class="col-sm-8">
  15. <input id="danganName" name="danganName" class="form-control" type="text" required>
  16. </div>
  17. </div>
  18. </div>
  19. <div class="col-sm-6">
  20. <div class="form-group">
  21. <label class="col-sm-3 control-label is-required">系统状态:</label>
  22. <div class="col-sm-8">
  23. <select name="status" class="form-control m-b" th:with="type=${@dict.getType('sys_dangan_status')}" >
  24. <option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}"></option>
  25. </select>
  26. </div>
  27. </div>
  28. </div>
  29. </div>
  30. <div class="row">
  31. <div class="col-sm-6">
  32. <div class="form-group">
  33. <label class="col-sm-3 control-label is-required">系统编号:</label>
  34. <div class="col-sm-8">
  35. <input id="danganNo" name="danganNo" class="form-control" type="text" required>
  36. </div>
  37. </div>
  38. </div>
  39. <div class="col-sm-6">
  40. <div class="form-group">
  41. <label class="col-sm-3 control-label is-required">系统私钥:</label>
  42. <div class="col-sm-8">
  43. <input id="keyId" name="keyId" class="form-control" type="text" required>
  44. </div>
  45. </div>
  46. </div>
  47. </div>
  48. <div class="row">
  49. <div class="col-sm-6">
  50. <div class="form-group">
  51. <label class="col-sm-3 control-label">系统负责人:</label>
  52. <div class="col-sm-8">
  53. <input name="sysPerson" class="form-control" type="text">
  54. </div>
  55. </div>
  56. </div>
  57. <div class="col-sm-6">
  58. <div class="form-group">
  59. <label class="col-sm-3 control-label">架构模式:</label>
  60. <div class="col-sm-8">
  61. <select name="mode" class="form-control m-b" th:with="type=${@dict.getType('sys_dangan_mode')}" >
  62. <option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}"></option>
  63. </select>
  64. </div>
  65. </div>
  66. </div>
  67. </div>
  68. <div class="row">
  69. <div class="col-sm-6">
  70. <div class="form-group">
  71. <label class="col-sm-3 control-label">类别:</label>
  72. <div class="col-sm-8">
  73. <input name="fileType" class="form-control" type="text">
  74. </div>
  75. </div>
  76. </div>
  77. <div class="col-sm-6">
  78. <div class="form-group">
  79. <label class="col-sm-3 control-label">型号/版本:</label>
  80. <div class="col-sm-8">
  81. <input name="model" class="form-control" type="text">
  82. </div>
  83. </div>
  84. </div>
  85. </div>
  86. <div class="row">
  87. <div class="col-sm-6">
  88. <div class="form-group">
  89. <label class="col-sm-3 control-label">所属项目ID:</label>
  90. <div class="col-sm-8">
  91. <input name="projectId" class="form-control" type="text">
  92. </div>
  93. </div>
  94. </div>
  95. <div class="col-sm-6">
  96. <div class="form-group">
  97. <label class="col-sm-3 control-label">品牌:</label>
  98. <div class="col-sm-8">
  99. <input name="brand" class="form-control" type="text">
  100. </div>
  101. </div>
  102. </div>
  103. </div>
  104. <div class="row">
  105. <div class="col-sm-6">
  106. <div class="form-group">
  107. <label class="col-sm-3 control-label">运行设备ID:</label>
  108. <div class="col-sm-8">
  109. <input name="runDeviceId" class="form-control" type="text">
  110. </div>
  111. </div>
  112. </div>
  113. <div class="col-sm-6">
  114. <div class="form-group">
  115. <label class="col-sm-3 control-label">关联设备ID:</label>
  116. <div class="col-sm-8">
  117. <input name="relateDeviceId" class="form-control" type="text">
  118. </div>
  119. </div>
  120. </div>
  121. </div>
  122. <div class="row">
  123. <div class="col-sm-6">
  124. <div class="form-group">
  125. <label class="col-sm-3 control-label">维护项目ID:</label>
  126. <div class="col-sm-8">
  127. <input name="maintainItemId" class="form-control" type="text">
  128. </div>
  129. </div>
  130. </div>
  131. <div class="col-sm-6">
  132. <div class="form-group">
  133. <label class="col-sm-3 control-label">厂家质保期:</label>
  134. <div class="col-sm-8">
  135. <input name="factoryTime" class="form-control" type="text">
  136. </div>
  137. </div>
  138. </div>
  139. </div>
  140. <div class="row">
  141. <div class="col-sm-6">
  142. <div class="form-group">
  143. <label class="col-sm-3 control-label">项目质保期:</label>
  144. <div class="col-sm-8">
  145. <input name="projectTime" class="form-control" type="text">
  146. </div>
  147. </div>
  148. </div>
  149. <div class="col-sm-6">
  150. <div class="form-group">
  151. <label class="col-sm-3 control-label">使用单位:</label>
  152. <div class="col-sm-8">
  153. <input name="useUnit" class="form-control" type="text">
  154. </div>
  155. </div>
  156. </div>
  157. </div>
  158. <div class="row">
  159. <div class="col-sm-6">
  160. <div class="form-group">
  161. <label class="col-sm-3 control-label">介质:</label>
  162. <div class="col-sm-8">
  163. <input name="medium" class="form-control" type="text">
  164. </div>
  165. </div>
  166. </div>
  167. <div class="col-sm-6">
  168. <div class="form-group">
  169. <label class="col-sm-3 control-label">维护时间:</label>
  170. <div class="col-sm-8">
  171. <div class="input-group">
  172. <input name="maintainTime" id="maintainTime" class="form-control" placeholder="yyyy-MM-dd HH:mm:ss" type="text">
  173. <span class="input-group-addon"><i class="fa fa-calendar"></i></span>
  174. </div>
  175. </div>
  176. </div>
  177. </div>
  178. </div>
  179. <div class="row">
  180. <div class="col-sm-6">
  181. <div class="form-group">
  182. <label class="col-sm-3 control-label">认证页面地址:</label>
  183. <div class="col-sm-8">
  184. <input name="pageAddress" class="form-control">
  185. </div>
  186. </div>
  187. </div>
  188. <div class="col-sm-6">
  189. <div class="form-group">
  190. <label class="col-sm-3 control-label">系统状态检测地址:</label>
  191. <div class="col-sm-8">
  192. <input name="testAddress" class="form-control" type="text">
  193. </div>
  194. </div>
  195. </div>
  196. </div>
  197. <div class="row">
  198. <div class="col-sm-6">
  199. <div class="form-group">
  200. <label class="col-sm-3 control-label">系统建设厂商:</label>
  201. <div class="col-sm-8">
  202. <input name="buildFactory" class="form-control" type="text">
  203. </div>
  204. </div>
  205. </div>
  206. <div class="col-sm-6">
  207. <div class="form-group">
  208. <label class="col-sm-3 control-label">建设时间:</label>
  209. <div class="col-sm-8">
  210. <div class="input-group date">
  211. <input name="buildFactoryTime" class="form-control" placeholder="yyyy-MM-dd" type="text">
  212. <span class="input-group-addon"><i class="fa fa-calendar"></i></span>
  213. </div>
  214. </div>
  215. </div>
  216. </div>
  217. </div>
  218. <div class="row">
  219. <div class="col-sm-6">
  220. <div class="form-group">
  221. <label class="col-sm-3 control-label">厂商负责人:</label>
  222. <div class="col-sm-8">
  223. <input name="factoryPerson" class="form-control" type="text">
  224. </div>
  225. </div>
  226. </div>
  227. <div class="col-sm-6">
  228. <div class="form-group">
  229. <label class="col-sm-3 control-label">厂商负责人电话:</label>
  230. <div class="col-sm-8">
  231. <input name="factoryPersonPhone" class="form-control" type="text">
  232. </div>
  233. </div>
  234. </div>
  235. </div>
  236. <div class="row">
  237. <div class="col-sm-6">
  238. <div class="form-group">
  239. <label class="col-sm-3 control-label">开发语言:</label>
  240. <div class="col-sm-8">
  241. <input name="language" class="form-control" type="text">
  242. </div>
  243. </div>
  244. </div>
  245. <div class="col-sm-6">
  246. <div class="form-group">
  247. <label class="col-sm-3 control-label">部署服务器IP:</label>
  248. <div class="col-sm-8">
  249. <input name="serverIp" class="form-control" type="text">
  250. </div>
  251. </div>
  252. </div>
  253. </div>
  254. <div class="row">
  255. <div class="col-sm-6">
  256. <div class="form-group">
  257. <label class="col-sm-3 control-label">服务器位置:</label>
  258. <div class="col-sm-8">
  259. <input name="serverLocation" class="form-control" type="text">
  260. </div>
  261. </div>
  262. </div>
  263. <div class="col-sm-6">
  264. <div class="form-group">
  265. <label class="col-sm-3 control-label">服务器配置信息:</label>
  266. <div class="col-sm-8">
  267. <input name="serverInfo" class="form-control" type="text">
  268. </div>
  269. </div>
  270. </div>
  271. </div>
  272. <div class="row">
  273. <div class="col-sm-6">
  274. <div class="form-group">
  275. <label class="col-sm-3 control-label">是否专用服务器:</label>
  276. <div class="col-sm-8">
  277. <select name="serverBasedYesNo" class="form-control m-b" th:with="type=${@dict.getType('sys_dangan_yes_no')}" >
  278. <option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}"></option>
  279. </select>
  280. </div>
  281. </div>
  282. </div>
  283. <div class="col-sm-6">
  284. <div class="form-group">
  285. <label class="col-sm-3 control-label">运维负责人:</label>
  286. <div class="col-sm-8">
  287. <input name="opsPerson" class="form-control" type="text">
  288. </div>
  289. </div>
  290. </div>
  291. </div>
  292. <div class="row">
  293. <div class="col-sm-6">
  294. <div class="form-group">
  295. <label class="col-sm-3 control-label">主管单位:</label>
  296. <div class="col-sm-8">
  297. <input name="chargeUnit" class="form-control" type="text">
  298. </div>
  299. </div>
  300. </div>
  301. <div class="col-sm-6">
  302. </div>
  303. </div>
  304. <div class="row">
  305. <div class="col-sm-6">
  306. <div class="form-group">
  307. <label class="col-sm-3 control-label">排序:</label>
  308. <div class="col-sm-8">
  309. <input class="form-control" type="number" name="ord" required>
  310. </div>
  311. </div>
  312. </div>
  313. <div class="col-sm-6">
  314. </div>
  315. </div>
  316. <div class="row">
  317. <div class="col-sm-6">
  318. <div class="form-group">
  319. <input type="hidden" id="fileName" name="fileName">
  320. <input type="hidden" id="filePath" name="filePath">
  321. <label class="col-sm-3 control-label ">文档信息:</label>
  322. <div class="col-sm-8">
  323. <input id="file" name="file" class="form-control" type="file" onchange="uploadFile();" multiple >
  324. <div id="fileinfo">
  325. </div>
  326. </div>
  327. </div>
  328. </div>
  329. <div class="col-sm-6">
  330. <div class="form-group">
  331. <input type="hidden" id="iconName" name="iconName">
  332. <input type="hidden" id="iconPath" name="iconPath">
  333. <label class="col-sm-3 control-label ">档案图标信息:</label>
  334. <div class="col-sm-8">
  335. <input id="icon" name="icon" class="form-control" type="file" onchange="uploadIcon();" multiple >
  336. <div id="iconinfo">
  337. </div>
  338. </div>
  339. </div>
  340. </div>
  341. </div>
  342. <div class="row">
  343. <div class="col-sm-12">
  344. <div class="form-group">
  345. <label class="col-sm-1 control-label">备注:</label>
  346. <div class="col-sm-9">
  347. <textarea name="remark" class="form-control" type="text"></textarea>
  348. </div>
  349. </div>
  350. </div>
  351. </div>
  352. </form>
  353. </div>
  354. <th:block th:include="include :: footer" />
  355. <th:block th:include="include :: datetimepicker-js" />
  356. <script th:inline="javascript">
  357. var prefix = ctx + "system/dangan"
  358. $("#form-dangan-add").validate({
  359. onkeyup: false,
  360. rules:{
  361. danganName:{
  362. remote: {
  363. url: prefix + "/checkDanganNameUnique",
  364. type: "post",
  365. dataType: "json",
  366. data: {
  367. "danganName": function() {
  368. return $.common.trim($("#danganName").val());
  369. }
  370. },
  371. dataFilter: function(data, type) {
  372. return $.validate.unique(data);
  373. }
  374. }
  375. }
  376. },
  377. messages: {
  378. "danganName": {
  379. remote: "档案名称已经存在"
  380. },
  381. },
  382. focusCleanup: true
  383. });
  384. layui.use('laydate', function() {
  385. var laydate = layui.laydate;
  386. laydate.render({
  387. elem: '#maintainTime',
  388. type: 'datetime',
  389. trigger: 'click'
  390. });
  391. });
  392. function uploadFile(){
  393. var formData = new FormData();
  394. if ($('#file')[0].files[0] == null || $('#file')[0].files[0]==undefined) {
  395. $.modal.alertWarning("请先选择文件路径");
  396. return false;
  397. }
  398. // var this_1= document.getElementById('file');
  399. // var files = this_1.files;
  400. //
  401. // for (var i = 0, len = files.length; i < len; i++) {
  402. // formData.append('files', files[i]);
  403. // }
  404. // 将文件装入FormData对象
  405. formData.append("file",$('#file')[0].files[0]);
  406. $.ajax({
  407. url: ctx + "common/upload",
  408. type: 'post',
  409. cache: false,
  410. data: formData,
  411. processData: false,
  412. contentType: false,
  413. dataType: "json",
  414. success: function(result) {
  415. console.log(result);
  416. if(result.code == '0'){
  417. $("#fileName").val(result.fileName);
  418. $("#filePath").val(result.url);
  419. var fileArr = new Array();
  420. var fileNames =result.fileName;
  421. if(null!=fileNames && fileNames.length>0){
  422. $("#fileinfo").empty();
  423. fileArr = fileNames.split(",");
  424. for(var i=0;i<fileArr.length;i++){
  425. var html = "";
  426. html = "<input type='text' value='"+fileArr[i]+"' class='form-control' style='border: none;' readonly>";
  427. $("#fileinfo").append(html);
  428. }
  429. }
  430. }
  431. }
  432. });
  433. }
  434. function uploadIcon(){
  435. var formData = new FormData();
  436. if ($('#icon')[0].files[0] == null || $('#icon')[0].files[0]==undefined) {
  437. $.modal.alertWarning("请先选择文件路径");
  438. return false;
  439. }
  440. // var this_1= document.getElementById('file');
  441. // var files = this_1.files;
  442. //
  443. // for (var i = 0, len = files.length; i < len; i++) {
  444. // formData.append('files', files[i]);
  445. // }
  446. // 将文件装入FormData对象
  447. formData.append("file",$('#icon')[0].files[0]);
  448. $.ajax({
  449. url: ctx + "common/upload",
  450. type: 'post',
  451. cache: false,
  452. data: formData,
  453. processData: false,
  454. contentType: false,
  455. dataType: "json",
  456. success: function(result) {
  457. console.log(result);
  458. if(result.code == '0'){
  459. $("#iconName").val(result.fileName);
  460. $("#iconPath").val(result.url);
  461. var fileArr = new Array();
  462. var fileNames =result.fileName;
  463. if(null!=fileNames && fileNames.length>0){
  464. $("#iconinfo").empty();
  465. fileArr = fileNames.split(",");
  466. for(var i=0;i<fileArr.length;i++){
  467. var html = "";
  468. html = "<input type='text' value='"+fileArr[i]+"' class='form-control' style='border: none;' readonly>";
  469. $("#iconinfo").append(html);
  470. }
  471. }
  472. }
  473. }
  474. });
  475. }
  476. function submitHandler() {
  477. if ($.validate.form()) {
  478. $.operate.save(prefix + "/add", $('#form-dangan-add').serialize());
  479. }
  480. }
  481. $("input[name='buildFactoryTime']").datetimepicker({
  482. format: "yyyy-mm-dd",
  483. minView: "month",
  484. autoclose: true
  485. });
  486. </script>
  487. </body>
  488. </html>