policy.html 4.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136
  1. <!DOCTYPE html>
  2. <html lang="zh">
  3. <head>
  4. <meta charset="utf-8" />
  5. <meta http-equv="X-UA-Compatible" content="IE=edge" />
  6. <meta name="viewport" content="width=device-width, initial-scale=1" />
  7. <meta name="format-detection" content="telephone=no" />
  8. <title>潜山市党建引领信用村(社区)建设</title>
  9. <meta name="keywords" content="潜山市党建引领信用村(社区)建设">
  10. <meta name="description" content="潜山市党建引领信用村(社区)建设">
  11. <script src="static/js/vue.js"></script>
  12. <script type="text/javascript" src="static/js/vue-router.js"></script>
  13. <script src="static/js/index.js" type="text/javascript"></script>
  14. <script type="text/javascript" src="./static/js/jquery.min.js"></script>
  15. <script src="static/js/common.js"></script>
  16. <link href="static/css/common.css" rel="stylesheet" />
  17. <link href="static/css/style.css" rel="stylesheet" />
  18. <link rel="stylesheet" href="static/css/theme-chalk/index.css">
  19. <style></style>
  20. </head>
  21. <body class="qpolicy" id="qpolicy">
  22. <div id="appse">
  23. <header>
  24. <div class="quset">
  25. <div class="qusetimg"><img src="static/images/back.png" class="backimg" /></div>
  26. 政策指南
  27. </div>
  28. </header>
  29. </div>
  30. <div id="app" style="padding: 0;padding-top: 1rem;">
  31. <main>
  32. <div class="policy" v-if="policylist.length">
  33. <div class="policylist" v-for="(item,index) in policylist" @click="getDetail(item.policyId)">
  34. <div class="ovone f28 c2 mb2 fw">{{item.policyTitle}}</div>
  35. <p class="overtwo f24 ca mb2" v-html='item.policyContent'></p>
  36. <div class="f2 c6">{{item.createTime}}</div>
  37. </div>
  38. <div v-if="finished" class="poloding">暂无更多数据</div>
  39. </div>
  40. <!-- 暂无记录 -->
  41. <div v-else class="nobox">
  42. <img src="static/images/nico.png" class="noimg"/>
  43. </div>
  44. </main>
  45. </div>
  46. <script type="text/javascript">
  47. var app = new Vue({
  48. el: '#app',
  49. data: {
  50. policylist: [],
  51. base_url: 'http://118.31.23.65:5007/prod-api',
  52. pageNum: 1,
  53. pageSize: 10,
  54. finished: false,
  55. loading:false
  56. },
  57. created() {
  58. this.getDataFn()
  59. },
  60. mounted() {
  61. window.addEventListener("scroll", this.hanldeScroll, true);
  62. },
  63. destroyed(){
  64. console.log(7)
  65. window.removeEventListener("scroll", this.hanldeScroll, false);
  66. },
  67. methods: {
  68. getDataFn() {
  69. var that = this;
  70. var params = {
  71. pageNum: this.pageNum,
  72. pageSize: this.pageSize
  73. }
  74. $.ajax({
  75. url: this.base_url + '/system/h5/guideList',
  76. type: 'get',
  77. data: params,
  78. dataType: 'json',
  79. success: function(res) {
  80. if (res.code == 200) {
  81. that.loading=false;
  82. var pages=(that.pageNum-1)*that.pageSize+res.rows.length
  83. if (that.pageNum == 1) {
  84. that.policylist = res.rows || [];
  85. if(res.total==pages){
  86. that.finished=true
  87. }
  88. } else {
  89. that.policylist = that.policylist.concat(res.rows)
  90. if(res.total==pages){
  91. that.finished=true
  92. }
  93. }
  94. } else {
  95. that.$message({
  96. message: res.msg,
  97. type: 'error',
  98. center: true,
  99. });
  100. }
  101. }
  102. })
  103. },
  104. hanldeScroll(e) {
  105. var that=this;
  106. let scrollTargetBox = document.querySelector('.qpolicy');
  107. var scrollHeight = scrollTargetBox.scrollHeight; //204
  108. var scrollTop = document.documentElement.scrollTop; //0-18
  109. var clientHeight = document.documentElement.clientHeight; //172
  110. var scrbottom=scrollHeight - clientHeight - scrollTop
  111. if(scrbottom <20 && !that.finished && !that.loading ){
  112. that.loading=true
  113. that.pageNum = that.pageNum + 1;
  114. that.getDataFn();
  115. }
  116. },
  117. getDetail(e) {
  118. window.location.href = 'policydetail.html?id=' + e
  119. }
  120. }
  121. })
  122. </script>
  123. <script type="text/javascript">
  124. $(document).ready(function() {
  125. $('.backimg').click(function() {
  126. window.history.go(-1)
  127. })
  128. })
  129. </script>
  130. </body>
  131. </html>