newslist.blade.php 3.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title>文章教程-帮助中心-星优办公软件</title>
  5. @include('home.http.common.head')
  6. <link href="/static/css/jquery.page.css" rel="stylesheet" type="text/css">
  7. <script src="/static/js/jquery.js"></script>
  8. <script src="/static/js/jquery.page.js"></script>
  9. </head>
  10. <body>
  11. <div class="header">
  12. @include('home.http.common.header')
  13. </div>
  14. <div style="height: 68px;"></div>
  15. <div id="app">
  16. <!--- 解决方案 --->
  17. <div class="index-about" style="padding-top: 40px;">
  18. <div class="width-1200">
  19. <div class="flex-start">
  20. <div class="about-list">
  21. @foreach ($list as $item)
  22. <div class="about-item">
  23. <div class="i-time">
  24. <a href="{{ url('/news/detail/' . $item->mid) }}">
  25. @if ($item->logo)
  26. <img src="{{ $item->logo }}" class="new-img" />
  27. @else
  28. <img src="/static/images/about-img2.jpg" class="new-img" />
  29. @endif
  30. </a>
  31. </div>
  32. <div class="i-content">
  33. <a href="{{ url('/news/detail/' . $item->mid) }}">
  34. <p class="i-title overflow">{{ $item->title }}</p>
  35. <p class="i-desc more-overflow">{{ $item->introduction }}</p>
  36. </a>
  37. </div>
  38. </div>
  39. @endforeach
  40. <div id="page"></div>
  41. </div>
  42. <div class="about-detail">
  43. <div class="about-area">
  44. <div class="about-title">文章分类</div>
  45. @foreach ($category as $item)
  46. @if($item->id < 17)
  47. <div class="news-item">
  48. <a href="{{ url('/news/category/' . $item->mid . '?page=1') }}"
  49. target="_blank">{{ $item->name }}</a>
  50. </div>
  51. @endif
  52. @endforeach
  53. </div>
  54. </div>
  55. </div>
  56. </div>
  57. </div>
  58. @include('home.http.common.footer')
  59. </div>
  60. </body>
  61. <script>
  62. let total = Number ({{ $total }});
  63. let totalPage = Math.ceil(total / 15);
  64. let currentUrl = window.location.href;
  65. let url = new URL(currentUrl);
  66. let currentPage = url.searchParams.get("page") ?? 1;
  67. setTimeout(function() {
  68. $("#page").Page({
  69. totalPages: totalPage, //total Pages
  70. liNums: 10, //the li numbers(advice use odd)
  71. activeClass: 'activP', //active class style
  72. firstPage: '首', //first button name
  73. lastPage: '末', //last button name
  74. prv: '<', //prev button name
  75. next: '>', //next button name
  76. hasFirstPage: true, //whether has first button
  77. hasLastPage: true, //whether has last button
  78. hasPrv: true, //whether has prev button
  79. hasNext: true, //whether has next button
  80. callBack: function(_page) {
  81. url.searchParams.set('page', _page);
  82. window.location.href = url.href;
  83. }
  84. });
  85. $('.pagingUl li a').each((index, item) => {
  86. $(item).removeClass('activP');
  87. let num = $(item).text();
  88. if(num == currentPage){
  89. $(item).addClass('activP');
  90. }
  91. })
  92. }, 100)
  93. </script>
  94. </html>