main.html 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  6. <meta http-equiv="x-ua-compatible" content="ie=edge">
  7. <title>定额库编辑器</title>
  8. <link rel="stylesheet" href="/web/css/bootstrap/bootstrap.min.css">
  9. <!-- <link rel="stylesheet" href="css/bootstrap/themes.css">-->
  10. <link rel="stylesheet" href="/web/css/main.css">
  11. <link rel="stylesheet" href="/web/css/font-awesome/font-awesome.min.css">
  12. <!--zTree-->
  13. <link rel="stylesheet" href="/web/css/ztree/zTreeStyle.css" type="text/css">
  14. </head>
  15. <body>
  16. <div class="header">
  17. <nav class="navbar navbar-toggleable-lg navbar-light bg-faded p-0 ">
  18. <span class="header-logo px-2">Smartcost</span>
  19. <div class="navbar-text"></div>
  20. </nav>
  21. <nav class="navbar navbar-toggleable-lg justify-content-between navbar-light p-0">
  22. <ul class="nav navbar-nav px-1">
  23. <li class="nav-item">
  24. <a class="nav-link" href="javacript:void(0);" aria-haspopup="true" aria-expanded="false" data-toggle="modal" data-target="#add">新建定额库</a>
  25. </li>
  26. </ul>
  27. </nav>
  28. </div>
  29. <div class="main">
  30. <div class="content">
  31. <div class="container-fluid">
  32. <div class="row">
  33. <div class="col-md-8">
  34. <div class="warp-p2 mt-3">
  35. <table class="table table-hover table-bordered">
  36. <thead><tr><th>定额库名称</th><th width="160">添加时间</th><th width="90">操作</th></tr></thead>
  37. <tbody>
  38. <!--
  39. <tr><td><a href="dinge.html">XX定额库</a></td><td>2017-01-01 </td><td><a href="javacript:void(0);" data-toggle="modal" data-target="#edit" title="编辑"><i class="fa fa-pencil-square-o"></i></a> <a href="javacript:void(0);" data-toggle="modal" data-target="#del" class="text-danger" title="删除"><i class="fa fa-remove"></i></a></td></tr>
  40. <tr><td><a href="dinge.html">XX定额库</a></td><td>2017-01-01 </td><td><a href="javacript:void(0);" data-toggle="modal" data-target="#edit" title="编辑"><i class="fa fa-pencil-square-o"></i></a> <a href="javacript:void(0);" data-toggle="modal" data-target="#del" class="text-danger" title="删除"><i class="fa fa-remove"></i></a></td></tr>
  41. <tr><td><a href="dinge.html">XX定额库</a></td><td>2017-01-01 </td><td><a href="javacript:void(0);" data-toggle="modal" data-target="#edit" title="编辑"><i class="fa fa-pencil-square-o"></i></a> <a href="javacript:void(0);" data-toggle="modal" data-target="#del" class="text-danger" title="删除"><i class="fa fa-remove"></i></a></td></tr>
  42. -->
  43. </tbody>
  44. </table>
  45. </div>
  46. </div>
  47. </div>
  48. </div>
  49. </div>
  50. </div>
  51. <!--弹出添加-->
  52. <div class="modal fade" id="add" data-backdrop="static" style="display: none;" aria-hidden="true">
  53. <div class="modal-dialog" role="document">
  54. <div class="modal-content">
  55. <div class="modal-header">
  56. <h5 class="modal-title">添加定额库</h5>
  57. <button type="button" class="close" data-dismiss="modal" aria-label="Close">
  58. <span aria-hidden="true">×</span>
  59. </button>
  60. </div>
  61. <div class="modal-body">
  62. <form>
  63. <div class="form-group">
  64. <label>定额库名称</label>
  65. <input class="form-control" id="addInput" placeholder="输入定额库名称" type="text">
  66. </div>
  67. </form>
  68. </div>
  69. <div class="modal-footer">
  70. <button type="button" id="rationAdd" class="btn btn-secondary" data-dismiss="modal">新建</button>
  71. <a href="" id="addCancel" class="btn btn-primary">取消</a>
  72. </div>
  73. </div>
  74. </div>
  75. </div>
  76. <!--弹出编辑-->
  77. <div class="modal fade" id="edit" data-backdrop="static" style="display: none;" aria-hidden="true">
  78. <div class="modal-dialog" role="document">
  79. <div class="modal-content">
  80. <div class="modal-header">
  81. <h5 class="modal-title">编辑定额库</h5>
  82. <button type="button" class="close" data-dismiss="modal" aria-label="Close">
  83. <span aria-hidden="true">×</span>
  84. </button>
  85. </div>
  86. <div class="modal-body">
  87. <form>
  88. <div class="form-group">
  89. <label>定额库名称</label>
  90. <input class="form-control" id = "inputRation" placeholder="输入编码" type="text" value="">
  91. </div>
  92. </form>
  93. </div>
  94. <div class="modal-footer">
  95. <button type="button" id="edtCancel" class="btn btn-secondary" data-dismiss="modal">取消</button>
  96. <button type="button" id="edtOK" class="btn btn-secondary" data-dismiss="modal">确定</button>
  97. </div>
  98. </div>
  99. </div>
  100. </div>
  101. <!--弹出删除-->
  102. <div class="modal fade" id="del" data-backdrop="static" style="display: none;" aria-hidden="true">
  103. <input type="hidden" id="did" value="">
  104. <div class="modal-dialog" role="document">
  105. <div class="modal-content">
  106. <div class="modal-header">
  107. <h5 class="modal-title">删除确认</h5>
  108. <button type="button" class="close" data-dismiss="modal" aria-label="Close">
  109. <span aria-hidden="true">×</span>
  110. </button>
  111. </div>
  112. <div class="modal-body">
  113. <h5 class="text-danger">删除后无法恢复,确认是否删除?</h5>
  114. </div>
  115. <div class="modal-footer">
  116. <button type="button" class="btn btn-secondary" data-dismiss="modal">取消</button>
  117. <a href="" id="deleteLib" class="btn btn-danger">删除</a>
  118. </div>
  119. </div>
  120. </div>
  121. </div>
  122. <!-- JS. -->
  123. <script src="/lib/jquery/jquery.min.js"></script>
  124. <script src="/lib/tether/tether.min.js"></script>
  125. <script src="/lib/bootstrap/bootstrap.min.js"></script>
  126. <script src="/lib/global.js"></script>
  127. <!-- zTree -->
  128. <script type="text/javascript" src="/lib/ztree/jquery.ztree.core.js"></script>
  129. <script type="text/javascript" src="/lib/ztree/jquery.ztree.excheck.js"></script>
  130. </body>
  131. <script type="text/javascript">
  132. //onLoad 获取所有定额库
  133. $(function(){
  134. getRationLibs();
  135. })
  136. //为定额库添加跳转功能
  137. function addressdirect(){
  138. $("tr:gt(0)").each(function() {
  139. var td, a;
  140. td = $("td:eq(0)", $(this));
  141. a = $('a', td);
  142. a.attr('href', "/ration/rationLib" + "?rationname=" + a.text());
  143. })
  144. }
  145. //为定额库添加点击删除后对应定额库名称
  146. function deleteLib(){
  147. $("tr:gt(0)").each(function() {
  148. var td0, a1,td2,a2;
  149. td2 = $("td:eq(2)", $(this));
  150. td0 = $("td:eq(0)", $(this));
  151. a1 = $('a', td0);
  152. var str = a1.text();
  153. a2 = $("a:eq(1)",td2);
  154. a2.click(function(){
  155. $("#did").val(str)
  156. })
  157. // a.attr('href', "/ration/rationLib" + "?rationname=" + a.text());
  158. })
  159. }
  160. //为定额库添加点击编辑后对应定额库名称
  161. function editLib(){
  162. $("tr:gt(0)").each(function() {
  163. var td0, a1,td2,a2;
  164. td2 = $("td:eq(2)", $(this));
  165. td0 = $("td:eq(0)", $(this));
  166. a1 = $('a', td0);
  167. var str = a1.text();
  168. a2 = $("a:eq(0)",td2);
  169. a2.click(function(){
  170. $("#did").val(str)
  171. })
  172. // a.attr('href', "/ration/rationLib" + "?rationname=" + a.text());
  173. })
  174. }
  175. //删除按钮点击事件
  176. $("#deleteLib").click(function(){
  177. var rationName = $("#did").val();
  178. $.ajax({
  179. type:"POST",
  180. url:"http://localhost:6060/ration/deleteRationLibs",
  181. dataType:"json",
  182. data:{"rationName": rationName},
  183. cache:false,
  184. timeout:50000,
  185. success:function(result){
  186. getRationLibs();//刷新界面重新获取定额库
  187. },
  188. error:function(iqXHR,textStatus,errorThrown){
  189. }
  190. })
  191. });
  192. //获取定额库
  193. function getRationLibs(){
  194. $.ajax({
  195. type:"POST",
  196. url:"http://localhost:6060/ration/getRationLibs",
  197. dataType:"json",
  198. cache:false,
  199. timeout:50000,
  200. success:function(result){
  201. $("tbody tr").html("");
  202. for(var i=0;i<result.data.length;i++){
  203. addLibTag(result.data[i].DisplayName);
  204. }
  205. addressdirect();//为所有定额库添加跳转功能
  206. deleteLib();//为所有定额库添加删除功能
  207. editLib();
  208. },
  209. error:function(iqXHR,textStatus,errorThrown){
  210. alert("error "+textStatus+" "+errorThrown);
  211. }
  212. })
  213. }
  214. //显示定额库条目
  215. function addLibTag(string){
  216. var $tr = $('<tr><td><a href="#"></a></td><td></td><td><a href="javacript:void(0);" data-toggle="modal" data-target="#edit" title="编辑"><i class="fa fa-pencil-square-o"></i></a> <a href="javacript:void(0);" data-toggle="modal" data-target="#del" class="text-danger" title="删除"><i class="fa fa-remove"></i></a></td></tr>')
  217. var $td0 = $("td:eq(0)",$tr);
  218. var $td1 = $("td:eq(1)",$tr);
  219. var a = $("a",$td0);
  220. var str = string;
  221. a.text(str);
  222. var date = new Date().format("yyyy-MM-dd");
  223. $td1.text(date);
  224. $tr.appendTo("tbody");
  225. }
  226. //增加定额库ajax函数
  227. function addRation(str) {
  228. $.ajax({
  229. type:"POST",
  230. url:"http://localhost:6060/ration/addRationName",
  231. data:{"rationDisPlayName": str},
  232. dataType:"json",
  233. cache:false,
  234. timeout:50000,
  235. success:function(result){
  236. },
  237. error:function(iqXHR,textStatus,errorThrown){
  238. alert("error "+textStatus+" "+errorThrown);
  239. }
  240. })
  241. }
  242. //增加定额库按钮点击事件
  243. $("#rationAdd").click(function(){
  244. var $tr = $('<tr><td><a href="#"></a></td><td></td><td><a href="javacript:void(0);" data-toggle="modal" data-target="#edit" title="编辑"><i class="fa fa-pencil-square-o"></i></a> <a href="javacript:void(0);" data-toggle="modal" data-target="#del" class="text-danger" title="删除"><i class="fa fa-remove"></i></a></td></tr>')
  245. var $td0 = $("td:eq(0)",$tr);
  246. var $td1 = $("td:eq(1)",$tr);
  247. var a = $("a",$td0);
  248. var str = $("#addInput").val();
  249. a.text(str);
  250. var date = new Date().format("yyyy-MM-dd");
  251. $td1.text(date);
  252. $tr.appendTo("tbody");
  253. addRation(str);
  254. addressdirect();
  255. deleteLib();
  256. });
  257. //编辑按钮点击事件
  258. $("#edtOK").click(function(){
  259. var str = $("#did").val();
  260. var newStr = $("#inputRation").val();
  261. $.ajax({
  262. type:"POST",
  263. url:"http://localhost:6060/ration/editRationLibs",
  264. dataType:"json",
  265. data:{"rationName": str,"newName":newStr},
  266. cache:false,
  267. timeout:50000,
  268. success:function(result){
  269. getRationLibs();//刷新界面重新获取定额库
  270. },
  271. error:function(iqXHR,textStatus,errorThrown){
  272. }
  273. })
  274. });
  275. Date.prototype.format = function(fmt) {
  276. var o = {
  277. "M+" : this.getMonth()+1, //月份
  278. "d+" : this.getDate(), //日
  279. "h+" : this.getHours(), //小时
  280. "m+" : this.getMinutes(), //分
  281. "s+" : this.getSeconds(), //秒
  282. "q+" : Math.floor((this.getMonth()+3)/3), //季度
  283. "S" : this.getMilliseconds() //毫秒
  284. };
  285. if(/(y+)/.test(fmt)) {
  286. fmt=fmt.replace(RegExp.$1, (this.getFullYear()+"").substr(4 - RegExp.$1.length));
  287. }
  288. for(var k in o) {
  289. if(new RegExp("("+ k +")").test(fmt)){
  290. fmt = fmt.replace(RegExp.$1, (RegExp.$1.length==1) ? (o[k]) : (("00"+ o[k]).substr((""+ o[k]).length)));
  291. }
  292. }
  293. return fmt;
  294. }
  295. autoFlashHeight();
  296. </script>
  297. </html>