messageList.html 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
  6. <meta name="apple-mobile-web-app-capable" content="yes">
  7. <meta name="apple-mobile-web-app-status-bar-style" content="black">
  8. <title>党建系统</title>
  9. <link href="../../css/mui.min.css" rel="stylesheet" />
  10. <link href="../../css/OA-style.css" rel="stylesheet" />
  11. </head>
  12. <body>
  13. <header class="mui-bar mui-bar-nav ">
  14. <a href="" class="mui-action-back back mui-pull-left"><img src="../../images/back.png"></a>
  15. <h1 id="title" class="mui-title">我的消息</h1>
  16. <a class="mui-icon mui-pull-right" id="save" onclick="batchRead()">
  17. <img src="../../images/batchRead.png" style="width: 24px;" />
  18. </a>
  19. </header>
  20. <div class="mui-content">
  21. <div id="pullrefresh" class="mui-content mui-scroll-wrapper" style="">
  22. <!--<div class="mui-card" v-for="item in items">
  23. <a href="javascript:;" :data-id="item.id" @tap="open_detail(item)" style="color: black;">
  24. <div class="mui-card-header tongzhi_title" style="height: 20px;overflow: hidden;">
  25. <span class="tongzhi_div" v-if="item.isread=='N'"><img class="tongzhi_img2" src="../../images/newt.png"></span>
  26. <span class="tongzhi_div3"><b id="messtitle">{{item.title}}</b></span>
  27. </div>
  28. <div class="mui-card-content">
  29. <div class="mui-card-content-inner">
  30. <div >
  31. <div class="tongzhi_div2">{{item.content}}</div><p></p>
  32. <div class="tongzhi_div4">
  33. <span class="tongzhi_div" ><img class="tongzhi_img" src="../../images/zhibanshijian.png"></span>
  34. <span class="tongzhi_div1" >{{item.sendTime}}</span>
  35. </div><br>
  36. </div>
  37. </div>
  38. </div>
  39. </a>
  40. </div>-->
  41. <div class="mui-card" v-for="item in items">
  42. <a href="javascript:;" :data-id="item.id" @tap="open_detail(item)" style="color: black;">
  43. <div class="mui-card-content">
  44. <div class="mui-card-content-inner mui-ellipsis tongzhi_title tongzhi_xian">
  45. <span class="tongzhi_div" v-if="item.isread=='N'"><img class="tongzhi_img2" src="../../images/newt.png"></span>
  46. <b id="messtitle">{{item.title}}</b>
  47. </div>
  48. </div>
  49. <div class="mui-card-content-inner">
  50. <div >
  51. <div class="tongzhi_div2">{{item.content}}</div><p></p>
  52. <div class="tongzhi_div4">
  53. <span class="tongzhi_div" ><img class="tongzhi_img" src="../../images/zhibanshijian.png"></span>
  54. <span class="tongzhi_div1" >{{item.sendTime}}</span>
  55. </div><br>
  56. </div>
  57. </div>
  58. </a>
  59. </div>
  60. <div></div>
  61. </div>
  62. </div>
  63. <script type="text/javascript" src="../../js/jquery-1.11.2.min.js"></script>
  64. <script src="../../js/mui.min.js"></script>
  65. <script src="../../js/config.js"></script>
  66. <script src="../../js/app.js"></script>
  67. <script src="../../js/vue.min.js"></script>
  68. <script src="../../js/mui.pullToRefresh.js"></script>
  69. <script src="../../js/mui.pullToRefresh.material.js"></script>
  70. <script>
  71. var pageDetail = null;
  72. mui.init({
  73. pullRefresh: {
  74. container: '#pullrefresh',
  75. down: {
  76. style: 'circle', //必选,下拉刷新样式,目前支持原生5+ ‘circle’ 样式
  77. color: '#2BD009', //可选,默认“#2BD009” 下拉刷新控件颜色
  78. height: '50px', //可选,默认50px.下拉刷新控件的高度,
  79. range: '100px', //可选 默认100px,控件可下拉拖拽的范围
  80. offset: '0px', //可选 默认0px,下拉刷新控件的起始位置
  81. // auto: true, //可选,默认false.首次加载自动上拉刷新一次
  82. callback: reloadNews //必选,刷新函数,根据具体业务来编写,比如通过ajax从服务器获取新数据;
  83. // callback: function() {
  84. // var self = this;
  85. // setTimeout(function() {
  86. // reloadNews(self);
  87. // self.endPullDownToRefresh();
  88. // }, 1000); //必选,刷新函数,根据具体业务来编写,比如通过ajax从服务器获取新数据;
  89. // }
  90. },
  91. up: {
  92. contentrefresh: '正在加载...',
  93. auto: true, //可选,默认false.自动上拉加载一次
  94. callback: pullupRefresh
  95. // callback: function() {
  96. // var self = this;
  97. // setTimeout(function() {
  98. // //var ul = self.element.querySelector('.mui-table-view');
  99. // //console.log(pullRefreshEl.id);
  100. // pullupRefresh(self);
  101. // //self.endPullUpToRefresh();
  102. // }, 1000);
  103. // }
  104. }
  105. },
  106. statusBarBackground: '#FFFFFF', //设置状态栏颜色,仅iOS可用
  107. // preloadLimit:5,
  108. });
  109. var vmA = new Vue({
  110. el: '#pullrefresh',
  111. data: {
  112. items: [] //列表信息流数据
  113. }
  114. });
  115. /**
  116. * 下拉刷新具体业务实现
  117. */
  118. function reloadNews() {
  119. pageNo = 1;
  120. vmA.items = [];
  121. // var table = document.body.querySelector('.mui-table-view');
  122. // table.innerHTML = "";
  123. addData();
  124. }
  125. var pageNo = 1;
  126. var jump_type = 0;
  127. var ids = ''; //批量已阅所需ID
  128. /**
  129. * 上拉加载具体业务实现
  130. */
  131. function pullupRefresh() {
  132. addData();
  133. }
  134. function addData() {
  135. var url = API.API_URL();
  136. var serviceId = "oa_2017V001PHONE_messageList";
  137. var state = app.getState(); //获取登陆信息
  138. var staffId = state.user.useId;
  139. var obj = {
  140. currentUser: staffId,
  141. type: jump_type,
  142. pSize: APP.PageSize,
  143. p: pageNo
  144. };
  145. app.ajax(serviceId, obj, function(data) {
  146. //服务器返回响应
  147. console.log(JSON.stringify(data))
  148. var result = data.returnParams;
  149. var totalRow = data.total;
  150. var totalPage = Math.ceil(totalRow / APP.PageSize);
  151. var list = data.list;
  152. if(totalPage == 0){
  153. totalPage =1;
  154. }
  155. if(list.length > 0) {
  156. vmA.items = vmA.items.concat(convert(list));
  157. }
  158. ids = data.ids;
  159. mui('#pullrefresh').pullRefresh().endPullupToRefresh(totalPage == pageNo); //参数为true代表没有更多数据了。
  160. if(pageNo == 1 && totalPage>1) {
  161. mui('#pullrefresh').pullRefresh().endPulldown();
  162. mui('#pullrefresh').pullRefresh().refresh(true);
  163. }
  164. if(totalPage == 1 ){
  165. mui('#pullrefresh').pullRefresh().endPulldown();
  166. }
  167. pageNo = pageNo + 1;
  168. });
  169. }
  170. /**
  171. * 1、将服务端返回数据,转换成前端需要的格式
  172. * 2、若服务端返回格式和前端所需格式相同,则不需要改功能
  173. *
  174. * @param {Array} items
  175. */
  176. function convert(items) {
  177. var newItems = [];
  178. items.forEach(function(item) {
  179. newItems.push({
  180. id: item.universalid,
  181. title: item.title,
  182. sendTime: item.sendtime,
  183. content: item.content == null ? "" : item.content.substr(0, 70),
  184. name: item.name,
  185. messageId: item.messageid,
  186. isread: item.isread,
  187. jump_id: item.jump_id
  188. });
  189. });
  190. return newItems;
  191. }
  192. mui.plusReady(function() {
  193. var self = plus.webview.currentWebview();
  194. jump_type = self.jump_type;
  195. var title1 = mui('#title');
  196. title1[0].innerHTML = self.name;
  197. //接收上个界面传递的参数
  198. window.addEventListener('listEvent', function(event) {
  199. });
  200. // pageDetail = mui.preload({
  201. // url: 'detailList.html',
  202. // id: 'detailList.html',
  203. // })
  204. });
  205. /**
  206. * 打开详情
  207. *
  208. * @param {Object} item
  209. */
  210. function open_detail(item) {
  211. //触发子窗口变更详情
  212. // mui.fire(pageDetail, 'newsEvent', {
  213. // articleId: item.articleId
  214. // });
  215. // setTimeout(function() {
  216. // pageDetail.show("slide-in-right", 300);
  217. // }, 150);
  218. readMessage(item.id);
  219. console.log(JSON.stringify(item));
  220. if(jump_type == 1) { //消息
  221. mui.openWindow({
  222. url: 'messageInfo.html',
  223. id: 'messageInfo.html',
  224. extras: {
  225. 'universalid': item.id,
  226. 'message_id': item.messageId
  227. }
  228. })
  229. } else if(jump_type == 2) { //通知公告
  230. mui.openWindow({
  231. url: '../../page/notice/noticeInfo.html',
  232. id: 'noticeInfo.html',
  233. extras: {
  234. 'notice_id': item.jump_id
  235. }
  236. })
  237. } else if(jump_type == 3) { //流程审批
  238. // var jsonJump = item.jump_id;
  239. // var modelId = jsonJump.modelId;
  240. // var opType = jsonJump.opType;
  241. // var page = "";
  242. // if("process" == opType) {
  243. // if(modelId == "3491569617311") { //请假流程
  244. // page = "../flow/leave/leave_approve.html";
  245. // } else if(modelId == "22949635069506") {
  246. // page = "../flow/monthwork_list/monthwork_approve.html";
  247. // } else if(modelId == "1153464975439") {
  248. // page = "../flow/ign_in/sign_in_approve.html"
  249. // } else if(modelId == "3566186048856") {
  250. // page = "../flow/enforce_work/enforce_work_approve.html"
  251. // } else if(modelId == "499452409010") {
  252. // page = "../flow/article_check/article_check_approve.html"
  253. // } else if(modelId == "10941763609871") {
  254. // page = "../flow/use_car/use_car_approve.html"
  255. // } else if(modelId == "30172009712867") {
  256. // page = "../flow/Nonciphertext/nonciphertext_approve.html"
  257. // }
  258. // } else {
  259. // if(modelId == "3491569617311") {
  260. // page = "../flow/leave/leave_view.html"
  261. // } else if(modelId == "22949635069506") {
  262. // page = "../flow/monthwork_list/monthwork_view.html"
  263. // } else if(modelId == "1153464975439") {
  264. // page = "../flow/sign_in/sign_in_view.html"
  265. // } else if(modelId == "3566186048856") {
  266. // page = "../flow/enforce_work/enforce_work_view.html"
  267. // } else if(modelId == "499452409010") {
  268. // page = "../flow/article_check/article_check_view.html"
  269. // } else if(modelId == "10941763609871") {
  270. // page = "../flow/use_car/use_car_view.html"
  271. // } else if(modelId == "30172009712867") {
  272. // page = "../flow/Nonciphertext/nonciphertext_view.html"
  273. // }
  274. // }
  275. mui.openWindow({
  276. createNew: true,
  277. url: "../../page/flow/flow_deal_list.html",
  278. extras: {
  279. // tinsId: jsonJump.tinsId,
  280. // insId: jsonJump.insId
  281. }
  282. });
  283. } else if(jump_type == 6) { //效率管理
  284. var jsonJump = item.jump_id;
  285. var fankui_id = jsonJump.fankui_id;
  286. var url = API.API_URL();
  287. var serviceId = "oa_efficiency_2018V0010PHONE011";
  288. var obj = {
  289. fankui_id: fankui_id
  290. };
  291. app.ajax(serviceId,obj, function(data) {
  292. //服务器返回响应
  293. console.log(JSON.stringify(data))
  294. //mui.toast(data.state);
  295. if(data.state == "0") {
  296. mui.openWindow({
  297. url: '../../page/efficiency/efficiencySignInfo.html',
  298. id: 'efficiencySignInfo.html',
  299. extras: {
  300. xiaolv_id: jsonJump.xiaolv_id,
  301. fankui_id: jsonJump.fankui_id,
  302. }
  303. })
  304. } else {
  305. mui.openWindow({
  306. url: '../../page/efficiency/efficiencyBanjieInfo.html',
  307. id: 'efficiencyBanjieInfo.html',
  308. extras: {
  309. xiaolv_id: jsonJump.xiaolv_id,
  310. fankui_id: jsonJump.fankui_id,
  311. }
  312. })
  313. }
  314. });
  315. } else if(jump_type == 7) { //出差审批管理
  316. mui.openWindow({
  317. url: '../../page/trip/trip_approve_list.html',
  318. id: 'trip_approve_list.html',
  319. extras: {
  320. }
  321. })
  322. } else if(jump_type == 8) { //抄送通知
  323. mui.openWindow({
  324. url: "../../page/flow/flow_sendFlow_list.html",
  325. id: 'flow_sendFlow_list.html',
  326. extras: {
  327. }
  328. })
  329. }
  330. }
  331. mui.init({
  332. beforeback: function() {
  333.      //获得父页面的webview
  334. var list = plus.webview.currentWebview().opener();
  335.      //触发父页面的自定义事件(refresh),从而进行刷新
  336. mui.fire(list, 'refresh',{flagBatchRead:flagBatchRead});
  337. //返回true,继续页面关闭逻辑
  338. return true;
  339. }
  340. });
  341. var flagBatchRead = false; //是否刷新父页面
  342. /**
  343. * 消息设置为已读
  344. */
  345. function readMessage(id) {
  346. var url = API.API_URL();
  347. var serviceId = "oa_2017V002PHONE_messageRead";
  348. var obj = { ids: id };
  349. app.ajax(serviceId, obj, function(data) {
  350. //服务器返回响应
  351. //console.log(JSON.stringify(data))
  352. flagBatchRead = true;
  353. });
  354. }
  355. /**
  356. * 消息设置为已读(批量)
  357. */
  358. function batchRead(){
  359. var btnArray = ['否', '是'];
  360. mui.confirm('将消息全部置为已阅?', '消息', btnArray, function(e) {
  361. if (e.index == 1) {
  362. var url = API.API_URL();
  363. var serviceId = "oa_2017V002PHONE_messageRead";
  364. var obj = {
  365. ids: ids
  366. };
  367. //console.log(ids);
  368. app.ajax(serviceId, obj, function(data) {
  369. //服务器返回响应
  370. console.log(JSON.stringify(data));
  371. if(data.num > 0){
  372. vmA.items = [];
  373. pageNo = 1;
  374. addData();
  375. mui.toast('标记已阅成功');
  376. flagBatchRead = true; //是否刷新父页面
  377. }
  378. });
  379. }
  380. })
  381. }
  382. </script>
  383. </body>
  384. </html>