index.vue 2.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137
  1. <template>
  2. <view class="notice">
  3. <view class="tz_item" v-for="(item, index) in list" :key="index" @click="detail(item)">
  4. <view class="ctop">
  5. <text class="icon tb">&#xe734;</text>
  6. <text class="tag">通知公告</text>
  7. <view class="clear"></view>
  8. </view>
  9. <view class="content">
  10. <view class="title omit">{{ item.title }}</view>
  11. </view>
  12. <view class="time">{{ item.createTime }}</view>
  13. <view class="clear"></view>
  14. </view>
  15. <view class="loading" v-if="loadMore"><u-loadmore :status="loadMore ? 'loading' : 'nomore'" /></view>
  16. <u-empty v-if="!loadMore && list.length == 0"></u-empty>
  17. </view>
  18. </template>
  19. <script>
  20. export default {
  21. data() {
  22. return {
  23. list: [],
  24. param: { pageNum: 1, pageSize: 10, orderByColumn: 'createTime', isAsc: 'desc' },
  25. loadMore: true
  26. };
  27. },
  28. onLoad(e) {
  29. this.getData();
  30. },
  31. methods: {
  32. getData() {
  33. this.http.request({
  34. url: '/app/user/company/list',
  35. data: this.param,
  36. loading: 'false',
  37. success: (res) => {
  38. this.loadMore = res.data.pages > this.param.pageNum ? true : false;
  39. res.data.rows.forEach((item) => {
  40. item.createTime = uni.$u.timeFrom(Date.parse(item.createTime));
  41. this.list.push(item);
  42. });
  43. }
  44. });
  45. },
  46. detail(item) {
  47. uni.navigateTo({
  48. url: '/pages/notice/detail?id=' + item.id
  49. });
  50. },
  51. //刷新数据
  52. refresh() {
  53. this.loadMore = true;
  54. this.param.pageNum = 1;
  55. this.list = [];
  56. this.getData();
  57. }
  58. },
  59. //下拉刷新
  60. onPullDownRefresh() {
  61. setTimeout(() => {
  62. this.refresh();
  63. uni.stopPullDownRefresh();
  64. }, 1000);
  65. },
  66. //上拉加载
  67. onReachBottom() {
  68. if (this.loadMore) {
  69. this.param.pageNum++;
  70. this.getData();
  71. }
  72. }
  73. };
  74. </script>
  75. <style lang="scss">
  76. page {
  77. background-color: white;
  78. }
  79. .notice {
  80. background-color: white;
  81. .tz_item {
  82. padding: 7px 15px 15px 15px;
  83. color: $font-c;
  84. margin-bottom: 10px;
  85. border-bottom: 1px solid #f0f2f7;
  86. cursor: pointer;
  87. .ctop {
  88. position: relative;
  89. .bage {
  90. position: absolute;
  91. width: 8px;
  92. height: 8px;
  93. left: 23px;
  94. top: 0px;
  95. border: 1px solid white;
  96. border-radius: 50%;
  97. background-color: red;
  98. }
  99. .tb {
  100. width: 30px;
  101. height: 30px;
  102. line-height: 28px;
  103. text-align: center;
  104. border-radius: 50%;
  105. font-size: 20px;
  106. margin-right: 5px;
  107. float: left;
  108. background-color: #4581fb;
  109. color: white;
  110. }
  111. .tag {
  112. float: left;
  113. font-size: 14px;
  114. font-weight: bold;
  115. margin-top: 4px;
  116. margin-left: 5px;
  117. }
  118. }
  119. .content {
  120. float: left;
  121. width: 75%;
  122. margin-top: 10px;
  123. color: #717171;
  124. .title {
  125. font-size: 14px;
  126. }
  127. }
  128. .time {
  129. font-size: 14px;
  130. padding: 10px 0px 0px 0px;
  131. float: right;
  132. }
  133. }
  134. }
  135. </style>