newsList.js 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306
  1. layui.config({
  2. base : "js/"
  3. }).use(['form','layer','jquery','laypage'],function(){
  4. var form = layui.form(),
  5. layer = parent.layer === undefined ? layui.layer : parent.layer,
  6. laypage = layui.laypage,
  7. $ = layui.jquery;
  8. //加载页面数据
  9. var newsData = '';
  10. $.get("../../json/newsList.json", function(data){
  11. var newArray = [];
  12. //单击首页“待审核文章”加载的信息
  13. if($(".top_tab li.layui-this cite",parent.document).text() == "待审核文章"){
  14. if(window.sessionStorage.getItem("addNews")){
  15. var addNews = window.sessionStorage.getItem("addNews");
  16. newsData = JSON.parse(addNews).concat(data);
  17. }else{
  18. newsData = data;
  19. }
  20. for(var i=0;i<newsData.length;i++){
  21. if(newsData[i].newsStatus == "待审核"){
  22. newArray.push(newsData[i]);
  23. }
  24. }
  25. newsData = newArray;
  26. newsList(newsData);
  27. }else{ //正常加载信息
  28. newsData = data;
  29. if(window.sessionStorage.getItem("addNews")){
  30. var addNews = window.sessionStorage.getItem("addNews");
  31. newsData = JSON.parse(addNews).concat(newsData);
  32. }
  33. //执行加载数据的方法
  34. newsList();
  35. }
  36. })
  37. //查询
  38. $(".search_btn").click(function(){
  39. var newArray = [];
  40. if($(".search_input").val() != ''){
  41. var index = layer.msg('查询中,请稍候',{icon: 16,time:false,shade:0.8});
  42. setTimeout(function(){
  43. $.ajax({
  44. url : "../../json/newsList.json",
  45. type : "get",
  46. dataType : "json",
  47. success : function(data){
  48. if(window.sessionStorage.getItem("addNews")){
  49. var addNews = window.sessionStorage.getItem("addNews");
  50. newsData = JSON.parse(addNews).concat(data);
  51. }else{
  52. newsData = data;
  53. }
  54. for(var i=0;i<newsData.length;i++){
  55. var newsStr = newsData[i];
  56. var selectStr = $(".search_input").val();
  57. function changeStr(data){
  58. var dataStr = '';
  59. var showNum = data.split(eval("/"+selectStr+"/ig")).length - 1;
  60. if(showNum > 1){
  61. for (var j=0;j<showNum;j++) {
  62. dataStr += data.split(eval("/"+selectStr+"/ig"))[j] + "<i style='color:#03c339;font-weight:bold;'>" + selectStr + "</i>";
  63. }
  64. dataStr += data.split(eval("/"+selectStr+"/ig"))[showNum];
  65. return dataStr;
  66. }else{
  67. dataStr = data.split(eval("/"+selectStr+"/ig"))[0] + "<i style='color:#03c339;font-weight:bold;'>" + selectStr + "</i>" + data.split(eval("/"+selectStr+"/ig"))[1];
  68. return dataStr;
  69. }
  70. }
  71. //文章标题
  72. if(newsStr.newsName.indexOf(selectStr) > -1){
  73. newsStr["newsName"] = changeStr(newsStr.newsName);
  74. }
  75. //发布人
  76. if(newsStr.newsAuthor.indexOf(selectStr) > -1){
  77. newsStr["newsAuthor"] = changeStr(newsStr.newsAuthor);
  78. }
  79. //审核状态
  80. if(newsStr.newsStatus.indexOf(selectStr) > -1){
  81. newsStr["newsStatus"] = changeStr(newsStr.newsStatus);
  82. }
  83. //浏览权限
  84. if(newsStr.newsLook.indexOf(selectStr) > -1){
  85. newsStr["newsLook"] = changeStr(newsStr.newsLook);
  86. }
  87. //发布时间
  88. if(newsStr.newsTime.indexOf(selectStr) > -1){
  89. newsStr["newsTime"] = changeStr(newsStr.newsTime);
  90. }
  91. if(newsStr.newsName.indexOf(selectStr)>-1 || newsStr.newsAuthor.indexOf(selectStr)>-1 || newsStr.newsStatus.indexOf(selectStr)>-1 || newsStr.newsLook.indexOf(selectStr)>-1 || newsStr.newsTime.indexOf(selectStr)>-1){
  92. newArray.push(newsStr);
  93. }
  94. }
  95. newsData = newArray;
  96. newsList(newsData);
  97. }
  98. })
  99. layer.close(index);
  100. },2000);
  101. }else{
  102. layer.msg("请输入需要查询的内容");
  103. }
  104. })
  105. //添加文章
  106. $(".newsAdd_btn").click(function(){
  107. var index = layui.layer.open({
  108. title : "添加文章",
  109. type : 2,
  110. content : "newsAdd.html",
  111. success : function(layero, index){
  112. layui.layer.tips('点击此处返回文章列表', '.layui-layer-setwin .layui-layer-close', {
  113. tips: 3
  114. });
  115. }
  116. })
  117. //改变窗口大小时,重置弹窗的高度,防止超出可视区域(如F12调出debug的操作)
  118. $(window).resize(function(){
  119. layui.layer.full(index);
  120. })
  121. layui.layer.full(index);
  122. })
  123. //推荐文章
  124. $(".recommend").click(function(){
  125. var $checkbox = $(".news_list").find('tbody input[type="checkbox"]:not([name="show"])');
  126. if($checkbox.is(":checked")){
  127. var index = layer.msg('推荐中,请稍候',{icon: 16,time:false,shade:0.8});
  128. setTimeout(function(){
  129. layer.close(index);
  130. layer.msg("推荐成功");
  131. },2000);
  132. }else{
  133. layer.msg("请选择需要推荐的文章");
  134. }
  135. })
  136. //审核文章
  137. $(".audit_btn").click(function(){
  138. var $checkbox = $('.news_list tbody input[type="checkbox"][name="checked"]');
  139. var $checked = $('.news_list tbody input[type="checkbox"][name="checked"]:checked');
  140. if($checkbox.is(":checked")){
  141. var index = layer.msg('审核中,请稍候',{icon: 16,time:false,shade:0.8});
  142. setTimeout(function(){
  143. for(var j=0;j<$checked.length;j++){
  144. for(var i=0;i<newsData.length;i++){
  145. if(newsData[i].newsId == $checked.eq(j).parents("tr").find(".news_del").attr("data-id")){
  146. //修改列表中的文字
  147. $checked.eq(j).parents("tr").find("td:eq(3)").text("审核通过").removeAttr("style");
  148. //将选中状态删除
  149. $checked.eq(j).parents("tr").find('input[type="checkbox"][name="checked"]').prop("checked",false);
  150. form.render();
  151. }
  152. }
  153. }
  154. layer.close(index);
  155. layer.msg("审核成功");
  156. },2000);
  157. }else{
  158. layer.msg("请选择需要审核的文章");
  159. }
  160. })
  161. //批量删除
  162. $(".batchDel").click(function(){
  163. var $checkbox = $('.news_list tbody input[type="checkbox"][name="checked"]');
  164. var $checked = $('.news_list tbody input[type="checkbox"][name="checked"]:checked');
  165. if($checkbox.is(":checked")){
  166. layer.confirm('确定删除选中的信息?',{icon:3, title:'提示信息'},function(index){
  167. var index = layer.msg('删除中,请稍候',{icon: 16,time:false,shade:0.8});
  168. setTimeout(function(){
  169. //删除数据
  170. for(var j=0;j<$checked.length;j++){
  171. for(var i=0;i<newsData.length;i++){
  172. if(newsData[i].newsId == $checked.eq(j).parents("tr").find(".news_del").attr("data-id")){
  173. newsData.splice(i,1);
  174. newsList(newsData);
  175. }
  176. }
  177. }
  178. $('.news_list thead input[type="checkbox"]').prop("checked",false);
  179. form.render();
  180. layer.close(index);
  181. layer.msg("删除成功");
  182. },2000);
  183. })
  184. }else{
  185. layer.msg("请选择需要删除的文章");
  186. }
  187. })
  188. //全选
  189. form.on('checkbox(allChoose)', function(data){
  190. var child = $(data.elem).parents('table').find('tbody input[type="checkbox"]:not([name="show"])');
  191. child.each(function(index, item){
  192. item.checked = data.elem.checked;
  193. });
  194. form.render('checkbox');
  195. });
  196. //通过判断文章是否全部选中来确定全选按钮是否选中
  197. form.on("checkbox(choose)",function(data){
  198. var child = $(data.elem).parents('table').find('tbody input[type="checkbox"]:not([name="show"])');
  199. var childChecked = $(data.elem).parents('table').find('tbody input[type="checkbox"]:not([name="show"]):checked')
  200. if(childChecked.length == child.length){
  201. $(data.elem).parents('table').find('thead input#allChoose').get(0).checked = true;
  202. }else{
  203. $(data.elem).parents('table').find('thead input#allChoose').get(0).checked = false;
  204. }
  205. form.render('checkbox');
  206. })
  207. //是否展示
  208. form.on('switch(isShow)', function(data){
  209. var index = layer.msg('修改中,请稍候',{icon: 16,time:false,shade:0.8});
  210. setTimeout(function(){
  211. layer.close(index);
  212. layer.msg("展示状态修改成功!");
  213. },2000);
  214. })
  215. //操作
  216. $("body").on("click",".news_edit",function(){ //编辑
  217. layer.alert('您点击了文章编辑按钮,由于是纯静态页面,所以暂时不存在编辑内容,后期会添加,敬请谅解。。。',{icon:6, title:'文章编辑'});
  218. })
  219. $("body").on("click",".news_collect",function(){ //收藏.
  220. if($(this).text().indexOf("已收藏") > 0){
  221. layer.msg("取消收藏成功!");
  222. $(this).html("<i class='layui-icon'>&#xe600;</i> 收藏");
  223. }else{
  224. layer.msg("收藏成功!");
  225. $(this).html("<i class='iconfont icon-star'></i> 已收藏");
  226. }
  227. })
  228. $("body").on("click",".news_del",function(){ //删除
  229. var _this = $(this);
  230. layer.confirm('确定删除此信息?',{icon:3, title:'提示信息'},function(index){
  231. //_this.parents("tr").remove();
  232. for(var i=0;i<newsData.length;i++){
  233. if(newsData[i].newsId == _this.attr("data-id")){
  234. newsData.splice(i,1);
  235. newsList(newsData);
  236. }
  237. }
  238. layer.close(index);
  239. });
  240. })
  241. function newsList(that){
  242. //渲染数据
  243. function renderDate(data,curr){
  244. var dataHtml = '';
  245. if(!that){
  246. currData = newsData.concat().splice(curr*nums-nums, nums);
  247. }else{
  248. currData = that.concat().splice(curr*nums-nums, nums);
  249. }
  250. if(currData.length != 0){
  251. for(var i=0;i<currData.length;i++){
  252. dataHtml += '<tr>'
  253. +'<td><input type="checkbox" name="checked" lay-skin="primary" lay-filter="choose"></td>'
  254. +'<td align="left">'+currData[i].newsName+'</td>'
  255. +'<td>'+currData[i].newsAuthor+'</td>';
  256. if(currData[i].newsStatus == "待审核"){
  257. dataHtml += '<td style="color:#f00">'+currData[i].newsStatus+'</td>';
  258. }else{
  259. dataHtml += '<td>'+currData[i].newsStatus+'</td>';
  260. }
  261. dataHtml += '<td>'+currData[i].newsLook+'</td>'
  262. +'<td><input type="checkbox" name="show" lay-skin="switch" lay-text="是|否" lay-filter="isShow"'+currData[i].isShow+'></td>'
  263. +'<td>'+currData[i].newsTime+'</td>'
  264. +'<td>'
  265. + '<a class="layui-btn layui-btn-mini news_edit"><i class="iconfont icon-edit"></i> 编辑</a>'
  266. + '<a class="layui-btn layui-btn-normal layui-btn-mini news_collect"><i class="layui-icon">&#xe600;</i> 收藏</a>'
  267. + '<a class="layui-btn layui-btn-danger layui-btn-mini news_del" data-id="'+data[i].newsId+'"><i class="layui-icon">&#xe640;</i> 删除</a>'
  268. +'</td>'
  269. +'</tr>';
  270. }
  271. }else{
  272. dataHtml = '<tr><td colspan="8">暂无数据</td></tr>';
  273. }
  274. return dataHtml;
  275. }
  276. //分页
  277. var nums = 13; //每页出现的数据量
  278. if(that){
  279. newsData = that;
  280. }
  281. laypage({
  282. cont : "page",
  283. pages : Math.ceil(newsData.length/nums),
  284. jump : function(obj){
  285. $(".news_content").html(renderDate(newsData,obj.curr));
  286. $('.news_list thead input[type="checkbox"]').prop("checked",false);
  287. form.render();
  288. }
  289. })
  290. }
  291. })