reza added profile mobile

temp
Reza_ashrafi 3 years ago
parent 4de8f441c9
commit 51258aa00b
  1. 10
      src/assets/icons/address-green.svg
  2. 7
      src/assets/icons/book-green.svg
  3. 6
      src/assets/icons/bookmark-green.svg
  4. 7
      src/assets/icons/cart-green.svg
  5. 5
      src/assets/icons/user-green.svg
  6. 10
      src/assets/icons/video-green.svg
  7. 13
      src/views/Dashboard/index.js
  8. 82
      src/views/Dashboard/layouts/Mobile/List.js
  9. 311
      src/views/Dashboard/layouts/Mobile/ProfileAddress/index.js
  10. 182
      src/views/Dashboard/layouts/Mobile/ProfileBookmark/index.js
  11. 54
      src/views/Dashboard/layouts/Mobile/Trophy.js
  12. 72
      src/views/Dashboard/layouts/Mobile/User.js
  13. 10
      src/views/Product/Desktop/ProductOverAll/index.js
  14. 11
      src/views/Product/index.js
  15. 29
      src/views/Profile/index.js

@ -0,0 +1,10 @@
<svg id="arrow-square" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<g id="Group" transform="translate(5.34 6.75)">
<path id="Vector" d="M0,6.53V4.57A4.569,4.569,0,0,1,4.57,0H6.53" transform="translate(6.8 1.79)" fill="none" stroke="#37a865" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
<path id="Vector-2" data-name="Vector" d="M0,0H1.96A4.569,4.569,0,0,1,6.53,4.57V8.7" transform="translate(0.28 1.8)" fill="none" stroke="#37a865" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
<path id="Vector-3" data-name="Vector" d="M1.8,0,0,1.8,1.8,3.6" fill="none" stroke="#37a865" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
<path id="Vector-4" data-name="Vector" d="M0,0,1.8,1.8,0,3.6" transform="translate(11.52)" fill="none" stroke="#37a865" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
</g>
<path id="Vector-5" data-name="Vector" d="M7,20h6c5,0,7-2,7-7V7c0-5-2-7-7-7H7C2,0,0,2,0,7v6C0,18,2,20,7,20Z" transform="translate(2 2)" fill="none" stroke="#37a865" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
<path id="Vector-6" data-name="Vector" d="M0,0H24V24H0Z" fill="none" opacity="0"/>
</svg>

After

Width:  |  Height:  |  Size: 1.2 KiB

@ -0,0 +1,7 @@
<svg id="book" xmlns="http://www.w3.org/2000/svg" width="24" height="23.746" viewBox="0 0 24 23.746">
<path id="Vector" d="M20,13.886V1.98A1.959,1.959,0,0,0,17.83.017h-.06A19.029,19.029,0,0,0,10.7,2.355l-.17.109a1.121,1.121,0,0,1-1.06,0l-.25-.148A18.935,18.935,0,0,0,2.16.007,1.957,1.957,0,0,0,0,1.97V13.886a2.036,2.036,0,0,0,1.74,1.953l.29.039a25.941,25.941,0,0,1,7.44,2.407l.04.02a1.094,1.094,0,0,0,.96,0,25.705,25.705,0,0,1,7.46-2.427l.33-.039A2.036,2.036,0,0,0,20,13.886Z" transform="translate(2 2.662)" fill="none" stroke="#37a865" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
<path id="Vector-2" data-name="Vector" d="M0,0V15" transform="translate(12 5.236)" fill="none" stroke="#37a865" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
<path id="Vector-3" data-name="Vector" d="M2.25,0H0" transform="translate(17.705 8.4)" fill="none" stroke="#37a865" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
<path id="Vector-4" data-name="Vector" d="M3,0H0" transform="translate(16.918 11.369)" fill="none" stroke="#37a865" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
<path id="Vector-5" data-name="Vector" d="M0,0H24V23.746H0Z" transform="translate(24 23.746) rotate(180)" fill="none" opacity="0"/>
</svg>

After

Width:  |  Height:  |  Size: 1.3 KiB

