update: 对接金币相关

src/pages/coin/index.vue

@@ -1,11 +1,86 @@
 <script setup>
+import { ref } from "vue";
+import { onLoad } from "@dcloudio/uni-app";
 import Container from "@/components/Container.vue";
 import CoinHeader from "./components/CoinHeader.vue";
 import CoinBalancePanel from "./components/CoinBalancePanel.vue";
 import CoinQuickMenu from "./components/CoinQuickMenu.vue";
 import OfflineExchangeNotice from "./components/OfflineExchangeNotice.vue";
 import RewardProductCard from "./components/RewardProductCard.vue";
-import { coinSummary, quickMenus, rewardProducts } from "./data";
+import { getGiftListAPI, getMyGoldAPI } from "@/apis";
+import { quickMenus } from "./data";
+
+const PAGE_SIZE = 20;
+const coinSummary = ref({
+  cumulative: 0,
+  available: 0,
+});
+const rewardProducts = ref([]);
+const productPage = ref(0);
+const productTotal = ref(0);
+const productLoading = ref(false);
+const productNoMore = ref(false);
+
+const loadCoinSummary = async () => {
+  try {
+    const result = await getMyGoldAPI();
+    coinSummary.value = {
+      cumulative: Number(result?.totalGold) || 0,
+      available: Number(result?.usableGold) || 0,
+    };
+  } catch (error) {
+    console.error("加载金币统计失败", error);
+  }
+};
+
+const loadProducts = async ({ reset = false } = {}) => {
+  if (productLoading.value || (!reset && productNoMore.value)) return;
+
+  const nextPage = reset ? 1 : productPage.value + 1;
+  productLoading.value = true;
+  if (reset) productNoMore.value = false;
+
+  try {
+    const result = await getGiftListAPI({
+      page: nextPage,
+      pageSize: PAGE_SIZE,
+    });
+    const list = Array.isArray(result?.list) ? result.list : [];
+    const mappedList = list.map((item) => ({
+      id: item.id,
+      name: item.name || "",
+      cost: Number(item.coin_price) || 0,
+      stock: Number(item.stock) || 0,
+      image: item.cover_image || "",
+    }));
+
+    rewardProducts.value = reset
+      ? mappedList
+      : rewardProducts.value.concat(mappedList);
+    productPage.value = Number(result?.page) || nextPage;
+    const pageCount = Number(result?.pageCount ?? result?.page_count);
+    const totalCount = Number(result?.totalCount ?? result?.total);
+    const responsePageSize =
+      Number(result?.pageSize ?? result?.page_size) || PAGE_SIZE;
+    productTotal.value = Number.isFinite(totalCount) ? totalCount : 0;
+
+    if (Number.isFinite(pageCount) && pageCount >= 0) {
+      productNoMore.value = productPage.value >= pageCount;
+    } else if (Number.isFinite(totalCount) && totalCount >= 0) {
+      productNoMore.value = rewardProducts.value.length >= totalCount;
+    } else {
+      productNoMore.value = list.length < responsePageSize;
+    }
+  } catch (error) {
+    if (reset) {
+      rewardProducts.value = [];
+      productPage.value = 0;
+    }
+    console.error("加载礼品列表失败", error);
+  } finally {
+    productLoading.value = false;
+  }
+};
 
 const menuRoutes = {
   rules: "/pages/coin/rules",
@@ -26,17 +101,22 @@ const onMenuSelect = (menu) => {
   uni.navigateTo({ url });
 };
 
-const toProductDetail = () => {
+const toProductDetail = (product) => {
   uni.navigateTo({
-    url: "/pages/coin/product-detail",
+    url: `/pages/coin/product-detail?id=${product.id}`,
   });
 };
+
+onLoad(() => {
+  loadCoinSummary();
+  loadProducts({ reset: true });
+});
 </script>
 
 <template>
-  <Container :bgType="6" :isHome="true">
+  <Container :bgType="6" :isHome="true" @scrolltolower="loadProducts">
     <template #header>
-      <CoinHeader title="我的金币" :subtitle="coinSummary.storeName" />
+      <CoinHeader title="我的金币" />
     </template>
     <view class="coin-page">
       <CoinBalancePanel
@@ -51,7 +131,7 @@ const toProductDetail = () => {
             v-for="product in rewardProducts"
             :key="product.id"
             class="reward-grid__item"
-            @click="toProductDetail"
+            @click="toProductDetail(product)"
           >
             <RewardProductCard :product="product" />
           </view>