activity.vue 3.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129
  1. <template>
  2. <view>
  3. <!-- naviageToPage('/modules/kxmall/pages/parity/parity?title=今日特价&id=1') -->
  4. <view v-if="cheapRecommend.length > 0 && storage&&showBanner"
  5. @click="naviageToPage(link)"
  6. :style="{'padding-left': showStyle!=='0px'?'30rpx':0,'padding-right': showStyle!=='0px'?'26rpx':0}">
  7. <image :src="imgUrl" mode="widthFix" style="width: 100%;">
  8. </image>
  9. </view>
  10. <scroll-view :scroll-x="scroll" :scroll-y="!scroll" style="width: 750rpx;">
  11. <view v-if="cheapRecommend.length > 0 && storage" class="flex padding-left-sm">
  12. <view v-for="(item,index) in this.cheapRecommend" :key="index"
  13. class="margin-lr-xs bg-white flex align-center justify-center flex-direction"
  14. style="width: 200rpx;height: 340rpx;padding-right: 10rpx;border: 8rpx;" @click="navToDetailPage(item.productId)">
  15. <image style="width: 186rpx;height: 172rpx" :src="JSON.parse(item.img)[0].url" mode="aspectFit"></image>
  16. <view style="padding-top: 28rpx;">
  17. <view class="text-2-cut" style="width: 182rpx;height: 68rpx;font-size: 24rpx;color: #2D4454;">
  18. {{item.title}}
  19. </view>
  20. <view style="padding-top: 6rpx;padding-bottom: 14rpx;" class="flex align-center justify-between">
  21. <view style="width: 114rpx;height: 42rpx;line-height: 42rpx;font-size: 24rpx;color:#F62929;">
  22. ¥{{item.activityPrice}}</view>
  23. <image @click.stop="addCart(item)" style="width: 48rpx;height: 48rpx;"
  24. src="@/static/kxmall/index/cart.png" mode="aspectFit" class="round"></image>
  25. </view>
  26. </view>
  27. </view>
  28. </view>
  29. </scroll-view>
  30. </view>
  31. </template>
  32. <script>
  33. export default {
  34. name: 'Special',
  35. // props: ['storage', 'cheapRecommend', 'options'],
  36. props: ['storage', 'options'],
  37. data() {
  38. return {
  39. cheapRecommend:'',
  40. }
  41. },
  42. mounted() {
  43. console.log('mounted-----',this.options)
  44. let id = this.options.banner.link.split("id=")[1];
  45. console.log('this.options----',id)
  46. this.$kxmall_api.request('get','storage/position/getActivityProductByStorage',{
  47. storageId: this.$store.state.kxmall.storageId,
  48. activityId:id,
  49. activityTitle:this.options.title,
  50. // #ifdef H5
  51. storageId: 11,
  52. // #endif
  53. // sort: 1
  54. },failres => {
  55. }).then(res=>{
  56. console.log('res----',res.data.rows)
  57. this.cheapRecommend = res.data.rows
  58. })
  59. },
  60. computed: {
  61. recommendName(){
  62. return this.options.recommendName
  63. },
  64. showBanner() {
  65. return this.options.banner.show
  66. },
  67. imgUrl() {
  68. const {
  69. imgUrl
  70. } = this.options.banner
  71. if (imgUrl) {
  72. return JSON.parse(imgUrl)[0].url
  73. } else {
  74. return require('@/static/kxmall/index/bought.png')
  75. }
  76. },
  77. link() {
  78. let link = this.options.banner.link
  79. // // + '&innerImgUrl='+ this.innerImgUrl()[0].url
  80. // + '&innerLink='+ this.options.banner.inner.link
  81. // + '&innerImgUrl='+ JSON.parse(this.options.banner.inner.imgUrl)[0].url
  82. console.log('link()---',link)
  83. return link
  84. },
  85. // innerImgUrl() {
  86. // // let imgUrl = JSON.parse(this.options.banner.inner.imgUrl)
  87. // // return JSON.parse(imgUrl)
  88. // // let imgUrl = JSON.parse(this.options.banner.inner.imgUrl)
  89. // return 'http//:www.baidu.com'
  90. // },
  91. // innerLink() {
  92. // return this.options.banner.inner.link
  93. // },
  94. showStyle() {
  95. return this.options.banner.showStyle
  96. },
  97. imgStyle() {
  98. return this.options.banner.imgStyle
  99. },
  100. scroll() {
  101. return this.options.scroll
  102. },
  103. },
  104. methods: {
  105. naviageToPage(url, title) {
  106. this.$emit('naviage-to-page', url, title)
  107. },
  108. navToDetailPage(id) {
  109. this.$emit('nav-to-detail-page', id)
  110. },
  111. addCart(item) {
  112. this.$emit('add-cart', item)
  113. }
  114. }
  115. }
  116. </script>
  117. <style scoped lang="scss">
  118. </style>