You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 

162 lines
4.8 KiB

import { View, Text, Image, Appearance, Platform, Pressable } from "react-native";
import React from "react";
import { connect } from "react-redux";
import Svg, { Path } from "react-native-svg";
//style
import tw from "tailwind-rn";
import fontSize from "../../../constants/fontSize";
import Colors from "../../../constants/Colors";
const ios = Platform.OS === "ios";
const User = ({ user }) => {
const colorScheme = Appearance.getColorScheme();
const [dropdown, setDropdown] = React.useState(true);
return (
<View style={tw(`w-full flex-col ${ios ? "items-end" : ""}`)}>
<Pressable
style={tw(
`w-full mt-2 mb-2 flex justify-between items-center ${
ios ? "flex-row-reverse" : "flex-row"
}`
)}
onPress={() => setDropdown(!dropdown)}
>
<View
style={tw(
`flex items-center ${ios ? "flex-row-reverse" : "flex-row"}`
)}
>
{user?.picFileId ? (
<Image
source={{ uri: "https://dnvn.ir/api/v1/" + user.picFileId }}
style={[tw("rounded-full"), { width: 70, height: 70 }]}
/>
) : (
<View
style={[
tw("rounded-full bg-gray-400"),
{ minWidth: 60, minHeight: 60, zIndex: 1 },
]}
></View>
)}
<View style={tw(`flex flex-col ${ios ? "items-end" : ""}`)}>
<Text
style={{
fontSize: fontSize.xl,
color: Colors.theme1[colorScheme].gray20,
fontFamily: "regular",
}}
>
{user?.firstName + " " + user?.lastName}
</Text>
<Text
style={{
fontSize: fontSize.tiny,
color: Colors.theme1[colorScheme].gray20,
fontFamily: "light",
}}
>
{user?.cellphone}
</Text>
</View>
</View>
<Svg
xmlns="http://www.w3.org/2000/svg"
width={24}
height={24}
style={{ transform: [{ rotate: dropdown ? "0deg" : "180deg" }] }}
>
<Path
d="M6.08 15.82h11.84a1.077 1.077 0 0 0 .76-1.84L13.499 8.8a2.131 2.131 0 0 0-3.01 0l-1.97 1.97-3.21 3.21a1.082 1.082 0 0 0 .771 1.84Z"
fill="#c6c6c6"
data-name="vuesax/bold/arrow-down"
/>
</Svg>
</Pressable>
{dropdown && (
<View
style={tw(`flex flex-col w-full pr-16 ${ios ? "items-end" : " "}`)}
>
<View
style={[
tw(
`flex items-center w-full pb-3 mb-4 ${
ios ? "flex-row-reverse" : "flex-row "
}`
),
{
borderBottomWidth: 1,
borderColor: Colors.theme1[colorScheme].grayE3,
},
]}
>
{user?.picFileId ? (
<Image
source={{ uri: "https://dnvn.ir/api/v1/" + user.picFileId }}
style={[tw("rounded-full"), { width: 30, height: 30 }]}
/>
) : (
<View
style={[
tw("rounded-full bg-gray-400"),
{ minWidth: 30, minHeight: 30, zIndex: 1 },
]}
></View>
)}
<Text
style={{
fontSize: fontSize.base,
color: Colors.theme1[colorScheme].gray20,
fontFamily: "regular",
}}
>
{user?.firstName + " " + user?.lastName}
</Text>
</View>
<View
style={[
tw(
`flex items-center w-full pb-3 mb-3 ${
ios ? "flex-row-reverse" : "flex-row "
}`
),
{
borderBottomWidth: 1,
borderColor: Colors.theme1[colorScheme].grayE3,
},
]}
>
<Text
style={{
fontSize: fontSize.base,
fontFamily: "bold",
color: Colors.theme1[colorScheme].gray20,
}}
>
افزودن حساب کاربری جدید
</Text>
<Text
style={{
marginRight: 5,
marginTop: 3,
fontSize: fontSize.xl2,
fontFamily: "bold",
color: Colors.theme1[colorScheme].gray20,
}}
>
+
</Text>
</View>
</View>
)}
</View>
);
};
const mapStateToProps = (state) => ({
user: JSON.parse(state.user.status),
});
export default connect(mapStateToProps)(User);