testPieClassList.js 7.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216
  1. <%@ page contentType="text/html;charset=UTF-8" %>
  2. <script>
  3. // 基于准备好的dom,初始化echarts实例4
  4. var myChart;
  5. function refreshCharts(){
  6. jp.get("${ctx}/echarts/other/testPieClass/option", function (option) {
  7. // 指定图表的配置项和数据
  8. // 使用刚指定的配置项和数据显示图表。
  9. myChart.setOption(option);
  10. })
  11. $('#testPieClassTable').bootstrapTable('refresh');
  12. }
  13. $(document).ready(function() {
  14. myChart = echarts.init(document.getElementById('main'));
  15. window.onresize = myChart.resize;
  16. $('#testPieClassTable').bootstrapTable({
  17. //请求方法
  18. method: 'post',
  19. //类型json
  20. dataType: "json",
  21. contentType: "application/x-www-form-urlencoded",
  22. //显示刷新按钮
  23. showRefresh: true,
  24. //显示切换手机试图按钮
  25. showToggle: true,
  26. //显示 内容列下拉框
  27. showColumns: true,
  28. //显示到处按钮
  29. showExport: true,
  30. //显示切换分页按钮
  31. showPaginationSwitch: true,
  32. //最低显示2行
  33. minimumCountColumns: 2,
  34. //是否显示行间隔色
  35. striped: true,
  36. //是否使用缓存,默认为true,所以一般情况下需要设置一下这个属性(*)
  37. cache: false,
  38. //是否显示分页(*)
  39. pagination: true,
  40. //排序方式
  41. sortOrder: "asc",
  42. //初始化加载第一页,默认第一页
  43. pageNumber:1,
  44. //每页的记录行数(*)
  45. pageSize: 10,
  46. //可供选择的每页的行数(*)
  47. pageList: [10, 25, 50, 100],
  48. //这个接口需要处理bootstrap table传递的固定参数,并返回特定格式的json数据
  49. url: "${ctx}/echarts/other/testPieClass/data",
  50. //默认值为 'limit',传给服务端的参数为:limit, offset, search, sort, order Else
  51. //queryParamsType:'',
  52. ////查询参数,每次调用是会带上这个参数,可自定义
  53. queryParams : function(params) {
  54. var searchParam = $("#searchForm").serializeJSON();
  55. searchParam.pageNo = params.limit === undefined? "1" :params.offset/params.limit+1;
  56. searchParam.pageSize = params.limit === undefined? -1 : params.limit;
  57. searchParam.orderBy = params.sort === undefined? "" : params.sort+ " "+ params.order;
  58. return searchParam;
  59. },
  60. //分页方式:client客户端分页,server服务端分页(*)
  61. sidePagination: "server",
  62. contextMenuTrigger:"right",//pc端 按右键弹出菜单
  63. contextMenuTriggerMobile:"press",//手机端 弹出菜单,click:单击, press:长按。
  64. contextMenu: '#context-menu',
  65. onContextMenuItem: function(row, $el){
  66. if($el.data("item") == "edit"){
  67. edit(row.id);
  68. } else if($el.data("item") == "delete"){
  69. jp.confirm('确认要删除该学生记录吗?', function(){
  70. jp.loading();
  71. jp.get("${ctx}/echarts/other/testPieClass/delete?id="+row.id, function(data){
  72. if(data.success){
  73. refreshCharts();
  74. jp.success(data.msg);
  75. }else{
  76. jp.error(data.msg);
  77. }
  78. })
  79. });
  80. }
  81. },
  82. onClickRow: function(row, $el){
  83. },
  84. columns: [{
  85. checkbox: true
  86. }
  87. ,{
  88. field: 'className',
  89. title: '班级',
  90. sortable: true
  91. ,formatter:function(value, row , index){
  92. return "<a href='javascript:edit(\""+row.id+"\")'>"+value+"</a>";
  93. }
  94. }
  95. ,{
  96. field: 'num',
  97. title: '人数',
  98. sortable: true
  99. }
  100. ,{
  101. field: 'remarks',
  102. title: '备注信息',
  103. sortable: true
  104. }
  105. ]
  106. });
  107. jp.get("${ctx}/echarts/other/testPieClass/option", function (option) {
  108. // 指定图表的配置项和数据
  109. // 使用刚指定的配置项和数据显示图表。
  110. myChart.setOption(option);
  111. })
  112. if(navigator.userAgent.match(/(iPhone|iPod|Android|ios)/i)){//如果是移动端
  113. $('#testPieClassTable').bootstrapTable("toggleView");
  114. }
  115. $('#testPieClassTable').on('check.bs.table uncheck.bs.table load-success.bs.table ' +
  116. 'check-all.bs.table uncheck-all.bs.table', function () {
  117. $('#remove').prop('disabled', ! $('#testPieClassTable').bootstrapTable('getSelections').length);
  118. $('#edit').prop('disabled', $('#testPieClassTable').bootstrapTable('getSelections').length!=1);
  119. });
  120. $("#btnImport").click(function(){
  121. jp.open({
  122. type: 1,
  123. area: [500, 300],
  124. title:"导入数据",
  125. content:$("#importBox").html() ,
  126. btn: ['下载模板','确定', '关闭'],
  127. btn1: function(index, layero){
  128. window.location='${ctx}/echarts/other/testPieClass/import/template';
  129. },
  130. btn2: function(index, layero){
  131. var inputForm =top.$("#importForm");
  132. var top_iframe = top.getActiveTab().attr("name");//获取当前active的tab的iframe
  133. inputForm.attr("target",top_iframe);//表单提交成功后,从服务器返回的url在当前tab中展示
  134. inputForm.onsubmit = function(){
  135. jp.loading(' 正在导入,请稍等...');
  136. }
  137. inputForm.submit();
  138. jp.close(index);
  139. },
  140. btn3: function(index){
  141. jp.close(index);
  142. }
  143. });
  144. });
  145. $("#search").click("click", function() {// 绑定查询按扭
  146. $('#testPieClassTable').bootstrapTable('refresh');
  147. });
  148. $("#reset").click("click", function() {// 绑定查询按扭
  149. $("#searchForm input").val("");
  150. $("#searchForm select").val("");
  151. $("#searchForm .select-item").html("");
  152. $('#testPieClassTable').bootstrapTable('refresh');
  153. });
  154. });
  155. function getIdSelections() {
  156. return $.map($("#testPieClassTable").bootstrapTable('getSelections'), function (row) {
  157. return row.id
  158. });
  159. }
  160. function deleteAll(){
  161. jp.confirm('确认要删除该学生记录吗?', function(){
  162. jp.loading();
  163. jp.get("${ctx}/echarts/other/testPieClass/deleteAll?ids=" + getIdSelections(), function(data){
  164. if(data.success){
  165. refreshCharts();
  166. jp.success(data.msg);
  167. }else{
  168. jp.error(data.msg);
  169. }
  170. })
  171. })
  172. }
  173. function add(){
  174. jp.openSaveDialog('新增学生', "${ctx}/echarts/other/testPieClass/form",'800px', '500px');
  175. }
  176. function edit(id){//没有权限时,不显示确定按钮
  177. if(id == undefined){
  178. id = getIdSelections();
  179. }
  180. <shiro:hasPermission name="echarts:other:testPieClass:edit">
  181. jp.openSaveDialog('编辑学生', "${ctx}/echarts/other/testPieClass/form?id=" + id,'800px', '500px');
  182. </shiro:hasPermission>
  183. <shiro:lacksPermission name="echarts:other:testPieClass:edit">
  184. jp.openViewDialog('查看学生', "${ctx}/echarts/other/testPieClass/form?id=" + id,'800px', '500px');
  185. </shiro:lacksPermission>
  186. }
  187. </script>