mytable.js 8.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236
  1. (function($) {
  2. 'use strict';
  3. var con;
  4. var options;
  5. var curDatas;
  6. var element;
  7. var obj;
  8. /**
  9. * Datatable class
  10. *
  11. * @param object element DOM element or jquery element
  12. * @param object options Datatable options
  13. */
  14. var mytable = function(element, options, flag) {
  15. // default options
  16. var DEFAULTS = {
  17. checkable:false,
  18. sortable:false,
  19. isShoWPager:true,
  20. pager:{
  21. page_size:10
  22. }
  23. };
  24. this.options = $.extend({}, DEFAULTS, options);
  25. this.element = element;
  26. // this.options = options;
  27. this.pager = options.pager;
  28. this.con = $(element);
  29. this.obj = this;
  30. $(element).html('');
  31. if(flag) return;
  32. $(element).append('<div class=""><div id="my_table" data-checkable="true" data-sortable="true"></div></div>'
  33. + '<div id="kkpager" class="" style="text-align:center"></div>');
  34. this.getRemoteData(element,this.options,this);
  35. return this;
  36. };
  37. // Get options
  38. mytable.prototype = {
  39. getRemoteData:function(element,options,obj){
  40. if(!element) element = this.element;
  41. if(!options) options = this.options;
  42. var url = options.url;
  43. var p_cur = 1;
  44. var pager = options.pager;
  45. this.getServerData(p_cur, options, element, obj);
  46. },
  47. getRemoteData1:function(p_cur){
  48. this.getServerData(p_cur, this.options, this.element, this.obj);
  49. },
  50. getServerData:function(p_cur, options, element, obj){
  51. var url = options.url;
  52. var pager = options.pager;
  53. var page_size = pager.page_size;
  54. var param = options.param;
  55. // var obj = this.obj;
  56. post_common_service(url+"/"+p_cur+"/"+page_size, param, function(data) {
  57. console.log(data);
  58. if(!data){
  59. data = {list:[]};
  60. // return;
  61. }
  62. // 这边把请求过来的数据缓存到table选择器中
  63. $(element).data("data_cache",data.list);
  64. element.tt_data=data.list;
  65. options.tableData=data.list;
  66. obj.setTable(data.list,element, options,p_cur);
  67. if(obj.options.pager){
  68. options.pager = {
  69. page_size:10,
  70. p_cur : data.pageNum, //页号
  71. p_pages:data.pages, //总页码
  72. p_totalRecords:data.total
  73. // 'cb':'getRemoteData
  74. }
  75. obj.setPager();
  76. }
  77. if(data.list.length<=0){
  78. $("#kkpager").css("display","none");
  79. }else{
  80. $("#kkpager").css("display","block");
  81. }
  82. }, function(error) {
  83. alert(error);
  84. });
  85. },
  86. setTable:function(datas, element, options,p_cur) {
  87. var cols = options.cols;
  88. var newCols = []
  89. for(var i in cols) {
  90. if(!cols[i].hide){
  91. newCols.push(cols[i]);
  92. }
  93. }
  94. cols = newCols;
  95. var tableData = datas;
  96. // var pager = options.pager;
  97. clearTable(cols,options,element);
  98. var rowData = formatTableData(tableData, cols, p_cur);
  99. // 使用data参数更新数据:
  100. $('#my_table').datatable('load',{
  101. cols: cols,
  102. rows:rowData
  103. }
  104. );
  105. // $('#my_table').datatable({checkable: true});
  106. $('a.lightbox-toggle').lightbox();//图片轮播
  107. function formatTableData(data,cols,p_cur){
  108. var rows = [];
  109. for(var i=0;i<data.length;i++){
  110. data[i].num=(p_cur-1)*10+i+1;
  111. rows.push(genRow(data[i],cols));
  112. }
  113. return rows;
  114. }
  115. function genRow(obj,cols){
  116. var row = {checked: false, data:null};
  117. var dArr=[];
  118. for(var i=0;i<cols.length;i++){
  119. if(cols[i].func!=null){
  120. dArr.push(cols[i].func(obj[cols[i].field]));
  121. }else if(cols[i].type=="imagedd"){
  122. var pics = obj[cols[i].field];
  123. var picStr='';
  124. if(pics){
  125. var picArr = pics.split(',');
  126. for(var j in picArr){
  127. var pic = '<a class="lightbox-toggle" href="'+picArr[j]+'" style="width:60px;height:50px;">'
  128. + '<img class="pic-class img-thumbnail" style="width:60px;height:50px;" src="'+picArr[j]+'" alt="">'
  129. + '</a>';
  130. picStr+=pic;
  131. }
  132. }
  133. dArr.push(picStr);
  134. }else if(cols[i].oper!=null) {
  135. var oper = cols[i].oper;
  136. var operStr="";
  137. for(var j=0;j<oper.length;j++){
  138. operStr+='<a href="javascript:void(0)" onclick="'+oper[j].func+'('+obj[cols[i].field]+','+obj[cols[i].field_other]+')"><i class="icon '+oper[j].icon_class+'"></i>&nbsp;'+oper[j].text+' </a>&nbsp;';
  139. }
  140. dArr.push(operStr);
  141. }else{
  142. if(cols[i].type == "date"){
  143. if(cols[i].custom){
  144. dArr.push(timeStamp2String(obj[cols[i].field],cols[i].date_type) + cols[i].custom);
  145. }else{
  146. dArr.push(timeStamp2String(obj[cols[i].field],cols[i].date_type));
  147. }
  148. }else if(obj[cols[i].field]){
  149. if(cols[i].custom){
  150. dArr.push(obj[cols[i].field] + cols[i].custom);
  151. }else{
  152. dArr.push(obj[cols[i].field]);
  153. }
  154. }else{
  155. dArr.push('');
  156. }
  157. }
  158. }
  159. row.data=dArr;
  160. return row;
  161. }
  162. function clearTable(cols,options,element){
  163. var checkable = options.checkable;
  164. var sortable = options.sortable
  165. $('#my_table').datatable( {
  166. checkable:checkable,
  167. sortable:sortable,
  168. data: {
  169. cols: cols,
  170. rows:[]
  171. },
  172. checksChanged:function(event) {
  173. var checkArr = event.checks.checks;
  174. var checkedIds=[];
  175. for(var i=0;i<checkArr.length;i++) {
  176. element.tt_data[i].checked=true;
  177. checkedIds.push(element.tt_data[i].id);
  178. }
  179. element.tt_checkedIds = checkedIds;
  180. }
  181. });
  182. }
  183. },
  184. setPager:function(data) {
  185. var pager = this.options.pager;
  186. var p_cur = pager.p_cur;
  187. var p_pages = pager.p_pages;
  188. var p_totalRecords = pager.p_totalRecords;
  189. var obj=this;
  190. kkpager.generPageHtml({
  191. pno : p_cur,
  192. total : p_pages,
  193. totalRecords : p_totalRecords,
  194. isShowTotalRecords:true,
  195. mode : 'click',
  196. click : function(n){
  197. obj.options.pager.p_cur = n;
  198. this.selectPage(n);
  199. obj.getRemoteData1(n);//调用获取数据方法
  200. return false;
  201. }
  202. },true);
  203. }
  204. };
  205. $.fn.mytable = function(options) {
  206. if (typeof options == 'string') {
  207. switch (options) {
  208. case 'getTableData':
  209. return this[0].tt_data;
  210. case 'getTableCheckedIds':
  211. return this[0].tt_checkedIds;
  212. case 'empty':
  213. return new mytable(this,options,true);
  214. }
  215. } else{
  216. return this.each(function() {
  217. // var $this = $(this);
  218. new mytable(this,options);
  219. // $(this).attr('tableData',mytable.tableData);
  220. });
  221. }
  222. };
  223. $.fn.mytable.Constructor = mytable;
  224. }(jQuery));