user.index.1.js 10 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324
  1. $(function() {
  2. // init date tables
  3. var userListTable = $("#user_list").dataTable({
  4. "deferRender": true,
  5. "processing" : true,
  6. "serverSide": true,
  7. "ajax": {
  8. url: base_url + "/user/pageList",
  9. type:"post",
  10. data : function ( d ) {
  11. var obj = {};
  12. obj.username = $('#username').val();
  13. obj.start = d.start;
  14. obj.length = d.length;
  15. return obj;
  16. }
  17. },
  18. "searching": false,
  19. "ordering": false,
  20. //"scrollX": true, // scroll x,close self-adaption
  21. "columns": [
  22. {
  23. "data": 'id',
  24. "visible" : false,
  25. "width":'10%'
  26. },
  27. {
  28. "data": 'username',
  29. "visible" : true,
  30. "width":'20%'
  31. },
  32. {
  33. "data": 'password',
  34. "visible" : true,
  35. "width":'20%'
  36. },
  37. {
  38. "data": 'role',
  39. "visible" : true,
  40. "width":'10%',
  41. "render": function ( data, type, row ) {
  42. if (data == 1) {
  43. return I18n.user_role_admin
  44. } else {
  45. return I18n.user_role_normal
  46. }
  47. }
  48. },
  49. {
  50. "data": 'permission',
  51. "width":'10%',
  52. "visible" : false
  53. },
  54. {
  55. "data": I18n.system_opt ,
  56. "width":'15%',
  57. "render": function ( data, type, row ) {
  58. return function(){
  59. // html
  60. tableData['key'+row.id] = row;
  61. var html = '<p id="'+ row.id +'" >'+
  62. '<button class="btn btn-warning btn-xs update" type="button">'+ I18n.system_opt_edit +'</button> '+
  63. '<button class="btn btn-danger btn-xs delete" type="button">'+ I18n.system_opt_del +'</button> '+
  64. '</p>';
  65. return html;
  66. };
  67. }
  68. }
  69. ],
  70. "language" : {
  71. "sProcessing" : I18n.dataTable_sProcessing ,
  72. "sLengthMenu" : I18n.dataTable_sLengthMenu ,
  73. "sZeroRecords" : I18n.dataTable_sZeroRecords ,
  74. "sInfo" : I18n.dataTable_sInfo ,
  75. "sInfoEmpty" : I18n.dataTable_sInfoEmpty ,
  76. "sInfoFiltered" : I18n.dataTable_sInfoFiltered ,
  77. "sInfoPostFix" : "",
  78. "sSearch" : I18n.dataTable_sSearch ,
  79. "sUrl" : "",
  80. "sEmptyTable" : I18n.dataTable_sEmptyTable ,
  81. "sLoadingRecords" : I18n.dataTable_sLoadingRecords ,
  82. "sInfoThousands" : ",",
  83. "oPaginate" : {
  84. "sFirst" : I18n.dataTable_sFirst ,
  85. "sPrevious" : I18n.dataTable_sPrevious ,
  86. "sNext" : I18n.dataTable_sNext ,
  87. "sLast" : I18n.dataTable_sLast
  88. },
  89. "oAria" : {
  90. "sSortAscending" : I18n.dataTable_sSortAscending ,
  91. "sSortDescending" : I18n.dataTable_sSortDescending
  92. }
  93. }
  94. });
  95. // table data
  96. var tableData = {};
  97. // search btn
  98. $('#searchBtn').on('click', function(){
  99. userListTable.fnDraw();
  100. });
  101. // job operate
  102. $("#user_list").on('click', '.delete',function() {
  103. var id = $(this).parent('p').attr("id");
  104. layer.confirm( I18n.system_ok + I18n.system_opt_del + '?', {
  105. icon: 3,
  106. title: I18n.system_tips ,
  107. btn: [ I18n.system_ok, I18n.system_cancel ]
  108. }, function(index){
  109. layer.close(index);
  110. $.ajax({
  111. type : 'POST',
  112. url : base_url + "/user/remove",
  113. data : {
  114. "id" : id
  115. },
  116. dataType : "json",
  117. success : function(data){
  118. if (data.code == 200) {
  119. layer.msg( I18n.system_success );
  120. userListTable.fnDraw(false);
  121. } else {
  122. layer.msg( data.msg || I18n.system_opt_del + I18n.system_fail );
  123. }
  124. }
  125. });
  126. });
  127. });
  128. // add role
  129. $("#addModal .form input[name=role]").change(function () {
  130. var role = $(this).val();
  131. if (role == 1) {
  132. $("#addModal .form input[name=permission]").parents('.form-group').hide();
  133. } else {
  134. $("#addModal .form input[name=permission]").parents('.form-group').show();
  135. }
  136. $("#addModal .form input[name='permission']").prop("checked",false);
  137. });
  138. jQuery.validator.addMethod("myValid01", function(value, element) {
  139. var length = value.length;
  140. var valid = /^[a-z][a-z0-9]*$/;
  141. return this.optional(element) || valid.test(value);
  142. }, I18n.user_username_valid );
  143. // add
  144. $(".add").click(function(){
  145. $('#addModal').modal({backdrop: false, keyboard: false}).modal('show');
  146. });
  147. var addModalValidate = $("#addModal .form").validate({
  148. errorElement : 'span',
  149. errorClass : 'help-block',
  150. focusInvalid : true,
  151. rules : {
  152. username : {
  153. required : true,
  154. rangelength:[4, 20],
  155. myValid01: true
  156. },
  157. password : {
  158. required : true,
  159. rangelength:[4, 20]
  160. }
  161. },
  162. messages : {
  163. username : {
  164. required : I18n.system_please_input + I18n.user_username,
  165. rangelength: I18n.system_lengh_limit + "[4-20]"
  166. },
  167. password : {
  168. required : I18n.system_please_input + I18n.user_password,
  169. rangelength: I18n.system_lengh_limit + "[4-20]"
  170. }
  171. },
  172. highlight : function(element) {
  173. $(element).closest('.form-group').addClass('has-error');
  174. },
  175. success : function(label) {
  176. label.closest('.form-group').removeClass('has-error');
  177. label.remove();
  178. },
  179. errorPlacement : function(error, element) {
  180. element.parent('div').append(error);
  181. },
  182. submitHandler : function(form) {
  183. var permissionArr = [];
  184. $("#addModal .form input[name=permission]:checked").each(function(){
  185. permissionArr.push($(this).val());
  186. });
  187. var paramData = {
  188. "username": $("#addModal .form input[name=username]").val(),
  189. "password": $("#addModal .form input[name=password]").val(),
  190. "role": $("#addModal .form input[name=role]:checked").val(),
  191. "permission": permissionArr.join(',')
  192. };
  193. $.post(base_url + "/user/add", paramData, function(data, status) {
  194. if (data.code == "200") {
  195. $('#addModal').modal('hide');
  196. layer.msg( I18n.system_add_suc );
  197. userListTable.fnDraw();
  198. } else {
  199. layer.open({
  200. title: I18n.system_tips ,
  201. btn: [ I18n.system_ok ],
  202. content: (data.msg || I18n.system_add_fail),
  203. icon: '2'
  204. });
  205. }
  206. });
  207. }
  208. });
  209. $("#addModal").on('hide.bs.modal', function () {
  210. $("#addModal .form")[0].reset();
  211. addModalValidate.resetForm();
  212. $("#addModal .form .form-group").removeClass("has-error");
  213. $(".remote_panel").show(); // remote
  214. $("#addModal .form input[name=permission]").parents('.form-group').show();
  215. });
  216. // update role
  217. $("#updateModal .form input[name=role]").change(function () {
  218. var role = $(this).val();
  219. if (role == 1) {
  220. $("#updateModal .form input[name=permission]").parents('.form-group').hide();
  221. } else {
  222. $("#updateModal .form input[name=permission]").parents('.form-group').show();
  223. }
  224. $("#updateModal .form input[name='permission']").prop("checked",false);
  225. });
  226. // update
  227. $("#user_list").on('click', '.update',function() {
  228. var id = $(this).parent('p').attr("id");
  229. var row = tableData['key'+id];
  230. // base data
  231. $("#updateModal .form input[name='id']").val( row.id );
  232. $("#updateModal .form input[name='username']").val( row.username );
  233. $("#updateModal .form input[name='password']").val( '' );
  234. $("#updateModal .form input[name='role'][value='"+ row.role +"']").click();
  235. var permissionArr = [];
  236. if (row.permission) {
  237. permissionArr = row.permission.split(",");
  238. }
  239. $("#updateModal .form input[name='permission']").each(function () {
  240. if($.inArray($(this).val(), permissionArr) > -1) {
  241. $(this).prop("checked",true);
  242. } else {
  243. $(this).prop("checked",false);
  244. }
  245. });
  246. // show
  247. $('#updateModal').modal({backdrop: false, keyboard: false}).modal('show');
  248. });
  249. var updateModalValidate = $("#updateModal .form").validate({
  250. errorElement : 'span',
  251. errorClass : 'help-block',
  252. focusInvalid : true,
  253. highlight : function(element) {
  254. $(element).closest('.form-group').addClass('has-error');
  255. },
  256. success : function(label) {
  257. label.closest('.form-group').removeClass('has-error');
  258. label.remove();
  259. },
  260. errorPlacement : function(error, element) {
  261. element.parent('div').append(error);
  262. },
  263. submitHandler : function(form) {
  264. var permissionArr =[];
  265. $("#updateModal .form input[name=permission]:checked").each(function(){
  266. permissionArr.push($(this).val());
  267. });
  268. var paramData = {
  269. "id": $("#updateModal .form input[name=id]").val(),
  270. "username": $("#updateModal .form input[name=username]").val(),
  271. "password": $("#updateModal .form input[name=password]").val(),
  272. "role": $("#updateModal .form input[name=role]:checked").val(),
  273. "permission": permissionArr.join(',')
  274. };
  275. $.post(base_url + "/user/update", paramData, function(data, status) {
  276. if (data.code == "200") {
  277. $('#updateModal').modal('hide');
  278. layer.msg( I18n.system_update_suc );
  279. userListTable.fnDraw();
  280. } else {
  281. layer.open({
  282. title: I18n.system_tips ,
  283. btn: [ I18n.system_ok ],
  284. content: (data.msg || I18n.system_update_fail),
  285. icon: '2'
  286. });
  287. }
  288. });
  289. }
  290. });
  291. $("#updateModal").on('hide.bs.modal', function () {
  292. $("#updateModal .form")[0].reset();
  293. updateModalValidate.resetForm();
  294. $("#updateModal .form .form-group").removeClass("has-error");
  295. $(".remote_panel").show(); // remote
  296. $("#updateModal .form input[name=permission]").parents('.form-group').show();
  297. });
  298. });