Нет описания

OverdueRemindSearch.html 11KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403
  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. <script src="../css/laydate/laydate.js"></script>
  13. <script src="../My97DatePicker/WdatePicker.js"></script>
  14. <!--<script src="../js/WorkOrder/WorkOrder.js"></script>-->
  15. <style>
  16. table th {
  17. margin-bottom: 10px;
  18. }
  19. table td {
  20. padding-left: 5px;
  21. margin-bottom: 10px;
  22. }
  23. .ld-service li {
  24. float: left;
  25. font-size: 14px;
  26. color: #000;
  27. padding: 5px 15px;
  28. cursor: pointer;
  29. border-bottom: 1px solid #ccc;
  30. }
  31. .cr-click {
  32. border: 1px solid #ccc;
  33. background-color: #fff;
  34. border-bottom: none!important;
  35. border-bottom-left-radius: 5px;
  36. border-bottom-right-radius: 5px;
  37. }
  38. .Shows {
  39. display: block!important;
  40. }
  41. .complain {
  42. display: none;
  43. }
  44. th {
  45. padding: 5px;
  46. text-align: right;
  47. }
  48. .Borders {
  49. border: 1px solid #d7d7d7;
  50. }
  51. .Hidens {
  52. display: none;
  53. }
  54. .Red {
  55. color: #e43926;
  56. font-size: 16px;
  57. }
  58. .inputs {
  59. background-color: #FFF;
  60. border: 1px solid #e5e6e7;
  61. border-radius: 1px;
  62. color: inherit;
  63. padding: 3px 3px;
  64. }
  65. textarea {
  66. margin-top: 10px;
  67. }
  68. .dbul li {
  69. width: 50%;
  70. }
  71. </style>
  72. </head>
  73. <body class="gray-bg">
  74. <div class="wrapper wrapper-content animated fadeInRight">
  75. <div class="daoHang clearfix">
  76. <div class="dhLeft">
  77. <sapn><i class="syIcon"></i>位置:
  78. <a href="javaScript:;" id="ReIndex">首页</a>&gt;
  79. <a href="javaScript:;">工单管理</a>&gt;
  80. <a href="" class="nowPosition">催办</a>
  81. </sapn>
  82. </div>
  83. <div class="dhRight">
  84. <a href="" title="刷新"><i class="fa fa-refresh"></i></a>
  85. </div>
  86. </div>
  87. <div class="Content_box">
  88. <!--待处理/-->
  89. <div class="complain Shows">
  90. <div class="th-box">
  91. <div class="th-bar">
  92. <div class="seach-box">
  93. <ul>
  94. <li>逾期日期还剩:
  95. <select name="" class="selects" id="yqrq">
  96. <option value="1">1天</option>
  97. <option value="2">2天</option>
  98. <option value="3">3天</option>
  99. <option value="4">4天</option>
  100. <option value="5">5天</option>
  101. <option value="6">6天</option>
  102. <option value="7">7天</option>
  103. <option value="">显示逾期</option>
  104. </select>
  105. </li>
  106. <li>时间:
  107. <input class="photo x-color inputs laydate-icon" type="text" id="startTime" />-
  108. <input class="photo x-color inputs laydate-icon" type="text" id="endTime" />
  109. </li>
  110. <li>所属人员:
  111. <select name="" class="selects" id="ssry">
  112. <option value="1">当前工号</option>
  113. <option value="2">所有人</option>
  114. </select>
  115. </li>
  116. <li>
  117. <a class="sc_btn btns db">搜索</a>
  118. </li>
  119. </ul>
  120. </div>
  121. </div>
  122. </div>
  123. <div style="width: 100%;padding: 10px;">
  124. <table id="workorderlist" data-row-style="rowStyle" data-query-params="queryParams" data-pagination="true">
  125. <thead>
  126. <tr>
  127. <th data-align="center" ></th>
  128. <th data-field="F_WorkOrderId" data-align="center">登记编号</th>
  129. <th data-field="F_RegDate" data-align="center">登记时间</th>
  130. <th data-field="TypeName" data-align="center">信息类别</th>
  131. <th data-field="DeptName" data-align="center" data-formatter="SourceAddress">交办单位</th>
  132. <th data-field="WorkStateName" data-align="center">状态</th>
  133. <th data-field="cbcs" data-align="center">催办次数</th>
  134. <th data-field="F_ComContent" data-align="center" data-formatter="ComContent">详细内容</th>
  135. <th data-field="WorkOrderID" data-formatter="Dispose" data-align="center">操作</th>
  136. </tr>
  137. </thead>
  138. </table>
  139. </div>
  140. </div>
  141. </div>
  142. </div>
  143. <div class="t-shade">
  144. <!--工单详情-->
  145. <div class="shade_k clgd ">
  146. <div class="shade_title">
  147. <span>工单详情<srong class="cknum"></srong></span>
  148. <span class="setwin"><a>x</a></span>
  149. </div>
  150. <div class="shade_content">
  151. <div style="padding: 10px;" class="tj_content clearFix">
  152. <div>
  153. <span>【新增催办记录 】</span>
  154. <div class="box_content">
  155. <table id="cbjl" style="width: 100%;" border="0" cellspacing="0" cellpadding="0">
  156. <tr>
  157. <th>受理单编号:</th>
  158. <td>
  159. <span class="slbh"></span>
  160. </td>
  161. </tr>
  162. <tr>
  163. <th>交办单位:</th>
  164. <td>
  165. <span class='jbdw'></span>
  166. </td>
  167. </tr>
  168. <tr>
  169. <th>拨打电话:</th>
  170. <td>
  171. <input type="text" class="inputs bddh" />
  172. </td>
  173. </tr>
  174. <!--<tr>
  175. <th>催办人:</th>
  176. <td>
  177. <span class='cbr'></span>
  178. </td>
  179. </tr>-->
  180. <tr>
  181. <th>催办备注:</th>
  182. <td colspan="10">
  183. <textarea data-adaptheight name="" rows="" cols="" class="cbbz"></textarea>
  184. </td>
  185. </tr>
  186. </table>
  187. </div>
  188. </div>
  189. <input type="hidden" id="wids" />
  190. </div>
  191. <div class="clearfix wh_btn">
  192. <input type="button" value="保存" class="" id="Dbfk" noclick="" />
  193. <input type="button" value="关闭" class="" id="Closexq" />
  194. </div>
  195. </div>
  196. </div>
  197. <!--办理工单-->
  198. </div>
  199. <script src="../js/adjustHeight.js"></script>
  200. <script>
  201. $(document).ready(function () {
  202. initTable();
  203. laydate.skin('molv');
  204. laydate({
  205. elem: '#startTime',
  206. event: 'focus'
  207. });
  208. laydate({
  209. elem: '#endTime',
  210. event: 'focus'
  211. });
  212. $("#workorderlist").on("click-row.bs.table", function (e, row, ele) {
  213. $('.success').removeClass('success'); //去除之前选中的行的,选中样式
  214. $(ele).addClass('success'); //添加当前选中的 success样式用于区别
  215. });
  216. //待办搜索
  217. $(".db").click(function () {
  218. initTable();
  219. })
  220. //点击关闭详情
  221. $('.setwin').click(function () {
  222. $(".t-shade").hide();
  223. $(".clgd ").hide();
  224. })
  225. $("#Closexq").click(function () {
  226. $(".t-shade").hide();
  227. $(".clgd").hide();
  228. })
  229. //关闭处理弹框
  230. $("#Closefl").click(function () {
  231. $(".t-shade").hide();
  232. $(".blgd").hide();
  233. })
  234. //保存催办
  235. $("#Dbfk").click(function () {
  236. $(".cbbz").val()
  237. AddRemind();
  238. })
  239. })
  240. //表格一
  241. function initTable() {
  242. //先销毁表格
  243. $('#workorderlist').bootstrapTable('destroy');
  244. //初始化表格,动态从服务器加载数据
  245. $("#workorderlist").bootstrapTable({
  246. method: "get", //使用get请求到服务器获取数据
  247. url: huayi.config.callcenter_url + "WorkOrder/GetYQList", //获取数据的Servlet地址
  248. contentType: "application/x-www-form-urlencoded",striped: true, //表格显示条纹
  249. pagination: true, //启动分页
  250. pageSize: 10, //每页显示的记录数
  251. pageNumber: 1, //当前第几页
  252. pageList: [10, 20, 50, 100], //记录数可选列表
  253. search: false, //是否启用查询
  254. showColumns: false, //显示下拉框勾选要显示的列
  255. showRefresh: false, //显示刷新按钮
  256. sidePagination: "server", //表示服务端请求
  257. //设置为undefined可以获取pageNumber,pageSize,searchText,sortName,sortOrder
  258. //设置为limit可以获取limit, offset, search, sort, order
  259. queryParamsType: "undefined",
  260. queryParams: function queryParams(params) { //设置查询参数
  261. var param = {
  262. page: params.pageNumber,
  263. pagesize: params.pageSize,
  264. day: $("#yqrq").val(),
  265. starttime: $("#startTime").val(),
  266. endtime: $("#endTime").val(),
  267. isall: $("#ssry").val(),
  268. token: $.cookie("token")
  269. };
  270. return param;
  271. },
  272. onLoadSuccess: function() { //加载成功时执行
  273. //layer.msg("加载成功");
  274. },
  275. onLoadError: function() { //加载失败时执行
  276. //layer.msg("加载数据失败", { time: 1500, icon: 2 });
  277. }
  278. });
  279. }
  280. //内容
  281. function ComContent(val) {
  282. if(val) {
  283. var str = '<div '
  284. if(val.length > 10) {
  285. str = str + ' title="' + val + '" ';
  286. val = val.substr(0, 10) + "...";
  287. }
  288. return str + '>' + val + '</div>';
  289. } else {
  290. return '';
  291. }
  292. }
  293. //地址
  294. function SourceAddress(val) {
  295. if(val) {
  296. var str = '<div '
  297. if(val.length > 5) {
  298. str = str + ' title="' + val + '" ';
  299. val = val.substr(0, 5) + "...";
  300. }
  301. return str + '>' + val + '</div>';
  302. } else {
  303. return '';
  304. }
  305. }
  306. //操作
  307. function Dispose(val, row) {
  308. return '<div class="imgs" >' +
  309. '<a class="xg"onclick="dbcl(' + row.F_WorkOrderId + ')"> 催办</a>' +
  310. '</div>';
  311. }
  312. //待办处理
  313. function dbcl(Id) {
  314. $(".t-shade").show();
  315. $(".clgd ").show();
  316. $("#wids").val(Id);
  317. $(".bddh").val("");
  318. $(".cbbz").val("");
  319. GetWorkOrder();
  320. //请求数据填充详情表格
  321. }
  322. //获取工单信息
  323. function GetWorkOrder() {
  324. $.ajax({
  325. type: "get",
  326. url: huayi.config.callcenter_url + "WorkOrder/GetWorkOrder",
  327. dataType: 'json',
  328. async: true,
  329. data: {
  330. workorderid: $("#wids").val(),
  331. token: $.cookie("token")
  332. },
  333. success: function(data) {
  334. /*验证请求*/
  335. if(data.state == "success") {
  336. var content = data.data.data;
  337. $(".slbh").text(content[0].F_WorkOrderId);
  338. $(".jbdw").text(content[0].DeptName);
  339. }
  340. }
  341. });
  342. }
  343. //新增催办
  344. function AddRemind() {
  345. $.ajax({
  346. type: "post",
  347. url: huayi.config.callcenter_url + "WorkOrder/AddRemind",
  348. dataType: 'json',
  349. async: true,
  350. data: {
  351. workorderid: $("#wids").val(),
  352. deptname: $('.jbdw').text(),
  353. phone: $(".bddh").val(),
  354. remark: $(".cbbz").val(),
  355. token: $.cookie("token")
  356. },
  357. success: function(data) {
  358. /*验证请求*/
  359. if(data.state == "success") {
  360. layer.msg(data.message);
  361. $(".t-shade").hide();
  362. $(".clgd").hide();
  363. $(".bddh").val('');
  364. $(".cbbz").val('');
  365. //重新加载
  366. initTable();
  367. }
  368. }
  369. });
  370. }
  371. </script>
  372. </body>
  373. </html>