index.vue 2.1 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061
  1. <template>
  2. <view class="collect">
  3. <!-- header -->
  4. <cu-custom isBack bgColor="bg-gradual-blue"><view slot="content">收藏</view></cu-custom>
  5. <cu-scrollView @refresherpulling="refresherpulling" @scroll="scroll" :height="height">
  6. <view class="padding">
  7. <view @click="handler(item.commodity)" v-for="(item, index) in ListValue" :key="index" class="margin-bottom bg-white padding flex align-center">
  8. <image lazy-load="true" style="width: 160upx;height: 160upx;min-width: 160upx;" :src="item.image | lazyImage" mode="aspectFit"></image>
  9. <view style="flex: auto;" class="margin-left">
  10. <view class="text-black text-bold">{{ item.name }}</view>
  11. <view class="flex margin-top-xs justify-between">
  12. <view class="text-price text-red">
  13. <cu-price :value="item.price" />
  14. </view>
  15. <view class="">{{ item.point_price }}积分</view>
  16. </view>
  17. <view style="display: inline-block;" class="bg-orange light padding-lr-xs">
  18. <text class="cuIcon-vip lg">会员价</text>
  19. <text class="text-price margin-left-xs">{{ item.vip_price }}</text>
  20. </view>
  21. </view>
  22. </view>
  23. </view>
  24. </cu-scrollView>
  25. </view>
  26. </template>
  27. <script>
  28. import { CustomBarHeight } from '@/common/device/index.js';
  29. import { mapState, mapActions, mapMutations } from 'vuex';
  30. export default {
  31. computed: {
  32. ...mapState('requestList', ['ListValue', 'currentPage', 'totalPage']),
  33. height() {
  34. return `calc(100vh - ${CustomBarHeight}px)`;
  35. }
  36. },
  37. methods: {
  38. ...mapActions('requestList', ['reset', 'requestFunc']),
  39. handler(id) {
  40. uni.navigateTo({
  41. url: `/pages/detail/index?id=${id}`
  42. });
  43. },
  44. async refresherpulling() {
  45. await this.reset();
  46. await this.requestFunc({ method: 'get', url: '/customer/collection/list/', data: { limit: 10 } });
  47. },
  48. async scroll() {
  49. await this.reset();
  50. await this.requestFunc({ method: 'get', url: '/customer/collection/list/', data: { limit: 10 } });
  51. }
  52. },
  53. async onShow() {
  54. await this.reset();
  55. await this.requestFunc({ method: 'get', url: '/customer/collection/list/', data: { limit: 10 } });
  56. }
  57. };
  58. </script>
  59. <style></style>