mycomment.vue 3.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193
  1. <template>
  2. <view class="my-comment">
  3. <navbar ref="navbar" :config="config"></navbar>
  4. <view class="top">
  5. <view class="green">
  6. </view>
  7. <view class="comment">
  8. 评论({{number}})
  9. <text>只显示已通过审核的评论</text>
  10. </view>
  11. </view>
  12. <view class="middle">
  13. <view v-if="myComment.length>=0">
  14. <view class="item" v-for="(item,index) in myComment" :key="index" @click="goItem(item)">
  15. <view class="time">
  16. {{item.create_time}}
  17. </view>
  18. <view class="title">
  19. {{item.title}}
  20. </view>
  21. <view class="comment">
  22. 评论:<text>{{item.content}}</text>
  23. </view>
  24. </view>
  25. <loadMore v-if="myComment.length>0" :status="status" ></loadMore>
  26. </view>
  27. <nodata v-else :config="{top:20,content:'暂无评论~'}"></nodata>
  28. </view>
  29. </view>
  30. </template>
  31. <script>
  32. import {userList,myStatistics} from "@/api/userInfo.js"
  33. export default{
  34. data(){
  35. return{
  36. config: {
  37. back: true, //false是tolbar页面 是则不写
  38. title: '我的评论',
  39. color: '#1A1A1A',
  40. //背景颜色;参数一:透明度(0-1);参数二:背景颜色(array则为线性渐变,string为单色背景)
  41. backgroundColor: [1, "#FFFFFF"],
  42. statusBarFontColor: '#1A1A1A',
  43. },
  44. myComment:[] ,//我的评论
  45. status:"more",
  46. number:null,
  47. params:{
  48. page:1,
  49. limit:10,
  50. },
  51. }
  52. },
  53. onLoad(options) {
  54. this.params.userId = options.user_id
  55. this.getList()
  56. },
  57. //下拉刷新
  58. onPullDownRefresh() {
  59. this.params.page=1
  60. this.myComment = []
  61. this.getList()
  62. },
  63. //上拉加载
  64. onReachBottom() {
  65. if(this.status=="more"){
  66. this.params.page++
  67. this.getList()
  68. }
  69. },
  70. methods:{
  71. //跳转评论
  72. goItem(item){
  73. console.log(item,item.model_type)
  74. //作品
  75. if(item.model_type==0){
  76. let id = item.model_id
  77. console.log(id)
  78. uni.navigateTo({
  79. url:"../recommend/details?id="+id
  80. })
  81. //文章
  82. }else if(item.model_type==1){
  83. let id = item.model_id
  84. uni.navigateTo({
  85. url:"../business/article?id="+id
  86. })
  87. //服务
  88. }else if(item.model_type==2){
  89. let id = item.model_id
  90. uni.navigateTo({
  91. url:"../../product/goods/goods?id="+id
  92. })
  93. }else if(item.model_type==3){
  94. let id = item.model_id
  95. uni.navigateTo({
  96. url:"../../product/goods/serviceGood?id="+id
  97. })
  98. }
  99. },
  100. //获取数据
  101. getList(){
  102. this.$http.get(userList,this.params).then(res=>{
  103. if(res&&res.code==200){
  104. uni.stopPullDownRefresh()
  105. this.number = res.page.totalCount
  106. this.myComment= this.myComment.concat(res.page.list)
  107. if(res.page.totalPage <= res.page.currPage){
  108. this.status = "noMore";
  109. }else{
  110. this.status = "more"
  111. }
  112. }
  113. })
  114. },
  115. }
  116. }
  117. </script>
  118. <style lang="scss" scoped>
  119. .top{
  120. padding: 30rpx 30rpx 20rpx 30rpx;
  121. display: flex;
  122. align-items: center;
  123. .green{
  124. width: 6rpx;
  125. height: 30rpx;
  126. background-color: #0B844A;
  127. border-radius: 2rpx;
  128. }
  129. .comment{
  130. margin-left: 10rpx;
  131. font-size: 30rpx;
  132. font-weight: Bold;
  133. color: #060606;
  134. line-height: 36rpx;
  135. text{
  136. margin-left: 10rpx;
  137. font-size: 24rpx;
  138. font-weight: Medium;
  139. color: #999999;
  140. }
  141. }
  142. }
  143. .my-comment{
  144. background-color: #F5F5F5;
  145. padding-top: 10rpx;
  146. }
  147. .middle{
  148. background-color: #ffffff;
  149. border-radius: 40rpx 40rpx 0 0;
  150. .item{
  151. padding: 40rpx 0rpx 44rpx 0rpx;
  152. margin: 0 50rpx;
  153. border-bottom: 1rpx solid #E6E6E6;
  154. .time{
  155. font-size: 30rpx;
  156. font-weight: Medium;
  157. color: #999999;
  158. }
  159. .title{
  160. margin-top: 10rpx;
  161. font-size: 32rpx;
  162. font-weight: Bold;
  163. color: #1A1A1A;
  164. line-height: 44rpx;
  165. }
  166. .comment{
  167. margin-top: 16rpx;
  168. font-size: 24rpx;
  169. font-weight: Bold;
  170. line-height: 38rpx;
  171. color: #1A1A1A;
  172. text{
  173. font-weight: Medium;
  174. color: #999999;
  175. }
  176. }
  177. }
  178. }
  179. </style>