reza added profile

master
Reza_ashrafi 3 years ago
parent c7cc797b83
commit 26c33c70ca
  1. 6
      App.js
  2. 0
      assets/fonts/Farsi/Black.ttf
  3. 0
      assets/fonts/Farsi/Bold.ttf
  4. 0
      assets/fonts/Farsi/DemiBold.ttf
  5. 17
      navigation/index.js
  6. 4
      src/components/Drawer.js
  7. 2
      src/components/Navbar.js
  8. 12
      src/components/Search.js
  9. 8
      src/redux/actions/public.js
  10. 15
      src/screens/Home/components/Blogs.js
  11. 14
      src/screens/Home/components/MyBooks.js
  12. 20
      src/screens/Home/components/Videos.js
  13. 4
      src/screens/Products/components/Header.js
  14. 4
      src/screens/Profile/arrow-left.svg
  15. 246
      src/screens/Profile/components/List.js
  16. 85
      src/screens/Profile/components/Trophy.js
  17. 162
      src/screens/Profile/components/User.js
  18. 96
      src/screens/Profile/index.js
  19. 134
      src/screens/Video/components/Season.js
  20. 97
      src/screens/Video/index.js
  21. 117
      src/screens/VideoDisplay/components/Season/index.js
  22. 46
      src/screens/VideoDisplay/index.js
  23. 68
      src/screens/Videos/components/MostViewedVideo.js
  24. 20
      src/screens/Videos/components/NewestVideo.js
  25. 5
      src/screens/Videos/index.js

