slide-item.vue 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990
  1. <template>
  2. <view class="slide-box">
  3. <tantan ref="jmList" @onChange="getDiscoverList" @onClickImage="clickImage"></tantan>
  4. </view>
  5. </template>
  6. <script>
  7. import tantan from '@/components/dgex-tantan/dgex-tantan.vue'
  8. import {getDiscoverList} from "@/api/discovery";
  9. import tools from "@/service/tools";
  10. export default {
  11. name: "slide-item",
  12. components: {
  13. tantan
  14. },
  15. props: {},
  16. data() {
  17. return {
  18. page:1,
  19. total:undefined,
  20. isAjax:false,
  21. list:[],
  22. }
  23. },
  24. watch: {},
  25. mounted() {
  26. this.getDiscoverList()
  27. },
  28. methods: {
  29. getDiscoverList(){
  30. if(this.isAjax){
  31. return
  32. }
  33. this.isAjax=true
  34. getDiscoverList({'count':10}).then((res)=>{
  35. this.isAjax=false
  36. if(res.code===0){
  37. this.list=res
  38. let arr=[]
  39. res.data.forEach((item)=>{
  40. let galleryUrls=item.galleryUrls
  41. let age=tools.getAge(item.dateOfBirth)
  42. if(galleryUrls.length>0){
  43. if(galleryUrls.length>8){
  44. galleryUrls=galleryUrls.slice(0,7)
  45. }
  46. let newdata = {
  47. image: galleryUrls[0],
  48. images: galleryUrls,
  49. imgIndex:0,
  50. title: item.nickname,
  51. userId: item.userId,
  52. age: age,
  53. online: item.online,
  54. longitude: item.longitude,
  55. latitude: item.latitude,
  56. distance: 17,
  57. city: item.province+' '+item.city,
  58. weChat: item.wechatId,
  59. likeCount: item.likeCount,
  60. tagList: item.tagList,
  61. slogan: item.slogan,
  62. animation:{}
  63. }
  64. console.log(newdata)
  65. arr.push(newdata)
  66. }
  67. })
  68. this.$refs.jmList.setData(arr)
  69. }
  70. })
  71. },
  72. clickImage(data) {
  73. console.log(data);
  74. }
  75. }
  76. }
  77. </script>
  78. <style scoped lang="scss">
  79. .slide-box{
  80. margin-top: 10rpx;
  81. box-sizing: border-box;
  82. }
  83. </style>