From b50071f0f2238e4ee2b9960cde765385c2a75e20 Mon Sep 17 00:00:00 2001 From: Reza_ashrafi Date: Fri, 4 Feb 2022 23:56:08 +0330 Subject: [PATCH] reza fixed buy way --- src/components/JolPlayer/index.js | 6 +- src/components/Navbar/index.js | 2 +- src/components/Product/index.js | 11 +- src/components/ProductImage/index.js | 102 ++++--- src/components/ProductStatusCard/index.js | 39 ++- src/components/ProductTab/index.js | 4 +- src/views/Home/Desktop/Part2/index.js | 8 +- src/views/Home/Desktop/Part4/index.js | 2 +- .../Home/Desktop/SalesContainer/index.js | 4 +- .../Home/Portrait/Private/Videos/index.js | 2 +- .../Product/Desktop/ProductOverAll/index.js | 49 ++- src/views/Product/index.js | 281 +++++++++--------- src/views/ShoppingCart/Product/index.js | 13 +- src/views/ShoppingCart/index.js | 6 +- src/views/Video/components/Desktop/Videos.js | 40 +-- src/views/Video/index.js | 55 ++-- .../Videos/components/MostViewedVideo.js | 21 +- src/views/Videos/components/NewestVideo.js | 48 ++- src/views/Videos/index.js | 17 +- 19 files changed, 385 insertions(+), 325 deletions(-) diff --git a/src/components/JolPlayer/index.js b/src/components/JolPlayer/index.js index 08cccbc..62c0c22 100644 --- a/src/components/JolPlayer/index.js +++ b/src/components/JolPlayer/index.js @@ -4,7 +4,6 @@ import JoLPlayer from "jol-player"; function Video({ fileIds, posterId, autoPlay }) { const videoRef = useRef(null); - return (
1024 ? window.innerHeight - 200 : window.innerHeight / 3.6, + height: + window.innerWidth > 1024 + ? window.innerHeight - 200 + : window.innerHeight / 3.6, theme: "#4dd35b", language: "en", isShowMultiple: window.innerWidth > 700, diff --git a/src/components/Navbar/index.js b/src/components/Navbar/index.js index 77f3b1e..bef43d1 100644 --- a/src/components/Navbar/index.js +++ b/src/components/Navbar/index.js @@ -322,7 +322,7 @@ const mapStateToProps = (state) => ({ isMobile: state.publicApi.isMobile, headerOptions: state.publicApi.headerOptions, isLogin: state.user.status, - cartProductsLength: state.userProduct.list?.length, + cartProductsLength: state.userProduct.list?.filter((product) => product.condition < 2)?.length, }); const mapDispatchToProps = { diff --git a/src/components/Product/index.js b/src/components/Product/index.js index 1f151e0..04e2376 100644 --- a/src/components/Product/index.js +++ b/src/components/Product/index.js @@ -1,4 +1,5 @@ import React, { useState } from "react"; +import {Link} from 'react-router-dom'; import { connect } from "react-redux"; import StarRating from "../StarRating"; @@ -50,7 +51,7 @@ const ProductDesign = ({ }) => { const [isHovering, setIsHovering] = useState(false); return ( -
@@ -105,7 +106,7 @@ const ProductDesign = ({

{product?.product[1]?.name}

@@ -119,7 +120,7 @@ const ProductDesign = ({ )} {productCat && ( {"پایه" + " " + grades[product.gradeId]} @@ -128,7 +129,7 @@ const ProductDesign = ({ {/* star */} {star && (
- + {/* بر اساس {numberOfRegards} بررسی */} @@ -203,7 +204,7 @@ const ProductDesign = ({
-
+ ); }; diff --git a/src/components/ProductImage/index.js b/src/components/ProductImage/index.js index 25fa0c6..9c8f0fc 100644 --- a/src/components/ProductImage/index.js +++ b/src/components/ProductImage/index.js @@ -1,36 +1,70 @@ -import React from "react"; +import React, { useState, useEffect } from "react"; import "./index.scss"; import productImg from "./product-image.jpg"; const ProductImage = ({ images }) => { + const [list, setList] = useState([]); + const [activeImage, setActiveImage] = useState(null); // console.log(images.length); - + useEffect(() => { + if (images) { + let mylist = images?.split(","); + setList(() => mylist); + setActiveImage(() => mylist[0]); + console.log(images); + } + }, [images]); return ( -
-
- {images.slice(0, 4).map((image, index) => ( -
- - {/* این خط پایین که نوشتم برای این است که ایندکس که جنسش استرینگ است رو به نامبر تبدیل کند */} - {Number(index) === 3 && ( -
- + {images.length - 3} -
- )} -
- ))} -
- +
+
+ {list?.slice(0, 4)?.map((image, index) => ( +
setActiveImage(image)} + > + + {/* این خط پایین که نوشتم برای این است که ایندکس که جنسش استرینگ است رو به نامبر تبدیل کند */} + {Number(index) === 3 && ( +
+ + {images.length - 3} +
+ )} +
+ ))} +
+
+
+
); }; // {[0, 1, 2, 3, 4].map((item, index) => ( @@ -38,23 +72,3 @@ const ProductImage = ({ images }) => { // ))} export default ProductImage; - -ProductImage.defaultProps = { - images: [ - { - image: productImg, - }, - { - image: productImg, - }, - { - image: productImg, - }, - { - image: productImg, - }, - { - image: productImg, - }, - ], -}; diff --git a/src/components/ProductStatusCard/index.js b/src/components/ProductStatusCard/index.js index 90fcc2e..f0aa378 100644 --- a/src/components/ProductStatusCard/index.js +++ b/src/components/ProductStatusCard/index.js @@ -1,5 +1,7 @@ import React from "react"; -import {connect} from 'react-redux'; +import { connect } from "react-redux"; +import { userProduct } from "../../redux/actions"; +import { toast } from "react-toastify"; import Button from "../Button"; import arrow from "./arrow-icon.svg"; @@ -10,7 +12,16 @@ import shield from "./shield-tick.svg"; import tick from "./tick-circle.svg"; import shop from "./icon-shop.svg"; -const ProductStatusCard = ({ items, productPrice, discountPrice, isDark }) => { +const ProductStatusCard = ({ + items, + price, + discountPrice, + isDark, + id, + userId, + isLogin, + pushToCart, +}) => { return (
@@ -41,7 +52,7 @@ const ProductStatusCard = ({ items, productPrice, discountPrice, isDark }) => { ))}

- {productPrice} + {price} تومان

@@ -51,13 +62,21 @@ const ProductStatusCard = ({ items, productPrice, discountPrice, isDark }) => {

@@ -80,9 +99,15 @@ const ProductStatusCard = ({ items, productPrice, discountPrice, isDark }) => { const mapStateToProps = (state) => ({ isDark: state.publicApi.isDark, -}) + isLogin: state.user.status, + userId: state.user.status.id, +}); -export default connect(mapStateToProps)(ProductStatusCard); +const mapDispatchToProps = { + pushToCart: userProduct.add, +}; + +export default connect(mapStateToProps, mapDispatchToProps)(ProductStatusCard); ProductStatusCard.defaultProps = { items: [ diff --git a/src/components/ProductTab/index.js b/src/components/ProductTab/index.js index cb0ae2e..6b2f444 100644 --- a/src/components/ProductTab/index.js +++ b/src/components/ProductTab/index.js @@ -2,7 +2,7 @@ import React, { useState } from "react"; import Table from "./table"; const ProductTab = ({ tabs }) => { - const [selectedTab, setSelectedTab] = useState(tabs[0]); + const [selectedTab, setSelectedTab] = useState(tabs[1]); return (
@@ -11,7 +11,7 @@ const ProductTab = ({ tabs }) => { {tabs.map((tab, index) => (
  • setSelectedTab(tab)} key={index} diff --git a/src/views/Home/Desktop/Part2/index.js b/src/views/Home/Desktop/Part2/index.js index 94c7a28..cdb1eeb 100644 --- a/src/views/Home/Desktop/Part2/index.js +++ b/src/views/Home/Desktop/Part2/index.js @@ -24,10 +24,10 @@ const Part2 = ({ books, grades }) => { } } > -
    +
    -

    کتاب های جدید

    +

    کتاب های جدید

    @@ -58,14 +58,14 @@ const Part2 = ({ books, grades }) => { transition={0.5} rightArrow={ } leftArrow={ diff --git a/src/views/Home/Desktop/Part4/index.js b/src/views/Home/Desktop/Part4/index.js index c111684..52b1ace 100644 --- a/src/views/Home/Desktop/Part4/index.js +++ b/src/views/Home/Desktop/Part4/index.js @@ -60,7 +60,7 @@ const Part4 = () => {
    -

    جدیدترین دوره های ویدیویی

    +

    جدیدترین دوره های ویدیویی

    diff --git a/src/views/Home/Desktop/SalesContainer/index.js b/src/views/Home/Desktop/SalesContainer/index.js index faaa007..888550b 100644 --- a/src/views/Home/Desktop/SalesContainer/index.js +++ b/src/views/Home/Desktop/SalesContainer/index.js @@ -47,7 +47,7 @@ const SalesContainer = ({ books }) => { transition={0.5} rightArrow={ e.stopPropagation()} @@ -55,7 +55,7 @@ const SalesContainer = ({ books }) => { } leftArrow={ e.stopPropagation()} diff --git a/src/views/Home/Portrait/Private/Videos/index.js b/src/views/Home/Portrait/Private/Videos/index.js index 6919fd8..1412160 100644 --- a/src/views/Home/Portrait/Private/Videos/index.js +++ b/src/views/Home/Portrait/Private/Videos/index.js @@ -14,7 +14,7 @@ function Videos({ list, getList, grades, isDark, isMobile }) { const Book = ({ book }) => { return (
  • - + { - const [type, setType] = useState("physical"); + const [type, setType] = useState("1"); return (
    - +
    -

    - {type === "digital" - ? book?.product[0]?.name - : book?.product[1]?.name} +

    + {book?.product[type]?.name}

    -
    +
    {"پایه" + " " + grades[book?.gradeId]}
    -
    +
    - +
    بیش از 160 نفر امتیاز داده اند @@ -68,9 +67,9 @@ export const ProductOverAll = ({ }} width="38%" color={isDark ? "text-white" : "text-blueC0"} - active={type === "physical"} + active={type === "1"} selectable={true} - onClick={() => setType("physical")} + onClick={() => setType("1")} borderType="dashed" customStyle="" twPaddings="py-4 px-12" @@ -85,9 +84,10 @@ export const ProductOverAll = ({ }} width="38%" selectable={true} - active={type === "digital"} + active={type === "0"} color={isDark ? "text-white" : "text-blueC0"} - onClick={() => setType("digital")} + onClick={() => setType("0")} + borderType="dashed" radius={false} twPaddings="py-4 px-12" /> @@ -107,27 +107,18 @@ export const ProductOverAll = ({
    -
    - +
    -
    ); }; diff --git a/src/views/Product/index.js b/src/views/Product/index.js index 06a183d..1d31bd9 100644 --- a/src/views/Product/index.js +++ b/src/views/Product/index.js @@ -42,144 +42,155 @@ export const Product = ({ <> {/* Portrait */} {isMobile ? ( -
    -
    - -
    -

    - {type === "digital" - ? book?.product[0]?.name - : book?.product[1]?.name} -

    -
    - {"پایه" + " " + grades[book?.gradeId]} +
    +
    + +
    +

    + {type === "digital" + ? book?.product[0]?.name + : book?.product[1]?.name} +

    +
    + {"پایه" + " " + grades[book?.gradeId]} +
    +
    +
      +
    • + {book?.pagesNum}
      صفحه +
    • +
    • + {"فیزیکی - دیجیتالی"}
      در دسترس +
    • +
    • + {book?.rate}
      امتیاز +
    • +
    +

    + نسخه محصول را انتخاب کنید +

    +
    +
    +
    +
    +
    +
    +
    +
    +

    + خالد حسینی تو رمان باد بادک باز مینویسه : ﻣﺮﺩ ﺁﻫﺴﺘﻪ ﺩﺭ ﮔﻮﺵ ﻓﺮﺯﻧﺪ + ﺗﺎﺯﻩ ﺑﻪ ﺑﻠﻮﻍ ﺭﺳﯿﺪﻩ ﺍﺵ ﺑﺮﺍﯼ ﭘﻨﺪ ﭼﻨﯿﻦ ﻧﺠﻮﺍ ﮐﺮﺩ : ” ﭘﺴﺮﻡ ﺩﺭ ﺯﻧﺪﮔﯽ + ﻫﺮﮔﺰ ﺩﺯﺩﯼ ﻧﮑﻦ ” ﭘﺴﺮ ﻣﺘﻌﺠﺐ ﻭ ﻣﺒﻬﻮﺕ ﺑﻪ ﭘﺪﺭ ﻧﮕﺎﻩ ﮐﺮﺩ ﺑﺪﯾﻦ ﻣﻌﻨﺎ ﮐﻪ ﺍﻭ + ﻫﺮﮔﺰ ﺩﺳﺖ ﮐﺞ ﻧﺪﺍﺷﺘﻪ ﭘﺪﺭ ﺑﻪ ﻧﮕﺎﻩ ﻣﺘﻌﺠﺐ ﻓﺮﺯﻧﺪ ﻟﺒﺨﻨﺪﯼ ﺯﺩ ﻭ ﺍﺩﺍﻣﻪ ﺩﺍﺩ : + ﺩﺭ ﺯﻧﺪﮔﯽ ﺩﺭﻭﻍ ﻧﮕﻮ ﭼﺮﺍ ﮐﻪ ﺍﮔﺮ ﮔﻔﺘﯽ ﺻﺪﺍﻗﺖ ﺭﺍ ﺩﺯﺩﯾﺪﻩ ﺍﯼ، ﺧﯿﺎﻧﺖ ﻧﮑﻦ ﮐﻪ + ﺍﮔﺮ ﮐﺮﺩﯼ ﻋﺸﻖ ﺭﺍ ﺩﺯﺩﯾﺪﻩ ﺍﯼ، ﺧﺸﻮﻧﺖ ﻧﮑﻦ ﺍﮔﺮ ﮐﺮﺩﯼ ﻣﺤﺒﺖ ﺭﺍ ﺩﺯﺩﯾﺪﻩ ﺍﯼ، + ﻧﺎ ﺣﻖ ﻧﮕﻮ ﺍﮔﺮ ﮔﻔﺘﯽ ﺣﻖ ﺭﺍ ﺩﺯﺩﯾﺪﻩ ﺍﯼ، ﺑﯽ ﺣﯿﺎﯾﯽ ﻧﮑﻦ ﺍﮔﺮ ﮐﺮﺩﯼ ﺷﺮﺍﻓﺖ ﺭﺍ + ﺩﺯﺩﯾﺪﻩ ﺍی... ﭘﺲ ﺩﺭ ﺯﻧﺪﮔﯽ ﻓﻘﻂ ﺩﺯﺩﯼ نکن{" "} +

    +
    +
    +
    + +
    +
    + {[0, 1, 2, 2].map((comment, index) => ( + + ))}
    -
    -
      -
    • - {book?.pagesNum}
      صفحه -
    • -
    • - {"فیزیکی - دیجیتالی"}
      در دسترس -
    • -
    • - {book?.rate}
      امتیاز -
    • -
    -

    - نسخه محصول را انتخاب کنید -

    -
    -
    -
    -
    -
    -
    -
    -
    -

    - خالد حسینی تو رمان باد بادک باز مینویسه : ﻣﺮﺩ ﺁﻫﺴﺘﻪ ﺩﺭ ﮔﻮﺵ ﻓﺮﺯﻧﺪ - ﺗﺎﺯﻩ ﺑﻪ ﺑﻠﻮﻍ ﺭﺳﯿﺪﻩ ﺍﺵ ﺑﺮﺍﯼ ﭘﻨﺪ ﭼﻨﯿﻦ ﻧﺠﻮﺍ ﮐﺮﺩ : ” ﭘﺴﺮﻡ ﺩﺭ ﺯﻧﺪﮔﯽ ﻫﺮﮔﺰ - ﺩﺯﺩﯼ ﻧﮑﻦ ” ﭘﺴﺮ ﻣﺘﻌﺠﺐ ﻭ ﻣﺒﻬﻮﺕ ﺑﻪ ﭘﺪﺭ ﻧﮕﺎﻩ ﮐﺮﺩ ﺑﺪﯾﻦ ﻣﻌﻨﺎ ﮐﻪ ﺍﻭ ﻫﺮﮔﺰ - ﺩﺳﺖ ﮐﺞ ﻧﺪﺍﺷﺘﻪ ﭘﺪﺭ ﺑﻪ ﻧﮕﺎﻩ ﻣﺘﻌﺠﺐ ﻓﺮﺯﻧﺪ ﻟﺒﺨﻨﺪﯼ ﺯﺩ ﻭ ﺍﺩﺍﻣﻪ ﺩﺍﺩ : ﺩﺭ - ﺯﻧﺪﮔﯽ ﺩﺭﻭﻍ ﻧﮕﻮ ﭼﺮﺍ ﮐﻪ ﺍﮔﺮ ﮔﻔﺘﯽ ﺻﺪﺍﻗﺖ ﺭﺍ ﺩﺯﺩﯾﺪﻩ ﺍﯼ، ﺧﯿﺎﻧﺖ ﻧﮑﻦ ﮐﻪ ﺍﮔﺮ - ﮐﺮﺩﯼ ﻋﺸﻖ ﺭﺍ ﺩﺯﺩﯾﺪﻩ ﺍﯼ، ﺧﺸﻮﻧﺖ ﻧﮑﻦ ﺍﮔﺮ ﮐﺮﺩﯼ ﻣﺤﺒﺖ ﺭﺍ ﺩﺯﺩﯾﺪﻩ ﺍﯼ، ﻧﺎ ﺣﻖ - ﻧﮕﻮ ﺍﮔﺮ ﮔﻔﺘﯽ ﺣﻖ ﺭﺍ ﺩﺯﺩﯾﺪﻩ ﺍﯼ، ﺑﯽ ﺣﯿﺎﯾﯽ ﻧﮑﻦ ﺍﮔﺮ ﮐﺮﺩﯼ ﺷﺮﺍﻓﺖ ﺭﺍ ﺩﺯﺩﯾﺪﻩ - ﺍی... ﭘﺲ ﺩﺭ ﺯﻧﺪﮔﯽ ﻓﻘﻂ ﺩﺯﺩﯼ نکن{" "} -

    -
    -
    -
    -
    -
    - {[0, 1, 2, 2].map((comment, index) => ( - - ))} + ) : ( +
    +
    -
    ) :
    - -
    - } + )} ); }; @@ -189,7 +200,7 @@ const mapStateToProps = (state) => ({ grades: state.publicApi.grades, isMobile: state.publicApi.isMobile, isDark: state.publicApi.isDark, - userId: state.user.status.id, + userId: state.user.status?.id, }); const mapDispatchToProps = { diff --git a/src/views/ShoppingCart/Product/index.js b/src/views/ShoppingCart/Product/index.js index 429467d..b199f6d 100644 --- a/src/views/ShoppingCart/Product/index.js +++ b/src/views/ShoppingCart/Product/index.js @@ -139,9 +139,20 @@ function Product({ product, grades, pushToCart, isMobile }) {  {product?.product?.price}  تومان + pushToCart( + { + productId: product?.productId, + userId: product?.userId, + count: product?.productType === 1 ? -1 : -product?.count, + }, + {}, + { id: product?.factorId } + ) + } src={deleteIcon} alt="delete" - className="border border-red-800 border-solid p-1 w-8 bg-red-100 rounded-md mr-4" + className="border border-red-800 border-solid p-1 w-8 bg-red-100 rounded-md mr-4 cursor-pointer" />
  • diff --git a/src/views/ShoppingCart/index.js b/src/views/ShoppingCart/index.js index 06cb8e6..2b1f66b 100644 --- a/src/views/ShoppingCart/index.js +++ b/src/views/ShoppingCart/index.js @@ -50,7 +50,7 @@ function ShoppingCart({
      - {list.map((product, index) => ( + {list.map((product, index) => product.condition < 2 && ( ))}
    @@ -147,7 +147,7 @@ function ShoppingCart({
    ) : (
    @@ -172,7 +172,7 @@ function ShoppingCart({ />
    diff --git a/src/views/Video/components/Desktop/Videos.js b/src/views/Video/components/Desktop/Videos.js index dcbcaac..dff8a32 100644 --- a/src/views/Video/components/Desktop/Videos.js +++ b/src/views/Video/components/Desktop/Videos.js @@ -1,31 +1,46 @@ -import React from "react"; +import React, {useState, useEffect} from "react"; import "../../../../components/ProductImage/index.scss"; import productImg from "../../../../components/ProductImage/product-image.jpg"; const Videos = ({ videos }) => { + const [list, setList] = useState([]); + const [activeVideo, setActiveVideo] = useState([]); + + useEffect(() => { + if (videos) { + let mylist = videos?.split(","); + setList(() => mylist); + setActiveVideo(() => mylist[0]); + console.log(videos); + } + }, [videos]); + return (
    - {videos.slice(0, 4).map((video, index) => ( + {list?.slice(0, 4).map((video, index) => (
    {/* این خط پایین که نوشتم برای این است که ایندکس که جنسش استرینگ است رو به نامبر تبدیل کند */} {Number(index) === 3 && ( @@ -51,16 +66,3 @@ const Videos = ({ videos }) => { export default Videos; -Videos.defaultProps = { - videos: [ - { - image: productImg, - }, - { - image: productImg, - }, - { - image: productImg, - }, - ], -}; diff --git a/src/views/Video/index.js b/src/views/Video/index.js index 65414e4..8c6e6e8 100644 --- a/src/views/Video/index.js +++ b/src/views/Video/index.js @@ -1,6 +1,8 @@ import React, { useState, useEffect } from "react"; import { connect } from "react-redux"; -import { publicApi } from "../../redux/actions"; +import {toast} from 'react-toastify'; +import { Link } from "react-router-dom"; +import { publicApi, userProduct } from "../../redux/actions"; import location from "../../utils/location"; import Divider from "../../components/Divider"; import Season from "./components/Season"; @@ -15,6 +17,9 @@ import poster from "../../assets/images/poster.svg"; import tickIcon from "../../components/ProductStatusCard/tick-circle.svg"; function Video({ + isLogin, + pushToCart, + userId, product = { id: 0, type: "کتاب ها", @@ -63,7 +68,7 @@ function Video({ const [type, setType] = useState(0); useEffect(() => { - getBook({ bookId: 19 }); + getBook({ bookId: Number(location.getId()) }); setHeaderOptions(headerOptions); }, []); @@ -86,14 +91,14 @@ function Video({ }} >
    - + {book?.name} @@ -113,7 +118,7 @@ function Video({
    - +
    - {"پایه" + " " + (grades[book?.gradeId] || "پایه دوازدهم")} + {"پایه" + " " + grades[book?.gradeId]}
    - +
    بیش از 160 نفر امتیاز داده اند @@ -159,7 +164,7 @@ function Video({
    -
    +

    {`توسعه خرید توسط ${ book?.recommendedPeople || 4234 @@ -167,16 +172,14 @@ function Video({

    - - {book?.price || "56/894/000"} - + {book?.price} تومان

    با خرید این کالا 540.000 صرفه جویی کنید

    -
    @@ -210,11 +218,14 @@ const mapStateToProps = (state) => ({ book: state.publicApi.bookInfo, seasons: state.publicApi.categories, grades: state.publicApi.grades, + isLogin: state.user.status, + userId: state.user.status.id, }); const mapDispatchToProps = { setHeaderOptions: publicApi.setHeaderOptions, getBook: publicApi.bookInfo, + pushToCart: userProduct.add, }; export default connect(mapStateToProps, mapDispatchToProps)(Video); diff --git a/src/views/Videos/components/MostViewedVideo.js b/src/views/Videos/components/MostViewedVideo.js index 27a54aa..db1a48b 100644 --- a/src/views/Videos/components/MostViewedVideo.js +++ b/src/views/Videos/components/MostViewedVideo.js @@ -3,7 +3,7 @@ import { Link } from "react-router-dom"; import Header from "../../../components/Header"; import posterImage from "../../../assets/images/poster.svg"; -function MostViewedVideo({}) { +function MostViewedVideo({videos, grades}) { const Video = ({ video }) => { return (
    - + {video.name}
    @@ -37,7 +37,7 @@ function MostViewedVideo({}) { {video.price} - {"پایه" + " " + video.grade} + {"پایه" + " " + grades[video.gradeId]}
    @@ -47,17 +47,10 @@ function MostViewedVideo({}) {
    - {[0, 1, 2].map((video, index) => ( + {videos.map((video, index) => (
    diff --git a/src/views/Videos/components/NewestVideo.js b/src/views/Videos/components/NewestVideo.js index fac2566..e294189 100644 --- a/src/views/Videos/components/NewestVideo.js +++ b/src/views/Videos/components/NewestVideo.js @@ -1,27 +1,32 @@ import React from "react"; -import {Link} from 'react-router-dom'; +import { Link } from "react-router-dom"; import Header from "../../../components/Header"; import posterImage from "../../../assets/images/poster.svg"; -const NewestVideo = () => { +const NewestVideo = ({ videos, grades }) => { const Video = ({ video }) => { return ( - - +
    + +
    + + {video.name} - {"پایه" + " " + video.grade} + {"پایه" + " " + grades[video.gradeId]} ); @@ -30,23 +35,12 @@ const NewestVideo = () => {
    - {[0, 1, 2, 3].map((video, index) => ( -
    ); }; -export default NewestVideo; \ No newline at end of file +export default NewestVideo; diff --git a/src/views/Videos/index.js b/src/views/Videos/index.js index a40364f..c4c1907 100644 --- a/src/views/Videos/index.js +++ b/src/views/Videos/index.js @@ -1,6 +1,6 @@ import React, { useState, useEffect } from "react"; import { connect } from "react-redux"; -import { publicApi } from "../../redux/actions"; +import { publicApi, book } from "../../redux/actions"; import Search from "../../components/Search"; import VerticalGradeFilter from "./components/VerticalGradeFilter"; import Divider from "../../components/Divider"; @@ -9,10 +9,11 @@ import NewestVideo from "./components/NewestVideo"; //assets import searchLight from "../../assets/icons/search-light.svg"; -function Videos({ headerOptions, setHeaderOptions }) { +function Videos({ headerOptions, setHeaderOptions, getList, videos, grades }) { const [search, setSearch] = useState(""); useEffect(() => { setHeaderOptions(headerOptions); + getList(); }, []); return (
    @@ -31,20 +32,24 @@ function Videos({ headerOptions, setHeaderOptions }) {
    - +
    - -
    + +
    ); } -const mapStateToProps = (state) => ({}); +const mapStateToProps = (state) => ({ + videos : state.book.list, + grades: state.publicApi.grades, +}); const mapDispatchToProps = { setHeaderOptions: publicApi.setHeaderOptions, + getList : book.list }; export default connect(mapStateToProps, mapDispatchToProps)(Videos);