jinyaqiu
828e84710f
All checks were successful
Dev Deploy / Explore-Gitea-Actions (push) Successful in 24s
50 lines
1.3 KiB
TypeScript
50 lines
1.3 KiB
TypeScript
import { StyleProp, StyleSheet, View, ViewStyle } from "react-native";
|
|
import { ThemedText } from "../ThemedText";
|
|
|
|
interface CountProps {
|
|
data: { title: string; number: string | number }[];
|
|
style?: StyleProp<ViewStyle>;
|
|
}
|
|
const CountComponent = (props: CountProps) => {
|
|
return (
|
|
<View style={[styles.container, props.style]}>
|
|
{props.data?.map((item, index) => (
|
|
<View style={styles.item} key={index}>
|
|
<ThemedText style={styles.title}>{item.title}</ThemedText>
|
|
<ThemedText style={styles.number}>{item.number}</ThemedText>
|
|
</View>
|
|
))}
|
|
</View>
|
|
);
|
|
};
|
|
|
|
const styles = StyleSheet.create({
|
|
container: {
|
|
backgroundColor: "#FFB645",
|
|
padding: 16,
|
|
borderRadius: 20,
|
|
display: "flex",
|
|
flexDirection: "column",
|
|
justifyContent: "space-between",
|
|
},
|
|
item: {
|
|
flexDirection: "row",
|
|
alignItems: "center",
|
|
justifyContent: "space-between",
|
|
paddingVertical: 8
|
|
},
|
|
title: {
|
|
color: "#4C320C",
|
|
fontWeight: "700",
|
|
fontSize: 14,
|
|
},
|
|
number: {
|
|
color: "#fff",
|
|
fontWeight: "700",
|
|
fontSize: 32,
|
|
textAlign: 'right',
|
|
flex: 1,
|
|
paddingTop: 8
|
|
}
|
|
})
|
|
export default CountComponent; |