comment.vue 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134
  1. <template>
  2. <view class="flex-common-css bgc-f">
  3. <Nav :title="navTitle" titleColor="#333" bgckgroundBox='#fff'></Nav>
  4. <scroll-view :scroll-y="true" class="scroll-view-css" @scrolltolower="scrolltolower">
  5. <view class="content-box box-border-box">
  6. <view class="item-box display-flex mb-26" v-for="(item,index) in listData" @click="toDet(item)">
  7. <image class="item-img mr-16 flex-shrink0" :src="item.head_img" mode="aspectFill"></image>
  8. <view class="item-right flex-justify-space">
  9. <view class="common-view-css mr-46">
  10. <view class="mb-4 fc-3 fs-28">
  11. {{item.nickname}}
  12. </view>
  13. <view class="fs-24 fc-9 mb-16">
  14. {{item.created_date}}
  15. </view>
  16. <view class="fs-30 fc-3">
  17. {{item.msg}}
  18. </view>
  19. </view>
  20. <image class="right-img" :src="item.image[0]" mode="aspectFill"></image>
  21. </view>
  22. </view>
  23. </view>
  24. <view v-if="listData.length === 0" class="scroll-view-css">
  25. <EnBlank :customSrc='true'>
  26. <template v-slot:blankImg>
  27. <image class="black-custom-img" src="@/static/img/common/no-order.png" mode=""></image>
  28. </template>
  29. </EnBlank>
  30. </view>
  31. </scroll-view>
  32. </view>
  33. </template>
  34. <script>
  35. import EnBlank from "@/components/en-utils/en-blank/en-blank";
  36. import {
  37. messageList
  38. } from "@/api/message.js"
  39. import {
  40. alumnInfo,
  41. } from '@/api/alumni.js';
  42. import tools from "@/service/tools";
  43. export default {
  44. components: {
  45. EnBlank
  46. },
  47. data() {
  48. return {
  49. navTitle: '',
  50. listData: [],
  51. page: 1,
  52. total: 0,
  53. dataType: ''
  54. };
  55. },
  56. onLoad(data) {
  57. if (data) {
  58. this.dataType = data.type
  59. this.messageList(data.type)
  60. if (data.type == 1) {
  61. this.navTitle = '系统消息'
  62. } else if (data.type == 2) {
  63. this.navTitle = '评论'
  64. } else {
  65. this.navTitle = '点赞'
  66. }
  67. }
  68. },
  69. mounted() {},
  70. methods: {
  71. toDet(item) {
  72. if (item.news_id > 0) {
  73. alumnInfo({
  74. news_id: item.news_id
  75. }).then((res) => {
  76. if (res.code === 1) {
  77. uni.navigateTo({
  78. url: "/pages-school/circle-info?news_id=" + item.news_id
  79. })
  80. } else {
  81. tools.error(res.msg)
  82. this.page = 1
  83. this.listData = []
  84. this.messageList(this.dataType);
  85. }
  86. })
  87. }
  88. },
  89. scrolltolower() {
  90. if (this.listData.length < this.total) {
  91. this.page += 1;
  92. this.messageList(this.dataType);
  93. }
  94. },
  95. messageList(type) {
  96. messageList({
  97. type: type,
  98. page: this.page
  99. }).then((res) => {
  100. if (res.code == 1) {
  101. if (res.data.items.length > 0) {
  102. this.listData.push(...res.data.items)
  103. this.total = res.data.total;
  104. }
  105. }
  106. })
  107. }
  108. },
  109. }
  110. </script>
  111. <style lang="scss" scoped>
  112. .content-box {
  113. padding: 24rpx 24rpx 0;
  114. }
  115. .item-img {
  116. width: 80rpx;
  117. height: 80rpx;
  118. }
  119. .item-right {
  120. width: 100%;
  121. padding: 0 0 24rpx 0;
  122. border-bottom: 2rpx solid #F9F9F9;
  123. }
  124. .right-img {
  125. width: 140rpx;
  126. height: 140rpx;
  127. border-radius: 12rpx;
  128. }
  129. </style>