news_frm.html 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
  6. <meta name="format-detection" content="telephone=no,email=no,=no,address=no">
  7. <title></title>
  8. <link rel="stylesheet" type="text/css" href="../../css/api.css"/>
  9. <link rel="stylesheet" type="text/css" href="../../css/apiToast.css"/>
  10. <link rel="stylesheet" href="../../css/projeck.css">
  11. <style>
  12. html,body{
  13. background: #f1f1f1;
  14. }
  15. .api_layout{
  16. width: 100%;
  17. position: relative;
  18. padding: 10px 15px;
  19. -webkit-box-sizing: border-box;
  20. box-sizing: border-box;
  21. }
  22. .colmun{
  23. border: 0.5px solid #bdc3c7;
  24. -webkit-box-sizing: border-box;
  25. box-sizing: border-box;
  26. background: #fff;
  27. padding: 10px 15px;
  28. margin-bottom: 10px;
  29. }
  30. .title_text{
  31. font-weight: bold;
  32. width: 86%;
  33. }
  34. .date{
  35. color: #717478;
  36. font-size: 14px;
  37. margin: 5px 0;
  38. }
  39. .content{
  40. padding-bottom: 8px;
  41. overflow-x: scroll;
  42. }
  43. .content p{
  44. color: #000;
  45. font-size: 15px;
  46. line-height: 1.7;
  47. }
  48. .seach_more{
  49. font-size: 16px;
  50. color: #2a81b7;
  51. font-weight: bold;
  52. display: inline-block;
  53. margin-top: 8px;
  54. }
  55. .status_text{
  56. position: absolute;
  57. top: -3px;
  58. right: -6px;
  59. color: #fff;
  60. font-size: 14px;
  61. padding: 3px 7px;
  62. font-style: normal;
  63. background: #fc685c;
  64. line-height: normal;
  65. }
  66. .contents p{
  67. color:#717478
  68. }
  69. table tr th{
  70. text-align: center;
  71. }
  72. table tr td{
  73. text-align: center;
  74. }
  75. img{
  76. width: 100%;
  77. }
  78. .overflow_api{
  79. overflow: hidden;
  80. }
  81. </style>
  82. </head>
  83. <body>
  84. <div class="api_layout">
  85. <ul class="news_list" id="news_list">
  86. </ul>
  87. </div>
  88. </body>
  89. </html>
  90. <script type="text/template" id="template">
  91. {{~it:value}}
  92. {{? value.read == 0}}
  93. <li class="colmun">
  94. <div class="title relative">
  95. <h3 class="title_text">{{=value.title}}</h3>
  96. <i class="status_text">未读</i>
  97. </div>
  98. <span class="date">{{=value.created_at}}</span>
  99. <div class="content relative after-border">
  100. <p class="overflow_api">{{=value.content}}</p>
  101. </div>
  102. <!-- <span class="seach_more">详情 > ></span> -->
  103. </li>
  104. {{?? value.read == 1}}
  105. <li class="colmun">
  106. <div class="title relative">
  107. <h3 class="title_text" style="color:#6c6f74">{{=value.title}}</h3>
  108. <i class="status_text" style="background:#bdc3c7">已读</i>
  109. </div>
  110. <span class="date">{{=value.created_at}}</span>
  111. <div class="content relative after-border">
  112. <p class="contents overflow_api">{{=value.content}}</p>
  113. </div>
  114. <!-- <span class="seach_more">详情 > ></span> -->
  115. </li>
  116. {{?}}
  117. {{~}}
  118. </script>
  119. <script type="text/javascript" src="../../script/api.js"></script>
  120. <script src="../../script/doT.min.js" charset="utf-8"></script>
  121. <script src="../../script/config.js" charset="utf-8"></script>
  122. <script type="text/javascript">
  123. var apiToast = new apiToast(),headers,typeSeacrh,skipS = 1,skipW = 1,skipY = 1,skipSeacrh = 1;
  124. var isLoadding = false;
  125. apiready = function () {
  126. $api.fixStatusBar($api.dom('header'));
  127. var info = $api.getStorage('data'),
  128. token = JSON.parse(info).data.access_token;
  129. headers = {
  130. "Authorization": "Bearer " + token
  131. };
  132. getNewsListFun('');
  133. api.addEventListener({
  134. name : 'scrolltobottom',
  135. extra : {
  136. threshold : 0 //设置距离底部多少距离时触发,默认值为0,数字类型
  137. }
  138. }, function(ret, err) {
  139. if (!isLoadding) {
  140. isLoadding = true;
  141. getNewsListFun(typeSeacrh,false);
  142. }
  143. });
  144. };
  145. function getNewsListFun(types,flat) {
  146. typeSeacrh = types;
  147. if (types == 'read') {
  148. $http.fnReuestDataNologing(UrlRouter.getRead,headers,'post','',function (ret,err) {
  149. if (ret.code === 0) {
  150. api.execScript({
  151. name: 'newsList',
  152. script: 'newsNum();'
  153. });
  154. }
  155. })
  156. if (flat) {
  157. skipY = 1
  158. }
  159. var data = {
  160. type:types,
  161. page:skipY,
  162. page_size:10
  163. }
  164. $http.fnReuestDataNoW(UrlRouter.getNewsList,headers,'get',data,function (ret,err) {
  165. isLoadding = false;
  166. apiToast.hide();
  167. $event.removeTips('tips')
  168. $event.deletNotContent('NotcontentID');
  169. if (ret.data.data.length == 0 && skipY == 1) {
  170. $event.NotContent('body','NotcontentID','../../image/NOnews.png');
  171. $apis.html(news_list,'#template',ret.data.data);
  172. isLoadding = true;
  173. return false;
  174. }else {
  175. $event.deletNotContent('NotcontentID');
  176. }
  177. if (ret.code === 0) {
  178. if (flat) {
  179. skipY += 1;
  180. $event.removeTips('tips');
  181. $event.deletNotContent('NotcontentID');
  182. $apis.html(news_list,'#template',ret.data.data);
  183. for (var i = 0; i < $api.domAll('table').length; i++) {
  184. $api.attr($api.domAll('table')[i], 'border', '1');
  185. }
  186. }else if (ret.data.data.length>0) {
  187. skipY += 1;
  188. $event.removeTips('tips');
  189. $apis.append(news_list,'#template',ret.data.data);
  190. $event.deletNotContent('NotcontentID');
  191. for (var i = 0; i < $api.domAll('table').length; i++) {
  192. $api.attr($api.domAll('table')[i], 'border', '1');
  193. }
  194. }else {
  195. isLoadding = true;
  196. api.toast({
  197. msg: '没有更多数据',
  198. duration: 2000,
  199. location: 'bottom'
  200. });
  201. }
  202. }else {
  203. $event.tips('body','网络错误,请链接网络!');
  204. }
  205. })
  206. }else if (types === 'unread') {
  207. if (flat) {
  208. skipW = 1
  209. }
  210. var data = {
  211. type:types,
  212. page:skipW,
  213. page_size:10
  214. }
  215. $http.fnReuestDataNoW(UrlRouter.getNewsList,headers,'get',data,function (ret,err) {
  216. isLoadding = false;
  217. apiToast.hide();
  218. $event.removeTips('tips')
  219. $event.deletNotContent('NotcontentID');
  220. if (ret.data.data.length == 0 && skipW == 1) {
  221. $event.NotContent('body','NotcontentID','../../image/NOnews.png');
  222. $apis.html(news_list,'#template',ret.data.data);
  223. isLoadding = true;
  224. return false;
  225. }else {
  226. $event.deletNotContent('NotcontentID');
  227. }
  228. if (ret.code === 0) {
  229. if (flat) {
  230. skipW += 1;
  231. $event.removeTips('tips');
  232. $event.deletNotContent('NotcontentID');
  233. $apis.html(news_list,'#template',ret.data.data);
  234. for (var i = 0; i < $api.domAll('table').length; i++) {
  235. $api.attr($api.domAll('table')[i], 'border', '1');
  236. }
  237. }else if (ret.data.data.length>0) {
  238. skipW += 1;
  239. $event.removeTips('tips');
  240. $apis.append(news_list,'#template',ret.data.data);
  241. $event.deletNotContent('NotcontentID');
  242. for (var i = 0; i < $api.domAll('table').length; i++) {
  243. $api.attr($api.domAll('table')[i], 'border', '1');
  244. }
  245. }else {
  246. isLoadding = true;
  247. api.toast({
  248. msg: '没有更多数据',
  249. duration: 2000,
  250. location: 'bottom'
  251. });
  252. }
  253. }else {
  254. $event.tips('body','网络错误,请链接网络!');
  255. }
  256. })
  257. }else {
  258. if (flat) {
  259. skipS = 1
  260. }
  261. var data = {
  262. type:types,
  263. page:skipS,
  264. page_size:10
  265. }
  266. $http.fnReuestDataNoW(UrlRouter.getNewsList,headers,'get',data,function (ret,err) {
  267. isLoadding = false;
  268. apiToast.hide();
  269. $event.removeTips('tips')
  270. $event.deletNotContent('NotcontentID');
  271. if (ret.data.data.length == 0 && skipS == 1) {
  272. $event.NotContent('body','NotcontentID','../../image/NOnews.png');
  273. $apis.html(news_list,'#template',ret.data.data);
  274. isLoadding = true;
  275. return false;
  276. }else {
  277. $event.deletNotContent('NotcontentID');
  278. }
  279. if (ret.code === 0) {
  280. if (flat) {
  281. skipS += 1;
  282. $event.removeTips('tips');
  283. $event.deletNotContent('NotcontentID');
  284. $apis.html(news_list,'#template',ret.data.data);
  285. for (var i = 0; i < $api.domAll('table').length; i++) {
  286. $api.attr($api.domAll('table')[i], 'border', '1');
  287. }
  288. }else if (ret.data.data.length>0) {
  289. skipS += 1;
  290. $event.removeTips('tips');
  291. $apis.append(news_list,'#template',ret.data.data);
  292. $event.deletNotContent('NotcontentID');
  293. for (var i = 0; i < $api.domAll('table').length; i++) {
  294. $api.attr($api.domAll('table')[i], 'border', '1');
  295. }
  296. }else {
  297. isLoadding = true;
  298. api.toast({
  299. msg: '没有更多数据',
  300. duration: 2000,
  301. location: 'bottom'
  302. });
  303. }
  304. }else {
  305. $event.tips('body','网络错误,请链接网络!');
  306. }
  307. })
  308. }
  309. }
  310. // 搜索
  311. function getSearchData(name){
  312. var data = {
  313. type:typeSeacrh,
  314. search:name,
  315. page_size:'all'
  316. }
  317. $http.fnReuestDataNoW(UrlRouter.getNewsList,headers,'get',data,function (ret,err) {
  318. apiToast.hide();
  319. $event.removeTips('tips');
  320. $event.deletNotContent('NotcontentID');
  321. if (ret.code === 0) {
  322. if (ret.data.data.length>0) {
  323. $event.removeTips('tips')
  324. $apis.html(news_list,'#template',ret.data.data);
  325. $event.deletNotContent('NotcontentID');
  326. for (var i = 0; i < $api.domAll('table').length; i++) {
  327. $api.attr($api.domAll('table')[i], 'border', '1');
  328. }
  329. }else {
  330. $event.removeTips('tips')
  331. $apis.html(news_list,'#template',ret.data.data);
  332. $event.NotContent('body','NotcontentID','../../image/NOnews.png');
  333. }
  334. }else {
  335. $event.tips('body','网络错误,请链接网络!');
  336. }
  337. })
  338. }
  339. </script>