refactor(shop): 重构优惠券和礼品卡相关功能

- 优化了优惠券和礼品卡的搜索功能
- 重新设计了统计卡片的样式和布局- 改进了优惠券和礼品卡的领取和兑换流程
- 统一了图标样式和大小
- 调整了部分组件的显示逻辑

src/user/coupon/index.tsx

@@ -1,7 +1,7 @@
 import {useState} from "react";
 import Taro, {useDidShow} from '@tarojs/taro'
 import {Button, Empty, ConfigProvider, SearchBar, InfiniteLoading, Loading, PullToRefresh, Tabs, TabPane} from '@nutui/nutui-react-taro'
-import {Gift, Search, Plus, Filter} from '@nutui/icons-react-taro'
+import {Plus, Filter} from '@nutui/icons-react-taro'
 import {View} from '@tarojs/components'
 import {ShopCoupon} from "@/api/shop/shopCoupon/model";
 import {pageShopCoupon} from "@/api/shop/shopCoupon";
@@ -20,6 +20,7 @@ const CouponManage = () => {
   const [searchValue, setSearchValue] = useState('')
   const [page, setPage] = useState(1)
   const [total, setTotal] = useState(0)
+  console.log('total = ',total)
   const [activeTab, setActiveTab] = useState('0') // 0-可用 1-已使用 2-已过期
   const [stats, setStats] = useState({
     available: 0,
@@ -191,7 +192,7 @@ const CouponManage = () => {
   }
 
   // 优惠券点击事件
-  const handleCouponClick = (coupon: CouponCardProps, index: number) => {
+  const handleCouponClick = (_coupon: CouponCardProps, index: number) => {
     const originalCoupon = list[index]
     if (originalCoupon) {
       // 显示优惠券详情
@@ -317,15 +318,14 @@ const CouponManage = () => {
   return (
     <ConfigProvider>
       {/* 搜索栏和领取入口 */}
-      <View className="bg-white px-4 py-3">
+      <View className="bg-white px-4 py-3 hidden">
         <View className="flex items-center gap-3">
           <View className="flex-1">
             <SearchBar
-              placeholder="搜索优惠券名称"
+              placeholder="搜索"
               value={searchValue}
               onChange={setSearchValue}
               onSearch={handleSearch}
-              leftIcon={<Search />}
             />
           </View>
           <Button
@@ -374,13 +374,6 @@ const CouponManage = () => {
         </Tabs>
       </View>
 
-      {/* 统计信息 */}
-      {total > 0 && (
-        <View className="px-4 py-2 text-sm text-gray-500 bg-gray-50">
-          共找到 {total} 张优惠券
-        </View>
-      )}
-
       {/* 优惠券列表 */}
       <PullToRefresh
         onRefresh={handleRefresh}
@@ -425,23 +418,6 @@ const CouponManage = () => {
         </View>
       </PullToRefresh>
 
-      {/* 底部提示 */}
-      {activeTab === '0' && list.length === 0 && !loading && (
-        <View className="text-center py-8">
-          <View className="text-gray-400 mb-4">
-            <Gift size="48" />
-          </View>
-          <View className="text-gray-500 mb-2">暂无可用优惠券</View>
-          <Button
-            size="small"
-            type="primary"
-            onClick={() => Taro.navigateTo({url: '/pages/index/index'})}
-          >
-            去逛逛
-          </Button>
-        </View>
-      )}
-
       {/* 使用指南弹窗 */}
       <CouponGuide
         visible={showGuide}

src/user/coupon/receive.tsx

@@ -1,7 +1,7 @@
 import {useState} from "react";
 import Taro, {useDidShow} from '@tarojs/taro'
 import {Button, Empty, ConfigProvider, SearchBar, InfiniteLoading, Loading, PullToRefresh} from '@nutui/nutui-react-taro'
-import {Gift, Search} from '@nutui/icons-react-taro'
+import {Gift} from '@nutui/icons-react-taro'
 import {View} from '@tarojs/components'
 import {ShopCoupon} from "@/api/shop/shopCoupon/model";
 import {pageShopCoupon} from "@/api/shop/shopCoupon";
@@ -31,7 +31,7 @@ const CouponReceive = () => {
         page: currentPage,
         limit: 10,
         keywords: searchValue,
-        enabled: '1', // 启用状态
+        enabled: 1, // 启用状态
         isExpire: 0   // 未过期
       })
 
@@ -77,7 +77,7 @@ const CouponReceive = () => {
   const transformCouponData = (coupon: ShopCoupon): CouponCardProps => {
     let amount = 0
     let type: 1 | 2 | 3 = 1
-    
+
     if (coupon.type === 10) { // 满减券
       type = 1
       amount = parseFloat(coupon.reducePrice || '0')
@@ -114,16 +114,16 @@ const CouponReceive = () => {
   }
 
   // 领取优惠券
-  const handleReceiveCoupon = async (coupon: ShopCoupon) => {
+  const handleReceiveCoupon = async (_coupon: ShopCoupon) => {
     try {
       // 这里应该调用领取优惠券的API
       // await receiveCoupon(coupon.id)
-      
+
       Taro.showToast({
         title: '领取成功',
         icon: 'success'
       })
-      
+
       // 刷新列表
       reload(true)
     } catch (error) {
@@ -136,7 +136,7 @@ const CouponReceive = () => {
   }
 
   // 优惠券点击事件
-  const handleCouponClick = (coupon: CouponCardProps, index: number) => {
+  const handleCouponClick = (_coupon: CouponCardProps, index: number) => {
     const originalCoupon = list[index]
     if (originalCoupon) {
       // 显示优惠券详情
@@ -168,11 +168,10 @@ const CouponReceive = () => {
       {/* 搜索栏 */}
       <View className="bg-white px-4 py-3">
         <SearchBar
-          placeholder="搜索优惠券名称"
+          placeholder="搜索"
           value={searchValue}
           onChange={setSearchValue}
           onSearch={handleSearch}
-          leftIcon={<Search />}
         />
       </View>
 

src/user/gift/index.tsx

@@ -1,7 +1,7 @@
 import {useState} from "react";
 import Taro, {useDidShow} from '@tarojs/taro'
-import {Button, Empty, ConfigProvider, InfiniteLoading, Loading, PullToRefresh, Tabs, TabPane} from '@nutui/nutui-react-taro'
-import {Gift, Plus, Board, QrCode} from '@nutui/icons-react-taro'
+import {Button, Empty, ConfigProvider,SearchBar, InfiniteLoading, Loading, PullToRefresh, Tabs, TabPane} from '@nutui/nutui-react-taro'
+import {Gift, Retweet, Board, QrCode} from '@nutui/icons-react-taro'
 import {View} from '@tarojs/components'
 import {ShopGift} from "@/api/shop/shopGift/model";
 import {getUserGifts} from "@/api/shop/shopGift";
@@ -14,7 +14,7 @@ const GiftCardManage = () => {
   const [list, setList] = useState<ShopGift[]>([])
   const [loading, setLoading] = useState(false)
   const [hasMore, setHasMore] = useState(true)
-  // const [searchValue, setSearchValue] = useState('')
+  const [searchValue, setSearchValue] = useState('')
   const [page, setPage] = useState(1)
   // const [total, setTotal] = useState(0)
   const [activeTab, setActiveTab] = useState('0') // 0-可用 1-已使用 2-已过期
@@ -97,10 +97,10 @@ const GiftCardManage = () => {
   }
 
   // 搜索功能
-  // const handleSearch = (value: string) => {
-  //   setSearchValue(value)
-  //   reload(true)
-  // }
+  const handleSearch = (value: string) => {
+    setSearchValue(value)
+    reload(true)
+  }
 
   // 下拉刷新
   const handleRefresh = async () => {
@@ -272,10 +272,19 @@ const GiftCardManage = () => {
       {/* 搜索栏和功能入口 */}
       <View className="bg-white px-4 py-3">
         <View className="flex items-center justify-between gap-3">
+          <View className="flex-1 hidden">
+            <SearchBar
+              placeholder="搜索"
+              value={searchValue}
+              className={'border'}
+              onChange={setSearchValue}
+              onSearch={handleSearch}
+            />
+          </View>
           <Button
             size="small"
             type="primary"
-            icon={<Plus />}
+            icon={<Retweet />}
             onClick={handleRedeemGift}
           >
             兑换

src/user/gift/redeem.config.ts

@@ -1,6 +1,5 @@
 export default definePageConfig({
   navigationBarTitleText: '兑换礼品卡',
   navigationBarTextStyle: 'black',
-  navigationBarBackgroundColor: '#ffffff',
-  navigationStyle: 'custom'
+  navigationBarBackgroundColor: '#ffffff'
 })

src/user/gift/redeem.tsx

@@ -39,7 +39,9 @@ const GiftCardRedeem = () => {
     setValidating(true)
     try {
       const gift = await validateGiftCode(codeToValidate.trim())
-      setValidGift(gift)
+      if(gift){
+        setValidGift(gift)
+      }
       Taro.showToast({
         title: '验证成功',
         icon: 'success'
@@ -138,7 +140,7 @@ const GiftCardRedeem = () => {
   return (
     <ConfigProvider>
       {/* 自定义导航栏 */}
-      <View className="flex items-center justify-between p-4 bg-white border-b border-gray-100">
+      <View className="flex items-center justify-between p-4 bg-white border-b border-gray-100 hidden">
         <View className="flex items-center" onClick={handleBack}>
           <ArrowLeft size="20" />
           <Text className="ml-2 text-lg">兑换礼品卡</Text>