testDataMain1List.js 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445
  1. <%@ page contentType="text/html;charset=UTF-8" %>
  2. <script>
  3. $(document).ready(function() {
  4. $('#testDataMain1Table').bootstrapTable({
  5. //请求方法
  6. method: 'post',
  7. //类型json
  8. dataType: "json",
  9. contentType: "application/x-www-form-urlencoded",
  10. //显示检索按钮
  11. showSearch: true,
  12. //显示刷新按钮
  13. showRefresh: true,
  14. //显示切换手机试图按钮
  15. showToggle: true,
  16. //显示 内容列下拉框
  17. showColumns: true,
  18. //显示到处按钮
  19. showExport: true,
  20. //显示切换分页按钮
  21. showPaginationSwitch: true,
  22. //显示详情按钮
  23. detailView: true,
  24. //显示详细内容函数
  25. detailFormatter: "detailFormatter",
  26. //最低显示2行
  27. minimumCountColumns: 2,
  28. //是否显示行间隔色
  29. striped: true,
  30. //是否使用缓存,默认为true,所以一般情况下需要设置一下这个属性(*)
  31. cache: false,
  32. //是否显示分页(*)
  33. pagination: true,
  34. //排序方式
  35. sortOrder: "asc",
  36. //初始化加载第一页,默认第一页
  37. pageNumber:1,
  38. //每页的记录行数(*)
  39. pageSize: 10,
  40. //可供选择的每页的行数(*)
  41. pageList: [10, 25, 50, 100],
  42. //这个接口需要处理bootstrap table传递的固定参数,并返回特定格式的json数据
  43. url: "${ctx}/test/onetomany/dialog/testDataMain1/data",
  44. //默认值为 'limit',传给服务端的参数为:limit, offset, search, sort, order Else
  45. //queryParamsType:'',
  46. ////查询参数,每次调用是会带上这个参数,可自定义
  47. queryParams : function(params) {
  48. var searchParam = $("#searchForm").serializeJSON();
  49. searchParam.pageNo = params.limit === undefined? "1" :params.offset/params.limit+1;
  50. searchParam.pageSize = params.limit === undefined? -1 : params.limit;
  51. searchParam.orderBy = params.sort === undefined? "" : params.sort+ " "+ params.order;
  52. return searchParam;
  53. },
  54. //分页方式:client客户端分页,server服务端分页(*)
  55. sidePagination: "server",
  56. contextMenuTrigger:"right",//pc端 按右键弹出菜单
  57. contextMenuTriggerMobile:"press",//手机端 弹出菜单,click:单击, press:长按。
  58. contextMenu: '#context-menu',
  59. onContextMenuItem: function(row, $el){
  60. if($el.data("item") == "edit"){
  61. edit(row.id);
  62. }else if($el.data("item") == "view"){
  63. view(row.id);
  64. } else if($el.data("item") == "delete"){
  65. jp.confirm('确认要删除该票务代理记录吗?', function(){
  66. jp.loading();
  67. jp.get("${ctx}/test/onetomany/dialog/testDataMain1/delete?id="+row.id, function(data){
  68. if(data.success){
  69. $('#testDataMain1Table').bootstrapTable('refresh');
  70. jp.success(data.msg);
  71. }else{
  72. jp.error(data.msg);
  73. }
  74. })
  75. });
  76. }
  77. },
  78. onClickRow: function(row, $el){
  79. },
  80. onShowSearch: function () {
  81. $("#search-collapse").slideToggle();
  82. },
  83. columns: [{
  84. checkbox: true
  85. }
  86. ,{
  87. field: 'tuser.name',
  88. title: '归属用户',
  89. sortable: true,
  90. sortName: 'tuser.name'
  91. ,formatter:function(value, row , index){
  92. if(value == null || value ==""){
  93. value = "-";
  94. }
  95. <c:choose>
  96. <c:when test="${fns:hasPermission('test:onetomany:dialog:testDataMain1:edit')}">
  97. return "<a href='javascript:edit(\""+row.id+"\")'>"+value+"</a>";
  98. </c:when>
  99. <c:when test="${fns:hasPermission('test:onetomany:dialog:testDataMain1:view')}">
  100. return "<a href='javascript:view(\""+row.id+"\")'>"+value+"</a>";
  101. </c:when>
  102. <c:otherwise>
  103. return value;
  104. </c:otherwise>
  105. </c:choose>
  106. }
  107. }
  108. ,{
  109. field: 'office.name',
  110. title: '归属部门',
  111. sortable: true,
  112. sortName: 'office.name'
  113. }
  114. ,{
  115. field: 'area.name',
  116. title: '归属区域',
  117. sortable: true,
  118. sortName: 'area.name'
  119. }
  120. ,{
  121. field: 'name',
  122. title: '名称',
  123. sortable: true,
  124. sortName: 'name'
  125. }
  126. ,{
  127. field: 'sex',
  128. title: '性别',
  129. sortable: true,
  130. sortName: 'sex',
  131. formatter:function(value, row , index){
  132. return jp.getDictLabel(${fns:toJson(fns:getDictList('sex'))}, value, "-");
  133. }
  134. }
  135. ,{
  136. field: 'inDate',
  137. title: '加入日期',
  138. sortable: true,
  139. sortName: 'inDate'
  140. }
  141. ,{
  142. field: 'remarks',
  143. title: '备注信息',
  144. sortable: true,
  145. sortName: 'remarks'
  146. }
  147. ]
  148. });
  149. if(navigator.userAgent.match(/(iPhone|iPod|Android|ios)/i)){//如果是移动端
  150. $('#testDataMain1Table').bootstrapTable("toggleView");
  151. }
  152. $('#testDataMain1Table').on('check.bs.table uncheck.bs.table load-success.bs.table ' +
  153. 'check-all.bs.table uncheck-all.bs.table', function () {
  154. $('#remove').prop('disabled', ! $('#testDataMain1Table').bootstrapTable('getSelections').length);
  155. $('#view,#edit').prop('disabled', $('#testDataMain1Table').bootstrapTable('getSelections').length!=1);
  156. });
  157. $("#btnImport").click(function(){
  158. jp.open({
  159. type: 2,
  160. area: [500, 200],
  161. auto: true,
  162. title:"导入数据",
  163. content: "${ctx}/tag/importExcel" ,
  164. btn: ['下载模板','确定', '关闭'],
  165. btn1: function(index, layero){
  166. jp.downloadFile('${ctx}/test/onetomany/dialog/testDataMain1/import/template');
  167. },
  168. btn2: function(index, layero){
  169. var iframeWin = layero.find('iframe')[0]; //得到iframe页的窗口对象,执行iframe页的方法:iframeWin.method();
  170. iframeWin.contentWindow.importExcel('${ctx}/test/onetomany/dialog/testDataMain1/import', function (data) {
  171. if(data.success){
  172. jp.success(data.msg);
  173. refresh();
  174. }else{
  175. jp.error(data.msg);
  176. }
  177. jp.close(index);
  178. });//调用保存事件
  179. return false;
  180. },
  181. btn3: function(index){
  182. jp.close(index);
  183. }
  184. });
  185. });
  186. $("#export").click(function(){//导出Excel文件
  187. jp.downloadFile('${ctx}/test/onetomany/dialog/testDataMain1/export');
  188. });
  189. $("#search").click("click", function() {// 绑定查询按扭
  190. $('#testDataMain1Table').bootstrapTable('refresh');
  191. });
  192. $("#reset").click("click", function() {// 绑定查询按扭
  193. $("#searchForm input").val("");
  194. $("#searchForm select").val("");
  195. $("#searchForm .select-item").html("");
  196. $('#testDataMain1Table').bootstrapTable('refresh');
  197. });
  198. $('#beginInDate').datetimepicker({
  199. format: "YYYY-MM-DD HH:mm:ss"
  200. });
  201. $('#endInDate').datetimepicker({
  202. format: "YYYY-MM-DD HH:mm:ss"
  203. });
  204. });
  205. function getIdSelections() {
  206. return $.map($("#testDataMain1Table").bootstrapTable('getSelections'), function (row) {
  207. return row.id
  208. });
  209. }
  210. function deleteAll(){
  211. jp.confirm('确认要删除该票务代理记录吗?', function(){
  212. jp.loading();
  213. jp.get("${ctx}/test/onetomany/dialog/testDataMain1/deleteAll?ids=" + getIdSelections(), function(data){
  214. if(data.success){
  215. $('#testDataMain1Table').bootstrapTable('refresh');
  216. jp.success(data.msg);
  217. }else{
  218. jp.error(data.msg);
  219. }
  220. })
  221. })
  222. }
  223. //刷新列表
  224. function refresh() {
  225. $('#testDataMain1Table').bootstrapTable('refresh');
  226. }
  227. function add(){
  228. jp.openSaveDialog('新增票务代理', "${ctx}/test/onetomany/dialog/testDataMain1/form",'800px', '500px');
  229. }
  230. function edit(id){//没有权限时,不显示确定按钮
  231. if(id == undefined){
  232. id = getIdSelections();
  233. }
  234. jp.openSaveDialog('编辑票务代理', "${ctx}/test/onetomany/dialog/testDataMain1/form?id=" + id, '800px', '500px');
  235. }
  236. function view(id){//没有权限时,不显示确定按钮
  237. if(id == undefined){
  238. id = getIdSelections();
  239. }
  240. jp.openViewDialog('查看票务代理', "${ctx}/test/onetomany/dialog/testDataMain1/form?id=" + id, '800px', '500px');
  241. }
  242. function detailFormatter(index, row) {
  243. var htmltpl = $("#testDataMain1ChildrenTpl").html().replace(/(\/\/\<!\-\-)|(\/\/\-\->)/g,"");
  244. var html = Mustache.render(htmltpl, {
  245. idx:row.id
  246. });
  247. $.get("${ctx}/test/onetomany/dialog/testDataMain1/detail?id="+row.id, function(testDataMain1){
  248. var testDataMain1Child1RowIdx = 0, testDataMain1Child1Tpl = $("#testDataMain1Child1Tpl").html().replace(/(\/\/\<!\-\-)|(\/\/\-\->)/g,"");
  249. var data1 = testDataMain1.testDataChild11List;
  250. for (var i=0; i<data1.length; i++){
  251. data1[i].dict = {};
  252. data1[i].dict.isHave = jp.getDictLabel(${fns:toJson(fns:getDictList('yes_no'))}, data1[i].isHave, "-");
  253. addRow('#testDataMain1Child-'+row.id+'-1-List', testDataMain1Child1RowIdx, testDataMain1Child1Tpl, data1[i]);
  254. testDataMain1Child1RowIdx = testDataMain1Child1RowIdx + 1;
  255. }
  256. var testDataMain1Child2RowIdx = 0, testDataMain1Child2Tpl = $("#testDataMain1Child2Tpl").html().replace(/(\/\/\<!\-\-)|(\/\/\-\->)/g,"");
  257. var data2 = testDataMain1.testDataChild12List;
  258. for (var i=0; i<data2.length; i++){
  259. data2[i].dict = {};
  260. data2[i].dict.isHave = jp.getDictLabel(${fns:toJson(fns:getDictList('yes_no'))}, data2[i].isHave, "-");
  261. addRow('#testDataMain1Child-'+row.id+'-2-List', testDataMain1Child2RowIdx, testDataMain1Child2Tpl, data2[i]);
  262. testDataMain1Child2RowIdx = testDataMain1Child2RowIdx + 1;
  263. }
  264. var testDataMain1Child3RowIdx = 0, testDataMain1Child3Tpl = $("#testDataMain1Child3Tpl").html().replace(/(\/\/\<!\-\-)|(\/\/\-\->)/g,"");
  265. var data3 = testDataMain1.testDataChild13List;
  266. for (var i=0; i<data3.length; i++){
  267. data3[i].dict = {};
  268. data3[i].dict.isHave = jp.getDictLabel(${fns:toJson(fns:getDictList('yes_no'))}, data3[i].isHave, "-");
  269. addRow('#testDataMain1Child-'+row.id+'-3-List', testDataMain1Child3RowIdx, testDataMain1Child3Tpl, data3[i]);
  270. testDataMain1Child3RowIdx = testDataMain1Child3RowIdx + 1;
  271. }
  272. })
  273. return html;
  274. }
  275. function addRow(list, idx, tpl, row){
  276. $(list).append(Mustache.render(tpl, {
  277. idx: idx, delBtn: true, row: row
  278. }));
  279. }
  280. </script>
  281. <script type="text/template" id="testDataMain1ChildrenTpl">//<!--
  282. <div class="tabs-container">
  283. <ul class="nav nav-tabs">
  284. <li class="active"><a data-toggle="tab" href="#tab-{{idx}}-1" aria-expanded="true">火车票</a></li>
  285. <li><a data-toggle="tab" href="#tab-{{idx}}-2" aria-expanded="true">飞机票</a></li>
  286. <li><a data-toggle="tab" href="#tab-{{idx}}-3" aria-expanded="true">汽车票</a></li>
  287. </ul>
  288. <div class="tab-content">
  289. <div id="tab-{{idx}}-1" class="tab-pane fade in active">
  290. <table class="ani table">
  291. <thead>
  292. <tr>
  293. <th>出发地</th>
  294. <th>目的地</th>
  295. <th>出发时间</th>
  296. <th>代理价格</th>
  297. <th>是否有票</th>
  298. <th>备注信息</th>
  299. </tr>
  300. </thead>
  301. <tbody id="testDataMain1Child-{{idx}}-1-List">
  302. </tbody>
  303. </table>
  304. </div>
  305. <div id="tab-{{idx}}-2" class="tab-pane fade">
  306. <table class="ani table">
  307. <thead>
  308. <tr>
  309. <th>出发地</th>
  310. <th>目的地</th>
  311. <th>出发时间</th>
  312. <th>代理价格</th>
  313. <th>是否有票</th>
  314. <th>备注信息</th>
  315. </tr>
  316. </thead>
  317. <tbody id="testDataMain1Child-{{idx}}-2-List">
  318. </tbody>
  319. </table>
  320. </div>
  321. <div id="tab-{{idx}}-3" class="tab-pane fade">
  322. <table class="ani table">
  323. <thead>
  324. <tr>
  325. <th>出发地</th>
  326. <th>目的地</th>
  327. <th>代理价格</th>
  328. <th>是否有票</th>
  329. <th>备注信息</th>
  330. </tr>
  331. </thead>
  332. <tbody id="testDataMain1Child-{{idx}}-3-List">
  333. </tbody>
  334. </table>
  335. </div>
  336. </div>//-->
  337. </script>
  338. <script type="text/template" id="testDataMain1Child1Tpl">//<!--
  339. <tr>
  340. <td>
  341. {{row.startArea.name}}
  342. </td>
  343. <td>
  344. {{row.endArea.name}}
  345. </td>
  346. <td>
  347. {{row.starttime}}
  348. </td>
  349. <td>
  350. {{row.price}}
  351. </td>
  352. <td>
  353. {{row.dict.isHave}}
  354. </td>
  355. <td>
  356. {{row.remarks}}
  357. </td>
  358. </tr>//-->
  359. </script>
  360. <script type="text/template" id="testDataMain1Child2Tpl">//<!--
  361. <tr>
  362. <td>
  363. {{row.startArea.name}}
  364. </td>
  365. <td>
  366. {{row.endArea.name}}
  367. </td>
  368. <td>
  369. {{row.startTime}}
  370. </td>
  371. <td>
  372. {{row.price}}
  373. </td>
  374. <td>
  375. {{row.dict.isHave}}
  376. </td>
  377. <td>
  378. {{row.remarks}}
  379. </td>
  380. </tr>//-->
  381. </script>
  382. <script type="text/template" id="testDataMain1Child3Tpl">//<!--
  383. <tr>
  384. <td>
  385. {{row.startArea.name}}
  386. </td>
  387. <td>
  388. {{row.endArea.name}}
  389. </td>
  390. <td>
  391. {{row.price}}
  392. </td>
  393. <td>
  394. {{row.dict.isHave}}
  395. </td>
  396. <td>
  397. {{row.remarks}}
  398. </td>
  399. </tr>//-->
  400. </script>