12345市长热线标准版-前端

AnnManagement.html 6.1KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>公告管理</title>
  6. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7. <script src="../Script/Common/huayi.load.js"></script>
  8. <script src="../Script/Common/huayi.config.js"></script>
  9. <link rel="stylesheet" href="../js/zTree/zTreeStyle.css" />
  10. <link href="../css/WorkOrder/Search.css" rel="stylesheet">
  11. <link href="../css/init.css" rel="stylesheet" />
  12. <style>
  13. table td {
  14. word-break: break-all;
  15. word-wrap: break-word;
  16. }
  17. .ld-service li {
  18. float: left;
  19. font-size: 14px;
  20. color: #000;
  21. padding: 5px 15px;
  22. cursor: pointer;
  23. border-bottom: 1px solid #ccc;
  24. }
  25. .cr-click {
  26. border: 1px solid #ccc;
  27. background-color: #fff;
  28. border-bottom: none !important;
  29. border-bottom-left-radius: 5px;
  30. border-bottom-right-radius: 5px;
  31. }
  32. .Shows {
  33. display: block !important;
  34. }
  35. .complain {
  36. display: none;
  37. }
  38. th {
  39. padding: 5px;
  40. text-align: center;
  41. }
  42. td {
  43. padding: 5px;
  44. }
  45. .Borders {
  46. border: 1px solid #d7d7d7;
  47. }
  48. .cx {
  49. display: block;
  50. }
  51. </style>
  52. </head>
  53. <body class="gray-bg">
  54. <div class="wrapper wrapper-content animated fadeInRight">
  55. <div class="daoHang clearfix">
  56. <div class="dhLeft">
  57. <sapn>
  58. <i class="syIcon"></i>位置:
  59. <a href="javaScript:;" id="ReIndex">首页</a>&gt;
  60. <a href="javaScript:;">信息管理</a>&gt;
  61. <a class="nowPosition">公告管理</a>
  62. </sapn>
  63. </div>
  64. <div class="dhRight">
  65. <i class="fa fa-refresh"></i>
  66. </div>
  67. </div>
  68. <div class="Content_box">
  69. <!--待处理/-->
  70. <div class="complain Shows">
  71. <div class="th-box">
  72. <div class="th-bar">
  73. <div class="seach-box">
  74. <ul>
  75. <li>
  76. <a class="sc_btn btns Add ">发布公告</a>
  77. <a class="sc_btn btns remove">批量删除</a>
  78. </li>
  79. </ul>
  80. </div>
  81. </div>
  82. </div>
  83. <div style="width: 100%;padding: 10px;">
  84. <table id="workorderlist" data-row-style="rowStyle" data-query-params="queryParams" data-pagination="true">
  85. <thead>
  86. <tr>
  87. <th data-field="state" data-checkbox="true" data-align="center"></th>
  88. <th data-field="a" data-align="center">序号</th>
  89. <th data-field="b" data-align="center">公告标题</th>
  90. <th data-field="c" data-align="center">发布人</th>
  91. <th data-field="d" data-align="center">更新时间</th>
  92. <th data-field="e" data-align="center">有效期</th>
  93. <th data-field="f" data-align="center" data-formatter="Dispose">操作</th>
  94. </tr>
  95. </thead>
  96. </table>
  97. </div>
  98. </div>
  99. </div>
  100. </div>
  101. <script>
  102. initTable();
  103. var keys;
  104. $(document).ready(function() {
  105. //返回首页
  106. $('#ReIndex').click(function() {
  107. top.home_index();
  108. });
  109. $("#workorderlist").on("click-row.bs.table", function(e, row, ele) {
  110. $('.success').removeClass('success'); //去除之前选中的行的,选中样式
  111. $(ele).addClass('success'); //添加当前选中的 success样式用于区别
  112. });
  113. })
  114. //表格一
  115. function initTable(keys) {
  116. //先销毁表格
  117. $('#workorderlist').bootstrapTable('destroy');
  118. //初始化表格,动态从服务器加载数据
  119. $("#workorderlist").bootstrapTable({
  120. method: "get", //使用get请求到服务器获取数据
  121. url: 'Announcment.json',
  122. contentType: "application/x-www-form-urlencoded",
  123. striped: true, //表格显示条纹
  124. pagination: true, //启动分页
  125. pageSize: 10, //每页显示的记录数
  126. pageNumber: 1, //当前第几页
  127. pageList: [10, 20, 50, 100], //记录数可选列表
  128. search: false, //是否启用查询
  129. showColumns: false, //显示下拉框勾选要显示的列
  130. showRefresh: false, //显示刷新按钮
  131. sidePagination: "server", //表示服务端请求
  132. //设置为undefined可以获取pageNumber,pageSize,searchText,sortName,sortOrder
  133. //设置为limit可以获取limit, offset, search, sort, order
  134. queryParamsType: "undefined",
  135. queryParams: function queryParams(params) { //设置查询参数
  136. var param = {
  137. page: params.pageNumber,
  138. pagesize: params.pageSize,
  139. starttime: $("#startTimes").val(),
  140. endtime: $("#endTimes").val(),
  141. token: $.cookie("token")
  142. };
  143. return param;
  144. },
  145. onLoadSuccess: function() { //加载成功时执行
  146. //layer.msg("加载成功");
  147. },
  148. onLoadError: function() { //加载失败时执行
  149. //layer.msg("加载数据失败", { time: 1500, icon: 2 });
  150. }
  151. });
  152. }
  153. //内容
  154. function GetCont(val) {
  155. if(val) {
  156. var str = '<div '
  157. if(val.length > 10) {
  158. str = str + ' title="' + val + '" ';
  159. val = val.substr(0, 10) + "...";
  160. }
  161. return str + '>' + val + '</div>';
  162. } else {
  163. return '';
  164. }
  165. }
  166. //代办搜索
  167. $(".db").click(function() {
  168. initTable();
  169. })
  170. //操作
  171. function Dispose(val) {
  172. return '<div class="imgs" >' +
  173. '<a class="xg" onclick="ckxq(' + val + ')"> </a>' +
  174. '<a class="xg" onclick="Remove(' + val + ')"><i class="fa fa-remove"></i> </a>' +
  175. '</div>';
  176. }
  177. //查看详情
  178. function ckxq(str) {
  179. layer.open({
  180. type: 2,
  181. content: "WorkOrderDetail.html?wid=" + str, //iframe的url,no代表不显示滚动条
  182. title: '工单详情',
  183. area: ['85%', '80%'], //宽高
  184. });
  185. }
  186. ///添加公告
  187. $(".Add").click(function() {
  188. layer.open({
  189. type: 2,
  190. content: "Add.html?wid=", //iframe的url,no代表不显示滚动条
  191. title: '添加公告',
  192. area: ['40%', '45%'], //宽高
  193. });
  194. });
  195. //删除
  196. $(".remove").click(function() {
  197. var ids = $.map($('#workorderlist').bootstrapTable('getSelections'),
  198. function(row) {
  199. return row.F_BlackId;
  200. });
  201. /*判断长度*/
  202. if(ids.length <= 0) {
  203. layer.confirm('没有可删除的选项?', {
  204. btn: ['确定'] //按钮
  205. });
  206. return;
  207. }
  208. // remove();
  209. });
  210. function Remove() {
  211. layer.confirm('确定要删除么?', {
  212. btn: ['确定'] //按钮
  213. });
  214. }
  215. </script>
  216. </body>
  217. </html>