slide-item.vue 3.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125
  1. <template>
  2. <view class="slide-box">
  3. <tantan ref="jmList" @onChange="change" @onClickImage="clickImage"></tantan>
  4. </view>
  5. </template>
  6. <script>
  7. import tantan from '@/components/dgex-tantan/dgex-tantan.vue'
  8. import {getDiscoverList, getMoments} 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.change({'currentIndex':1})
  27. this.getDiscoverList()
  28. this.getMoments()
  29. },
  30. methods: {
  31. getMoments(){
  32. getMoments({'pageNo':1,'pageSize':20}).then((res)=>{
  33. })
  34. },
  35. getDiscoverList(){
  36. if(this.isAjax){
  37. return
  38. }
  39. this.isAjax=true
  40. getDiscoverList({'count':10}).then((res)=>{
  41. this.isAjax=false
  42. this.list=res
  43. let arr=[]
  44. res.forEach((item)=>{
  45. let galleryUrls=item.galleryUrls
  46. let age=tools.getAge(item.dateOfBirth)
  47. if(galleryUrls.length>0){
  48. if(galleryUrls.length>8){
  49. galleryUrls=galleryUrls.slice(0,7)
  50. }
  51. let newdata = {
  52. image: galleryUrls[0],
  53. images: galleryUrls,
  54. imgIndex:0,
  55. title: item.nickname,
  56. age: age,
  57. online: item.online,
  58. longitude: item.longitude,
  59. latitude: item.latitude,
  60. distance: 17,
  61. city: item.province+' '+item.city,
  62. weChat: item.wechatId,
  63. animation:{}
  64. }
  65. console.log(newdata)
  66. arr.push(newdata)
  67. }
  68. })
  69. this.$refs.jmList.setData(arr)
  70. })
  71. },
  72. change(data) {
  73. // 判断倒数
  74. let arr=[]
  75. // 模拟一下最加数据
  76. const tu = [
  77. 'https://nimg.ws.126.net/?url=http%3A%2F%2Fdingyue.ws.126.net%2F2021%2F0704%2Fc7a27a1ej00qvpu700019c000hs00vlc.jpg&thumbnail=660x2147483647&quality=80&type=jpg',
  78. 'https://nimg.ws.126.net/?url=http%3A%2F%2Fdingyue.ws.126.net%2F2021%2F0704%2F9f81e6aaj00qvpu70001xc000hs00vmc.jpg&thumbnail=660x2147483647&quality=80&type=jpg',
  79. 'https://nimg.ws.126.net/?url=http%3A%2F%2Fdingyue.ws.126.net%2F2021%2F0704%2F55bf2cb3j00qvpu70002cc000hs012jc.jpg&thumbnail=660x2147483647&quality=80&type=jpg',
  80. 'https://nimg.ws.126.net/?url=http%3A%2F%2Fdingyue.ws.126.net%2F2021%2F0704%2F2017725bj00qvpu70001jc000hs00zxc.jpg&thumbnail=660x2147483647&quality=80&type=jpg'
  81. ]
  82. for (let index = 0; index < 10; index++) {
  83. const n = Math.floor(Math.random() * (tu.length - 1))
  84. let newdata = {
  85. image: tu[n],
  86. images: [
  87. 'https://nimg.ws.126.net/?url=http%3A%2F%2Fdingyue.ws.126.net%2F2021%2F0704%2Fc7a27a1ej00qvpu700019c000hs00vlc.jpg&thumbnail=660x2147483647&quality=80&type=jpg',
  88. 'https://nimg.ws.126.net/?url=http%3A%2F%2Fdingyue.ws.126.net%2F2021%2F0704%2F9f81e6aaj00qvpu70001xc000hs00vmc.jpg&thumbnail=660x2147483647&quality=80&type=jpg',
  89. 'https://nimg.ws.126.net/?url=http%3A%2F%2Fdingyue.ws.126.net%2F2021%2F0704%2F55bf2cb3j00qvpu70002cc000hs012jc.jpg&thumbnail=660x2147483647&quality=80&type=jpg',
  90. 'https://nimg.ws.126.net/?url=http%3A%2F%2Fdingyue.ws.126.net%2F2021%2F0704%2F2017725bj00qvpu70001jc000hs00zxc.jpg&thumbnail=660x2147483647&quality=80&type=jpg'
  91. ],
  92. imgIndex:0,
  93. title: '你好',
  94. age: '19',
  95. distance: '19.6',
  96. city: '香港九龙城',
  97. weChat: 'siococos',
  98. animation:{}
  99. }
  100. arr.push(newdata)
  101. }
  102. this.$refs.jmList.setData(arr)
  103. // console.log(data);
  104. },
  105. clickImage(data) {
  106. console.log(data);
  107. }
  108. }
  109. }
  110. </script>
  111. <style scoped lang="scss">
  112. .slide-box{
  113. margin-top: 10rpx;
  114. box-sizing: border-box;
  115. }
  116. </style>