mainFunction.js 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388
  1. /**
  2. * 基本操作功能的实现
  3. * by Unow
  4. * finished in 2018.12.13
  5. *
  6. */
  7. (function($){
  8. listApi = 'http://localhost:8080/api/list';
  9. addNodeApi = 'http://localhost:8080/api/add';
  10. updateApi = 'http://localhost:8080/api/edit';
  11. deleteApi = 'http://localhost:8080/api/delete';
  12. logoutApi = 'http://localhost:8080/manager/logout';
  13. var main = {
  14. currentPage:1,
  15. totalPage:1,
  16. rows:5,
  17. data:[]
  18. };
  19. onLoad();
  20. BindEvent();
  21. /**
  22. * [sendRequest description:@封装Ajax请求]
  23. * @param {[type]} url [description]
  24. * @param {[type]} param [description]
  25. * @param {Boolean} async [description]
  26. * @param {String} type [description]
  27. * @param {[type]} success_fn [description]
  28. * @param {[type]} failure_fn [description]
  29. * @param {[type]} contentType [description]
  30. * @return {[type]} [description]
  31. */
  32. function sendRequest(url,param,async=true,type='get',success_fn,failure_fn,contentType){
  33. $.ajax({
  34. url:url,
  35. data:param,
  36. type:type,
  37. contentType:contentType,
  38. async:async,
  39. success:function(data){
  40. success_fn(data);
  41. },
  42. error:function(err_msg){
  43. failure_fn(err_msg);
  44. }
  45. });
  46. }
  47. /**
  48. * [renderNodeByPid description:@发起ajax请求,并将获取到的数据渲染到树上,并且绑定main对象]
  49. * @param {[type]} url [description]
  50. * @param {[type]} pid [description]
  51. * @param {[type]} parentNode [description]
  52. * @param {Boolean} show [description]
  53. * @return {[type]} [description]
  54. */
  55. function renderNodeByPid(url,pid,parentNode,show=true){
  56. if(!parentNode[0].nodes&&parentNode[0].isParent){
  57. sendRequest(url,{pid:pid},true,'get'
  58. ,function(data){
  59. $.each(data,function(index,val){
  60. if(show){
  61. $('#left-tree').treeview('addNode',[val,parentNode]);
  62. $('#editName').val(parentNode[0].text);
  63. main.totalPage=Math.ceil(data.length/main.rows);
  64. main.currentPage = 1;
  65. showMsg(data);
  66. }else{
  67. $('#move-tree').treeview('addNode',[val,parentNode]);
  68. }
  69. });
  70. },function(failue){
  71. $.showMsgText(failure);
  72. });
  73. }
  74. }
  75. /**
  76. * [addNode description:@发起增加节点请求,渲染且实时绑定main]
  77. * @param {[type]} url [description]
  78. * @param {[type]} param [description]
  79. * @param {[type]} parentNode [description]
  80. */
  81. function addNode(url,param,parentNode){
  82. sendRequest(url,param,true,'post',function(data){
  83. $('#left-tree').treeview('addNode', [data, parentNode]);
  84. main.totalPage=Math.ceil(parentNode[0].nodes.length/main.rows);
  85. showMsg(parentNode[0].nodes);
  86. },function(failue){
  87. $.showMsgText("新增失败!");
  88. },"application/json");
  89. }
  90. /**
  91. * [updateNode description:@发起更新节点请求,渲染且实时绑定main]
  92. * @param {[type]} url [description]
  93. * @param {[type]} oldNode [description]
  94. * @return {[type]} [description]
  95. */
  96. function updateNode(url,oldNode){
  97. var param = {_method:"PUT",id:oldNode[0].id,text:$('#editName').val()};
  98. sendRequest(url,param,true,'post',function(data){
  99. oldNode.text=data.text;
  100. oldNode.recentTime=data.recentTime;
  101. data = oldNode;
  102. $('#left-tree').treeview('updateNode', [ oldNode, data]);
  103. showMsg(data[0].nodes);
  104. $('#editName').val(data.text);
  105. $("#headTitle").text(data.text);
  106. },function(failue){
  107. $.showMsgText("修改失败!");
  108. });
  109. }
  110. /**
  111. * [deleteNode description:@发起删除节点请求,渲染且实时绑定main]
  112. * @param {[type]} url [description]
  113. * @param {[type]} node [description]
  114. * @return {[type]} [description]
  115. */
  116. function deleteNode(url,node){
  117. var param = {_method:"DELETE",id:node[0].id}
  118. sendRequest(url,param,true,'post',function(data){
  119. $('#left-tree').treeview('removeNode', [ node, { silent: true } ]);
  120. $('#editName').val("");
  121. $("#headTitle").text("");
  122. showMsg([]);
  123. },function(){
  124. $.showMsgText("删除失败!");
  125. });
  126. }
  127. /**
  128. * [add0 description:@配合转换时间戳的方法]
  129. * @param {[type]} m [description]
  130. * @return {[type]} [description]
  131. */
  132. function add0(m){
  133. return m<10?'0'+m:m
  134. }
  135. /**
  136. * [timestampToTime description:@转换时间戳]
  137. * @param {[type]} timestamp [description]
  138. * @return {[type]} [description]
  139. */
  140. function timestampToTime(timestamp) {
  141. //timestampÊÇÕûÊý£¬·ñÔòÒªparseIntת»»,²»»á³öÏÖÉÙ¸ö0µÄÇé¿ö
  142. if(!timestamp){
  143. return;
  144. }
  145. var time = new Date(timestamp);
  146. var year = time.getFullYear();
  147. var month = time.getMonth()+1;
  148. var date = time.getDate();
  149. var hours = time.getHours();
  150. var minutes = time.getMinutes();
  151. var seconds = time.getSeconds();
  152. return year+'-'+add0(month)+'-'+add0(date);
  153. }
  154. /**
  155. * [onLoad description:@主要加载节点方法,只对id为left-tree有效]
  156. * @return {[type]} [description]
  157. */
  158. function onLoad(){
  159. sendRequest(listApi,{pid:0},true,'get',function(data){
  160. $('#left-tree').treeview({
  161. data:data,
  162. levels: 1,
  163. onNodeSelected:function(event, node){
  164. var parentNode = $('#left-tree').treeview('getSelected');
  165. renderNodeByPid(listApi,node.id,parentNode);
  166. $('#editName').val(node.text);
  167. $("#headTitle").text(node.text);
  168. if(node){
  169. main.totalPage=Math.ceil(node.length/main.rows);
  170. showMsg(node.nodes);
  171. }
  172. },
  173. showCheckbox:false//是否显示多选
  174. });
  175. },function(){
  176. $.showMsgText("加载失败!");
  177. });
  178. }
  179. /**
  180. * [showMsg description:@渲染详情页面]
  181. * @param {[type]} list [description]
  182. * @return {[type]} [description]
  183. */
  184. function showMsg(list){
  185. if(list)
  186. list = list.slice(main.currentPage*main.rows-main.rows,main.currentPage*main.rows);
  187. $("#content").empty();
  188. var parentNode = $('#left-tree').treeview('getSelected');
  189. $.each(list,function(data,val){
  190. $tr = $("<tr></tr>");
  191. row1 = "<td>"+getParents(parentNode,[parentNode[0].text])+"</td>"; $tr.append(row1)
  192. row2 = "<td>"+val.text+"</td>"; $tr.append(row2)
  193. row3 = "<td>"+timestampToTime(val.createTime)+"</td>"; $tr.append(row3)
  194. row4 = "<td>"+timestampToTime(val.recentTime)+"</td>"; $tr.append(row4)
  195. $("#content").append($tr)
  196. });
  197. }
  198. /**
  199. * [getParents description:@遍历父节点,获取所有父节点名称]
  200. * @param {[type]} node [description]
  201. * @param {[type]} parentArr [description]
  202. * @return {[type]} [description]
  203. */
  204. function getParents(node,parentArr){
  205. parentNode=$('#left-tree').treeview('getParents', node);
  206. if(parentNode.length==0){
  207. parentArr = parentArr.reverse().join('/');
  208. return parentArr;
  209. }
  210. parentArr.push(parentNode[0].text);
  211. return getParents(parentNode,parentArr);
  212. }
  213. /**
  214. * [BindEvent description:@注册交互事件]
  215. */
  216. function BindEvent(){
  217. //保存-新增
  218. $("#Save").click(function () {
  219. $('#addOperation-dialog').modal('hide')
  220. var parentNode = $('#left-tree').treeview('getSelected');
  221. var param = { text:$('#addName').val(),pid:parentNode[0].id,parentStatu:parentNode[0].isParent }
  222. addNode(addNodeApi,JSON.stringify(param),parentNode);
  223. });
  224. //保存-编辑
  225. $('#Edit').click(function(){
  226. var node = $('#left-tree').treeview('getSelected');
  227. if(node.length==0){
  228. $.showMsgText("请选择一个学科")
  229. }
  230. updateNode(updateApi,node);
  231. });
  232. //显示-添加
  233. $("#btnAdd").click(function(){
  234. var node = $('#left-tree').treeview('getSelected');
  235. if (node.length == 0) {
  236. $.showMsgText('请选择节点');
  237. return;
  238. }
  239. $('#addName').val('');
  240. $('#addOperation-dialog').modal('show');
  241. });
  242. //删除
  243. $("#btnDel").click(function(){
  244. var node = $('#left-tree').treeview('getSelected');
  245. if (node.length == 0) {
  246. $.showMsgText('请选择节点');
  247. return;
  248. }
  249. BootstrapDialog.confirm({
  250. title: '提示',
  251. message: '确定删除此节点?',
  252. size: BootstrapDialog.SIZE_SMALL,
  253. type: BootstrapDialog.TYPE_DEFAULT,
  254. closable: true,
  255. btnCancelLabel: '取消',
  256. btnOKLabel: '确定',
  257. callback: function (result) {
  258. if(result){
  259. deleteNode(deleteApi,node);
  260. }
  261. }
  262. });
  263. });
  264. //显示-添加根节点
  265. $("#setting").click(function(){
  266. $("#addOperation-dialog-root").modal('show');
  267. });
  268. //保存-添加根节点
  269. $("#rootSave").click(function(){
  270. $('#addOperation-dialog-root').modal('hide');
  271. var param = { text:$('#addRootName').val(),pid:0,parentStatu:true };
  272. sendRequest(addNodeApi,JSON.stringify(param),true,'post',function(data){
  273. $('#left-tree').treeview('remove');
  274. onLoad();
  275. },function(failue){
  276. $.showMsgText("新增失败!");
  277. },"application/json");
  278. });
  279. //显示-移动节点
  280. $("#btnMove").click(function(){
  281. var node = $('#left-tree').treeview('getSelected');
  282. if(node.length == 0){
  283. $.showMsgText("请选择一门学科!");
  284. return;
  285. }
  286. $('#addOperation-dialog-move').modal('show');
  287. sendRequest(listApi,{pid:0},true,'get',function(data){
  288. $('#move-tree').treeview({
  289. data:data,
  290. levels: 1,
  291. onNodeSelected:function(event, node){
  292. var parentNode = $('#move-tree').treeview('getSelected');
  293. renderNodeByPid(listApi,node.id,parentNode,false);
  294. },
  295. showCheckbox:false//是否显示多选
  296. });
  297. },function(){
  298. $.showMsgText("加载失败!");
  299. });
  300. });
  301. //保存-移动节点
  302. $("#moveSave").click(function(){
  303. var node = $('#move-tree').treeview('getSelected');
  304. if(node.length == 0){
  305. $.showMsgText("请选择一门学科!");
  306. return;
  307. }
  308. $('#addOperation-dialog-move').modal('hide');
  309. var node = $("#left-tree").treeview("getSelected");
  310. var mvnode = $("#move-tree").treeview("getSelected");
  311. var param = {_method:"PUT",id:node[0].id,pid:mvnode[0].id}
  312. sendRequest(updateApi,param,true,'post',function(data){
  313. $('#left-tree').treeview('remove');
  314. onLoad();
  315. },function(failue){
  316. $.showMsgText("修改失败!");
  317. });
  318. });
  319. //翻页-上一页
  320. $("#pre").click(function(){
  321. if(main.currentPage>1){
  322. var parentNode = $('#left-tree').treeview('getSelected');
  323. main.currentPage--;
  324. $("#viewpage").text(main.currentPage);
  325. showMsg(parentNode[0].nodes);
  326. }
  327. });
  328. //翻页-下一页
  329. $("#next").click(function(){
  330. if(main.currentPage<main.totalPage){
  331. var parentNode = $('#left-tree').treeview('getSelected');
  332. main.currentPage++;
  333. $("#viewpage").text(main.currentPage);
  334. showMsg(parentNode[0].nodes);
  335. }
  336. });
  337. $("#logout").click(function(){
  338. console.log(1);
  339. $.ajax({
  340. url:logoutApi,
  341. type:'get',
  342. success:function() {
  343. window.location.href = 'entrance.html';
  344. },
  345. error:function(){
  346. $.showMsgText("错误-500");
  347. }
  348. })
  349. });
  350. }
  351. })(jQuery);