list.vue 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136
  1. <template>
  2. <view>
  3. <scroll-list ref="list" :option="option" @load="load" @refresh="refresh" @loadSuccess="loadSuccess"
  4. @scrolltolower="scrolltolower">
  5. <view v-for="(item, index) in list" :key="index" @click="handleTest(item)">
  6. <view class="infoBody">
  7. <view>
  8. <view style="border-bottom: 1px #b8b8b8 solid;">
  9. <uni-row class="demo-uni-row">
  10. <uni-col :span="20">
  11. <view class="demo-uni-col dark"
  12. style="font-size: 36rpx;margin: -20rpx 0 0 0;font-weight: bold;letter-spacing:5rpx;">
  13. {{item.title}}
  14. </view>
  15. </uni-col>
  16. </uni-row>
  17. </view>
  18. <uni-row class="demo-uni-row">
  19. <uni-col>
  20. <view class="demo-uni-col light" style="padding: 26rpx;color: #b1b1b1;">
  21. {{item.reason}}
  22. </view>
  23. </uni-col>
  24. </uni-row>
  25. <uni-row class="demo-uni-row">
  26. <uni-col :span="5">
  27. <view class="demo-uni-col light" style="color: #727272;">
  28. 申请人:
  29. </view>
  30. </uni-col>
  31. <uni-col :span="7">
  32. <view class="demo-uni-col light" style="color: #727272;">
  33. {{item.applyUserName}}
  34. </view>
  35. </uni-col>
  36. <uni-col :span="13">
  37. <view class="demo-uni-col light" style="color: #727272;">
  38. {{item.createTime}}
  39. </view>
  40. </uni-col>
  41. </uni-row>
  42. </view>
  43. <view></view>
  44. </view>
  45. </view>
  46. </scroll-list>
  47. </view>
  48. </template>
  49. <style lang="scss" scoped>
  50. // page {
  51. // background-color: #f3f3f3;
  52. // }
  53. .page-wrap {}
  54. .infoBody {
  55. background-color: #ffffff;
  56. padding: 40rpx;
  57. border-radius: 20rpx;
  58. margin: 20rpx;
  59. box-shadow: 0px 2px 10px #cccccc;
  60. }
  61. </style>
  62. <script>
  63. export default {
  64. data() {
  65. return {
  66. option: {
  67. page: 1,
  68. size: 5,
  69. auto: true
  70. },
  71. page: 1,
  72. list: [],
  73. total: 0
  74. }
  75. },
  76. onLoad() {},
  77. onShow() {
  78. this.refresh({
  79. page: 1,
  80. size: 5
  81. })
  82. },
  83. methods: {
  84. handleTest(item) {
  85. item.pageType = 4
  86. uni.setStorageSync("approval", item)
  87. this.$goto('../ge/geApproval')
  88. },
  89. async taskList(paging) {
  90. // 发送请求
  91. const {
  92. data: res
  93. } = await this.$httpRequest({
  94. url: '/app/leaveList?pageNum=' + paging.page + '&pageSize=' + paging.size,
  95. method: 'get'
  96. });
  97. if (res.code === 200) {
  98. setTimeout(() => {
  99. if (paging.page === 1) {
  100. this.total = res.total
  101. this.$refs.list.loadSuccess({
  102. list: res.rows,
  103. total: this.total
  104. });
  105. } else if (paging.page > 1) {
  106. for (var i = 0; i < res.rows.length; i++) {
  107. this.list.push(res.rows[i])
  108. }
  109. this.$refs.list.loadSuccess({
  110. list: this.list,
  111. total: this.total
  112. });
  113. }
  114. }, 300)
  115. }
  116. },
  117. // 刷新刷剧
  118. refresh(paging) {
  119. this.taskList(paging)
  120. },
  121. scrolltolower(e) {
  122. console.log(e)
  123. },
  124. load(paging) {
  125. console.log(2, paging)
  126. this.taskList(paging)
  127. },
  128. loadSuccess(list) {
  129. console.log(3, list)
  130. this.list = list
  131. }
  132. }
  133. }
  134. </script>