From 5195e706df67727b0dd46d60a0e85e6946b4a7b1 Mon Sep 17 00:00:00 2001 From: "sungmin.in" Date: Tue, 30 Jan 2024 18:15:42 +0900 Subject: [PATCH] =?UTF-8?q?[=ED=99=88=EB=B0=B0=EB=84=88]=20API=20=EC=A0=81?= =?UTF-8?q?=EC=9A=A9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../HomeBanner/HomeBannerTemplate1.jsx | 78 +++++++++++-------- .../src/views/HomePanel/HomePanel.jsx | 48 +++++------- .../src/views/HomePanel/HomeTemplate.jsx | 10 ++- 3 files changed, 70 insertions(+), 66 deletions(-) diff --git a/com.twin.app.shoptime/src/views/HomePanel/HomeBanner/HomeBannerTemplate1.jsx b/com.twin.app.shoptime/src/views/HomePanel/HomeBanner/HomeBannerTemplate1.jsx index 2b39cd86..4359baf7 100644 --- a/com.twin.app.shoptime/src/views/HomePanel/HomeBanner/HomeBannerTemplate1.jsx +++ b/com.twin.app.shoptime/src/views/HomePanel/HomeBanner/HomeBannerTemplate1.jsx @@ -8,11 +8,8 @@ import { shallowEqual, useDispatch, useSelector } from "react-redux"; import Spotlight from "@enact/spotlight"; import Marquee from "@enact/sandstone/Marquee"; import Spottable from "@enact/spotlight/Spottable"; - import CustomImage from "../../../components/CustomImage/CustomImage"; -import ViedoPlayer from "@enact/sandstone/VideoPlayer"; import css from "./Template.module.less"; -import { getAdDetailAMD, getHomeTerms } from "../../../api/homeApi"; import banner2 from "../../../../assets/Image/img-home-banner-h-02.png"; import banner3 from "../../../../assets/Image/img-home-banner-v-01.png"; @@ -27,20 +24,49 @@ const Container = SpotlightContainerDecorator( "div" ); -export default memo (function HomeBannerTemplate1 ( - {homeMainContentsBannerInfos, homeTopDisplayInfos, ...rest}) - { - // const {homeMainContentsBannerInfos, homeTopDisplayInfos } = props; - +export default memo (function HomeBannerTemplate1 ({isOnTop, spotlightId, onScrollTop, onScrollShelf, ...rest}) { + const dispatch = useDispatch(); + const homeMainContentsBannerInfos = useSelector((state) => state.home.mainContentsData.homeMainContentsBannerInfos); + const homeTopDisplayInfos = useSelector((state) => state.home.mainContentsData.homeTopDisplayInfos[0]); + + const [topImagePath, setTopImagePath] = useState(""); + const [verticalImage, setVerticalImage] = useState(""); const [bannerImageLoaded, setBannerImageLoaded] = useState(false); - useEffect(() => { - console.log(homeMainContentsBannerInfos, "1111"); - console.log(homeTopDisplayInfos, "2222"); - }, []); + // TOP IMAGE + const topImgPath = () => { + let imgPath = ""; - const onClickBanner = useCallback(() => { + if(homeTopDisplayInfos.wdthtpImgPath1 == "" || homeTopDisplayInfos.wdthtpImgPath1 == null){ + imgPath = homeTopDisplayInfos.wdthtpImgPath2; + }else{ + imgPath = homeTopDisplayInfos.wdthtpImgPath1; + } + + setTopImagePath(imgPath); + }; + + // VerticalImage + const vtctpImage = () => { + let imgPath = ""; + + if(homeTopDisplayInfos.vtctpImgPath1 == "" || homeTopDisplayInfos.vtctpImgPath1 == null){ + imgPath = homeTopDisplayInfos.vtctpImgPath2; + }else{ + imgPath = homeTopDisplayInfos.vtctpImgPath1; + } + + setVerticalImage(imgPath); + }; + + useEffect(() => { + topImgPath(); + vtctpImage(); + + }, [homeMainContentsBannerInfos, homeTopDisplayInfos]); + + const onClickBanner = useCallback(() => { }, []); @@ -52,24 +78,16 @@ export default memo (function HomeBannerTemplate1 ( delay={0} onClickBanner={onClickBanner} onImageLoaded={setBannerImageLoaded} - src={ - banner2 - ? banner2 - : "../../../../assets/Image/img-home-banner-h-02.png" - } + src={topImagePath} hide={""} /> - + @@ -80,11 +98,7 @@ export default memo (function HomeBannerTemplate1 ( delay={0} onClickBanner={onClickBanner} onImageLoaded={setBannerImageLoaded} - src={ - banner3 - ? banner3 - : "../../../../assets/Image/img-home-banner-v-01.png" - } + src={verticalImage} hide={""} /> diff --git a/com.twin.app.shoptime/src/views/HomePanel/HomePanel.jsx b/com.twin.app.shoptime/src/views/HomePanel/HomePanel.jsx index 7ed27680..9263fcaa 100644 --- a/com.twin.app.shoptime/src/views/HomePanel/HomePanel.jsx +++ b/com.twin.app.shoptime/src/views/HomePanel/HomePanel.jsx @@ -10,60 +10,52 @@ import css from "../HomePanel/HomePanel.module.less"; import HomeTemplate from "./HomeTemplate"; import OnSale from "../HomePanel/OnSale/OnSale"; import SubCategory from "../HomePanel/SubCategory/SubCategory"; -import PopularShow from "../HomePanel/PopularShow/PopularShow"; -import BestSeller from "../HomePanel/BestSeller/BestSeller"; export default function HomePanel() { const dispatch = useDispatch(); - + const latoutData = useSelector((state) => state.home.layoutData); - const homeMainContentsBannerInfos = useSelector( - (state) => state.home.mainContentsData.homeMainContentsBannerInfos - ); - const homeTopDisplayInfos = useSelector( - (state) => state.home.mainContentsData.homeTopDisplayInfos - ); + const homeMainContentsBannerInfos = useSelector((state) => state.home.mainContentsData.homeMainContentsBannerInfos); + const homeTopDisplayInfos = useSelector((state) => state.home.mainContentsData.homeTopDisplayInfos); const [selectTemplate, setSelectTemplate] = useState(null); const getHomeLayout = () => { - console.log("레이아웃"); - }; + + } - const getHomeContents = () => { + const getHomeContents = () => { // 추후 다시 한번 확인: 코드(DSP00201, 202, 203) // 템플릿 선택 let tempTemplate = 0; - if (homeMainContentsBannerInfos) { - if (homeMainContentsBannerInfos[0].shptmTmplCd == "DSP00201") { + if(homeTopDisplayInfos){ + if(homeTopDisplayInfos[0].shptmTmplCd == "DSP00201"){ tempTemplate = 1; } - if (homeMainContentsBannerInfos[0].shptmTmplCd == "DSP00202") { + if(homeTopDisplayInfos[0].shptmTmplCd == "DSP00202"){ tempTemplate = 2; } - if (homeMainContentsBannerInfos[0].shptmTmplCd == "DSP00203") { + if(homeTopDisplayInfos[0].shptmTmplCd == "DSP00203"){ tempTemplate = 3; } - } - setSelectTemplate(tempTemplate); - }; + } + setSelectTemplate(tempTemplate); + } - useEffect(() => { + useEffect(()=>{ getHomeLayout(); getHomeContents(); - }, []); - + },[]) + return ( - - - ); -} +} \ No newline at end of file diff --git a/com.twin.app.shoptime/src/views/HomePanel/HomeTemplate.jsx b/com.twin.app.shoptime/src/views/HomePanel/HomeTemplate.jsx index 84379151..77140428 100644 --- a/com.twin.app.shoptime/src/views/HomePanel/HomeTemplate.jsx +++ b/com.twin.app.shoptime/src/views/HomePanel/HomeTemplate.jsx @@ -4,8 +4,8 @@ import HomeBannerTemplate1 from "../HomePanel/HomeBanner/HomeBannerTemplate1"; import HomeBannerTemplate2 from "../HomePanel/HomeBanner/HomeBannerTemplate2"; import HomeBannerTemplate3 from "../HomePanel/HomeBanner/HomeBannerTemplate3"; -export default memo (function HomeTemplate(props) { - const {selectTemplate, homeMainContentsBannerInfos, homeTopDisplayInfos} = props; +export default memo (function HomeTemplate({isOnTop, spotlightId, onScrollTop, onScrollShelf, selectTemplate, ...rest}) { + let SelectedTemplate = null; @@ -23,8 +23,10 @@ export default memo (function HomeTemplate(props) { return SelectedTemplate ? ( ) : null; })