details.vue 2.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123
  1. <template>
  2. <view class="page">
  3. <view class="message dis f-c" v-for="(item,index) in dataList" :key="index">
  4. <view class="time dis j-c a-c">{{item.createTime}}</view>
  5. <view class="content dis f-c">
  6. <view class="dis f-c j-s" style="border-bottom: 1px solid #f2f2f2;padding-bottom: 6px;">
  7. <text>消息编号:{{item.id}}</text>
  8. </view>
  9. <view class="dis f-c j-s" style="border-bottom: 1px solid #f2f2f2;padding: 10px 0;">
  10. <text> <text style="color: rgba(35,40,50,0.6);">消息内容:</text>
  11. {{item.content}}</text>
  12. </view>
  13. <view class="details">
  14. <u-section title="查看详情" sub-title="" :show-line="false"></u-section>
  15. </view>
  16. </view>
  17. </view>
  18. <u-loadmore v-if="dataList.length>0" :status="status" />
  19. </view>
  20. </template>
  21. <script>
  22. export default {
  23. data() {
  24. return {
  25. msgType: "",
  26. dataList: [],
  27. pageRequest: {
  28. pageNum: 1,
  29. pageSize: 20,
  30. },
  31. status: 'loadmore',
  32. pages: 0, //订单总页数
  33. }
  34. },
  35. onShow() {
  36. },
  37. onReachBottom() {
  38. if (this.pageRequest.pageNum >= this.pages) return;
  39. this.status = 'loading';
  40. this.pageRequest.pageNum = ++this.pageRequest.pageNum;
  41. setTimeout(async () => {
  42. let res = await this.$http.post('/api/message/getUserMessageList', {
  43. msgType: this.msgType,
  44. ...this.pageRequest
  45. });
  46. if (res.code == '200') {
  47. this.pageResult = [...this.pageResult, ...res.data.records];
  48. }
  49. if (this.pageRequest.pageNum >= this.pages) this.status = 'nomore';
  50. else this.status = 'loading';
  51. }, 1000)
  52. },
  53. onPullDownRefresh() {
  54. // 执行刷新逻辑
  55. this.list(1, 20);
  56. },
  57. onLoad(params) {
  58. if (params.msgType) {
  59. this.msgType = params.msgType;
  60. this.list(1, 20);
  61. }
  62. },
  63. methods: {
  64. async list(page, size) {
  65. this.pageRequest.pageNum = page;
  66. this.pageRequest.pageSize = size;
  67. let res = await this.$http.post('/api/message/getUserMessageList', {
  68. msgType: this.msgType,
  69. ...this.pageRequest
  70. });
  71. if (res.code == '200') {
  72. this.dataList = res.data.records;
  73. this.pages = res.data.pages;
  74. uni.stopPullDownRefresh();
  75. }
  76. }
  77. }
  78. }
  79. </script>
  80. <style lang="scss" scoped>
  81. .page {
  82. padding: 16px;
  83. background: #F8FAFE;
  84. }
  85. .message {
  86. width: 100%;
  87. cursor: pointer;
  88. .time {
  89. width: 100%;
  90. font-size: 14px;
  91. color: rgba(35, 40, 50, 0.6);
  92. }
  93. .content {
  94. width: 100%;
  95. background: #FFFFFF;
  96. box-shadow: 0px 4px 10px 0px #DAE3F4;
  97. border-radius: 6px;
  98. margin: 15px 0;
  99. padding: 6px 16px 16px 16px;
  100. >view:nth-child(1) {
  101. color: #232832;
  102. font-size: 14px;
  103. font-weight: bold;
  104. }
  105. >view:nth-child(2) {
  106. color: #232832;
  107. font-size: 14px;
  108. }
  109. }
  110. .details {
  111. padding-top: 16px;
  112. }
  113. }
  114. </style>