77 lines
2.5 KiB
TypeScript
77 lines
2.5 KiB
TypeScript
import HandersSvg from '@/assets/icons/svg/handers.svg';
|
|
import ProSvg from '@/assets/icons/svg/pro.svg';
|
|
import { ThemedText } from '@/components/ThemedText';
|
|
import { useRouter } from 'expo-router';
|
|
import { useTranslation } from "react-i18next";
|
|
import { Dimensions, Image, StyleSheet, TouchableOpacity, View } from "react-native";
|
|
|
|
const MemberCard = ({ pro }: { pro: string }) => {
|
|
const { t } = useTranslation();
|
|
const proPng = require("@/assets/images/png/owner/pro.png");
|
|
const width = Dimensions.get("window").width;
|
|
const router = useRouter();
|
|
|
|
return (
|
|
<View style={styles.container}>
|
|
<Image source={proPng} style={{ opacity: pro === "Pro" ? 1 : 0.5, width: 330, height: 110, position: "absolute", left: width * 0.5 - 40, bottom: 0, zIndex: 9 }} />
|
|
<ProSvg width={"100%"} height={"100%"} style={{ opacity: pro === "Pro" ? 1 : 0.5, backgroundColor: '#4C320C', borderRadius: 32 }} />
|
|
<HandersSvg style={{ opacity: pro === "Pro" ? 1 : 0.5, position: "absolute", left: width * 0.5 + 5, bottom: -3, zIndex: 10 }} />
|
|
<View style={[styles.dateContainer, { opacity: pro === "Pro" ? 1 : 0.5 }]}>
|
|
<ThemedText style={styles.date}>2025-09-05截止</ThemedText>
|
|
</View>
|
|
|
|
{
|
|
pro === "Pro"
|
|
?
|
|
null :
|
|
<TouchableOpacity
|
|
onPress={() => {
|
|
router.push('/rights');
|
|
}}
|
|
activeOpacity={0.7}
|
|
hitSlop={{ top: 10, bottom: 10, left: 10, right: 10 }}
|
|
style={styles.proText}
|
|
>
|
|
<ThemedText >{t("personal:generalSetting.goPremium")}</ThemedText>
|
|
</TouchableOpacity>
|
|
}
|
|
|
|
|
|
</View>
|
|
);
|
|
};
|
|
|
|
const styles = StyleSheet.create({
|
|
proText: {
|
|
fontSize: 10,
|
|
fontWeight: 'bold',
|
|
color: '#4C320C',
|
|
padding: 4,
|
|
paddingHorizontal: 8,
|
|
borderRadius: 16,
|
|
backgroundColor: '#fff',
|
|
position: 'absolute',
|
|
top: 30,
|
|
left: 90,
|
|
opacity: 0.7
|
|
},
|
|
dateContainer: {
|
|
position: 'absolute',
|
|
top: 16,
|
|
right: -15,
|
|
zIndex: 1,
|
|
transform: [{ rotate: '40deg' }],
|
|
},
|
|
date: {
|
|
fontSize: 11,
|
|
fontWeight: 'bold',
|
|
color: '#4C320C',
|
|
padding: 4,
|
|
},
|
|
container: {
|
|
position: "relative",
|
|
height: 120
|
|
},
|
|
});
|
|
|
|
export default MemberCard; |