@ -9,9 +9,9 @@ import store from './src/redux/store';
const App = () => {
let [fontsLoaded] = useFonts({
light : require("./assets/fonts/Farsi/Light.ttf"),
regular: require("./assets/fonts/Farsi/Regular.ttf"),
bold: require("./assets/fonts/Farsi/Medium.ttf"),
light : require("./assets/fonts/Farsi/Regular.ttf"),
regular: require("./assets/fonts/Farsi/Medium.ttf"),
bold: require("./assets/fonts/Farsi/DemiBold.ttf"),
});
if (!fontsLoaded) {

@ -29,6 +29,7 @@ import Tests from "../src/screens/Tests";
import ShoppingCart from "../src/screens/ShoppingCart";
import DeliveryForm from "../src/screens/DeliveryForm";
import Address from "../src/screens/Address";
import Profile from "../src/screens/Profile";
//style
import fontSize from "../src/constants/fontSize";
@ -61,8 +62,8 @@ const BottomTabNavigator = () => {
}}
>
<Tab.Screen
name="Profile"
component={Login}
name="ProfileTab"
component={PROFILEStackScreen}
options={{
title: "پروفایل",
tabBarIcon: ({ focused, color }) =>
@ -384,17 +385,15 @@ const CARTStackScreen = () => {
);
}
const AuthStack = createNativeStackNavigator();
const AuthStackScreen = () => {
const PROFILEStack = createNativeStackNavigator();
const PROFILEStackScreen = () => {
return (
<AuthStack.Navigator
<PROFILEStack.Navigator
screenOptions={{ headerShown: false }}
// initialRouteName="Splash"
>
<AuthStack.Screen name="Splash" component={Splash} />
<AuthStack.Screen name="Login" component={Login} />
<AuthStack.Screen name="Otp" component={Otp} />
</AuthStack.Navigator>
<PROFILEStack.Screen name="Profile" component={Profile} />
</PROFILEStack.Navigator>
);
};

@ -164,7 +164,7 @@ const Drawer = ({ position, setBoxPosition, user }) => {
<Text
style={{
fontSize: fontSize.lg,
color: Colors.theme1[colorScheme].black,
color: "white",
fontFamily: "bold",
}}
>
@ -173,7 +173,7 @@ const Drawer = ({ position, setBoxPosition, user }) => {
<Text
style={{
fontSize: fontSize.tiny,
color: Colors.theme1[colorScheme].black,
color: "white",
fontFamily: "bold",
}}
>

@ -67,7 +67,7 @@ const Navbar = ({ notification, setBoxPosition, headerOptions }) => {
style={{
fontFamily: "bold",
fontSize: fontSize.xl,
color: Color.theme1.light.blue5,
color: Color.theme1[colorScheme].green79,
paddingRight: 16,
}}
>

@ -29,12 +29,12 @@ const Search = ({
fontSize: fontSize.tiny,
color: Colors.theme1[colorScheme].gray2077,
borderWidth: 0.5,
borderColor: Colors.theme1[colorScheme].gray2077,
paddingVertical: 4,
borderColor: Colors.theme1[colorScheme].gray20,
paddingVertical: 10,
paddingHorizontal: 10,
direction: direction,
textAlign: textAlign,
backgroundColor: Colors.theme1[colorScheme].grayF9,
backgroundColor: Colors.theme1[colorScheme].white,
fontFamily : 'regular'
},
});
@ -44,11 +44,11 @@ const Search = ({
style={[styles.inputStyle, tw('rounded-md')]}
onChangeText={text => onChange(text)}
placeholder={placeholder}
placeholderTextColor={Colors.theme1[colorScheme].grayCC}
placeholderTextColor={Colors.theme1[colorScheme].gray2077}
value={value}
/>
<Pressable style={tw('absolute left-3 top-0 inset-y-2')}>
<AntDesign name="search1" size={18} color="#52796F" />
<Pressable style={tw('absolute left-3 top-0 inset-y-3.5')}>
<AntDesign name="search1" size={20} color="#52796F" />
</Pressable>
</View>
);

@ -7,9 +7,11 @@ const publicApi = {
setFaqActive: (data) => async (dispatch) =>
await dispatch({ type: "public/faq/activate", data: data }),
bookInfo:
(data = {}) =>
async (dispatch) =>
await proxy.get("public/vod/bookCourse", data, { dispatch }),
(data = {}, data2 = {}) =>
async (dispatch) => {
await proxy.get("public/vod/bookCourse", data, { dispatch });
await proxy.get("book/info", data2, { dispatch });
},
bookSection:
(data = {}) =>
async (dispatch) =>

@ -6,7 +6,8 @@ import {
Dimensions,
TouchableOpacity,
FlatList,
Pressable
Pressable,
Appearance
} from "react-native";
import { connect } from "react-redux";
import Svg, { G, Path } from "react-native-svg";
@ -16,7 +17,7 @@ import Header from "../components/Header";
//Style
import tw from "tailwind-rn";
import Color from "../../../constants/Colors";
import Colors from "../../../constants/Colors";
import fontSize from "../../../constants/fontSize";
//asssets
@ -25,6 +26,7 @@ import userImage from "../assets/user.png";
const { width } = Dimensions.get("window");
function Blogs({ blogs }) {
const colorScheme = Appearance.getColorScheme();
const Blog = ({ blog }) => {
return (
<Pressable
@ -44,13 +46,14 @@ function Blogs({ blogs }) {
<View
style={[
{ transform: [{ translateY: -20 }], marginHorizontal: 10 },
tw("flex flex-col bg-white rounded-md p-2"),
tw("flex flex-col justify-between bg-white rounded-md p-2"),
{
shadowColor: "#000",
shadowOffset: { width: 0, height: 1 },
shadowOpacity: 0.8,
shadowRadius: 2,
elevation: 5,
minHeight : 70
},
]}
>
@ -58,7 +61,7 @@ function Blogs({ blogs }) {
style={[
tw("mb-2"),
{
color: Color.theme1.light.blue7,
color: Colors.theme1[colorScheme].gray20,
fontFamily: "bold",
fontSize: fontSize.tiny,
},
@ -75,7 +78,7 @@ function Blogs({ blogs }) {
<Text
style={[
{
color: Color.theme1.light.blue5,
color: Colors.theme1[colorScheme].gray20,
fontFamily: "regular",
fontSize: fontSize.sm,
},
@ -89,7 +92,7 @@ function Blogs({ blogs }) {
style={[
tw("ml-1"),
{
color: Color.theme1.light.blue5,
color: Colors.theme1[colorScheme].gray20,
fontFamily: "regular",
fontSize: fontSize.sm,
},

@ -5,7 +5,7 @@ import {
TouchableOpacity,
FlatList,
Appearance,
Platform
Platform,
} from "react-native";
import tw from "tailwind-rn";
import fontSize from "../../../constants/fontSize";
@ -19,7 +19,7 @@ import Progress from "../../../components/Progress";
//Color
import Color from "../../../constants/Colors";
const ios = Platform.OS === 'ios';
const ios = Platform.OS === "ios";
function MyBooks({ books, grades }) {
const colorScheme = Appearance.getColorScheme();
@ -38,8 +38,8 @@ function MyBooks({ books, grades }) {
style={[
tw("rounded-md"),
{
height: 160,
width: 110,
minHeight: 160,
minWidth: 110,
},
]}
/>
@ -47,7 +47,7 @@ function MyBooks({ books, grades }) {
style={[
tw("mt-2 pr-1"),
{
color: Color.theme1.light.blue6,
color: Colors.theme1[colorScheme].gray20,
fontFamily: "bold",
fontSize: fontSize.base,
},
@ -59,9 +59,9 @@ function MyBooks({ books, grades }) {
style={[
tw("pr-1"),
{
color: Color.theme1.light.blue5,
color: Colors.theme1[colorScheme].gray20,
fontFamily: "light",
fontSize: fontSize.base,
fontSize: fontSize.tiny,
},
]}
>

@ -1,4 +1,11 @@
import { View, Text, Image, TouchableOpacity, FlatList } from "react-native";
import {
View,
Text,
Image,
TouchableOpacity,
FlatList,
Appearance,
} from "react-native";
import { useNavigation } from "@react-navigation/native";
import tw from "tailwind-rn";
import { connect } from "react-redux";
@ -8,10 +15,11 @@ import Progress from "../../../components/Progress";
import Header from "../components/Header";
//style
import Color from "../../../constants/Colors";
import Colors from "../../../constants/Colors";
import fontSize from "../../../constants/fontSize";
function Videos({ videos, grades }) {
const colorScheme = Appearance.getColorScheme();
const Video = ({ video }) => {
const navigation = useNavigation();
return (
@ -33,9 +41,9 @@ function Videos({ videos, grades }) {
style={[
tw("mt-2 pr-1"),
{
color: Color.theme1.light.blue6,
color: Colors.theme1[colorScheme].gray20,
fontFamily: "bold",
fontSize: fontSize.tiny,
fontSize: fontSize.base,
},
]}
>
@ -45,9 +53,9 @@ function Videos({ videos, grades }) {
style={[
tw("mt-1 pr-1"),
{
color: Color.theme1.light.blue5,
color: Colors.theme1[colorScheme].gray20,
fontFamily: "light",
fontSize: fontSize.sm,
fontSize: fontSize.tiny,
},
]}
>

@ -13,13 +13,13 @@ import Select from "../../../components/Select";
const Header = ({ setFilterOptions, filterOptions, levels, productTypes }) => {
return (
<View style={tw("flex flex-col px-4 h-28 bg-white")}>
<View style={tw("flex flex-col px-4 h-32 bg-white")}>
<Search
onChange={(val) => setFilterOptions({ ...filterOptions, search: val })}
placeholder={"نام کتاب یا دوره را جستجو کنید"}
/>
<View
style={[tw("flex flex-1 flex-row justify-between items-center my-2")]}
style={[tw("flex flex-1 flex-row justify-between items-center")]}
>
<Select
defaultValue={productTypes[0]}

@ -0,0 +1,4 @@
<svg id="arrow-left" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<path id="Vector" d="M7.1,15.84.577,9.32a1.986,1.986,0,0,1,0-2.8L7.1,0" transform="translate(7.902 4.08)" fill="none" stroke="#c6c6c6" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
<path id="Vector-2" data-name="Vector" d="M0,0H24V24H0Z" transform="translate(24 24) rotate(180)" fill="none" opacity="0"/>
</svg>

After

Width:  |  Height:  |  Size: 438 B

@ -0,0 +1,246 @@
import {
View,
Text,
Image,
Appearance,
Platform,
TouchableOpacity,
} from "react-native";
import React from "react";
import { connect } from "react-redux";
import Svg, { Path, G } 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 List = ({}) => {
const colorScheme = Appearance.getColorScheme();
const [dropdown, setDropdown] = React.useState(true);
const pages = [
{
icon: (
<Svg xmlns="http://www.w3.org/2000/svg" width={24} height={24}>
<Path
d="M17 7a5 5 0 1 1-5-5 5 5 0 0 1 5 5Z"
fill="none"
stroke="#37a865"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
/>
<Path
data-name="Vector"
d="M20.59 22c0-3.87-3.85-7-8.59-7s-8.59 3.13-8.59 7"
fill="none"
stroke="#37a865"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
/>
</Svg>
),
name: "اطلاعات حساب کاربری",
},
{
icon: (
<Svg xmlns="http://www.w3.org/2000/svg" width={24} height={24}>
<Path
d="M7.5 7.67V6.7a4.773 4.773 0 0 1 4.06-4.67 4.5 4.5 0 0 1 4.94 4.478v1.38"
fill="none"
stroke="#37a865"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
/>
<Path
data-name="Vector"
d="M9 22h6c4.02 0 4.74-1.61 4.95-3.57l.75-6C20.97 9.99 20.27 8 16 8H8c-4.27 0-4.97 1.99-4.7 4.43l.75 6C4.26 20.39 4.98 22 9 22Z"
fill="none"
stroke="#37a865"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
/>
<Path
data-name="Vector"
d="M15.496 12h.005M8.495 12H8.5"
fill="none"
stroke="#37a865"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={2}
/>
</Svg>
),
name: "سفارشات",
},
{
icon: (
<Svg xmlns="http://www.w3.org/2000/svg" width={24} height={23.746}>
<Path
d="M22 16.548V4.642a1.959 1.959 0 0 0-2.17-1.963h-.06a19.029 19.029 0 0 0-7.07 2.338l-.17.109a1.121 1.121 0 0 1-1.06 0l-.25-.148a18.935 18.935 0 0 0-7.06-2.309A1.957 1.957 0 0 0 2 4.632v11.916a2.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 22 16.548Z"
fill="none"
stroke="#37a865"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
/>
<Path
data-name="Vector"
d="M12 5.236v15M19.955 8.4h-2.25M19.918 11.369h-3"
fill="none"
stroke="#37a865"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
/>
</Svg>
),
name: "کتابهای من",
},
{
icon: (
<Svg xmlns="http://www.w3.org/2000/svg" width={24.613} height={21.519}>
<G data-name="Group 2005">
<Path
d="M18.085 20.769H6.528c-3.467 0-5.778-2-5.778-6.673V7.423C.75 2.75 3.061.75 6.528.75h11.557c3.467 0 5.778 2 5.778 6.673v6.673c0 4.671-2.313 6.673-5.778 6.673Z"
fill="none"
stroke="#37a865"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
data-name="vuesax/linear/music-playlist"
/>
<Path
data-name="Vector"
d="M8.954 10.76V9.296c0-1.878 1.329-2.646 2.951-1.708l1.268.732 1.268.732c1.622.939 1.622 2.476 0 3.415l-1.267.732-1.268.732c-1.623.938-2.952.17-2.952-1.708V10.76Z"
fill="none"
stroke="#37a865"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
/>
</G>
</Svg>
),
name: "دورههای من",
},
{
icon: (
<Svg xmlns="http://www.w3.org/2000/svg" width={25.5} height={25.5}>
<Path
d="M15.407 11.316h-5.313"
fill="none"
stroke="#37a865"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
/>
<Path
data-name="Vector"
d="M12.75 8.723v5.313M17.872 2.125H7.628a4.111 4.111 0 0 0-4.1 4.1v14.972c0 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.8V6.225a4.127 4.127 0 0 0-4.111-4.1Z"
fill="none"
stroke="#37a865"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
/>
</Svg>
),
name: "لیست علاقهمندیها",
},
{
icon: (
<Svg xmlns="http://www.w3.org/2000/svg" width={24} height={24}>
<G
fill="none"
stroke="#37a865"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
>
<Path d="M12.14 15.07v-1.96a4.569 4.569 0 0 1 4.57-4.57h1.96" />
<Path
data-name="Vector"
d="M5.62 8.55h1.96a4.569 4.569 0 0 1 4.57 4.57v4.13"
/>
<Path
data-name="Vector"
d="m7.14 6.75-1.8 1.8 1.8 1.8M16.86 6.75l1.8 1.8-1.8 1.8"
/>
</G>
<Path
data-name="Vector"
d="M9 22h6c5 0 7-2 7-7V9c0-5-2-7-7-7H9C4 2 2 4 2 9v6c0 5 2 7 7 7Z"
fill="none"
stroke="#37a865"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
/>
</Svg>
),
name: "آدرسها",
},
];
return (
<View style={tw(`w-full flex-col mt-8 ${ios ? "items-end" : ""}`)}>
{pages.map((page, index) => (
<TouchableOpacity
key={index}
style={[
tw(
`w-full flex items-center justify-between mb-4 pb-4 ${
ios ? "flex-row-reverse" : "flex-row"
}`
),
{
borderBottomWidth: 1,
borderColor: Colors.theme1[colorScheme].grayE3 + "aa",
},
]}
>
<View
style={tw(
`flex items-center ${ios ? "flex-row-reverse" : "flex-row"}`
)}
>
{page.icon}
<Text
style={{
fontFamily: "light",
marginTop: 5,
marginRight: 10,
color: Colors.theme1[colorScheme].gray20,
}}
>
{page.name}
</Text>
</View>
<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>
</TouchableOpacity>
))}
</View>
);
};
const mapStateToProps = (state) => ({});
export default connect(mapStateToProps)(List);

@ -0,0 +1,85 @@
import { View, Text, Appearance, Platform, Pressable } from "react-native";
import React from "react";
import { connect } from "react-redux";
import Svg, { G, 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 Trophy = ({}) => {
const colorScheme = Appearance.getColorScheme();
const [dropdown, setDropdown] = React.useState(true);
return (
<View
style={[
tw(
`w-full flex py-4 px-3 justify-between ${
ios ? "flex-row-reverse" : "flex-row"
}`
),
{ backgroundColor: Colors.theme1[colorScheme].yellow2 },
]}
>
<View style={[tw(`flex ${ios ? "flex-row-reverse" : "flex-row"}`)]}>
<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>
<Text
style={{
fontFamily: "bold",
fontSize: fontSize.lg,
marginRight: 10,
color: Colors.theme1[colorScheme].green79,
}}
>
{"امتیاز شما" + " " + 14560}
</Text>
</View>
<Pressable>
<Text
style={{
fontFamily: "light",
fontSize: fontSize.tiny,
color: Colors.theme1[colorScheme].green79,
}}
>
مشاهده جوایز
</Text>
</Pressable>
</View>
);
};
const mapStateToProps = (state) => ({});
export default connect(mapStateToProps)(Trophy);

@ -0,0 +1,162 @@
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);

@ -1,13 +1,93 @@
import React from 'react'
import { View, Text } from 'react-native';
import {connect} from 'react-redux';
import React, { useState, useEffect } from "react";
import {
View,
Text,
ScrollView,
Dimensions,
StyleSheet,
Pressable,
SafeAreaView,
StatusBar,
LayoutAnimation,
Appearance,
} from "react-native";
import { connect } from "react-redux";
import { useNavigation } from "@react-navigation/native";
//components
import Navbar from "../../components/Navbar";
import Drawer from "../../components/Drawer";
import User from "./components/User";
import Trophy from "./components/Trophy";
import List from "./components/List";
//style
import fontSize from "../../constants/fontSize";
import Colors from "../../constants/Colors";
import tw from "tailwind-rn";
const { width, height } = Dimensions.get("window");
function Profile({}) {
const navigation = useNavigation();
const colorScheme = Appearance.getColorScheme();
const [position, setPosition] = useState("100%");
useEffect(() => {}, []);
const setBoxPosition = () => {
LayoutAnimation.configureNext(LayoutAnimation.Presets.easeInEaseOut);
setPosition(position === "100%" ? "0%" : "100%");
};
return (
<View>
<Text></Text>
</View>
)
<SafeAreaView
style={{
paddingTop: Platform.OS === "android" ? StatusBar.currentHeight : 0,
position: "relative",
}}
>
<Navbar
setBoxPosition={setBoxPosition}
headerOptions={{
logo: false,
menu: false,
hamburgerMenu: false,
title: "حساب کاربری",
bookmark: false,
qr: false,
back: false,
}}
/>
<Drawer setBoxPosition={setBoxPosition} position={position} />
<ScrollView
contentContainerStyle={styles.contentContainerStyle}
style={styles.container}
>
<User />
<Trophy />
<List />
</ScrollView>
</SafeAreaView>
);
}
export default Profile;
const mapStateToProps = (state) => ({});
const mapDispatchToProps = {};
export default connect(mapStateToProps, mapDispatchToProps)(Profile);
const styles = StyleSheet.create({
contentContainerStyle: {
paddingBottom: 100,
position: "relative",
},
container: {
width: Dimensions.get("window").width,
backgroundColor: "white",
flexDirection: "column",
paddingVertical: 5,
paddingHorizontal: 16,
},
});

@ -1,6 +1,6 @@
import React from "react";
import { View, Text, Pressable, TouchableOpacity } from "react-native";
import {SimpleLineIcons} from '@expo/vector-icons';
import { View, Text, Pressable, Appearance } from "react-native";
import { SimpleLineIcons } from "@expo/vector-icons";
import { connect } from "react-redux";
import { publicApi } from "../../../redux/actions";
import tw from "tailwind-rn";
@ -20,67 +20,77 @@ const duration = (value) => {
);
};
const Season = ({ season, toggle, activeSeason, realSeasons, seasonName }) => {
const Season = ({
season,
toggle,
activeSeason,
realSeasons,
seasonName,
id,
}) => {
// const [selectedSeason, setSelectedSeason] = useState(null);
const colorScheme = Appearance.getColorScheme();
const navigation = useNavigation();
const Unit = ({ unit }) => {
const Unit = ({ unit, index }) => {
return (
<View
style={[
tw("w-full flex flex-col rounded-md overflow-hidden mb-3"),
{ borderWidth: 1, borderColor: Colors.theme1.light.blue3 },
tw("w-full flex flex-col overflow-hidden mb-3"),
{
borderBottomWidth: 1,
borderColor: Colors.theme1[colorScheme].grayE3,
},
]}
>
<View
style={[
tw(
"w-full flex flex-row-reverse justify-between items-center py-2 px-3"
"w-full flex flex-row-reverse justify-between items-center py-2 px-0"
),
{
borderBottomWidth: 1,
borderColor: Colors.theme1.light.blue3,
},
]}
>
<Text
style={[
{
fontFamily: "regular",
fontFamily: "bold",
fontSize: fontSize.base,
color: Colors.theme1.light.blue5,
color: Colors.theme1[colorScheme].green79,
},
]}
>
{unit.name}
</Text>
<View style={tw("flex flex-row-reverse items-center")}>
<Text
style={[
{
fontFamily: "regular",
fontSize: fontSize.base,
color: Colors.theme1.light.blue5,
color: Colors.theme1[colorScheme].green79,
},
]}
>
{duration(unit.duration)}
</Text>
</View>
<View style={[tw("w-full flex flex-row-reverse")]}>
{1 && (
<Pressable
style={[
tw("flex flex-1 flex-row items-center py-2 px-2"),
tw("py-1 rounded-sm px-4 mr-4"),
{
borderLeftWidth: 1,
borderColor: Colors.theme1.light.blue3,
borderWidth: 1,
borderColor:
Number(index) === 0
? Colors.theme1[colorScheme].greenC8
: Colors.theme1[colorScheme].gray2077,
},
]}
onPress={() =>
navigation.navigate("VideoDisplay", {
Number(index) === 0
? navigation.navigate("VideoDisplay", {
season: season,
unit: unit,
name: seasonName,
})
: {}
}
>
<Text
@ -88,76 +98,62 @@ const Season = ({ season, toggle, activeSeason, realSeasons, seasonName }) => {
width: "100%",
textAlign: "center",
fontFamily: "regular",
fontSize: fontSize.base,
color: Colors.theme1.light.blue5,
fontSize: fontSize.tiny,
color:
Number(index) === 0
? Colors.theme1[colorScheme].greenC8
: Colors.theme1[colorScheme].gray2077,
}}
>
نمایش
</Text>
</Pressable>
)}
{/* {0 && (
<Pressable
style={tw("flex flex-1 flex-row items-center py-1.5 px-2")}
>
<Text
style={{
width: "100%",
textAlign: "center",
fontFamily: "regular",
fontSize: fontSize.sm,
color: Colors.theme1.light.blue5,
}}
>
دانلود
</Text>
</Pressable>
)} */}
</View>
</View>
</View>
);
};
return (
<View style={tw("w-full flex flex-col")}>
<TouchableOpacity
<View style={tw("w-full flex flex-col mb-4")}>
<Pressable
style={[
tw(
"flex flex-row-reverse justify-between items-center rounded-md py-3 px-3 mb-3"
),
{ backgroundColor: Colors.theme1.light.blue5 },
tw("flex flex-col rounded-md py-3 px-3"),
{
backgroundColor: Colors.theme1[colorScheme].greenCF + "05",
borderWidth: 1,
borderColor: Colors.theme1[colorScheme].greenC8,
},
]}
onPress={() => toggle(season[0].categoryId)}
>
<View style={tw("flex flex-row-reverse justify-between items-center")}>
<Text
style={[
{
fontFamily: "regular",
fontFamily: "bold",
fontSize: fontSize.base,
color: "white",
color: Colors.theme1[colorScheme].green79,
},
]}
>
{
realSeasons.filter((item) => item.id === season[0].categoryId)[0]
.name
}
{realSeasons?.length > 0 &&
realSeasons?.filter(
(item) => item?.id === season[0]?.categoryId
)[0]?.name}
</Text>
<SimpleLineIcons name={season[0].categoryId === activeSeason ? "arrow-up" : "arrow-down"} size={14} color="white" />
{/* <Text
style={[
{
fontFamily: "regular",
fontSize: fontSize.sm,
color: "white",
},
]}
>
{season.duration}
</Text> */}
</TouchableOpacity>
{season[0].categoryId === activeSeason &&
season.map((unit, index) => <Unit unit={unit} key={index} />)}
<SimpleLineIcons
name={
season[0].categoryId === activeSeason ? "arrow-up" : "arrow-down"
}
size={14}
color={Colors.theme1[colorScheme].green79}
/>
</View>
{season[0]?.categoryId === activeSeason &&
season?.map((unit, index) => (
<Unit unit={unit} key={index} index={index} />
))}
</Pressable>
</View>
);
};

@ -9,15 +9,23 @@ import {
LayoutAnimation,
Image,
Text,
Appearance,
} from "react-native";
import { connect } from "react-redux";
import {publicApi} from '../../redux/actions';
import { publicApi, userProduct } from "../../redux/actions";
import separate from "../../utils/separate";
//components
import Navbar from "../../components/Navbar";
import Drawer from "../../components/Drawer";
import Divider from "../../components/Divider";
import Season from "./components/Season";
import CustomPressable from "../../components/Pressable";
//style
import tw from "tailwind-rn";
import fontSize from '../../constants/fontSize';
import fontSize from "../../constants/fontSize";
import Colors from "../../constants/Colors";
const { height } = Dimensions.get("window");
@ -27,11 +35,16 @@ function Product({
book,
seasons,
grades,
isLogin,
userId,
pushToCart,
loading,
}) {
const colorScheme = Appearance.getColorScheme();
const [position, setPosition] = useState("100%");
useEffect(() => {
getBook({bookId : route.params.id });
getBook({ bookId: route.params.id }, { id: route.params.id, vod: true });
}, []);
const setBoxPosition = () => {
@ -44,7 +57,7 @@ function Product({
style={{
paddingTop: Platform.OS === "android" ? StatusBar.currentHeight : 0,
position: "relative",
height : height
height: height,
}}
>
<Navbar
@ -68,60 +81,72 @@ function Product({
<View
style={[
tw(
"w-full flex flex-row flex-1 justify-between items-center relative overflow-hidden"
"w-full flex flex-row-reverse flex-1 justify-between relative overflow-hidden"
),
{ height: height / 3.8 },
]}
>
<Image
source={{uri : `https://dnvn.ir/api/v1/file/${book?.fileIds}`}}
style={[tw("rounded-md absolute left-0 top-0 w-full h-full")]}
/>
<Image
source={{ uri: `https://dnvn.ir/api/v1/file/${book?.fileIds}` }}
style={[
tw("rounded-md h-full rounded-md ml-2"),
{ width: 70, height: 100 },
{ width: ((height / 5) * 3) / 4, height: height / 5 },
]}
/>
</View>
<View
style={[
tw("flex flex-col flex-1 justify-between"),
{
paddingRight: 10,
},
]}
>
<View style={tw("flex flex-col")}>
<View style={tw("flex flex-col items-end flex-1")}>
<Text
style={{
marginTop: 5,
color: "#05335F",
color: Colors.theme1[colorScheme].green79,
fontSize: fontSize.xl,
marginBottom: 0,
fontFamily: "bold",
}}
>
{book?.name}
{"دوره ویدئویی" + "" + book?.product[2]?.name}
</Text>
<Text
style={{
color: "#196EC0",
fontSize: fontSize.sm,
marginBottom: 5,
fontFamily: "light",
color: Colors.theme1[colorScheme].greenCF,
fontSize: fontSize.tiny,
marginTop: 10,
fontFamily: "regular",
}}
>
{'پایه' + ' ' + grades[book?.gradeId]}
{"پایه" + " " + grades[book?.gradeId]}
</Text>
</View>
</View>
<View
style={[
tw("flex flex-col flex-1 justify-between"),
{
paddingRight: 10,
},
]}
>
<Divider type={"vertical"} />
</View>
<CustomPressable
title={`خرید با قیمت ${separate(book?.product[2]?.price)} تومان`}
backgroundColor={Colors.theme1[colorScheme].greenCF}
color={"white"}
border={{ color: "#196EC0", width: 0 }}
width={"100%"}
loading={loading}
onPress={() =>
pushToCart({
productId: book?.product[2]?.id,
userId: userId,
count: 1,
})
}
/>
</View>
<View style={tw("flex flex-col")}>
{seasons?.map((season, index) => (
<Season season={season} key={index} id={route.params.id} seasonName={book?.name} />
{seasons
?.sort((a, b) => a[0]?.categoryId - b[0]?.categoryId)
?.map((season, index) => (
<Season season={season} key={index} id={book?.id} />
))}
</View>
</ScrollView>
@ -144,12 +169,16 @@ const styles = StyleSheet.create({
});
const mapStateToProps = (state) => ({
book : state.publicApi.bookInfo,
book: state.book.info,
seasons: state.publicApi.categories,
grades : state.publicApi.grades
grades: state.publicApi.grades,
isLogin: state.user.status,
userId: state.user.status.id,
loading: state.userProduct.loading,
});
const mapDispatchToProps = {
getBook: publicApi.bookInfo
}
getBook: publicApi.bookInfo,
pushToCart: userProduct.add,
};
export default connect(mapStateToProps, mapDispatchToProps)(Product);

@ -1,16 +1,31 @@
import React from "react";
import { View, Text, Dimensions, Pressable } from "react-native";
import { View, Text, Dimensions, Pressable, Appearance } from "react-native";
import { connect } from "react-redux";
import { publicApi } from "../../../../redux/actions";
import { useNavigation } from "@react-navigation/native";
//style
import tw from "tailwind-rn";
import fontSize from "../../../../constants/fontSize";
import Colors from "../../../../constants/Colors";
import { useNavigation } from "@react-navigation/native";
const { width } = Dimensions.get("window");
const Season = ({ season, activeUnit, name, setVideoActive }) => {
const colorScheme = Appearance.getColorScheme();
const navigation = useNavigation();
const duration = (value) => {
const minute = value % 60;
const hour = Math.round(value / 60);
return (
(hour > 0
? (hour.toString().length === 1 ? "0" + hour.toString() : hour) + ""
: "") +
":" +
(minute.toString().length === 1 ? "0" + minute.toString() : minute)
);
};
const Unit = ({ unit }) => {
const selectVideo = () => {
setVideoActive(unit);
@ -18,7 +33,7 @@ const Season = ({ season, activeUnit, name, setVideoActive }) => {
season: season,
unit: unit,
name: name,
})
});
};
return (
<View
@ -26,57 +41,56 @@ const Season = ({ season, activeUnit, name, setVideoActive }) => {
tw("w-full flex flex-col rounded-md overflow-hidden mb-3"),
{
borderWidth: 1,
borderColor: Colors.theme1.light.blue3,
borderColor: Colors.theme1[colorScheme].greenD9,
backgroundColor:
activeUnit === unit
? Colors.theme1[colorScheme].greenCF
: "transparent",
},
]}
>
<View
style={[
tw(
"w-full flex flex-row-reverse justify-between items-center py-1.5 px-3"
"w-full flex flex-row-reverse justify-between items-center py-2 px-3"
),
{
borderBottomWidth: 1,
borderColor: Colors.theme1.light.blue3,
backgroundColor: activeUnit === unit ? "#1a1" : "transparent",
borderColor: Colors.theme1[colorScheme].greenD9,
},
]}
>
<Text
style={[
{
fontFamily: "regular",
fontSize: fontSize.base,
fontFamily: "bold",
fontSize: fontSize.xl,
color:
activeUnit === unit ? "white" : Colors.theme1.light.blue5,
activeUnit === unit ? "white" : Colors.theme1[colorScheme].green79,
},
]}
>
{unit.name}
</Text>
{/* <Text
<Text
style={[
{
fontFamily: "regular",
fontSize: width / 36,
color: Colors.theme1.light.blue5,
backgroundColor: "white",
fontFamily: "bold",
fontSize: fontSize.base,
color: activeUnit === unit ? "white" : Colors.theme1[colorScheme].green79,
borderRightWidth: 1,
borderColor: activeUnit === unit ? "white" : Colors.theme1[colorScheme].green79,
paddingRight: 8,
},
]}
>
{unit.duration}
</Text> */}
{duration(unit.duration)}
</Text>
</View>
<View style={[tw("w-full flex flex-row-reverse")]}>
{1 && (
<Pressable
style={[
tw("flex flex-1 flex-row items-center py-2 px-2"),
{
borderLeftWidth: 1,
borderColor: Colors.theme1.light.blue3,
backgroundColor: "white",
},
]}
onPress={() => selectVideo()}
>
@ -84,69 +98,20 @@ const Season = ({ season, activeUnit, name, setVideoActive }) => {
style={{
width: "100%",
textAlign: "center",
fontFamily: "regular",
fontSize: fontSize.sm,
color: Colors.theme1.light.blue5,
fontFamily: "bold",
fontSize: fontSize.lg,
color: activeUnit === unit ? "white" : Colors.theme1[colorScheme].green79,
}}
>
نمایش
</Text>
</Pressable>
)}
{/* {0 && (
<Pressable
style={tw("flex flex-1 flex-row items-center py-1.5 px-2")}
>
<Text
style={{
width: "100%",
textAlign: "center",
fontFamily: "regular",
fontSize: width / 34,
color: Colors.theme1.light.blue5,
}}
>
دانلود
</Text>
</Pressable>
)} */}
</View>
</View>
);
};
return (
<View style={tw("w-full flex flex-col mt-5")}>
<Pressable
style={[
tw(
"flex flex-row-reverse justify-between items-center rounded-md py-2.5 px-3 mb-3"
),
{ backgroundColor: Colors.theme1.light.blue5 },
]}
>
<Text
style={[
{
fontFamily: "regular",
fontSize: fontSize.base,
color: "white",
},
]}
>
{name}
</Text>
<Text
style={[
{
fontFamily: "regular",
fontSize: fontSize.sm,
color: "white",
},
]}
>
{season.duration}
</Text>
</Pressable>
<View style={tw("w-full flex flex-col")}>
{season.map((unit, index) => (
<Unit unit={unit} key={index} />
))}

@ -7,18 +7,28 @@ import {
SafeAreaView,
StatusBar,
LayoutAnimation,
Appearance,
Text,
} from "react-native";
import { connect } from "react-redux";
import { publicApi } from "../../redux/actions";
//components
import Navbar from "../../components/Navbar";
import Drawer from "../../components/Drawer";
import { Video } from "expo-av";
import tw from 'tailwind-rn';
import * as ScreenOrientation from 'expo-screen-orientation';
import * as ScreenOrientation from "expo-screen-orientation";
import Season from "./components/Season";
import Divider from "../../components/Divider";
import tw from "tailwind-rn";
import fontSize from "../../constants/fontSize";
import Colors from "../../constants/Colors";
const { height, width } = Dimensions.get("window");
const { width } = Dimensions.get("window");
function VideoDisplay({ route, selectedVideo }) {
function VideoDisplay({ route }) {
const colorScheme = Appearance.getColorScheme();
const video = React.useRef(null);
const [status, setStatus] = React.useState({});
const [position, setPosition] = useState("100%");
@ -31,11 +41,10 @@ function VideoDisplay({ route, selectedVideo }) {
};
function setOrientation() {
if (Dimensions.get('window').height > Dimensions.get('window').width) {
if (Dimensions.get("window").height > Dimensions.get("window").width) {
//Device is in portrait mode, rotate to landscape mode.
ScreenOrientation.lockAsync(ScreenOrientation.OrientationLock.LANDSCAPE);
}
else {
} else {
//Device is in landscape mode, rotate to portrait mode.
ScreenOrientation.lockAsync(ScreenOrientation.OrientationLock.PORTRAIT);
}
@ -70,7 +79,7 @@ function VideoDisplay({ route, selectedVideo }) {
ref={video}
style={{ width: "100%", height: (width * 9) / 16 - 16 }}
source={{
uri: `https://dnvn.ir/api/v1/file/${selectedVideo?.fileIds}`,
uri: `https://dnvn.ir/api/v1/file/${route.params.unit?.fileIds}`,
}}
useNativeControls
resizeMode="cover"
@ -78,6 +87,21 @@ function VideoDisplay({ route, selectedVideo }) {
isLooping
onPlaybackStatusUpdate={(status) => setStatus(() => status)}
/>
<Text
style={{ fontSize: fontSize.xl, fontFamily: "bold", marginTop: 8 }}
>
{route.params.unit?.name}
</Text>
<View
style={[
tw("flex flex-col flex-1 justify-between"),
{
paddingRight: 10,
},
]}
>
<Divider type={"vertical"} />
</View>
<Season
season={route.params.season}
activeUnit={route.params.unit}
@ -103,9 +127,7 @@ const styles = StyleSheet.create({
});
const mapStateToProps = (state) => ({
selectedVideo: state.publicApi.selectedVideo,
grades: state.publicApi.grades,
});
const mapDispatchToProps = {};
export default connect(mapStateToProps, mapDispatchToProps)(VideoDisplay);
export default connect(mapStateToProps)(VideoDisplay);

@ -1,21 +1,34 @@
import React from "react";
import { View, FlatList, Pressable, Image, Dimensions, Text } from "react-native";
import {useNavigation} from '@react-navigation/native';
import {
View,
FlatList,
Pressable,
Image,
Dimensions,
Text,
Appearance,
} from "react-native";
import { useNavigation } from "@react-navigation/native";
import separate from "../../../utils/separate";
//style
import tw from "tailwind-rn";
import fontSize from '../../../constants/fontSize';
import fontSize from "../../../constants/fontSize";
import Colors from "../../../constants/Colors";
const { width, height } = Dimensions.get("window");
const { width } = Dimensions.get("window");
import Header from "../../Home/components/Header";
function MostViewedVideo({ videos, grades }) {
const navigation = useNavigation();
const colorScheme = Appearance.getColorScheme();
const Video = ({ video }) => {
return (
<Pressable
style={[
{
width: width / 1.5,
minWidth: (150 * 16) / 9,
},
tw("flex flex-col items-end rounded-md ml-6"),
]}
@ -26,7 +39,7 @@ function MostViewedVideo({videos, grades}) {
tw(
"w-full flex flex-row flex-1 justify-between items-center relative overflow-hidden"
),
{ height: height / 4 },
{ height: ((width / 1.5) * 9) / 16, minHeight: 150 },
]}
>
<Image
@ -37,7 +50,7 @@ function MostViewedVideo({videos, grades}) {
source={{ uri: `https://dnvn.ir/api/v1/file/${video.fileIds}` }}
style={[
tw("rounded-md h-full absolute left-2 inset-y-1/4 rounded-md"),
{ width: 70, height: 100 },
{ width: 70, height: 100, borderWidth: 2, borderColor: "white" },
]}
/>
</View>
@ -46,45 +59,60 @@ function MostViewedVideo({videos, grades}) {
fontSize: fontSize.lg,
marginTop: 5,
paddingRight: 4,
color: "#05335F",
color: Colors.theme1[colorScheme].gray20,
fontFamily: "bold",
}}
>
{video.name}
{'دوره ویدئویی' + ' ' + video?.name}
</Text>
<View
style={tw("w-full flex flex-row justify-between items-center px-1")}
style={tw(
"w-full flex flex-row justify-between items-center px-1 mt-1"
)}
>
<View style={tw("flex flex-row items-center")}>
<Text
style={[
tw(""),
{
marginTop: 10,
color: "#132F52",
color: Colors.theme1[colorScheme].gray20,
fontFamily: "bold",
fontSize: fontSize.sm,
marginRight : 3
},
]}
>
تومان
</Text>
<Text
style={[
{
color: Colors.theme1[colorScheme].gray20,
fontFamily: "bold",
fontSize: fontSize.xl,
},
]}
>
{video.product[0].price + ' ' + 'تومان'}
{separate(video?.product[2]?.price)}
</Text>
</View>
<Text
style={{
color: "#196EC0",
color: Colors.theme1[colorScheme].gray20 ,
fontFamily: "light",
fontSize: fontSize.sm,
fontSize: fontSize.tiny,
marginTop: 5,
}}
>
{"پایه" + " " + grades[video.gradeId]}
{"پایه" + " " + grades[video?.gradeId]}
</Text>
</View>
</Pressable>
);
};
return (
<View style={tw("w-full flex flex-col w-full")}>
<View style={tw("w-full flex flex-col w-full mt-3")}>
<Header title="پربازدیدترین" />
<FlatList
showsHorizontalScrollIndicator={false}
@ -92,11 +120,7 @@ function MostViewedVideo({videos, grades}) {
inverted={true}
style={tw("pb-1.5 mt-3 flex flex-row w-full")}
data={videos}
renderItem={({ item }) => (
<Video
video={item}
/>
)}
renderItem={({ item }) => <Video video={item} />}
keyExtractor={(item) => item.id}
/>
</View>

@ -1,14 +1,26 @@
import React from "react";
import { View, Pressable, Image, Dimensions, Text } from "react-native";
import {
View,
Pressable,
Image,
Dimensions,
Text,
Appearance,
} from "react-native";
import { useNavigation } from "@react-navigation/native";
import separate from "../../../utils/separate";
//style
import tw from "tailwind-rn";
import fontSize from "../../../constants/fontSize";
import Colors from "../../../constants/Colors";
const { width } = Dimensions.get("window");
import Header from "../../Home/components/Header";
const NewestVideo = ({ videos, grades }) => {
const colorScheme = Appearance.getColorScheme();
const navigation = useNavigation();
const Video = ({ video }) => {
return (
@ -32,7 +44,7 @@ const NewestVideo = ({ videos, grades }) => {
style={{
fontSize: fontSize.base,
marginTop: 5,
color: "#05335F",
color: Colors.theme1[colorScheme].gray20,
fontFamily: "bold",
}}
>
@ -40,9 +52,9 @@ const NewestVideo = ({ videos, grades }) => {
</Text>
<Text
style={{
color: "#196EC0",
color: Colors.theme1[colorScheme].gray20,
fontFamily: "light",
fontSize: fontSize.sm,
fontSize: fontSize.tiny,
marginTop: 5,
}}
>

@ -27,7 +27,7 @@ function Videos({ grades, videos, getVideos }) {
const [position, setPosition] = useState("100%");
useEffect(() => {
getVideos();
getVideos({vod : true});
},[]);
const setBoxPosition = () => {
@ -64,8 +64,7 @@ function Videos({ grades, videos, getVideos }) {
onChange={setSearch}
placeholder={"نام کتاب یا دوره را جستجو کنید"}
/>
<VerticalGradeFilter grades={grades} />
<Divider type={"vertical"} />
{/* <Divider type={"vertical"} /> */}
{videos.length > 0 && (
<>
<MostViewedVideo videos={videos} grades={grades} />

Loading…
Cancel
Save