@ -0,0 +1,6 @@
<svg id="archive-add" xmlns="http://www.w3.org/2000/svg" width="25.5" height="25.5" viewBox="0 0 25.5 25.5">
<path id="Vector" d="M5.313,0H0" transform="translate(10.094 11.316)" fill="none" stroke="#37a865" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
<path id="Vector-2" data-name="Vector" d="M0,0V5.313" transform="translate(12.75 8.723)" fill="none" stroke="#37a865" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
<path id="Vector-3" data-name="Vector" d="M14.344,0H4.1A4.111,4.111,0,0,0,0,4.1V19.072c0,1.912,1.371,2.72,3.049,1.8l5.185-2.879a2.251,2.251,0,0,1,1.987,0l5.185,2.879c1.679.935,3.049.128,3.049-1.8V4.1A4.127,4.127,0,0,0,14.344,0Z" transform="translate(3.528 2.125)" fill="none" stroke="#37a865" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
<path id="Vector-4" data-name="Vector" d="M0,0H25.5V25.5H0Z" fill="none" opacity="0"/>
</svg>

After

Width:  |  Height:  |  Size: 925 B

@ -0,0 +1,7 @@
<svg id="bag-2" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<path id="Vector" d="M0,5.662v-.97A4.773,4.773,0,0,1,4.06.022,4.5,4.5,0,0,1,9,4.5v1.38" transform="translate(7.5 2.008)" fill="none" stroke="#37a865" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
<path id="Vector-2" data-name="Vector" d="M5.751,14h6c4.02,0,4.74-1.61,4.95-3.57l.75-6c.27-2.44-.43-4.43-4.7-4.43h-8C.481,0-.219,1.99.051,4.43l.75,6C1.011,12.39,1.731,14,5.751,14Z" transform="translate(3.249 8)" fill="none" stroke="#37a865" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
<path id="Vector-3" data-name="Vector" d="M.495.5H.5" transform="translate(15.001 11.5)" fill="none" stroke="#37a865" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
<path id="Vector-4" data-name="Vector" d="M.495.5H.5" transform="translate(8 11.5)" fill="none" stroke="#37a865" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
<path id="Vector-5" data-name="Vector" d="M0,0H24V24H0Z" fill="none" opacity="0"/>
</svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

@ -0,0 +1,5 @@
<svg id="user" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<path id="Vector" d="M10,5A5,5,0,1,1,5,0,5,5,0,0,1,10,5Z" transform="translate(7 2)" fill="none" stroke="#37a865" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
<path id="Vector-2" data-name="Vector" d="M17.18,7c0-3.87-3.85-7-8.59-7S0,3.13,0,7" transform="translate(3.41 15)" fill="none" stroke="#37a865" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
<path id="Vector-3" data-name="Vector" d="M0,0H24V24H0Z" fill="none" opacity="0"/>
</svg>

After

Width:  |  Height:  |  Size: 584 B

@ -0,0 +1,10 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24.613" height="21.519" viewBox="0 0 24.613 21.519">
<g id="Group_2005" data-name="Group 2005" transform="translate(0.75 0.75)">
<g id="vuesax_linear_music-playlist" data-name="vuesax/linear/music-playlist">
<g id="music-playlist" transform="translate(0)">
<path id="Vector" d="M17.335,20.019H5.778c-3.467,0-5.778-2-5.778-6.673V6.673C0,2,2.311,0,5.778,0H17.335c3.467,0,5.778,2,5.778,6.673v6.673C23.113,18.017,20.8,20.019,17.335,20.019Z" fill="none" stroke="#37a865" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
</g>
</g>
<path id="Vector-2" data-name="Vector" d="M0,3.572V2.108C0,.23,1.329-.538,2.951.4l1.268.732,1.268.732c1.622.939,1.622,2.476,0,3.415L4.22,6.011l-1.268.732C1.329,7.681,0,6.913,0,5.035V3.572Z" transform="translate(8.204 6.438)" fill="none" stroke="#37a865" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 961 B

