applet/pages/couponCenter/index.vue

<template>
  <view class="main">
    <uv-navbar :title="config.title" placeholder autoBack></uv-navbar>
    <view class="list">
      <couponInfo v-for="(item, index) in listData" :key="index" :item="item" :show="checkIndex === index ? true : false" @click="checkCoupon(item, index)" :isCheck="isCheck" :isMyCoupon="isMyCoupon" @grabTickets="grabTickets" @useTickets="useTickets" />

      <view>
        <noData v-if="listData.length <= 0"></noData>
      </view>
    </view>
    <view v-if="isMyCoupon && loadStatus == 'nomore'" class="go-center">没有更多券了！<text class="light" @click="goCouponCenter()">去领券中心领取＞</text></view>
    <uv-loadmore v-else :status="loadStatus" />
  </view>
</template>

<script setup>
import { ref } from "vue";
import { onLoad, onReachBottom, onPullDownRefresh } from "@dcloudio/uni-app";
import {
  couponPage_Api,
  couponReceiveRecordAdd_Api,
  couponReceiveRecordPage_Api,
} from "@/api/index";
const config = ref({
  title: "",
});


const pageParams1 = ref({
  pageNum: 1,
  pageSize: 10,
  status: 0, // 0可以使用，1已使用，2，未使用已过期
});

const pageParams2 = ref({
  pageNum: 1,
  pageSize: 10,
});

const listData = ref([]);
const loadStatus = ref("loadmore"); //loading / nomore
const isMyCoupon = ref(false); // 是否为“我的优惠券”
const isCheck = ref(false); // 是否为“选择可使用的优惠券”
const checkIndex = ref("");

// 获取我的优惠券列表
const getMyList = (isRefresh, needLoading = false) => {
  console.log("getMyList");
  if (!isRefresh && loadStatus.value == "nomore") {
    return false;
  }
  pageParams1.value.pageNum = isRefresh ? 1 : pageParams1.value.pageNum + 1;
  listData.value = isRefresh ? [] : listData.value;
  if (needLoading) {
    uni.showLoading({
      title: "努力加载中...",
      mask: true,
    });
  }
  loadStatus.value = "loading";
  couponReceiveRecordPage_Api(pageParams1.value)
    .then((res) => {
      if (res.code == 200) {
        let listDatas = listData.value;
        listDatas.push(...res.rows);
        // console.log(listDatas);
        listData.value = listDatas;
        loadStatus.value =
          listData.value.length >= res.total ? "nomore" : "loadmore";
      }
    })
    .finally(() => {
      if (needLoading) {
        // uni.hideLoading();
      }
    });
};

// 获取优惠券列表
const getList = (isRefresh, needLoading = false) => {
  if (!isRefresh && loadStatus.value == "nomore") {
    return false;
  }
  pageParams2.value.pageNum = isRefresh ? 1 : pageParams2.value.pageNum + 1;
  listData.value = isRefresh ? [] : listData.value;
  if (needLoading) {
    uni.showLoading({
      title: "努力加载中...",
      mask: true,
    });
  }
  loadStatus.value = "loading";
  couponPage_Api(pageParams2.value)
    .then((res) => {
      if (res.code == 200) {
        let listDatas = listData.value;
        listDatas.push(...res.rows);
        listData.value = listDatas;
        loadStatus.value =
          listData.value.length >= res.total ? "nomore" : "loadmore";
      }
    })
    .finally(() => {
      if (needLoading) {
        // uni.hideLoading();
      }
    });
};

//领券
const grabTickets = (id) => {
  uni.showLoading({
    title: "正在提交中...",
    mask: true,
  });
  couponReceiveRecordAdd_Api(id)
    .then((res) => {
      if (res.code == 200) {
        setTimeout(() => {
          uni.showToast({
            icon: "success",
            title: "领券成功",
          });
        }, 300);
        //获取上一个页面
        let pages = getCurrentPages();
        if (pages.length > 1) {
          let beforePage = pages[pages.length - 2];
          if (beforePage.$vm.isMyCoupon) {
            beforePage.$vm.getMyList(true);
          }
        }
      }
    })
    .finally(() => {
      // uni.hideLoading();
    });
};

const goCouponCenter = () => {
  uni.navigateTo({
    url: "/pages/couponCenter/index",
  });
};

const useTickets = () => {
  uni.switchTab({
    url: "/pages/tabtar/home",
  });
};

const checkCoupon = (item, index) => {
  if (isCheck.value) {
    if (checkIndex.value === index) {
      checkIndex.value = "";
    } else {
      checkIndex.value = index;
    }
  }
  let params = {
    couponId: 0,
  };
  if (checkIndex.value !== "") {
    params = {
      my_coupon_id: item.id,
    };
  }
  //获取上一个页面
  let pages = getCurrentPages();
  if (pages.length > 1) {
    let beforePage = pages[pages.length - 2];
    if (beforePage.$vm.changeCoupon) {
      beforePage.$vm.changeCoupon(params);
    }
  }
};

onLoad((option) => {
  // let objs = uni.getStorageSync("userBusinessInfo") || {};
  // // console.log(objs)
  // if (!objs.id) {
  //   uni.$uv.toast("未获取到店铺信息");
  //   uni.navigateBack();
  //   return;
  // }
  // pageParams1.value.businessId = objs.businessId;
  // pageParams2.value.businessId = objs.businessId;
  //   console.log(option);
  if (option.isMyCoupon) {
    isMyCoupon.value = true;
    config.value.title = "我的优惠券";
    getMyList(true);
  } else {
    config.value.title = "领券中心";
    getList(true);
  }
});

onPullDownRefresh(() => {
  if (isMyCoupon.value) {
    getMyList(true);
  } else if (isCheck.value) {
    getMyCanUseList();
  } else {
    getList(true);
  }
  uni.stopPullDownRefresh();
});

onReachBottom(() => {
  if (isMyCoupon.value) {
    getMyList();
  } else if (isCheck.value) {
  } else {
    getList();
  }
});
</script>

<style lang="scss" scoped>
.main {
  min-height: 100vh;
  background-color: rgba(253, 253, 253, 1);
  padding: 0 0 50rpx 0;

  .go-center {
    font-size: 26rpx;
    font-family: PingFang SC, PingFang SC-Regular;
    font-weight: 400;
    text-align: center;
    color: #808080;
    margin-top: 60rpx;

    .light {
      color: #00a7e6;
    }
  }

  .list {
  }
}
</style>