{"version":3,"file":"static/js/6033.c6745572.chunk.js","mappings":"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","sources":["package/client/api/banner.js","package/client/components/common/carouselLanding/CarouselLanding.jsx","package/client/components/common/productCard/ProductCard.jsx","package/client/components/common/productsFrame/ProductsFrame.jsx","package/client/features/homePage/page/HomePageLayout.jsx"],"sourcesContent":["import axiosClient from \"./axiosClient\";\r\n\r\nexport const banner = {\r\n  readAll: async () => {\r\n    return await axiosClient.get(\"/Slide/GetAllSlideClient\");\r\n  }\r\n};\r\n","import React, { useEffect, useState } from \"react\";\r\n\r\nimport { banner } from \"../../../api/banner\";\r\nimport { openNotificationWithIcon } from \"../../../utils\";\r\nimport { Grid, Space, Spin, Typography } from \"antd\";\r\nimport BannerAnim, { Element } from \"rc-banner-anim\";\r\nimport TweenOne from \"rc-tween-one\";\r\n\r\nimport \"rc-banner-anim/assets/index.css\";\r\nimport \"./CarouselLanding.css\";\r\nexport function _CarouselLanding() {\r\n  const [listImage, setListImage] = useState([]);\r\n  const [loading, setLoading] = useState(true);\r\n  useEffect(() => {\r\n    banner\r\n      .readAll()\r\n      .then((res) => {\r\n        setListImage(res);\r\n        setLoading(false);\r\n      })\r\n      .catch((err) => {\r\n        openNotificationWithIcon(\r\n          \"error\",\r\n          \"Lấy danh mục hình ảnh thất bại\",\r\n          err?.response?.data?.message || err?.message\r\n        );\r\n      });\r\n  }, []);\r\n  return (\r\n    <div className=\"CarouselLanding\">\r\n      <CarouselLandingImage loading={loading} listImage={listImage} />\r\n    </div>\r\n  );\r\n}\r\nconst { useBreakpoint } = Grid;\r\nconst apiUrl = window._env_.REACT_APP_URl_SERVER_APIS;\r\n\r\nfunction CarouselLandingImage({ loading, listImage }) {\r\n  const breakPoints = useBreakpoint();\r\n\r\n  return (\r\n    <Spin spinning={loading} size={\"large\"}>\r\n      <BannerAnim style={{ height: breakPoints.xs ? 300 : 550 }} autoPlaySpeed={3000} autoPlay>\r\n        {listImage.map((item, index) => (\r\n          <Element\r\n            key={item.key}\r\n            style={{ height: breakPoints.xs ? 300 : 550 }}\r\n            followParallax={{\r\n              delay: 1000,\r\n              data: [\r\n                {\r\n                  id: item.key,\r\n                  value: 20,\r\n                  bgPosition: \"50%\",\r\n                  type: [\"backgroundPositionX\"]\r\n                },\r\n                { id: \"title\", value: 50, type: \"x\" },\r\n                { id: \"content\", value: -30, type: \"x\" }\r\n              ]\r\n            }}\r\n          >\r\n            <Element.BgElement\r\n              key={item.key}\r\n              style={{\r\n                backgroundImage: `url(${apiUrl}/api/Book/GetFileImageSlide?fileNameId=${item?.fileName})`,\r\n                backgroundSize: \"cover\",\r\n                backgroundPosition: \"center\",\r\n                objectFit: \"cover\",\r\n                width: \"100%\",\r\n                height: \"100%\"\r\n              }}\r\n              id={item.key}\r\n            />\r\n            <CarouselLangdingContent title={item?.title} content={item?.description} />\r\n          </Element>\r\n        ))}\r\n      </BannerAnim>\r\n    </Spin>\r\n  );\r\n  function CarouselLangdingContent({ title, content }) {\r\n    return (\r\n      <div className=\"CarouselLanding-content\">\r\n        <Space direction=\"vertical\" size=\"small\">\r\n          <TweenOne animation={{ y: 30, opacity: 0, type: \"from\" }} id=\"title\">\r\n            <Typography.Title\r\n              level={1}\r\n              style={{\r\n                textShadow: \"2px 2px 4px rgba(0, 0, 0, 1)\",\r\n                textTransform: \"uppercase\",\r\n                color: \"white\",\r\n                fontWeight: \"900\",\r\n                fontSize: breakPoints.lg ? 39 : breakPoints.md ? 30 : breakPoints.sm ? 25 : breakPoints.xs ? 20 : 38\r\n              }}\r\n            >\r\n              {title}\r\n            </Typography.Title>\r\n          </TweenOne>\r\n          <TweenOne animation={{ y: 30, opacity: 0, type: \"from\" }} id=\"content\">\r\n            <Typography.Title\r\n              level={1}\r\n              style={{\r\n                textShadow: \"2px 2px 4px rgba(0, 0, 0, 1)\",\r\n                marginTop: \"-20px\",\r\n                textTransform: \"uppercase\",\r\n                color: \"#d1d138\",\r\n                fontWeight: \"900\",\r\n                fontSize: breakPoints.lg ? 39 : breakPoints.md ? 30 : breakPoints.sm ? 25 : breakPoints.xs ? 20 : 38\r\n              }}\r\n            >\r\n              {content}\r\n            </Typography.Title>\r\n          </TweenOne>\r\n          {/* <TweenOne animation={{ y: 30, opacity: 0, type: \"from\" }}>\r\n            <Button className=\"CarouselLanding-content_btn\" size=\"large\">\r\n              Xem ngay\r\n            </Button>\r\n          </TweenOne> */}\r\n        </Space>\r\n      </div>\r\n    );\r\n  }\r\n}\r\n\r\nexport const CarouselLanding = React.memo(_CarouselLanding);\r\n","import { Fragment } from \"react\";\r\nimport { memo } from \"react\";\r\nimport { useEffect, useState } from \"react\";\r\nimport { useNavigate } from \"react-router-dom\";\r\n\r\nimport { getImageFilterForSizeImage } from \"../../../utils/filterImage\";\r\nimport { Button, Card, Grid, Image, Modal, Select, Skeleton, Space, Spin, Tooltip, Typography } from \"antd\";\r\n\r\nimport \"./ProductCard.css\";\r\nconst { useBreakpoint } = Grid;\r\nconst { Option } = Select;\r\n\r\nfunction _ProductCard(props) {\r\n  const breakpoint = useBreakpoint();\r\n  const navigate = useNavigate();\r\n\r\n  const [isModalVisible, setIsModalVisible] = useState(false);\r\n  const [selectTypeReadBook, setSelectTypeReadBook] = useState(1);\r\n  const handleOk = () => {\r\n    setIsModalVisible(false);\r\n    if (selectTypeReadBook === 1) {\r\n      navigate(`/view-online/${props?.document?.id}`);\r\n    } else {\r\n      navigate(`/view-online-flip-books/${props?.document?.id}`);\r\n    }\r\n  };\r\n  const handleChangeSelect = (value) => {\r\n    setSelectTypeReadBook(value);\r\n  };\r\n  const handleCancel = () => {\r\n    setIsModalVisible(false);\r\n  };\r\n\r\n  const defaultImage =\r\n    \"https://images.unsplash.com/photo-1517841905240-472988babdf9?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=387&q=80\";\r\n  const [loading, setLoading] = useState(false);\r\n\r\n  useEffect(() => {\r\n    props.loading ? setLoading(true) : setLoading(false);\r\n  }, [props.loading, props.loadingColor]);\r\n\r\n  return (\r\n    <div className=\"ProductCard\">\r\n      <Modal title=\"Chọn phong cách đọc sách\" visible={isModalVisible} onOk={handleOk} onCancel={handleCancel}>\r\n        <Select value={selectTypeReadBook} onChange={handleChangeSelect}>\r\n          <Option value={1}>Chế độ truyền thống</Option>\r\n          <Option value={2}>Chế độ lật sách</Option>\r\n        </Select>\r\n      </Modal>\r\n      <Card\r\n        hoverable\r\n        cover={\r\n          loading ? (\r\n            <Skeleton.Image\r\n              style={{\r\n                height: breakpoint.lg || breakpoint.md || breakpoint.sm ? 332 : breakpoint.xs ? 260 : 280,\r\n                width: 180\r\n              }}\r\n            />\r\n          ) : (\r\n            <Image\r\n              height={breakpoint.lg ? 280 : breakpoint.md || breakpoint.sm ? 332 : breakpoint.xs ? 260 : 280}\r\n              preview={false}\r\n              style={{ objectFit: \"cover\" }}\r\n              onClick={() => {\r\n                navigate(`/detail-page/${props?.document?.id}`, {\r\n                  state: { id: props?.document?.id }\r\n                });\r\n              }}\r\n              alt=\"book\"\r\n              src={props?.listAvatar?.length > 0 ? getImageFilterForSizeImage(props?.listAvatar, 1) : defaultImage}\r\n            />\r\n          )\r\n        }\r\n        actions={[\r\n          loading ? (\r\n            <Skeleton.Button loading={loading} active size=\"small\" />\r\n          ) : (\r\n            <Spin spinning={props?.loadingColor}>\r\n              <Space direction=\"vertical\">\r\n                <Tooltip title={props?.document?.author} color=\"lime\">\r\n                  <Typography.Text\r\n                    style={{\r\n                      fontWeight: \"bold\",\r\n                      wordBreak: \"break-word\",\r\n                      color: \"#ce8028\",\r\n                      margin: 5\r\n                    }}\r\n                  >\r\n                    {props?.document?.author}\r\n                  </Typography.Text>\r\n                </Tooltip>\r\n                <Button\r\n                  style={{\r\n                    color: props.contactAndIntroduction?.col1 || \"white\",\r\n                    background: props.contactAndIntroduction?.col || \"#df1f26\"\r\n                  }}\r\n                  onClick={() => {\r\n                    setIsModalVisible(true);\r\n                  }}\r\n                >\r\n                  Đọc sách online\r\n                </Button>\r\n              </Space>\r\n            </Spin>\r\n          )\r\n        ]}\r\n      >\r\n        {loading ? (\r\n          <Skeleton.Input loading={loading} active size=\"default\" />\r\n        ) : (\r\n          <Tooltip title={props?.document?.docName} color=\"lime\">\r\n            <Card.Meta\r\n              style={{ height: 50, overflow: \"hidden\" }}\r\n              description={\r\n                <Fragment>\r\n                  <span style={{ fontWeight: \"bold\", color: \"#000\" }}>{props?.document?.docName}</span>\r\n                </Fragment>\r\n              }\r\n            />\r\n          </Tooltip>\r\n        )}\r\n      </Card>\r\n    </div>\r\n  );\r\n}\r\n\r\nexport const ProductCard = memo(_ProductCard);\r\n","import { memo } from \"react\";\r\nimport { useEffect, useState } from \"react\";\r\nimport { useNavigate } from \"react-router-dom\";\r\n\r\nimport { ContactAndIntroduction } from \"../../../../admin/api/contactAndIntroduction\";\r\nimport { openNotificationWithIcon } from \"../../../utils\";\r\nimport { ProductCard } from \"./../productCard\";\r\nimport { Button, Col, Divider, Pagination, Row } from \"antd\";\r\nimport TweenOne from \"rc-tween-one\";\r\n\r\nimport \"./ProductsFrame.css\";\r\n// const { useBreakpoint } = Grid;\r\nfunction _ProductsFrame(props) {\r\n  // const breakpoint = useBreakpoint();\r\n  const navigate = useNavigate();\r\n  const [loadingColor, setLoadingColor] = useState(true);\r\n  const [contactAndIntroduction, setcontactAndIntroduction] = useState({});\r\n  useEffect(() => {\r\n    ContactAndIntroduction.read(1, 1, 3)\r\n      .then((res) => {\r\n        setcontactAndIntroduction({ ...res[0] });\r\n      })\r\n      .catch((err) => {\r\n        openNotificationWithIcon(\r\n          \"error\",\r\n          \"Lấy cấu hình màu sắc thất bại\",\r\n          err?.response?.data?.message || err?.message\r\n        );\r\n      })\r\n      .finally(() => {\r\n        setLoadingColor(false);\r\n      });\r\n  }, []);\r\n  if (props?.loading) {\r\n    return (\r\n      <div className=\"ProductsFrame\">\r\n        <Divider\r\n          plain\r\n          className=\"ProductsFrame-title\"\r\n          style={{\r\n            width: \"100%\",\r\n            borderTopColor: \"black\",\r\n            marginBottom: 30\r\n          }}\r\n        >\r\n          {props.title}\r\n        </Divider>\r\n        <Row className=\"ProductsFrame-product_box\" gutter={[20, 24]}>\r\n          {[...Array(props?.pageSize || 12)].map((item, index) => (\r\n            <Col key={index} xs={12} sm={12} md={8} lg={6} xl={4}>\r\n              <ProductCard loading={true} loadingColor={loadingColor} contactAndIntroduction={contactAndIntroduction} />\r\n            </Col>\r\n          ))}\r\n        </Row>\r\n      </div>\r\n    );\r\n  }\r\n\r\n  return (\r\n    <div className=\"ProductsFrame\">\r\n      {/* <OverPack hideProps={{ tweenOne: { reverse: true } }}> */}\r\n      <TweenOne\r\n        animation={{\r\n          translateY: -10,\r\n          opacity: 1\r\n        }}\r\n        style={{ opacity: 0, width: \"100%\" }}\r\n      >\r\n        <Divider plain className=\"ProductsFrame-title\" style={{ borderTopColor: \"black\", marginBottom: 30 }}>\r\n          {props.title}\r\n        </Divider>\r\n      </TweenOne>\r\n      <Row\r\n        className=\"ProductsFrame-product_box\"\r\n        gutter={[\r\n          // breakpoint.xs ? 5 : breakpoint.lg ? 10 : breakpoint.md ? 10 : 50,\r\n          20, 24\r\n        ]}\r\n      >\r\n        {props?.Arr.map((item, index) => (\r\n          <Col key={item?.document?.id} xs={12} sm={12} md={8} lg={6} xl={4}>\r\n            <ProductCard {...item} loadingColor={loadingColor} contactAndIntroduction={contactAndIntroduction} />\r\n          </Col>\r\n        ))}\r\n      </Row>\r\n\r\n      <div className=\"ProductsFrame-more\">\r\n        {props.isCategoryPage ? (\r\n          <Paginations\r\n            totalNumberProducts={props?.totalNumberProducts}\r\n            handleOnChange={props?.handleOnChange}\r\n            onShowSizeChange={props?.onShowSizeChange}\r\n            pageSize={props?.pageSize}\r\n            pageIndex={props?.pageIndex}\r\n          />\r\n        ) : (\r\n          <Button\r\n            size=\"middle\"\r\n            style={{\r\n              background: contactAndIntroduction?.col,\r\n              color: contactAndIntroduction?.col1\r\n            }}\r\n            onClick={(e) => {\r\n              navigate(`/category-page-especially/${props?.especially}`, {\r\n                state: { title: props?.title }\r\n              });\r\n            }}\r\n          >\r\n            Xem thêm sách khác\r\n          </Button>\r\n        )}\r\n      </div>\r\n      {/* </OverPack> */}\r\n    </div>\r\n  );\r\n}\r\n\r\nfunction Paginations({ totalNumberProducts, handleOnChange, onShowSizeChange, pageSize, pageIndex }) {\r\n  return (\r\n    <div className=\"ProductsFram-more_pagination\">\r\n      <Pagination\r\n        onChange={handleOnChange}\r\n        showQuickJumper\r\n        defaultCurrent={pageIndex}\r\n        total={totalNumberProducts}\r\n        onShowSizeChange={onShowSizeChange}\r\n        pageSize={pageSize}\r\n      />\r\n    </div>\r\n  );\r\n}\r\n\r\nexport const ProductsFrame = memo(_ProductsFrame);\r\n","import React, { Fragment, useEffect, useState } from \"react\";\r\n\r\nimport WithErrorBoundaryCustom from \"../../../../../units/errorBounDary/WithErrorBoundaryCustom\";\r\nimport { books } from \"../../../api\";\r\nimport { banner } from \"../../../api/banner\";\r\nimport { CarouselLanding } from \"../../../components/common/carouselLanding\";\r\nimport { ProductsFrame } from \"../../../components/common/productsFrame\";\r\nimport { openNotificationWithIcon } from \"../../../utils\";\r\nimport { Grid, Image, Spin } from \"antd\";\r\nconst { useBreakpoint } = Grid;\r\nfunction _HomePageLayout() {\r\n  const breakPoints = useBreakpoint();\r\n  const [newBooks, setNewBooks] = useState([]);\r\n  const [mostPopularBooks, setMostPopularBooks] = useState([]);\r\n  const [newBooksLoading, setNewBooksLoading] = useState(true);\r\n  const [mostPopularBooksLoading, setMostPopularBooksLoading] = useState(true);\r\n  const [Slide, setSlide] = useState([]);\r\n  const [loadingSlide, setLoadingSlide] = useState(true);\r\n  const [randomNumber, setRandomNumber] = useState(0);\r\n\r\n  useEffect(() => {\r\n    const fetchData = async () => {\r\n      await Promise.all([\r\n        books\r\n          .getNewBooks(1, 12)\r\n          .then((res) => {\r\n            setNewBooks(res);\r\n            setNewBooksLoading(false);\r\n          })\r\n          .catch((err) => {\r\n            openNotificationWithIcon(\"error\", \"Lấy sách mới thất bại\", err.message);\r\n          }),\r\n        books\r\n          .getMostPopularBooks(1, 12)\r\n          .then((res) => {\r\n            setMostPopularBooks(res);\r\n            setMostPopularBooksLoading(false);\r\n          })\r\n          .catch((err) => {\r\n            openNotificationWithIcon(\"error\", \"Lấy danh sách sách xem nhiều nhất thất bại\", err.message);\r\n          }),\r\n        banner\r\n          .readAll()\r\n          .then((res) => {\r\n            setSlide(res);\r\n            setRandomNumber(Math.floor(Math.random() * res.length));\r\n            setLoadingSlide(false);\r\n          })\r\n          .catch((err) => {\r\n            openNotificationWithIcon(\"error\", \"Lấy hình ảnh thất bại\", err?.response?.data?.message || err?.message);\r\n          })\r\n      ]);\r\n    };\r\n    fetchData();\r\n  }, []);\r\n\r\n  useEffect(() => {\r\n    document.title = \"Trang chủ\";\r\n  }, []);\r\n  const apiUrl = window._env_.REACT_APP_URl_SERVER_APIS;\r\n\r\n  return (\r\n    <Fragment>\r\n      <CarouselLanding />\r\n      <div className=\"homepage-content Container\">\r\n        <ProductsFrame especially=\"GetBookNew\" title=\"sách mới\" Arr={newBooks} loading={newBooksLoading} />\r\n      </div>\r\n\r\n      <Spin spinning={loadingSlide}>\r\n        <Image\r\n          src={`${apiUrl}/api/Book/GetFileImageSlide?fileNameId=${Slide[randomNumber]?.fileName}`}\r\n          alt=\"background\"\r\n          width=\"100%\"\r\n          style={{\r\n            objectFit: \"cover\",\r\n            height: breakPoints.xs ? 300 : 550,\r\n            marginTop: 40\r\n          }}\r\n          preview={false}\r\n        ></Image>\r\n      </Spin>\r\n\r\n      <div className=\"Container\">\r\n        <ProductsFrame\r\n          especially=\"GetBookByNumberView\"\r\n          title=\"Sách xem nhiều\"\r\n          Arr={mostPopularBooks}\r\n          loading={mostPopularBooksLoading}\r\n        />\r\n      </div>\r\n    </Fragment>\r\n  );\r\n}\r\n\r\nexport const HomePageLayout = WithErrorBoundaryCustom(_HomePageLayout);\r\n"],"names":["banner","readAll","axiosClient","_CarouselLanding","useState","listImage","setListImage","loading","setLoading","useEffect","then","res","catch","err","openNotificationWithIcon","response","data","message","className","CarouselLandingImage","useBreakpoint","Grid","apiUrl","window","_env_","REACT_APP_URl_SERVER_APIS","breakPoints","spinning","size","style","height","xs","autoPlaySpeed","autoPlay","map","item","index","followParallax","delay","id","key","value","bgPosition","type","backgroundImage","fileName","backgroundSize","backgroundPosition","objectFit","width","CarouselLangdingContent","title","content","description","direction","animation","y","opacity","level","textShadow","textTransform","color","fontWeight","fontSize","lg","md","sm","marginTop","CarouselLanding","React","Option","Select","_ProductCard","props","breakpoint","navigate","useNavigate","isModalVisible","setIsModalVisible","selectTypeReadBook","setSelectTypeReadBook","loadingColor","visible","onOk","document","onCancel","onChange","hoverable","cover","preview","onClick","state","alt","src","listAvatar","length","getImageFilterForSizeImage","actions","active","author","wordBreak","margin","contactAndIntroduction","col1","background","col","docName","overflow","Fragment","ProductCard","memo","_ProductsFrame","setLoadingColor","setcontactAndIntroduction","ContactAndIntroduction","finally","plain","borderTopColor","marginBottom","gutter","Array","pageSize","xl","translateY","Arr","isCategoryPage","Paginations","totalNumberProducts","handleOnChange","onShowSizeChange","pageIndex","e","especially","showQuickJumper","defaultCurrent","total","ProductsFrame","HomePageLayout","WithErrorBoundaryCustom","newBooks","setNewBooks","mostPopularBooks","setMostPopularBooks","newBooksLoading","setNewBooksLoading","mostPopularBooksLoading","setMostPopularBooksLoading","Slide","setSlide","loadingSlide","setLoadingSlide","randomNumber","setRandomNumber","fetchData","Promise","all","books","Math","floor","random"],"sourceRoot":""}