Jelajahi Sumber

eslint 代码检查修改

fogwind 1 hari lalu
induk
melakukan
25b99cd5eb

+ 54 - 57
src/app/(public)/customer/account/pointlist/page.tsx

@@ -1,6 +1,6 @@
 "use client";
 // import Image from "next/image";
-import React, { useState, useEffect, useRef } from "react";
+import React, { useState, useEffect, useRef, useCallback } from "react";
 
 // 模拟积分明细数据(可替换为接口请求)
 const mockPointsData = [
@@ -130,24 +130,53 @@ const PointsDetails = () => {
 
   // 每页展示12条
   const PAGE_SIZE = 12;
+  const fetchData = useCallback((page: number, tab: string) => {
+    return new Promise((resolve) => {
+        setTimeout(() => {
+          let data = mockPointsData;
+          const prePage = page - 1;
+          const start = prePage * PAGE_SIZE;
+          const end = page * PAGE_SIZE;
+          if (tab === "rewarded") {
+            data = mockPointsData.filter(
+              (item) => item.type === "rewarded",
+            );
+          } else if (tab === "used") {
+            data = mockPointsData.filter((item) => item.type === "used");
+          }
+          const res = data.slice(start, end);
+          resolve(res);
+        }, 800);
+    });
+  },[]);
+  // 加载更多数据
+  const loadMore = useCallback(() => {
+
+    setLoading(true);
+    
+    fetchData(page+1,activeTab).then((res) => {
 
-  // 初始化/标签切换时重置数据
+        setListData(res);
+
+        setLoading(false);
+        setPage(page+1);
+        if(res.length < PAGE_SIZE) {
+           setHasMore(false);
+        }
+    });
+  },[fetchData,page,activeTab]);
+  
+  // 初始化
   useEffect(() => {
-    setPage(1);
-    setHasMore(true);
     // 筛选数据
-    let filteredData = mockPointsData;
-    if (activeTab === "rewarded") {
-      filteredData = mockPointsData.filter((item) => item.type === "rewarded");
-    } else if (activeTab === "used") {
-      filteredData = mockPointsData.filter((item) => item.type === "used");
-    }
-    // 第一页数据
-    const firstPageData = filteredData.slice(0, PAGE_SIZE);
-    setListData(firstPageData);
-    // 判断是否有更多数据
-    setHasMore(filteredData.length > PAGE_SIZE);
-  }, [activeTab]);
+    fetchData(1,'all').then((result)=> {
+        
+        setListData(result);
+        // 判断是否有更多数据
+        setHasMore(!(result.length < PAGE_SIZE));
+    });
+    
+  }, []);
 
   // 监听滚动:触底加载
   useEffect(() => {
@@ -168,45 +197,13 @@ const PointsDetails = () => {
       container.addEventListener("scroll", handleScroll);
       return () => container.removeEventListener("scroll", handleScroll);
     }
-  }, [loading, hasMore]);
-
-  // 加载更多数据
-  const loadMore = () => {
-    if (loading) return;
-
-    setLoading(true);
-
-    setTimeout(() => {
-      let filteredData = mockPointsData;
-
-      if (activeTab === "rewarded") {
-        filteredData = mockPointsData.filter(
-          (item) => item.type === "rewarded",
-        );
-      } else if (activeTab === "used") {
-        filteredData = mockPointsData.filter((item) => item.type === "used");
-      }
-
-      setPage((prevPage) => {
-        const nextPage = prevPage + 1;
-
-        const start = (nextPage - 1) * PAGE_SIZE;
-        const end = nextPage * PAGE_SIZE;
-
-        const newData = filteredData.slice(start, end);
-
-        if (newData.length > 0) {
-          setListData((prev) => [...prev, ...newData]);
-        } else {
-          setHasMore(false);
-        }
-
-        setLoading(false);
+  }, [loading, hasMore, loadMore]);
 
-        return nextPage;
-      });
-    }, 800);
-  };
+  const clickActiveTab = (tab: string) => {
+      setActiveTab(tab);
+      setPage(1);
+      fetchData(1, tab);
+  }
 
   return (
     <div className="min-h-screen bg-white">
@@ -225,7 +222,7 @@ const PointsDetails = () => {
       {/* 标签切换栏 */}
       <div className="flex border-b border-gray-200">
         <button
-          onClick={() => setActiveTab("all")}
+          onClick={() => clickActiveTab("all")}
           className={`px-6 py-3 font-medium text-sm ${
             activeTab === "all"
               ? "bg-black text-white"
@@ -235,7 +232,7 @@ const PointsDetails = () => {
           ALL
         </button>
         <button
-          onClick={() => setActiveTab("rewarded")}
+          onClick={() => clickActiveTab("rewarded")}
           className={`px-6 py-3 font-medium text-sm ${
             activeTab === "rewarded"
               ? "bg-black text-white"
@@ -245,7 +242,7 @@ const PointsDetails = () => {
           REWARDED
         </button>
         <button
-          onClick={() => setActiveTab("used")}
+          onClick={() => clickActiveTab("used")}
           className={`px-6 py-3 font-medium text-sm ${
             activeTab === "used"
               ? "bg-black text-white"

+ 4 - 4
src/app/(public)/customer/address/new/page.tsx

@@ -25,10 +25,10 @@ const NewAddressPage = () => {
   // 统一提交
   const handleSubmit = (e) => {
     e.preventDefault();
-    const submitData = {
-      ...form,
-      street: [form.street], // 👈 自动变成数组,后端就能收到 street[]
-    };
+    // const submitData = {
+    //   ...form,
+    //   street: [form.street], // 👈 自动变成数组,后端就能收到 street[]
+    // };
 
     // 直接拿form所有数据
     console.log("表单数据:", form);

+ 2 - 2
src/app/(public)/customer/address/page.tsx

@@ -1,7 +1,7 @@
 "use client";
 import React from "react";
-import { useState } from "react";
-import { useEffect } from "react";
+// import { useState } from "react";
+// import { useEffect } from "react";
 const CustomerAddressPage = () => {
   // 模拟地址数据(可根据实际需求替换)
   const addressData = {