fix: 修复按钮按下时没有阴影效果的问题以及在钱包添加查看优惠券按钮

app/(auth)/(tabs)/(home)/notificationPage.tsx

@@ -54,8 +54,8 @@ const NotificationPageComponent = () => {
     }, []);
     return (
         <SafeAreaView className="flex-1 bg-white" edges={['top', 'left', 'right']}>
-            <View style={{ minHeight: screenHeight, flex: 1 }} className="mx-[5%]">
-                <View style={{ marginTop: 25 }}>
+            <View style={{ minHeight: screenHeight, flex: 1 }}>
+                <View className="mx-[4%]" style={{ marginTop: 25 }}>
                     <Pressable
                         onPress={() => {
                             if (router.canGoBack()) {

component/accountPages/walletPageComponent.tsx

@@ -11,6 +11,8 @@ import {
     Alert,
     TextInput,
     Linking,
+    StyleSheet,
+    TouchableOpacity,
     Dimensions
 } from 'react-native';
 import { SafeAreaView } from 'react-native-safe-area-context';
@@ -18,8 +20,7 @@ import { router } from 'expo-router';
 import { CrossLogoSvg } from '../global/SVG';
 import { useEffect, useRef, useState } from 'react';
 import { walletService } from '../../service/walletService';
-// import UnionPayImage from '../../assets/unionpay.png';
-// import PayMeImage from '../../assets/payme.png';
+import NormalButton from '../global/normal_button';
 import { formatCouponDate, formatDate } from '../../util/lib';
 import { set } from 'date-fns';
 import { reloadAppAsync } from 'expo';
@@ -415,22 +416,6 @@ const WalletPageComponent = () => {
             }
         } catch (error) {}
     };
-    // const handleCouponClick = async (clickedCoupon: string) => {
-    //     Alert.alert(
-    //         '立即使用優惠券', // Title
-    //         '按確認打開相機，掃描充電站上的二維碼以使用優惠券', // Message
-    //         [
-    //             {
-    //                 text: '取消',
-    //                 style: 'cancel'
-    //             },
-    //             {
-    //                 text: '確認',
-    //                 onPress: () => router.push('scanQrPage')
-    //             }
-    //         ]
-    //     );
-    // };
     const handleCouponClick = async (couponName: string, couponDescription: string) => {
         router.push({
             pathname: '/couponDetailPage',
@@ -449,11 +434,6 @@ const WalletPageComponent = () => {
                     <View style={{ marginTop: 25 }}>
                         <Pressable
                             onPress={() => {
-                                // if (router.canGoBack()) {
-                                //     router.back();
-                                // } else {
-                                //     router.replace('/accountMainPage');
-                                // }
                                 router.replace('/accountMainPage');
                             }}
                         >
@@ -518,41 +498,24 @@ const WalletPageComponent = () => {
 
                 <View className="w-full h-1 bg-[#DBE4E8]" />
 
-                <View className="flex-row justify-between mx-[5%] pt-6 pb-3">
+                {/* <View className="flex-row justify-between mx-[5%] pt-6 pb-3">
                     <Text className="text-xl">優惠券</Text>
                     <Pressable onPress={() => router.push('couponPage')}>
                         <Text className="text-xl text-[#888888]">顯示所有</Text>
                     </Pressable>
-                </View>
-
-                <View className="flex-1 flex-col mx-[5%]">
-                    {loading ? (
-                        <View className="items-center justify-center">
-                            <ActivityIndicator />
-                        </View>
-                    ) : (
-                        <View>
-                            {coupons
-                                .filter(
-                                    (coupon) =>
-                                        coupon.is_consumed === false && new Date(coupon.expire_date) > new Date()
-                                )
-                                .slice(0, 2)
-                                .map((coupon, index) => (
-                                    <IndividualCouponComponent
-                                        key={index}
-                                        title={coupon.coupon.name}
-                                        price={coupon.coupon.amount}
-                                        detail={coupon.coupon.description}
-                                        date={formatCouponDate(coupon.expire_date)}
-                                        noCircle={true}
-                                        onCouponClick={() =>
-                                            handleCouponClick(coupon.coupon.name, coupon.coupon.description)
-                                        }
-                                    />
-                                ))}
-                        </View>
-                    )}
+                </View> */}
+
+                <View className="flex-1 flex-col mt-4 mx-[5%]">
+                    <NormalButton
+                        onPress={() => router.push('couponPage')}
+                        title={
+                            <Text className="text-white font-bold text-lg">查看所有優惠券</Text>
+                       
+                        }
+                        extendedStyle={{
+                            padding: 15
+                        }}
+                    />
                 </View>
             </ScrollView>
             <AmountInputModal
@@ -563,5 +526,18 @@ const WalletPageComponent = () => {
         </SafeAreaView>
     );
 };
-
+const styles = StyleSheet.create({
+    button: {
+        maxWidth: '100%',
+        fontSize: 16,
+        backgroundColor: '#025c72',
+        justifyContent: 'center',
+        alignItems: 'center',
+        borderRadius: 12,
+        padding: 20
+    },
+    buttonPressed: {
+        backgroundColor: '#28495c'
+    }
+});
 export default WalletPageComponent;

component/global/normal_button.tsx

@@ -28,13 +28,29 @@ const NormalButton: React.FC<NormalButtonProps> = ({
         <Pressable
             onPress={onPress}
             disabled={disabled}
-            style={[styles.button, extendedStyle]}
+            // style={[styles.button, extendedStyle]}
             // style={({ pressed }) => [
             //     pressed ? buttonPressedStyle || styles.buttonPressed : null,
             //     extendedStyle,
             // ]}
         >
-            {title}
+            {({ pressed }) => (
+                <View
+                    style={[
+                    {
+                        maxWidth: '100%',
+                        backgroundColor: pressed? '#28495c':'#025c72',
+                        justifyContent: 'center',
+                        alignItems: 'center',
+                        borderRadius: 12,
+                        padding: 20
+                    },
+                    extendedStyle,             
+                ]}
+                >
+                    {title}
+                </View>
+            )}
         </Pressable>
     );
 };