@ -5,12 +5,15 @@ import { publicApi } from "../../redux/actions";
//components
import Sidebar from "./layouts/SidebarMenu";
import Main from "./layouts/Main";
import User from "./layouts/Mobile/User";
import Trophy from "./layouts/Mobile/Trophy";
import List from "./layouts/Mobile/List";
export const Dashboard = ({ isMobile, headerOptions, setHeaderOptions }) => {
const [page, setPage] = useState(
localStorage?.getItem("dashboard") || "userItems"
);
useEffect(() => {
setHeaderOptions(headerOptions);
}, []);
@ -19,10 +22,12 @@ export const Dashboard = ({ isMobile, headerOptions, setHeaderOptions }) => {
localStorage.setItem("dashboard", page);
}, [page]);
return isMobile ? (
<div className=""></div>
<div className="flex-1 flex flex-col px-4">
<User />
<Trophy />
<List />
</div>
) : (
<div className="w-full">
<div className="gap-5 w-full h-screen pt-20 mx-auto flex flex-row bg-transparent justify-end">

@ -0,0 +1,82 @@
import React from "react";
import { connect } from "react-redux";
import { Link } from "react-router-dom";
import { useNavigate } from "react-router-dom";
//assets
import userGreenIcon from '../../../../assets/icons/user-green.svg';
import videoGreenIcon from '../../../../assets/icons/video-green.svg';
import cartGreenIcon from '../../../../assets/icons/cart-green.svg';
import bookmarkGreenIcon from '../../../../assets/icons/bookmark-green.svg';
import bookGreenIcon from '../../../../assets/icons/book-green.svg';
import addressGreenIcon from '../../../../assets/icons/address-green.svg';
const List = ({ mobile }) => {
const pages = [
{
icon: <img src={userGreenIcon} alt="" />,
name: "اطلاعات حساب کاربری",
link: "/CreateAddress",
},
{
icon: <img src={cartGreenIcon} />,
name: "سفارشات",
link: "/Orders",
},
{
icon: <img src={bookGreenIcon} />,
name: "کتابهای من",
link: "/AR",
},
{
icon: <img src={videoGreenIcon} />,
name: "دورههای من",
link: "#",
},
{
icon: <img src={bookmarkGreenIcon} />,
name: "لیست علاقهمندیها",
link: "/ProfileBookmark",
},
{
icon: <img src={addressGreenIcon} />,
name: "آدرسها",
link: "/ProfileAddress",
},
];
return (
<div className={`w-full mt-7`}>
{pages.map((page, index) => (
<Link
key={index}
to={page.link}
className={`w-full flex items-center justify-between mb-6 pb-4 flex-row shadow-sm`}
>
<div className={`flex items-center flex-row`}>
{page.icon}
<span className={`mt-1 mr-2.5 text-gray1 text-base font-medium`}>
{page.name}
</span>
</div>
<svg xmlns="http://www.w3.org/2000/svg" width={24} height={24}>
<path
d="M15.002 19.92 8.479 13.4a1.986 1.986 0 0 1 0-2.8l6.523-6.52"
fill="none"
stroke="#c6c6c6"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
/>
</svg>
</Link>
))}
</div>
);
};
const mapStateToProps = (state) => ({
mobile: state.publicApi.mobile,
});
export default connect(mapStateToProps)(List);

@ -0,0 +1,311 @@
import {
View,
Text,
Pressable,
TouchableOpacity,
Appearance,
ActivityIndicator,
SafeAreaView,
ScrollView,
StyleSheet,
Platform,
Dimensions,
StatusBar,
} from "react-native";
import React from "react";
import { connect } from "react-redux";
import { useNavigation } from "@react-navigation/native";
import { userAddress, userFactor } from "../../../../redux/actions";
import Svg, { G, Path } from "react-native-svg";
//components
import Navbar from "../../../../components/Navbar";
import CustomPressable from "../../../../components/Pressable";
import Empty from "../../../../components/Empty";
//style
import tw from "tailwind-rn";
import Colors from "../../../../constants/Colors";
import fontSize from "../../../../constants/fontSize";
const { height, width } = Dimensions.get("window");
const ios = Platform.OS === "ios";
const ProfileAddress = ({
addresses,
update,
getList,
userId,
userAddressId,
getFactorInfo,
loading,
closeBottomSheet,
mobile,
}) => {
const colorScheme = Appearance.getColorScheme();
const navigation = useNavigation();
const [height, setHeight] = React.useState(Dimensions.get("window").height);
const Location = ({ address, active }) => {
return (
<Pressable
style={[
{
backgroundColor:
userAddressId === address?.id
? Colors.theme1[colorScheme].greenCF + "0a"
: Colors.theme1[colorScheme].grayE3 + "44",
borderWidth: 2,
borderColor:
userAddressId === address?.id
? Colors.theme1[colorScheme].greenCF + "aa"
: Colors.theme1[colorScheme].grayE3,
},
tw(
`flex flex-row-reverse items-center w-full px-3 py-2 rounded-md mt-2`
),
]}
onPress={() =>
userAddressId === address?.id
? {}
: update({ userAddressId: address.id, userId })
}
>
<View style={tw("flex flex-1 mr-2")}>
{active && (
<View
style={tw("w-full flex flex-row-reverse justify-between mb-3")}
>
<View style={tw("flex flex-row-reverse items-center")}>
<Text
style={{
fontSize: fontSize.base,
fontFamily: "bold",
color: Colors.theme1[colorScheme].gray20,
}}
>
آدرس انتخابی شما
</Text>
<Text
style={{
fontSize: fontSize.xs,
fontFamily: "regular",
color: Colors.theme1[colorScheme].gray20,
marginRight: 10,
}}
>
فعال
</Text>
</View>
<Svg xmlns="http://www.w3.org/2000/svg" width={24} height={24}>
<G fill="#07612c" data-name="vuesax/linear/more">
<Path d="M10 19a2 2 0 1 0 2-2 2.006 2.006 0 0 0-2 2Z" />
<Path
data-name="Vector"
d="M10 5a2 2 0 1 0 2-2 2.006 2.006 0 0 0-2 2ZM10 12a2 2 0 1 0 2-2 2.006 2.006 0 0 0-2 2Z"
/>
</G>
</Svg>
</View>
)}
<View style={tw(`flex w-full ${active ? "" : "flex-row-reverse"}`)}>
<View style={tw("flex flex-1 mb-4")}>
<Text
style={[
{
fontFamily: "regular",
fontSize: mobile ? fontSize.sm : fontSize.lg,
lineHeight: 22,
textAlign: ios ? "right" : "auto",
},
]}
>
{"آدرس:" + " " + address.address}
</Text>
<Text
style={[
{
marginTop: mobile ? 4 : 8,
fontFamily: "regular",
fontSize: mobile ? fontSize.sm : fontSize.lg,
lineHeight: 22,
textAlign: ios ? "right" : "auto",
},
]}
>
{"نام:" + " " + address.firstName + " " + address.lastName}
</Text>
<Text
style={[
{
marginTop: mobile ? 4 : 8,
fontFamily: "regular",
fontSize: mobile ? fontSize.sm : fontSize.lg,
lineHeight: 22,
textAlign: ios ? "right" : "auto",
},
]}
>
{"کد پستی:" + " " + address.postalCode}
</Text>
<Text
style={[
{
marginTop: mobile ? 4 : 8,
fontFamily: "regular",
fontSize: mobile ? fontSize.sm : fontSize.lg,
lineHeight: 22,
textAlign: ios ? "right" : "auto",
},
]}
>
{"شماره تماس:" + " " + address.cellphone}
</Text>
</View>
{!active && (
<Svg xmlns="http://www.w3.org/2000/svg" width={24} height={24}>
<G
fill={Colors.theme1[colorScheme].gray20}
data-name="vuesax/linear/more"
>
<Path d="M10 19a2 2 0 1 0 2-2 2.006 2.006 0 0 0-2 2Z" />
<Path
data-name="Vector"
d="M10 5a2 2 0 1 0 2-2 2.006 2.006 0 0 0-2 2ZM10 12a2 2 0 1 0 2-2 2.006 2.006 0 0 0-2 2Z"
/>
</G>
</Svg>
)}
</View>
<CustomPressable
title={"مشاهده روی نقشه"}
backgroundColor={
active
? Colors.theme1[colorScheme].greenCF
: Colors.theme1[colorScheme].gray20 + "66"
}
color={"white"}
border={{ color: "#196EC0", width: 0 }}
width={"100%"}
onPress={() => {}}
/>
</View>
</Pressable>
);
};
React.useEffect(() => {
getFactorInfo({ userId });
getList();
}, []);
return (
<SafeAreaView
style={{
paddingTop: Platform.OS === "android" ? StatusBar.currentHeight : 0,
position: "relative",
backgroundColor: "white",
flex: 1,
paddingBottom: 20,
}}
>
<Navbar
headerOptions={{
logo: false,
menu: false,
hamburgerMenu: false,
title: "آدرسها",
bookmark: false,
qr: false,
back: true,
}}
/>
{addresses.length > 0 ? (
<ScrollView
contentContainerStyle={styles.contentContainerStyle}
style={[styles.container]}
onLayout={() => setHeight(Dimensions.get("window").height)}
>
<View style={tw("w-full mt-2 px-4")}>
<View style={tw("p-0 m-0 flex ")}>
{addresses.map((address, index) => (
<Location
address={address}
key={index}
active={userAddressId === address?.id}
/>
))}
</View>
</View>
</ScrollView>
) : (
<Empty text="هیچ آدرسی ثبت نشده :(" />
)}
<View style={tw("w-full px-4")}>
<TouchableOpacity
style={[
{
backgroundColor: Colors.theme1[colorScheme].greenCF + "05",
borderColor: Colors.theme1[colorScheme].greenCF,
borderWidth: 1.5,
},
tw(
`flex flex-row-reverse self-end justify-center py-2 rounded-md items-center mt-4 w-full`
),
]}
onPress={() => navigation.push("CreateAddress")}
>
<Text
style={{
fontFamily: "bold",
fontSize: fontSize.tiny,
color: Colors.theme1[colorScheme].greenCF,
}}
>
یک آدرس جدید اضافه کنید
</Text>
<Text
style={{
marginTop: 3,
marginRight: 5,
fontSize: fontSize.xl3,
color: Colors.theme1[colorScheme].greenCF,
fontFamily: "bold",
}}
>
+
</Text>
</TouchableOpacity>
</View>
</SafeAreaView>
);
};
const mapStateToProps = (state) => ({
userId: state.user.status?.id,
userAddressId: state.userFactor.info?.userAddressId,
loading: state.userFactor.loading,
addresses: state.userAddress.list,
mobile: state.publicApi.mobile,
});
const mapDispatchToProps = {
getFactorInfo: userFactor.info,
update: userFactor.update,
getList: userAddress.list,
};
export default connect(mapStateToProps, mapDispatchToProps)(ProfileAddress);
const styles = StyleSheet.create({
contentContainerStyle: {
paddingBottom: 100,
position: "relative",
},
container: {
backgroundColor: "white",
flexDirection: "column",
paddingVertical: 0,
paddingHorizontal: 0,
},
});

@ -0,0 +1,182 @@
import {
View,
Text,
Pressable,
Appearance,
SafeAreaView,
ScrollView,
StyleSheet,
Platform,
Dimensions,
StatusBar,
Image,
mobile,
} from "react-native";
import React from "react";
import { connect } from "react-redux";
import { useNavigation } from "@react-navigation/native";
import Svg, { Path } from "react-native-svg";
import { userFavorite } from "../../../../redux/actions";
//components
import Navbar from "../../../../components/Navbar";
import Empty from "../../../../components/Empty";
//style
import tw from "tailwind-rn";
import Colors from "../../../../constants/Colors";
import fontSize from "../../../../constants/fontSize";
//assets
import bookImage from "../../..//OrdersFollowUp/assets/b1.png";
const { height, width } = Dimensions.get("window");
const ios = Platform.OS === "ios";
const ProfileBookmark = ({ bookmarkList, getList }) => {
React.useEffect(() => {
getList();
}, []);
return (
<SafeAreaView
style={{
paddingTop: Platform.OS === "android" ? StatusBar.currentHeight : 0,
position: "relative",
backgroundColor: "white",
}}
>
<Navbar
headerOptions={{
logo: false,
menu: false,
hamburgerMenu: false,
title: "لیست علاقهمندیها",
bookmark: false,
qr: false,
back: true,
}}
/>
{bookmarkList?.length > 0 ? (
<ScrollView
contentContainerStyle={styles.contentContainerStyle}
style={styles.container}
>
<View style={tw("w-full mt-2 px-4")}>
<View style={tw("p-0 m-0 flex")}>
{bookmarkList?.map((bookmark, index) => (
<Bookmark key={index} bookmark={bookmark} />
))}
</View>
</View>
</ScrollView>
) : (
<Empty text="لیست علاقهمندیها خالی است." />
)}
</SafeAreaView>
);
};
const Bookmark = ({ bookmark }) => {
const colorScheme = Appearance.getColorScheme();
return (
<Pressable
style={[
tw("flex flex-row-reverse rounded-md justify-between px-3.5 py-2 bg-red-100"),
{
borderWidth: 1.5,
borderColor: Colors.theme1[colorScheme].greenCF,
},
]}
>
<View style={tw("flex flex-row-reverse items-end")}>
<Image
source={bookmark.image}
style={{
width: mobile ? width / 5 : width / 7,
minWidth: 80,
height: ((mobile ? width / 5 : width / 7) * 4) / 2.7,
minHeight: (80 * 4) / 2.7,
}}
/>
<View style={tw(`flex mr-2 ${ios ? "items-end" : ""}`)}>
<Text
style={{
fontFamily: "bold",
fontSize: fontSize.lg,
color: Colors.theme1[colorScheme].gray20,
}}
>
{bookmark.name}
</Text>
<Text
style={{
marginTop: 5,
fontFamily: "regular",
fontSize: fontSize.base,
color: Colors.theme1[colorScheme].gray20,
}}
>
{bookmark.grade}
</Text>
</View>
</View>
<Svg
data-name="vuesax/linear/archive-add"
xmlns="http://www.w3.org/2000/svg"
width={29.778}
height={29.778}
>
<Path
d="M20.869 2.482H8.908a4.8 4.8 0 0 0-4.789 4.789v17.483c0 2.233 1.6 3.176 3.561 2.1l6.055-3.362a2.628 2.628 0 0 1 2.32 0l6.055 3.362c1.96 1.092 3.561.149 3.561-2.1V7.271a4.819 4.819 0 0 0-4.802-4.789Z"
fill="#37a865"
/>
<Path
data-name="Vector"
d="M17.987 13.214h-6.2"
fill="none"
stroke="#fff"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
/>
</Svg>
</Pressable>
);
};
const mapStateToProps = (state) => ({
loading: state.userFactor.loading,
mobile: state.publicApi.mobile,
bookmarkList: state.userFavorite.list,
});
const mapDispatchToProps = {
getList: userFavorite.list,
};
export default connect(mapStateToProps, mapDispatchToProps)(ProfileBookmark);
const styles = StyleSheet.create({
contentContainerStyle: {
paddingBottom: 100,
position: "relative",
},
container: {
backgroundColor: "white",
flexDirection: "column",
paddingVertical: 0,
paddingHorizontal: 0,
},
});
// ProfileBookmark.defaultProps = {
// bookmarkList: [
// {
// name: "کتاب آموزشی علوم تجربی",
// grade: "پایه ششم ابتدایی",
// image: bookImage,
// },
// ],
// };

@ -0,0 +1,54 @@
import React from "react";
import { connect } from "react-redux";
import { Link } from "react-router-dom";
const Trophy = ({}) => {
const [dropdown, setDropdown] = React.useState(true);
return (
<div
className={`w-full flex py-5 px-3 justify-between items-center flex-row bg-yellow4 bg-opacity-40`}
>
<div className={`flex flex-row items-center`}>
<svg xmlns="http://www.w3.org/2000/svg" width={23.862} height={23.862}>
<g fill="none" stroke="#d6d020" data-name="vuesax/linear/cup">
<path
d="M12.08 16.405v2.088"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="1.5"
/>
<path
data-name="Vector"
strokeWidth="1.5"
d="M7.109 21.874h9.942v-.995a1.994 1.994 0 0 0-1.988-1.988H9.097a1.994 1.994 0 0 0-1.988 1.988v.994Z"
/>
<path
data-name="Vector"
d="M6.115 21.873h11.931M11.931 15.907a6.955 6.955 0 0 1-6.96-6.959V5.965a3.976 3.976 0 0 1 3.977-3.977h5.965a3.976 3.976 0 0 1 3.977 3.977v2.983a6.955 6.955 0 0 1-6.959 6.959Z"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="1.5"
/>
<path
data-name="Vector"
d="M5.438 11.583a4.831 4.831 0 0 1-1.919-1.193 5.3 5.3 0 0 1-1.491-3.579 2.461 2.461 0 0 1 2.486-2.486h.646a3.734 3.734 0 0 0-.3 1.491v2.983a7.007 7.007 0 0 0 .578 2.784ZM18.423 11.583a4.831 4.831 0 0 0 1.919-1.193 5.3 5.3 0 0 0 1.491-3.579 2.461 2.461 0 0 0-2.485-2.486h-.647a3.734 3.734 0 0 1 .3 1.491v2.983a7.007 7.007 0 0 1-.578 2.784Z"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="1.5"
/>
</g>
</svg>
<strong className="text-sm mr-2.5 text-green4F">
{"امتیاز شما" + " " + 14560}
</strong>
</div>
<Link to="#" className="text-sm text-green4F">
مشاهده جوایز
</Link>
</div>
);
};
const mapStateToProps = (state) => ({});
export default connect(mapStateToProps)(Trophy);

@ -0,0 +1,72 @@
import React from "react";
import { connect } from "react-redux";
const User = ({ user, mobile }) => {
const [dropdown, setDropdown] = React.useState(true);
return (
<div className={`w-full`}>
<button
className={`w-full mt-2 mb-2 flex flex-row justify-between items-center border-none`}
onClick={() => setDropdown(!dropdown)}
>
<div className={`flex items-center flex-row`}>
{user?.picFileIds ? (
<img
src={"https://dnvn.ir/api/v1/" + user.picFileIds}
className={`rounded-full`}
style={{ width: 70, height: 70 }}
/>
) : (
<div
className={"rounded-full"}
style={{
width: 70,
height: 70,
backgroundColor: "#ddd",
}}
></div>
)}
<div className={`flex flex-col mr-1`}>
<strong className={`text-base font-semibold text-gray1`}>
{user?.firstName + " " + user?.lastName}
</strong>
<span className="mt-2 text-sm text-gray1">{user?.cellphone}</span>
</div>
</div>
<svg
xmlns="http://www.w3.org/2000/svg"
width={24}
height={24}
className={`transform ${dropdown ? "rotate-0" : "rotate-180"}`}
>
<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>
</button>
<div
className={`flex w-full pr-16 transition-all overflow-hidden ${
dropdown ? "max-h-40" : "max-h-0"
}`}
>
<div
className={`flex items-center w-full pb-3 mb-3 flex-row border-b border-solid border-gray-100`}
>
<strong className="text-sm text-gray1">
افزودن حساب کاربری جدید
</strong>
<span className="mr-1 mt-1 text-xl text-gray1">+</span>
</div>
</div>
</div>
);
};
const mapStateToProps = (state) => ({
user: state.user.status,
mobile: state.publicApi.mobile,
});
export default connect(mapStateToProps)(User);

@ -77,7 +77,13 @@ export const ProductOverAll = ({ book, grades, isDark, loading }) => {
radius={false}
twPaddings="py-4 px-12"
/>
<Button
<a
href={`https://dnvn.ir/xpdf/${book?.sampleFileId}`}
className="flex-1 py-4 border border-solid border-red19 rounded-md text-tiny font-bold text-red19 text-center"
>
مشاهده نمونه
</a>
{/* <Button
title="مشاهده نمونه"
backgroundColor={isDark ? "bg-transparent" : "bg-white"}
border={{
@ -90,7 +96,7 @@ export const ProductOverAll = ({ book, grades, isDark, loading }) => {
color={isDark ? "text-white" : "font-bold text-red19"}
onClick={() => {}}
disabled={true}
/>
/> */}
</div>
</div>
<div className="flex py-4">

@ -114,7 +114,7 @@ export const Product = ({
onClick={() => setType("digital")}
/>
</div>
<div className="w-full flex flex-row justify-between items-center mt-4">
<div className="w-full flex flex-row justify-between items-center mt-4 gap-2">
<Button
onClick={() =>
proxy.status()
@ -142,8 +142,11 @@ export const Product = ({
width="65%"
color="text-white"
/>
<Button
title="مشاهده نمونه"
<a href={`https://dnvn.ir/xpdf/${book?.sampleFileId}`} className="flex-1 py-3 border border-solid border-gray-300 rounded-md text-base font-bold text-blueC0 text-center">
مشاهده نمونه
</a>
{/* <Button
title=""
backgroundColor={isDark ? "bg-transparent" : "bg-white"}
border={{
color: isDark ? "#ffffff55" : "#196EC055",
@ -152,7 +155,7 @@ export const Product = ({
width="33%"
color={isDark ? "text-white" : "text-blueC0"}
onClick={() => {}}
/>
/> */}
</div>
<div className="w-full flex flex-row justify-between items-center mt-4">
<Link

@ -1,14 +1,27 @@
import React from 'react'
import { connect } from 'react-redux'
import React, { useState, useEffect } from "react";
import { connect } from "react-redux";
//components
import User from "./components/User";
import Trophy from "./components/Trophy";
import List from "./components/List";
function Profile({}) {
useEffect(() => {}, []);
export const Profile = ({}) => {
return (
<div>Profile</div>
)
<div>
<User />
<Trophy />
<List />
</div>
);
}
const mapStateToProps = (state) => ({})
const mapStateToProps = (state) => ({});
const mapDispatchToProps = {}
const mapDispatchToProps = {};
export default connect(mapStateToProps, mapDispatchToProps)(Profile)
export default connect(mapStateToProps, mapDispatchToProps)(Profile);
Loading…
Cancel
Save