recycle-mobile/src/pages/mine/myLike.vue

<template>
  <!-- #ifdef H5 -->
  <zj-page-layout :hasFooter="false" :isScroll="true" :refresherTriggered="refresherTriggered"
    @refresherrefresh="refresherrefresh" @scrolltolower="scrolltolower">
    <view class="common-goods-list">
      <view class="item" v-for="(item, index) in dataList" :key="index" @tap="toDetail(item.id)">
        <view class="top">
          <image src="@/static/common/logo.png"></image>
          <view class="user">
            <view class="name">{{item.userName}}</view>
            <view class="time">{{item.createTime | timeFilter}}</view>
          </view>
          <view class="price">{{item.amount | priceFilter2}}</view>
        </view>
        <view class="title">{{item.title}}</view>
        <view class="des">{{item.content}}</view>
        <view class="imgs">
          <image :src="imgUrl + it.imgUrl" v-for="(it, idx) in item.goodsFiles" :key="idx" mode="aspectFill"></image>
        </view>
        <view class="bottom">
          <view class="left-location"><text class="iconfont icon-dingwei"></text>{{item.city}} {{item.area}}</view>
          <view class="right-btn" @tap.stop>
            <u-button text="取消点赞" shape="circle" @click="handelCancel(item.id)"></u-button>
          </view>
        </view>
      </view>
    </view>

    <Loading :loadStatus="loadStatus" :dataList="dataList" />
  </zj-page-layout>
  <!-- #endif -->
  <!-- #ifndef H5 -->
  <web-view :src="webViewHref('/pages/mine/myLike',crossPagePam)" @message="crossPage.$listener"></web-view>
  <!-- #endif -->
</template>

<script>
  // #ifdef H5
  export default {
    data() {
      return {
        imgUrl: this.$imageUrl,
        dataList: [],
        pageNum: 1,
        loadStatus: 0,
        refresherTriggered: false,
      }
    },

    async onLoad() {
      await this.getList()
    },

    methods: {
      //获取列表数据
      async getList() {
        this.$api.get('/likeOrCollect/list', {
          userId: this.$store.state.user.userId,
          type: 1,
          pageNum: this.pageNum,
          pageSize: 10,
        }).then(res => {
          this.loadStatus = 0;
          let list = res.data.records;
          if (list.length < 10) {
            this.loadStatus = 2;
          }
          this.dataList = this.dataList.concat(list);
        }).catch(() => {
          this.loadStatus = 2;
        }).finally(res => {
          this.refresherTriggered = false;
        })
      },

      // 滚动到底部
      scrolltolower(e) {
        if (this.loadStatus === 0) {
          this.pageNum++;
          this.getList();
        }
      },

      // 触发下拉刷新
      refresherrefresh(e) {
        this.refresherTriggered = true;
        this.refreshList();
      },

      refreshList() {
        this.dataList = [];
        this.pageNum = 1;
        this.getList();
      },

      toDetail(id) {
        this.$navToPage({
          url: `/pages/goods/detail?id=${id}`
        })
      },

      handelCancel(id) {
        this.$modal({
          content: '确定要取消点赞吗？'
        }).then(() => {
          this.$api.postJson('/likeOrCollect/likeOrCollect', {
            userId: this.$store.state.user.userId,
            goodsId: id,
            type: 1,
            operate: 'NO'
          }).then(res => {
            this.refreshList();
          })
        }).catch(() => {})
      },

    }
  }
  // #endif
  // #ifndef H5

  // #endif
</script>

<style lang="scss" scoped>

</style>